/* Hallmark · macrostructure: inhabited landscape / field journal · tone: abandoned, tactile, survival · anchor hue: ochre · theme: custom, existing game brand · Barlow Condensed + Barlow */
/* Hallmark · pre-emit critique: P4 H5 E4 S5 R4 V5 */
@import url('tokens.css');
@font-face{font-family:WalkerDisplay;src:url('assets/display.ttf') format('truetype');font-display:swap}@font-face{font-family:WalkerBody;src:url('assets/body.ttf') format('truetype');font-display:swap}
*{box-sizing:border-box}html,body{overflow-x:clip}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;background:var(--color-paper);color:var(--color-ink);font:18px/1.6 var(--font-body)}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--font-display);font-weight:600;font-style:normal;line-height:1.02;overflow-wrap:anywhere;min-width:0}h2{font-size:clamp(40px,5.1vw,76px);text-transform:uppercase}p{max-width:62ch}button,a{touch-action:manipulation}a:focus-visible,button:focus-visible{outline:2px solid var(--color-focus);outline-offset:5px}a:active,button:active{transform:translateY(2px)}button:disabled{opacity:.55;cursor:not-allowed}::selection{background:var(--color-accent);color:var(--color-paper)}.skip{position:absolute;top:-100px;z-index:20;padding:var(--space-sm);background:var(--color-paper)}.skip:focus{top:0}.topbar{height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;border-bottom:1px solid var(--color-rule);position:relative;z-index:3;background:var(--color-paper)}.wordmark{font:24px/1 var(--font-display);letter-spacing:.06em}.wordmark span{color:var(--color-muted);margin:0 var(--space-xs)}nav{display:flex;align-items:center;gap:var(--space-lg);font:18px/1 var(--font-display);text-transform:uppercase}nav a{white-space:nowrap}nav a:hover,.text-link:hover,.downloads a:hover{color:var(--color-accent)}.nav-play{border-left:1px solid var(--color-rule);padding-left:var(--space-lg);color:var(--color-accent)}.hero{position:relative;min-height:730px;height:calc(100svh - 80px);max-height:1000px;isolation:isolate;display:flex;align-items:center}.hero-world{position:absolute;inset:0;z-index:-3;overflow:clip;background:var(--color-paper)}.hero-world img,.hero-world canvas{position:absolute;width:100%;height:100%;object-fit:cover;object-position:70% center;image-rendering:pixelated}.hero-world img{opacity:.9}.hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--color-paper) 0%,color-mix(in oklch,var(--color-paper) 94%,transparent) 24%,color-mix(in oklch,var(--color-paper) 40%,transparent) 65%,color-mix(in oklch,var(--color-paper) 12%,transparent)),linear-gradient(0deg,var(--color-paper),transparent 28%)}.hero-copy{padding:var(--space-2xl) 5vw var(--space-3xl);width:min(760px,68%)}.eyebrow{font:15px/1.4 var(--font-display);letter-spacing:.14em;color:var(--color-accent)}.status-dot{display:inline-block;width:6px;height:6px;background:var(--color-accent);margin-right:var(--space-xs);vertical-align:middle}.logo{width:100%;height:auto;display:block;margin:var(--space-md) 0 var(--space-lg);max-width:590px}h1{font-size:clamp(42px,4.5vw,68px);text-transform:uppercase}h1 span,h2 span{color:var(--color-muted)}.intro{margin-top:var(--space-md);font-size:19px;color:var(--color-muted)}.hero-actions{display:flex;align-items:center;gap:var(--space-lg);margin-top:var(--space-lg)}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:var(--space-lg);background:var(--color-accent);color:var(--color-accent-ink);font:23px/1 var(--font-display);padding:var(--space-md) var(--space-lg);white-space:nowrap;border:1px solid var(--color-focus);clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px);transition:background var(--dur-short)}.button:hover{background:var(--color-focus)}.text-link{font:18px/1 var(--font-display);white-space:nowrap}.smallprint{font-size:13px;color:var(--color-muted)}.hero-copy>.smallprint{margin-top:var(--space-sm)}.scene-caption{position:absolute;right:5vw;bottom:var(--space-lg);display:flex;flex-direction:column;align-items:flex-end;gap:var(--space-xs);font:12px/1.4 var(--font-display);letter-spacing:.12em;color:var(--color-muted)}.scene-caption button{font-size:13px;letter-spacing:0;background:var(--color-paper);border:1px solid var(--color-rule);padding:var(--space-xs) var(--space-sm);min-height:44px}.scene-caption button:hover{border-color:var(--color-accent)}.scroll-note{position:absolute;bottom:var(--space-lg);left:5vw;font:13px/1.4 var(--font-display);letter-spacing:.12em}.scroll-note span{margin-left:var(--space-sm)}.expedition{padding:var(--space-3xl) 7vw;border-top:1px solid var(--color-rule);background:linear-gradient(color-mix(in oklch,var(--color-paper) 94%,transparent),var(--color-paper)),url('assets/panel.png') center/cover}.section-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-xl);gap:var(--space-sm)}.expedition-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:7vw}.expedition-grid>div>p{margin-top:var(--space-md);color:var(--color-muted)}.route-buttons{margin-top:var(--space-lg)}.route{width:100%;display:flex;align-items:center;text-align:left;gap:var(--space-md);padding:var(--space-sm) 0;border:0;border-bottom:1px solid var(--color-rule);background:var(--color-clear);font:24px/1 var(--font-display)}.route span{font-size:14px;color:var(--color-muted)}.route b{margin-left:auto;font-weight:400}.route.active,.route:hover{color:var(--color-accent)}.route.active span{color:var(--color-accent)}.field-note{align-self:center;border:1px solid var(--color-rule);transform:rotate(1deg);background:var(--color-paper-2)}.map-window{height:310px;position:relative;overflow:clip}.map-window img{width:100%;height:100%;object-fit:cover;object-position:30% 50%;image-rendering:pixelated;transform:scale(1.55);transition:object-position 600ms var(--ease-out)}.map-window:after{content:'';position:absolute;inset:0;border:12px solid color-mix(in oklch,var(--color-shadow) 20%,transparent);pointer-events:none}.map-label{position:absolute;left:var(--space-sm);top:var(--space-sm);padding:4px 8px;background:var(--color-paper);font:12px var(--font-display);letter-spacing:.1em}.map-target{position:absolute;left:50%;top:55%;width:44px;height:44px;border:1px solid var(--color-accent);transform:rotate(45deg);box-shadow:0 0 0 6px color-mix(in oklch,var(--color-shadow) 35%,transparent)}.note-copy{padding:var(--space-lg);min-height:235px}.note-copy>span{font:12px var(--font-display);letter-spacing:.14em;color:var(--color-accent)}h3{font-size:32px;margin:var(--space-sm) 0}.note-copy p{font-size:16px;color:var(--color-muted)}.camp-section{padding:var(--space-xl) 7vw var(--space-3xl);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:5vw;align-items:center}.camp-art{position:relative}.camp-art canvas{width:100%;height:auto;image-rendering:pixelated}.camp-label{display:block;text-align:center;font:13px var(--font-display);letter-spacing:.14em;color:var(--color-muted)}.camp-copy h2{font-size:clamp(36px,4vw,58px);margin:var(--space-md) 0}.camp-copy>p:not(.eyebrow){color:var(--color-muted)}dl{margin:var(--space-lg) 0 0}dl>div{border-top:1px solid var(--color-rule);padding:var(--space-sm) 0;display:grid;grid-template-columns:110px minmax(0,1fr);gap:var(--space-md)}dt{font:17px/1.4 var(--font-display);color:var(--color-accent)}dd{margin:0;font-size:15px;color:var(--color-muted)}.join{padding:var(--space-3xl) var(--space-md);text-align:center;border-top:1px solid var(--color-rule);background:linear-gradient(color-mix(in oklch,var(--color-paper) 91%,transparent),var(--color-paper)),url('assets/world.png') center 60%/cover}.join p{margin:0 auto}.join h2{margin:var(--space-md) 0;font-size:clamp(38px,6vw,82px)}.join>.button{margin:var(--space-lg) 0 var(--space-md)}.downloads{display:flex;justify-content:center;align-items:center;gap:var(--space-lg);font:17px/1 var(--font-display);margin:var(--space-sm) 0 var(--space-md)}.downloads a{white-space:nowrap;padding:var(--space-xs) 0}footer{padding:var(--space-lg) 5vw;display:flex;align-items:center;gap:var(--space-lg);justify-content:space-between;border-top:1px solid var(--color-rule)}footer p,footer small{font-size:12px;color:var(--color-muted)}footer span{margin:0 var(--space-xs)}footer small{text-align:right}
@media(min-width:1600px){.hero-copy{margin-left:4vw}.hero-world img,.hero-world canvas{object-position:center}.hero-copy{width:760px}}
@media(max-width:768px){.topbar{height:64px;padding:0 var(--space-md)}nav{gap:var(--space-sm);font-size:16px}.nav-play{padding-left:var(--space-sm)}.wordmark{font-size:20px}.hero{height:auto;min-height:740px}.hero-copy{width:90%;padding:var(--space-2xl) var(--space-md) 160px}.hero-shade{background:linear-gradient(90deg,var(--color-paper),color-mix(in oklch,var(--color-paper) 80%,transparent) 50%,color-mix(in oklch,var(--color-paper) 40%,transparent)),linear-gradient(0deg,var(--color-paper),transparent 40%)}.hero-world img,.hero-world canvas{object-position:80% center}.scene-caption{right:var(--space-md);bottom:var(--space-md)}.scroll-note{left:var(--space-md);bottom:100px}.section-top{align-items:flex-start;flex-direction:column}.expedition{padding:var(--space-2xl) var(--space-md)}.expedition-grid,.camp-section{grid-template-columns:minmax(0,1fr);gap:var(--space-xl)}.field-note{transform:none}.map-window{height:300px}.camp-section{padding:var(--space-lg) var(--space-md) var(--space-2xl)}.camp-art{order:2;max-width:600px}.camp-copy{order:1}.note-copy{min-height:225px}footer{flex-wrap:wrap}footer small{text-align:left}.join{padding:var(--space-2xl) var(--space-md)}}
@media(max-width:414px){nav a:not(.nav-play){display:none}.hero-copy{width:100%}.hero h1{font-size:43px}.eyebrow{font-size:12px}.intro{font-size:17px}.intro br{display:none}.hero-actions{gap:var(--space-md);flex-wrap:wrap}.button{font-size:20px;padding:var(--space-md)}.hero-copy>.smallprint{font-size:12px}.logo{margin-bottom:var(--space-md)}.downloads{gap:var(--space-sm);font-size:15px}.join>.button{font-size:18px;gap:var(--space-sm)}.note-copy{padding:var(--space-md)}.map-window{height:240px}dl>div{grid-template-columns:90px minmax(0,1fr);gap:var(--space-sm)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.field-note{transform:none}}

/* Logo has transparent source margins: align visible lettering, without editing asset. */
.logo-frame{width:100%;max-width:590px;aspect-ratio:5.6;position:relative;overflow:clip;margin:var(--space-lg) 0 var(--space-xl)}
.logo-frame .logo{position:absolute;width:116%;max-width:none;height:auto;left:-8%;top:50%;transform:translateY(-50%);margin:0}
@media(max-width:414px){.topbar .wordmark{font-size:19px}.logo-frame{margin:var(--space-lg) 0}}

.map-window img{position:absolute;max-width:none;object-fit:fill;transform:none;transition:left 650ms var(--ease-out),top 650ms var(--ease-out)}
.map-target{width:58px;height:58px;display:grid;place-items:center;transform:translate(-50%,-50%);border:2px solid var(--color-focus);border-radius:50%;background:color-mix(in oklch,var(--color-paper) 80%,transparent);color:var(--color-focus);font:24px var(--font-display);box-shadow:0 0 0 9px color-mix(in oklch,var(--color-accent) 22%,transparent);transition:left 650ms var(--ease-out),top 650ms var(--ease-out)}
.map-label{z-index:2;max-width:calc(100% - 32px)}

.header-actions{display:flex;align-items:center;gap:24px}
.languages{display:flex;gap:4px;align-items:center}
.languages button{display:grid;place-items:center;width:44px;height:44px;padding:7px;background:transparent;border:1px solid transparent;border-radius:3px;cursor:pointer;opacity:.65}
.languages svg{display:block;width:28px;height:19px;box-shadow:0 0 0 1px #ffffff40}
.languages button:hover,.languages button[aria-pressed="true"]{opacity:1;border-color:var(--color-accent);background:#d0ac5020}
.languages button:focus-visible{outline:2px solid var(--color-focus);outline-offset:3px;opacity:1}
@media(max-width:768px){.header-actions{gap:12px}.topbar nav a:not(.nav-play){display:none}}
@media(max-width:440px){.topbar nav{display:none}.topbar{padding-left:16px;padding-right:16px}.header-actions{gap:0}}
