.palette-trigger{display:inline-flex;align-items:center;gap:8px;background:none;border:1px solid #dce3e9;border-radius:4px;padding:5px 9px;font-size:var(--text-small);color:inherit;cursor:pointer}.palette-trigger:hover{border-color:#285cff}.palette kbd,.palette-trigger kbd{font-family:var(--font-mono,ui-monospace,SFMono-Regular,Menlo,monospace);font-size:var(--text-small);border:1px solid #dce3e9;border-radius:3px;padding:0 5px}.palette-backdrop{position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-start;justify-content:center;padding:14vh 16px 16px;background:rgba(11,23,48,.45)}.palette{width:min(560px,100%);background:#f6f8f2;color:#0b1730;border:1px solid #dce3e9;border-radius:6px;padding:20px}.palette-label{display:block;margin-bottom:8px;font-size:var(--text-small);font-family:var(--font-mono,ui-monospace,monospace)}.palette input[type=search]{width:100%;box-sizing:border-box;border:0;border-bottom:1px solid #0b1730;background:transparent;padding:8px 2px;font-size:18px;color:inherit}.palette input[type=search]:focus-visible,.palette-foot button:focus-visible,.palette-trigger:focus-visible{outline:2px solid #285cff;outline-offset:2px}.palette-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;font-size:var(--text-small)}.palette-foot button{background:none;border:0;padding:4px 0;color:#285cff;font-weight:600;cursor:pointer}@media (max-width:900px){.palette-trigger{display:none}}