:root{color-scheme:light;--bg:#f3f1e9;--surface:#fffef9;--ink:#203b37;--muted:#687970;--line:#d9ded3;--covered:#e2e8da;--edge:#c5d0bc;--open:#f5f6ef;--accent:#22654d;--selected:#234e3e;--selected-text:#fff;--red:#b63636;--shadow:0 16px 50px #263e3210;--n1:#24609b;--n2:#287448;--n3:#bc3935;--n4:#6a449f;--n5:#905126;--n6:#087779;--n7:#343c46;--n8:#65646e}
:root[data-theme=dark]{color-scheme:dark;--bg:#132320;--surface:#1b302b;--ink:#e4ede1;--muted:#a2b7aa;--line:#3a5145;--covered:#385345;--edge:#476453;--open:#22392f;--accent:#a1d2aa;--selected:#b5d9a6;--selected-text:#173024;--red:#ff9590;--shadow:0 16px 50px #0002;--n1:#91c3ff;--n2:#9bdb9e;--n3:#ff9895;--n4:#c8adff;--n5:#ebbf8e;--n6:#87e0dc;--n7:#e1e9f2;--n8:#c4c1cd}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}main{max-width:850px;margin:65px auto 30px;padding:0 24px}.heading{display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2.5px;margin:0 0 12px;color:var(--muted)}h1{font-size:42px;letter-spacing:-1.8px;line-height:1.15;margin:0;font-weight:750}.dot{color:var(--accent)}.subtitle{color:var(--muted);margin:12px 0 30px;font-size:15px}button{font:inherit;cursor:pointer;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:7px;touch-action:manipulation}button:hover{filter:brightness(.95)}button:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.quiet{font-size:24px;width:42px;height:42px}.game{border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:var(--shadow);overflow:hidden}.toolbar{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;gap:12px;border-bottom:1px solid var(--line)}.levels{display:flex;gap:3px;background:var(--bg);padding:4px;border-radius:8px}.levels button{border:0;background:transparent;color:var(--muted);font-size:12px;padding:8px 12px;font-weight:600}.levels button[aria-pressed=true]{background:var(--selected);color:var(--selected-text)}.new{padding:9px 12px;font-size:12px;font-weight:650}.dashboard{display:flex;justify-content:space-between;align-items:center;padding:23px 28px 18px}.label{display:block;font-size:9px;letter-spacing:1.7px;font-weight:700;color:var(--muted)}strong{font-family:ui-monospace,monospace;font-size:32px;font-weight:500;letter-spacing:2px}.time{text-align:right}.field-label{color:var(--muted);font-size:10px;letter-spacing:1.5px;display:flex;align-items:center;gap:8px}.status-dot{width:6px;height:6px;background:var(--accent);border-radius:50%}.board-wrap{overflow:auto;padding:10px 22px 28px}#board{display:grid;grid-template-columns:repeat(var(--cols),var(--cell));gap:4px;width:max-content;padding:8px;margin:0 auto;background:var(--line);border:1px solid var(--edge);border-radius:8px}.cell{border-radius:4px;width:var(--cell);height:var(--cell);padding:0;border:1px solid var(--edge);background:var(--covered);box-shadow:0 2px 0 var(--edge),inset 0 1px 0 #ffffff40;font:700 20px/1 ui-monospace,monospace;color:var(--ink)}.cell:hover{background:var(--surface);filter:none}.cell.open{background:var(--open);box-shadow:none;border-color:transparent}.cell.flagged{color:var(--accent)}.cell.mine{color:var(--red);background:var(--open)}.cell.hit{background:#b63636;color:#fff}.cell[data-n="1"]{color:var(--n1)}.cell[data-n="2"]{color:var(--n2)}.cell[data-n="3"]{color:var(--n3)}.cell[data-n="4"]{color:var(--n4)}.cell[data-n="5"]{color:var(--n5)}.cell[data-n="6"]{color:var(--n6)}.cell[data-n="7"]{color:var(--n7)}.cell[data-n="8"]{color:var(--n8)}.statusbar{border-top:1px solid var(--line);padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}.statusbar p{font-size:12px;color:var(--muted);margin:0}.statusbar button{padding:7px 10px;white-space:nowrap;font-size:12px}.statusbar button[aria-pressed=true]{color:var(--selected-text);background:var(--selected)}.below{display:flex;justify-content:space-between;margin:18px 2px 28px;color:var(--muted);font:10px ui-monospace,monospace;letter-spacing:1px}details{border-top:1px solid var(--line);padding-top:17px;color:var(--muted);font-size:12px}summary{cursor:pointer;font-weight:600;color:var(--ink);list-style:none;display:flex;justify-content:space-between}details p{max-width:650px}footer{text-align:center;font-size:9px;letter-spacing:2px;color:var(--muted);margin-top:36px}@media(max-width:580px){main{margin-top:28px;padding:0 12px}h1{font-size:35px}.toolbar{padding:12px 10px;gap:6px}.levels button{padding:8px 8px;font-size:11px}.new{padding:9px 8px}.dashboard{padding:18px 18px 12px}.board-wrap{padding:8px 8px 22px}.statusbar{padding:12px 10px}.statusbar p{font-size:11px}.field-label{font-size:9px;letter-spacing:1px}.subtitle{font-size:13px;margin-bottom:24px}.cell{font-size:18px}}
/* A small, code-drawn groundskeeper and a living grass field. */
.field-stage{position:relative;width:max-content;margin:0 auto;isolation:isolate}#board{background:#648745;border-color:#527a36;gap:3px;padding:9px;box-shadow:0 5px 0 #425b32,0 9px 0 #795431} .board-wrap{padding-top:25px;padding-bottom:32px}
.cell{position:relative;background-color:#8ebf58;background-image:linear-gradient(65deg,transparent 45%,#659b3f 46% 54%,transparent 55%),linear-gradient(110deg,transparent 45%,#b0d974 46% 54%,transparent 55%);background-size:11px 9px,13px 10px;background-position:5px 6px,14px 19px;background-repeat:no-repeat;border-color:#75a34c;box-shadow:inset 0 2px 0 #b4d985,0 2px 0 #527a36;color:#18391f;border-radius:5px 5px 3px 3px}.cell:nth-child(3n){background-color:#9ac765}.cell:hover{background-color:#b1d97d;background-image:inherit}.cell.open{background:#eee0bd;box-shadow:inset 0 3px 0 #8b633b,inset 0 5px 6px #8b633b40;border:2px solid #b08b55;border-radius:45%}.cell.flagged{color:#78292b;text-shadow:0 1px #fff7}.cell.mine{background:#d8c19a;color:#352a25}.cell.hit{background:#45382f;color:#fff1c6;border-color:#2a2521}.field-stage #character{position:absolute;top:0;left:0;z-index:5;width:0;height:0;pointer-events:none;transition:transform .4s linear}.person{position:absolute;width:30px;height:48px;left:-15px;top:-44px;filter:drop-shadow(1px 3px 1px #18391f66);transform-origin:50% 90%}.person i,.person b{position:absolute;display:block}.head{width:23px;height:21px;background:#f0bd88;border:2px solid #47382a;left:4px;top:6px;border-radius:40%;z-index:4}.hat{width:29px;height:10px;background:#edba54;border:2px solid #765023;top:2px;left:1px;border-radius:9px 9px 3px 3px;z-index:6;box-shadow:0 3px 0 #765023}.eyes{left:4px;top:5px;width:4px;height:5px;background:#292d26;border-radius:50%;box-shadow:8px 0 #292d26}.mouth{left:7px;top:13px;width:6px;height:2px;background:#8c4937}.body{left:6px;top:25px;width:20px;height:15px;background:#5b91c2;border:2px solid #284860;border-radius:4px;z-index:2;box-shadow:inset 5px 0 #edc871}.arm{left:22px;top:26px;width:7px;height:13px;background:#efbc87;border:1px solid #47382a;transform:rotate(-40deg);border-radius:4px;z-index:4}.leg{top:38px;width:8px;height:10px;background:#364959;border-bottom:4px solid #40332c;border-radius:2px}.left{left:6px}.right{left:18px}.shovel{height:30px;width:4px;background:#79512d;left:33px;top:18px;transform:rotate(20deg);transform-origin:50% 20%;border:1px solid #493222;z-index:3}.shovel:after{content:'';position:absolute;bottom:-4px;left:-4px;width:10px;height:12px;background:#b7c4bc;border:1px solid #42534b;border-radius:2px 2px 6px 6px}.running .person{animation:bob .15s infinite alternate}.running .leg.left{animation:stride .15s infinite alternate}.running .leg.right{animation:stride .15s infinite alternate-reverse}.digging .person{animation:dig .23s 2}.digging .shovel{animation:shovel .23s 2}.sooty .head,.sooty .body,.sooty .hat,.sooty .arm{background:#343434;border-color:#202020;box-shadow:none}.sooty .eyes{background:white;box-shadow:8px 0 white}.sooty .mouth{height:4px;background:#fff}.sooty .person:after{content:'♧';position:absolute;color:#6c6c6c;top:-17px;left:8px;font-size:23px;animation:smoke 2s infinite}.startled .person{animation:startled .75s ease-out}.celebrating .person{animation:bob .3s infinite alternate}#burst{display:none;position:absolute;pointer-events:none;z-index:7;width:110px;height:110px;margin:-55px;background:#ffd85b;clip-path:polygon(50% 0,60% 28%,84% 7%,77% 35%,100% 45%,77% 58%,93% 85%,62% 73%,50% 100%,39% 73%,9% 90%,24% 60%,0 45%,27% 35%,13% 8%,41% 28%);align-items:center;justify-content:center;color:#562719;font:bold 23px/1 system-ui;text-shadow:2px 2px #fff;filter:drop-shadow(0 0 8px #f68c38)}#burst.exploding{display:flex;animation:explode .85s ease-out both}#dirt{position:absolute;display:none;pointer-events:none;z-index:6;color:#76502c;font-size:35px;letter-spacing:8px;margin:-20px}#dirt.flying{display:block;animation:dirt .46s ease-out}
@keyframes bob{to{transform:translateY(-4px) rotate(4deg)}}@keyframes stride{to{transform:rotate(30deg)}}@keyframes dig{50%{transform:rotate(22deg) translateY(3px)}}@keyframes shovel{50%{transform:rotate(65deg)}}@keyframes dirt{to{transform:translateY(-28px) scale(2);opacity:0}}@keyframes explode{0%{transform:scale(.15);opacity:0}20%{transform:scale(1.2);opacity:1}65%{transform:scale(1);opacity:1}100%{transform:scale(1.6);opacity:0}}@keyframes startled{35%{transform:translateY(-30px) rotate(-22deg)}65%{transform:translateY(-8px) rotate(12deg)}}@keyframes smoke{to{transform:translateY(-15px);opacity:0}}
:root[data-theme=dark] .cell.open{background:#403c2e;border-color:#7a6542;box-shadow:inset 0 3px #252a23}:root[data-theme=dark] .cell.mine{background:#3e332b;color:#eee0bd}:root[data-theme=dark] .cell.hit{background:#211d1b;color:#fff}:root[data-theme=dark] .cell.flagged{color:#64242c}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}