@font-face{font-family:ARLing Sans;src:url(/fonts/arling-sans.woff2);font-display:swap;font-weight:400 700}
@font-face{font-family:ARLing Serif;src:url(/fonts/arling-serif.woff2);font-display:swap;font-weight:400 600}
:root{--paper:#faf9f5;--ink:#141413;--body:#3d3d3a;--muted:#5e5d59;--line:#e4e2d8;--accent:#b23a1d;--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--body);font:18px/1.5 "ARLing Serif",Georgia,serif}a{color:inherit;text-underline-offset:4px}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:12px;background:white;padding:12px;z-index:10}header,main,footer{width:min(1180px,calc(100% - 40px));margin:auto}header{display:flex;justify-content:space-between;align-items:center;padding:28px 0;border-bottom:1px solid var(--line);font:14px/1.4 "ARLing Sans",sans-serif}header a{padding:10px 0}.brand{font-size:24px;font-weight:700;text-decoration:none;color:var(--ink);letter-spacing:-1px}.brand span{display:block;font-size:11px;font-weight:400;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted)}main{display:grid;gap:40px;padding-top:40px}.eyebrow{font:12px/1.4 "ARLing Sans",sans-serif;letter-spacing:1.8px;color:var(--muted);margin:0 0 16px}h1,h2{color:var(--ink);font-family:"ARLing Sans",sans-serif;font-weight:600;letter-spacing:-.045em;line-height:1.05;margin:0}h1{font-size:clamp(42px,5vw,70px)}h2{font-size:clamp(32px,3.2vw,44px)}.lead{font-size:21px;max-width:480px;margin:24px 0}.buy{display:flex;justify-content:center;align-items:center;min-height:52px;padding:14px 20px;background:var(--accent);color:white;border-radius:6px;text-decoration:none;font:600 16px/1.4 "ARLing Sans",sans-serif;width:fit-content;max-width:100%;transition:background .18s var(--ease),transform .18s var(--ease)}.buy:active,button:active{transform:translateY(1px)}.price{font-size:14px;line-height:1.5;max-width:390px;color:var(--muted);margin:12px 0}.sample{display:inline-flex;align-items:center;min-height:44px;font:500 15px/1.4 "ARLing Sans",sans-serif;margin:4px 0}.included{font-size:16px;border-top:1px solid var(--line);padding-top:20px;margin-top:20px;color:var(--muted)}.lesson{background:white;border:1px solid var(--line);border-radius:12px;padding:24px;box-shadow:0 12px 32px #14141306}.lesson-heading{display:flex;gap:16px;justify-content:space-between;align-items:center}.lesson-heading h2{font-size:24px;letter-spacing:-.035em}.lesson-heading span{font:10px/1.5 "ARLing Sans",sans-serif;color:var(--muted);white-space:nowrap}.instruction{font-size:15px;line-height:1.5;color:var(--muted);margin:12px 0 4px}.board-wrap{max-width:410px;margin:12px auto}svg{display:block;width:100%;height:auto;overflow:visible}.cell{fill:#fff;stroke:#ddd9cf;stroke-width:1}.filled{fill:var(--ink);stroke:var(--ink)}.cross{stroke:#96948c;stroke-width:1.3}.clue{fill:var(--ink);font:500 16px "ARLing Sans",sans-serif}.clue-active{fill:var(--accent);font-weight:700}.recent{animation:reveal .18s var(--ease)}@keyframes reveal{from{opacity:.25}to{opacity:1}}.explanation{border-top:1px solid var(--line);padding-top:18px;min-height:134px}.explanation span{font:11px/1.5 "ARLing Sans",sans-serif;letter-spacing:1.5px;color:var(--accent)}.explanation p{margin:8px 0 20px;font-size:16px;line-height:1.5}.controls{display:flex;gap:12px;align-items:stretch}button{cursor:pointer;min-height:48px;border:1px solid var(--line);border-radius:6px;font:500 15px/1.3 "ARLing Sans",sans-serif;padding:12px 16px;background:var(--paper);color:var(--ink)}#next{flex:1;text-align:left;display:flex;justify-content:space-between;gap:10px;background:var(--ink);color:white;border-color:var(--ink)}#restart{padding:12px}.progress{margin:12px 0 0;font-size:13px;color:var(--muted)}.print{grid-column:1/-1;border-top:1px solid var(--line);padding:48px 0 64px;display:grid;gap:32px;align-items:center}.print figure{margin:0}.print img{width:100%;height:auto;border-radius:8px;display:block}.print figcaption{font-size:13px;line-height:1.4;color:var(--muted);padding:12px 0}.print p:not(.eyebrow){max-width:540px}.print .buy{margin-top:24px}.print .sample{margin-top:12px}footer{border-top:1px solid var(--line);padding:20px 0 32px;font-size:13px;color:var(--muted)}footer nav{display:flex;flex-wrap:wrap;gap:20px}footer nav a{display:flex;align-items:center;min-height:44px}@media(min-width:800px){main{grid-template-columns:1fr 1fr;gap:56px;padding-top:64px}.intro{padding-top:32px}.print{grid-template-columns:1fr 1fr;gap:56px;margin-top:24px}.print figure{max-width:450px}}@media(max-width:420px){header,main,footer{width:calc(100% - 32px)}header{padding:16px 0}.lesson{padding:16px}.lesson-heading{gap:8px}.lesson-heading h2{font-size:22px}.buy{width:100%;font-size:15px}.lead{font-size:20px}.explanation{min-height:148px}button{font-size:14px;padding:12px}header>a:last-child{font-size:12px}}@media(hover:hover){.buy:hover{background:#8f2e17}button:hover{border-color:var(--ink)}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

[hidden]{display:none!important}.recent rect{stroke:var(--accent);stroke-width:2}.recent .cross{stroke:var(--accent);stroke-width:1.8}#completed{width:100%;margin-top:16px}
.modes,.tools,.actions{display:flex;gap:6px;flex-wrap:wrap}.modes{margin:18px 0 12px}.modes button{flex:1;font-size:13px}.tools button{flex:1;padding:10px;font-size:13px}.actions{margin:8px 0}.actions button{flex:1;min-height:44px;font-size:13px;padding:8px}button[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}button:disabled{opacity:.45;cursor:default}.keyboard-help{font:12px/1.5 "ARLing Sans",sans-serif;color:var(--muted);margin:0 0 18px}#grid{touch-action:none;user-select:none;cursor:crosshair}#grid [role=gridcell]:focus-visible{outline:none}#grid [role=gridcell]:focus-visible rect{stroke:var(--accent);stroke-width:3}.wrong rect{stroke:var(--accent);stroke-width:4}.wrong .cross{stroke:var(--accent);stroke-width:3}
#board.playing{touch-action:none}
