.cp-native{display:none!important}.cp-trigger{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:40px;height:38px;padding:0;border:1px solid var(--bi-border);border-radius:6px;background:var(--bi-surface);cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease}.cp-trigger:hover,.cp-trigger:focus-visible{border-color:var(--brand);box-shadow:0 0 0 3px rgba(var(--brand-rgb),.15);outline:none}.cp-trigger.w-100{width:100%;justify-content:flex-start;padding:0 10px}.cp-swatch{display:block;width:22px;height:22px;flex:0 0 auto;border-radius:5px;box-shadow:inset 0 0 0 1px #0f172a26}.cp-hex-text{display:none;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;color:var(--bi-text);letter-spacing:.02em}.cp-trigger.w-100 .cp-hex-text{display:inline}.cp-popover{position:fixed;z-index:2100;width:268px;padding:12px;border:1px solid var(--bi-border);border-radius:12px;background:var(--bi-surface);color:var(--bi-text);box-shadow:0 16px 40px #0f172a2e;visibility:hidden;opacity:0;transform:translateY(-6px);transition:opacity .16s ease,transform .16s ease,visibility .16s}.cp-popover.cp-open{visibility:visible;opacity:1;transform:translateY(0)}.cp-sv{position:relative;height:150px;border-radius:8px;overflow:hidden;cursor:crosshair;touch-action:none;background:red}.cp-sv-white{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to right,#fff,#fff0);pointer-events:none}.cp-sv-black{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,#000,#0000);pointer-events:none}.cp-sv-cursor{position:absolute;width:14px;height:14px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #00000059,0 2px 6px #00000040;transform:translate(-50%,-50%);pointer-events:none}.cp-hue{position:relative;height:14px;margin:14px 0 12px;border-radius:7px;cursor:pointer;touch-action:none;background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}.cp-hue-cursor{position:absolute;top:50%;width:16px;height:16px;border:2px solid #fff;border-radius:50%;background:transparent;box-shadow:0 0 0 1px #0000004d,0 2px 6px #00000040;transform:translate(-50%,-50%);pointer-events:none}.cp-row{display:flex;align-items:center;gap:8px}.cp-preview{width:30px;height:30px;flex:0 0 auto;border:1px solid var(--bi-border);border-radius:6px;box-shadow:inset 0 0 0 1px #ffffff59}.cp-hex-input{flex:1 1 auto;min-width:0;height:32px;padding:0 8px;border:1px solid var(--bi-border);border-radius:6px;background:var(--bi-surface);color:var(--bi-text);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;text-transform:uppercase}.cp-hex-input:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(var(--brand-rgb),.15);outline:none}.cp-eyedropper{width:32px;height:32px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--bi-border);border-radius:6px;background:var(--bi-surface);color:var(--bi-text-muted);cursor:pointer;transition:color .15s ease,border-color .15s ease}.cp-eyedropper:hover{color:var(--brand);border-color:var(--brand)}.cp-section{margin-top:12px;font-size:12px;font-weight:600;color:var(--bi-text-muted)}.cp-swatches{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;margin-top:6px}.cp-swatch-btn{width:100%;aspect-ratio:1 / 1;padding:0;border:1px solid rgba(15,23,42,.12);border-radius:5px;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}.cp-swatch-btn:hover{transform:scale(1.12);box-shadow:0 2px 8px #0f172a33}.cp-recent-block.d-none{display:none}