/* Challenge uses the homepage's typography, glass, palette, gutters and signature rail. */
.mc-home .mc-chapter { --mc-top:var(--mc-pin-top); --mc-ink:var(--text-primary); --mc-muted:var(--text-secondary); --mc-gold:var(--track-2); --mc-mint:var(--track-1); position:relative; height:510svh; margin:0; color:var(--text-primary); background:var(--bg-canvas); scroll-margin-top:var(--mc-pin-top); z-index:1; }
.mc-pin { position:sticky; top:var(--mc-pin-top); height:calc(100svh - var(--mc-pin-top)); min-height:520px; overflow:hidden; isolation:isolate; background:var(--bg-canvas); }
.mc-canvas { position:absolute; inset:0; width:100%; height:100%; display:block; z-index:0; }
.mc-vignette { position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(90deg,color-mix(in oklab,var(--bg-canvas) 94%,transparent),color-mix(in oklab,var(--bg-canvas) 75%,transparent) 24%,transparent 48%),linear-gradient(180deg,color-mix(in oklab,var(--bg-canvas) 65%,transparent),transparent 26%,transparent 60%,color-mix(in oklab,var(--bg-canvas) 86%,transparent) 82%,var(--bg-canvas)); }
.mc-home .mc-corner { position:absolute; z-index:4; top:36px; left:var(--mc-gutter); }
.mc-scroll-cue { position:absolute; z-index:4; right:var(--mc-gutter); top:38px; display:flex; gap:10px; align-items:center; color:var(--text-tertiary); font:400 10px/1.5 var(--font-mono); letter-spacing:.06em; }
.mc-scroll-mouse { width:12px; height:19px; border:1px solid var(--mc-line); border-radius:7px; position:relative; }
.mc-scroll-mouse::after { content:""; position:absolute; width:2px; height:4px; background:var(--track-1); left:4px; top:4px; animation:mc-scroll 1.8s ease-in-out infinite; }
@keyframes mc-scroll { 0%,100% { translate:0 0; opacity:.5; } 50% { translate:0 5px; opacity:1; } }
.mc-copy { position:absolute; z-index:4; left:var(--mc-gutter); top:76px; width:min(38%,520px); pointer-events:none; }
.mc-home .mc-copy h2 { font-size:clamp(30px,3.3vw,50px); font-weight:650; letter-spacing:-.04em; line-height:1.04; margin:0; }
.mc-home .mc-copy h2 em { display:inline; }
.mc-home .mc-copy p { font-size:16px; line-height:1.65; max-width:340px; color:var(--text-secondary); margin-top:20px; }
.mc-case-code { display:none; }
.mc-loadout { position:absolute; z-index:12; left:var(--mc-gutter); bottom:118px; width:292px; max-width:29%; padding:14px 16px; border:1px solid var(--mc-line); border-radius:16px; background:var(--mc-glass); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); box-shadow:0 18px 42px -18px rgb(0 0 0 / 55%), var(--inner-highlight); pointer-events:auto; }
.mc-step-label, .mc-loadout-label { display:flex; align-items:center; gap:8px; color:var(--text-tertiary); font:500 10px/1.4 var(--font-mono); letter-spacing:.06em; margin-bottom:4px; }
.mc-loadout-label::before { content:""; width:7px; height:7px; border-radius:2px; background:var(--track-1); }
.mc-model-btn { display:inline-flex; align-items:center; gap:6px; padding:5px 9px; border-radius:10px; border:1px solid color-mix(in oklab,var(--mc-mcolor,var(--track-1)) 38%,var(--mc-line)); background:color-mix(in oklab,var(--mc-mcolor,var(--track-1)) 10%,var(--surface-2)); color:var(--text-primary); font:600 10.5px/1.2 var(--font-sans); cursor:pointer; pointer-events:auto; transition:border-color .2s, background-color .2s, color .2s, transform .2s, box-shadow .2s; }
.mc-model-btn span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mc-model-btn .mc-model-logo { width:14px; height:14px; flex:none; color:var(--mc-mcolor,var(--track-1)); filter:drop-shadow(0 0 4px var(--mc-mcolor,var(--track-1))); }
.mc-model-btn:hover { transform:translateY(-1px); border-color:var(--mc-mcolor,var(--track-1)); background:color-mix(in oklab,var(--mc-mcolor,var(--track-1)) 22%,var(--surface-2)); }
.mc-model-btn.is-active { color:#fff; background:color-mix(in oklab,var(--mc-mcolor,var(--track-1)) 42%,var(--surface-1)); border-color:var(--mc-mcolor,var(--track-1)); box-shadow:0 0 0 1px var(--mc-mcolor,var(--track-1)), 0 0 16px -2px var(--mc-mcolor,var(--track-1)); }
.mc-model-btn.is-active .mc-model-logo { color:#fff; }
.mc-home .mc-equipped { display:block; font:650 21px/1.15 var(--font-sans); letter-spacing:-.025em; color:var(--text-primary); }
.mc-loadout-type { display:block; font:400 12px/1.5 var(--font-sans); color:var(--text-secondary); margin-top:5px; }
.mc-home .mc-confirm { display:inline-flex; justify-content:center; width:100%; min-height:38px; height:auto; margin:12px 0 0; padding:9px 14px; font-size:12px; border-radius:999px; background:var(--text-primary); color:var(--bg-canvas); border-color:transparent; }
.mc-home .mc-confirm:hover { background:var(--track-1); color:var(--bg-canvas); }
.mc-home .mc-confirm:disabled { cursor:default; color:var(--track-1); background:var(--track-1-soft); border-color:color-mix(in oklab,var(--track-1) 25%,transparent); }
.mc-carried { display:block; margin-top:8px; color:var(--text-secondary); font:400 9px/1.6 var(--font-mono); }
.mc-confirm[hidden],.mc-carried[hidden] { display:none; }
/* The loadout, in four steps (provider → model → effort → harness) and one line that sums it up. */
.mc-steps { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.mc-step { display:grid; gap:5px; margin:0 -6px; padding:3px 6px; border-radius:9px; }
.mc-step-label::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--model-accent,var(--track-1)); box-shadow:0 0 8px var(--model-accent,var(--track-1)); }
.mc-step[data-step="harness"] .mc-loadout-label::before { border-radius:2px; }
.mc-model-chips { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; pointer-events:auto; }
.mc-loadout .mc-model-btn { min-width:0; padding:5px 7px; }
.mc-variant-chips, .mc-effort-chips { display:flex; flex-wrap:wrap; gap:5px; pointer-events:auto; }
.mc-chip { padding:4px 9px; border-radius:999px; border:1px solid var(--mc-line); background:color-mix(in oklab,var(--surface-2) 82%,transparent); color:var(--text-secondary); font:600 10.5px/1.3 var(--font-sans); white-space:nowrap; cursor:pointer; transition:border-color .2s, color .2s, background .2s, box-shadow .2s, transform .2s; }
.mc-chip:hover { transform:translateY(-1px); color:var(--text-primary); border-color:var(--model-accent,var(--track-1)); }
.mc-chip.is-active { color:#fff; border-color:var(--model-accent,var(--track-1)); background:color-mix(in oklab,var(--model-accent,var(--track-1)) 40%,var(--surface-1)); box-shadow:0 0 12px -3px var(--model-accent,var(--track-1)); }
.mc-effort { display:flex; align-items:center; gap:10px; }
.mc-effort-btn { font:600 10px/1.3 var(--font-mono); letter-spacing:.02em; }
.mc-effort-meter { display:inline-flex; align-items:flex-end; gap:3px; height:16px; flex:none; }
.mc-effort-meter i { width:5px; border-radius:2px; background:color-mix(in oklab,var(--text-primary) 14%,transparent); transition:background .3s, box-shadow .3s; }
.mc-effort-meter i:nth-child(1) { height:6px; } .mc-effort-meter i:nth-child(2) { height:9px; } .mc-effort-meter i:nth-child(3) { height:12px; } .mc-effort-meter i:nth-child(4) { height:16px; }
.mc-effort-meter i.on { background:var(--model-accent,var(--track-1)); box-shadow:0 0 8px var(--model-accent,var(--track-1)); }
.mc-chapter[data-effort="xhigh"] .mc-effort-meter i.on { animation:mc-charge 1.6s ease-in-out infinite; }
@keyframes mc-charge { 50% { filter:brightness(1.45); } }
.mc-loadout-summary { display:flex; align-items:center; gap:7px; margin:10px 0 0; padding-top:9px; border-top:1px solid var(--border-hairline); color:var(--text-secondary); font:500 10.5px/1.35 var(--font-mono); }
.mc-loadout-summary .mc-model-logo { width:15px; height:15px; flex:none; color:var(--model-accent,var(--track-1)); }
.mc-loadout-summary span { min-width:0; }
/* A step that changes replays the ones after it: the new models slide in, then each later step lights in turn. */
@keyframes mc-cascade-in { from { opacity:0; transform:translateY(7px); filter:blur(3px); } }
@keyframes mc-step-flash { 30% { background:color-mix(in oklab,var(--model-accent,var(--track-1)) 12%,transparent); box-shadow:inset 2px 0 0 var(--model-accent,var(--track-1)); } }
.mc-loadout.is-cascading[data-cascade-from="1"] .mc-variant-chips > * { animation:mc-cascade-in .42s var(--ease-emphasized,cubic-bezier(.2,.8,.2,1)) both; animation-delay:calc(var(--i,0) * 70ms); }
.mc-loadout.is-cascading[data-cascade-from="1"] .mc-step:nth-child(n+2),
.mc-loadout.is-cascading[data-cascade-from="2"] .mc-step:nth-child(n+3),
.mc-loadout.is-cascading[data-cascade-from="3"] .mc-step:nth-child(n+4) { animation:mc-step-flash .75s ease both; }
.mc-loadout.is-cascading .mc-step:nth-child(3) { animation-delay:.12s; }
.mc-loadout.is-cascading .mc-step:nth-child(4) { animation-delay:.24s; }
/* Away from the equipment stop the loadout shrinks to its harness and its one-line summary. */
.mc-chapter:not([data-phase="1"]) .mc-step:not([data-step="harness"]) { display:none; }
@media (min-width:861px) {
  /* At the equipment stop the cascade takes the place of the body copy, under the title. */
  .mc-chapter[data-phase="1"] .mc-copy > p, .mc-chapter[data-phase="1"] .mc-event, .mc-chapter[data-phase="1"] .mc-carried { display:none; }
  .mc-chapter[data-phase="1"] .mc-loadout { top:calc(76px + clamp(30px,3.3vw,50px) * 2.25 + 14px); bottom:auto; width:336px; max-width:32%; padding:11px 14px; }
  .mc-chapter[data-phase="1"] .mc-steps { gap:5px; }
  .mc-chapter[data-phase="1"] .mc-step { gap:4px; padding:1px 6px; }
  .mc-chapter[data-phase="1"] .mc-step-label, .mc-chapter[data-phase="1"] .mc-loadout-label { font-size:9.5px; line-height:1.2; margin-bottom:0; }
  .mc-chapter[data-phase="1"] .mc-loadout .mc-model-btn { padding:4px 7px; font-size:10px; }
  .mc-chapter[data-phase="1"] .mc-variant-chips { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
  .mc-chapter[data-phase="1"] .mc-variant-chips::-webkit-scrollbar { display:none; }
  .mc-chapter[data-phase="1"] .mc-chip { padding:3px 8px; font-size:10px; }
  .mc-home .mc-chapter[data-phase="1"] .mc-equipped { font-size:17px; }
  .mc-chapter[data-phase="1"] .mc-loadout-type { font-size:11px; margin-top:1px; }
  .mc-home .mc-chapter[data-phase="1"] .mc-confirm { min-height:30px; margin-top:6px; padding:6px 12px; font-size:11px; }
  .mc-chapter[data-phase="1"] .mc-loadout-summary { margin-top:8px; padding-top:7px; }
}
@media (prefers-reduced-motion:reduce) {
  .mc-loadout.is-cascading *, .mc-loadout.is-cascading .mc-step, .mc-chapter[data-effort="xhigh"] .mc-effort-meter i.on { animation:none !important; }
}
.mc-equipment-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
/* 3D beveled armory wheel with translucent weapon bays and character hub. */
.mc-wheel { position:absolute; z-index:9; width:min(45vw,calc((100svh - var(--mc-pin-top)) * .62),520px); aspect-ratio:1; left:58%; top:44%; transform:translate(-50%,-50%) scale(var(--wheel-scale,.75)); opacity:var(--wheel-opacity,0); pointer-events:none; will-change:transform,opacity; filter:drop-shadow(0 24px 48px rgb(0 0 0 / 55%)); }
.mc-wheel svg { display:block; width:100%; height:100%; overflow:visible; }
.mc-chapter[data-phase="1"] .mc-wheel [data-wheel-item], .mc-chapter[data-phase="1"] .mc-wheel .mc-model-btn { pointer-events:auto; cursor:pointer; outline:none; }
.mc-wheel [data-wheel-item] { --harness-accent:var(--track-1); transition:transform .25s var(--ease-standard); transform-origin:300px 300px; }
.mc-wheel [data-wheel-item="1"],.mc-wheel [data-wheel-item="4"] { --harness-accent:var(--mc-green); }
.mc-wheel [data-wheel-item="2"],.mc-wheel [data-wheel-item="6"] { --harness-accent:var(--track-2); }
.mc-wheel [data-wheel-item="3"] { --harness-accent:var(--mc-blue); }
.mc-wheel [data-wheel-item="5"] { --harness-accent:var(--mc-violet); }
.mc-wheel [data-wheel-item="7"] { --harness-accent:var(--mc-rose); }
.mc-wheel .mc-wheel-bezel-outer { fill:none; stroke:color-mix(in oklab,var(--text-primary) 18%,transparent); stroke-width:2; stroke-dasharray:6 4; }
.mc-wheel .mc-wheel-bezel-inner { fill:none; stroke:color-mix(in oklab,var(--model-accent,var(--track-1)) 45%,transparent); stroke-width:1.8; }
.mc-wheel .mc-wheel-hub-ring { fill:none; stroke:color-mix(in oklab,var(--model-accent,var(--track-1)) 65%,transparent); stroke-width:1.5; stroke-dasharray:10 6; }
.mc-wheel .mc-wheel-tick { fill:none; stroke:color-mix(in oklab,var(--text-primary) 22%,transparent); stroke-width:1.2; }
.mc-wheel .mc-sector-depth { fill:rgb(4 7 14 / 38%); stroke:rgb(0 0 0 / 45%); stroke-width:1; }
.mc-wheel .mc-sector { fill:rgb(10 16 30 / 22%); stroke:color-mix(in oklab,var(--text-primary) 26%,transparent); stroke-width:1.25; transition:fill var(--duration-base),stroke var(--duration-base); }
.mc-wheel .mc-sector-window { fill:color-mix(in oklab,var(--harness-accent) 5%,rgb(8 13 24 / 6%)); stroke:color-mix(in oklab,var(--harness-accent) 36%,transparent); stroke-width:1; }
.mc-wheel .mc-sector-outer-arc { fill:none; stroke:color-mix(in oklab,var(--harness-accent) 65%,white); stroke-width:2.2; opacity:.55; }
.mc-wheel .mc-sector-inner { fill:none; stroke:var(--harness-accent); stroke-width:2.5; opacity:.55; }
.mc-wheel .is-active .mc-sector,.mc-wheel [data-wheel-item]:hover .mc-sector { fill:color-mix(in oklab,var(--harness-accent) 14%,rgb(14 22 38 / 28%)); stroke:var(--harness-accent); stroke-width:2; }
.mc-wheel .is-active .mc-sector-window,.mc-wheel [data-wheel-item]:hover .mc-sector-window { fill:color-mix(in oklab,var(--harness-accent) 12%,rgb(12 20 36 / 10%)); stroke:var(--harness-accent); stroke-width:1.5; }
.mc-wheel .is-active .mc-sector-outer-arc,.mc-wheel [data-wheel-item]:hover .mc-sector-outer-arc { opacity:1; stroke-width:3; }
.mc-wheel [data-wheel-item]:focus-visible .mc-sector { stroke:var(--text-primary); stroke-width:3; }
.mc-wheel .is-equipped .mc-sector-inner { stroke-width:5.5; opacity:1; }
.mc-wheel .mc-item-code { fill:var(--harness-accent); font:600 10px var(--font-mono); text-anchor:middle; letter-spacing:.12em; opacity:.85; }
.mc-wheel .mc-item-name { fill:var(--text-primary); font:650 15px var(--font-sans); text-anchor:middle; letter-spacing:-.015em; paint-order:stroke; stroke:rgb(6 10 18 / 62%); stroke-width:2.5px; stroke-linejoin:round; filter:drop-shadow(0 1px 3px rgb(4 7 14 / 85%)); }
.mc-wheel .mc-item-icon { color:var(--harness-accent); }
/* When the 3D WebGL blasters are rendered inside each wheel bay, hide the 2D SVG fallback icon
   and remove the dark SVG sector tint/window so the 3D weapons sit 100% in the foreground */
.mc-chapter[data-renderer="webgl"] .mc-wheel .mc-item-icon { opacity:0; }
.mc-chapter[data-renderer="webgl"] .mc-wheel .mc-sector-depth,
.mc-chapter[data-renderer="webgl"] .mc-wheel .mc-sector-window,
.mc-chapter[data-renderer="webgl"] .mc-wheel-hub-badge { display:none; }
.mc-chapter[data-renderer="webgl"] .mc-wheel .mc-sector { fill:rgb(0 0 0 / 0.1%); stroke:color-mix(in oklab,var(--text-primary) 24%,transparent); }
.mc-chapter[data-renderer="webgl"] .mc-wheel .is-active .mc-sector,
.mc-chapter[data-renderer="webgl"] .mc-wheel [data-wheel-item]:hover .mc-sector { fill:color-mix(in oklab,var(--harness-accent) 6%,transparent); stroke:var(--harness-accent); stroke-width:2.4; }
.mc-wheel .mc-gun-shadow-layer { fill:rgb(3 6 12 / 90%); stroke:rgb(0 0 0 / 80%); stroke-width:2; stroke-linejoin:round; }
.mc-wheel .mc-gun-body-layer { fill:color-mix(in oklab,var(--harness-accent) 36%,#1d283a); stroke:color-mix(in oklab,var(--harness-accent) 82%,white); stroke-width:1.8; stroke-linejoin:round; }
.mc-wheel .mc-gun-top-layer { fill:color-mix(in oklab,var(--harness-accent) 68%,white); opacity:.92; }
.mc-wheel .mc-gun-core-layer { fill:#ffffff; stroke:var(--harness-accent); stroke-width:1; }
.mc-wheel .is-active .mc-item-name { fill:color-mix(in oklab,var(--harness-accent) 75%,white); }
[data-theme="light"] .mc-wheel .mc-item-name { stroke:rgb(255 255 255 / 82%); filter:drop-shadow(0 1px 2px rgb(14 20 32 / 25%)); }
[data-theme="light"] .mc-wheel .is-active .mc-item-name { fill:color-mix(in oklab,var(--harness-accent) 78%,#0E1420); }
[data-theme="light"] .mc-model-btn.is-active, [data-theme="light"] .mc-chip.is-active { color:#0E1420; background:color-mix(in oklab,var(--model-accent,var(--track-1)) 24%,var(--surface-1)); }
[data-theme="light"] .mc-model-btn.is-active .mc-model-logo { color:var(--mc-mcolor,var(--track-1)); }
[data-theme="light"] .mc-loadout { box-shadow:0 18px 42px -20px rgb(14 20 32 / 22%), var(--inner-highlight); }
[data-theme="light"] .mc-wheel { filter:drop-shadow(0 20px 38px rgb(14 20 32 / 22%)); }
.mc-wheel-hub-badge { position:absolute; left:50%; top:79%; translate:-50% -50%; display:grid; justify-items:center; gap:2px; padding:4px 12px; border-radius:999px; border:1.5px solid var(--model-accent,var(--track-1)); background:color-mix(in oklab,var(--surface-1) 88%,transparent); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); box-shadow:0 0 20px -4px var(--model-accent,var(--track-1)), 0 8px 24px -6px rgb(0 0 0 / 55%), var(--inner-highlight); white-space:nowrap; }
.mc-wheel-hub-badge small { font:600 8.5px/1.2 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--model-accent,var(--track-1)); }
.mc-wheel-hub-badge strong { font:700 13px/1.2 var(--font-sans); color:var(--text-primary); }
.mc-model-roster { position:absolute; z-index:10; left:50%; bottom:-14px; translate:-50% 0; display:flex; flex-wrap:nowrap; gap:6px; padding:6px 10px; border-radius:999px; border:1px solid var(--mc-line); background:color-mix(in oklab,var(--surface-1) 92%,transparent); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); box-shadow:0 16px 36px -8px rgb(0 0 0 / 55%), var(--inner-highlight); white-space:nowrap; pointer-events:auto; }
.mc-wheel-label { display:none; }
/* Caption and shared signature rail sit on the same baseline as scenes above. */
.mc-phase-index { display:none; }
.mc-bottom { position:absolute; z-index:5; left:var(--mc-gutter); right:var(--mc-gutter); bottom:22px; }
.mc-event { display:grid; gap:8px; margin-bottom:24px; max-width:550px; }
.mc-event-label { color:var(--track-1); font:400 11px/1.5 var(--font-mono); letter-spacing:.08em; }
.mc-home .mc-event p { font-size:17px; line-height:1.5; color:var(--text-primary); }
.mc-home .mc-timeline { margin:0 auto; }
.mc-chapter:not([data-renderer="fallback"]):not([data-phase="1"]) .mc-event { opacity:0; pointer-events:none; height:0; margin:0; overflow:hidden; }
.mc-endnote { display:none; }
.mc-access { position:absolute; z-index:6; width:1px; height:1px; overflow:hidden; bottom:0; opacity:0; }
.mc-access:focus-within,.mc-chapter[data-renderer="fallback"] .mc-access { width:280px; height:auto; opacity:1; left:57%; bottom:190px; transform:translateX(-50%); padding:12px 16px; border-radius:12px; border:1px solid var(--mc-line); background:var(--mc-glass); backdrop-filter:blur(12px); }
.mc-access label { display:block; font-size:12px; color:var(--text-secondary); margin-bottom:8px; }
.mc-scrub { display:block; width:100%; accent-color:var(--track-1); }
.mc-fallback { position:absolute; inset:0; z-index:2; display:grid; place-content:center; text-align:center; padding:0 30%; color:var(--text-secondary); background:radial-gradient(ellipse at 65% 45%,var(--track-1-soft),transparent 60%); }
.mc-fallback[hidden] { display:none; }
.mc-fallback strong { color:var(--track-1); font-size:28px; font-weight:600; margin-bottom:20px; }
.mc-fallback p { font-size:14px; }
.mc-chapter[data-renderer="fallback"] .mc-copy { opacity:.65; }
@media (max-height:850px) and (min-width:861px) {
  .mc-home .mc-copy h2 { font-size:36px; }
  .mc-home .mc-copy p { font-size:14px; margin-top:14px; max-width:300px; }
  .mc-loadout { bottom:185px; padding:12px 16px; width:240px; }
  .mc-home .mc-equipped { font-size:21px; }
  .mc-event { margin-bottom:18px; max-width:500px; }
  .mc-home .mc-event p { font-size:15px; }
  .mc-endnote { bottom:90px; }
}
@media (max-width:860px) {
  .mc-home .mc-chapter { height:510svh; }
  .mc-home .mc-corner { top:18px; }
  .mc-scroll-cue { top:20px; }
  .mc-scroll-cue span:last-child { display:none; }
  .mc-copy { top:54px; width:auto; right:var(--mc-gutter); }
  .mc-home .mc-copy h2 { font-size:30px; max-width:410px; }
  .mc-home .mc-copy p { font-size:13px; max-width:330px; margin-top:12px; }
  .mc-chapter[data-phase="1"] .mc-copy p { display:none; }
  .mc-vignette { background:linear-gradient(180deg,var(--bg-canvas),color-mix(in oklab,var(--bg-canvas) 85%,transparent) 12%,transparent 35%,transparent 60%,color-mix(in oklab,var(--bg-canvas) 90%,transparent) 80%,var(--bg-canvas)); }
  .mc-wheel { width:clamp(260px,calc(100svh - var(--mc-pin-top) - 395px),330px); max-width:82vw; left:50%; top:40%; }
  .mc-wheel-label, .mc-model-roster, .mc-wheel-hub-badge { display:none; }
  .mc-wheel .mc-item-name { font-size:26px; }
  .mc-loadout { left:var(--mc-gutter); right:var(--mc-gutter); bottom:145px; width:auto; max-width:none; padding:11px 14px; }
  .mc-loadout-label { font-size:9px; margin-bottom:5px; }
  .mc-home .mc-equipped { font-size:21px; }
  .mc-loadout-type { display:none; }
  .mc-home .mc-confirm { position:absolute; right:12px; bottom:28px; margin:0; width:auto; max-width:46%; min-height:34px; padding:7px 11px; font-size:10px; }
  .mc-carried { font-size:8px; margin-top:6px; }
  .mc-chapter[data-phase="1"] .mc-model-chips { grid-template-columns:repeat(6,minmax(0,1fr)); }
  .mc-chapter[data-phase="1"] .mc-loadout .mc-model-btn { justify-content:center; padding:6px 0; }
  .mc-chapter[data-phase="1"] .mc-loadout .mc-model-btn span { display:none; }
  .mc-variant-chips, .mc-effort-chips { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
  .mc-steps { gap:5px; }
  .mc-chapter[data-phase="1"] .mc-loadout-summary { display:none; }
  /* the cascade sits just above the rail, under the wheel: one row per step */
  .mc-chapter[data-phase="1"] .mc-event, .mc-chapter[data-phase="1"] .mc-carried, .mc-chapter[data-phase="1"] .mc-loadout-type { display:none; }
  .mc-chapter[data-phase="1"] .mc-loadout { bottom:72px; padding:9px 12px; }
  .mc-chapter[data-phase="1"] .mc-step { gap:3px; padding:1px 6px; }
  .mc-chapter[data-phase="1"] .mc-step-label, .mc-chapter[data-phase="1"] .mc-loadout-label { font-size:9px; line-height:1.2; margin-bottom:0; }
  .mc-chapter[data-phase="1"] .mc-step[data-step="harness"] { grid-template-columns:minmax(0,1fr) auto; align-items:center; column-gap:10px; }
  .mc-chapter[data-phase="1"] .mc-step[data-step="harness"] .mc-loadout-label { grid-column:1 / -1; }
  .mc-home .mc-chapter[data-phase="1"] .mc-equipped { font-size:16px; min-height:0; }
  .mc-home .mc-chapter[data-phase="1"] .mc-confirm { position:static; width:auto; max-width:none; margin:0; min-height:30px; padding:5px 12px; font-size:10px; }
  .mc-home .mc-chapter[data-phase="1"] .mc-equipped { font-size:19px; min-height:44px; }
  .mc-home .mc-chapter[data-phase="1"] .mc-carried { width:calc(100vw - 62px); }
  .mc-bottom { bottom:20px; }
  .mc-event { gap:6px; margin-bottom:16px; max-width:100%; }
  .mc-event-label { font-size:9px; }
  .mc-home .mc-event p { font-size:13px; line-height:1.45; }
  .mc-home .mc-timeline li { font-size:0; padding:6px 8px; gap:4px; }
  .mc-home .mc-timeline li.on,.mc-home .mc-timeline li.is-active { font-size:9px; padding:6px 10px; }
  .mc-endnote { display:none; }
  .mc-access:focus-within,.mc-chapter[data-renderer="fallback"] .mc-access { left:50%; bottom:290px; width:min(280px,84vw); padding:8px 12px; }
  .mc-fallback { padding:0 12%; }
  .mc-chapter[data-renderer="fallback"] .mc-fallback { padding-bottom:110px; }
}
@media (prefers-reduced-motion:reduce) {
  .mc-home .mc-chapter { height:auto; }
  .mc-pin { position:relative; top:0; height:max(850px,calc(100svh - var(--mc-pin-top))); }
  .mc-scroll-mouse::after { animation:none; }
  .mc-wheel { transition:none; }
  .mc-access { width:280px; height:auto; opacity:1; left:57%; bottom:190px; transform:translateX(-50%); padding:12px 16px; border-radius:12px; border:1px solid var(--mc-line); background:var(--mc-glass); }
}
@media (max-width:860px) and (prefers-reduced-motion:reduce) {
  .mc-access { left:50%; bottom:290px; width:min(280px,84vw); padding:8px 12px; }
}

/* The homepage does not load site.css, so its header needs the mobile layout here. */
@media(max-width:860px) {
  .v2-home .site-header .nav { flex-wrap:wrap; gap:0 12px; padding-inline:12px; min-width:0; }
  .v2-home .site-header .wordmark { min-height:64px; gap:7px; font-size:16px; }
  .v2-home .site-header .nav-controls { margin-left:auto; flex:none; gap:5px; }
  .v2-home .site-header .nav-links { display:none; order:3; flex:0 0 100%; min-width:0; margin:0; padding:0 0 8px; overflow-x:auto; scrollbar-width:thin; }
  .v2-home .site-header .nav-links.open { display:flex; }
  .v2-home .site-header .nav-links a { flex:none; white-space:nowrap; padding:8px 10px; font-size:12px; }
  .v2-home .subnav { top:var(--header-offset,64px); }
  .v2-home .subnav .wrap { overflow-x:auto; scrollbar-width:none; padding-inline:12px; }
  .v2-home .subnav .wrap::-webkit-scrollbar { display:none; }
  .v2-home .subnav .wrap > a { flex:none; white-space:nowrap; font-size:12px; }
  .v2-home .subnav .wrap > a:first-child { margin-left:0; }
  .v2-home .mc-chapter { --mc-top:calc(var(--header-offset,64px) + 48px); scroll-margin-top:var(--mc-top); }
}
@media(max-width:480px) {
  .v2-home .site-header [data-theme-label] { display:none; }
  .v2-home .site-header .theme-toggle { width:34px; min-width:34px; padding:7px; }
  .v2-home .site-header .language-switch button { min-width:27px; padding-inline:5px; }
  .v2-home .site-header .menu-toggle { font-size:0; width:34px; min-width:34px; padding:6px; gap:0; }
  .v2-home .site-header .menu-toggle span { font-size:18px; }
}

/* Short screens use a normal scrollable frame and explicit scene slider, so
   landscape phones never shrink the wheel or trap controls below a sticky view. */
@media (max-width:860px) and (max-height:720px) {
  .mc-home .mc-chapter { height:auto; }
  .mc-home .mc-pin { position:relative; top:0; height:820px; }
  .mc-wheel { width:min(82vw,330px); top:36%; }
  .mc-access,.mc-access:focus-within,.mc-chapter[data-renderer="fallback"] .mc-access { width:min(280px,84vw); height:auto; opacity:1; left:50%; bottom:285px; transform:translateX(-50%); padding:10px 14px; border:1px solid var(--mc-line); border-radius:12px; background:var(--mc-glass); }
  .mc-scroll-mouse { display:none; }
  .mc-scroll-cue span:last-child { display:block; max-width:100px; text-align:right; font-size:8px; }
}
@media (max-width:860px) and (prefers-reduced-motion:reduce) {
  .mc-wheel { width:min(82vw,330px); top:36%; }
}
/* The room directory follows the active domain as compact category chips. */
.mc-domain-overview { display:flex; gap:8px; margin-top:18px; }
.mc-domain-overview span { padding:5px 10px; border:1px solid var(--mc-line); border-radius:8px; background:var(--mc-glass); color:var(--text-secondary); font:400 11px/1.5 var(--font-mono); }
.mc-domain-overview span:nth-child(1) { color:var(--track-1); }
.mc-domain-overview span:nth-child(2) { color:var(--track-2); }
.mc-domain-overview span:nth-child(3) { color:var(--mc-violet); }
.mc-domain-directory { width:320px; max-width:100%; margin-top:16px; padding:0; border:0; background:none; pointer-events:auto; }
.mc-home .mc-copy .mc-domain-directory p { display:none; }
.mc-domain-directory ul { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px; }
.mc-domain-directory li { display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border-radius:999px; border:1px solid var(--mc-line); background:var(--mc-glass); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); cursor:pointer; transition:border-color .18s ease, transform .18s ease; }
.mc-domain-directory li:hover { border-color:var(--domain-accent,var(--track-1)); transform:translateY(-1px); }
.mc-domain-directory code { display:none; }
.mc-domain-directory li span { color:var(--text-secondary); font:500 11px/1.3 var(--font-sans); }
.mc-domain-directory li::before { content:""; width:5px; height:5px; border-radius:50%; background:var(--domain-accent,var(--track-1)); opacity:.85; }
.mc-chapter[data-domain]:not([data-domain=""]) .mc-loadout-type { display:none; }
.mc-chapter[data-portals] .mc-enter { display:none !important; }
.mc-floating-harness { position:absolute; z-index:4; top:0; left:0; display:grid; gap:3px; width:max-content; max-width:200px; padding:8px 12px; border:1px solid color-mix(in oklab,var(--domain-accent) 45%,var(--mc-line)); border-radius:10px; background:var(--mc-glass); color:var(--text-primary); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); pointer-events:none; will-change:transform; }
.mc-floating-harness::after { content:""; position:absolute; width:1px; height:16px; top:100%; left:50%; background:var(--domain-accent); }
.mc-floating-harness small { font:400 8px/1.3 var(--font-mono); letter-spacing:.07em; color:var(--domain-accent); }
.mc-floating-harness strong { font:600 14px/1.25 var(--font-sans); }
.mc-domain-directory[hidden],.mc-domain-overview[hidden],.mc-floating-harness[hidden] { display:none; }
@media (max-height:850px) and (min-width:861px) {
  .mc-chapter[data-domain]:not([data-domain=""]) .mc-copy > p { display:none; }
  .mc-domain-directory { margin-top:14px; padding:10px 12px; }
  .mc-domain-directory li { padding:6px 0; }
  .mc-domain-directory li span { font-size:11px; }
  .mc-chapter[data-domain]:not([data-domain=""]) .mc-loadout { bottom:170px; padding:11px 14px; }
  .mc-home .mc-chapter[data-domain]:not([data-domain=""]) .mc-equipped { font-size:18px; }
}
@media (max-width:860px) {
  .mc-chapter[data-domain]:not([data-domain=""]) .mc-copy h2 em,
  .mc-chapter[data-domain]:not([data-domain=""]) .mc-copy h2 br,
  .mc-chapter[data-domain]:not([data-domain=""]) .mc-copy > p { display:none; }
  .mc-domain-directory { width:100%; padding:9px 11px; margin-top:10px; }
  .mc-home .mc-copy .mc-domain-directory p { font-size:9px; margin-bottom:5px; }
  .mc-domain-directory ul { display:flex; gap:10px; overflow-x:auto; scrollbar-width:thin; scrollbar-color:var(--mc-line) transparent; padding-bottom:4px; overscroll-behavior-x:contain; }
  .mc-domain-directory li { display:flex; flex-direction:column; align-items:flex-start; flex:0 0 174px; gap:4px; border-top:0; border-right:1px solid var(--mc-line); padding:0 10px 0 0; }
  .mc-domain-directory li:last-child { border-right:0; }
  .mc-domain-directory li span { font-size:12px; }
  .mc-domain-directory code { font-size:9px; }
  .mc-floating-harness { padding:6px 9px; max-width:164px; }
  .mc-floating-harness strong { font-size:12px; }
  .mc-floating-harness small { font-size:7px; }
}
/* Keep the active field name on one rail line, including narrow screens. */
.mc-home .mc-timeline li { white-space:nowrap; }
.mc-domain-directory { position:relative; }
.mc-directory-hint { display:none; }
@media (min-width:861px) {
  .mc-chapter[data-phase="0"] .mc-vignette,
  .mc-chapter[data-domain]:not([data-domain=""]) .mc-vignette { background:linear-gradient(90deg,color-mix(in oklab,var(--bg-canvas) 94%,transparent),color-mix(in oklab,var(--bg-canvas) 80%,transparent) 24%,transparent 48%),linear-gradient(180deg,color-mix(in oklab,var(--bg-canvas) 65%,transparent),transparent 26%,transparent 80%,color-mix(in oklab,var(--bg-canvas) 80%,transparent) 94%,var(--bg-canvas)); }
}
@media (max-width:860px) {
  .mc-directory-hint { display:block; position:absolute; right:11px; top:9px; color:var(--text-secondary); font:400 8px/1.5 var(--font-mono); }
}

/* ---- portals: each room is the way into its track ---- */
.mc-portals { position:absolute; inset:0; z-index:5; pointer-events:none; }
.mc-portal { position:absolute; top:0; left:0; display:grid; grid-template-columns:auto auto; align-items:center; column-gap:14px; padding:12px 16px 12px 18px; border-radius:16px;
  border:1px solid color-mix(in oklab,var(--pc) 60%,transparent); background:color-mix(in oklab,var(--surface-1) 82%,transparent); color:var(--text-primary); text-decoration:none;
  box-shadow:var(--inner-highlight), 0 0 0 1px color-mix(in oklab,var(--pc) 20%,transparent), 0 14px 40px -12px color-mix(in oklab,var(--pc) 70%,transparent); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  opacity:0; visibility:hidden; pointer-events:none; transition:opacity .35s, visibility .35s, box-shadow .25s, border-color .25s; will-change:transform; }
.mc-portal small { grid-column:1; font:500 10px/1.3 var(--font-mono); letter-spacing:.1em; text-transform:uppercase; color:var(--pc); }
.mc-portal b { grid-column:1; font:650 16px/1.25 var(--font-sans); letter-spacing:-.01em; }
.mc-portal i { grid-column:2; grid-row:1 / 3; display:grid; place-items:center; width:34px; height:34px; border-radius:50%; font-style:normal; font-weight:700; color:#0a0f1a; background:var(--pc); transition:transform .25s; }
.mc-portal.is-on { opacity:1; visibility:visible; pointer-events:auto; }
.mc-portal em { display:none; font:650 15px/1.2 var(--font-sans); font-style:normal; letter-spacing:-.01em; white-space:nowrap; }
.mc-portal.is-compact { grid-template-columns:auto auto; column-gap:10px; padding:8px 8px 8px 14px; border-radius:999px; }
.mc-portal.is-compact small, .mc-portal.is-compact b { display:none; }
.mc-portal.is-compact em { display:block; grid-column:1; }
.mc-portal.is-compact i { grid-row:auto; width:28px; height:28px; }
.mc-portal.is-active { padding:14px 18px 14px 20px; border-color:var(--pc); box-shadow:0 0 0 1px var(--pc), 0 0 46px -6px var(--pc); }
.mc-portal.is-active b { font-size:18px; }
.mc-portal:hover, .mc-portal:focus-visible { border-color:var(--pc); box-shadow:0 0 0 1px var(--pc), 0 0 52px -4px var(--pc); }
.mc-portal:hover i, .mc-portal:focus-visible i { transform:translateX(3px); }
.mc-enter { display:inline-flex; align-items:center; margin-top:18px; padding:11px 18px; border-radius:999px; font:600 15px/1 var(--font-sans); text-decoration:none; color:#0a0f1a;
  background:var(--domain-accent,var(--track-1)); box-shadow:0 10px 30px -10px var(--domain-accent,var(--track-1)); pointer-events:auto; }
.mc-enter[hidden] { display:none; }
.mc-enter:hover { filter:brightness(1.08); }
/* without the 3D room, the portals become a plain row of links under the copy */
.mc-chapter[data-renderer="fallback"] .mc-portals, .mc-chapter:not([data-portals]) .mc-portals { position:absolute; inset:auto auto 230px var(--mc-gutter,4%); display:flex; flex-wrap:wrap; gap:10px; }
.mc-chapter[data-renderer="fallback"] .mc-portal, .mc-chapter:not([data-portals]) .mc-portal { position:static; opacity:1; visibility:visible; pointer-events:auto; transform:none !important; }
@media (max-width:700px) {
  .mc-portal { padding:9px 12px 9px 14px; column-gap:10px; border-radius:12px; }
  .mc-portal b { font-size:13px; } .mc-portal.is-active b { font-size:14px; }
  .mc-portal i { width:26px; height:26px; }
}
