:root{color-scheme:dark;--cream:#f8eed9;--muted:#b8c8bc;--gold:#e8bb77;--teal:#102e2c;--mint:#b5dec7}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 85% 5%,#24443a 0,transparent 45%),#0c2323;color:var(--cream);font:15px/1.6 ui-sans-serif,system-ui,-apple-system,sans-serif}.shell{max-width:1180px;margin:auto;padding:0 38px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #b5dec726;padding:24px 0}.brand{color:var(--cream);text-decoration:none;font-size:14px;letter-spacing:.17em;font-weight:650}.brand span{font-size:10px;color:var(--muted);margin-left:14px}button{font:inherit;cursor:pointer;color:var(--cream);background:#1c3a35;border:1px solid #7e9f8b66;border-radius:9px;padding:10px 17px;transition:background .18s,transform .18s,border-color .18s}button:hover{background:#35564a;border-color:var(--gold)}button:active{transform:scale(.96)}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}button:disabled{cursor:default;opacity:.4}#sound{font-size:12px;background:transparent;padding:8px 13px}.intro{display:flex;align-items:center;justify-content:space-between;padding:40px 0 32px}.eyebrow{font-size:10px;letter-spacing:.19em;font-weight:700;color:var(--gold);margin:0 0 10px}h1{font:normal clamp(44px,6vw,70px)/1.03 Georgia,serif;margin:12px 0 18px;letter-spacing:-.03em}h1 em{color:#e9c78c;font-weight:400}.lede{color:var(--muted);font-size:15px;line-height:1.7;margin:0}.intro-note{padding-right:36px;color:var(--muted);font-size:13px}.intro-note>span{color:var(--gold);font:28px Georgia,serif}.materials{display:flex;margin:16px 0 0}.materials img{width:58px;height:58px;border-radius:50%;margin-right:-6px;border:2px solid #496554}#chapters{display:flex;gap:8px;padding:18px 0 26px}#chapters button{flex:1;border-radius:6px;font-size:12px;background:transparent;padding:10px 4px;color:var(--muted)}#chapters button.active{background:#dac299;color:#172d27;border-color:#dac299}#chapters .seal{display:block;font-size:9px;height:12px;color:var(--gold);line-height:12px}#chapters button.active .seal{color:#486447}main{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(240px,1fr);gap:36px;align-items:start}.level-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}h2{font:normal 27px/1.2 Georgia,serif;margin:0}#chapter{margin-bottom:6px}.move-count{text-align:center;min-width:64px}.move-count strong{font:30px Georgia,serif;display:block;color:var(--gold)}.move-count span{display:block;font-size:10px;color:var(--muted)}#board{position:relative;width:100%;aspect-ratio:1;background:#14302c url('cabinet.webp') center/cover;border:1px solid #a8885d88;border-radius:20px;box-shadow:0 12px 45px #0005;isolation:isolate}#links{position:absolute;inset:0;width:100%;height:100%;z-index:-1}#links line{stroke:#d2af71;stroke-width:.5;stroke-dasharray:1 1;opacity:.65}.bead{position:absolute;transform:translate(-50%,-50%);width:17%;aspect-ratio:1;padding:0;background:none;border:0;border-radius:50%;box-shadow:0 5px 16px #0008;overflow:visible}.bead img{display:block;width:100%;border-radius:50%;border:2px solid #a88e6688}.bead:hover{background:transparent;transform:translate(-50%,-50%) scale(1.04)}.bead:active{transform:translate(-50%,-50%) scale(.97)}.bead.selected img{outline:3px solid var(--gold);outline-offset:3px}.bead.matched img{border:3px solid var(--mint);box-shadow:0 0 18px #b5dec744}.bead .charge{position:absolute;inset:23%;border-radius:50%;background:#0c2424e8;color:#fff2d5;display:grid;place-items:center;font:bold clamp(18px,2.6vw,28px) Georgia,serif;box-shadow:0 2px 10px #0005}.bead.negative .charge{color:#bfe8ec}.bead .name{position:absolute;top:-22px;left:0;right:0;font-size:10px;color:#e5d6b7;text-shadow:0 1px 4px #000}.bead .wish{position:absolute;top:103%;left:50%;transform:translateX(-50%);white-space:nowrap;background:#102b28ef;padding:1px 7px;border-radius:10px;font-size:11px;color:#dbc49f}.bead.matched .wish{color:var(--mint)}.contact{position:absolute;transform:translate(-50%,-50%);padding:0;width:40px;height:34px;border-radius:12px;background:#17342f;color:var(--gold);border:1px solid #b48e59;font-size:12px;box-shadow:0 3px 10px #0006}.contact:hover{transform:translate(-50%,-50%) scale(1.1)}.contact:active{transform:translate(-50%,-50%) scale(.94)}.contact.nudged{box-shadow:0 0 0 3px #f1cf8e,0 0 28px #e8bb7788}.toolbar{display:flex;gap:10px;margin:18px 0 12px}.toolbar button{flex:1;padding:10px 4px;font-size:13px}#status{font-size:13px;color:var(--muted);min-height:44px;margin:0 0 12px}aside{border-left:1px solid #b5dec726;padding-left:30px}.how h2{font-size:25px;margin:0 0 20px}.how ol{padding-left:20px;color:var(--muted);font-size:13px}.how li{padding-left:7px;margin-bottom:16px}.how b{color:#e8e5d1;font-weight:550}.example{color:#dfbf86;font-size:12px;background:#bcaa7410;border-left:2px solid #c6a46f;padding:11px 13px}.field-note{position:relative;border-top:1px solid #b5dec726;margin-top:28px;padding-top:23px}.field-note>p:not(.eyebrow){font-size:13px;color:var(--muted)}.star{color:var(--gold);font-size:35px;float:right;line-height:1}.hint-text{font-size:11px!important;color:#8fa89a!important}.journal{border-top:1px solid #b5dec726;margin-top:25px;padding-top:22px}.journal>p:not(.eyebrow){font-size:13px}#win{background:#c5dcbf12;border:1px solid #95bb98;border-radius:14px;padding:22px;margin-bottom:15px;align-items:center;gap:15px}#win:not([hidden]){display:flex}#win h2{font-size:23px}#win p:not(.eyebrow){font-size:12px;color:var(--muted);margin:6px 0}#win button{margin-left:auto;font-size:12px;white-space:nowrap;background:#c5dcbf;color:#183a2e}footer{display:flex;gap:30px;justify-content:space-between;border-top:1px solid #b5dec726;padding:24px 0 36px;margin-top:30px;color:#8fa89a;font-size:11px}footer>p{white-space:nowrap}details{max-width:540px}summary{cursor:pointer;color:#c4c8af}a{color:var(--gold)}@media(max-width:740px){.shell{padding:0 18px}.brand span{display:none}.intro{padding:30px 0 24px}.intro-note{padding:0}.intro-note>span{font-size:23px}.intro-note p{font-size:10px}.materials img{width:42px;height:42px}h1{font-size:46px}.eyebrow{font-size:8px}.lede{font-size:12px}main{display:block}aside{border-left:0;padding:25px 0 0;border-top:1px solid #b5dec726}.how h2{font-size:25px}.how ol{font-size:13px}.field-note{margin-top:22px}.bead .charge{font-size:23px}.bead .wish{font-size:10px}.bead .name{font-size:9px;top:-19px}.contact{width:34px;height:30px;font-size:11px}#chapters{gap:5px;padding:10px 0 24px}#chapters button{font-size:10px;padding:9px 2px}.level-head h2{font-size:25px}#win:not([hidden]){display:block}#win button{margin:14px 0 0}footer{display:block}footer>p{margin-top:0}#board{border-radius:15px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}