:root{--hue-accent: #c98bff}.game{min-height:100svh;max-width:560px;margin:0 auto;padding:1.25rem 1.25rem 4rem}.game__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.game__home img{width:min(40vw,150px);height:auto}.hue{text-align:center}.hue__title{font-size:clamp(1.8rem,6vw,2.6rem);letter-spacing:.06em;text-transform:uppercase}.hue__sub{color:var(--muted);margin:.4rem 0 1rem;font-size:.92rem}.admin-bar{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:.75rem;font-size:.8rem;color:var(--muted)}.btn-sm{display:inline-block;padding:.3rem .7rem;border-radius:7px;border:1px solid rgba(237,28,36,.45);background:#ed1c241f;color:var(--text);font:inherit;font-size:.78rem;font-weight:600;cursor:pointer;text-decoration:none}.btn-sm:hover{background:#ed1c2438}.hue__stage{position:relative;width:min(280px,70vw);aspect-ratio:1;margin:.25rem auto .75rem;border-radius:16px;overflow:hidden;border:1px solid #33384a}.hue__swatch{width:100%;height:100%;display:block;image-rendering:pixelated}.hue__cover{position:absolute;inset:0;display:grid;place-content:center;gap:.3rem;background:repeating-conic-gradient(#23252e 0 25%,#2b2d37 0 50%) 50% / 28px 28px;color:var(--muted);transition:opacity .25s ease}.hue__cover small{font-size:.78rem}.hue__q{font-size:2.6rem;font-weight:800;line-height:1;color:#4a4d5c}.hue__stage.is-revealed .hue__cover{opacity:0;pointer-events:none}.hue__peek{display:inline-flex;align-items:center;gap:.4rem;margin:0 auto 1.1rem;padding:.55rem 1.2rem;border:1px solid color-mix(in srgb,var(--hue-accent) 55%,transparent);border-radius:999px;background:color-mix(in srgb,var(--hue-accent) 14%,transparent);color:var(--text);font:inherit;font-weight:700;cursor:pointer}.hue__peek:hover{background:color-mix(in srgb,var(--hue-accent) 24%,transparent)}.hue__peek:disabled{opacity:.5;cursor:default}.picker{width:min(320px,88vw);margin:0 auto .75rem}.picker__sv{position:relative;width:100%;aspect-ratio:3 / 2;border-radius:12px;cursor:crosshair;touch-action:none;background-image:linear-gradient(to top,#000,#0000),linear-gradient(to right,#fff,#fff0);background-color:red}.picker__sv-handle{position:absolute;top:0;left:0;width:20px;height:20px;transform:translate(-50%,-50%);border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #00000080,0 1px 6px #0009;pointer-events:none}.picker__hue{display:flex;align-items:center;gap:.6rem;margin:.9rem 0 .4rem}.picker__hue-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}#hue-slider{flex:1;height:14px;border-radius:7px;-webkit-appearance:none;appearance:none;background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}#hue-slider::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid #333;cursor:pointer}#hue-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid #333;cursor:pointer}.picker__current{display:flex;align-items:center;justify-content:center;gap:.6rem;margin-top:.6rem}.picker__chip{width:34px;height:34px;border-radius:8px;border:1px solid #444;background:#000}.picker__hex{font-variant-numeric:tabular-nums;font-weight:800;font-size:1.05rem;text-transform:uppercase}.hue__feedback{min-height:1.4em;font-weight:700;font-size:1rem;margin-bottom:.5rem}.hue__feedback .is-good{color:#5fb236}.hue__feedback .is-mid{color:#e8c14b}.hue__feedback .is-far{color:#ff6b6b}.hue__pips{display:flex;justify-content:center;gap:.5rem;margin-bottom:1rem}.hue__pip{width:12px;height:12px;border-radius:50%;border:2px solid #565a6b}.hue__pip.is-used{background:var(--hue-accent);border-color:var(--hue-accent)}.hue__lock{min-width:220px}.toast{position:fixed;top:14%;left:50%;transform:translate(-50%);background:#f4f4f6;color:#111;padding:.6rem 1.1rem;border-radius:8px;font-weight:700;font-size:.9rem;box-shadow:0 8px 30px #00000080;transition:opacity .3s ease;z-index:20;pointer-events:none}.toast.fade{opacity:0}.result{margin:.5rem auto 1.5rem}.result__score{font-size:1.5rem;font-weight:800;margin-bottom:.6rem}.result__compare{display:flex;justify-content:center;gap:0;margin-bottom:.8rem}.result__compare>div{width:90px;height:64px;display:grid;place-items:end center;padding-bottom:4px;font-size:.7rem;font-weight:700;color:#000000a6}.result__compare>div:first-child{border-radius:10px 0 0 10px}.result__compare>div:last-child{border-radius:0 10px 10px 0}.result__answer{color:var(--muted);margin-bottom:1rem;font-size:.95rem}.result__answer b{color:var(--text);font-variant-numeric:tabular-nums;text-transform:uppercase}.share-grid{font-family:inherit;line-height:1.2;margin:.25rem 0 1.1rem;font-size:1.1rem}.result__actions{display:flex;gap:.6rem;max-width:360px;margin:0 auto}.result__actions .btn{flex:1;text-align:center}.result__save{margin-top:.9rem;font-size:.85rem;color:var(--muted)}.result__save a{color:var(--text)}.wstats{margin:.5rem auto 1.1rem;max-width:360px}.wstats__nums{display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem}.wstats__nums div{display:flex;flex-direction:column}.wstats__nums b{font-size:1.5rem;font-weight:800;line-height:1.1}.wstats__nums span{font-size:.68rem;color:var(--muted)}.hue__msg{margin-top:1rem;min-height:1.2em;color:#ff6b6b;font-size:.88rem}