@font-face{font-family:Outfit;src:url('./fonts/Outfit.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'Public Sans';src:url('./fonts/PublicSans.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
:root{--ink:#173f39;--muted:#61716a;--paper:#f6f5ef;--line:#d9e1d8;--orange:#b25630;--green:#d9e9c9;--serif:Georgia,'Times New Roman',serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:15px;line-height:1.5}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;min-height:44px;border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 15px}button:hover{background:#edf2e8}button:focus-visible,a:focus-visible{outline:3px solid #b25630;outline-offset:3px}button:disabled{opacity:.45;cursor:default}[hidden]{display:none!important}.header{max-width:1180px;margin:auto;padding:25px 30px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-family:var(--serif);font-size:27px;line-height:1.1}.brand svg{width:40px;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.brand-sub{display:block;font:8px/1.8 sans-serif;letter-spacing:2.5px;margin-top:5px}.text-button{background:none;border:0;padding:8px 4px;font-size:13px;font-weight:600}.intro{max-width:1120px;margin:42px auto 32px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;margin:0 0 12px}h1{font:normal clamp(38px,5vw,59px)/1.07 var(--serif);letter-spacing:-2px;margin:0 0 15px}h1 em{font-weight:normal;color:#6d806a}p{color:var(--muted)}.intro>p:last-child{margin:0}.layout{max-width:1120px;margin:auto;display:grid;grid-template-columns:minmax(0,660px) 1fr;gap:44px;align-items:start}.game-card{padding:26px;background:white;border:1px solid var(--line);border-radius:20px;box-shadow:0 8px 32px #173f3906}.game-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.game-heading h2{font:normal 30px var(--serif);margin:0}.game-heading .eyebrow{margin-bottom:5px;color:var(--orange)}.badge{font-size:11px;border:1px solid var(--line);border-radius:30px;padding:7px 12px;white-space:nowrap}.tabs{display:flex;background:#f2f4ee;padding:4px;border-radius:10px;gap:4px;margin:22px 0}.tabs button{flex:1;background:transparent;border:0;font-size:13px;min-height:40px}.tabs button[aria-pressed=true]{background:white;box-shadow:0 2px 4px #173f3910;font-weight:600}.board-top{display:flex;justify-content:space-between;gap:12px;font-size:11px;margin-bottom:12px;align-items:center}.tile-count{white-space:nowrap;background:#eff3e9;padding:5px 9px;border-radius:5px}.board-wrap{position:relative;padding:16px;background:#e7efed;border:1px solid #d3e3df;border-radius:12px;isolation:isolate}.board{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;aspect-ratio:1}.cell{position:relative;aspect-ratio:1;min-height:0;min-width:0;padding:0;border:1px solid #c7d6b8;background:#dfeccf;border-radius:8px;font-size:22px;touch-action:manipulation;color:var(--ink)}.cell:hover{background:#d1e3bb}.cell.rock{background:#c8d4cf;border-color:#bccbc5}.cell.rock svg{width:40%;opacity:.75}.cell.on-path{background:#d0dfbb}.cell.start-cell{background:#214f45;color:white;border-color:#214f45}.cell.end-cell{background:#f8e5ba;border-color:#e5ce9e;color:#8e582c}.cell.village-cell{background:#f8f2df;border-color:#e1d9bb}.cell svg{width:45%;vertical-align:middle}.cell .village-number{position:absolute;right:4px;top:1px;font-size:12px;font-weight:bold}.cell .marker{position:relative;z-index:2;display:inline-block}.cell.next-hint{outline:3px solid var(--orange);outline-offset:-4px;box-shadow:inset 0 0 0 6px #fff8}.cell.current::after{content:'';position:absolute;width:10px;height:10px;border:3px solid white;background:#244f43;border-radius:50%;bottom:5px;left:calc(50% - 5px);z-index:3}#route{position:absolute;inset:16px;width:calc(100% - 32px);height:calc(100% - 32px);pointer-events:none;z-index:1;overflow:visible}#route polyline{fill:none;stroke:#fff8d6;stroke-width:16;stroke-linecap:round;stroke-linejoin:round}#route .outline{stroke:#72936b;stroke-width:22}.compass{position:absolute;font-size:7px;right:4px;top:3px;color:#718f83}.legend{display:flex;justify-content:center;gap:17px;margin:13px 0;font-size:10px;color:var(--muted)}.legend span{display:flex;align-items:center;gap:5px}.key{width:8px;height:8px;border-radius:2px;border:1px solid #0002}.key.start{background:#214f45}.key.village{background:#f8f2df}.key.end{background:#f8e5ba}.key.rock{background:#c8d4cf}.status{font-size:12px;min-height:36px;text-align:center;margin:14px 0 12px}.controls{display:flex;gap:8px}.controls button{flex:1;font-size:14px;background:#f8f9f5}.controls button span{font-size:12px}.note{background:#e8eddc;border-radius:16px;padding:30px;position:relative}.note-number{font-size:9px;letter-spacing:1.8px;color:#708363}.note h2{font:normal 43px/1.1 var(--serif);letter-spacing:-1px;margin:23px 0 18px}.note p,.note li{font-size:13px;line-height:1.8}.note ul{padding-left:17px;margin:22px 0}.note li{padding-left:5px;margin:10px 0;color:#4f6554}.note-foot{font-size:11px;border-top:1px solid #cdd7be;padding-top:20px;font-style:italic}.stats{display:flex;margin:20px 0;border:1px solid var(--line);border-radius:12px;padding:22px 12px}.stats div{flex:1;text-align:center}.stats div+div{border-left:1px solid var(--line)}.stats strong{display:block;font:normal 32px var(--serif)}.stats span{font-size:10px;color:var(--muted)}.install{padding:8px 10px}.install h3{font:normal 23px var(--serif);margin:8px 0}.install p{font-size:12px;line-height:1.8}.install .small{font-size:10px;color:#52775e}.bottom{text-align:center;margin:58px 20px}.bottom h2{font:normal 30px var(--serif);margin:10px}.bottom p:last-child{font-size:13px}footer{max-width:1120px;border-top:1px solid var(--line);margin:0 auto;padding:25px 0 35px;display:flex;justify-content:space-between;font-size:11px;color:var(--muted);gap:20px}footer div{display:flex;align-items:center;gap:22px}.dot{padding:0 8px}.success{background:#edf4e6;border:1px solid #d8e5ca;border-radius:12px;padding:24px;text-align:center;margin-top:18px}.success h3{font:normal 29px var(--serif);margin:12px 0}.success p{font-size:13px}.primary{background:var(--ink);color:white;border:0}.primary:hover{background:#285b4e}.success .text-button{display:block;margin:12px auto 0}textarea{width:100%;min-height:100px;margin-top:10px}#practice-nav{display:flex;justify-content:space-between;align-items:center;margin-top:20px;font-size:12px}#practice-nav button{font-size:12px}dialog{max-width:460px;width:calc(100% - 32px);border:1px solid var(--line);border-radius:20px;padding:30px;color:var(--ink);background:var(--paper)}dialog::backdrop{background:#173f3977;backdrop-filter:blur(3px)}dialog h2{font:normal 30px var(--serif);margin:5px 20px 20px 0}dialog p,dialog li{font-size:14px;line-height:1.8}dialog ol{padding-left:20px}.close{position:absolute;right:10px;top:10px;border:0;background:none;font-size:25px}dialog .primary{width:100%;margin-top:12px}.example{display:flex;align-items:center;justify-content:center;gap:12px;background:#e7eddc;padding:15px;border-radius:12px;font-size:24px}.example span{font-size:14px}.storage-warning{color:#a34627!important}
@media(min-width:1100px){.intro h1 br{display:none}.intro h1 em{margin-left:10px}}@media(max-width:1180px){.intro,.layout,footer{margin-left:30px;margin-right:30px}}@media(max-width:780px){.layout{grid-template-columns:1fr;max-width:580px;margin:auto;gap:24px}.intro{max-width:580px;margin:28px auto 24px;padding:0 18px}.header{padding:18px}.brand{font-size:23px}.brand svg{width:32px}.brand-sub{font-size:7px}.header .text-button{font-size:12px}.game-card{padding:18px;border-radius:16px}.layout{padding:0 12px}.note{padding:24px}.note h2{font-size:32px}.note h2 br{display:none}.stats{margin:16px 0}.install{padding:4px 12px}.bottom{margin:32px 20px}footer{margin:0 20px;flex-direction:column;gap:8px;padding:20px 0}.intro p:last-child{font-size:13px}h1{letter-spacing:-1px}.board-wrap{padding:10px}#route{inset:10px;width:calc(100% - 20px);height:calc(100% - 20px)}.board{gap:3px}.board-top{font-size:10px}.cell{border-radius:6px}.legend{gap:10px;font-size:9px}.cell .village-number{font-size:10px}.game-heading h2{font-size:27px}.badge{padding:6px 9px}.tabs{margin:18px 0}.controls button{padding:8px 5px}.bottom h2{font-size:26px}}@media(prefers-reduced-motion:no-preference){button{transition:background .15s}.success{animation:appear .3s ease-out}@keyframes appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}}
.cell .village-number{position:absolute;z-index:3;line-height:1;top:4px;right:4px}
@media(max-width:780px){.intro{margin-top:20px;margin-bottom:20px}.intro h1{font-size:38px}.intro .eyebrow{font-size:9px;letter-spacing:1.6px}.intro p:last-child{max-width:330px}.board-wrap{margin-top:0}}

/* A clear, friendly app voice: upright geometric headings and readable controls. */
:root{--serif:Outfit,-apple-system,BlinkMacSystemFont,sans-serif}
body{font-family:'Public Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.brand{font-weight:600;letter-spacing:-.8px}.brand-sub{font-family:'Public Sans',sans-serif;font-weight:500;letter-spacing:1.9px}
h1{font-weight:550;letter-spacing:-1.9px;line-height:1.12}h1 em{font-style:normal;font-weight:550;color:#6d806a}
.game-heading h2{font-weight:550;letter-spacing:-.5px}.note h2{font-weight:500;letter-spacing:-1px}.stats strong{font-weight:550}.install h3,.bottom h2,.success h3,dialog h2{font-weight:500;letter-spacing:-.5px}
.note-foot{font-style:normal}.eyebrow{letter-spacing:1.4px;font-weight:650}.status{font-size:12px;line-height:1.6}
@media(max-width:780px){h1{letter-spacing:-1px}.intro h1{font-size:36px}.brand{font-size:24px}.brand-sub{letter-spacing:1.5px}}
.puzzle-chooser{max-width:1120px;margin:0 auto 26px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.puzzle-chooser button{display:flex;align-items:center;gap:13px;text-align:left;padding:17px;background:#fff;border-radius:14px}.puzzle-chooser button[aria-pressed=true]{border:2px solid #315e4d;background:#edf3e5;padding:16px}.choice-icon{font:500 24px Outfit,sans-serif;background:#e8eedc;display:grid;place-items:center;width:47px;height:47px;border-radius:10px;flex-shrink:0}.puzzle-chooser strong{display:block;font:550 20px Outfit,sans-serif}.puzzle-chooser small{display:block;font-size:10px;margin-top:4px;color:var(--muted)}.choice-tag{margin-left:auto;font-size:9px;letter-spacing:1px}.extra-instruction{font-size:13px}.number-grid{display:grid;grid-template-columns:repeat(3,1fr) 60px;gap:10px;max-width:420px;margin:28px auto 0}.number-cell{aspect-ratio:1;font:500 37px Outfit,sans-serif;background:#f3f2e6;border:2px solid #d8dfcb}.number-cell.selected{border-color:#245948;background:#e6efda;box-shadow:0 0 0 2px #24594822}.sum-target{display:flex;align-items:center;justify-content:center;gap:5px;flex-wrap:wrap;font-size:20px;border-radius:9px;background:#f1f3ed;padding:8px}.sum-target small{font-size:12px;color:var(--muted)}.sum-target.matched{background:#dcebd3}.number-caption{text-align:center;font-size:11px}.number-bank{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:20px auto}.number-bank button{min-width:46px;font-weight:600}.number-bank button.used{background:#e4ebdc;border-style:dashed}.word-progress{font-size:10px;letter-spacing:2px;text-align:center;margin-top:30px}.word-clue{font:500 24px/1.4 Outfit,sans-serif;text-align:center;max-width:420px;margin:20px auto 30px}.word-slots,.letter-bank{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin:20px auto}.word-slots button,.letter-bank button{width:48px;height:52px;padding:3px;font:500 23px Outfit,sans-serif}.word-slots button{background:#edf2e5;border-bottom:3px solid #98ac84}.word-slots button:disabled{opacity:1;color:#87957d}.letter-bank button{background:#f7ead2}.letter-bank button:disabled{opacity:.3}.word-finish{padding:24px;text-align:center;font:500 25px Outfit,sans-serif;letter-spacing:3px}.extra-nav{display:flex;align-items:center;justify-content:space-between;font-size:12px;margin-top:20px}.extra-nav button{font-size:12px}.controls .primary{background:var(--ink);color:white}.extra-nav~*{margin-top:15px}
@media(max-width:1180px){.puzzle-chooser{margin-left:30px;margin-right:30px}}@media(max-width:780px){.puzzle-chooser{max-width:556px;margin:0 auto 20px;padding:0 12px;grid-template-columns:1fr;gap:7px}.puzzle-chooser button{padding:10px 13px}.puzzle-chooser button[aria-pressed=true]{padding:9px 12px}.choice-icon{width:36px;height:36px;font-size:20px}.puzzle-chooser strong{font-size:18px}.puzzle-chooser small{margin-top:1px}.number-grid{gap:7px;grid-template-columns:repeat(3,1fr) 48px}.number-cell{font-size:30px}.sum-target{font-size:17px;padding:4px}.word-slots,.letter-bank{gap:5px}.word-slots button,.letter-bank button{width:43px;height:48px}.word-clue{font-size:22px}}
