:root{--paper: #f3e6c8;--paper-deep: #e7d3a4;--cream: #fff8ea;--ink: #1d2b24;--ink-soft: #3d5248;--sea: #8fbfb8;--sea-deep: #1f4f55;--amber: #f0a202;--coral: #e36414;--leaf: #5f7f3a;--good: #1f7a6b;--danger: #9d2c2c;--line: 3px solid var(--ink);--shadow: 5px 5px 0 var(--ink);--dock: 76px;--font: "Figtree", "Avenir Next", "Segoe UI", sans-serif;--display: "Fraunces", "Iowan Old Style", Palatino, serif;color:var(--ink);font-family:var(--font);background:var(--sea-deep)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden}button,input{font:inherit;color:inherit}button{min-height:48px;min-width:48px;padding:10px 14px;border:var(--line);border-radius:14px;background:var(--cream);box-shadow:3px 3px 0 var(--ink);cursor:pointer;touch-action:manipulation}button:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--amber);font-weight:700}button.icon{min-width:72px}button:focus-visible{outline:3px solid var(--coral);outline-offset:2px}#app{height:100%}#map{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;touch-action:none;display:block}#grain{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.22;mix-blend-mode:multiply;background-image:radial-gradient(rgba(29,43,36,.35) .6px,transparent .7px);background-size:3px 3px}#hud,#dock,#maptools,#tutorial,#sheet,#modal,#menu,#toasts,#draglabel{position:fixed;z-index:5}#hud{top:0;left:0;right:0;padding:calc(8px + env(safe-area-inset-top)) 12px 8px;background:linear-gradient(180deg,rgba(255,248,234,.94),rgba(255,248,234,.78) 80%,transparent)}.hud-row,.stats,.row{display:flex;gap:8px;align-items:center}.hud-row{justify-content:space-between}.brand{display:flex;flex-direction:column;min-width:0}.brand strong{font-family:var(--display);font-size:1.15rem;letter-spacing:-.03em}.brand span,.rates,.note,.meta{color:var(--ink-soft)}.rates{margin:2px 0 0;font-size:.78rem}.stats{margin-top:6px;flex-wrap:wrap}.stats span{background:var(--cream);border:2px solid var(--ink);border-radius:999px;padding:4px 10px;font-size:.92rem}.stats .coin{background:var(--amber)}.stats .key{background:#f6d3b4}.xp{height:8px;margin-top:6px;background:#1d2b2426;border-radius:99px;overflow:hidden}.xp span{display:block;height:100%;background:var(--leaf)}#maptools{right:10px;top:46%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px;z-index:6}#maptools button{width:52px;padding:0;font-weight:700;font-size:1.2rem}#dock{left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;z-index:7}#dock button{padding:8px 4px;font-size:.82rem;font-weight:700}#dock button.ready{background:var(--amber)}#dock button.armed{background:#f6d3b4}#draglabel{z-index:9;pointer-events:none;background:var(--ink);color:var(--cream);padding:6px 10px;border-radius:999px;font-weight:700}#tutorial,#sheet,.modal-card,.menu-copy{background:var(--cream);border:var(--line);box-shadow:var(--shadow);border-radius:18px}#tutorial{left:12px;right:12px;bottom:calc(var(--dock) + 18px + env(safe-area-inset-bottom));z-index:8;padding:12px 14px;max-width:560px}#tutorial h2,.sheet-head h2,.modal-card h2{font-family:var(--display);margin:0;font-size:1.35rem}#tutorial .kicker,.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:700;color:var(--coral);margin:0 0 4px}#sheet{z-index:14;left:10px;right:10px;bottom:calc(var(--dock) + 16px + env(safe-area-inset-bottom));max-height:min(64vh,620px);overflow:auto;padding:14px;max-width:760px;margin:0 auto}.sheet-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.sheet-head p,.note{margin:4px 0 10px}.row.wrap{flex-wrap:wrap}.board{display:flex;flex-direction:column;gap:10px;margin:0 0 12px}.tier-row{border:2px solid var(--ink);border-radius:14px;padding:8px;background:#fff8ea}.tier-row header{display:flex;justify-content:space-between;font-weight:700}.slots{display:flex;flex-wrap:wrap;gap:6px;min-height:42px;margin:8px 0;align-items:center}.token{width:54px;height:36px;border:2px solid var(--ink);border-radius:10px;display:grid;place-items:center;background:#f6d3b4}.token.fresh{outline:3px solid var(--coral);background:var(--amber)}.token.tier-1{background:#f7f1e3}.token.tier-2{background:#d7efe6}.token.tier-3{background:#f6d3b4}.token.tier-4{background:#f0a202}.token.tier-5{background:#e36414}.token.tier-6{background:#1f7a6b;color:#fff8ea}.glyph{width:42px;height:22px;fill:#1d2b24}.glyph.g2{fill:#9a3412}.glyph.g3{fill:#1f4f55}.glyph.g4{fill:#5f7f3a}.slots .more{font-weight:700}.bins,.goals{list-style:none;padding:0;margin:0 0 12px}.bins li,.goals li,.quest{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid rgba(29,43,36,.12)}.goals li.done span{text-decoration:line-through}.card-grid,.continents{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}.card,.quest,.continents button{text-align:left}.card{padding:10px;box-shadow:none}.card .rarity{margin:0;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}.card h3{margin:2px 0;font-family:var(--display)}.card p{margin:0;font-size:.88rem}.pips{display:flex;gap:4px;margin-top:8px}.pips i{width:12px;height:12px;border:2px solid var(--ink);border-radius:99px;display:block}.pips i.on{background:var(--ink)}.rarity-common{background:#f7f1e3}.rarity-rare{background:#d7efe6}.rarity-epic{background:#f6d3b4}.rarity-legendary{background:#f0a202}.card.locked{opacity:.72}.bar,.quest .bar{height:8px;background:#1d2b241f;border-radius:99px;overflow:hidden;width:100%}.bar span{display:block;height:100%;background:var(--good)}.quest{display:block}.help h3{font-family:var(--display);margin:12px 0 4px}.pick-list{display:flex;flex-direction:column;gap:8px}.pick-list button{width:100%;text-align:left}.help p{margin:0 0 8px}#modal{top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;padding:18px;background:#1f4f5573}#modal[hidden],#sheet[hidden],#tutorial[hidden],#menu[hidden],#draglabel[hidden]{display:none}.modal-card{max-width:440px;padding:18px}#toasts{top:32%;right:12px;left:auto;z-index:18;display:flex;flex-direction:column;gap:6px;pointer-events:none;width:min(260px,46vw)}#toasts p{margin:0;background:var(--ink);color:var(--cream);padding:8px 12px;border-radius:12px}#menu{top:0;right:0;bottom:0;left:0;z-index:10;display:grid;grid-template-columns:minmax(240px,.9fr) minmax(280px,1.1fr);background:radial-gradient(circle at 20% 20%,rgba(255,248,234,.35),transparent 40%),linear-gradient(160deg,#d7efe6,#2f6f74 70%);overflow:auto}.menu-art{position:relative;min-height:280px;display:grid;place-items:center}.atlas{width:min(420px,90%);height:auto;filter:drop-shadow(8px 10px 0 rgba(29,43,36,.25))}.atlas .sheet{fill:var(--paper);stroke:var(--ink);stroke-width:6}.atlas .road{fill:none;stroke:var(--ink);stroke-width:8;stroke-linecap:round}.atlas .town path,.atlas .town rect{stroke:var(--ink);stroke-width:2}.atlas .town path{fill:#e36414}.atlas .town.alt path{fill:#f0a202}.atlas .town rect{fill:#fff8ea}.menu-car{fill:#1d2b24;offset-path:path("M70,168 C140,108 180,228 268,148");offset-rotate:0deg;animation:drive 6.5s linear infinite}.stamp{position:absolute;right:12%;bottom:14%;margin:0;border:3px solid var(--coral);color:var(--coral);font-family:var(--display);font-size:2rem;padding:4px 10px;transform:rotate(-8deg);background:#fff8eacc}.menu-copy{align-self:center;margin:24px;padding:22px;max-width:640px}.menu-copy h1{font-family:var(--display);font-weight:560;font-size:clamp(2.4rem,6vw,4.4rem);line-height:.92;letter-spacing:-.04em;margin:0 0 12px}.menu-copy h1 span{display:block;font-size:.46em;letter-spacing:0;color:#24352c}.lede{font-size:1.12rem;margin:0 0 8px;color:var(--ink)}.menu-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.menu-copy>*{animation:rise .7s ease both}.menu-copy>*:nth-child(2){animation-delay:.05s}.menu-copy>*:nth-child(3){animation-delay:.12s}.menu-copy>*:nth-child(4){animation-delay:.18s}@keyframes rise{0%{transform:translateY(8px)}to{transform:none}}@keyframes drive{to{offset-distance:100%}}.hud.shake,#hud.shake{animation:shake .4s linear}@keyframes shake{25%{transform:translate(-3px)}75%{transform:translate(3px)}}body[data-mode=menu] #hud,body[data-mode=menu] #dock,body[data-mode=menu] #maptools,body[data-mode=menu] #tutorial{display:none}.boot-error{padding:24px;color:var(--cream)}@media(max-width:800px){#menu{grid-template-columns:1fr}.menu-art{min-height:200px}.menu-copy{margin:12px}#dock button{font-size:.75rem}}@media(prefers-reduced-motion:reduce){.menu-copy>*,.menu-car,#hud.shake{animation:none}}