/* Roeplal Lab v12.1 · real-first deep space + Cosmic Cliffs home */
:root{--rv12-cyan:#7ee7ef;--rv12-blue:#6d8cff;--rv12-ink:#030812;--rv12-panel:rgba(4,11,21,.76);--rv12-border:rgba(132,173,214,.26)}

/* HOME — one photographic composition, not cards pasted on top */
#home{padding:max(16px,env(safe-area-inset-top)) 16px max(14px,env(safe-area-inset-bottom));background:#02060d;isolation:isolate}
#home .home-photo{position:absolute;inset:0;z-index:-4;overflow:hidden;background:#030812}
#home .home-photo img{width:100%;height:100%;object-fit:cover;object-position:62% 47%;filter:saturate(.86) contrast(1.11) brightness(.74);transform:scale(1.035);transition:transform 1.4s cubic-bezier(.2,.75,.2,1),filter .8s ease;will-change:transform,filter}
#home .home-photo:after{content:"";position:absolute;inset:0;z-index:1;background:
  radial-gradient(circle at 78% 18%,rgba(68,127,218,.08),transparent 29%),
  linear-gradient(180deg,rgba(1,5,12,.10) 0%,rgba(1,5,12,.12) 30%,rgba(1,6,14,.46) 64%,#02060d 100%),
  linear-gradient(90deg,rgba(1,6,14,.70) 0%,rgba(1,6,14,.29) 48%,rgba(1,6,14,.05) 82%,rgba(1,6,14,.16) 100%)}
#home .home-photo:before{content:"";position:absolute;inset:0;z-index:2;box-shadow:inset 0 0 96px 18px rgba(0,0,0,.40);pointer-events:none}
#home .home-noise,#home .home-grid,#home .home-orbit{display:none}
#home .top{z-index:4;position:relative}
#home .home-status{background:rgba(3,10,19,.35);border-color:rgba(164,203,235,.22);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2)}
#home .home-layout{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;padding-top:20px}
#home .home-copy{padding:0 2px 12px;max-width:620px;text-shadow:0 2px 28px rgba(0,0,0,.58)}
#home .home-copy .eyebrow{font-size:9px;color:#a9eef4;letter-spacing:.26em}
#home .home-copy h1{margin:8px 0 9px;font-size:clamp(37px,11.4vw,70px);line-height:.91;letter-spacing:-.058em;max-width:680px}
#home .home-copy h1 span{color:#b5c9ff;font-weight:600}
#home .home-copy p{margin:0;max-width:510px;color:#d3dae4;font-size:13px;line-height:1.48}
#home .home-meta{display:flex;gap:11px;flex-wrap:wrap;margin-top:12px;font-size:8px;letter-spacing:.13em;color:#d5e1ed}
#home .home-meta span{display:inline-flex;align-items:center;gap:5px}.home-meta i{width:5px;height:5px;border-radius:50%;background:#80e8ed;box-shadow:0 0 10px #80e8ed}
#home .topic-deck{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:134px 58px;gap:8px;margin-top:0}
#home .topic-v12{position:relative;overflow:hidden;border:1px solid rgba(153,194,230,.25);border-radius:17px;background:linear-gradient(135deg,rgba(7,19,35,.72),rgba(3,9,17,.48));backdrop-filter:blur(17px) saturate(1.08);-webkit-backdrop-filter:blur(17px) saturate(1.08);text-align:left;color:#f7fbff;padding:0;box-shadow:inset 0 1px rgba(255,255,255,.04)}
#home .topic-v12.space{grid-column:1/-1;border-color:rgba(111,225,236,.52);background:linear-gradient(110deg,rgba(4,17,30,.62),rgba(2,9,18,.26));box-shadow:0 18px 50px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.06)}
#home .topic-v12.space:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,7,14,.78),rgba(1,7,14,.26) 70%,rgba(1,7,14,.05));pointer-events:none}
#home .topic-v12 .topic-index{position:absolute;top:12px;left:13px;font-size:8px;letter-spacing:.17em;color:#9fc0d4}
#home .topic-v12 .topic-copy{position:absolute;left:13px;right:12px;bottom:11px;z-index:2}.topic-v12 .topic-copy b{display:block;font-size:13px;letter-spacing:.12em}.topic-v12 .topic-copy small{display:block;margin-top:4px;font-size:7px;line-height:1.35;letter-spacing:.1em;color:#b9c5d1}
#home .topic-v12.space .topic-copy b{font-size:24px;letter-spacing:.08em}.topic-v12.space .topic-copy small{font-size:8px}.topic-v12.space .space-cta{position:absolute;right:13px;top:12px;z-index:2;display:flex;align-items:center;gap:8px}.topic-v12.space .space-cta .badge{padding:6px 8px;border-radius:999px;border:1px solid rgba(110,226,237,.38);background:rgba(4,18,28,.42);font-size:7px;letter-spacing:.14em}.topic-v12.space .arrow{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(109,140,255,.20);border:1px solid rgba(139,176,255,.45)}
#home .topic-v12:disabled{opacity:.60}.topic-v12 .mini-icon{position:absolute;right:11px;top:10px;color:#9db5ca;font-size:16px}
#home .home-foot{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:7px;letter-spacing:.12em;color:#8d9cad}.home-foot .line{height:1px;flex:1;background:linear-gradient(90deg,rgba(118,232,235,.36),rgba(118,232,235,0))}
#home .photo-credit{position:absolute;right:16px;bottom:max(6px,env(safe-area-inset-bottom));z-index:5;font-size:6px;letter-spacing:.08em;color:rgba(226,236,244,.54)}

/* REAL-FIRST OBSERVATORY SCENES */
.real-scene{background:#02060c}.real-scene .top{flex:0 0 auto}.real-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-top:10px;flex:0 0 auto}.real-head h2{margin:5px 0 0;font-size:clamp(31px,9.5vw,53px);line-height:.95;letter-spacing:-.052em}.real-head-tag{font-size:7px;letter-spacing:.14em;color:#b5c7d8;border:1px solid #263c53;border-radius:999px;padding:7px 9px;white-space:nowrap;background:#06101bbb}
.real-stage{position:relative;flex:1;min-height:0;margin:10px 0 8px;border:1px solid rgba(107,151,193,.26);border-radius:21px;overflow:hidden;background:#02050a;box-shadow:0 20px 70px #0008}
.real-stage .real-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transition:opacity .32s ease,transform .72s cubic-bezier(.2,.75,.2,1),filter .5s ease;filter:saturate(.96) contrast(1.05) brightness(.86);transform:scale(1.015)}
.real-stage.loading .real-image{opacity:.45;transform:scale(1.05)}
.real-stage:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(1,4,10,.06) 0%,rgba(1,4,10,.02) 35%,rgba(1,4,10,.45) 67%,rgba(2,7,14,.92) 100%),linear-gradient(90deg,rgba(1,5,12,.22),transparent 62%)}
.real-media-top{position:absolute;z-index:3;top:10px;left:10px;right:10px;display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.source-badge{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid rgba(129,213,230,.42);border-radius:999px;background:rgba(2,9,16,.68);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:7px;font-weight:800;letter-spacing:.13em;color:#d9f8fb}.source-badge:before{content:"";width:5px;height:5px;border-radius:50%;background:#7de8ee;box-shadow:0 0 10px #7de8ee}.source-credit{max-width:48%;padding:7px 9px;border-radius:10px;background:rgba(2,8,15,.60);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:6px;line-height:1.35;letter-spacing:.04em;text-align:right;color:#b9c6d3}
.real-caption{position:absolute;z-index:4;left:11px;right:11px;bottom:10px;padding:12px 13px 11px;border:1px solid rgba(141,178,211,.22);border-radius:16px;background:linear-gradient(135deg,rgba(3,12,22,.86),rgba(2,8,16,.70));backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15)}.real-caption .kicker{font-size:7px;letter-spacing:.17em;color:#75e7ed;font-weight:800}.real-caption h3{font-size:20px;margin:4px 0 4px;letter-spacing:-.025em}.real-caption p{margin:0;color:#c3cddd;font-size:10px;line-height:1.42}.real-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:9px;padding-top:8px;border-top:1px solid rgba(132,166,198,.16)}.real-stats b{display:block;font-size:10px}.real-stats small{display:block;margin-top:2px;font-size:6px;letter-spacing:.1em;color:#8395a8}
.real-bottom{flex:0 0 auto;min-width:0}.real-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:0 0 7px}.real-tabs::-webkit-scrollbar{display:none}.real-tabs button,.star-chips button{flex:0 0 auto;border:1px solid #263b51;background:#06101b;border-radius:999px;padding:9px 12px;color:#9eafc2;font-size:8px;letter-spacing:.08em;min-height:36px}.real-tabs button.on,.star-chips button.on{color:white;border-color:#64dce8;background:linear-gradient(110deg,rgba(20,114,142,.55),rgba(57,77,145,.55))}.real-nav{display:grid;grid-template-columns:1fr 1.18fr;gap:8px}.real-nav button{height:46px;border:1px solid #2a425b;border-radius:999px;background:#07111d;font-size:9px;letter-spacing:.13em;font-weight:800;text-transform:uppercase}.real-nav button.next{background:linear-gradient(110deg,#12799f,#4259b9);border-color:#5fcfe3}

/* 04: Gaia — actual survey data dominates */
#gaia-stage .real-image{object-fit:cover;object-position:center 48%;filter:saturate(.8) contrast(1.12) brightness(.9)}
#gaia-stage:after{background:linear-gradient(180deg,rgba(1,4,9,.03),rgba(1,4,9,.08) 40%,rgba(1,5,11,.58) 68%,rgba(2,7,14,.94) 100%)}
.star-chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:0 0 7px}.star-chips::-webkit-scrollbar{display:none}.star-chips button{padding:8px 11px;min-height:34px}
.gaia-context-note{position:absolute;z-index:3;top:46px;left:10px;max-width:68%;padding:7px 9px;border-radius:10px;background:rgba(2,8,15,.58);font-size:7px;line-height:1.4;color:#c4cfdb;border:1px solid rgba(135,167,196,.15)}
.gaia-link{color:#9cecf1;text-decoration:none}

/* 05: observation, then EHT — zero fake black-hole render in primary view */
#sgr .real-stage .real-image{filter:saturate(1.05) contrast(1.1) brightness(.88)}
#sgr .real-stage[data-mode="eht"] .real-image{object-fit:contain;background:#050000;transform:scale(.94);filter:contrast(1.04) saturate(1.02)}
#sgr .real-stage[data-mode="gaia"] .real-image{object-fit:cover;filter:saturate(.75) contrast(1.08) brightness(.9)}
.observation-scale{position:absolute;z-index:3;right:10px;bottom:148px;border-left:1px solid rgba(129,183,220,.45);padding-left:8px;font-size:6px;letter-spacing:.12em;color:#aec1d2;writing-mode:vertical-rl;transform:rotate(180deg)}

/* dialogs for source/context */
.real-dialog{border:1px solid #2d4862;background:#07101c;color:#edf4fb;border-radius:20px;width:min(90vw,560px);padding:20px;box-shadow:0 24px 80px #000b}.real-dialog::backdrop{background:#000a;backdrop-filter:blur(5px)}.real-dialog h2{margin:7px 0 10px;font-size:27px}.real-dialog p{font-size:12px;line-height:1.55;color:#bdc9d7}.real-dialog a{color:#85e7ed}.real-dialog .close{position:absolute;right:12px;top:10px;border:1px solid #30485f;border-radius:50%;width:34px;height:34px;background:#08131f;color:white}

@media(max-height:720px){
 #home .home-copy h1{font-size:35px}.home-copy p{font-size:11px!important}.home-meta{margin-top:8px!important}.topic-deck{grid-template-rows:112px 51px!important}.home-foot{display:none!important}
 .real-head{margin-top:6px}.real-head h2{font-size:31px}.real-stage{margin:7px 0 6px}.real-caption{padding:9px 10px}.real-caption h3{font-size:17px}.real-caption p{font-size:9px}.real-stats{margin-top:6px;padding-top:6px}.real-tabs{padding-bottom:5px}.real-tabs button{min-height:32px;padding:7px 10px}.real-nav button{height:40px}
}
@media(min-width:760px){
 #home{padding:30px 5vw}.home-layout{justify-content:flex-end!important}.home-copy{padding-bottom:22px!important}.topic-deck{grid-template-columns:2fr repeat(3,1fr)!important;grid-template-rows:220px!important;gap:12px!important}.topic-v12.space{grid-column:auto!important}.topic-v12{height:auto}.home-copy h1{font-size:72px!important}.photo-credit{right:5vw!important}
 .real-scene{padding:28px 5vw!important}.real-stage{max-height:62vh}.real-caption{max-width:640px;right:auto}.real-head h2{font-size:55px}.real-bottom{max-width:1000px}.real-tabs{justify-content:center}.real-nav{max-width:640px;margin:0 auto}
}
@media(max-width:759px){#home .home-photo img{object-position:66% 48%;transform:scale(1.06)}#home .home-copy{text-shadow:0 3px 32px rgba(0,0,0,.72)}#home .topic-v12{background:linear-gradient(135deg,rgba(4,14,27,.68),rgba(2,7,14,.46));backdrop-filter:blur(14px) saturate(1.05);-webkit-backdrop-filter:blur(14px) saturate(1.05)}}
@media(min-width:760px){#home .home-photo img{object-position:50% 48%;transform:scale(1.025)}}
@media(prefers-reduced-motion:reduce){#home .home-photo img,.real-stage .real-image{transition:none!important}.home-status:before{animation:none!important}}
