:root{color-scheme:dark;--bg:#0c1922;--panel:#12252f;--ink:#e9ede6;--muted:#97adb3;--amber:#f1be73;--blue:#82d5e7}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 55% 35%,#1e3742 0,transparent 55%),var(--bg);color:var(--ink);font-family:Arial,sans-serif}main{max-width:1420px;margin:auto;padding:30px 48px}header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #34505a;padding-bottom:22px}.brand{font-weight:800;letter-spacing:4px;font-size:19px;text-decoration:none;color:var(--ink)}.brand span{font-weight:400;font-size:9px;letter-spacing:2px;margin-left:20px;color:var(--muted)}.edition,.eyebrow,footer,.board-top{font-size:10px;letter-spacing:2px}.edition{color:var(--muted)}.intro{display:flex;justify-content:space-between;align-items:center;margin:34px 0 28px}.eyebrow{color:var(--amber);line-height:1.7}h1{font:normal clamp(32px,3.4vw,48px)/1.09 Georgia,serif;margin:12px 0}h1 em{color:#a4c9ca;font-weight:normal}.lead{font-size:14px;line-height:1.8;color:var(--muted)}.workspace{display:grid;grid-template-columns:minmax(205px,1fr) minmax(330px,560px) 170px;gap:32px;align-items:center}.brief{align-self:stretch;padding-top:18px}h2{font:normal 28px Georgia,serif;margin:10px 0 22px}.brief p:not(.eyebrow){font-size:13px;line-height:1.7;color:var(--muted)}.plus-text{color:var(--amber)}.minus-text{color:var(--blue)}.stats{display:flex;gap:26px;margin:26px 0;border-top:1px solid #34505a;border-bottom:1px solid #34505a;padding:20px 0}.stats div{display:flex;flex-direction:column;gap:7px}.stats strong{font:normal 25px Georgia,serif}.stats span{font-size:8px;letter-spacing:1px;color:var(--muted)}.legend{display:grid;gap:13px;font-size:11px;color:#bdced1}.legend>span{display:flex;align-items:center;gap:10px}.dot{width:19px;height:19px;border-radius:50%;display:inline-grid;place-content:center;font-style:normal;font-weight:bold;color:#162735}.amber{background:var(--amber)}.blue{background:var(--blue)}.wall-icon{width:17px;height:17px;background:repeating-linear-gradient(45deg,#60777c 0 2px,#344c54 2px 6px);border:1px solid #839497;border-radius:3px}.port-icon{font-size:24px;font-style:normal;line-height:19px}.science{margin-top:24px;font-size:11px!important;max-width:280px}.text-button{border:0!important;background:none!important;color:var(--amber)!important;padding:6px 0!important;font-size:11px}.board-wrap{min-width:0}.board-top,.board-bottom{display:flex;justify-content:space-between;align-items:center}.board-top{margin:0 0 12px;color:#aec5c9;font-size:9px}.live-dot{display:inline-block;border-radius:50%;width:5px;height:5px;background:var(--amber);margin-right:6px}#board{position:relative;aspect-ratio:1;isolation:isolate;background:#153d50 url('lens.webp') center/cover;border:1px solid #536f78;border-radius:18px;box-shadow:0 24px 70px #0007;overflow:hidden}#board:before{content:'';position:absolute;inset:0;background:#152b39;opacity:var(--fog,.4);transition:opacity .5s;z-index:-1}.grid{position:absolute;inset:8%;display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(6,1fr)}.cell{border:1px solid #a2c9cf22;border-radius:4px;position:relative;display:grid;place-items:center}.cell.wall{margin:4px;border:1px solid #9aabae;background:repeating-linear-gradient(135deg,#8a979a 0 2px,#455c64 2px 8px);box-shadow:2px 4px 5px #0009}.cell.port{margin:3px;border:2px dashed var(--color);border-radius:50%;color:var(--color);background:#082131aa;font-size:25px;box-shadow:inset 0 0 16px #0008}.port small{position:absolute;font:7px Arial;bottom:5px;letter-spacing:1px}.grains{position:absolute;inset:8%;pointer-events:none}.grain{position:absolute;width:12%;height:12%;margin:2.3%;left:calc(var(--x)*100%/6);top:calc(var(--y)*100%/6);border-radius:44% 56% 45% 55%;display:grid;place-items:center;color:#152a35;font-size:clamp(18px,2vw,30px);font-weight:700;background:radial-gradient(circle at 32% 25%,#fff8,transparent 48%),var(--color);box-shadow:0 0 19px color-mix(in srgb,var(--color),transparent 45%),2px 4px 6px #0008;transition:left .17s,top .17s;outline:1px solid #fff9}.grain small{font-size:12px;position:absolute;right:1px;bottom:0;background:#17323e;color:white;border-radius:50%;padding:1px 4px}.board-bottom{min-height:65px;gap:12px;font-size:12px;line-height:1.5;color:#b9d3d5}.board-bottom button{font-size:11px;white-space:nowrap;background:var(--amber);color:#152a35}.controls{text-align:center}.pad{display:grid;grid-template-columns:repeat(3,48px);grid-template-rows:repeat(3,48px);gap:5px;justify-content:center;margin-top:24px}.pad button{font-size:26px;padding:0}.up{grid-area:1/2}.left{grid-area:2/1}.right{grid-area:2/3}.down{grid-area:3/2}.pad-center{grid-area:2/2;display:grid;place-items:center;font:28px Georgia;color:var(--amber)}button{font:inherit;color:var(--ink);border:1px solid #4b6874;border-radius:8px;background:#203944;padding:11px 14px;cursor:pointer;transition:background .15s,transform .15s}button:hover{background:#345663}button:active{transform:translateY(2px)}button:focus-visible,a:focus-visible{outline:3px solid var(--amber);outline-offset:4px}button:disabled{opacity:.35;cursor:default}.keyboard{font-size:11px;line-height:1.8;color:var(--muted)}.keyboard span{color:#c4d8dc}.tools{display:grid;gap:9px;margin-top:27px}.tools button{font-size:11px;text-align:left;display:flex;justify-content:space-between}kbd{font:10px Arial;color:#8da9b2}.hint-note{font-size:11px;line-height:1.6;color:var(--muted);min-height:40px}#levels{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:25px 0}#levels button{text-align:left;background:#112832;color:var(--muted);font-size:11px;padding:15px}#levels button.current{border-color:var(--amber);color:var(--amber);background:#263638}#levels button strong{display:block;font:20px Georgia;margin-bottom:6px}footer{border-top:1px solid #34505a;padding:20px 0;display:flex;justify-content:space-between;font-size:8px;color:var(--muted)}dialog{max-width:610px;width:90%;background:#152e39;color:var(--ink);border:1px solid #637e83;border-radius:16px;padding:35px;line-height:1.8;font-size:14px}dialog::backdrop{background:#000a}dialog a{color:var(--amber)}#closeNotes{float:right;padding:3px 12px;font-size:25px}[hidden]{display:none!important}@media(max-width:1050px){main{padding:24px}.workspace{grid-template-columns:190px minmax(300px,1fr);gap:22px}.controls{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:25px}.controls>.eyebrow{display:none}.pad{margin:0;grid-template-columns:repeat(3,40px);grid-template-rows:repeat(3,38px)}.tools{margin:0;width:180px}.hint-note{max-width:140px}.intro{margin:25px 0}.brand span{display:none}}@media(max-width:650px){main{padding:18px}.edition{font-size:7px}.intro{display:block}.lead{font-size:12px;margin-top:16px}.workspace{display:flex;flex-direction:column;gap:15px}.brief{padding-top:0;width:100%}.brief h2{font-size:24px;margin-bottom:10px}.brief .eyebrow{margin:0}.brief p{margin:8px 0}.stats{margin:14px 0;padding:12px 0;justify-content:space-between}.stats strong{font-size:21px}.legend,.science{display:none}.board-wrap{width:100%}.controls{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}.controls .keyboard{grid-column:1;grid-row:2;margin:0}.controls .tools{grid-column:2;grid-row:1;width:auto}.hint-note{grid-column:2;grid-row:2;margin:0;max-width:none}.board-bottom{min-height:55px;font-size:11px}#levels{grid-template-columns:repeat(3,1fr);gap:8px}#levels button{padding:11px;font-size:10px}footer{font-size:7px;gap:20px;line-height:1.8}.grain{font-size:20px}.port small{font-size:5px;bottom:2px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
