@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/static/fonts/ibm-plex-sans.e2291e84.woff2") format("woff2");
}

@font-face {
  font-family: "Roboto Slab";
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
  src: url("/static/fonts/roboto-slab.50cf7d32.woff2") format("woff2");
}

:root {
  color-scheme: dark;
  --bg: #060a10;
  --bg-alt: #0a111b;
  --surface: rgba(9, 16, 26, 0.96);
  --surface-raised: rgba(13, 23, 36, 0.97);
  --surface-soft: rgba(20, 32, 48, 0.72);
  --line: rgba(144, 166, 190, 0.18);
  --line-strong: rgba(144, 166, 190, 0.3);
  --text: #eaf0f3;
  --muted: #9baab8;
  --ember: #ff9c4a;
  --ember-strong: #ff842f;
  --ember-soft: rgba(255, 156, 74, 0.12);
  --tide: #4ed6c5;
  --tide-soft: rgba(78, 214, 197, 0.1);
  --success: #68d99b;
  --warning: #dfb85c;
  --danger: #f1747f;
  --radius: 9px;
  --shadow: 0 18px 42px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.018);
  --font-ui: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Roboto Slab", Rockwell, "Roboto Slab", serif;
  --font-mono: "Cascadia Mono", "SFMono-Regular", Consolas, monospace;
  font-family: var(--font-ui);
}

* { box-sizing: border-box; }
html { background: var(--bg); scroll-behavior: smooth; }
body { display: flex; min-height: 100vh; flex-direction: column; margin: 0; color: var(--text); background: radial-gradient(circle at 52% -12%, rgba(78, 214, 197, .055), transparent 34rem), var(--bg); font-family: var(--font-ui); font-size: 15px; font-synthesis: none; line-height: 1.5; letter-spacing: .002em; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
::selection { background: rgba(78, 214, 197, .24); color: #fff; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { outline-color: var(--tide); outline-offset: 3px; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { text-wrap: balance; }
strong { font-weight: 600; }

.skip-link { position: fixed; top: .65rem; left: .65rem; z-index: 100; padding: .65rem .85rem; border-radius: 7px; background: var(--text); color: var(--bg); transform: translateY(-180%); }
.skip-link:focus { transform: none; }
.shell { width: min(1500px, calc(100% - 2.5rem)); margin-inline: auto; }
.site-header { position: sticky; top: 0; z-index: 30; border-bottom: 1px solid rgba(144, 166, 190, .16); background: rgba(5, 9, 15, .94); box-shadow: 0 8px 24px rgba(0, 0, 0, .16); backdrop-filter: blur(16px); }
.header-inner { display: flex; min-height: 62px; align-items: center; justify-content: space-between; gap: 1rem; }
.brand { display: flex; align-items: center; gap: .7rem; font-size: 1.04rem; font-weight: 700; letter-spacing: -.012em; }
.brand-mark { display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid rgba(255, 156, 74, .55); border-radius: 9px; background: #101722; }
.brand-mark img { width: 22px; height: 22px; }
.header-actions { display: flex; align-items: center; gap: 1.25rem; }
.nav-link { color: var(--muted); font-size: .84rem; font-weight: 600; }
.nav-link:hover, .nav-link:focus-visible { color: var(--text); }
.mode-status { padding: .42rem .65rem; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); font-size: .75rem; font-weight: 500; letter-spacing: .025em; }
.mode-status::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: .45rem; border-radius: 50%; background: var(--success); }

.main { flex: 1; padding: 1rem 0 3.5rem; }
.eyebrow { margin: 0 0 .4rem; color: var(--tide); font-size: .68rem; font-weight: 700; letter-spacing: .135em; text-transform: uppercase; }
.page-title { max-width: 22ch; margin: .1rem 0 .7rem; font-family: var(--font-display); font-size: clamp(1.85rem, 3vw, 2.65rem); font-weight: 600; line-height: 1.08; letter-spacing: -.027em; }
.lead { max-width: 62ch; color: var(--muted); font-size: 1rem; }
.button { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; gap: .45rem; padding: .62rem .85rem; border: 1px solid var(--line-strong); border-radius: 7px; background: linear-gradient(180deg, #142130, #101a27); color: var(--text); font-size: .86rem; font-weight: 700; cursor: pointer; transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease; }
.button:hover { border-color: rgba(78, 214, 197, .55); background: #152434; transform: translateY(-1px); }
.button:focus-visible, .field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible, .compact-field select:focus-visible, .resume-strip input:focus-visible { outline: 0; border-color: var(--tide); box-shadow: 0 0 0 3px rgba(78, 214, 197, .16); }
.button-primary { border-color: #ff9c4a; background: linear-gradient(180deg, #ffab63, var(--ember)); color: #1a0d05; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28); }
.button-primary:hover { border-color: #ffb16f; background: #ffac68; }
.button-secondary { background: transparent; }
.button-danger { border-color: rgba(241, 116, 127, .44); color: #ffd8dc; }
.button-quiet { min-height: 34px; padding: .42rem .65rem; font-size: .8rem; }
.button-row { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1rem; }

.home-console { display: grid; gap: .8rem; }
.party-rail { display: grid; grid-template-columns: 1.22fr repeat(5, minmax(0, 1fr)); gap: .7rem; min-width: 0; }
.party-slot { position: relative; display: flex; min-width: 0; min-height: 102px; align-items: center; gap: .7rem; padding: .72rem; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(14, 24, 37, .96), rgba(8, 14, 23, .96)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .018); }
.party-slot-active { border-color: rgba(255, 156, 74, .7); background: linear-gradient(145deg, rgba(23, 29, 36, .98), rgba(10, 18, 28, .98)); box-shadow: inset 3px 0 0 rgba(255, 156, 74, .72); }
.slot-number { position: absolute; top: .48rem; left: .55rem; color: #bdc6ce; font-family: var(--font-mono); font-size: .75rem; font-weight: 600; }
.party-sprite { width: 66px; height: 66px; margin-left: .6rem; image-rendering: pixelated; object-fit: contain; }
.party-slot strong, .party-slot span { display: block; min-width: 0; }
.party-slot strong { overflow: hidden; font-size: .9rem; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.party-meta { margin-top: .12rem; color: var(--muted); font-size: .72rem; }
.party-health { width: 92px; max-width: 100%; height: 4px; margin-top: .55rem; border-radius: 999px; background: #263341; overflow: hidden; }
.party-health span { width: 78%; height: 100%; background: var(--success); }
.party-slot-empty { justify-content: center; color: #738290; font-size: .77rem; }

.home-layout { display: grid; grid-template-columns: minmax(300px, 342px) minmax(420px, 1fr) minmax(280px, 324px); gap: .8rem; align-items: stretch; }
.mission-panel, .route-panel, .bivouac-panel { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(155deg, rgba(12, 21, 33, .98), rgba(7, 13, 21, .98)); box-shadow: var(--shadow); overflow: hidden; }
.launch-panel { display: flex; flex-direction: column; padding: 1rem; }
.panel-heading { padding-bottom: .72rem; border-bottom: 1px solid var(--line); }
.panel-heading h1, .panel-heading h2, .route-panel-heading h2 { margin: 0 0 .35rem; font-family: var(--font-display); font-size: 1.35rem; font-weight: 600; line-height: 1.12; letter-spacing: -.02em; }
.panel-heading p:last-child { margin-bottom: 0; color: var(--muted); font-size: .82rem; }
.launch-form { display: grid; gap: .72rem; padding-top: .6rem; }
.field { display: grid; gap: .32rem; margin: .7rem 0; }
.compact-field { margin: 0; }
.field label, .field-label, .compact-field > label, .mode-picker legend { color: #bdc8d1; font-size: .66rem; font-weight: 700; letter-spacing: .075em; text-transform: uppercase; }
.field input, .field select, .field textarea, .compact-field select, .resume-strip input { width: 100%; min-height: 40px; padding: .58rem .68rem; border: 1px solid var(--line-strong); border-radius: 6px; background: linear-gradient(180deg, #080f17, #070c13); color: var(--text); font-weight: 500; }
.field textarea { min-height: 92px; resize: vertical; }
.hint { color: var(--muted); font-size: .72rem; }
.mode-picker { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem; min-width: 0; margin: 0; padding: 0; border: 0; }
.mode-picker legend { grid-column: 1 / -1; margin-bottom: .2rem; }
.mode-picker label { display: flex; min-width: 0; align-items: flex-start; gap: .45rem; padding: .55rem; border: 1px solid var(--line); border-radius: 6px; background: linear-gradient(145deg, #0d1722, #0a121b); cursor: pointer; transition: border-color .16s ease, background .16s ease, box-shadow .16s ease; }
.mode-picker label:has(input:checked) { border-color: rgba(255, 156, 74, .78); background: linear-gradient(145deg, rgba(255, 156, 74, .14), rgba(255, 156, 74, .07)); box-shadow: inset 3px 0 0 rgba(255, 156, 74, .72); }
.mode-picker input { margin: .18rem 0 0; accent-color: var(--ember); }
.mode-picker strong, .mode-picker small { display: block; }
.mode-picker strong { font-size: .79rem; font-weight: 600; }
.mode-picker small { margin-top: .16rem; color: var(--muted); font-size: .65rem; line-height: 1.25; }
.launch-button { width: 100%; margin-top: .1rem; text-transform: uppercase; letter-spacing: .05em; }
.resume-strip { display: grid; grid-template-columns: 1fr auto; gap: .5rem; align-items: end; margin-top: auto; padding-top: .85rem; border-top: 1px solid var(--line); }
.resume-strip .eyebrow { margin-bottom: .28rem; }
.resume-strip input { min-width: 0; font-family: var(--font-mono); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }

.route-panel { display: flex; flex-direction: column; }
.route-panel-heading { display: flex; align-items: end; justify-content: space-between; gap: .7rem; padding: .9rem 1rem .7rem; border-bottom: 1px solid var(--line); }
.route-panel-heading h2 { margin-bottom: 0; }
.terrain-label { max-width: 20ch; overflow: hidden; color: var(--muted); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.route-landscape { position: relative; min-height: 690px; flex: 1; isolation: isolate; overflow: hidden; background: #05090e; }
.route-landscape > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 53% 50%; filter: brightness(.84) saturate(.84); }
.route-landscape::after { position: absolute; inset: 0; z-index: -1; content: ""; background: linear-gradient(90deg, rgba(2, 7, 12, .24), rgba(2, 7, 12, .06) 64%, rgba(2, 7, 12, .14)), rgba(2, 7, 12, .08); pointer-events: none; }
.route-track { position: absolute; top: 12%; bottom: 10%; left: clamp(2rem, 11%, 6rem); display: flex; width: min(280px, 62%); flex-direction: column; justify-content: space-between; margin: 0; padding: 0 0 0 1rem; list-style: none; }
.route-track::before { position: absolute; top: 22px; bottom: 22px; left: 34px; width: 0; border-left: 2px dotted rgba(191, 203, 211, .6); content: ""; }
.route-step { position: relative; display: flex; align-items: center; gap: .72rem; color: #b7c0c8; }
.route-marker { position: relative; z-index: 1; display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; border: 1px solid #667483; border-radius: 50%; background: rgba(7, 13, 20, .94); font-family: var(--font-mono); font-size: .66rem; font-weight: 600; }
.route-step > div { padding: .44rem .6rem; border: 1px solid rgba(144, 166, 190, .2); border-radius: 6px; background: rgba(5, 10, 16, .88); }
.route-step strong, .route-step small { display: block; }
.route-step strong { color: var(--text); font-size: .76rem; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.route-step small { margin-top: .08rem; color: var(--muted); font-size: .67rem; }
.route-step-done .route-marker { border-color: var(--tide); color: var(--tide); }
.route-step-current .route-marker { border-color: var(--ember); color: var(--ember); box-shadow: 0 0 0 4px rgba(255, 156, 74, .11); }
.route-step-current > div { border-color: rgba(255, 156, 74, .48); }
.route-step-current small { color: var(--ember); }
.map-legend { position: absolute; top: .8rem; right: .8rem; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .55rem; max-width: 250px; padding: .46rem .58rem; border: 1px solid var(--line); border-radius: 6px; background: rgba(5, 10, 16, .8); color: var(--muted); font-size: .64rem; backdrop-filter: blur(8px); }
.map-legend span { display: inline-flex; align-items: center; gap: .3rem; }
.legend-dot { display: block; width: 7px; height: 7px; border: 1px solid #71808d; border-radius: 50%; }
.legend-done { border-color: var(--tide); background: var(--tide); }
.legend-current { border-color: var(--ember); background: var(--ember); }

.bivouac-panel { display: flex; flex-direction: column; padding: 1rem; }
.companion-brief { display: flex; align-items: center; gap: .75rem; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.companion-brief img { width: 68px; height: 68px; image-rendering: pixelated; object-fit: contain; }
.companion-brief strong, .companion-brief span { display: block; }
.companion-brief strong { font-size: .92rem; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.companion-brief span { margin-top: .12rem; color: var(--muted); font-size: .73rem; text-transform: uppercase; }
.brief-block { padding: .85rem 0; }
.brief-label { display: block; margin-bottom: .3rem; color: var(--ember); font-size: .66rem; font-weight: 700; letter-spacing: .115em; text-transform: uppercase; }
.brief-block > strong { font-size: .88rem; }
.brief-block ul { margin: .55rem 0 0; padding-left: 1.05rem; color: var(--muted); font-size: .75rem; }
.brief-block li + li { margin-top: .22rem; }
.camp-scene { position: relative; min-height: 380px; margin: auto -1rem -1rem; overflow: hidden; border-top: 1px solid var(--line); background: #05090e; }
.camp-scene > img { width: 100%; height: 100%; min-height: 380px; object-fit: cover; object-position: 64% 68%; filter: brightness(.84) saturate(.92); }
.camp-objective { position: absolute; top: .75rem; right: .75rem; left: .75rem; padding: .72rem .78rem; border: 1px solid rgba(255, 156, 74, .36); border-radius: 6px; background: linear-gradient(135deg, rgba(10, 15, 21, .94), rgba(5, 10, 16, .84)); box-shadow: inset 3px 0 0 rgba(255, 156, 74, .62), 0 10px 24px rgba(0, 0, 0, .2); backdrop-filter: blur(8px); }
.camp-objective strong { display: block; font-size: .88rem; }
.camp-objective p { margin: .22rem 0 0; color: var(--muted); font-size: .72rem; }

.section { margin-top: clamp(1.6rem, 3vw, 2.8rem); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }
.section-heading h2 { margin: .12rem 0; font-family: var(--font-display); font-size: clamp(1.35rem, 2.1vw, 1.8rem); font-weight: 600; letter-spacing: -.02em; }
.section-heading p { max-width: 58ch; margin: 0; color: var(--muted); font-size: .83rem; }
.grid { display: grid; gap: .8rem; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.card { position: relative; min-width: 0; padding: .95rem; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(150deg, rgba(16, 27, 42, .98), rgba(10, 18, 29, .98)); box-shadow: 0 12px 32px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .018); overflow: hidden; }
.card h2, .card h3 { margin: .1rem 0 .4rem; }
.card p { margin: .25rem 0; color: var(--muted); }
.card-accent { border-color: rgba(255, 156, 74, .36); }
.card-tide { border-color: rgba(78, 214, 197, .3); }
.wizard fieldset { min-width: 0; margin: 0 0 .8rem; padding: .8rem; border: 1px solid var(--line); border-radius: 7px; }
.wizard legend { padding: 0 .35rem; color: var(--ember); font-size: .75rem; font-weight: 700; }
.flash, .error-banner { margin-bottom: .8rem; padding: .72rem .82rem; border: 1px solid rgba(241, 116, 127, .42); border-radius: 7px; background: rgba(241, 116, 127, .1); color: #ffe5e9; }
.success-banner { border-color: rgba(104, 217, 155, .4); background: rgba(104, 217, 155, .08); color: #dfffee; }

.login-scene { position: relative; display: grid; min-height: min(680px, calc(100vh - 142px)); grid-template-columns: minmax(0, 1fr) minmax(350px, .74fr); align-items: center; gap: clamp(2rem, 7vw, 7rem); padding: clamp(2rem, 5vw, 4.5rem); border: 1px solid var(--line); border-radius: var(--radius); background-color: #070d14; background-image: linear-gradient(90deg, rgba(3, 8, 14, .9) 0%, rgba(3, 8, 14, .68) 46%, rgba(3, 8, 14, .48) 100%), url('/static/mountain-expedition.adae60be.png'); background-position: center 58%; background-size: cover; box-shadow: var(--shadow); isolation: isolate; overflow: hidden; }
.login-scene::after { position: absolute; right: -7rem; bottom: -9rem; z-index: -1; width: 30rem; height: 30rem; border-radius: 50%; background: radial-gradient(circle, rgba(255, 132, 47, .14), transparent 66%); content: ""; pointer-events: none; }
.login-copy { max-width: 590px; }
.login-copy .page-title { max-width: 16ch; margin-bottom: .85rem; font-size: clamp(2rem, 4vw, 3.25rem); }
.login-copy .lead { color: #b7c2cb; }
.login-trust { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1.35rem; }
.login-trust span { display: inline-flex; align-items: center; gap: .4rem; padding: .34rem .5rem; border: 1px solid rgba(144, 166, 190, .24); border-radius: 5px; background: rgba(5, 11, 18, .62); color: #b8c4cd; font-size: .7rem; font-weight: 500; }
.login-trust span::before { width: 6px; height: 6px; border-radius: 50%; background: var(--tide); content: ""; }
.login-card { padding: 1.2rem; border-color: rgba(144, 166, 190, .26); background: linear-gradient(150deg, rgba(16, 27, 42, .96), rgba(8, 15, 24, .96)); backdrop-filter: blur(14px); }
.login-card-heading { margin-bottom: 1.1rem; padding-bottom: .9rem; border-bottom: 1px solid var(--line); }
.login-card-heading h2 { margin: 0 0 .35rem; font-family: var(--font-display); font-size: 1.25rem; font-weight: 600; letter-spacing: -.015em; }
.login-card-heading p:last-child { margin-bottom: 0; font-size: .8rem; }
.login-card .field { margin: 0 0 .85rem; }
.login-card .button { width: 100%; }

.run-hero { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(290px, .85fr); gap: .8rem; align-items: stretch; }
.run-context { min-height: 210px; padding: 1.15rem; background-color: #080e16; background-image: linear-gradient(90deg, rgba(3, 8, 14, .92), rgba(3, 8, 14, .52)), url('/static/mountain-expedition.adae60be.png'); background-position: center 48%; background-size: cover; }
.run-code { display: inline-flex; align-items: center; padding: .34rem .5rem; border: 1px solid var(--line-strong); border-radius: 5px; background: rgba(0, 0, 0, .28); font-family: var(--font-mono); font-size: .72rem; font-weight: 600; letter-spacing: .13em; }
.run-title { max-width: 22ch; margin: .7rem 0 .32rem; font-family: var(--font-display); font-size: clamp(1.8rem, 3.2vw, 2.7rem); font-weight: 600; line-height: 1.07; letter-spacing: -.028em; }
.run-meta { display: flex; flex-wrap: wrap; gap: .4rem; color: var(--muted); }
.pill { display: inline-flex; align-items: center; padding: .25rem .46rem; border: 1px solid var(--line); border-radius: 5px; background: rgba(8, 14, 22, .8); font-size: .7rem; }
.milestone { display: flex; min-height: 210px; flex-direction: column; justify-content: space-between; border-color: rgba(78, 214, 197, .34); background: #0b1621; }
.milestone-number { color: var(--tide); font-size: .66rem; font-weight: 700; letter-spacing: .115em; text-transform: uppercase; }
.milestone h2 { margin: .35rem 0; font-family: var(--font-display); font-size: clamp(1.3rem, 2vw, 1.7rem); font-weight: 600; }
.cap { display: grid; width: 52px; height: 52px; place-items: center; border: 1px solid rgba(255, 156, 74, .5); border-radius: 50%; background: var(--ember-soft); color: var(--ember); font-size: 1.1rem; font-weight: 700; }
.party-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .6rem; }
.pokemon-card { padding: .65rem; text-align: left; }
.pokemon-card img { width: 64px; height: 64px; margin: 0 auto .25rem; image-rendering: pixelated; object-fit: contain; }
.pokemon-card strong, .pokemon-card span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pokemon-card strong { font-size: .82rem; font-weight: 600; }
.pokemon-card span { color: var(--muted); font-size: .7rem; }
.pokemon-card form { margin-top: .55rem; }
.empty-slot { display: grid; min-height: 112px; place-items: center; border-style: dashed; color: var(--muted); font-size: .75rem; }
.journey { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(155px, 1fr); gap: .55rem; padding: 1rem; overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); background-color: rgba(6, 11, 17, .9); background-image: url('/static/mountain-expedition.adae60be.png'); background-position: center 66%; background-size: cover; background-blend-mode: multiply; scroll-snap-type: x proximity; }
.journey-step { min-height: 110px; padding: .75rem; border: 1px solid var(--line); border-radius: 6px; background: rgba(7, 13, 20, .86); scroll-snap-align: start; }
.journey-step strong, .journey-step span { display: block; }
.journey-step strong { margin-bottom: .3rem; font-size: .79rem; }
.journey-step span { color: var(--muted); font-size: .69rem; }
.journey-step.done { border-color: rgba(78, 214, 197, .5); }
.journey-step.next { border-color: rgba(255, 156, 74, .68); box-shadow: inset 3px 0 0 var(--ember); }
.tabs { display: flex; gap: .45rem; overflow-x: auto; margin-bottom: .8rem; }
.tabs a { padding: .46rem .65rem; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); white-space: nowrap; }
.action-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.memorial { border-color: rgba(167, 153, 194, .24); background: #0d1019; }
.memorial .pokemon-card img { filter: grayscale(.55); }
.timeline { display: grid; gap: 0; }
.timeline-entry { display: grid; grid-template-columns: 110px 1fr; gap: .8rem; padding: .62rem; border-bottom: 1px solid var(--line); }
.timeline-entry:last-child { border-bottom: 0; }
.timeline-entry time { color: var(--muted); font-size: .7rem; }

.admin-layout { display: grid; grid-template-columns: 205px minmax(0, 1fr); gap: .8rem; }
.admin-nav { position: sticky; top: 76px; height: max-content; padding: .6rem; }
.admin-nav a { display: block; padding: .48rem .55rem; border-radius: 5px; color: var(--muted); font-size: .8rem; }
.admin-nav a:hover { background: var(--tide-soft); color: var(--text); }
.admin-nav form { margin-top: .45rem; padding-top: .55rem; border-top: 1px solid var(--line); }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: .62rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }
.status { display: inline-flex; align-items: center; gap: .35rem; }
.status::before { width: 7px; height: 7px; border-radius: 50%; background: var(--success); content: ""; }
.footer { padding: 1.25rem 0; border-top: 1px solid var(--line); color: var(--muted); font-size: .72rem; }
.footer-inner { display: flex; justify-content: space-between; gap: 1rem; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
[aria-live] { scroll-margin-top: 76px; }

.experiment-hero { display: grid; min-height: min(720px, calc(100vh - 120px)); grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr); align-items: center; gap: clamp(2rem, 7vw, 7rem); padding: clamp(4rem, 9vw, 8rem) 0; }
.experiment-copy h1 { max-width: 11ch; margin: .2rem 0 1.2rem; font-family: var(--font-display); font-size: clamp(3rem, 6.4vw, 6.3rem); font-weight: 600; line-height: .94; letter-spacing: -.055em; }
.experiment-copy .lead { max-width: 58ch; font-size: clamp(1rem, 1.6vw, 1.2rem); }
.experiment-copy .button-row { margin: 1.7rem 0 1rem; }
.trust-line { color: var(--muted); font-size: .8rem; }
.trust-line a { color: var(--tide); text-decoration: underline; text-underline-offset: 3px; }
.experiment-preview { position: relative; display: grid; min-height: 470px; align-content: end; isolation: isolate; }
.experiment-preview::before { position: absolute; inset: 7% 4% 18%; z-index: -1; border: 1px solid rgba(78,214,197,.22); border-radius: 50%; background: radial-gradient(circle, rgba(78,214,197,.12), transparent 67%); content: ""; animation: ember-breathe 6s ease-in-out infinite; }
.preview-orbit { position: absolute; inset: 9% 2% auto; min-height: 320px; }
.preview-orbit img { position: absolute; top: 40%; left: 50%; width: 70px; transform: translate(-50%,-50%); filter: drop-shadow(0 0 30px rgba(255,156,74,.45)); }
.preview-orbit span { position: absolute; padding: .55rem .75rem; border: 1px solid var(--line); border-radius: 999px; background: rgba(7,13,21,.9); color: var(--muted); font-size: .75rem; box-shadow: var(--shadow); }
.preview-orbit span:nth-of-type(1) { top: 5%; left: 12%; }
.preview-orbit span:nth-of-type(2) { top: 30%; right: 2%; }
.preview-orbit span:nth-of-type(3) { bottom: 8%; left: 4%; }
.experiment-preview .card { max-width: 430px; margin-left: auto; transform: rotate(-1deg); transition: transform .22s ease, border-color .22s ease; }
.experiment-preview .card:hover { border-color: rgba(255,156,74,.52); transform: rotate(0) translateY(-4px); }
.request-layout { display: grid; grid-template-columns: minmax(0,.75fr) minmax(520px,1.25fr); gap: clamp(2rem,6vw,6rem); align-items: start; padding: clamp(3rem,8vw,7rem) 0; }
.request-card { padding: clamp(1.1rem,3vw,2rem); }
.feature-list { display: grid; gap: .6rem; padding: 0; list-style: none; color: var(--muted); }
.feature-list li::before { margin-right: .55rem; color: var(--ember); content: "✦"; }
.consent-line { display: flex; align-items: flex-start; gap: .6rem; margin: 1rem 0; color: var(--muted); font-size: .82rem; }
.consent-line input { margin-top: .25rem; }
@keyframes ember-breathe { 50% { transform: scale(1.035); opacity: .78; } }

@media (max-width: 1180px) {
  .home-layout { grid-template-columns: minmax(290px, 340px) minmax(0, 1fr); }
  .bivouac-panel { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr 1.35fr; gap: 1rem; align-items: start; }
  .bivouac-panel .panel-heading { border-bottom: 0; }
  .camp-scene { min-height: 250px; margin: -1rem; grid-row: 1 / span 2; grid-column: 3; border: 0; border-left: 1px solid var(--line); }
  .camp-scene > img { min-height: 250px; }
}

@media (max-width: 900px) {
  .shell { width: min(100% - 1.25rem, 1500px); }
  .home-layout, .run-hero, .admin-layout { grid-template-columns: 1fr; }
  .route-landscape { min-height: 580px; }
  .bivouac-panel { grid-column: auto; display: flex; }
  .camp-scene { min-height: 320px; margin: auto -1rem -1rem; border: 0; border-top: 1px solid var(--line); }
  .camp-scene > img { min-height: 320px; }
  .party-rail { grid-template-columns: 220px repeat(5, 150px); overflow-x: auto; padding-bottom: .18rem; scrollbar-width: none; scroll-snap-type: x proximity; }
  .party-rail::-webkit-scrollbar { display: none; }
  .party-slot { scroll-snap-align: start; }
  .party-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .admin-nav { position: static; display: flex; gap: .25rem; overflow-x: auto; }
  .admin-nav a { white-space: nowrap; }
  .admin-nav form { margin: 0 0 0 auto; padding: 0 0 0 .45rem; border: 0; border-left: 1px solid var(--line); }
  .login-scene { min-height: auto; grid-template-columns: 1fr; gap: 2rem; padding: 2.5rem; background-image: linear-gradient(180deg, rgba(3, 8, 14, .72), rgba(3, 8, 14, .9)), url('/static/mountain-expedition.adae60be.png'); }
  .login-card { max-width: 620px; }
  .experiment-hero, .request-layout { grid-template-columns: 1fr; }
  .experiment-preview { min-height: 380px; }
}

@media (max-width: 620px) {
  body { font-size: 14px; }
  .header-inner { min-height: 56px; }
  .header-actions { gap: .65rem; }
  .header-actions .nav-link:first-child, .header-actions .nav-link:nth-child(2), .mode-status { display: none; }
  .main { padding-top: .65rem; }
  .party-slot { min-height: 92px; }
  .home-layout { gap: .65rem; }
  .launch-panel, .bivouac-panel { padding: .85rem; }
  .route-panel-heading { padding: .75rem .85rem .65rem; }
  .route-landscape { min-height: 510px; }
  .route-track { top: 14%; bottom: 11%; left: 1rem; width: 80%; }
  .map-legend { right: .5rem; left: .5rem; justify-content: center; }
  .resume-strip { grid-template-columns: 1fr; }
  .mode-picker { grid-template-columns: 1fr; }
  .camp-scene { margin-right: -.85rem; margin-left: -.85rem; }
  .grid-2, .grid-3, .action-grid { grid-template-columns: 1fr; }
  .party-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .section-heading, .footer-inner { align-items: flex-start; flex-direction: column; }
  .timeline-entry { grid-template-columns: 1fr; gap: .2rem; }
  .run-context { min-height: 190px; }
  .run-title { font-size: clamp(1.75rem, 8vw, 2.15rem); }
  .button { min-height: 42px; }
  .login-scene { gap: 1.5rem; padding: 1.25rem; }
  .login-copy .page-title { font-size: clamp(1.8rem, 9vw, 2.3rem); }
  .experiment-hero { min-height: auto; padding: 3rem 0; }
  .experiment-copy h1 { font-size: clamp(2.7rem, 14vw, 4.2rem); }
  .experiment-preview { min-height: 330px; }
  .request-layout { padding: 2rem 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}