.hub-site { min-height: 100%; background: #071321; color: var(--cloud); }
.hub-header { position: relative; z-index: 10; min-height: 78px; padding: 0 clamp(1.1rem,4vw,4.5rem); display: flex; align-items: center; justify-content: space-between; gap: 2rem; border-bottom: 1px solid rgba(234,243,247,.18); background: rgba(5,11,19,.9); }
.hub-header nav { display: flex; align-items: center; gap: clamp(.8rem,2vw,1.7rem); }
.hub-header nav a,.hub-home-link { color: var(--cloud); font-size: .875rem; font-weight: 850; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }
.hub-header nav a:hover,.hub-home-link:hover { color: var(--signal); }
.hub-hero { position: relative; min-height: 72svh; padding: clamp(6rem,11vw,10rem) clamp(1.1rem,7vw,7.5rem) clamp(4rem,8vw,7rem); display: grid; align-items: end; isolation: isolate; overflow: hidden; }
.hub-hero > img { position: absolute; z-index: -3; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .58; }
.hub-hero::before { content: ''; position: absolute; z-index: -2; inset: 0; background: linear-gradient(90deg,rgba(3,8,14,.98) 0%,rgba(3,8,14,.74) 52%,rgba(3,8,14,.18)),linear-gradient(0deg,#071321 0%,transparent 65%); }
.hub-hero::after { content: ''; position: absolute; z-index: -1; inset: 0; opacity: .18; background-image: linear-gradient(rgba(125,213,220,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(125,213,220,.18) 1px,transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(to right,#000,transparent 70%); }
.hub-hero-copy { max-width: 940px; }
.hub-code { margin: 0 0 1.25rem; color: var(--signal); font-size: .875rem; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.hub-code span { display: inline-block; width: 36px; height: 1px; margin-right: .7rem; vertical-align: middle; background: currentColor; }
.hub-hero h1 { max-width: 980px; margin: 0; font-family: var(--display); font-size: clamp(4rem,10vw,9rem); font-weight: 500; letter-spacing: -.065em; line-height: .82; text-transform: uppercase; }
.hub-hero h1 em { color: transparent; font-style: normal; -webkit-text-stroke: 1px rgba(234,243,247,.8); }
.hub-hero-copy > p:last-of-type { max-width: 720px; margin: 2rem 0 0; color: var(--mist); font-family: var(--display); font-size: clamp(1.15rem,2vw,1.5rem); line-height: 1.55; }
.hub-actions { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: .75rem; }
.hub-main { background: var(--cloud); color: var(--night); }
.hub-section { padding: clamp(4.5rem,8vw,8rem) clamp(1.1rem,7vw,7.5rem); }
.hub-section + .hub-section { border-top: 1px solid rgba(7,19,33,.18); }
.hub-section.dark { background: #071321; color: var(--cloud); }
.hub-section.ice { background: #dce9ed; }
.hub-section.ember { background: #a83a23; color: #fff; }
.hub-heading { display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,.52fr); gap: clamp(2rem,6vw,7rem); align-items: end; margin-bottom: 3rem; }
.hub-heading h2 { margin: .4rem 0 0; font-family: var(--display); font-size: clamp(3rem,6.5vw,6.5rem); font-weight: 500; letter-spacing: -.05em; line-height: .9; }
.hub-heading > p { margin: 0; color: #405661; line-height: 1.7; }
.dark .hub-heading > p { color: var(--mist); }
.hub-kicker { margin: 0; color: #a43a23; font-size: .875rem; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.dark .hub-kicker,.ember .hub-kicker { color: var(--signal); }
.content-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: rgba(7,19,33,.2); border: 1px solid rgba(7,19,33,.2); }
.content-grid.two { grid-template-columns: repeat(2,minmax(0,1fr)); }
.content-card { padding: clamp(1.3rem,2.5vw,2.2rem); background: #f8fbfc; }
.dark .content-grid { background: rgba(234,243,247,.18); border-color: rgba(234,243,247,.18); }
.dark .content-card { background: #0b1d2a; }
.content-card > span,.number-chip { color: #a43a23; font-family: var(--display); font-size: 1.4rem; }
.dark .content-card > span,.dark .number-chip { color: var(--ember-bright); }
.content-card h3 { margin: 2.3rem 0 .65rem; font-family: var(--display); font-size: clamp(1.8rem,3vw,2.7rem); font-weight: 500; line-height: 1; }
.content-card h3:first-child { margin-top: 0; }
.content-card p { margin: .5rem 0 0; color: #405661; line-height: 1.65; }
.dark .content-card p { color: var(--mist); }
.content-card small { display: block; margin-top: 1.2rem; color: #526873; font-size: .875rem; }
.dark .content-card small { color: rgba(234,243,247,.55); }
.character-line { display: grid; grid-template-columns: 85px minmax(0,1fr) minmax(210px,.4fr); gap: 1.5rem; padding: 1.5rem 0; border-top: 1px solid rgba(7,19,33,.2); }
.character-line:last-child { border-bottom: 1px solid rgba(7,19,33,.2); }
.character-line > span { color: #a43a23; font-family: var(--display); font-size: 1.5rem; }
.character-line h3 { margin: 0 0 .45rem; font-family: var(--display); font-size: 2rem; font-weight: 500; }
.character-line p { margin: 0; color: #405661; line-height: 1.6; }
.character-line aside { color: #405661; font-size: .875rem; line-height: 1.6; }
.status-badge { display: inline-flex; align-items: center; gap: .45rem; padding: .45rem .65rem; border: 1px solid currentColor; color: #a43a23; font-size: .875rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.status-badge::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.status-badge.ready { color: #24715a; }
.status-badge.pending { color: #9a5c18; }
.notice-panel { margin-top: 2rem; padding: 1.25rem 1.4rem; border-left: 5px solid var(--ember); background: #f7fafb; color: #344c58; line-height: 1.65; }
.dark .notice-panel { background: #0b1d2a; color: var(--mist); }
.spoiler-copy[hidden] { display: none; }
.spoiler-toggle { min-height: 48px; margin-top: 1rem; padding: .7rem 1rem; border: 1px solid rgba(7,19,33,.25); background: transparent; color: var(--night); font: 850 .875rem var(--sans); letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
.timeline-tabs,.broadcast-tabs { display: flex; flex-wrap: wrap; gap: 1px; background: rgba(7,19,33,.18); }
.timeline-tabs button,.broadcast-tabs button { flex: 1 1 145px; min-height: 64px; padding: .8rem; border: 0; background: #edf4f6; color: #304955; font: 850 .875rem var(--sans); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.timeline-tabs button[aria-selected="true"],.broadcast-tabs button[aria-selected="true"] { background: var(--ember); color: var(--night); }
.timeline-readout,.broadcast-readout { min-height: 340px; padding: clamp(1.5rem,4vw,4rem); display: grid; grid-template-columns: minmax(0,.55fr) 1fr; gap: clamp(2rem,5vw,6rem); background: #071321; color: var(--cloud); }
.timeline-readout h2,.broadcast-readout h2 { margin: .5rem 0; font-family: var(--display); font-size: clamp(2.7rem,5vw,5rem); font-weight: 500; line-height: .9; }
.timeline-readout p,.broadcast-readout p { color: var(--mist); line-height: 1.7; }
.foundation-drama { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(234,243,247,.18); }
.foundation-drama > div { padding: 1.4rem; background: #0b1d2a; }
.foundation-drama strong { display: block; margin-bottom: .5rem; color: var(--signal); font-size: .875rem; letter-spacing: .1em; text-transform: uppercase; }
.broadcast-masthead { color: var(--ember-bright); font-size: .875rem; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.ticker { padding: .8rem 0; background: var(--ember); color: var(--night); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.ticker span { display: block; padding: 0 1.1rem; white-space: normal; line-height: 1.6; }
@keyframes ticker { to { transform: translateX(-100%); } }
.release-board { display: grid; gap: 1px; background: rgba(7,19,33,.2); border: 1px solid rgba(7,19,33,.2); }
.release-row { min-height: 92px; padding: 1rem 1.25rem; display: grid; grid-template-columns: 55px minmax(0,1fr) 110px 170px; gap: 1rem; align-items: center; background: #f8fbfc; }
.release-row > span:first-child { color: #a43a23; font-family: var(--display); font-size: 1.5rem; }
.release-row strong { font-family: var(--display); font-size: 1.35rem; font-weight: 500; }
.release-row small { color: #5b707b; }
.countdown-panel { padding: clamp(2rem,5vw,4rem); border: 1px solid rgba(234,243,247,.2); background: radial-gradient(circle at 80% 20%,rgba(223,91,55,.2),transparent 35%),#071321; color: var(--cloud); }
.countdown-panel output { display: block; margin: .8rem 0; color: var(--signal); font-family: var(--display); font-size: clamp(2.5rem,6vw,5.8rem); line-height: .9; }
.signup-shell { max-width: 780px; }
.signup-shell .signup-form { background: #0b1d2a; }
.track-card { min-height: 310px; position: relative; overflow: hidden; color: #fff; }
.track-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.35) saturate(.75); }
.track-card > div { position: relative; z-index: 1; min-height: 310px; padding: 1.6rem; display: flex; flex-direction: column; justify-content: flex-end; }
.track-card h3 { margin: .45rem 0; font-family: var(--display); font-size: 2.3rem; font-weight: 500; }
.track-card p { margin: 0; color: #e2edf0; line-height: 1.55; }
.track-meta { margin-top: 1rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.track-meta span { padding: .35rem .5rem; border: 1px solid rgba(255,255,255,.3); font-size: .875rem; letter-spacing: .08em; text-transform: uppercase; }
.support-roadmap { counter-reset: roadmap; }
.support-step { padding: 1.5rem 0; display: grid; grid-template-columns: 80px minmax(0,1fr) minmax(180px,.35fr); gap: 1.5rem; border-top: 1px solid rgba(7,19,33,.2); }
.support-step::before { counter-increment: roadmap; content: '0' counter(roadmap); color: #a43a23; font-family: var(--display); font-size: 1.5rem; }
.support-step h3 { margin: 0 0 .45rem; font-family: var(--display); font-size: 2rem; font-weight: 500; }
.support-step p { margin: 0; color: #405661; line-height: 1.65; }
.support-step aside { color: #5d727d; font-size: .875rem; line-height: 1.6; }
.press-assets { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: .6rem; }
.press-assets img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.credits-list { margin: 0; }
.credits-list > div { padding: 1rem 0; display: grid; grid-template-columns: minmax(160px,.35fr) 1fr; gap: 1rem; border-top: 1px solid rgba(7,19,33,.2); }
.credits-list dt { color: #a43a23; font-size: .875rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.credits-list dd { margin: 0; }
.access-table { width: 100%; border-collapse: collapse; }
.access-table th,.access-table td { padding: 1rem; border: 1px solid rgba(7,19,33,.2); text-align: left; vertical-align: top; }
.access-table th { background: #071321; color: var(--cloud); font-size: .875rem; letter-spacing: .1em; text-transform: uppercase; }
.access-table td { background: #f8fbfc; }
.game-shell { display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,.4fr); gap: 1px; background: rgba(234,243,247,.2); border: 1px solid rgba(234,243,247,.2); }
.game-scene,.game-stats { padding: clamp(1.4rem,4vw,3.5rem); background: #0b1d2a; }
.game-scene h2 { margin: .5rem 0 1rem; font-family: var(--display); font-size: clamp(2.5rem,5vw,4.8rem); font-weight: 500; line-height: .95; }
.game-scene > p { color: var(--mist); font-size: 1.05rem; line-height: 1.7; }
.choice-list { display: grid; gap: .6rem; margin-top: 2rem; }
.choice-list button { min-height: 58px; padding: .8rem 1rem; border: 1px solid rgba(234,243,247,.24); background: transparent; color: var(--cloud); font: 750 .9rem var(--sans); text-align: left; cursor: pointer; }
.choice-list button:hover,.choice-list button:focus-visible { border-color: var(--signal); background: rgba(125,213,220,.08); }
.meter-row { margin-bottom: 1.2rem; }
.meter-row .meter-label { display: flex; justify-content: space-between; color: var(--mist); font-size: .875rem; letter-spacing: .08em; text-transform: uppercase; }
.meter-track { height: 7px; margin-top: .45rem; background: rgba(234,243,247,.12); }
.meter-track span { display: block; height: 100%; background: linear-gradient(90deg,var(--signal),var(--ember-bright)); transition: width .3s ease; }
.game-log { min-height: 4.5rem; color: var(--signal); line-height: 1.55; }
.feed-list article { padding: 1.5rem 0; display: grid; grid-template-columns: 140px minmax(0,1fr); gap: 2rem; border-top: 1px solid rgba(7,19,33,.2); }
.feed-list time { color: #a43a23; font-size: .875rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.feed-list h2 { margin: 0 0 .5rem; font-family: var(--display); font-size: 2.2rem; font-weight: 500; }
.feed-list p { margin: 0; color: #405661; line-height: 1.65; }
.language-links { display: flex; flex-wrap: wrap; gap: .6rem; }
.language-links a { padding: .65rem .8rem; border: 1px solid rgba(7,19,33,.25); color: var(--night); font-size: .875rem; font-weight: 800; text-decoration: none; text-transform: uppercase; }
.language-note { margin-bottom: 2rem; padding: 1rem 1.2rem; border-left: 4px solid var(--ember); background: #f3f7f8; color: #405661; }
.hub-footer { padding: 2.5rem clamp(1.1rem,7vw,7.5rem); display: grid; grid-template-columns: 1fr auto; gap: 2rem; align-items: end; background: #040b12; color: var(--mist); }
.hub-footer nav { display: flex; flex-wrap: wrap; gap: 1rem; }
.hub-footer a { color: var(--signal); text-decoration: none; }
.hub-footer p { margin: .5rem 0 0; font-size: .875rem; }
.print-only { display: none; }
.hub-section:not(.dark) .button-quiet { color: var(--night); border: 1px solid #526873; }
.dark .status-badge { color: var(--ember-bright); }
.dark .status-badge.pending { color: var(--signal); }
button:disabled { opacity: .75; cursor: not-allowed; }
.content-card,.cinema-copy { overflow-wrap: anywhere; }

@media(max-width:900px){
  .hub-header{flex-wrap:wrap;gap:.5rem;padding-top:1rem;padding-bottom:1rem}
  .hub-header nav{display:flex;order:3;flex-basis:100%;flex-wrap:wrap;gap:.25rem .8rem;border-top:1px solid rgba(234,243,247,.18);padding-top:.5rem}
  .hub-header nav a{display:inline-flex;align-items:center;min-height:44px;font-size:.875rem}
  .hub-heading,.timeline-readout,.broadcast-readout,.game-shell{grid-template-columns:1fr}
  .content-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .press-assets{grid-template-columns:repeat(3,minmax(0,1fr))}
  .character-line,.support-step{grid-template-columns:65px 1fr}.character-line aside,.support-step aside{grid-column:2}
}
@media(max-width:620px){
  .hub-hero{min-height:660px}.hub-hero h1{font-size:clamp(3.8rem,17vw,6rem)}
  .content-grid,.content-grid.two,.foundation-drama{grid-template-columns:1fr}
  .release-row{grid-template-columns:45px 1fr}.release-row small,.release-row .status-badge{grid-column:2}
  .press-assets{grid-template-columns:repeat(2,minmax(0,1fr))}
  .credits-list>div,.feed-list article{grid-template-columns:1fr;gap:.4rem}
  .access-table{display:block;overflow-x:auto}
  .hub-footer{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.ticker span{animation:none;padding-left:1rem}}
@media print{
  .hub-header,.hub-footer,.hub-actions,.spoiler-toggle,.signup-form,.choice-list{display:none!important}
  .hub-site,.hub-main,.hub-section,.dark .content-card{background:#fff!important;color:#000!important}
  .hub-hero{min-height:0;padding:2rem}.hub-hero>img,.hub-hero::before,.hub-hero::after{display:none}.hub-hero h1{font-size:48pt;color:#000}
  .hub-section{padding:1.5rem}.print-only{display:block}
}