*,:before,:after{box-sizing:border-box}:root{--bg:#0f1115;--surface:#1a1d24;--surface-2:#242831;--border:#2e323c;--text:#e8eaed;--text-dim:#9ba1ad;--accent:#4f9eff;--accent-hover:#3b8ff5;--danger:#ef4444;--success:#22c55e;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,Pretendard,Apple SD Gothic Neo,Segoe UI,Roboto,sans-serif}html,body,#root{min-height:100vh;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-size:16px;line-height:1.5}button{cursor:pointer;color:inherit;background:0 0;border:none;font-family:inherit}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}a{color:var(--accent)}.app{flex-direction:column;min-height:100vh;display:flex}.topbar{background:var(--surface);border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:16px;padding:14px 20px;display:flex}.topbar h1{letter-spacing:-.01em;margin:0;font-size:18px}.hint{color:var(--text-dim);flex:1;font-size:13px}.hint kbd{background:var(--surface-2);border:1px solid var(--border);color:var(--text);border-radius:4px;padding:2px 6px;font-family:ui-monospace,Consolas,monospace;font-size:12px;display:inline-block}.refresh-btn{background:var(--accent);color:#fff;border-radius:8px;padding:8px 18px;font-size:14px;font-weight:600;transition:background .15s}.refresh-btn:hover{background:var(--accent-hover)}.palette{flex:1;min-height:0;display:flex}.swatch{flex-direction:column;flex:1;justify-content:flex-end;align-items:center;min-height:280px;padding:24px 12px 36px;transition:flex .2s;display:flex;position:relative}.swatch.dark{color:#ffffffeb}.swatch.light{color:#000000c7}.lock-btn{opacity:.7;background:0 0;padding:4px;font-size:22px;line-height:1;transition:opacity .15s,transform .1s;position:absolute;top:16px;right:16px}.lock-btn:hover{opacity:1}.lock-btn:active{transform:scale(.9)}.hex-label{letter-spacing:.05em;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:inherit;text-align:center;background:#ffffff26;border-radius:8px;min-width:120px;padding:8px 16px;font-family:ui-monospace,Consolas,monospace;font-size:18px;font-weight:700;transition:background .15s,transform .1s}.swatch.light .hex-label{background:#00000014}.hex-label:hover{background:#ffffff40}.swatch.light .hex-label:hover{background:#00000026}.hex-label:active{transform:scale(.97)}@media (width<=720px){.palette{flex-direction:column}.swatch{flex-direction:row;justify-content:space-between;align-items:center;min-height:0;padding:16px}.lock-btn{order:2;position:static}.hex-label{text-align:left;order:1;min-width:100px;font-size:16px}.topbar h1{font-size:16px}.hint{flex:0 0 100%;order:3}}