:root{color-scheme:dark;--bg:#0c1118;--panel:#141b25;--text:#edf0f5;--muted:#a8b4c5;--light:#ffc567;--glow:#ffb64970;--on:#b87526;--ink:#261704}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 72% 32%,#22304766,transparent 58%),var(--bg);color:var(--text);font:16px/1.5 system-ui,Segoe UI,sans-serif;min-height:100vh}
body[data-theme=blue]{--light:#91e3ff;--glow:#27baff75;--on:#2678a7;--ink:#052231}body[data-theme=mint]{--light:#aeefd9;--glow:#47e8a36b;--on:#3c9474;--ink:#04281d}body[data-theme=contrast]{--light:#fff;--glow:transparent;--on:#ddd;--ink:#000;--bg:#000;--panel:#101010;--muted:#ddd}
button,select,input{font:inherit}button,select{border:1px solid #3b4656;border-radius:8px;background:#222c39;color:var(--text);min-height:44px;padding:9px 14px}button{cursor:pointer;touch-action:manipulation;transition:background .15s,transform .15s}button:hover{background:#344252}button:active{transform:translateY(1px)}button:disabled{opacity:.4;cursor:default}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--light);outline-offset:4px}a{color:inherit}h1,h2,p{margin:0}h1{font-size:clamp(27px,3.5vw,43px);font-weight:450;letter-spacing:-1.6px;line-height:1.15}h1 span{color:var(--light)}h2{font-size:29px;font-weight:450;letter-spacing:-.6px}.shell{max-width:1130px;margin:auto;padding:34px 32px}.brand{font-size:11px;letter-spacing:2px;text-decoration:none;font-weight:750}.brand span{color:var(--muted);font-weight:400;letter-spacing:1px}.head{display:flex;justify-content:space-between;align-items:center;margin:27px 0}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--muted);margin-bottom:10px}.head button{font-size:12px}
main{display:grid;grid-template-columns:340px 1fr;gap:24px;align-items:start}.panel{border:1px solid #3a4654;border-radius:18px;background:linear-gradient(125deg,#202a36,var(--panel) 58%);box-shadow:0 22px 70px #0005,inset 0 1px #ffffff0c}.settings{padding:27px}.intro{color:var(--muted);font-size:14px;margin:15px 0 25px}.selectors{display:grid;grid-template-columns:1fr 1fr;gap:15px 12px}label{font-size:12px;color:var(--muted)}select{width:100%;font-size:14px;margin-top:6px;padding:8px}label:first-child{grid-column:1/-1}.check{display:flex;gap:8px;align-items:center;margin:18px 0}.check input{width:19px;height:19px;accent-color:var(--light)}.primary{background:var(--light);color:var(--ink);border-color:var(--light);font-weight:650}.primary:hover{background:var(--light);filter:brightness(1.1)}.full{width:100%;display:flex;justify-content:space-between}.small{font-size:12px;color:var(--muted);line-height:1.6}#difficultyNote{margin-top:16px;min-height:58px}.secondary-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}.secondary-links button{font-size:12px;background:transparent;padding:7px 9px}
.console{padding:20px 27px 18px;position:relative}.console-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.5px;color:var(--muted)}.online-dot{font-size:9px}.online-dot:before{content:'●';color:var(--light);margin-right:7px}.meters{display:flex;justify-content:space-around;border-bottom:1px solid #334050;margin:15px 0 20px;padding-bottom:12px;text-align:center}.meters span{display:block;font-size:9px;letter-spacing:1.8px;color:var(--muted)}.meters strong{font-weight:400;font-size:28px;font-variant-numeric:tabular-nums;color:var(--light)}
.board-wrap{padding:14px;border:1px solid #45505b;border-radius:15px;box-shadow:inset 0 2px 9px #0009,0 1px #ffffff10;background:#080d14;max-width:426px;margin:auto}#board{display:grid;grid-template-columns:repeat(var(--n),1fr);gap:9px}.tile{padding:0;min-height:0;aspect-ratio:1;border-radius:10px;background:linear-gradient(140deg,#303e4d,#1a2430);border:1px solid #465465;box-shadow:inset 0 2px 2px #ffffff10,0 4px 0 #070b11;font-size:clamp(17px,2.4vw,26px);color:#91a1b4;position:relative}.tile:before{content:'';position:absolute;inset:7px;border:1px solid #ffffff0b;border-radius:5px}.tile.on{background:radial-gradient(ellipse at 45% 25%,var(--light),var(--on));color:var(--ink);border-color:var(--light);box-shadow:0 0 17px var(--glow),inset 0 2px 3px #fff7,0 4px 0 #070b11}.tile.mark:after{content:'';position:absolute;inset:15%;border:3px solid currentColor;border-radius:50%}.tile.hint{outline:3px solid var(--text);outline-offset:3px}.tile:disabled{opacity:1}.legend{display:flex;justify-content:center;gap:18px;color:var(--muted);font-size:10px;margin-top:17px}#status{text-align:center;font-size:14px;min-height:44px;display:flex;align-items:center;justify-content:center;margin:8px 0}.controls{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}.controls button{font-size:12px;padding:8px 11px}.accent{color:var(--light);border-color:var(--on)}.footnote{text-align:center;margin-top:10px}footer{display:flex;justify-content:space-between;color:#8e9cac;font-size:9px;letter-spacing:1.8px;margin-top:25px}footer span{letter-spacing:.5px}
dialog{width:min(570px,94vw);max-height:90dvh;background:#18222e;color:var(--text);border:1px solid #637386;border-radius:16px;padding:25px}dialog::backdrop{background:#05090dcc;backdrop-filter:blur(4px)}dialog h2{margin-bottom:12px}dialog p{margin:12px 0}dialog button{margin:4px}dialog input[type=text]{width:100%;background:#0a111a;color:white;border:1px solid #59697a;padding:12px;border-radius:6px}dialog ul{padding-left:21px}dialog table{width:100%;font-size:13px}dialog td{padding:6px;border-bottom:1px solid #415063}.tutorial-board{display:grid;grid-template-columns:repeat(3,52px);gap:8px;justify-content:center;margin:20px}.tutorial-board button{height:52px}.tutorial-board .on{background:var(--light);color:var(--ink)}.win .board-wrap{animation:win .9s ease-out}@keyframes win{50%{border-color:var(--light);box-shadow:0 0 28px var(--glow)}}
@media(max-width:760px){.shell{padding:16px}main{grid-template-columns:1fr;gap:12px}.head{margin:15px 0}.settings{padding:14px;order:2}.settings>.eyebrow,.settings>h2,.intro{display:none}.selectors{grid-template-columns:repeat(4,1fr);gap:8px}label:first-child{grid-column:auto}select{font-size:12px;padding:6px 2px}.check{margin:12px 0}.console{padding:14px}.board-wrap{max-width:min(390px,calc(100dvh - 330px));min-width:260px}.meters{margin:10px 0;padding-bottom:7px}.meters strong{font-size:23px}#board{gap:7px}.legend{margin-top:12px}#status{min-height:30px;font-size:12px;margin:5px 0}.footnote{margin-top:6px;font-size:10px}footer{font-size:8px;gap:15px}#difficultyNote{min-height:0}.brand span{font-size:9px}.tile{font-size:19px}}
@media(max-width:370px){.shell{padding:9px}.console{padding:10px}.board-wrap{padding:10px;min-width:250px}.selectors{grid-template-columns:1fr 1fr}h1{font-size:26px}.head button{padding:6px}#board{gap:6px}}
@media(max-height:540px) and (min-width:620px){.shell{padding:12px 20px}.head{margin:9px 0}.head .eyebrow,.brand,footer{display:none}h1{font-size:27px}main{grid-template-columns:280px 1fr}.settings{order:0;padding:14px}.selectors{grid-template-columns:1fr 1fr}.board-wrap{min-width:0;max-width:220px;padding:8px}#board{gap:5px}.console{padding:10px}.meters{margin:4px 0}.meters strong{font-size:20px}.legend{margin-top:7px}.tile{font-size:15px}.tile:before{inset:4px}.intro,.settings h2,.settings>.eyebrow{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

@media (max-width:760px) and (min-height:541px){.shell{padding:12px}.console{padding:10px}.board-wrap{max-width:390px;min-width:0;padding:8px}#board{gap:5px}}

/* Games navigation uses normal header/menu flow, never the playfield overlay. */
a.return-games{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:6px 10px;box-sizing:border-box;color:inherit;font:600 13px/1.25 system-ui,sans-serif;letter-spacing:normal;text-decoration:underline;text-underline-offset:3px;white-space:nowrap;border-radius:5px}
a.return-games:hover{background:#ffffff14}a.return-games:focus-visible{outline:2px solid currentColor;outline-offset:2px}
