.gp .cp-dock{position:fixed;left:16px;bottom:16px;z-index:89;display:flex;flex-wrap:wrap;gap:8px;max-width:calc(100% - 32px)}
.gp .cp-toggle{display:inline-flex;align-items:center;gap:8px;font:600 13px/1 'Inter',system-ui,sans-serif;background:#18212c;color:#fff;border:1px solid #3b4859;border-radius:6px;padding:12px 16px;min-height:44px;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.3)}
.gp .cp-toggle .i{width:18px;height:18px}
.gp .cp-toggle:hover{background:#283342}
.gp .cp-toggle:focus-visible{outline:3px solid #7cb8ff;outline-offset:2px}
.gp .cp-toggle[aria-expanded="true"]{background:#2f3d50;border-color:#5b6b80}
.gp .cp{position:fixed;top:0;right:0;bottom:0;z-index:90;width:380px;max-width:100vw;box-sizing:border-box;overflow:auto;overscroll-behavior:contain;background:#18212c;color:#e8edf3;font:500 13px/1.35 'Inter',system-ui,sans-serif;text-align:left;box-shadow:-12px 0 40px rgba(0,0,0,.35);padding:0 18px 24px}
.gp .cp[hidden]{display:none}
.gp .cp *{box-sizing:border-box}
.gp .cp-h{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:16px 0 12px;background:#18212c;border-bottom:1px solid #2c3949;font-size:15px}
.gp .cp-h b{font-weight:700;color:#fff}
.gp .cp-x{font:inherit;font-size:22px;line-height:1;width:44px;height:44px;border:0;border-radius:6px;background:#283342;color:#fff;cursor:pointer}
.gp .cp-x:hover{background:#334155}
.gp .cp-s{padding:14px 0;border-bottom:1px solid #2c3949;display:flex;flex-direction:column;gap:8px;margin:0}
.gp .cp-2{flex-direction:row;gap:18px;flex-wrap:wrap}
.gp .cp-2>div{display:flex;flex-direction:column;gap:8px}
.gp .cp-l{font-size:12px;font-weight:600;color:#93a1b3;text-transform:uppercase;letter-spacing:.04em}
.gp .cp-n{font-size:12px;color:#8a99ab;margin:-4px 0 0}
.gp .cp-l2{font-size:12px;color:#93a1b3;margin-top:6px}
.gp .cp-state{align-self:flex-start;font-size:12px;font-weight:700;border-radius:4px;padding:4px 8px;background:#283342;color:#e8edf3}
.gp .cp-state.on{background:#ffd166;color:#14212f}
.gp .cp-intro .cp-n{margin:0}
.gp .cp .seg{display:inline-flex;flex-wrap:wrap;align-self:flex-start;background:#283342;border-radius:8px;padding:3px;gap:2px}
.gp .cp .seg button,.gp .cp .tbtn{font:inherit;border:0;background:transparent;color:#d5dde6;padding:8px 12px;border-radius:6px;cursor:pointer;min-height:36px;text-align:center}
.gp .cp .tbtn{border:1px solid #3b4859}
.gp .cp .seg button:hover,.gp .cp .tbtn:hover{color:#fff;background:#334155}
.gp .cp .seg button.on{background:#fff;color:#14212f}
.gp .cp-sw{display:flex;gap:8px;flex-wrap:wrap}
.gp .cp-swb{width:40px;height:40px;border-radius:8px;border:2px solid transparent;background:#283342;padding:5px;cursor:pointer}
.gp .cp-swb.on{border-color:#fff}
.gp .cp-dot{display:block;width:100%;height:100%;border-radius:4px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}
.gp .d-cust{background:conic-gradient(#e53935,#fdd835,#43a047,#1e88e5,#8e24aa,#e53935)}
.gp .d-blue{background:#0f4c81}
.gp .d-navy{background:#1f3a8a}
.gp .d-teal{background:#0b6f7a}
.gp .d-green{background:#1c6b3d}
.gp .d-bordo{background:#8c1d2c}
.gp .d-graphite{background:#2f3a48}
.gp .cp-own{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.gp .cp-own-l{font-size:12px;color:#93a1b3}
.gp .cp-col{width:44px;height:36px;padding:2px;border:1px solid #3a4a5e;border-radius:6px;background:#202b38;cursor:pointer}
.gp .cp-hex{width:96px;height:36px;font:12.5px ui-monospace,Menlo,monospace;color:#e8edf3;background:#0f151d;border:1px solid #3a4a5e;border-radius:6px;padding:0 8px;text-transform:uppercase}
.gp .cp-tokens{margin:0}
.gp .cp-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.gp .cp-it{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;background:#202b38;border-radius:6px;padding:4px 6px 4px 10px;margin:0}
.gp .cp-it::before{display:none}
.gp .cp-chk{flex:1;min-width:0;min-height:36px;display:flex;align-items:center;gap:10px;font:inherit;color:#e8edf3;background:transparent;border:0;cursor:pointer;text-align:left;padding:6px 0}
.gp .cp-it.off .cp-chk{color:#b6c1ce}
.gp .cp-box{flex:none;width:18px;height:18px;border-radius:4px;border:2px solid #8a99ab;display:grid;place-items:center}
.gp .cp-chk[aria-pressed="true"] .cp-box{background:#4c9aff;border-color:#4c9aff}
.gp .cp-chk[aria-pressed="true"] .cp-box::after{content:"";width:8px;height:5px;border:2px solid #fff;border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.gp .cp-ab{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.gp .cp-code{width:100%;font:12px/1.4 ui-monospace,Menlo,monospace;background:#0f151d;color:#d5dde6;border:1px solid #3a4a5e;border-radius:6px;padding:8px;resize:vertical;word-break:break-all;margin:0}
.gp .cp-rn{display:block;font-size:12px;color:#d5dde6;margin:2px 0 0}
.gp .cp-warn{color:#ffd166}
.gp .cp-status:empty{display:none}
.gp .cp-status.err{color:#ffb4a8}
.gp .cp-f{padding-top:16px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.gp .cp-hint{margin:0}
.gp .cp button:focus-visible,.gp .cp input:focus-visible,.gp .cp textarea:focus-visible{outline:3px solid #7cb8ff;outline-offset:1px}
.gp.hc .cp-toggle,.gp.hc .cp,.gp.hc .cp-h{background:#000;color:#fff;border-color:#fff}
.gp.hc .cp{border-left:2px solid #fff}
.gp.hc .cp-l,.gp.hc .cp-n,.gp.hc .cp-l2,.gp.hc .cp-own-l,.gp.hc .cp-rn,.gp.hc .cp-it.off .cp-chk{color:#fff}
.gp.hc .cp .seg,.gp.hc .cp-it,.gp.hc .cp-swb,.gp.hc .cp-x,.gp.hc .cp-state{background:#000;color:#fff;border:1px solid #fff}
.gp.hc .cp .seg button,.gp.hc .cp .tbtn{color:#fff;border:1px solid transparent}
.gp.hc .cp .tbtn{border-color:#fff}
.gp.hc .cp .seg button.on,.gp.hc .cp-state.on{background:#fff;color:#000;text-decoration:underline}
.gp.hc .cp .seg button:hover,.gp.hc .cp .tbtn:hover{background:#fff;color:#000}
.gp.hc .cp-swb.on{box-shadow:0 0 0 3px #fff}
.gp.hc .cp-code,.gp.hc .cp-hex{background:#000;color:#fff;border-color:#fff}
.gp.hc .cp button:focus-visible,.gp.hc .cp input:focus-visible,.gp.hc .cp textarea:focus-visible,.gp.hc .cp-toggle:focus-visible{outline:3px solid #ff0;outline-offset:2px}
@media (max-width:600px){
.gp .cp{top:auto;left:0;width:auto;max-height:78vh;height:78vh;border-radius:12px 12px 0 0;box-shadow:0 -12px 40px rgba(0,0,0,.35);padding:0 16px 20px}
.gp .cp-dock{left:12px;bottom:12px;max-width:calc(100% - 24px)}
.gp .cp-toggle{padding:10px 12px}
}
@media print{
.gp .cp,.gp .cp-dock{display:none !important}
}
.gp .cp-toggle.cp-icon{width:44px;padding:0;justify-content:center}
.gp .cp-toggle.cp-icon .i{width:20px;height:20px}
.gp .cp-toggle.cp-icon{width:48px;height:48px;border-radius:6px}
@container page (max-width:760px){.gp .cp-toggle.cp-icon{width:44px;height:44px}}
.gp .cp-dock{left:20px;bottom:20px}
@container page (max-width:760px){.gp .cp-dock{left:12px;bottom:12px}}
.gp .cp-dock{flex-direction:column;flex-wrap:nowrap}
.gp .cp-about{width:min(440px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;padding:22px 24px 24px;border:0;border-radius:8px;background:#fff;color:#14212f;box-shadow:0 24px 60px rgba(7,25,45,.35);font-size:14.5px;line-height:1.55}
.gp .cp-about::backdrop{background:rgba(7,20,35,.55)}
.gp .cp-about p{margin:0 0 10px}
.gp .cp-about a{color:#0f4c81}
.gp .cp-about-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.gp .cp-about-h b{font-size:18px;line-height:1.3}
.gp .cp-about .cp-x{flex:none;width:36px;height:36px;display:grid;place-items:center;padding:0;border:1px solid #dbe2ea;border-radius:6px;background:#f3f6f9;color:#14212f;font-size:22px;line-height:1;cursor:pointer}
.gp .cp-about .cp-x:hover{border-color:#2f3d50}
.gp .cp-about-cta{margin-top:16px;padding-top:16px;border-top:1px solid #dbe2ea}
.gp .cp-about-a{display:flex;flex-wrap:wrap;gap:10px}
.gp .cp-about-a a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:6px;font-weight:700;text-decoration:none}
.gp .cp-about a.cp-about-wa{background:#1f7a3f;color:#fff}
.gp .cp-about a.cp-about-wa:hover{background:#17602f;color:#fff}
.gp .cp-about a.cp-about-tel{border:1px solid #dbe2ea;color:#14212f}
.gp .cp-about a.cp-about-tel:hover{border-color:#2f3d50}
.gp .cp-about-a .soc-i{width:20px;height:20px;fill:currentColor;stroke:none}
.gp .cp-about-a .i{width:18px;height:18px}
.gp .cp-about a:focus-visible,.gp .cp-about button:focus-visible{outline:2px solid #1f7ae0;outline-offset:2px}
.gp.hc .cp-about{border:2px solid #000}
.gp.hc .cp-about a.cp-about-wa{background:#000;color:#fff}
@media print{.gp .cp-about{display:none !important}}
.gp .cp-about-a{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.gp .cp-about-a a{justify-content:center;padding:0 12px;white-space:nowrap;font-size:14px}
@media (max-width:400px){
 .gp .cp-about{padding:18px 16px 20px}
 .gp .cp-about-a{gap:8px}
 .gp .cp-about-a a{padding:0 8px;font-size:13px;gap:6px}
 .gp .cp-about-a .i,.gp .cp-about-a .soc-i{width:16px;height:16px}
}
@media (max-width:340px){
 .gp .cp-about-a .i{display:none}
}