.pickr{position:relative}.pickr .pcr-button{width:36px;height:28px;padding:0;border-radius:4px;border:1px solid rgba(0,255,247,.3);background:var(--color-bg-secondary);cursor:pointer;transition:all .2s ease;overflow:visible;position:relative}.pickr .pcr-button:before{content:"";position:absolute;inset:3px;border-radius:2px;background:var(--pcr-color, currentColor);z-index:1}.pickr .pcr-button:after{content:"";position:absolute;inset:3px;border-radius:2px;background:linear-gradient(45deg,#1a1a1a 25%,transparent 25%),linear-gradient(-45deg,#1a1a1a 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#1a1a1a 75%),linear-gradient(-45deg,transparent 75%,#1a1a1a 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0;z-index:0}.pickr .pcr-button:hover{border-color:var(--color-neon-cyan);box-shadow:0 0 10px #00fff74d}.pickr .pcr-button:focus{outline:none;border-color:var(--color-neon-cyan);box-shadow:0 0 0 2px #00fff733}.pcr-app{position:fixed;display:flex;flex-direction:column;z-index:10000;font-family:var(--font-mono),"Fira Code","SF Mono",monospace;background:var(--color-bg-terminal, #07070a);border:1px solid var(--color-neon-cyan, #00fff7);border-radius:8px;box-shadow:0 0 20px #00fff733,0 10px 40px #0009;overflow:hidden;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}.pcr-app.visible{opacity:1;visibility:visible}.pcr-app .pcr-selection{display:flex;flex-direction:column;gap:10px;padding:12px}.pcr-app .pcr-color-palette{position:relative;width:200px;height:120px;border-radius:4px;border:1px solid rgba(0,255,247,.2);overflow:visible;cursor:crosshair}.pcr-app .pcr-color-palette .pcr-palette{width:100%;height:100%;border-radius:3px}.pcr-app .pcr-color-palette .pcr-picker{position:absolute!important;width:14px;height:14px;border:2px solid #fff;border-radius:50%;background:transparent;box-shadow:0 0 4px #00000080,0 0 8px #00fff74d;transform:translate(-50%,-50%)}.pcr-app .pcr-color-preview{display:flex;align-items:center;gap:8px}.pcr-app .pcr-color-preview .pcr-last-color,.pcr-app .pcr-color-preview .pcr-current-color{width:24px;height:24px;border-radius:4px;border:1px solid rgba(0,255,247,.3);cursor:pointer;transition:border-color .2s ease;background-color:var(--pcr-color)!important}.pcr-app .pcr-color-preview .pcr-last-color:hover,.pcr-app .pcr-color-preview .pcr-current-color:hover{border-color:var(--color-neon-cyan)}.pcr-app .pcr-color-chooser,.pcr-app .pcr-color-opacity{width:200px;height:16px;border-radius:8px;border:1px solid rgba(0,255,247,.2);overflow:visible;cursor:pointer;position:relative}.pcr-app .pcr-color-opacity{display:none}.pcr-app .pcr-color-chooser .pcr-slider{width:100%;height:100%;border-radius:7px;background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)!important}.pcr-app .pcr-color-opacity .pcr-slider{width:100%;height:100%;border-radius:7px}.pcr-app .pcr-color-chooser .pcr-picker,.pcr-app .pcr-color-opacity .pcr-picker{position:absolute!important;width:8px!important;height:20px!important;border:2px solid #fff;border-radius:4px;background:transparent;box-shadow:0 0 4px #00000080,0 0 6px #00fff74d;top:50%!important;transform:translate(-50%,-50%)!important}.pcr-app .pcr-interaction{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px;border-top:1px solid rgba(0,255,247,.15);background:#0003}.pcr-app .pcr-interaction input.pcr-result{flex:1;min-width:0;padding:6px 10px;background:var(--color-bg-secondary, #12121a);border:1px solid rgba(0,255,247,.2);border-radius:4px;color:var(--color-text-primary, #e0e0e0);font-family:var(--font-mono),monospace;font-size:11px;letter-spacing:.5px;text-transform:uppercase;transition:all .2s ease}.pcr-app .pcr-interaction input.pcr-result:focus{outline:none;border-color:var(--color-neon-cyan);box-shadow:0 0 8px #00fff733}.pcr-app .pcr-interaction .pcr-type{display:none}.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear{padding:6px 12px;background:#00fff71a;border:1px solid var(--color-neon-cyan, #00fff7);border-radius:4px;color:var(--color-neon-cyan, #00fff7);font-family:var(--font-mono),monospace;font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:all .2s ease}.pcr-app .pcr-interaction .pcr-save:hover,.pcr-app .pcr-interaction .pcr-cancel:hover,.pcr-app .pcr-interaction .pcr-clear:hover{background:#00fff733;box-shadow:0 0 10px #00fff74d}.pcr-app .pcr-interaction .pcr-save{background:var(--color-neon-cyan, #00fff7);color:var(--color-bg-primary, #0a0a0f)}.pcr-app .pcr-interaction .pcr-save:hover{background:var(--color-neon-green, #39ff14);border-color:var(--color-neon-green, #39ff14)}.pcr-app .pcr-interaction .pcr-cancel{border-color:#00fff74d;color:var(--color-text-muted, #6b7280);background:transparent}.pcr-app .pcr-interaction .pcr-cancel:hover{border-color:var(--color-neon-magenta);color:var(--color-neon-magenta)}.pcr-app .pcr-swatches{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px;border-top:1px solid rgba(0,255,247,.15)}.pcr-app .pcr-swatches>button{width:20px;height:20px;border-radius:4px;border:1px solid rgba(0,255,247,.2);cursor:pointer;transition:all .2s ease}.pcr-app .pcr-swatches>button:hover{border-color:var(--color-neon-cyan);transform:scale(1.1);box-shadow:0 0 8px #00fff74d}@media(max-width:768px){.pcr-app .pcr-color-palette{width:160px;height:100px}.pcr-app .pcr-selection{padding:10px;gap:8px}.pcr-app .pcr-interaction{padding:8px 10px}}