@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;700&display=swap');
:root{--ink:#173536;--paper:#eaf4f2;--blue:#a9d8ea;--green:#86bd9d;--coral:#ef846f;--line:#8db5b0;--cream:#f8fbf4}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}header{height:72px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 5vw}.brand{font-weight:700;font-size:20px;color:var(--ink);text-decoration:none;letter-spacing:-.04em}.mark{display:inline-grid;place-items:center;width:28px;height:28px;background:var(--ink);color:var(--paper);margin-right:8px;font-size:18px}nav{display:flex;gap:24px;align-items:center}nav a,.ghost{font:500 12px 'DM Mono';text-transform:uppercase;color:var(--ink);text-decoration:none;background:none;border:0;cursor:pointer}.ghost{border-bottom:1px solid var(--ink);padding:5px 0}.intro{max-width:1200px;margin:0 auto;padding:8vw 5vw 5vw;display:flex;justify-content:space-between;gap:40px}.eyebrow,.label{font:500 11px 'DM Mono';letter-spacing:.1em}.eyebrow{color:#47716c}.intro h1{font-size:clamp(52px,7vw,96px);line-height:.92;letter-spacing:-.08em;margin:25px 0}.intro h1 em{font-style:normal;color:#4e8b73}.lede{max-width:400px;font-size:18px;line-height:1.45}.legend{display:flex;gap:18px;margin-top:35px;font:11px 'DM Mono';text-transform:uppercase}.dot,.swatch{display:inline-block;width:12px;height:12px;border:1px solid var(--ink);margin-right:7px;vertical-align:-2px}.blue,.water{background:var(--blue)}.green,.grove{background:var(--green)}.coral,.kiln{background:var(--coral)}.stats{display:flex;gap:36px;align-self:end}.stats b{display:block;font-size:48px;letter-spacing:-.08em}.stats small{font:10px 'DM Mono';text-transform:uppercase}.workspace{max-width:1200px;margin:0 auto;padding:0 5vw 8vw;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px}.board-wrap{border:1px solid var(--ink);background:var(--cream);padding:18px}.board-head,.board-foot{display:flex;justify-content:space-between;font:11px 'DM Mono';text-transform:uppercase}.board-head{padding-bottom:15px;border-bottom:1px solid var(--line)}.board{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;padding:20px 0}.cell{aspect-ratio:1.2;border:1px dashed #a8c6c1;background:#eef8f2;cursor:pointer;transition:.15s;display:grid;place-items:center;font:10px 'DM Mono'}.cell:hover{background:#d9eee7}.cell.filled{border-style:solid}.cell.invalid{animation:shake .25s;background:#f8c8bd}.cell .arrow{font-size:18px}.board-foot{border-top:1px solid var(--line);padding-top:15px;color:#47716c}.mono{font:10px 'DM Mono'}.panel{border:1px solid var(--ink);background:#dcece7;padding:20px}.panel-tabs{display:flex;gap:18px;border-bottom:1px solid var(--line);margin:-20px -20px 20px;padding:16px 20px}.panel-tabs button{font:11px 'DM Mono';border:0;background:none;color:#47716c}.panel-tabs .active{color:var(--ink);border-bottom:1px solid var(--ink)}.tile-list{display:grid;gap:8px}.tile-choice{border:1px solid var(--line);padding:12px;background:transparent;text-align:left;display:flex;align-items:center;gap:10px;color:var(--ink);cursor:pointer}.tile-choice.active{border:2px solid var(--ink);padding:11px}.tile-choice b,.tile-choice small{display:block}.tile-choice small{font:10px 'DM Mono';margin-top:3px;color:#47716c}.selection{font:11px 'DM Mono';padding:18px 0}.primary{width:100%;border:1px solid var(--ink);background:var(--ink);color:var(--cream);padding:13px;text-align:left;font:12px 'DM Mono';cursor:pointer;display:flex;justify-content:space-between}.save-state{font:11px;line-height:1.4;color:#47716c}.rule-copy{border-top:1px solid var(--line);margin-top:25px;padding-top:20px;font-size:13px;line-height:1.45}.rule-copy p{margin:12px 0}.hint{color:#47716c;font-size:12px}.archive{border-top:1px solid var(--ink);max-width:1200px;margin:auto;padding:7vw 5vw;display:grid;grid-template-columns:1fr 1fr;gap:10vw}.archive h2{font-size:clamp(36px,5vw,64px);line-height:.95;letter-spacing:-.07em;margin:20px 0}.archive>p{font-size:18px;line-height:1.5;max-width:440px}footer{border-top:1px solid var(--line);padding:20px 5vw;display:flex;justify-content:space-between;font:10px 'DM Mono';text-transform:uppercase;color:#47716c}@keyframes shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@media(max-width:760px){header{padding:0 20px}nav a{display:none}.intro{padding:60px 20px 40px;display:block}.intro h1{font-size:62px}.stats{margin-top:40px}.workspace{display:block;padding:0 20px 70px}.panel{margin-top:16px}.board-wrap{padding:12px}.board{gap:3px;padding:12px 0}.cell{font-size:8px}.archive{display:block;padding:60px 20px}.archive>p{margin-top:35px}footer{padding:18px 20px;display:block}footer span{display:block;margin:5px 0}}