/* Shared portal presentation. Game documents retain their own styles. */
:root { --bg:#0b0d14; --bg-2:#121620; --header:#11141e; --card:#171b27; --card-2:#202637; --muted:#aeb6ca; --muted-dim:#929cb4; --radius-card:18px; --line:rgba(189,201,232,.1); }
html { scroll-padding-top:90px; }
.header { background:rgba(16,19,29,.94); backdrop-filter:blur(18px); border-bottom:1px solid var(--line); }
.search__input { border-radius:14px; background:#090d16; }
.sidebar { background:rgba(13,16,24,.96); border-right:1px solid var(--line); }
.nav__item { border-radius:12px; margin-bottom:3px; transition:background .25s, color .25s; }
.nav__item.is-active { background:rgba(125,100,255,.18); box-shadow:inset 3px 0 #a08cff; }
.main { min-width:0; }
.section { margin-bottom:38px; }
.section__head { gap:12px; align-items:center; }
.section__title { font-size:clamp(19px,2vw,25px); letter-spacing:-.035em; min-width:0; }
.section__see { white-space:nowrap; color:#c6bcff; }
.hero { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:28px; padding:32px; background:radial-gradient(ellipse at 18% 0%,#292249,transparent 70%),#141824; border-radius:24px; }
.hero::after { display:none; }
.hero__inner { max-width:560px; align-self:center; }
.hero__title { font-size:clamp(30px,3.5vw,52px); line-height:1.08; letter-spacing:-.055em; }
.hero__eyebrow { padding:0; border:0; background:none; margin-bottom:15px; font-size:10px; letter-spacing:.12em; }
.hero__text { font-size:15px; line-height:1.7; margin:16px 0 22px; }
.hero__art { display:block; position:relative; z-index:2; width:100%; max-width:none; flex:initial; align-self:center; border-radius:18px; overflow:hidden; transform:none; animation:none; border:1px solid rgba(255,255,255,.18); box-shadow:0 18px 36px #0005; }
.hero__art[hidden] { display:none; }
.hero__art img { width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; transition:transform .3s; }
.hero__art:hover { transform:translateY(-3px); }
.hero__art:hover img { transform:scale(1.035); }
.hero__art-cap { position:absolute; bottom:0; left:0; right:0; padding:45px 18px 18px; font-size:20px; text-align:left; background:linear-gradient(transparent,#070910ed); }
.hero__feature-label { position:absolute; top:14px; left:14px; z-index:1; font-size:9px; font-weight:800; letter-spacing:.15em; padding:7px 10px; border-radius:7px; background:#090c19db; }
.hero__feature-play { position:absolute; right:15px; bottom:19px; z-index:2; font-size:12px; font-weight:700; padding:7px 10px; border-radius:8px; background:#fff; color:#171322; }
.hero__art-cap { padding-right:110px; }
.hero__stats { display:flex; grid-column:1/-1; gap:24px; margin:0; padding-top:16px; border-top:1px solid var(--line); }
.hero__stats[hidden] { display:none; }
.hero__stat { display:flex; align-items:baseline; gap:8px; padding:0; border:0; background:none; backdrop-filter:none; }
.hero__stat dt { font-size:11px; color:var(--muted); text-transform:none; letter-spacing:0; }
.hero__stat dd { margin:0; font-size:15px; font-weight:800; }
.discover-strip { display:flex; gap:10px; overflow-x:auto; padding:3px 1px 12px; margin-bottom:25px; scrollbar-width:thin; scrollbar-color:#51466f transparent; }
.discover-pill { flex:0 0 auto; padding:10px 16px; border:1px solid var(--line-strong); border-radius:99px; font-size:12px; font-weight:650; background:#171c28; transition:background .25s,transform .25s; }
.discover-pill:hover,.discover-pill.is-active { background:#6650d5; transform:translateY(-2px); }
.rail { gap:18px; padding-top:8px; padding-bottom:14px; scroll-snap-type:x proximity; }
.rail .gcard { width:clamp(230px,23vw,310px); }
.rail .gcard--tall { width:210px; }
.rail-btn { opacity:1; width:38px; height:38px; border:1px solid var(--line-strong); }
.gcard { border-radius:18px; background:#171b27; border:1px solid var(--line); transition:transform .28s,box-shadow .28s,border-color .28s; }
.gcard:hover,.gcard:focus-visible { transform:translateY(-5px); border-color:#8b75e999; box-shadow:0 14px 30px #0005; }
.gcard__thumb { overflow:hidden; aspect-ratio:16/10; }
.gcard__img { object-fit:cover; transition:transform .3s,opacity .25s; }
.gcard__body { padding:13px 15px 15px; }
.gcard__title { font-size:15px; line-height:1.4; }
.gcard__meta { margin-top:5px; font-size:11px; gap:8px; }
.gcard__badge { top:11px; left:11px; border-radius:7px; font-size:9px; padding:5px 8px; }
.gcard__hovertitle,.gcard__facts { display:none; }
.gcard__overlay { background:linear-gradient(transparent,rgba(7,10,20,.6)); }
.gcard__play { border-radius:99px; padding:10px 18px; }
.gcard--continue .gcard__thumb { aspect-ratio:4/3; }
.gcard--continue .gcard__overlay { opacity:1; align-items:flex-end; }
.gcard--continue .gcard__play { transform:none; font-size:11px; }
.grid { grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:20px; }
.mosaic { gap:18px; }
.page-head { padding:28px; border:1px solid var(--line); border-radius:22px; background:radial-gradient(ellipse at 0 0,#29224599,transparent 70%),#141824; gap:18px; }
.page-head h1 { font-size:clamp(28px,3.5vw,44px); }
.toolbar { padding:14px; background:#131823; border:1px solid var(--line); border-radius:16px; gap:12px; }
.field,.select { min-width:0; }
.filters { gap:8px; }
.cat-card { border-radius:17px; transition:transform .25s,border-color .25s; }
.cat-card:hover { transform:translateY(-4px); }
.btn { min-height:42px; border-radius:11px; transition:transform .25s,background .25s,box-shadow .25s; }
.btn--primary { background:#7759ed; box-shadow:0 4px 16px #7759ed24; }
.btn:hover { transform:translateY(-2px); }
.btn:active { transform:translateY(1px) scale(.98); }
:where(a,button,input,select):focus-visible { outline:2px solid #c1b5ff; outline-offset:4px; }
.empty { border:1px dashed #545b7380; border-radius:20px; background:linear-gradient(110deg,#191b2c,#111620); }
.empty--inline { padding:23px; }
.lb-banner,.pf-hero,.panel,.card-panel,.ginfo,.arena { border-radius:22px; border-color:var(--line-strong); }
.pf-hero { background:radial-gradient(ellipse at 0 0,#34295080,transparent 75%),#171b27; }
.lb-row { border-radius:12px; }
.gpv__card { border-radius:22px; border:1px solid #5c5378; box-shadow:0 30px 90px #000a; }
.gpv__head,.gpv__foot { padding:20px; background:#171b27; }
.gpv__blurb { color:#bac1d2; line-height:1.65; }
.search__results { border-radius:16px; box-shadow:0 20px 50px #0008; }
.footer { border-top:1px solid var(--line); padding-top:32px; }
@media(max-width:1100px) { .hero { gap:20px; padding:25px; } .hero__title { font-size:35px; } .hero__stats { gap:18px; flex-wrap:wrap; } }
@media(max-width:700px) {
 .hero { grid-template-columns:1fr; padding:23px; gap:20px; }
 .hero__title { font-size:36px; } .hero__text { font-size:14px; }
 .hero__art img { aspect-ratio:16/8; } .hero__stats { display:none; }
 .section { margin-bottom:28px; } .section__title { font-size:20px; } .section__see { font-size:11px; }
 .rail .gcard { width:70vw; max-width:280px; } .rail .gcard--tall { width:180px; }
 .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
 .gcard__body { padding:10px; } .gcard__title { font-size:13px; }
 .gcard__meta { font-size:10px; } .gcard__badge { font-size:8px; top:7px; left:7px; }
 .page-head { padding:22px; flex-wrap:wrap; } .page-head p { font-size:13px; }
 .toolbar { flex-wrap:wrap; } .toolbar .field { flex:1 1 100%; }
 .empty--inline { flex-wrap:wrap; gap:16px; } .gpv__foot { flex-wrap:wrap; gap:16px; }
 .gpv__blurb { flex:1 1 100%; } .gpv__foot .btn { width:100%; justify-content:center; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
