@font-face{font-family:Nastaliq;src:url('assets/fonts/NotoNastaliqUrdu.ttf') format('truetype');font-weight:400 700;font-display:swap}
@font-face{font-family:Naskh;src:url('assets/fonts/NotoNaskhArabic.ttf') format('truetype');font-weight:400 700;font-display:swap}
@font-face{font-family:Museum;src:url('assets/fonts/Inter.ttf') format('truetype');font-weight:100 900;font-display:swap}
:root{font-family:Museum,Arial,sans-serif;color:#f4f6ff;background:#080f22;font-synthesis:none;--muted:#becbe3;--line:#405474;--accent:#ffb15b;--panel:#111e36;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0}button,select,input{font:inherit}button,a,select,input{touch-action:manipulation}button,select{cursor:pointer}a{color:inherit;text-underline-offset:5px}button{color:inherit}button:disabled{opacity:.45;cursor:default}button,select{min-height:46px}p{line-height:1.8}h1,h2,h3,p{margin-block-start:0}h1,h2,h3{font-weight:500}h2{font-size:clamp(1.8rem,3.4vw,3rem);line-height:1.2;letter-spacing:-.04em}h3{font-size:1.3rem;line-height:1.4}.wrap{width:min(1320px,calc(100% - 96px));margin-inline:auto}.masthead{display:flex;align-items:center;justify-content:space-between;gap:30px;padding-block:25px;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;font-size:12px;letter-spacing:1.6px;font-weight:700;line-height:1.3;direction:ltr}.brand-mark{color:var(--accent);font-size:43px;font-weight:400}.brand sup{color:var(--accent);font-size:9px}.masthead nav{display:flex;gap:32px;font-size:13px}.masthead nav a{text-decoration:none}.language{display:flex;align-items:center;gap:12px;font-size:12px}.language select,select{background:transparent;border:1px solid #45597e;padding:8px 12px;border-radius:5px;max-width:100%}.hero{position:relative;margin-block:26px 0;min-height:670px;display:flex;align-items:center;border:1px solid var(--line);isolation:isolate;overflow:hidden;background:#0b172d}.hero-photo{position:absolute;inset:0;z-index:-2}.hero-photo img{height:100%;width:100%;object-fit:cover;object-position:72% 50%;filter:brightness(.85)}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,12,28,.96) 0%,rgba(5,12,28,.86) 32%,rgba(5,12,28,.15) 75%),linear-gradient(0deg,rgba(8,15,34,.75),transparent 30%);z-index:-1}.hero-copy{padding:68px 52px 100px;max-width:700px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2px;color:var(--accent);line-height:1.8;margin-bottom:24px}h1{font-size:clamp(3.2rem,6.2vw,6rem);letter-spacing:-.065em;line-height:1.03;margin-bottom:27px;max-width:650px}.hero-intro{font-size:15px;color:#d3dff2;max-width:385px;margin-bottom:30px}.primary{display:inline-flex;align-items:center;justify-content:center;gap:28px;background:var(--accent);border:1px solid var(--accent);border-radius:4px;color:#11192a;font-weight:600;font-size:13px;padding:14px 23px}.primary:hover{background:#ffc780}.hero-foot{font-size:10px;color:var(--muted);margin:20px 0 0}.photo-coordinate{position:absolute;inset-inline-end:28px;top:30px;font-size:9px;letter-spacing:1.5px;line-height:1.8;text-align:end;color:white;text-shadow:0 1px 5px black}.hero-bottom{position:absolute;bottom:0;inset-inline:30px;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #b5cbea55;padding-block:20px;font-size:9px;letter-spacing:1.2px;color:#d0dff3}.mission-strip{display:flex;gap:40px;align-items:center;padding-block:26px;border-bottom:1px solid var(--line);font-size:11px;color:var(--muted)}.mission-strip b{font-size:22px;font-weight:400;color:#f4f6ff;margin-inline-end:8px}.collection{padding-block:76px 64px}.section-top{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:30px}.section-top .eyebrow{margin-bottom:16px}.section-top h2{margin:0}.worlds{display:flex;gap:5px;padding:5px;background:#13213b;border:1px solid var(--line);border-radius:5px}.worlds button{background:transparent;border:0;padding:8px 17px;font-size:12px;border-radius:3px}.worlds [aria-pressed=true]{background:var(--accent);color:#11192a}.review-note{color:#ffcf8e;font-size:12px;line-height:1.8}.review-note:empty{display:none}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}.card{border:1px solid var(--line);background:#111d34;display:flex;flex-direction:column;min-width:0;transition:transform .2s,border-color .2s}.card:hover{transform:translateY(-4px);border-color:#ffb15b}.card-photo{height:230px;width:100%;object-fit:cover;background:#233d62}.card-body{padding:24px;display:flex;flex:1;flex-direction:column}.card-meta{display:flex;justify-content:space-between;color:var(--accent);font-size:9px;letter-spacing:1.5px;margin-bottom:18px}.card h3{font-size:21px;letter-spacing:-.025em;margin-bottom:12px}.card p{color:var(--muted);font-size:12px;margin-bottom:22px}.card button{background:none;border:0;border-top:1px solid var(--line);text-align:start;padding:18px 0 0;margin-top:auto;font-size:12px;display:flex;justify-content:space-between;gap:10px}.exhibit{border-top:1px solid var(--line);padding-block:54px;scroll-margin-top:20px}.outline{background:#182643;border:1px solid #45597e;border-radius:4px;padding:10px 17px;font-size:12px}.cinema{position:relative;background:#080f22;min-height:490px;isolation:isolate;overflow:hidden}.cinema figure{margin:0}.cinema figure img{width:100%;height:570px;object-fit:contain;display:block;background:#080f22;animation:arrive .6s ease}.cinema figure figcaption{padding:9px 16px;background:#111e36;font-size:10px;color:var(--muted);line-height:1.6}.cinema-overlay{background:linear-gradient(0deg,#080f22f5,#080f22bb);position:absolute;bottom:35px;inset-inline:0;padding:30px 36px 22px;pointer-events:none}.cinema-overlay .eyebrow{margin-bottom:10px}.cinema-overlay h3{font-size:27px;margin-bottom:10px}.cinema-overlay p:last-child{font-size:17px;max-width:870px;margin:0;line-height:1.8}.scene-nav{display:flex;gap:10px;margin-block:14px}.scene-nav button{flex:1;min-width:0;border:1px solid #425777;background:#13213b;font-size:11px;padding:10px}.scene-nav [aria-pressed=true]{background:var(--accent);color:#10192a}.playback{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.playback label{font-size:12px}.playback input{flex:1;min-width:100px;accent-color:var(--accent);direction:ltr}.playback output{font-size:11px}.seek-label{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.status{font-size:12px;color:var(--accent);min-height:24px;margin-block:14px 30px}.story-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:64px}.story-grid p{font-size:14px;color:#e0e9fa}.story-grid .tag{font-size:9px;letter-spacing:1.7px;color:var(--accent);margin-top:30px}.sources{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--accent)}.narration{border:1px solid var(--line);padding:28px;background:#172b48;align-self:start}.narration select{width:100%;margin-block:10px}.narration label{font-size:12px}.narration .eyebrow{font-size:9px}.narration .path{font-size:12px;overflow-wrap:anywhere;background:#0e1b34;padding:10px;color:var(--accent)}.narration details{margin-block:22px;line-height:1.8}.narration summary{cursor:pointer;font-size:13px}.narration>a{font-size:12px}.small,.story-grid .small{font-size:12px;color:var(--muted);line-height:1.8}.gallery{margin-top:45px}.gallery #galleryItems{display:flex;flex-wrap:wrap;gap:15px}.gallery button{width:180px;border:1px solid var(--line);background:#172b48;padding:0;text-align:start}.gallery img{width:100%;height:115px;object-fit:cover;display:block}.gallery button span{padding:10px;display:block;font-size:10px;line-height:1.6}.quiz{margin-top:40px;padding:32px;background:#1a2b48;border:1px solid #405474}.quiz .eyebrow{margin-bottom:12px}.quiz h3{margin-bottom:20px}.quiz #answers{display:flex;gap:12px;flex-wrap:wrap}.quiz #feedback{margin:20px 0 0;color:var(--accent)}.voices{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:100px;padding-block:70px}.voices>div>p{font-size:14px;color:var(--muted)}.voices .eyebrow{color:var(--accent);font-size:10px}.voice-card{border:1px solid var(--line);padding:32px;background:#0e1b34}.voice-symbol{color:var(--accent);font-size:35px;display:block;margin-bottom:20px}.voice-card h3{font-size:24px}footer{border-top:1px solid var(--line);padding-block:35px 50px;color:var(--muted);font-size:11px}footer p{max-width:670px}footer a{margin-inline-end:25px}.footer-brand{color:var(--accent);letter-spacing:2px;font-size:11px;margin-bottom:20px}.skip{position:fixed;top:-120px;inset-inline-start:20px;z-index:20;background:var(--accent);padding:15px;color:#080f22}.skip:focus{top:10px}:focus-visible{outline:3px solid #ffb15b;outline-offset:5px}dialog{background:#111e36;color:#f4f6ff;border:1px solid #405474;max-width:min(1100px,92vw);max-height:92vh;padding:20px}dialog::backdrop{background:#000c}dialog img{display:block;width:100%;max-height:65vh;object-fit:contain;margin-top:18px}dialog p{font-size:14px}dialog a{font-size:12px}#exhibit:fullscreen{width:100%;overflow-y:auto;padding:35px;background:#080f22}#exhibit:fullscreen .cinema figure img{height:60vh}#exhibit:fullscreen .story-grid,#exhibit:fullscreen .gallery,#exhibit:fullscreen .quiz{display:none}[hidden]{display:none!important}@keyframes arrive{from{opacity:.4}to{opacity:1}}
html[dir=rtl] .hero:after{background:linear-gradient(270deg,#050c1cfa 0%,#050c1cd9 35%,#050c1c26 85%),linear-gradient(0deg,#080f22bf,transparent 30%)}html[dir=rtl] .hero-photo img{object-position:30% center}html[dir=rtl] .hero-copy{margin-inline-end:0}html[dir=rtl] .eyebrow,html[dir=rtl] h1,html[dir=rtl] h2,html[dir=rtl] h3,html[dir=rtl] .tag{letter-spacing:0}html[lang=ur]{font-family:Nastaliq,Naskh,serif}html[lang=ur] h1{font-size:clamp(2.4rem,4.5vw,4.1rem);line-height:2.1;margin-bottom:26px;padding-block:12px;max-width:700px}html[lang=ur] .hero-copy{max-width:770px;padding-block:40px 100px}html[lang=ur] p{line-height:3;font-size:15px}html[lang=ur] h2{line-height:2.25;font-size:clamp(1.7rem,3vw,2.4rem)}html[lang=ur] h3{line-height:2.3}html[lang=ur] button,html[lang=ur] select,html[lang=ur] label,html[lang=ur] nav a,html[lang=ur] summary{line-height:2.6}html[lang=ur] .eyebrow,html[lang=ur] .hero-foot,html[lang=ur] .card-meta{font-family:Naskh,serif;line-height:2.2}html[lang=ur] .cinema-overlay p:last-child{font-size:18px;line-height:2.9}html[lang=ur] .cinema-overlay h3{font-size:24px}html[lang=ur] .cinema-overlay{padding-block:12px}html[lang=ur] .review-note,html[lang=ur] .small{font-family:Naskh,serif;line-height:2.1}html[lang=ar],html[lang=ps]{font-family:Naskh,serif}html[lang=ar] h1,html[lang=ps] h1{font-size:clamp(2.7rem,5.4vw,4.7rem);line-height:1.6}html[lang=ar] h2,html[lang=ps] h2{line-height:1.8}html[lang=ar] p,html[lang=ps] p{line-height:2;font-size:17px}html[lang=ar] button,html[lang=ps] button,html[lang=ar] select,html[lang=ps] select{line-height:1.8}.brand,.footer-brand,.photo-coordinate,.hero-bottom,.card-meta,.path{font-family:Museum,Arial,sans-serif}
@media(min-width:1600px){.hero{min-height:740px}}
@media(max-width:1050px){.wrap{width:calc(100% - 48px)}.hero-copy{padding-inline:35px}.hero{min-height:610px}.cards{gap:16px}.card-photo{height:190px}.card-body{padding:18px}.section-top{align-items:start;flex-direction:column}.story-grid{gap:28px}.voices{gap:40px}.masthead nav{gap:18px}.cinema-overlay p:last-child{font-size:15px}}
@media(max-width:700px){.wrap{width:calc(100% - 32px)}.masthead{gap:18px;flex-wrap:wrap;padding-block:16px}.brand{font-size:10px}.brand-mark{font-size:34px}.masthead nav{order:3;width:100%;font-size:12px}.language{margin-inline-start:auto;gap:6px}.language label{display:none}.hero{min-height:660px;margin-top:16px;align-items:flex-end}.hero-copy{padding:210px 25px 100px;max-width:100%}.hero-photo img{object-position:64% 20%;height:64%}.hero:after,html[dir=rtl] .hero:after{background:linear-gradient(0deg,#080f22 0%,#080f22fa 42%,#080f2218 83%)}h1{font-size:3.2rem;max-width:360px}.hero-intro{font-size:13px;max-width:330px}.hero-bottom{inset-inline:20px;font-size:8px}.hero-bottom span:last-child{display:none}.photo-coordinate{font-size:8px;top:16px;inset-inline-end:15px}.mission-strip{gap:20px;flex-wrap:wrap;padding-block:20px}.mission-strip b{font-size:18px}.collection{padding-block:45px}.cards{grid-template-columns:1fr}.card-photo{height:240px}.card-body{padding:24px}.section-top{gap:20px}.worlds{width:100%;justify-content:space-between}.worlds button{flex:1}.story-grid,.voices{grid-template-columns:1fr;gap:25px}.cinema figure img{height:310px}.cinema{min-height:0;overflow:visible}.cinema-overlay{position:relative;bottom:auto;padding:24px;background:#122744;min-height:200px}.cinema-overlay h3{font-size:23px}.cinema-overlay p:last-child{font-size:16px}.scene-nav{gap:5px}.scene-nav button{font-size:10px;padding:8px 3px}.playback{gap:8px}.playback input{flex-basis:70%}.playback output{margin-inline-start:auto}.gallery button{width:calc(50% - 8px)}.quiz{padding:23px}.voices{padding-block:45px}.voice-card{padding:25px}.exhibit{padding-block:35px}.narration{padding:23px}html[lang=ur] .hero-copy{padding:190px 25px 100px}html[lang=ur] h1{font-size:2.25rem;line-height:2.15;padding-block:10px;margin-bottom:20px}html[lang=ur] .hero-intro{font-size:14px}html[lang=ur] h2{font-size:1.8rem}html[lang=ur] .cinema-overlay{padding:24px}html[lang=ar] h1,html[lang=ps] h1{font-size:2.6rem}html[lang=ar] .hero-copy,html[lang=ps] .hero-copy{padding-top:210px}html[lang=ur] .language select{font-family:Naskh;line-height:1.8}#exhibit:fullscreen{padding:16px}#exhibit:fullscreen .cinema figure img{height:35vh}}
.en-marker{font:8px Museum,Arial,sans-serif;color:#ffcf8e;border:1px solid #63799d;padding:2px 3px;margin-inline-start:5px;vertical-align:middle;white-space:nowrap}html[lang=ur] [lang=en],html[lang=ps] [lang=en],html[lang=ar] [lang=en]{font-family:Museum,Arial,sans-serif;line-height:1.8}.image-error{border:2px dashed #ffcf8e}.skip{top:0;clip-path:inset(50%);width:1px;height:1px;padding:0;overflow:hidden}.skip:focus{top:10px;clip-path:none;width:auto;height:auto;padding:15px;overflow:visible}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* V4 visual identity: blue space backgrounds, warm orange accents and
   friendly rounded panels. V5 layout, local fonts and RTL spacing stay intact. */
body{min-height:100vh;background:radial-gradient(ellipse at 75% 4%,#263d67 0%,#080f22 50%),#080f22}
.hero{border-radius:24px;border-color:#3b4c68;box-shadow:0 18px 60px #050c1c35}
h1{font-size:clamp(2.5rem,5.2vw,4.8rem);font-weight:750;letter-spacing:-.035em}
h2,h3{font-weight:700}
.primary,.outline,.language select,select{border-radius:12px;font-size:14px}
.primary{font-weight:750}
.masthead nav{font-size:14px}
.eyebrow{font-weight:700}
.worlds{border-radius:30px;background:#13213b}
.worlds button{border-radius:24px;font-size:14px}
.card{border-radius:18px;overflow:hidden;box-shadow:0 8px 24px #050c1c22}
.card p{font-size:14px}
.card button{font-size:14px;font-weight:650;color:var(--accent)}
.cinema{border-radius:18px;border:1px solid var(--line)}
.scene-nav button{border-radius:10px}
.narration,.voice-card{border-radius:18px;background:linear-gradient(135deg,#172b48,#101b32)}
.quiz{border-radius:14px}
.gallery button{border-radius:12px;overflow:hidden}
dialog{border-radius:18px}
.sources a,footer a,.narration>a{color:#ffcf8e}
#exhibit:fullscreen{background:#080f22}

/* Match the supplied V4 landing scene, including its warm illustrated Mars.
   Authentic photographs remain in the collection and cinematic stories. */
.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(180px,.75fr);min-height:430px;gap:34px;background:linear-gradient(90deg,#050c1cf5,#050c1cbf 60%,#050c1c33),radial-gradient(circle at 85% 45%,#bc6c45 0%,#683c3b 17%,transparent 30%),#0b172d}
.hero:after,html[dir=rtl] .hero:after{inset:0;background:none;content:'✦     ·      ✧      ·      ✦';color:#d7e6ff70;letter-spacing:24px;text-align:end;padding:30px;pointer-events:none;z-index:-1}
html .hero .hero-copy{grid-column:1;grid-row:1;min-width:0;max-width:none;padding:56px 38px 88px}
.hero-planet{grid-column:2;grid-row:1;display:flex;flex-direction:column;align-items:center;gap:22px;padding:30px 30px 60px;min-width:0}
.planet-disc{display:block;width:min(260px,100%);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 32% 25%,#f7ba85,#c96b40 36%,#823b36 62%,#201b31 84%);box-shadow:0 0 90px #f1835466,inset -25px -24px 42px #071024}
.planet-caption{font:11px Museum,Arial,sans-serif;color:#d0dff3;line-height:1.8}
.hero-intro{max-width:650px;font-size:17px;color:#becbe3}
.hero-foot{font-size:12px}
.card{border-color:#314565}.card p{color:#b7c5df}
/* Native dropdown menus need explicit foreground/background colours; a
   transparent select can otherwise produce unreadable OS-painted options. */
select{color:#f4f6ff;background-color:#182643;color-scheme:dark}
select option,select optgroup{color:#f4f6ff;background-color:#182643}
select option:checked{color:#11192a;background-color:#ffb15b}
html #language,html #language option{font-family:Museum,Naskh,"Segoe UI",sans-serif;font-size:16px;line-height:1.8;letter-spacing:0}
html #language option[value="ur"],html #language option[value="ps"],html #language option[value="ar"]{font-family:Naskh,Museum,sans-serif;direction:rtl}
.flight-lab{margin-block:28px 40px;padding:30px;border:1px solid #405474;border-radius:18px;background:linear-gradient(135deg,#122744,#101b32)}
.story-grid>div>.tag:first-child{margin-top:0}
/* Keep one accessible language selector: in the header initially, then a
   compact floating card once its reserved header slot scrolls out of view. */
.language-slot{width:230px;height:66px;flex:none;margin-inline-start:auto}
html{scroll-padding-top:100px}
.language-slot .language,.language.is-floating{display:flex;align-items:center;gap:8px;width:230px;min-height:66px;padding:8px 10px;background:#182643;border:2px solid #ffb15b;border-radius:16px;box-shadow:0 8px 24px #050c1c55,0 0 0 4px #ffb15b18}
.language-slot .language label,.language.is-floating label{display:block;font-family:Museum,Naskh,sans-serif;font-size:14px;font-weight:700;line-height:1.8;color:#ffcf8e}
.language-slot #language,.language.is-floating #language{flex:1;min-width:0;width:0;padding-inline:8px;border-color:#63799d}
.language.is-floating{position:fixed;top:max(12px,env(safe-area-inset-top));inset-inline-end:max(16px,env(safe-area-inset-right));z-index:15}
html[dir=rtl] .language.is-floating{inset-inline-end:max(16px,env(safe-area-inset-left))}
.language:focus-within{box-shadow:0 8px 24px #050c1c55,0 0 0 4px #ffb15b44}
#exhibit:fullscreen{padding-block-start:100px}
@media(max-width:700px){.language-slot,.language-slot .language,.language.is-floating{width:210px}.language-slot .language,.language.is-floating{padding-inline:8px}}

/* Match V4's story typography: system UI for Latin text, Nastaliq for Urdu
   paragraphs, and Naskh for Arabic/Pashto and Urdu story headings. */
#transcript p,#facts,#subtitle{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;font-size:1.12rem;font-weight:400;line-height:1.9;letter-spacing:normal}
#transcript p[lang=ur],#facts[lang=ur],#subtitle[lang=ur]{font-family:Nastaliq,Naskh,serif;line-height:3.1}
#transcript p[lang=ps],#facts[lang=ps],#subtitle[lang=ps]{font-family:Naskh,Tahoma,sans-serif;line-height:2.4}
#transcript p[lang=ar],#facts[lang=ar],#subtitle[lang=ar]{font-family:Naskh,Tahoma,sans-serif;line-height:2.1}
#storyTitle[lang=ur],#sceneTitle[lang=ur]{font-family:Naskh,Nastaliq,serif;line-height:2;font-weight:700}
.flight-lab>h3{font-size:clamp(1.4rem,2.8vw,2rem);margin-bottom:14px}.flight-lab p{color:#d0dff3}
.flight-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-block:24px}
.flight-facts article{background:#172b48;border:1px solid #405575;border-radius:14px;padding:22px;min-width:0}
.flight-number{display:block;font:700 clamp(1.4rem,2.5vw,2.3rem) Museum,Arial,sans-serif;color:#ffb15b;overflow-wrap:anywhere;margin-bottom:16px}
.flight-facts h4{font-size:15px;margin:0 0 10px}.flight-facts p{font-size:14px;margin:0}
.flight-facts h4{line-height:1.8}html[lang=ur] .flight-facts h4{line-height:2.5;margin-bottom:14px}
.video-reference{border-top:1px solid #405474;padding-top:28px;margin-top:28px}.video-reference>a{display:inline-block;margin-inline-start:12px;text-decoration:none}.video-reference iframe{display:block;width:100%;aspect-ratio:16/9;border:1px solid #405474;border-radius:14px;margin-top:22px;background:#080f22}
.video-reference iframe{min-height:200px}.video-clips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-block:22px}.video-clips article{min-width:0}
.clip-button{display:flex;flex-direction:column;align-items:flex-start;gap:14px;width:100%;height:100%;padding:20px;text-align:start;background:#172b48;border:1px solid #45597e;border-radius:14px;line-height:1.8;color:#f4f6ff}
.clip-button strong{font-size:17px;line-height:1.8}.clip-button bdi{color:#ffcf8e;font:600 14px Museum,Arial,sans-serif}.clip-button:hover,.clip-button[aria-pressed=true]{border-color:#ffb15b;background:#223956}
.clip-button[aria-pressed=true]{box-shadow:inset 0 0 0 1px #ffb15b}.video-reference>button{margin-inline-end:10px;margin-block-end:12px}
.clip-learning{border:1px solid #405474;border-radius:14px;padding:22px;background:#1a2b48;margin-block:22px}.clip-learning h4{font-size:17px;line-height:1.8;margin-block:0 18px}.clip-learning p{margin-top:18px;margin-bottom:0}
html[lang=ur] .clip-button strong,html[lang=ur] .clip-learning h4{line-height:2.7}
@media(max-width:700px){.video-clips{grid-template-columns:1fr}.clip-button{gap:10px;padding:18px}.clip-learning{padding:18px}}
@media(max-width:700px){.flight-lab{padding:22px}.flight-facts{grid-template-columns:1fr}.flight-facts article{padding:20px}.video-reference>a{margin:12px 0 0;display:block;text-align:center}}
@media(min-width:1600px){.hero{min-height:460px}}
@media(max-width:900px){.hero{gap:16px;grid-template-columns:minmax(0,1fr) minmax(140px,.55fr)}.hero-planet{padding-inline:15px}}
@media(max-width:700px){.hero{grid-template-columns:minmax(0,1fr);gap:0;min-height:0;align-items:center}.hero-planet{grid-column:1;grid-row:1;padding:35px 20px 0;gap:10px}.planet-disc{width:140px}.planet-caption{font-size:10px}html .hero .hero-copy{grid-column:1;grid-row:2;padding:26px 22px 90px}.hero-intro{font-size:16px}.hero:after,html[dir=rtl] .hero:after{padding:18px;letter-spacing:14px}.hero-bottom{padding-block:16px}}

/* Science panel and Laser the Moon. Reuses the flight-lab panel and only
   existing theme colours; fonts are inherited from the language rules above. */
.science-lab .eyebrow{margin-bottom:12px}.science-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-block:24px}
.science-facts article{background:#172b48;border:1px solid #405575;border-radius:14px;padding:22px;min-width:0}.science-facts p{font-size:14px;margin:0}
.laser-game{border-top:1px solid var(--line);padding-top:28px;margin-top:28px}
.laser-stage{position:relative;display:flex;align-items:center;gap:0;margin-block:22px;padding:22px;background:#0e1b34;border-radius:14px;overflow:hidden}
.laser-body{flex:none;display:flex;align-items:center;justify-content:center;border-radius:50%;text-align:center;font-size:12px;font-weight:700;line-height:1.3;overflow:hidden;overflow-wrap:anywhere}
.laser-earth{width:92px;height:92px;background:#263d67;border:2px solid var(--muted);color:#f4f6ff}
.laser-moon{width:64px;height:64px;background:var(--muted);color:#11192a}
.laser-track{position:relative;flex:1;min-width:40px;height:0;border-top:2px dashed var(--line)}
.laser-pulse{position:absolute;top:-8px;left:0;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--accent)}
.laser-readings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:18px}
.laser-readings p{margin:0;padding:14px 18px;background:#172b48;border:1px solid #405575;border-radius:14px}
.laser-readings bdi{font:700 clamp(1.2rem,2.2vw,1.8rem) Museum,Arial,sans-serif;color:var(--accent)}
.laser-math{margin-top:22px;padding-top:22px;border-top:1px solid var(--line)}
.laser-formula{font-size:1.1rem;font-weight:700;color:var(--accent)}.flight-lab p.laser-formula{color:var(--accent)}
.laser-math label{display:block;font-size:14px;margin-bottom:8px}
.laser-answer{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.laser-answer input{flex:1 1 180px;min-width:0;min-height:46px;padding:8px 12px;color:inherit;background:#0e1b34;border:1px solid #45597e;border-radius:12px;text-align:left}
.flight-lab p.laser-feedback{margin:16px 0 0;color:var(--accent)}.laser-feedback:empty{display:none}
#laserStatus{min-height:24px;margin-block:10px 0}
@media(max-width:700px){.science-facts,.laser-readings{grid-template-columns:1fr}.science-facts article{padding:20px}.laser-stage{padding:14px}.laser-earth{width:70px;height:70px}.laser-moon{width:52px;height:52px}.laser-body{font-size:10px}.laser-answer button{flex:1 1 100%}}

/* The story caption sits under the photograph, one sentence at a time, so nothing covers the picture. */
.cinema{min-height:0}
.cinema-overlay,html[lang=ur] .cinema-overlay{position:relative;bottom:auto;inset-inline:auto;min-height:0;padding:14px 28px 18px;background:#122744;pointer-events:auto}
.cinema-overlay .eyebrow{margin-bottom:2px}
.cinema-overlay h3,html[lang=ur] .cinema-overlay h3{font-size:17px;margin-bottom:4px}
.cinema-overlay p:last-child{max-width:none}
#subtitle{display:grid}
#subtitle span{grid-area:1/1;visibility:hidden}
#subtitle span.current{visibility:visible}
@media(min-width:701px){.cinema figure img{height:min(58vh,520px)}#exhibit:fullscreen .cinema figure img{height:max(220px,calc(100vh - 490px))}}
.photo-open{display:block;width:100%;padding:0;border:0;border-radius:0;background:none;cursor:zoom-in}
.photo-open:focus-visible{outline-offset:-4px}
/* Wide screens: the caption fills the side of the stage, so the whole photograph can be shown larger. */
@media(min-width:901px){
 .cinema{display:grid;grid-template-columns:minmax(0,1fr) 360px}
 .cinema figure img{height:min(calc(100vh - 180px),680px)}
 .cinema-overlay,html[lang=ur] .cinema-overlay{display:flex;flex-direction:column;justify-content:center;padding:28px;border-inline-start:1px solid var(--line)}
 .cinema-overlay h3,html[lang=ur] .cinema-overlay h3{font-size:20px;margin-bottom:8px}
 .cinema-overlay p:last-child,html[lang=ur] .cinema-overlay p:last-child{font-size:19px}
 #exhibit:fullscreen .section-top{margin-bottom:12px}
 #exhibit:fullscreen .section-top .eyebrow{display:none}
 #exhibit:fullscreen .cinema figure img{height:calc(100vh - 230px)}
}
@media(max-width:700px){.cinema-overlay,html[lang=ur] .cinema-overlay{padding:12px 16px 16px}}

/* The large viewer must always beat the story stage; a second click shows every pixel of the photograph. */
#photoDialog{width:96vw;max-width:96vw;max-height:96vh;padding:12px 16px}
#closePhoto{position:sticky;top:0;inset-inline-end:0;z-index:1;display:block;margin-inline-start:auto;margin-bottom:-52px}
#photoDialog img{max-height:calc(96vh - 104px);margin-top:0}
#photoDialog p{margin-block:8px 2px}
#zoomPhoto.zoomed{width:max-content;cursor:zoom-out}
#zoomPhoto.zoomed img{width:auto;max-width:none;max-height:none}

/* Fullscreen on wide screens: the controls join the side panel, under the caption. */
#stageControls:empty{display:none}
@media(min-width:901px){
 .cinema{grid-template-rows:minmax(0,1fr) auto}
 .cinema figure{grid-row:1/3}
 #exhibit:fullscreen{padding-block:84px 12px}
 #exhibit:fullscreen .section-top{flex-direction:row;align-items:center}
 #exhibit:fullscreen h2{font-size:30px}
 #exhibit:fullscreen .cinema{height:calc(100vh - 170px)}
 #exhibit:fullscreen .cinema figure img{height:calc(100vh - 208px)}
 #exhibit:fullscreen .cinema-overlay,html[lang=ur] #exhibit:fullscreen .cinema-overlay{justify-content:flex-start;padding:12px 24px}
 #exhibit:fullscreen #subtitle[lang=ur]{line-height:2.5}
 .cinema-overlay,html[lang=ur] .cinema-overlay{grid-column:2;grid-row:1;overflow-y:auto}
 #stageControls{grid-column:2;grid-row:2;padding:10px 16px 12px;background:#122744;border-inline-start:1px solid var(--line);border-block-start:1px solid var(--line)}
 #stageControls .scene-nav{margin-block:0 10px;gap:6px}
 #stageControls .playback{gap:8px}
 #stageControls .playback input{flex-basis:100%}
 #stageControls button,#stageControls select{min-height:36px;padding-block:2px}
 #stageControls .status{margin-block:4px 0;min-height:0;font-size:11px}
}

/* The drifting starfield sits behind everything, so the page gradient moves to the root element. */
html{background:radial-gradient(ellipse at 75% 4%,#263d67 0%,#080f22 50%),#080f22}
body{background:none}
#stars{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}

/* Near-square Moon photographs: keep the machine, not the empty sky, in the card crop. */
.card-photo{object-position:center 68%}

/* Without the narration studio, the story text takes the full width at a comfortable line length. */
.story-grid{grid-template-columns:minmax(0,1fr);max-width:880px}
#sound[aria-pressed=false]{color:var(--muted)}
.voice-card .volunteer{margin-top:18px}
.voice-card .volunteer a{color:#ffcf8e;overflow-wrap:anywhere}
