:root{--bg:#09080f;--panel:#0d0b14;--ink:#f3f0f8;--muted:#81798f;--line:rgba(255,255,255,.13);--purple:#ae8cff}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg)}body{color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,sans-serif;background:radial-gradient(circle at 50% 0,rgba(105,72,170,.19),transparent 35rem),#09080f}.back{position:fixed;z-index:20;left:16px;top:14px;color:#aaa3b9;text-decoration:none;border:1px solid rgba(255,255,255,.15);padding:7px 9px;font:700 9px ui-monospace,monospace;letter-spacing:.12em;background:rgba(9,8,15,.78);backdrop-filter:blur(8px)}main{width:min(1000px,calc(100% - 32px));margin:0 auto;padding:46px 0 24px}header{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:24px;margin:12px 0 18px}header>span,small,.kicker{color:var(--muted);font:700 9px ui-monospace,monospace;letter-spacing:.15em}h1{margin:0;white-space:nowrap;font-size:clamp(38px,6vw,68px);line-height:.8;letter-spacing:-.075em;font-weight:300}h1 b{color:var(--purple);font-weight:850}.readouts{justify-self:end;display:flex;gap:24px;text-align:right}.readouts div{display:grid;gap:4px}.readouts strong{font:700 17px ui-monospace,monospace}.readouts div:last-child strong{color:var(--purple)}.machine{position:relative;min-height:min(67vh,650px);height:650px;max-height:calc(100svh - 180px);overflow:hidden;border:1px solid var(--line);background:linear-gradient(135deg,rgba(174,140,255,.035),transparent 45%),var(--panel);box-shadow:0 30px 80px rgba(0,0,0,.4)}.screen{position:absolute;inset:0;display:none;padding:clamp(26px,5vw,56px)}.screen.active{display:flex}.menu-copy{align-self:center;width:38%;padding-right:30px}.kicker{margin:0 0 15px;color:var(--purple)}h2{margin:0;font-size:clamp(40px,6vw,68px);font-weight:350;letter-spacing:-.07em;line-height:.88}h2 em{color:var(--purple);font-style:normal;font-weight:800}.menu-copy>p:last-child{max-width:310px;color:#918a9f;font-size:14px;line-height:1.55}.difficulty{width:56%;margin-left:auto;align-self:center;display:grid;gap:9px}.difficulty-card{position:relative;display:grid;grid-template-columns:44px 1fr auto;align-items:center;text-align:left;min-height:72px;padding:13px 18px;border:1px solid var(--line);background:rgba(255,255,255,.018);color:var(--ink);cursor:pointer;transition:.18s}.difficulty-card:hover,.difficulty-card:focus-visible{border-color:rgba(174,140,255,.6);transform:translateX(3px);outline:none}.difficulty-card.selected{border-color:var(--purple);background:rgba(174,140,255,.09);box-shadow:inset 3px 0 var(--purple)}.difficulty-card span{color:var(--purple);font:800 9px ui-monospace,monospace}.difficulty-card strong{font-size:15px;letter-spacing:.08em}.difficulty-card small{text-align:right}.primary{border:0;background:var(--purple);color:#140e20;padding:16px 19px;font-weight:900;letter-spacing:.14em;cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:.15s}.primary:hover,.primary:focus-visible{filter:brightness(1.1);transform:translateY(-2px);outline:none}.primary b{font-size:17px}.menu-screen{}.menu-copy+.difficulty+.primary,#menuScreen>.primary{position:absolute;right:clamp(26px,5vw,56px);bottom:clamp(26px,5vw,45px);width:min(280px,calc(100% - 52px))}.test-screen{flex-direction:column}.phase-line{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;color:#8d859b;font:800 9px ui-monospace,monospace;letter-spacing:.15em}.phase-line strong{color:var(--purple);font-size:12px}.color-tile{position:relative;flex:1;min-height:220px;border:1px solid rgba(255,255,255,.14);box-shadow:0 20px 60px rgba(0,0,0,.25);overflow:hidden;transition:background-color .12s}.color-tile.guess{display:grid;place-items:end start}.color-tile.guess>span{padding:15px;color:rgba(255,255,255,.72);font:800 9px ui-monospace,monospace;letter-spacing:.14em;text-shadow:0 1px 4px rgba(0,0,0,.7)}.memory-wash{position:absolute;inset:0;opacity:0;pointer-events:none;background:linear-gradient(110deg,transparent 5%,rgba(160,160,160,.28) 45%,rgba(30,30,30,.2) 62%,transparent 95%);transform:translateX(-110%)}.memory-wash.medium{animation:wash 1.1s ease-in-out 1}.memory-wash.hard{animation:wash .7s ease-in-out 1}.time-track{height:3px;margin-top:12px;background:#211d2a;overflow:hidden}.time-track i{display:block;height:100%;width:100%;background:var(--purple);transform-origin:left}.instruction{margin:13px 0 0;color:#625b6f;text-align:center;font:700 9px ui-monospace,monospace;letter-spacing:.13em}.sliders{display:grid;gap:14px;margin:20px 0}.sliders label{display:grid;gap:7px}.sliders label>span{display:flex;justify-content:space-between;color:#8e879a;font:800 9px ui-monospace,monospace;letter-spacing:.14em}.sliders label b{color:var(--ink)}input[type=range]{width:100%;height:6px;margin:0;appearance:none;border-radius:0;cursor:pointer;background:#333}input[type=range]::-webkit-slider-thumb{appearance:none;width:14px;height:20px;border:2px solid #09080f;background:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.65)}input[type=range]::-moz-range-thumb{width:12px;height:18px;border:2px solid #09080f;border-radius:0;background:#fff}.sliders+#lockButton,#recallScreen>.primary{width:260px;align-self:flex-end}.result-screen,.final-screen{flex-direction:column}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:12px;flex:1;min-height:210px}.comparison>div{display:grid;grid-template-rows:1fr auto;gap:9px}.comparison small{text-align:center}.result-color{border:1px solid rgba(255,255,255,.14)}.round-score{text-align:center;padding:21px 0 18px}.round-score small{display:block;margin-bottom:4px}.round-score strong{font:800 clamp(36px,6vw,60px) ui-monospace,monospace;letter-spacing:-.07em}.round-score strong span{color:var(--purple)}.round-score p{margin:5px 0 0;color:#777080;font:700 9px ui-monospace,monospace;letter-spacing:.13em}.result-screen>.primary{width:260px;align-self:center}.final-screen{align-items:center;justify-content:center;text-align:center}.final-screen h2{margin-bottom:30px}.final-stats{display:grid;grid-template-columns:repeat(3,1fr);width:min(720px,100%);border:1px solid var(--line)}.final-stats div{padding:19px 14px;display:grid;gap:7px}.final-stats div+div{border-left:1px solid var(--line)}.final-stats strong{font:800 clamp(17px,3vw,27px) ui-monospace,monospace}.final-stats div:first-child strong,.final-stats div:nth-child(2) strong{color:var(--purple)}.best-message{color:var(--purple);font:800 9px ui-monospace,monospace;letter-spacing:.16em;margin:20px 0}.final-screen>.primary{width:290px}.interference{position:absolute;z-index:8;inset:0;display:none;place-items:center;background:#777;pointer-events:none}.interference.show{display:grid;animation:interference .55s ease both}.interference span{width:45%;height:45%;background:linear-gradient(135deg,#9b9b9b,#4b4b4b);filter:blur(22px);opacity:.65}@keyframes wash{0%{opacity:0;transform:translateX(-110%)}40%{opacity:1}100%{opacity:0;transform:translateX(110%)}}@keyframes interference{0%{opacity:0}35%{opacity:.82}100%{opacity:0}}footer{display:flex;justify-content:space-between;padding:14px 4px;color:#6e6878;font:700 9px ui-monospace,monospace;letter-spacing:.1em}@media(max-width:720px){main{width:100%;padding-top:54px}header{grid-template-columns:1fr auto;padding:0 16px;gap:12px}header>span{display:none}h1{font-size:38px}.readouts{gap:12px}.readouts strong{font-size:12px}.machine{height:calc(100svh - 180px);max-height:none;min-height:570px}.screen{padding:24px 16px}.menu-copy{width:100%;align-self:start;padding:10px 0 0}.menu-copy>p:last-child{display:none}.difficulty{width:100%;margin:24px 0 74px;align-self:end}.difficulty-card{min-height:64px;padding:10px 13px;grid-template-columns:32px 1fr}.difficulty-card small{display:none}#menuScreen{flex-direction:column}.menu-copy+.difficulty+.primary,#menuScreen>.primary{right:16px;bottom:20px;width:calc(100% - 32px)}.color-tile{min-height:210px}.sliders{margin:18px 0}.sliders+#lockButton,#recallScreen>.primary{width:100%}.result-screen>.primary{width:100%}.final-stats{grid-template-columns:1fr}.final-stats div+div{border-left:0;border-top:1px solid var(--line)}.final-stats div{padding:12px}.final-screen h2{margin-bottom:20px}footer{padding:12px 16px}footer span:last-child{display:none}.back{top:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important}}

/* calm motion and soft-control polish */
body::before,body::after{content:"";position:fixed;z-index:0;width:34rem;height:34rem;border-radius:50%;filter:blur(90px);pointer-events:none;opacity:.07}body::before{left:-12rem;top:18%;background:#ae8cff;animation:ambientFloat 16s ease-in-out infinite alternate}body::after{right:-15rem;bottom:-12rem;background:#6f55b4;animation:ambientFloat 20s ease-in-out -5s infinite alternate-reverse}main,.back{position:relative;z-index:1}.machine{border-radius:18px}.machine::before{content:"";position:absolute;width:22rem;height:22rem;right:-8rem;top:-10rem;border-radius:50%;background:radial-gradient(circle,rgba(174,140,255,.09),transparent 68%);animation:machineBreathe 9s ease-in-out infinite;pointer-events:none}.screen{z-index:1}.screen.active{animation:screenIn .55s cubic-bezier(.2,.75,.25,1) both}.difficulty-card,.primary,.color-tile,.result-color,.final-stats,.interference{border-radius:13px}.difficulty-card{transition:transform .28s ease,border-color .4s ease,background .4s ease,box-shadow .4s ease}.difficulty-card.selected{box-shadow:inset 3px 0 var(--purple),0 0 28px rgba(174,140,255,.08)}.primary{transition:transform .28s ease,filter .35s ease,box-shadow .35s ease;box-shadow:0 10px 30px rgba(34,20,58,.18)}.color-tile,.result-color{transition:background-color .55s cubic-bezier(.22,.7,.3,1),box-shadow .8s ease}.color-tile{box-shadow:0 22px 64px rgba(0,0,0,.28)}.time-track,.time-track i,.meter{border-radius:99px}.comparison>div{gap:11px}.round-score strong span{display:inline-block;min-width:3.6ch}.best-message{min-height:1em}

#recallScreen.active{display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,270px);grid-template-rows:auto 1fr auto;column-gap:25px;row-gap:14px}.phase-line{grid-column:1/-1}.color-tile.guess{grid-column:1;grid-row:2/4}.sliders{grid-column:2;grid-row:2;display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:0;padding:15px 12px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.018)}.sliders label{display:grid;grid-template-rows:auto 1fr;justify-items:center;gap:13px;min-width:0}.sliders label>span{height:38px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;text-align:center;font-size:8px}.sliders label b{font-size:9px}.sliders input[type=range]{writing-mode:vertical-lr;direction:rtl;appearance:slider-vertical;-webkit-appearance:slider-vertical;width:10px;height:100%;min-height:170px;border-radius:99px;justify-self:center}.sliders input[type=range]::-webkit-slider-thumb{width:22px;height:14px;border-radius:7px;box-shadow:0 2px 10px rgba(0,0,0,.3)}.sliders input[type=range]::-moz-range-thumb{width:20px;height:12px;border-radius:7px}.sliders+#lockButton,#recallScreen>.primary{grid-column:2;grid-row:3;width:100%;align-self:auto}

@keyframes screenIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes ambientFloat{from{transform:translate3d(0,-12px,0) scale(.95)}to{transform:translate3d(45px,28px,0) scale(1.08)}}@keyframes machineBreathe{0%,100%{opacity:.45;transform:scale(.92)}50%{opacity:1;transform:scale(1.08)}}

@media(max-width:720px){.machine{border-radius:15px}#recallScreen.active{grid-template-columns:minmax(0,1fr) 150px;column-gap:12px;row-gap:11px}.sliders{gap:4px;padding:12px 5px}.sliders label{gap:8px}.sliders label>span{font-size:7px}.sliders input[type=range]{min-height:155px}.color-tile.guess{min-height:320px}.primary,.difficulty-card,.color-tile,.result-color,.final-stats{border-radius:11px}}