/* Approved Alterium Shift display face; original TTF bytes retained.
   ASCII-only coverage is explicit so punctuation and accents use the existing fallback. */
@font-face{font-family:'Alterium Shift Display';src:url('/assets/fonts/AlteriumShiftFont.ttf') format('truetype');font-style:normal;font-weight:500;font-display:swap;size-adjust:115.56%;unicode-range:U+0020-005F,U+0061-007E,U+00A0,U+00B4}
/* Opening headline only: smaller type, with a natural mobile wrap. */
.hero h1{font-size:78px}
@media(min-width:701px) and (max-width:1150px){.hero h1{font-size:65px}}
@media(max-width:700px){.hero h1{font-size:clamp(32px,9.5vw,38px)}.hero h1 br{display:none}}
/* Shared Appearance control. Classic retains its layout and typography. */
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.nav{gap:22px}
.appearance-control{display:flex;align-items:center;flex:none;line-height:1.4}
.appearance-options{display:flex;padding:3px;border:1px solid #50606b;background:#0c151e;border-radius:6px;gap:2px}
.appearance-options button{display:flex;align-items:center;justify-content:center;min-height:44px;min-width:76px;padding:10px 14px;border:1px solid transparent;border-radius:3px;color:#acb8bd;font:600 12px/1.3 Arial,Helvetica,sans-serif;white-space:nowrap;touch-action:manipulation}
.appearance-options button:hover{color:#f7f3e9;background:#1e2c37}
.appearance-options button[aria-pressed="true"]{background:#e6bc72;border-color:#f2cf92;color:#18232b;box-shadow:0 1px 3px #0003}
.appearance-options button:focus-visible{position:relative;z-index:1;outline:2px solid #e6bc72;outline-offset:4px}
.elegant-trailer-art{display:none}
.poster-info{display:contents}
.portrait-elegant,.companion-elegant,.selector .hero-headshot{display:none}
@media(max-width:1280px){
 .nav,.updates-page .nav{display:grid;grid-template-columns:minmax(0,1fr) auto;height:auto;min-height:85px;padding-top:14px;padding-bottom:14px;gap:10px 22px}
 .nav>img,.nav>.brand-home{grid-column:1;grid-row:1}
 .nav>.button,.updates-page .nav>.button{grid-column:2;grid-row:1;margin:0;justify-self:end}
 .nav .navlinks,.updates-page .nav .navlinks{grid-column:1;grid-row:2;width:auto;order:0;justify-content:flex-start;gap:22px;flex-wrap:wrap;font-size:13px}
 .appearance-control{grid-column:2;grid-row:2;justify-self:end}
}
@media(max-width:700px){
 .nav,.updates-page .nav{padding:13px 24px 11px;gap:10px 14px}
 .nav .navlinks{display:none}
 .appearance-control{grid-column:1/-1;grid-row:2;width:100%;justify-content:center;padding-top:2px}
 .appearance-options{width:min(100%,250px)}
 .appearance-options button{flex:1;min-height:44px}
 .updates-page .nav .navlinks{display:flex;grid-column:1/-1;grid-row:3;justify-content:center;gap:10px 22px;margin-top:2px}
}
@media(max-width:350px){.nav,.updates-page .nav{padding-inline:16px}.nav img{width:136px}}

/* Elegant: the reviewed game-pixel direction, using the original source pixels.
   The untouched 48×48 frame uses 16px source slices at exactly 2× scale: 32px on every viewport.
   AlteriumShiftFont.ttf is approved for Elegant display; LargeFont.ttf remains excluded. */
html[data-appearance="elegant"]{
 --e-frame-width:32px;
 --e-bg:#080f25;--e-panel:#1e1c1c;--e-panel-alt:#292127;--e-cream:#fff5e8;
 --e-muted:#d6c9be;--e-peach:#f19c74;--e-coral:#cc5641;--e-burgundy:#681830;--e-line:#7c4b42;
 --e-display:'Alterium Shift Display',ui-monospace,'Cascadia Mono','Segoe UI Mono',Menlo,Consolas,'Liberation Mono',monospace;
 background:var(--e-bg)
}
html[data-appearance="elegant"] body{background:var(--e-bg);color:var(--e-cream)}
html[data-appearance="elegant"] :is(h1,h2,h3){font-family:var(--e-display);font-synthesis:none;font-weight:500;line-height:1.13;letter-spacing:0;text-wrap:balance}
html[data-appearance="elegant"] h2{font-size:44px}
html[data-appearance="elegant"] h3{font-size:28px}
html[data-appearance="elegant"] em{font-style:normal;color:var(--e-peach)}
html[data-appearance="elegant"] :is(.muted,.small,.review-note,.consent,.heading-row p,.poster-meta,.selector-tools,.character-copy p,.media-tile p,.party-member small,.footer-top,.footer-bottom,.postcard-controls){color:var(--e-muted)}
html[data-appearance="elegant"] :is(.eyebrow,.link,.postcard-caption,.media-tabs button.active,.track.active,.track:hover){color:var(--e-peach)}
html[data-appearance="elegant"] .link{border-color:#a76850}
html[data-appearance="elegant"] a:hover{color:var(--e-peach)}
html[data-appearance="elegant"] :is(a,button,input,select):focus-visible{outline:3px solid var(--e-peach);outline-offset:5px}
html[data-appearance="elegant"] .button{background:var(--e-peach);color:#482123;border:3px solid var(--e-coral);box-shadow:inset 0 0 0 2px #ffd5ac,4px 4px 0 #04091b;font-family:var(--e-display);font-synthesis:none;font-size:16px;font-weight:500;text-transform:uppercase;padding:13px 21px;line-height:1.4}
html[data-appearance="elegant"] .button:hover{background:#ffd5ac;color:#482123}
html[data-appearance="elegant"] .button.secondary{background:var(--e-burgundy);color:var(--e-cream);border-color:#bd755d;box-shadow:inset 0 0 0 2px #842f39,3px 3px 0 #0c0b12}
html[data-appearance="elegant"] .button.secondary:hover{background:#842f39;color:var(--e-cream)}
html[data-appearance="elegant"] .skip-link{background:var(--e-peach);color:#482123}
html[data-appearance="elegant"] .nav{background:var(--e-burgundy);border-top:2px solid #a54b51;border-bottom:5px double #cf896b;min-height:95px}
html[data-appearance="elegant"] .navlinks a{font-family:var(--e-display);font-synthesis:none;font-weight:500;font-size:16px;text-transform:uppercase;letter-spacing:.02em}
html[data-appearance="elegant"] .nav .button{padding:10px 16px;font-size:16px;font-weight:500}
html[data-appearance="elegant"] .appearance-options{background:#3d1424;border-color:#b87465;border-radius:3px}
html[data-appearance="elegant"] .appearance-options button{border-radius:0;color:#f0cfbe}
html[data-appearance="elegant"] .appearance-options button:hover{background:#742b3a;color:var(--e-cream)}
html[data-appearance="elegant"] .appearance-options button[aria-pressed="true"]{background:var(--e-peach);color:#482123;border-color:#ffd5ac;box-shadow:0 1px 0 #2c0c1d}
/* One reusable nine-slice contract for every ornate window, including the trailer.
   The 48×48 source is sliced at 16 source pixels. Corners stay exactly 32×32 CSS
   pixels (native 2× source pixels); only the four edges and center stretch. No panel or breakpoint overrides.
   The source center is transparent, so fill behind its entire inner border bands.
   Two crossing background layers leave only the source's four outer 1px corners, rendered at 2×
   transparent, avoiding both padding-box gaps and square corner fill. */
html[data-appearance="elegant"] :where(.character-stage,.postcard,.release-card,.line-section .split>div:first-child,.signup .wrap,dialog,.trailer-poster){
 border:var(--e-frame-width) solid transparent;
 border-image-source:url('/assets/elegant/window-elegant.png');
 border-image-slice:16 fill;
 border-image-width:1;
 border-image-outset:0;
 border-image-repeat:stretch;
 background:linear-gradient(var(--e-panel),var(--e-panel)) center/calc(100% - 4px) 100% no-repeat,linear-gradient(var(--e-panel),var(--e-panel)) center/100% calc(100% - 4px) no-repeat;
 background-origin:border-box;
 background-clip:border-box;
 image-rendering:pixelated
}
html[data-appearance="elegant"] :is(.media-tile img,.party-member img,.published-lineup>img,.postcard img,#dialog-content img,#dialog-content video,#dialog-content iframe){image-rendering:auto}

/* The same headline, copy and actions fill a wide, immersive landscape banner.
   Its verified game-pixel title background is rendered without portrait overlays.
   The borderless background reaches every edge and fades into the page below. */
html[data-appearance="elegant"] .hero{width:100%;height:auto;min-height:740px;margin:0;display:block;padding:0;border:0;background:var(--e-bg);overflow:hidden;isolation:isolate}
html[data-appearance="elegant"] .hero:before{content:'';display:block;position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#080f25e6 0%,#080f25bd 35%,#080f2555 65%,#080f251c),linear-gradient(0deg,#080f25,transparent 40%),url('/assets/elegant/title-screen-pixel.png') center/cover no-repeat;image-rendering:pixelated}
html[data-appearance="elegant"] .hero-copy{width:min(1260px,calc(100% - 64px));min-width:0;margin:0 auto;padding:84px 0 122px;position:relative}
html[data-appearance="elegant"] .hero h1{font-size:clamp(44px,5.2vw,72px);line-height:1.12;max-width:850px;margin:25px 0 30px;text-shadow:0 3px 0 #080f2566}
html[data-appearance="elegant"] .hero p{max-width:490px;font-size:17px;line-height:1.8;color:var(--e-cream);text-shadow:0 2px 2px #080f25}
html[data-appearance="elegant"] .hero .small{display:block;font-size:12px;line-height:1.65;margin-top:25px;color:var(--e-muted)}
html[data-appearance="elegant"] .hero .buttons{gap:14px;flex-wrap:wrap;margin-top:28px}
html[data-appearance="elegant"] .hero .buttons .button{font-size:16px;padding:13px 20px}
html[data-appearance="elegant"] .hero-bottom{display:flex;left:32px;right:32px;bottom:22px;border-color:#f19c7455;color:var(--e-muted);font-size:11px}
html[data-appearance="elegant"] .hero-bottom span:last-child{color:var(--e-peach)}
html[data-appearance="elegant"] .early-signup{background:transparent;border:0;padding:25px 0 0}
html[data-appearance="elegant"] .early-signup .wrap{border-bottom:1px solid #615053;padding:0 7px 25px;gap:18px;color:var(--e-muted);font-size:13px}
html[data-appearance="elegant"] .early-signup b{color:var(--e-muted)}
html[data-appearance="elegant"] .section{padding-block:66px}
html[data-appearance="elegant"] .heading-row{margin:18px 0 29px;gap:32px}
html[data-appearance="elegant"] .heading-row h2{white-space:normal;min-width:0}
html[data-appearance="elegant"] .heading-row p{font-size:14px}
/* A real, uncropped image sits inside the frame. Controls never overlay a face. */
html[data-appearance="elegant"] .trailer-poster{height:auto;display:grid;grid-template-columns:minmax(0,1.8fr) minmax(250px,1fr);align-items:center;overflow:visible;color:var(--e-cream)}
html[data-appearance="elegant"] .trailer-poster:before{display:none}
html[data-appearance="elegant"] .elegant-trailer-art{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;image-rendering:auto;align-self:center;background:#101725}
html[data-appearance="elegant"] .poster-info{display:flex;flex-direction:column;align-items:flex-start;gap:22px;padding:28px;min-width:0}
html[data-appearance="elegant"] .poster-title{position:static;order:1;font:500 clamp(25px,2.5vw,36px)/1.2 var(--e-display);font-synthesis:none;letter-spacing:0;max-width:100%;overflow-wrap:normal;text-wrap:balance}
html[data-appearance="elegant"] .poster-badge{position:static;order:0;background:#48212b;border:1px solid #b87465;color:var(--e-cream);font-size:9px;letter-spacing:1.2px;padding:7px 10px;max-width:100%}
html[data-appearance="elegant"] .play{position:static;order:2;flex:none;width:56px;height:56px;border-radius:0;background:var(--e-burgundy);border:2px solid var(--e-peach);box-shadow:3px 3px 0 #0c0b12}
html[data-appearance="elegant"] .play .triangle{margin:0 0 0 3px}
html[data-appearance="elegant"] .triangle{border-left-color:var(--e-cream)}
html[data-appearance="elegant"] .trailer-poster:hover .play{background:#842f39}

/* Original selector sprites and watercolor portrait remain intact for Classic. */
html[data-appearance="elegant"] .characters{background:#111427;border-color:#4d3442;padding-block:64px}
html[data-appearance="elegant"] .selector{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;border:0;margin-top:30px}
html[data-appearance="elegant"] .selector>.hero-choice{width:auto;height:auto;min-height:104px;padding:17px 20px;gap:18px;border:2px solid var(--e-line);background:#201c26;position:relative;flex-wrap:wrap}
html[data-appearance="elegant"] .selector>.hero-choice.active{background:#3a222c;border-color:var(--e-peach);box-shadow:inset 0 0 0 2px #ad5a4f}
html[data-appearance="elegant"] .selector picture{display:none}
html[data-appearance="elegant"] .selector b{font:500 25px/1.2 var(--e-display);font-synthesis:none;letter-spacing:0;color:var(--e-cream)}
html[data-appearance="elegant"] .selector .active b{color:var(--e-peach)}
html[data-appearance="elegant"] .selector span:not(.hero-headshot){color:var(--e-muted);font-size:11px}
html[data-appearance="elegant"] .selector .hero-headshot{display:block;margin:0;width:64px;height:64px;flex:none;background-image:url('/assets/elegant/portraits.png');background-size:192px 64px;image-rendering:pixelated}
html[data-appearance="elegant"] .hero-choice[data-hero="0"] .hero-headshot{background-position:-64px 0}
html[data-appearance="elegant"] .hero-choice[data-hero="1"] .hero-headshot{background-position:0 0}
html[data-appearance="elegant"] .hero-choice[data-hero="2"] .hero-headshot{background-position:-128px 0}
html[data-appearance="elegant"] .character-stage{height:auto;min-height:410px;margin-top:20px;gap:0;align-items:stretch}
html[data-appearance="elegant"] .character-art{width:44%;height:auto;min-height:346px;background:#101a2d;overflow:hidden;flex-shrink:0}
html[data-appearance="elegant"] .character-art .portrait-classic,html[data-appearance="elegant"] .starter-sprite{display:none}
html[data-appearance="elegant"] .character-art .portrait-elegant{display:block;width:192px;height:313px;max-width:none;left:50%;bottom:0;image-rendering:pixelated}
html[data-appearance="elegant"] .character-art .outline{top:40px;left:3%;width:94%;height:160px}
html[data-appearance="elegant"] .character-art .outline text{font-family:var(--e-display);font-synthesis:none;font-size:155px;letter-spacing:0;fill:#637461;stroke:none;opacity:.6}
html[data-appearance="elegant"] .character-copy{width:56%;padding:24px 36px 28px;margin:0;align-self:center}
html[data-appearance="elegant"] .character-copy h2{font-size:58px;margin:13px 0 19px}
html[data-appearance="elegant"] .character-copy p{font-size:15px;line-height:1.8}
html[data-appearance="elegant"] .tags{gap:9px;margin:23px 0}
html[data-appearance="elegant"] .tags span{background:#30252c;border-color:#966d57;color:#efd6bd;font-size:10px;letter-spacing:1px;padding:5px 9px}
html[data-appearance="elegant"] .hero-theme .button{font-size:16px;min-width:132px;min-height:44px;padding:10px 15px}
html[data-appearance="elegant"] .hero-theme .small{font-size:11px;line-height:1.6}
html[data-appearance="elegant"] .selector-tools{margin-top:17px}
html[data-appearance="elegant"] .quiet{border-color:var(--e-line);background:#201c26}
html[data-appearance="elegant"] .party{border-color:#51414b;margin-top:38px;padding-top:38px}
html[data-appearance="elegant"] .party h3{font-size:35px}
/* Original companion pixels: preserve each complete source canvas and its framing. */
html[data-appearance="elegant"] .party-member .companion-classic{display:none}
html[data-appearance="elegant"] .party-member .art{height:329px;overflow:visible}
html[data-appearance="elegant"] .party-member .companion-elegant{display:block;width:192px;height:auto;max-width:100%;max-height:313px;object-fit:contain;object-position:center bottom;image-rendering:pixelated}
html[data-appearance="elegant"] .party-member b{font-family:var(--e-display);font-synthesis:none;font-weight:500;font-size:24px}
html[data-appearance="elegant"] .party-member .art,html[data-appearance="elegant"] .published-lineup>img{border-color:var(--e-line)}
html[data-appearance="elegant"] .published-lineup h3{font-size:26px}

/* The gallery, soundtrack, forms and dialogs share the same game-window treatment. */
html[data-appearance="elegant"] .media-intro h3{font-size:35px;color:var(--e-peach)}
html[data-appearance="elegant"] .postcard{transform:none;box-shadow:none;padding:0}
html[data-appearance="elegant"] .postcard-controls{border-color:var(--e-line);padding:15px 10px}
html[data-appearance="elegant"] .postcard-caption{font-size:10px;gap:12px;flex-wrap:wrap;padding:16px 10px}
html[data-appearance="elegant"] .media-tabs{gap:10px;border-color:var(--e-line);padding-bottom:17px;margin-top:38px}
html[data-appearance="elegant"] .media-tabs button{padding:8px 15px;border:1px solid #866050;color:var(--e-muted);font-size:12px;min-height:44px}
html[data-appearance="elegant"] .media-tabs button.active{background:var(--e-peach);border-color:var(--e-coral);color:#482123;font-weight:700}
html[data-appearance="elegant"] .media-tile{background:var(--e-panel);border:1px solid #98624f;padding:0}
html[data-appearance="elegant"] .media-tile b{font:500 20px/1.35 var(--e-display);font-synthesis:none;letter-spacing:0;margin:18px 17px 9px}
html[data-appearance="elegant"] .media-tile p{margin:0 17px 18px;font-size:11px}
html[data-appearance="elegant"] .clip-label{color:var(--e-cream);background:#0b1127;border-color:#c68c70;position:static;display:inline-block;margin:12px 17px 0;font-size:11px}
html[data-appearance="elegant"] .line-section{background:#111427;border-block:1px solid #4d3442}
html[data-appearance="elegant"] .line-section .split>div:first-child{padding:18px 17px 16px}
html[data-appearance="elegant"] .split h2{font-size:39px;margin:17px 0 23px}
html[data-appearance="elegant"] .player{gap:17px;margin-top:26px}
html[data-appearance="elegant"] .player .button{padding:13px 17px;flex-shrink:0}
html[data-appearance="elegant"] #music-title{font-family:var(--e-display);font-synthesis:none;font-size:19px;font-weight:500;letter-spacing:0}
html[data-appearance="elegant"] :is(.tracks,.track){border-color:#775146}
html[data-appearance="elegant"] .track{font-size:12px;padding:15px 9px}
html[data-appearance="elegant"] .track.active{background:#39232b}
html[data-appearance="elegant"] .release-card{padding:14px 14px 16px;margin-top:26px}
html[data-appearance="elegant"] .release-card h3{font-size:26px}
html[data-appearance="elegant"] .release-card .button{font-size:16px;padding:12px 14px}
html[data-appearance="elegant"] .signup{padding:64px 0;background:var(--e-bg);border:0}
html[data-appearance="elegant"] .signup .wrap{padding:20px 25px 25px}
html[data-appearance="elegant"] .signup .split{gap:6%}
html[data-appearance="elegant"] .field{background:#111827;border:2px solid #9b7664;color:var(--e-cream);font-size:13px}
html[data-appearance="elegant"] .email-row .button{font-size:16px;padding:12px 14px;white-space:nowrap}
html[data-appearance="elegant"] .footer{background:#050b1b;border-top:1px solid #473c4a}
html[data-appearance="elegant"] .footer-bottom{border-color:#363646}
html[data-appearance="elegant"] dialog{padding:16px;color:var(--e-cream);max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}
html[data-appearance="elegant"] dialog::backdrop{background:#030510ee}
html[data-appearance="elegant"] .dialog-head button{border-color:var(--e-line);background:var(--e-burgundy);font-size:13px}
html[data-appearance="elegant"] #dialog-content p{color:var(--e-muted)}
html[data-appearance="elegant"] #dialog-content p a{color:var(--e-peach)}


html[data-appearance="elegant"] :is(.hero-copy,.character-copy,.media-intro>div,.split>div,.release-card,.player>div,.dialog-head h3){min-width:0}
html[data-appearance="elegant"] :is(.hero h1,.heading-row h2,.character-copy h2,.split h2,.release-card h3,.dialog-head h3){overflow-wrap:break-word}
html[data-appearance="elegant"] .email-row{flex-wrap:wrap}
html[data-appearance="elegant"] .email-row .field{flex:1 1 200px}
html[data-appearance="elegant"] .postcard-controls{gap:8px;flex-wrap:wrap}
html[data-appearance="elegant"] .postcard-controls button{min-height:44px}
html[data-appearance="elegant"] .selector-tools .quiet{flex-wrap:wrap}
html[data-appearance="elegant"] .selector-tools button{min-height:44px}
html[data-appearance="elegant"] .media-tabs{flex-wrap:wrap}
html[data-appearance="elegant"] .media-tile button{height:100%;display:flex;flex-direction:column;align-items:flex-start;text-align:left}
html[data-appearance="elegant"] .media-tile img{flex:none}
html[data-appearance="elegant"] .track>span:last-child{flex:none}
html[data-appearance="elegant"] .dialog-head{align-items:flex-start}
html[data-appearance="elegant"] .dialog-head button{flex:none;min-height:44px}
html[data-appearance="elegant"] #dialog-content :is(img,video){max-height:calc(100dvh - 185px);object-fit:contain}
html[data-appearance="elegant"] #dialog-content :is(p,a){overflow-wrap:anywhere}

/* Released is a third-party component. Only this page's surrounding UI is skinned. */
html[data-appearance="elegant"] .updates-page .navlinks [aria-current="page"]{color:var(--e-peach)}
html[data-appearance="elegant"] .updates-page .updates-intro{background:radial-gradient(ellipse at 85% 0%,#3a222c 0%,transparent 65%),var(--e-panel);border-color:var(--e-line)}
html[data-appearance="elegant"] .updates-page .updates-intro h1{font-size:clamp(36px,4.5vw,64px)}
html[data-appearance="elegant"] .updates-page .back-home{color:var(--e-muted)}
html[data-appearance="elegant"] .updates-page .updates-heading h2{font-size:clamp(27px,3vw,38px)}
html[data-appearance="elegant"] .updates-page .embed-help{background:var(--e-panel-alt);border-color:var(--e-line);color:var(--e-muted)}
html[data-appearance="elegant"] .updates-page .updates-tabs{border-color:var(--e-line)}
html[data-appearance="elegant"] .updates-page .updates-tab{color:var(--e-muted);font-family:var(--e-display);font-synthesis:none;font-weight:500;font-size:16px;text-transform:uppercase}
html[data-appearance="elegant"] .updates-page .updates-tab:hover,html[data-appearance="elegant"] .updates-page .updates-tab[aria-selected="true"]{color:var(--e-peach);background:#3a222c}
html[data-appearance="elegant"] .updates-page .updates-tab[aria-selected="true"]{border-bottom-color:var(--e-peach)}
html[data-appearance="elegant"] .updates-page .released-frame{border-color:var(--e-line);background:#101b26}
html[data-appearance="elegant"] .updates-page .no-script{color:var(--e-peach)}

@media(min-width:951px) and (max-width:1250px){
 html[data-appearance="elegant"] .selector>.hero-choice{gap:12px;padding:14px 15px}
 html[data-appearance="elegant"] .selector span:not(.hero-headshot){display:none}
 html[data-appearance="elegant"] .character-copy{padding:24px}
 html[data-appearance="elegant"] .split h2{font-size:32px}
 html[data-appearance="elegant"] .line-section .split{gap:4%}
 html[data-appearance="elegant"] .line-section .split>div{width:48%}
 html[data-appearance="elegant"] .email-row{flex-wrap:wrap}
}
@media(max-width:950px){
 html[data-appearance="elegant"] .hero{min-height:640px}
 html[data-appearance="elegant"] .hero-copy{padding:64px 0 98px}
 html[data-appearance="elegant"] .hero h1{font-size:clamp(36px,5.5vw,52px);max-width:680px}
 html[data-appearance="elegant"] .hero p{max-width:460px;font-size:15px}
}
@media(max-width:800px){
 html[data-appearance="elegant"] .trailer-poster{grid-template-columns:minmax(0,1fr)}
 html[data-appearance="elegant"] .poster-info{display:grid;grid-template-columns:minmax(0,1fr) 56px;gap:12px 20px;align-items:center;padding:22px 24px}
 html[data-appearance="elegant"] .poster-badge{grid-column:1;grid-row:1;justify-self:start}
 html[data-appearance="elegant"] .poster-title{grid-column:1;grid-row:2;font-size:26px;text-wrap:initial}
 html[data-appearance="elegant"] .play{grid-column:2;grid-row:1/3}
}
@media(max-width:950px){
 html[data-appearance="elegant"] .selector>.hero-choice{padding:14px 10px;gap:12px;justify-content:center;flex-direction:column}
 html[data-appearance="elegant"] .selector span:not(.hero-headshot){display:none}
 html[data-appearance="elegant"] .character-copy{padding:22px}
 html[data-appearance="elegant"] .character-copy h2{font-size:44px}
 html[data-appearance="elegant"] .character-copy p{font-size:14px}
 html[data-appearance="elegant"] .line-section .split,html[data-appearance="elegant"] .signup .split{display:block}
 html[data-appearance="elegant"] .line-section .split>div,html[data-appearance="elegant"] .signup .split>div{width:auto}
 html[data-appearance="elegant"] .line-section .split>div+div,html[data-appearance="elegant"] .signup .split>div+div{margin-top:38px}
 html[data-appearance="elegant"] .line-section .split>div:first-child{padding:20px 22px}
 html[data-appearance="elegant"] .media-intro{display:block}
 html[data-appearance="elegant"] .media-intro>div:first-child{width:auto}
 html[data-appearance="elegant"] .postcard{width:100%;margin-top:25px}
 html[data-appearance="elegant"] .media-intro h3 br{display:none}
}
@media(max-width:700px){
 html[data-appearance="elegant"] .wrap{margin-inline:16px}
 html[data-appearance="elegant"] .hero{width:100%;min-height:0;margin:0}
 html[data-appearance="elegant"] .hero:before{background-position:center,center,20% center}
 html[data-appearance="elegant"] .hero-copy{width:calc(100% - 24px);padding:42px 0 36px;margin:0 auto}
 html[data-appearance="elegant"] .hero h1{font-size:clamp(25px,6.8vw,38px);line-height:1.16;margin:17px 0 22px}
 html[data-appearance="elegant"] .hero h1 br{display:none}
 html[data-appearance="elegant"] .hero p{font-size:13px;line-height:1.8}
 html[data-appearance="elegant"] .hero .eyebrow{font-size:9px;letter-spacing:1.8px}
 html[data-appearance="elegant"] .hero-bottom{display:none}
 html[data-appearance="elegant"] .hero .buttons{display:flex;flex-direction:row;gap:12px;margin-top:22px}
 html[data-appearance="elegant"] .hero .buttons .button{text-align:center;font-size:16px;padding:12px 10px;min-height:48px;flex:1 1 135px;min-width:0;display:flex;align-items:center;justify-content:center}
 html[data-appearance="elegant"] .hero .small{text-align:left;margin-top:18px;font-size:10px}
 html[data-appearance="elegant"] .early-signup{padding-top:22px}
 html[data-appearance="elegant"] .early-signup .wrap{padding:0 3px 22px;font-size:12px}
 html[data-appearance="elegant"] .early-signup b{display:block;margin-bottom:8px}
 html[data-appearance="elegant"] .section{padding-block:40px}
 html[data-appearance="elegant"] .heading-row{margin:15px 0 23px}
 html[data-appearance="elegant"] .heading-row h2,html[data-appearance="elegant"] .split h2{font-size:31px;line-height:1.15}
 html[data-appearance="elegant"] .heading-row p{font-size:13px}
 html[data-appearance="elegant"] .poster-info{padding:17px 14px;grid-template-columns:minmax(0,1fr) 44px;gap:10px 14px}
 html[data-appearance="elegant"] .poster-title{font-size:21px;line-height:1.2}
 html[data-appearance="elegant"] .poster-badge{font-size:8px;letter-spacing:.8px;padding:5px 7px}
 html[data-appearance="elegant"] .play{height:44px;width:44px}
 html[data-appearance="elegant"] .characters{padding-block:40px}
 html[data-appearance="elegant"] .selector{gap:8px;margin-top:24px}
 html[data-appearance="elegant"] .selector>.hero-choice{padding:12px 3px;min-height:91px;gap:11px;flex-direction:column}
 html[data-appearance="elegant"] .selector b{font-size:20px}
 html[data-appearance="elegant"] .selector .hero-headshot{width:32px;height:32px;background-size:96px 32px}
 html[data-appearance="elegant"] .hero-choice[data-hero="0"] .hero-headshot{background-position:-32px 0}
 html[data-appearance="elegant"] .hero-choice[data-hero="1"] .hero-headshot{background-position:0 0}
 html[data-appearance="elegant"] .hero-choice[data-hero="2"] .hero-headshot{background-position:-64px 0}
 html[data-appearance="elegant"] .character-stage{display:block;min-height:0;margin-top:16px}
 html[data-appearance="elegant"] .character-art{width:100%;min-height:313px;height:313px}
 html[data-appearance="elegant"] .character-art .outline{top:29px;height:150px}
 html[data-appearance="elegant"] .character-copy{width:auto;padding:24px 12px 20px}
 html[data-appearance="elegant"] .character-copy h2{font-size:42px}
 html[data-appearance="elegant"] .tags{gap:6px;margin:20px 0}
 html[data-appearance="elegant"] .tags span{font-size:9px;padding:5px 7px;letter-spacing:.5px}
 html[data-appearance="elegant"] .hero-theme{display:block}
 html[data-appearance="elegant"] .hero-theme .button{display:block;width:100%;text-align:center}
 html[data-appearance="elegant"] .hero-theme .small{margin-top:14px;text-align:center;max-width:none;font-size:10px}
 html[data-appearance="elegant"] .selector-tools{margin-top:17px;font-size:11px}
 html[data-appearance="elegant"] .selector-tools .quiet{gap:11px;width:100%;justify-content:space-between;padding:10px}
 html[data-appearance="elegant"] .party{margin-top:30px;padding-top:30px}
 html[data-appearance="elegant"] .party h3{font-size:28px;line-height:1.17}
 html[data-appearance="elegant"] .party-member b{font-size:21px}
 html[data-appearance="elegant"] .published-lineup h3{font-size:25px}
 html[data-appearance="elegant"] .media-intro h3{font-size:28px}
 html[data-appearance="elegant"] .postcard-caption{font-size:9px;padding:13px 4px;gap:7px}
 html[data-appearance="elegant"] .postcard-controls{padding:12px 3px;font-size:10px}
 html[data-appearance="elegant"] .media-tabs{gap:6px;justify-content:space-between;margin:27px 0 20px}
 html[data-appearance="elegant"] .media-tabs button{padding:8px 9px;font-size:10px}
 html[data-appearance="elegant"] .media-grid{gap:18px}
 html[data-appearance="elegant"] .media-tile b{font-size:20px}
 html[data-appearance="elegant"] .line-section .split>div:first-child{padding:17px 12px}
 html[data-appearance="elegant"] .line-section .split>div:first-child h2{font-size:29px}
 html[data-appearance="elegant"] .player{gap:12px}
 html[data-appearance="elegant"] .player .button{padding:12px 13px}
 html[data-appearance="elegant"] #music-title{font-size:17px}
 html[data-appearance="elegant"] #music-status{font-size:10px}
 html[data-appearance="elegant"] .track{font-size:11px;padding:14px 4px;gap:8px}
 html[data-appearance="elegant"] .release-card{padding:15px 12px}
 html[data-appearance="elegant"] .release-card h3{font-size:24px}
 html[data-appearance="elegant"] .signup{padding-block:38px}
 html[data-appearance="elegant"] .signup .wrap{padding:18px 12px 21px}
 html[data-appearance="elegant"] .signup .split>div+div{margin-top:25px}
 html[data-appearance="elegant"] .signup h2{font-size:29px}
 html[data-appearance="elegant"] .signup .muted{font-size:13px}
 html[data-appearance="elegant"] .footer{padding-block:30px}
 html[data-appearance="elegant"] dialog{padding:10px;width:calc(100vw - 24px)}
 html[data-appearance="elegant"] .dialog-head{align-items:flex-start;gap:8px;flex-wrap:wrap}
 html[data-appearance="elegant"] .dialog-head h3{font-size:20px}
 html[data-appearance="elegant"] .dialog-head button{min-height:44px;padding:8px 12px}
 html[data-appearance="elegant"] .updates-page .updates-intro h1{font-size:35px}
}
@media(forced-colors:active){
 .appearance-options,.appearance-options button{border:1px solid ButtonText}
 .appearance-options button[aria-pressed="true"],html[data-appearance="elegant"] .appearance-options button[aria-pressed="true"]{background:Highlight;color:HighlightText;border-color:Highlight}
 html[data-appearance="elegant"] :where(.character-stage,.postcard,.release-card,.line-section .split>div:first-child,.signup .wrap,dialog,.trailer-poster){border-image:none;border-color:transparent;background:Canvas;outline:2px solid CanvasText;outline-offset:-3px}
}

/* Approved closing invitation A: one surface, two columns, shared control row. */
.closing-invitation{padding:76px 0 80px;scroll-margin-top:32px}
.closing-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-rows:auto auto 52px auto auto;gap:12px clamp(28px,4vw,60px)}
.closing-columns>div{min-width:0;display:grid;grid-template-rows:subgrid;grid-row:1/6}
.closing-actions{grid-column:1}
.closing-newsletter{grid-column:2;scroll-margin-top:32px}
.closing-invitation h2{grid-row:1/3;align-self:end;margin:0;font-size:clamp(38px,4.8vw,62px);line-height:1.15;padding-bottom:8px}
.closing-invitation h2 em{display:block}
.closing-invitation .buttons{grid-row:3;display:flex;flex-direction:row;align-items:stretch;gap:12px;margin:0;max-width:none}
.closing-invitation .button{min-height:52px;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;padding:12px 20px;white-space:nowrap}
.closing-invitation .button:disabled{opacity:.65;cursor:not-allowed}
.closing-invitation .button.secondary:disabled:hover{background:transparent;color:inherit}
.closing-invitation .small{grid-row:4/6;align-self:start;margin:0;font-size:12px;line-height:1.6}
.closing-newsletter .muted{grid-row:1;align-self:center;margin:0;line-height:1.7}
.closing-newsletter form{grid-row:2/6;display:grid;grid-template-rows:subgrid;min-width:0}
.closing-newsletter form>label:first-child{grid-row:1;align-self:end}
.closing-newsletter .email-row{grid-row:2;display:flex;flex-wrap:nowrap;margin:0;gap:12px;min-width:0}
.closing-newsletter .email-row .field{flex:1 1 0;min-width:0;width:0;height:52px;box-sizing:border-box;margin:0}
.closing-newsletter .email-row .button{flex:0 0 auto;height:52px;width:auto}
.closing-newsletter .consent{grid-row:3}
.closing-newsletter #signup-note{grid-row:4;margin-top:0!important}
html[data-appearance="elegant"] .closing-invitation{background:var(--e-bg)}
html[data-appearance="elegant"] .closing-invitation .wrap{padding:30px 34px 34px}
html[data-appearance="elegant"] .closing-invitation h2{font-size:clamp(32px,4.2vw,48px);margin:0}
html[data-appearance="elegant"] .closing-invitation .button{padding:12px 16px;font-size:16px}
html[data-appearance="elegant"] .closing-invitation .button.secondary:disabled:hover{background:var(--e-burgundy);color:var(--e-cream)}
@media(max-width:1099px){
 .closing-columns{grid-template-columns:minmax(0,1fr);grid-template-rows:none;gap:32px}
 .closing-columns>div,.closing-newsletter form{display:block;grid-column:auto;grid-row:auto}
 .closing-invitation h2,html[data-appearance="elegant"] .closing-invitation h2{margin-bottom:20px;padding-bottom:0}
 .closing-invitation .small{margin-top:12px}
 .closing-newsletter .muted{margin-bottom:20px}
 .closing-newsletter .email-row{margin:10px 0 14px}
 .closing-newsletter #signup-note{margin-top:15px!important}
}
@media(max-width:700px){
 .closing-invitation{padding:50px 0 54px}
 html[data-appearance="elegant"] .closing-invitation .wrap{padding:18px 12px 21px}
 html[data-appearance="elegant"] .closing-invitation h2{font-size:29px}
 .closing-invitation .buttons{flex-wrap:wrap}
 .closing-invitation .buttons .button{flex:1 1 155px}
 .closing-newsletter .email-row{flex-wrap:wrap}
 .closing-newsletter .email-row .field{flex:1 1 180px;width:100%}
 .closing-newsletter .email-row .button{flex:1 1 auto}
}

/* Requested desktop optical nudge: move only the intro by half its own line height. */
@media(min-width:1100px){
 .closing-newsletter .muted{position:relative;top:0.5lh}
}
