*{box-sizing:border-box} :root{color-scheme:dark;--ink:#edf7f3;--dim:#afc4c4;--panel:#183740;--mint:#9ce7bd;--gold:#ffcf78}body{margin:0;background:#0b2029;color:var(--ink);font:15px/1.4 system-ui,Segoe UI,sans-serif}main{max-width:440px;margin:auto;padding:12px 16px 20px}a{color:var(--mint);text-underline-offset:4px}header{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin-bottom:10px}header span{letter-spacing:.12em;color:var(--dim)}h1{font-size:29px;line-height:1.05;margin:6px 0 8px;font-weight:800;letter-spacing:-1px}h2{font-size:27px;line-height:1.1}p{margin:8px 0;color:var(--dim)}.eyebrow{font-size:11px;letter-spacing:.18em;color:var(--gold);font-weight:700}.stats{display:flex;justify-content:space-between;background:var(--panel);border-radius:14px;padding:9px 14px;margin:10px 0}.stats small{display:block;font-size:10px;letter-spacing:.1em;color:var(--dim)}.stats b{font-size:21px;font-variant-numeric:tabular-nums}.stats>div:last-child{text-align:right}button,.play{font:inherit;font-weight:700;border:1px solid #4d7078;background:#214650;color:var(--ink);border-radius:12px;min-height:44px;padding:9px 12px;touch-action:manipulation;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}button:active{transform:translateY(1px)}button.primary,.play{background:var(--mint);color:#122c31;border-color:var(--mint)}button:disabled{opacity:.4;cursor:default}.tools{display:flex;gap:8px;margin-top:10px}.tools button{flex:1;font-size:13px;padding:8px 4px}.hint{font-size:13px;min-height:36px;margin:8px 0}.stage{position:relative;border-radius:18px;overflow:hidden;background:#173a44;border:1px solid #42616b}canvas{display:block;width:100%;aspect-ratio:328/300;touch-action:none}.board{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;padding:7px;background:#183740;border-radius:16px}.board button{padding:0;min-height:0;aspect-ratio:1;border-radius:7px;background:#244b56;font-size:21px;line-height:1}.board .filled{background:#edc284;color:#293c42;border-color:#edc284}.board .flash{animation:glow .35s ease-out}.offers{display:flex;gap:8px;margin-top:9px}.offer{flex:1;min-height:57px;position:relative;padding:5px}.offer[aria-pressed=true]{background:#365448;border:2px solid var(--mint)}.mini{display:grid;grid-template-columns:repeat(3,10px);grid-template-rows:repeat(3,10px);gap:2px;justify-content:center}.mini i{border-radius:2px;background:var(--gold)}.mini i.empty{background:transparent}.controls{display:flex;gap:10px;margin-top:9px}.controls button{flex:1;min-height:51px;font-size:16px}.controls button.held{background:var(--gold);color:#152e36}.fine{font-size:11px;color:#91adb7;margin-top:10px}dialog{border:1px solid #5b7e83;border-radius:22px;background:#15343e;color:var(--ink);width:min(340px,90vw);padding:24px;box-shadow:0 20px 80px #0008}dialog::backdrop{background:#071b26d9}dialog button{width:100%;margin-top:12px}dialog p{line-height:1.6}dialog .badge{color:var(--gold);font-size:12px;letter-spacing:.1em}.lobby{max-width:480px}.lobby h1{font-size:42px;margin-top:18px}.card{padding:20px;border:1px solid #3a5c67;border-radius:20px;margin-top:16px;background:linear-gradient(140deg,#23424c,#102e39)}.card h2{margin:8px 0;font-size:25px}.card .number{color:var(--gold);font-size:12px;letter-spacing:.15em}.play{display:block;text-align:center;text-decoration:none;margin-top:16px}.art{font-size:30px;letter-spacing:10px;color:var(--mint)}@keyframes glow{from{background:#b4ffd1}to{background:#244b56}}@media(prefers-reduced-motion:reduce){*{animation:none!important}}@media(max-width:370px){main{padding:9px 12px}h1{font-size:27px}.stats{margin:7px 0;padding:7px 12px}.hint{font-size:12px;margin:6px 0}.tools{margin-top:7px}.fine{margin-top:7px}} 

@media(max-width:500px) and (max-height:700px){body[data-game] main{padding:8px 12px}body[data-game] .eyebrow{display:none}body[data-game] header{margin-bottom:6px}body[data-game] h1{font-size:25px;margin:4px 0 6px}body[data-game] .stats{margin:6px 0;padding:6px 12px}body[data-game] .board{max-width:288px;margin:auto;gap:3px;padding:4px}body[data-game] .offers{margin-top:6px}body[data-game] .offer{min-height:46px;padding:4px}body[data-game] .hint{min-height:32px;margin:6px 0}body[data-game] .tools{margin-top:6px}body[data-game] canvas{max-height:290px}}

.phone-launch h1{font-size:32px;margin:12px 0 4px}.phone-launch .welcome{margin:4px 0 12px}.phone-launch .card{padding:12px 14px;margin-top:10px}.phone-launch .card h2{font-size:20px;margin:0 0 4px}.phone-launch .card p{font-size:13px;margin:4px 0}.phone-launch .play{margin-top:8px;min-height:44px;padding:10px}.phone-launch .fine{font-size:11px}.phone-launch summary{font-size:12px;color:var(--dim)}
