:root {
  color-scheme: dark;
  --bg: #070812;
  --surface: #10121d;
  --surface-2: #161925;
  --surface-3: #1c202e;
  --ink: #f7f2e8;
  --muted: #a6a7b2;
  --line: rgba(255,255,255,.11);
  --gold: #ffbb46;
  --saffron: #ff7a1a;
  --violet: #8d68ff;
  --cyan: #65e3ff;
  --danger: #ff526a;
  --safe-bottom: max(14px, env(safe-area-inset-bottom));
  --header-h: 70px;
  --nav-h: 78px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin: 0; min-width: 320px; min-height: 100vh; color: var(--ink); background: var(--bg); overflow-x: hidden; }
body:has(dialog[open]) { overflow: hidden; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; }
img { display: block; max-width: 100%; }

.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.ambient { position: fixed; border-radius: 999px; filter: blur(110px); pointer-events: none; opacity: .18; z-index: 0; }
.ambient-one { width: 430px; height: 430px; top: -180px; right: -180px; background: #7639ff; }
.ambient-two { width: 360px; height: 360px; left: -230px; top: 48vh; background: #e86a10; }
.app-shell { position: relative; z-index: 1; min-height: 100vh; }

.offline-notice { position: fixed; z-index: 100; top: 0; left: 0; right: 0; padding: 8px 16px; text-align: center; color: #19110a; background: var(--gold); font-size: .77rem; font-weight: 800; letter-spacing: .04em; }
.offline-notice:not([hidden]) + .ambient ~ .app-shell .app-header { top: 31px; }

.app-header { position: sticky; z-index: 30; top: 0; height: var(--header-h); display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px clamp(16px, 4vw, 40px); border-bottom: 1px solid rgba(255,255,255,.08); background: rgba(7,8,18,.78); backdrop-filter: blur(20px) saturate(130%); }
.brand-button { display: inline-flex; align-items: center; gap: 10px; min-width: 0; padding: 0; border: 0; background: none; cursor: pointer; text-align: left; }
.brand-logo { display:block; width:40px; height:40px; border-radius:10px; object-fit:contain; box-shadow:0 0 28px rgba(255,139,25,.18); }
.brand-copy { display: grid; line-height: 1; }
.brand-copy strong { font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; font-size: 1.02rem; letter-spacing: .12em; }
.brand-copy small { margin-top: 5px; color: var(--muted); font-size: .53rem; font-weight: 800; letter-spacing: .2em; }
.install-button { display: inline-flex; align-items: center; gap: 7px; min-height: 42px; padding: 0 14px; border: 1px solid rgba(255,187,70,.42); border-radius: 99px; color: #fff6df; background: rgba(255,178,56,.1); font-size: .77rem; font-weight: 850; letter-spacing: .025em; cursor: pointer; }
.install-button svg { width: 17px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.install-button.installed { color: #8fe8bf; border-color: rgba(86,216,157,.32); background: rgba(86,216,157,.08); }

main { width: min(100%, 1240px); margin-inline: auto; padding: 0 clamp(14px, 3vw, 34px) calc(var(--nav-h) + var(--safe-bottom) + 44px); }
.screen { animation: screen-in .35s ease both; }
.screen[hidden] { display: none; }
@keyframes screen-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.premiere-hero { position: relative; min-height: min(690px, calc(100svh - var(--header-h) - 10px)); margin: 14px 0 0; border: 1px solid rgba(255,255,255,.11); border-radius: 28px; overflow: hidden; isolation: isolate; background: radial-gradient(circle at 72% 25%,rgba(255,114,24,.22),transparent 40%), linear-gradient(145deg,#151827,#080910 70%); box-shadow: 0 24px 80px rgba(0,0,0,.42); }
.premiere-hero::before { content: ""; position: absolute; z-index: -1; inset: 0; opacity: .12; background-image: linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size: 36px 36px; mask-image: linear-gradient(to bottom,transparent,#000 30%,#000); }
.premiere-art { position: absolute; z-index: -1; inset: 0; }
.premiere-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(7,8,18,.99) 0%,rgba(7,8,18,.82) 43%,rgba(7,8,18,.16) 74%),linear-gradient(0deg,#080910 0%,transparent 36%); }
.premiere-art img { width: 100%; height: 100%; object-fit: cover; object-position: 72% 32%; filter: saturate(.96) contrast(1.05); }
.premiere-orbit { position: absolute; right: 12%; top: 17%; width: min(360px,38vw); aspect-ratio: 1; border: 1px solid rgba(255,181,68,.23); border-radius: 50%; box-shadow: inset 0 0 70px rgba(255,129,26,.08),0 0 70px rgba(255,129,26,.06); animation: orbit 14s linear infinite; }
.premiere-orbit::before,.premiere-orbit::after { content:""; position:absolute; inset:9%; border:1px dashed rgba(255,255,255,.18); border-radius:50%; }
.premiere-orbit::after { inset:42%; border-style:solid; background:rgba(255,181,68,.08); }
@keyframes orbit { to { transform: rotate(360deg); } }
.premiere-copy { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; width: 62%; min-height: min(690px, calc(100svh - var(--header-h) - 10px)); padding: clamp(28px,5vw,70px); }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 30px; color: #ded9cd; font-size: .7rem; font-weight: 900; letter-spacing: .18em; }
.eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: var(--saffron); box-shadow: 0 0 13px var(--saffron); animation: blink 1.7s ease-in-out infinite; }
@keyframes blink { 50% { opacity:.32; } }
.release-chip { padding: 8px 12px; border: 1px solid rgba(255,187,70,.45); border-radius: 99px; color: var(--gold); background: rgba(255,187,70,.07); font-size: .64rem; font-weight: 950; letter-spacing: .16em; }
.premiere-copy h1 { margin: 17px 0 0; color: #fffaf0; font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; font-size: clamp(5.8rem,13vw,11rem); font-style: italic; font-weight: 900; line-height: .73; letter-spacing: -.045em; text-shadow: 0 10px 35px rgba(0,0,0,.45); transform: translateX(-.04em); }
.premiere-copy h1 em { color: transparent; -webkit-text-stroke: 2px #ffad38; font-style: inherit; filter: drop-shadow(0 0 20px rgba(255,122,26,.2)); }
.hero-subtitle { margin: 27px 0 0; color: #f7c66f; font-size: clamp(.72rem,1.4vw,.95rem); font-weight: 950; letter-spacing: .23em; }
.hero-quote { margin: 20px 0 0; color: #d5d2cd; font-family: Georgia, serif; font-size: clamp(1rem,2vw,1.25rem); font-style: italic; line-height: 1.55; }
.release-date { display: inline-grid; margin-top: 27px; padding-left: 15px; border-left: 2px solid var(--saffron); }
.release-date strong { font-size: .95rem; letter-spacing: .13em; }
.release-date span { margin-top: 5px; color: var(--muted); font-size: .68rem; font-weight: 800; letter-spacing: .12em; }

.countdown-panel { margin: 18px 0 0; padding: clamp(22px,4vw,42px); border: 1px solid var(--line); border-radius: 26px; background: linear-gradient(145deg,rgba(22,25,38,.96),rgba(12,14,23,.98)); box-shadow: 0 20px 60px rgba(0,0,0,.22); }
.section-label { display:flex; align-items:center; gap:12px; color:#e3ded3; }
.section-label span { color: var(--gold); font-family: Georgia,serif; font-style:italic; }
.section-label p { margin:0; font-size:.66rem; font-weight:900; letter-spacing:.19em; }
.countdown { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:22px; }
.time-unit { min-width:0; padding: clamp(14px,3vw,25px) 6px; border:1px solid rgba(255,255,255,.1); border-radius:18px; text-align:center; background:rgba(255,255,255,.035); }
.time-unit strong { display:block; font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size:clamp(1.7rem,7vw,3.8rem); font-weight:800; line-height:1; letter-spacing:-.08em; font-variant-numeric:tabular-nums; }
.time-unit span { display:block; margin-top:8px; color:var(--muted); font-size:clamp(.49rem,1.8vw,.66rem); font-weight:900; letter-spacing:.13em; }
.countdown-status { margin:16px 0 0; color:var(--muted); text-align:center; font-size:.8rem; }
.social-launches { display:grid; grid-template-columns:1fr; gap:12px; margin-top:24px; }
.social-launch { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:14px; min-height:78px; padding:14px 18px; border:1px solid rgba(255,255,255,.13); border-radius:18px; text-decoration:none; transition:.2s ease; }
.social-launch:hover { transform:translateY(-2px); border-color:rgba(255,255,255,.3); }
.social-launch.instagram { background:linear-gradient(125deg,rgba(126,46,175,.35),rgba(218,52,91,.16)); }
.social-launch.youtube { background:linear-gradient(125deg,rgba(215,31,48,.32),rgba(83,13,19,.19)); }
.social-mark { display:grid; place-items:center; width:43px; height:43px; border-radius:14px; color:#fff; background:rgba(255,255,255,.1); font-size:1.25rem; }
.social-launch > span:nth-child(2) { display:grid; }
.social-launch small { color:rgba(255,255,255,.62); font-size:.53rem; font-weight:900; letter-spacing:.13em; }
.social-launch strong { margin-top:2px; font-size:clamp(.92rem,2.6vw,1.17rem); letter-spacing:.08em; }
.social-launch b { font-size:1.15rem; font-weight:500; }

.content-section { margin-top:50px; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:18px; }
.section-kicker { color:var(--gold); font-size:.62rem; font-weight:950; letter-spacing:.18em; }
.section-heading h2 { margin:6px 0 0; font-size:clamp(1.65rem,4vw,2.4rem); letter-spacing:-.035em; }
.text-button { padding:8px 0; border:0; border-bottom:1px solid rgba(255,187,70,.4); color:#f6cd7a; background:none; font-size:.76rem; font-weight:850; cursor:pointer; }
.story-rail { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(245px,31%); gap:14px; padding-bottom:9px; overflow-x:auto; overscroll-behavior-inline:contain; scroll-snap-type:inline mandatory; scrollbar-width:thin; scrollbar-color:rgba(255,187,70,.35) transparent; }

.story-card { --card-accent: #ffb949; position:relative; display:flex; flex-direction:column; min-height:275px; padding:20px; border:1px solid rgba(255,255,255,.1); border-radius:22px; color:var(--ink); text-align:left; overflow:hidden; isolation:isolate; cursor:pointer; scroll-snap-align:start; background:linear-gradient(150deg,color-mix(in srgb,var(--card-accent) 16%,#161925),#0d0f18 66%); transition:transform .22s ease,border-color .22s ease; }
.story-card::before { content:""; position:absolute; z-index:-1; width:200px; height:200px; top:-110px; right:-90px; border-radius:50%; background:var(--card-accent); opacity:.19; filter:blur(20px); }
.story-card::after { content:attr(data-index); position:absolute; z-index:-1; right:10px; bottom:-25px; color:rgba(255,255,255,.035); font-family:Impact,sans-serif; font-size:7.4rem; line-height:1; }
.story-card:hover { transform:translateY(-4px); border-color:color-mix(in srgb,var(--card-accent) 55%,transparent); }
.story-card-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.collection-pill { padding:6px 8px; border:1px solid color-mix(in srgb,var(--card-accent) 45%,transparent); border-radius:99px; color:color-mix(in srgb,var(--card-accent) 78%,white); background:rgba(0,0,0,.18); font-size:.53rem; font-weight:950; letter-spacing:.11em; }
.story-icon { font-size:1.2rem; filter:drop-shadow(0 0 10px color-mix(in srgb,var(--card-accent) 50%,transparent)); }
.story-card h3 { max-width:92%; margin:auto 0 0; font-size:1.25rem; line-height:1.03; letter-spacing:-.02em; }
.story-card .story-subtitle { margin:7px 0 0; color:color-mix(in srgb,var(--card-accent) 72%,white); font-family:Georgia,serif; font-size:.86rem; line-height:1.35; }
.story-card .story-summary { display:-webkit-box; margin:14px 0 0; color:var(--muted); font-size:.76rem; line-height:1.5; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.story-card .read-story { display:flex; align-items:center; gap:7px; margin-top:17px; color:#fff; font-size:.68rem; font-weight:900; letter-spacing:.06em; }

.mayavanam-preview { position:relative; display:block; width:100%; min-height:410px; margin:52px 0 0; padding:0; border:1px solid rgba(151,225,173,.25); border-radius:28px; color:#fff; text-align:left; overflow:hidden; cursor:pointer; background:#0a1517; }
.mayavanam-preview img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1s ease; }
.mayavanam-preview:hover img { transform:scale(1.035); }
.mayavanam-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(5,11,14,.95),rgba(5,11,14,.2) 70%),linear-gradient(0deg,rgba(5,11,14,.85),transparent 60%); }
.mayavanam-copy { position:absolute; inset:auto auto 0 0; display:grid; padding:clamp(26px,5vw,58px); }
.mayavanam-copy small { color:#9ae6b2; font-size:.63rem; font-style:normal; font-weight:950; letter-spacing:.2em; }
.mayavanam-copy strong { margin-top:9px; font-family:Georgia,serif; font-size:clamp(2.8rem,8vw,6.3rem); font-weight:500; letter-spacing:-.05em; line-height:.9; }
.mayavanam-copy em { margin-top:8px; color:#d0e9d8; font-family:Georgia,serif; font-size:clamp(.9rem,2vw,1.2rem); }
.mayavanam-copy b { margin-top:24px; color:#e6b957; font-size:.75rem; letter-spacing:.06em; }
.home-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin:18px 0 0; border:1px solid var(--line); border-radius:22px; overflow:hidden; background:var(--line); }
.home-stats div { display:grid; gap:5px; justify-items:center; padding:24px 8px; background:#10121b; }
.home-stats strong { color:var(--gold); font-family:Georgia,serif; font-size:1.9rem; }
.home-stats span { color:var(--muted); font-size:.64rem; text-align:center; }

.page-intro { padding:clamp(44px,8vw,85px) 0 27px; }
.page-intro h1 { margin:8px 0 0; font-size:clamp(2.8rem,8vw,6rem); line-height:.94; letter-spacing:-.06em; }
.page-intro p { max-width:650px; margin:16px 0 0; color:var(--muted); font-size:clamp(.93rem,2vw,1.08rem); line-height:1.65; }
.search-wrap { position:relative; display:flex; align-items:center; max-width:720px; }
.search-wrap svg { position:absolute; left:16px; width:20px; fill:none; stroke:var(--muted); stroke-width:1.8; }
.search-wrap input { width:100%; height:58px; padding:0 48px; border:1px solid var(--line); border-radius:17px; outline:0; color:var(--ink); background:#11131e; }
.search-wrap input:focus { border-color:rgba(255,187,70,.65); box-shadow:0 0 0 4px rgba(255,187,70,.08); }
.search-wrap button { position:absolute; right:10px; width:38px; height:38px; border:0; border-radius:50%; background:rgba(255,255,255,.06); cursor:pointer; font-size:1.2rem; }
.filter-row { display:flex; gap:8px; margin:17px 0 0; padding-bottom:7px; overflow-x:auto; scrollbar-width:none; }
.filter-chip { flex:0 0 auto; min-height:39px; padding:0 15px; border:1px solid var(--line); border-radius:99px; color:var(--muted); background:rgba(255,255,255,.025); font-size:.72rem; font-weight:800; cursor:pointer; }
.filter-chip.active { color:#20160b; border-color:var(--gold); background:linear-gradient(135deg,#ffe28e,#ff9c2e); }
.archive-meta { display:flex; justify-content:space-between; gap:15px; margin:22px 0 12px; color:var(--muted); font-size:.7rem; }
.archive-meta p { margin:0; color:#eee8dc; font-weight:800; }
.story-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.story-grid .story-card { min-height:300px; }
.empty-state { padding:70px 20px; border:1px dashed rgba(255,255,255,.14); border-radius:24px; text-align:center; }
.empty-state > span { color:var(--gold); font-size:2.2rem; }
.empty-state h2 { margin:12px 0 5px; }
.empty-state p { margin:0 0 22px; color:var(--muted); }

.character-intro { max-width:760px; }
.gallery-links { display:flex; flex-wrap:wrap; gap:10px; margin:0 0 26px; }
.gallery-links button { min-height:44px; padding:11px 19px; border:1px solid var(--line); border-radius:99px; color:var(--ink); background:var(--surface); font:inherit; font-size:.875rem; font-weight:750; cursor:pointer; }
.gallery-links button:hover { border-color:var(--gold); color:var(--gold); }
.gallery-links button:focus-visible { outline:3px solid var(--cyan); outline-offset:3px; }
.character-layout { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; align-items:start; padding-bottom:34px; }
.character-side, .gallery-realm { scroll-margin-top:calc(var(--header-h) + 20px); }
.character-side:focus-visible, .gallery-realm:focus-visible { outline:2px solid var(--cyan); outline-offset:5px; }
.character-side { min-width:0; padding:18px; border:1px solid var(--line); border-radius:27px; background:linear-gradient(150deg,rgba(255,185,73,.055),#0e1019 38%); }
.villain-side { background:linear-gradient(150deg,rgba(217,57,57,.08),#0e1019 38%); }
.defense-side { background:linear-gradient(150deg,rgba(101,227,255,.1),#0e1019 38%); }
.character-side-header { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:13px; margin-bottom:17px; padding:4px 3px 15px; border-bottom:1px solid var(--line); }
.character-side-mark { display:grid; place-items:center; width:43px; height:43px; border:1px solid rgba(255,187,70,.26); border-radius:14px; color:#281a08; background:linear-gradient(135deg,#ffe48e,#ff9d2d); font-size:1.2rem; }
.villain-side .character-side-mark { color:#fff; border-color:rgba(255,88,88,.25); background:linear-gradient(135deg,#df4040,#6e1524); }
.defense-side .character-side-mark { color:#09212b; border-color:rgba(101,227,255,.35); background:linear-gradient(135deg,#c3f6ff,#56bfff); }
.character-side-mark svg { width:23px; height:23px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linejoin:round; }
.character-side-header div > span { color:var(--muted); font-size:.75rem; font-weight:800; letter-spacing:.06em; }
.character-side-header h2 { margin:3px 0 0; font-size:1.5rem; letter-spacing:-.04em; }
.character-side-header > strong { color:rgba(255,255,255,.19); font-family:Impact,sans-serif; font-size:2rem; font-style:italic; font-weight:500; }
.villain-order-note { margin:-2px 2px 16px; padding:11px 13px; border-left:2px solid #d84b4b; border-radius:0 10px 10px 0; color:#bfafb2; background:rgba(190,54,62,.07); font-size:.875rem; line-height:1.55; }
.character-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.character-card { position:relative; display:block; min-width:0; padding:0; border:1px solid rgba(255,255,255,.11); border-radius:19px; color:var(--ink); text-align:left; overflow:hidden; background:#11131d; cursor:zoom-in; transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease; }
.character-card:hover { transform:translateY(-3px); border-color:rgba(255,187,70,.48); box-shadow:0 17px 36px rgba(0,0,0,.28); }
.villain-card:hover { border-color:rgba(224,74,78,.58); }
.character-card:focus-visible { outline:3px solid rgba(105,220,255,.72); outline-offset:3px; }
.character-portrait { position:relative; display:block; aspect-ratio:3/4; overflow:hidden; background:linear-gradient(145deg,#f7f7f4,#d7d7d5); }
.character-portrait::after { content:""; position:absolute; inset:auto 0 0; height:28%; background:linear-gradient(0deg,rgba(9,10,17,.3),transparent); pointer-events:none; }
.character-portrait img { display:block; width:100%; height:100%; object-fit:contain; transition:transform .45s ease; }
.character-card:hover .character-portrait img { transform:scale(1.025); }
.character-rank { position:absolute; z-index:2; top:9px; left:9px; display:grid; place-items:center; min-width:42px; height:30px; padding:0 9px; border:1px solid rgba(255,255,255,.28); border-radius:99px; color:#fff; background:linear-gradient(135deg,#e44747,#7b1827); box-shadow:0 5px 18px rgba(72,5,10,.34); font-size:.72rem; font-weight:950; }
.zoom-cue { position:absolute; z-index:2; right:9px; bottom:9px; display:grid; place-items:center; width:33px; height:33px; border:1px solid rgba(255,255,255,.28); border-radius:50%; color:#fff; background:rgba(8,10,18,.7); backdrop-filter:blur(8px); }
.zoom-cue svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.character-card-copy { display:grid; gap:5px; min-height:78px; padding:13px 14px 15px; }
.character-card-copy strong { font-size:.96rem; line-height:1.15; }
.character-card-copy small { color:var(--muted); font-size:.875rem; line-height:1.42; }
.defense-grid { grid-template-columns:minmax(0,1fr); }
.defense-side .character-portrait { aspect-ratio:4/3; background:#05070b; }
.defense-side .character-portrait::after { display:none; }
.defense-side .character-card:hover { border-color:var(--cyan); }
.gallery-realm { padding:32px 0 40px; border-top:1px solid rgba(151,225,173,.25); }
.gallery-realm > .section-heading { flex-wrap:wrap; gap:18px; }
.gallery-realm .section-kicker { color:#9ae6b2; }
.gallery-realm .section-heading h3 { margin:6px 0 0; font-size:clamp(1.5rem,4vw,2rem); letter-spacing:-.035em; }
.gallery-realm-cover img { max-height:600px; object-fit:contain; background:#080e11; }
.realm-intro { margin:14px 0 0; padding:clamp(28px,6vw,70px); border:1px solid rgba(151,225,173,.22); border-radius:28px; background:radial-gradient(ellipse at top right,rgba(65,158,98,.17),transparent 70%),#0d1519; }
.realm-intro .section-kicker { color:#9ae6b2; }
.realm-intro h1 { margin:18px 0; font-family:Georgia,serif; font-size:clamp(2.2rem,8vw,6rem); font-weight:500; line-height:1.05; letter-spacing:-.045em; overflow-wrap:anywhere; }
.realm-intro p { margin:0 0 28px; color:#b7e7c8; font-size:.875rem; font-weight:800; letter-spacing:.12em; line-height:1.6; }
.realm-intro .secondary-button { white-space:normal; line-height:1.5; }

.realm-hero { position:relative; min-height:min(660px,72svh); margin:14px 0 0; border-radius:28px; overflow:hidden; }
.realm-hero img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.realm-hero-shade { position:absolute; inset:0; background:linear-gradient(0deg,#070812 0%,rgba(7,8,18,.18) 60%),linear-gradient(90deg,rgba(7,8,18,.72),transparent 65%); }
.realm-title { position:absolute; left:clamp(24px,6vw,70px); bottom:clamp(30px,7vw,72px); }
.realm-title h1 { margin:8px 0 0; font-family:Georgia,serif; font-size:clamp(4rem,11vw,9rem); font-weight:500; letter-spacing:-.07em; line-height:.82; text-shadow:0 7px 40px #000; }
.realm-title p { margin:18px 0 0; color:#b7e7c8; font-size:.7rem; font-weight:950; letter-spacing:.27em; }
.realm-body { max-width:850px; margin:clamp(34px,6vw,70px) auto; }
.realm-body p { color:#c4c4c8; font-family:Georgia,serif; font-size:clamp(1rem,2.1vw,1.22rem); line-height:1.85; }
.realm-body .realm-lead { color:#fffaf0; font-size:clamp(1.5rem,4vw,2.6rem); line-height:1.35; letter-spacing:-.03em; }
.realm-body blockquote { margin:36px 0 0; padding:27px clamp(22px,4vw,38px); border-left:3px solid #84d8a0; border-radius:0 18px 18px 0; color:#def5e6; background:rgba(81,164,110,.09); font-family:Georgia,serif; font-size:clamp(1.1rem,2.7vw,1.5rem); font-style:italic; line-height:1.6; }
.realm-features { margin-top:62px; }
.realm-gallery { margin-top:46px; }
.realm-gallery .section-kicker { color:#9ae6b2; }
.realm-gallery-note { margin:-7px 0 22px; color:#c5d9cc; font-size:1rem; line-height:1.5; }
.realm-picture-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.realm-picture { display:block; min-width:0; padding:0; overflow:hidden; border:1px solid rgba(151,225,173,.25); border-radius:20px; color:#e4f2e9; text-align:left; background:#0f171b; cursor:zoom-in; }
.realm-picture img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:contain; }
.realm-picture span { display:block; padding:15px 18px; font-size:1rem; line-height:1.4; }
.realm-picture:hover { border-color:#9ae6b2; }
.realm-picture:focus-visible { outline:3px solid #9ae6b2; outline-offset:4px; }
@media (max-width:600px) { .realm-picture-grid { grid-template-columns:minmax(0,1fr); gap:16px; } }
.realm-gallery-figure { margin:0; border:1px solid rgba(151,225,173,.25); border-radius:24px; overflow:hidden; background:#0f171b; }
.realm-gallery-image { display:block; width:100%; padding:0; border:0; background:#fff; cursor:zoom-in; }
.realm-gallery-image img { display:block; width:100%; height:auto; }
.realm-gallery-image:focus-visible { outline:3px solid #9ae6b2; outline-offset:-3px; }
.realm-gallery-figure figcaption { padding:17px 20px; color:#c5d9cc; font-size:.875rem; line-height:1.6; }
.feature-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.feature-grid article { min-height:230px; padding:22px; border:1px solid rgba(130,217,161,.15); border-radius:20px; background:linear-gradient(145deg,rgba(47,116,72,.13),#10131b); }
.feature-grid article > span { color:#78d798; font-family:Georgia,serif; font-style:italic; }
.feature-grid h3 { margin:45px 0 9px; font-size:1.04rem; }
.feature-grid p { margin:0; color:var(--muted); font-size:.78rem; line-height:1.55; }
.realm-stories-button { display:flex !important; margin:28px auto 0; }

.creator-hero { padding:clamp(46px,8vw,90px) 0 32px; text-align:center; }
.creator-emblem { width:min(360px,70vw); aspect-ratio:1.45; margin:0 auto 32px; border:1px solid var(--line); border-radius:28px; overflow:hidden; background:#0f1119; box-shadow:0 30px 75px rgba(0,0,0,.35); }
.creator-emblem img { width:100%; height:100%; object-fit:cover; }
.creator-hero h1 { margin:10px 0 0; font-size:clamp(3.2rem,9vw,7rem); line-height:.93; letter-spacing:-.065em; }
.creator-role { margin:18px auto 0; color:#f0c875; font-family:Georgia,serif; font-size:clamp(1rem,2.3vw,1.35rem); line-height:1.6; }
.creator-intro { max-width:720px; margin:24px auto 0; color:var(--muted); font-size:clamp(.95rem,2vw,1.12rem); line-height:1.75; }
.creator-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:14px; }
.creator-card { min-height:245px; padding:clamp(22px,4vw,38px); border:1px solid var(--line); border-radius:24px; background:#11131e; }
.creator-card h2 { margin:36px 0 12px; font-size:clamp(2rem,5vw,3.4rem); line-height:1; letter-spacing:-.05em; }
.creator-card p { color:var(--muted); line-height:1.65; }
.vision-card { grid-row:span 2; min-height:504px; background:radial-gradient(circle at 70% 20%,rgba(255,127,27,.18),transparent 36%),linear-gradient(145deg,#1c1a20,#10121b); }
.vision-card p { max-width:560px; margin-top:28px; font-size:1rem; }
.creator-card ul { display:flex; flex-wrap:wrap; gap:9px; margin:35px 0 0; padding:0; list-style:none; }
.creator-card li { padding:8px 11px; border:1px solid rgba(255,187,70,.22); border-radius:99px; color:#ebd8b6; background:rgba(255,187,70,.06); font-size:.74rem; }
.contact-card { display:flex; flex-direction:column; align-items:flex-start; }
.contact-card a { max-width:100%; margin:38px 0 18px; color:#f6d28b; overflow-wrap:anywhere; }
.official-links { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:14px 0 0; }
.official-links a { display:grid; gap:5px; padding:22px; border:1px solid var(--line); border-radius:19px; text-decoration:none; background:#11131e; }
.official-links span { color:var(--muted); font-size:.7rem; }
.official-links strong { font-size:.86rem; overflow-wrap:anywhere; }
.app-footer { margin:45px 0 0; padding:30px 0 10px; border-top:1px solid var(--line); text-align:center; }
.app-footer strong { font-family:Impact,sans-serif; letter-spacing:.16em; }
.app-footer p { color:var(--muted); font-size:.7rem; }

.feedback-form { max-width:760px; padding:clamp(20px,4vw,38px); border:1px solid var(--line); border-radius:26px; background:#11131e; }
.feedback-form fieldset { margin:0 0 27px; padding:0; border:0; }
.feedback-form legend,.feedback-form > label { display:block; margin:0 0 9px; color:#e9e4da; font-size:.76rem; font-weight:850; }
.feedback-form > label:not(:first-of-type) { margin-top:22px; }
.feedback-form label span { color:var(--muted); font-weight:500; }
.rating-row { display:grid; grid-template-columns:repeat(5,1fr); gap:7px; }
.rating-row label { cursor:pointer; }
.rating-row input { position:absolute; opacity:0; pointer-events:none; }
.rating-row span { display:grid; place-items:center; min-height:68px; border:1px solid var(--line); border-radius:14px; color:#fff; background:rgba(255,255,255,.025); font-size:1.15rem; font-weight:800; }
.rating-row small { margin-top:2px; color:var(--muted); font-size:.48rem; font-weight:650; }
.rating-row input:checked + span { color:#21170b; border-color:var(--gold); background:linear-gradient(135deg,#ffe28e,#ff9c2e); }
.rating-row input:checked + span small { color:#563911; }
.feedback-form select,.feedback-form textarea,.feedback-form > input { width:100%; border:1px solid var(--line); border-radius:15px; outline:0; color:var(--ink); background:#0b0d15; }
.feedback-form select,.feedback-form > input { height:52px; padding:0 14px; }
.feedback-form textarea { padding:14px; resize:vertical; line-height:1.5; }
.feedback-form select:focus,.feedback-form textarea:focus,.feedback-form > input:focus { border-color:rgba(255,187,70,.65); box-shadow:0 0 0 4px rgba(255,187,70,.08); }
.submit-feedback { width:100%; margin-top:27px; }
.form-note { margin:12px 0 0; color:var(--muted); font-size:.68rem; line-height:1.5; text-align:center; }

.primary-button,.secondary-button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 19px; border-radius:14px; font-size:.76rem; font-weight:900; text-decoration:none; cursor:pointer; }
.primary-button { border:1px solid #ffbd4d; color:#21160a; background:linear-gradient(135deg,#ffe28d 0%,#ffae38 55%,#f8731b 100%); box-shadow:0 10px 28px rgba(248,115,27,.17); }
.secondary-button { border:1px solid var(--line); color:#eee9df; background:rgba(255,255,255,.045); }

.bottom-nav { position:fixed; z-index:35; left:50%; bottom:max(8px,env(safe-area-inset-bottom)); display:grid; grid-template-columns:repeat(6,1fr); width:min(calc(100% - 20px),720px); height:var(--nav-h); padding:8px 7px; border:1px solid rgba(255,255,255,.13); border-radius:22px; transform:translateX(-50%); background:rgba(13,15,25,.88); backdrop-filter:blur(22px) saturate(140%); box-shadow:0 20px 50px rgba(0,0,0,.52); }
.nav-item { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:4px 2px; border:0; border-radius:15px; color:#7f828f; background:none; cursor:pointer; }
.nav-item svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.nav-item span:last-child { font-size:.54rem; font-weight:800; }
.nav-item.active { color:#2a1b07; background:linear-gradient(135deg,#ffe28e,#fca633); box-shadow:0 6px 18px rgba(252,166,51,.16); }
.realm-nav-icon { display:grid; place-items:center; width:21px; height:21px; font-size:1rem; }

.robot-launcher { position:fixed; z-index:45; right:max(14px,env(safe-area-inset-right)); bottom:calc(var(--nav-h) + var(--safe-bottom) + 7px); display:grid; place-items:center; width:59px; height:59px; padding:0; border:1px solid rgba(108,226,255,.55); border-radius:50%; color:#091017; background:linear-gradient(145deg,#b4f3ff,#68d8ff 55%,#8b71ff); box-shadow:0 10px 32px rgba(82,201,255,.35); cursor:pointer; }
.robot-pulse { position:absolute; inset:-5px; border:1px solid rgba(101,227,255,.35); border-radius:50%; animation:robot-pulse 2.1s ease-out infinite; }
@keyframes robot-pulse { 70%,100% { opacity:0; transform:scale(1.26); } }
.robot-face { position:relative; display:block; width:31px; height:26px; border:2px solid #182237; border-radius:10px; background:rgba(255,255,255,.46); }
.robot-face::before { content:""; position:absolute; left:50%; top:-7px; width:2px; height:6px; background:#182237; transform:translateX(-50%); }
.robot-face::after { content:""; position:absolute; left:50%; top:-9px; width:5px; height:5px; border-radius:50%; background:#182237; transform:translateX(-50%); }
.robot-face i { position:absolute; top:7px; width:5px; height:6px; border-radius:3px; background:#182237; }
.robot-face i:first-child { left:6px; }.robot-face i:nth-child(2) { right:6px; }
.robot-face b { position:absolute; left:9px; right:9px; bottom:5px; height:2px; border-radius:2px; background:#182237; }
.robot-label { position:absolute; right:49px; display:none; width:max-content; padding:6px 9px; border:1px solid rgba(101,227,255,.3); border-radius:9px; color:#dff9ff; background:rgba(9,12,23,.9); font-size:.58rem; font-weight:900; }
.robot-launcher:hover .robot-label { display:block; }

dialog { padding:0; border:0; color:var(--ink); background:transparent; }
dialog::backdrop { background:rgba(1,2,7,.8); backdrop-filter:blur(8px); }
.story-dialog { width:min(100%,900px); height:min(94svh,1000px); max-width:none; max-height:none; border:1px solid rgba(255,255,255,.13); border-radius:27px; background:#0c0e17; box-shadow:0 30px 100px rgba(0,0,0,.6); }
.story-reader { display:grid; grid-template-rows:auto 3px 1fr auto; height:100%; }
.reader-header { display:flex; gap:17px; align-items:flex-start; padding:24px clamp(18px,4vw,38px) 20px; border-bottom:1px solid rgba(255,255,255,.07); }
.reader-close { flex:0 0 auto; width:40px; height:40px; border:1px solid var(--line); border-radius:50%; background:rgba(255,255,255,.04); font-size:1.25rem; cursor:pointer; }
.reader-header span { color:var(--gold); font-size:.58rem; font-weight:950; letter-spacing:.15em; }
.reader-header h2 { margin:7px 0 0; font-size:clamp(1.8rem,5vw,3.1rem); line-height:.95; letter-spacing:-.04em; }
.reader-header p { margin:8px 0 0; color:var(--muted); font-family:Georgia,serif; font-size:.94rem; }
.reader-progress { background:rgba(255,255,255,.05); }
.reader-progress span { display:block; width:0; height:100%; background:linear-gradient(90deg,var(--saffron),var(--gold)); }
.reader-body { padding:clamp(25px,5vw,52px); overflow-y:auto; overscroll-behavior:contain; scrollbar-color:rgba(255,187,70,.3) transparent; }
.reader-body p,.reader-body li { color:#c9c8ca; font-family:Georgia,serif; font-size:clamp(1rem,2vw,1.12rem); line-height:1.85; }
.reader-body h3 { margin:44px 0 13px; color:#fff6e3; font-size:clamp(1.35rem,3.5vw,1.9rem); line-height:1.15; }
.reader-body h3:first-child { margin-top:0; }
.reader-body ul { padding-left:1.3rem; }
.reader-body li + li { margin-top:8px; }
.reader-body .story-quote { margin:28px 0; padding:20px 23px; border-left:3px solid var(--gold); border-radius:0 13px 13px 0; color:#fae7bd; background:rgba(255,187,70,.07); font-style:italic; }
.reader-footer { display:flex; justify-content:flex-end; gap:9px; padding:13px clamp(18px,4vw,32px) calc(13px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:#0f111b; }
.reader-footer [hidden] { display:none !important; }

.character-dialog { width:min(860px,calc(100% - 24px)); height:min(92svh,980px); max-width:none; max-height:none; border:1px solid rgba(255,255,255,.14); border-radius:27px; overflow:hidden; background:#0c0e17; box-shadow:0 30px 100px rgba(0,0,0,.72); }
.character-viewer { position:relative; display:grid; grid-template-rows:minmax(0,1fr) auto; height:100%; }
.character-viewer-close { position:absolute; z-index:3; top:14px; right:14px; display:grid; place-items:center; width:43px; height:43px; border:1px solid rgba(255,255,255,.24); border-radius:50%; color:#fff; background:rgba(8,9,15,.78); backdrop-filter:blur(8px); cursor:pointer; font-size:1.35rem; }
.character-zoom-frame { display:grid; place-items:center; min-height:0; padding:16px; overflow:hidden; background:radial-gradient(circle at 50% 38%,#f9f9f7,#dbdbd7 70%,#bfc0be); }
.character-zoom-frame img { display:block; width:100%; height:100%; object-fit:contain; }
.character-dialog.is-realm-picture { width:min(1320px,calc(100% - 24px)); }
.character-dialog.is-defense-picture { width:min(1100px,calc(100% - 24px)); }
.is-defense-picture .character-zoom-frame { background:#05070b; }
.is-realm-picture .character-zoom-frame { padding:0; background:#080e11; }
.character-viewer-copy { padding:20px clamp(20px,4vw,38px) 24px; border-top:1px solid var(--line); background:linear-gradient(135deg,#151722,#0d0f18); }
.character-viewer-copy > span { color:var(--gold); font-size:.61rem; font-weight:950; letter-spacing:.17em; }
.character-viewer-copy h2 { margin:6px 0 0; font-size:clamp(1.8rem,5vw,3.2rem); line-height:1; letter-spacing:-.045em; }
.character-viewer-copy p { margin:8px 0 0; color:var(--muted); font-family:Georgia,serif; font-size:.92rem; }

.robot-dialog { width:min(430px,calc(100% - 18px)); max-width:none; margin:auto max(9px,env(safe-area-inset-right)) max(9px,env(safe-area-inset-bottom)) auto; border:1px solid rgba(101,227,255,.25); border-radius:25px; background:#0e111c; box-shadow:0 30px 90px rgba(0,0,0,.65); }
.robot-sheet { display:grid; grid-template-rows:auto auto minmax(210px,1fr) auto auto; max-height:min(720px,88svh); }
.robot-header { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px; padding:17px; border-bottom:1px solid rgba(255,255,255,.08); }
.robot-avatar { display:grid; place-items:center; width:45px; height:45px; border-radius:15px; color:#071018; background:linear-gradient(145deg,#c2f7ff,#68d8ff 58%,#8b71ff); }
.robot-header h2 { margin:0; font-size:1rem; }
.robot-header p { display:flex; align-items:center; gap:6px; margin:3px 0 0; color:var(--muted); font-size:.62rem; }
.robot-header p span { width:6px; height:6px; border-radius:50%; background:#52dfa3; box-shadow:0 0 8px #52dfa3; }
.robot-header button { width:36px; height:36px; border:0; border-radius:50%; background:rgba(255,255,255,.05); cursor:pointer; font-size:1.1rem; }
.robot-disclaimer { padding:8px 15px; color:#87bfd0; background:rgba(83,204,237,.055); font-size:.57rem; text-align:center; }
.chat-log { display:flex; flex-direction:column; gap:10px; min-height:260px; padding:16px; overflow-y:auto; overscroll-behavior:contain; }
.message { max-width:88%; padding:11px 13px; border-radius:15px; font-size:.78rem; line-height:1.52; white-space:pre-line; }
.message.bot { align-self:flex-start; border:1px solid rgba(101,227,255,.14); border-bottom-left-radius:5px; color:#dce7eb; background:#171c29; }
.message.user { align-self:flex-end; border-bottom-right-radius:5px; color:#23170a; background:linear-gradient(135deg,#ffe08a,#ffad39); }
.message-source { display:block; margin-top:7px; color:#7db7c8; font-size:.57rem; font-weight:850; letter-spacing:.04em; }
.typing { display:flex; gap:4px; width:max-content; }
.typing i { width:5px; height:5px; border-radius:50%; background:#91c8d6; animation:typing 1s infinite alternate; }
.typing i:nth-child(2) { animation-delay:.15s; }.typing i:nth-child(3) { animation-delay:.3s; }
@keyframes typing { to { opacity:.25; transform:translateY(-3px); } }
.quick-questions { display:flex; gap:7px; padding:0 14px 12px; overflow-x:auto; scrollbar-width:none; }
.quick-questions button { flex:0 0 auto; padding:7px 10px; border:1px solid rgba(101,227,255,.22); border-radius:99px; color:#bdeefa; background:rgba(101,227,255,.05); font-size:.6rem; cursor:pointer; }
.chat-form { display:grid; grid-template-columns:1fr auto; gap:8px; padding:12px; border-top:1px solid var(--line); }
.chat-form input { min-width:0; height:46px; padding:0 13px; border:1px solid var(--line); border-radius:13px; outline:0; color:var(--ink); background:#080a12; }
.chat-form input:focus { border-color:rgba(101,227,255,.55); }
.chat-form button { display:grid; place-items:center; width:46px; height:46px; border:0; border-radius:13px; color:#111826; background:linear-gradient(145deg,#c2f7ff,#65d9f8); cursor:pointer; }
.chat-form svg { width:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

.install-dialog { width:min(470px,calc(100% - 22px)); max-width:none; border:1px solid var(--line); border-radius:25px; background:#11131e; }
.install-sheet { position:relative; padding:clamp(27px,6vw,40px); text-align:center; }
.sheet-close { position:absolute; top:12px; right:12px; width:36px; height:36px; border:0; border-radius:50%; color:#fff; background:rgba(255,255,255,.06); cursor:pointer; font-size:1.1rem; }
.install-icon { display:grid; place-items:center; width:72px; height:72px; margin:0 auto 18px; border-radius:20px; color:#221509; background:linear-gradient(135deg,#ffea9a,#ff9a2d); font-family:Impact,sans-serif; font-size:1.65rem; }
.install-sheet h2 { margin:8px 0 0; font-size:1.8rem; }
#installGuide { margin:18px 0 23px; color:var(--muted); font-size:.84rem; line-height:1.65; }
#installGuide ol { padding-left:1.4rem; text-align:left; }
.toast { position:fixed; z-index:120; left:50%; bottom:calc(var(--nav-h) + var(--safe-bottom) + 12px); max-width:calc(100% - 28px); padding:11px 16px; border:1px solid rgba(255,187,70,.25); border-radius:99px; color:#f8e8c5; background:rgba(18,16,19,.94); box-shadow:0 12px 40px rgba(0,0,0,.4); font-size:.72rem; font-weight:750; opacity:0; pointer-events:none; transform:translate(-50%,12px); transition:.2s ease; }
.toast.show { opacity:1; transform:translate(-50%,0); }

@media (max-width: 1024px) {
  .character-layout { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .defense-side { grid-column:1/-1; }
  .defense-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width: 850px) {
  .premiere-hero { min-height:710px; }
  .premiere-art::after { background:linear-gradient(0deg,#080910 2%,rgba(7,8,18,.46) 55%,rgba(7,8,18,.12)),linear-gradient(90deg,rgba(7,8,18,.8),transparent 75%); }
  .premiere-art img { object-position:58% 20%; }
  .premiere-copy { justify-content:flex-end; width:100%; min-height:710px; padding:28px; }
  .eyebrow { position:absolute; top:25px; left:26px; }
  .premiere-copy h1 { font-size:clamp(5.4rem,22vw,8.5rem); }
  .premiere-orbit { width:62vw; right:1%; top:10%; }
  .story-rail { grid-auto-columns:minmax(245px,68%); }
  .story-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .feature-grid { grid-template-columns:repeat(2,1fr); }
  .creator-grid { grid-template-columns:1fr; }
  .vision-card { grid-row:auto; min-height:350px; }
  .character-grid { grid-template-columns:1fr; }
  .defense-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width: 680px) {
  .character-layout { grid-template-columns:1fr; }
  .character-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .defense-grid { grid-template-columns:minmax(0,1fr); }
  .defense-side .character-portrait { max-height:360px; }
}

@media (max-width: 560px) {
  :root { --header-h:64px; --nav-h:70px; }
  .app-header { padding-inline:13px; }
  .brand-logo { width:37px; height:37px; border-radius:9px; }
  .brand-copy small { display:none; }
  .install-button { min-height:39px; padding-inline:12px; }
  main { padding-inline:10px; }
  .premiere-hero { min-height:calc(100svh - var(--header-h) - 20px); margin-top:10px; border-radius:22px; }
  .premiere-copy { min-height:calc(100svh - var(--header-h) - 20px); padding:22px; }
  .premiere-copy h1 { font-size:clamp(4.9rem,25vw,7rem); }
  .release-chip { font-size:.55rem; }
  .hero-quote { font-size:.95rem; }
  .countdown-panel { padding:19px 13px; border-radius:21px; }
  .countdown { gap:6px; }
  .time-unit { border-radius:13px; }
  .time-unit strong { font-size:clamp(1.45rem,8vw,2.2rem); }
  .social-launches { grid-template-columns:1fr; }
  .social-launch { min-height:68px; }
  .section-heading { align-items:center; }
  .story-rail { grid-auto-columns:82%; }
  .mayavanam-preview { min-height:430px; border-radius:22px; }
  .mayavanam-shade { background:linear-gradient(0deg,rgba(5,11,14,.94),rgba(5,11,14,.12) 80%); }
  .mayavanam-copy { padding:24px; }
  .home-stats div { padding:18px 5px; }
  .home-stats strong { font-size:1.5rem; }
  .home-stats span { font-size:.55rem; }
  .page-intro { padding-top:38px; }
  .story-grid { grid-template-columns:1fr; }
  .story-grid .story-card { min-height:260px; }
  .realm-hero { min-height:72svh; border-radius:22px; }
  .realm-title { left:23px; bottom:35px; }
  .realm-title h1 { font-size:clamp(3.5rem,17vw,5rem); }
  .feature-grid { grid-template-columns:1fr; }
  .feature-grid article { min-height:190px; }
  .feature-grid h3 { margin-top:32px; }
  .creator-card { border-radius:20px; }
  .official-links { grid-template-columns:1fr; }
  .rating-row small { display:none; }
  .rating-row span { min-height:52px; }
  .nav-item span:last-child { font-size:.49rem; }
  .nav-item[data-go="characters"] span:last-child { font-size:.43rem; }
  .robot-launcher { width:54px; height:54px; }
  .character-side { padding:12px; border-radius:22px; }
  .character-card-copy { min-height:73px; padding:12px; }
  .character-dialog { width:100%; height:100svh; border:0; border-radius:0; }
  .character-zoom-frame { padding:10px; }
  .character-viewer-copy { padding-bottom:calc(22px + env(safe-area-inset-bottom)); }
  .story-dialog { width:100%; height:100svh; border:0; border-radius:0; }
  .reader-header { padding:18px 15px 15px; }
  .reader-close { width:37px; height:37px; }
  .reader-footer { justify-content:stretch; }
  .reader-footer button { flex:1; padding-inline:8px; }
  .robot-dialog { width:100%; max-height:none; margin:auto 0 0; border-radius:24px 24px 0 0; border-bottom:0; }
  .robot-sheet { max-height:87svh; padding-bottom:env(safe-area-inset-bottom); }
}

@media (max-width: 390px) {
  .character-grid { grid-template-columns:1fr; }
}

@media (hover: none) { .robot-label { display:none !important; } }
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}

.game-home-link { display:flex; align-items:center; gap:14px; width:100%; margin:16px 0 0; padding:12px 16px 12px 12px; border:1px solid rgba(255,187,70,.38); border-radius:18px; color:var(--ink); background:linear-gradient(110deg,rgba(255,122,26,.12),var(--surface)); text-align:left; cursor:pointer; }
.game-home-link img { flex:0 0 48px; width:48px; height:58px; border-radius:9px; object-fit:cover; object-position:center 18%; }
.game-home-link > span { min-width:0; flex:1; }
.game-home-link strong, .game-home-link small { display:block; }
.game-home-link strong { font-size:1rem; }
.game-home-link small { margin-top:5px; color:var(--muted); font-size:.875rem; }
.game-home-link b { color:var(--gold); font-size:.875rem; }
.game-home-link:focus-visible, .game-download-button:focus-visible, .game-cancel:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
.game-intro { padding-top:32px; }
.game-intro .game-edition { margin-top:26px; color:var(--gold); font-size:.875rem; font-weight:800; letter-spacing:.06em; }
.game-intro h1 { font-size:clamp(2.4rem,7vw,5rem); line-height:1.08; }
.game-intro .game-subtitle { color:var(--gold); font-family:Georgia,serif; font-size:1.5rem; }
.game-layout { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:20px; }
.game-panel, .game-install { min-width:0; padding:clamp(20px,3vw,32px); border:1px solid var(--line); border-radius:24px; background:var(--surface); }
.game-panel > p:first-child { margin-top:0; line-height:1.7; }
.game-facts { display:flex; flex-wrap:wrap; gap:9px; margin:22px 0; padding:0; list-style:none; }
.game-facts li { padding:7px 10px; border:1px solid var(--line); border-radius:8px; color:var(--ink); font-size:.875rem; }
.game-scope { padding:16px; border-left:3px solid var(--gold); background:rgba(255,187,70,.055); color:var(--muted); font-size:1rem; line-height:1.65; }
.game-scope strong { display:block; margin-bottom:6px; color:var(--ink); }
.game-download { margin:26px 0 20px; }
.game-download [hidden] { display:none; }
.game-download-button { width:100%; min-height:52px; padding:14px 16px; font-size:1rem; white-space:normal; }
.game-download-button:disabled { opacity:.7; cursor:wait; }
.game-cancel { margin-top:12px; min-height:44px; font-size:.875rem; }
.game-download progress { display:block; width:100%; height:10px; margin-top:18px; accent-color:var(--gold); }
.game-download-status, .game-note { color:var(--muted); font-size:.875rem; line-height:1.65; overflow-wrap:anywhere; }
.game-download-status.error { color:#ffb5b0; }
.game-install h2 { margin:0 0 24px; font-size:1.45rem; }
.game-install ol { padding-left:22px; margin:0; }
.game-install li { padding-left:6px; margin-bottom:22px; line-height:1.6; }
.game-install li::marker { color:var(--gold); font-weight:800; }
.game-install li strong, .game-install li span { display:block; overflow-wrap:anywhere; }
.game-install li span { color:var(--muted); margin-top:5px; }
.game-controls { margin-top:28px; padding-top:22px; border-top:1px solid var(--line); line-height:1.8; }
@media (max-width:760px) { .game-layout { grid-template-columns:minmax(0,1fr); } }
@media (max-width:420px) { .game-home-link { flex-wrap:wrap; } .game-home-link b { margin-left:62px; } }

.trial-play-button { display:inline-flex; text-decoration:none; margin:15px 0; align-items:center; justify-content:center; min-height:50px; padding:14px 24px; }
.legacy-build { margin-top:28px; }

/* Roommates: a type-led film feature with distinct cast colors. */
.film-spotlight { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:32px; align-items:center; margin:32px 0 0; padding:clamp(24px,4vw,48px); border:1px solid #5b4934; border-radius:26px; background:linear-gradient(115deg,#24191a,#17131d 72%); }
.film-eyebrow { margin:0; color:#ffd16b; font-size:.875rem; font-weight:800; letter-spacing:.09em; line-height:1.6; }
.film-spotlight h2 { margin:16px 0 0; color:#fff4d3; font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif; font-size:clamp(2rem,5.6vw,4.5rem); font-weight:900; letter-spacing:-.015em; line-height:1.06; }
.film-spotlight h2 span { display:block; margin-top:9px; color:#ffca61; font-family:inherit; font-size:.48em; letter-spacing:.065em; line-height:1.3; }
.film-spotlight-description { margin:17px 0 22px; color:#d0c8c9; font-size:1rem; line-height:1.5; }
.film-button { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:48px; padding:12px 18px; border:1px solid #ffd16b; border-radius:10px; color:#25170b; background:#ffd16b; font-size:.95rem; font-weight:800; cursor:pointer; }
.film-button:hover { background:#ffe4a3; }
.film-button:focus-visible,.film-archive-link:focus-visible { outline:3px solid #fff4d3; outline-offset:4px; }
.film-debut-mark { display:grid; justify-items:center; padding:18px 24px; border-left:1px solid #71513f; color:#ffbd68; }
.film-debut-mark > span { font-size:.875rem; font-weight:800; letter-spacing:.2em; }
.film-debut-mark strong { font-family:Georgia,serif; font-size:6rem; font-weight:500; line-height:1.05; }
.film-debut-mark small { margin-top:12px; font-size:.875rem; }
.film-back { padding:25px 0 16px; }
.film-title-panel { padding:clamp(24px,5vw,64px); border:1px solid #695035; border-radius:26px; background:radial-gradient(ellipse at 92% 4%,#623529 0%,transparent 58%),linear-gradient(135deg,#271b20,#10111c); }
.film-title-top { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:15px; }
.film-language { padding:7px 13px; border:1px solid #a77b4d; border-radius:8px; color:#ffe3ad; font-size:1rem; }
.film-title-panel h1 { margin:45px 0 0; color:#fff1cf; font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif; font-size:clamp(2.25rem,7.5vw,6.6rem); font-weight:900; letter-spacing:-.025em; line-height:1.05; }
.film-title-panel h1 > span { display:block; margin-top:14px; font-family:inherit; font-size:.5em; letter-spacing:.04em; line-height:1.25; }
.film-title-panel h1 em { color:#ffb564; font-style:normal; }
.film-format { margin:24px 0 0; color:#ffe3ad; font-family:Georgia,serif; font-size:clamp(1.3rem,3vw,1.85rem); font-style:italic; line-height:1.4; }
.film-introduction { max-width:640px; margin:16px 0 0; color:#ded4d1; font-size:1.0625rem; line-height:1.75; }
.film-tags { display:flex; flex-wrap:wrap; gap:8px; margin:24px 0 0; padding:0; list-style:none; }
.film-tags li { padding:7px 12px; border:1px solid rgba(255,225,178,.22); border-radius:99px; color:#f3d9b7; font-size:.875rem; line-height:1.4; }
.film-title-credit { display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 25px; margin-top:36px; padding-top:23px; border-top:1px solid #67503e; }
.film-title-credit span { color:#dbb98b; font-size:.875rem; letter-spacing:.07em; }
.film-title-credit strong { color:#fff1dc; font-size:1.2rem; }
.film-cast-section,.film-credits-section { margin-top:42px; }
.film-section-heading { margin-bottom:21px; }
.film-section-heading h2 { margin:6px 0 0; font-size:clamp(1.6rem,4vw,2.5rem); letter-spacing:-.025em; }
.film-cast-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.film-cast-card { min-width:0; padding:25px; border:1px solid var(--cast-edge); border-top:5px solid var(--cast-color); border-radius:17px; background:var(--cast-bg); }
.film-cast-abi { --cast-color:#ffab91; --cast-edge:#653c3d; --cast-bg:#25191f; }
.film-cast-giri { --cast-color:#ffe083; --cast-edge:#625332; --cast-bg:#252019; }
.film-cast-nishant { --cast-color:#8de5d5; --cast-edge:#355a58; --cast-bg:#142324; }
.film-cast-alias { margin:0 0 30px; color:var(--cast-color); font-family:Georgia,serif; font-size:clamp(2.1rem,4vw,3.8rem); font-weight:800; line-height:1.15; }
.film-cast-card h3 { margin:0; color:#fff4e8; font-size:clamp(1.3rem,2.3vw,1.75rem); overflow-wrap:anywhere; }
.film-cast-role { margin:8px 0 0; color:var(--cast-color); font-size:1rem; line-height:1.5; }
.film-credits { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; margin:0; border:1px solid #453b33; border-radius:18px; overflow:hidden; background:#453b33; }
.film-credits > div { min-width:0; padding:26px; background:#15151e; }
.film-credits dt { color:#d4b58d; font-size:.9375rem; }
.film-credits dd { margin:10px 0 0; color:#fff4e8; font-size:1.25rem; font-weight:700; overflow-wrap:anywhere; }
.film-creator-link { margin-top:16px; font-size:1rem; }
.film-archive-link { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; width:100%; margin:0 0 26px; padding:20px 24px; border:1px solid #604832; border-radius:16px; background:linear-gradient(110deg,#291c1c,#17151f); color:#ffcd83; text-align:left; cursor:pointer; }
.film-archive-link span { min-width:0; }
.film-archive-link small,.film-archive-link strong { display:block; }
.film-archive-link small { font-size:.875rem; line-height:1.5; }
.film-archive-link strong { margin-top:6px; color:#fff0d9; font-size:1.15rem; line-height:1.4; }
.film-archive-link b { font-size:.9375rem; }
.creator-filmography { margin-top:38px; }
.film-archive-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:26px; }
.film-archive-pair .film-archive-link { align-content:space-between; margin-bottom:0; }
.film-next-link { margin-top:38px; }
.untold-spotlight { border-color:#394d64; background:radial-gradient(ellipse at 92% 5%,#243d51,transparent 60%),linear-gradient(115deg,#111a25,#11121c); }
.untold-spotlight .film-eyebrow,.untold-page .film-eyebrow { color:#a6d4ea; }
.untold-spotlight h2 { color:#eaf4fa; font-family:Georgia,'Times New Roman',serif; font-weight:400; letter-spacing:.08em; }
.untold-studio { margin:18px 0 0; color:#a2b9ca; font-size:.875rem; font-weight:700; letter-spacing:.19em; line-height:1.8; }
.film-spotlight-description .untold-studio { display:inline-block; margin-top:12px; }
.untold-spotlight .film-button { border-color:#b8dded; color:#142430; background:#b8dded; }
.untold-spotlight .film-button:hover { background:#ddf2fc; }
.untold-spotlight .film-debut-mark { border-color:#426175; color:#b8dded; }
.untold-title-panel { overflow:hidden; border-color:#40566d; background:radial-gradient(ellipse at 80% 0%,#284252,transparent 64%),linear-gradient(125deg,#111c28,#11121b); }
.untold-title-panel > .untold-studio { margin-top:52px; }
.untold-title-panel h1 { margin-top:16px; color:#f0f7fc; font-family:Georgia,'Times New Roman',serif; font-size:clamp(2.3rem,9vw,8rem); font-weight:400; letter-spacing:.075em; line-height:1.2; }
.untold-page .film-format { color:#c7e4f4; }
.untold-page .film-introduction { color:#c5d2de; }
.untold-page .film-language { border-color:#59788e; color:#d5e9f5; }
.untold-page .film-tags li { border-color:#476171; color:#c7ddea; }
.untold-page .film-title-credit { border-color:#3c566a; }
.untold-page .film-title-credit span,.untold-page .film-credits dt { color:#a6c9dd; }
.untold-page .film-title-credit strong,.untold-page .film-credits dd { color:#edf6fc; }
.untold-page .film-credits { border-color:#3c4e61; background:#3c4e61; }
.untold-page .film-credits > div { background:#131c27; }
.untold-archive-link { border-color:#3b5268; background:linear-gradient(110deg,#172837,#141924); color:#b5d9ed; }
.untold-archive-link strong { color:#e4f2fb; font-family:Georgia,serif; letter-spacing:.09em; }
@media (max-width:700px) {
  .film-spotlight { grid-template-columns:minmax(0,1fr); gap:20px; }
  .film-debut-mark { display:none; }
  .film-cast-grid,.film-credits,.film-archive-pair { grid-template-columns:minmax(0,1fr); }
  .film-cast-card { display:grid; grid-template-columns:minmax(80px,.55fr) minmax(0,1fr); gap:5px 18px; align-items:center; padding:22px; }
  .film-cast-alias { grid-row:span 2; margin:0; font-size:2.1rem; }
  .film-cast-role { margin:0; }
  .film-title-panel h1 { margin-top:28px; }
}
@media (prefers-reduced-motion:reduce) { .roommates-page,.untold-page { animation:none; } }