:root{--paper:#f6f2e8;--ink:#263235;--muted:#78817e;--teal:#42a89a;--gold:#d4a73c;--line:#d7d2c7}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;font-family:Arial,sans-serif;background:#d7d9d2;color:var(--ink);touch-action:none}.game{width:100%;height:100%;display:grid;grid-template-rows:66px auto 1fr 45px;background:var(--paper)}header{display:flex;align-items:center;justify-content:space-between;padding:8px 18px;border-bottom:1px solid var(--line);background:#fbf9f2}.brand{font-size:11px;font-weight:950;letter-spacing:.14em}.brand i{color:var(--teal);font-style:normal}.brand small{display:block;margin-top:4px;font-size:7px;color:var(--muted)}.stats{display:flex;height:46px}.stats span{min-width:82px;padding:5px 12px;text-align:center;border-left:1px solid #ddd7cc}.stats small,.stats b{display:block}.stats small{font-size:6px;color:var(--muted);letter-spacing:.13em}.stats b{font-size:16px}.objective{display:flex;align-items:center;justify-content:space-between;padding:8px 18px;background:#edf2ec;border-bottom:1px solid var(--line)}.objective small{font-size:7px;color:var(--teal);letter-spacing:.14em;font-weight:950}.objective h1{font-size:17px;margin:3px 0}.objective p{font-size:10px;margin:0}.coverage{width:185px}.coverage span{display:flex;justify-content:space-between;font-size:8px;font-weight:900}.coverage>i{display:block;height:8px;margin-top:5px;border-radius:8px;background:#d1d6cf;overflow:hidden}.coverage em{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--gold));transition:width .18s}.workspace{min-height:0;display:grid;grid-template-columns:180px minmax(300px,620px) 180px;justify-content:center;gap:18px;padding:14px 18px;background:linear-gradient(#8ca09d15 1px,transparent 1px) 0 0/100% 32px,linear-gradient(90deg,transparent 52px,#dd777733 53px,transparent 54px),var(--paper)}aside{align-self:center}aside h3{font-size:7px;letter-spacing:.16em;color:var(--muted)}aside button{width:100%;margin:0 0 8px;padding:10px 8px;border:1px solid #d4cec2;border-radius:11px;background:#faf8f2;color:var(--ink);cursor:pointer}aside button:disabled{opacity:.35}aside button b,aside button small{display:block}aside button b{font-size:8px}aside button small{font-size:7px;color:var(--muted);margin-top:3px}.note,.skip{padding:11px;border:1px dashed #c6c1b5;border-radius:12px;font-size:8px;line-height:1.45;color:var(--muted)}.note b,.skip b{color:var(--ink)}.colours{display:grid;gap:6px;margin-bottom:12px}.colour{display:flex;align-items:center;gap:7px;padding:6px;border:1px solid #d9d3c7;border-radius:9px;background:#fff;font-size:7px;font-weight:900}.colour i{width:20px;height:20px;border-radius:50%;background:var(--c);box-shadow:3px 3px 0 -2px var(--a)}.colour.done{border-color:var(--c)}.colour.done:after{content:'✓';margin-left:auto;color:var(--c);font-size:13px}.board-wrap{min-width:0;display:grid;place-items:center;position:relative}.board{position:relative;width:min(100%,560px);aspect-ratio:1;background:#fdfaf2;border:2px solid #c9c2b3;border-radius:10px;box-shadow:7px 8px 0 #d5cdbc,0 18px 38px #26353225;overflow:hidden}.cells{position:absolute;inset:10px;display:grid;gap:2px}.cell{position:relative;border:1px solid #d9d4c9;border-radius:3px;background:#fffdfa}.cell.guide{background:color-mix(in srgb,var(--guide) 25%,#fff);box-shadow:inset 0 0 0 2px var(--guide)}.terminal{position:absolute;z-index:5;left:20%;top:20%;width:60%;height:60%;border-radius:52% 48% 43% 57%;background:var(--c);border:3px solid #fff;box-shadow:0 0 0 3px var(--c),5px 5px 0 -3px var(--a);cursor:pointer}.terminal:after{content:'';position:absolute;width:18%;height:12%;left:20%;top:16%;border-radius:50%;background:#fff9}#trails{position:absolute;z-index:3;inset:10px;width:calc(100% - 20px);height:calc(100% - 20px);overflow:visible;pointer-events:none}#trails path{fill:none;stroke:var(--c);stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(1px 2px 1px #2333);transition:d .08s}.bonus{position:absolute;z-index:9;top:-8px;padding:7px 14px;border-radius:999px;background:var(--gold);color:#fff;font-size:8px;font-weight:950;letter-spacing:.12em}.toast{position:absolute;z-index:12;bottom:8%;padding:9px 14px;border-radius:999px;background:#263235;color:#fff;font-size:9px;opacity:0;transform:translateY(8px);transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:none}.modal{position:absolute;z-index:20;width:min(86%,390px);padding:22px;text-align:center;background:#253235f2;color:#fff;border-radius:19px;box-shadow:0 18px 55px #17211f66}.modal small{font-size:7px;color:#8edacd;letter-spacing:.15em;font-weight:950}.modal h2{font-size:25px;margin:8px}.modal p{font-size:10px;color:#d9e1de;line-height:1.5}.modal strong{display:block;margin:12px;color:#f0c75b}.modal button{border:0;border-radius:999px;padding:10px 20px;background:var(--teal);color:#fff;font-weight:900}.hidden{display:none!important}footer{display:flex;align-items:center;justify-content:space-between;padding:6px 15px;border-top:1px solid var(--line);background:#faf8f2}footer button{border:1px solid #d4cec2;border-radius:9px;background:#fff;padding:7px 12px;font-weight:900;font-size:8px}footer span{font-size:8px;color:var(--muted)}dialog{width:min(90%,620px);max-height:80vh;border:0;border-radius:18px;padding:22px;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#182220aa}dialog>button{float:right;border:0;background:none;font-size:23px}dialog small{font-size:7px;color:var(--teal);letter-spacing:.15em}dialog h2{margin:5px 0 15px}#levelGrid{display:grid;grid-template-columns:repeat(10,1fr);gap:5px;overflow:auto}#levelGrid button{aspect-ratio:1;border:1px solid #d4cec2;border-radius:7px;background:#fff;font-size:8px;font-weight:900}#levelGrid button.locked{opacity:.25}#levelGrid button.bonus-level{border-color:var(--gold);color:#a57c15}.skip{margin-top:10px}.skip p{margin:5px 0 9px}.skip button{background:#263235;color:#fff;border:0}@media(max-width:760px){.game{grid-template-rows:58px auto 1fr 42px}.brand small,.stats span:first-child{display:none}.stats span{min-width:64px;padding:4px 7px}.objective{padding:7px 10px}.objective h1{font-size:14px}.objective p{font-size:9px}.coverage{width:120px}.workspace{display:block;padding:8px}.workspace aside{display:none}.board{width:min(94vw,calc(100vh - 185px))}footer{padding:5px 9px}#levelGrid{grid-template-columns:repeat(6,1fr)}}