*{box-sizing:border-box}html,body{background:#f4f0e8;min-height:100%;margin:0}body{color:#263346;font-family:Arial,sans-serif}button,select{font:inherit}button{cursor:pointer}main{--bg:#f4f0e8;--card:#fffdf9;--ink:#263346;--muted:#77808d;--line:#ded9cf;--accent:#ef765c;--teal:#3b9c91;background:radial-gradient(circle at 12% 4%,#fff 0,transparent 28%),var(--bg);min-height:100vh;color:var(--ink);padding:0 max(18px,50vw - 525px);transition:all .25s}main[data-theme=dark]{--bg:#171c25;--card:#252c3a;--ink:#f4f1e9;--muted:#a9b2c2;--line:#3a4558;--accent:#ff8d77;--teal:#6bd0bf;background:radial-gradient(circle at 10% 0,#283142,transparent 36%),var(--bg)}main[data-theme=pastel]{--bg:#f4edf7;--card:#fffafe;--ink:#40374d;--line:#dfd2e2;--accent:#df7893;--teal:#6ea8a0}main[data-theme=contrast]{--bg:#fff;--card:#fff;--ink:#000;--muted:#222;--line:#000;--accent:#0057ff;--teal:#008b3b}header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:76px;display:flex}.brand{color:var(--ink);letter-spacing:.18em;align-items:center;gap:10px;font-size:14px;font-weight:800;text-decoration:none;display:flex}.brand small{letter-spacing:.12em;color:var(--muted);margin-top:2px;font:italic 11px Georgia,serif;display:block}.brandmark{background:var(--ink);width:34px;height:34px;color:var(--card);border-radius:11px;place-items:center;font:italic 700 20px Georgia;display:grid}.head-actions{gap:8px;display:flex}.head-actions button,.head-actions select{border:1px solid var(--line);background:var(--card);height:36px;color:var(--ink);border-radius:10px;padding:0 12px}.intro{justify-content:space-between;align-items:end;padding:40px 0 28px;display:flex}.eyebrow{color:var(--accent);letter-spacing:.16em;font-size:11px;font-weight:800}.intro h1{margin:10px 0;font:italic 500 clamp(38px,8vw,68px)/1 Georgia,serif}.intro p{color:var(--muted);max-width:440px;margin:0;line-height:1.5}.streak{border:1px solid var(--line);background:var(--card);border-radius:16px;grid-template-columns:auto auto;align-items:end;gap:0 9px;padding:14px 18px;display:grid}.streak strong{font:500 30px Georgia}.streak span{color:var(--muted);padding-bottom:4px;font-size:11px}.streak i{color:var(--accent);letter-spacing:4px;grid-column:1/3;margin-top:4px;font-size:8px}.level-tabs{background:color-mix(in srgb,var(--line) 60%,transparent);border-radius:13px;gap:4px;margin-bottom:18px;padding:4px;display:flex;overflow:auto}.level-tabs button{min-width:68px;color:var(--muted);background:0 0;border:0;border-radius:10px;flex:1;padding:10px;font-size:12px;font-weight:700}.level-tabs button.active{background:var(--card);color:var(--ink);box-shadow:0 2px 10px #18223a12}.game-shell{background:var(--card);border:1px solid var(--line);border-radius:24px;max-width:680px;margin:auto;padding:clamp(14px,3vw,24px);box-shadow:0 24px 80px #26334613}.game-top{justify-content:space-between;align-items:center;margin-bottom:15px;font-size:12px;display:flex}.game-top>div{align-items:center;gap:8px;display:flex}.game-top time{letter-spacing:.08em;font-weight:700}.pulse{background:var(--teal);width:8px;height:8px;box-shadow:0 0 0 5px color-mix(in srgb,var(--teal) 14%,transparent);border-radius:50%}.pulse.bad{background:var(--accent)}.board{aspect-ratio:1;touch-action:manipulation;width:100%;max-width:620px;margin:auto}.board canvas{display:block;width:100%!important;height:100%!important}.progress{color:var(--muted);grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin:14px 2px 18px;font-size:10px;display:grid}.progress div{background:var(--line);border-radius:3px;height:4px;overflow:hidden}.progress i{background:var(--teal);border-radius:3px;height:100%;transition:width .4s;display:block}.keypad{grid-template-columns:repeat(9,1fr);gap:6px;display:grid}.keypad button{aspect-ratio:1;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:12px;font:500 clamp(17px,4vw,24px) Georgia;transition:all .15s}.keypad button:active{background:var(--accent);color:#fff;transform:scale(.9)}.tools{grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px;display:grid}.tools button{color:var(--muted);background:0 0;border:0;border-radius:10px;padding:8px;font-size:10px;position:relative}.tools button.on{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent)}.tools span{color:var(--ink);margin-bottom:4px;font-size:21px;display:block}.tools em{background:var(--accent);color:#fff;border-radius:8px;margin-left:2px;padding:1px 4px;font-size:8px;font-style:normal;position:absolute;top:3px}footer{color:var(--muted);align-items:center;gap:18px;padding:28px 0;font-size:11px;display:flex}footer p{margin-right:auto}footer a{color:var(--muted)}.win{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:5;background:#152033bb;place-items:center;display:grid;position:fixed;top:0;bottom:0;left:0;right:0}.win div{text-align:center;background:var(--card);border-radius:28px;width:min(88vw,390px);padding:38px;box-shadow:0 30px 100px #0005}.win span{color:var(--accent);font-size:38px}.win h2{margin:12px 0;font:italic 500 38px Georgia}.win p{color:var(--muted)}.win button{background:var(--ink);color:var(--card);border:0;border-radius:12px;padding:13px 24px;font-weight:700}@media (max-width:600px){main{padding:0 12px}header{height:60px}.intro{padding:24px 4px 20px}.intro h1{font-size:42px}.intro p{font-size:12px}.streak{display:none}.level-tabs{margin-bottom:10px}.game-shell{border-radius:18px;padding:11px}.game-top{margin:3px 3px 10px}.keypad{gap:4px}.keypad button{border-radius:9px}.tools{margin-top:6px}.tools button{padding:5px}footer{flex-wrap:wrap;justify-content:center;padding:18px 4px}footer p{text-align:center;width:100%;margin:0}}@media (min-width:850px){main{grid-template-columns:280px minmax(480px,680px);align-content:start;column-gap:56px;display:grid}header{grid-column:1/3}.intro{grid-column:1;padding-top:70px;display:block}.streak{width:max-content;margin-top:30px}.level-tabs{background:0 0;flex-direction:column;grid-column:1;margin:0;padding:0}.level-tabs button{text-align:left;flex:none;padding:12px 16px}.level-tabs button.active{border-left:3px solid var(--accent)}.game-shell{grid-area:2/2/5;width:100%;margin:34px 0 0}footer{grid-column:1/3}}
