/* GGTV's product identity under the shared Giant Gamers network shell. */
:root { --bg-0:#080c16; --panel:rgba(12,20,38,.92); --line:#27334c; --text:#edf4ff; --muted:#a7b5cb; --amber:#f5b738; --cyan:#00f0ff; }
html,body { background:#060914; font:16px/1.65 system-ui,-apple-system,"Segoe UI",sans-serif; }
body.ggtv-product { background:radial-gradient(ellipse at 80% 10%,#18294a 0,transparent 48%),radial-gradient(ellipse at 0 55%,#1c1334 0,transparent 44%),#060914; }
body.ggtv-product a { text-shadow:none; }
.skip-link { position:fixed; top:-100px; left:16px; z-index:100000; padding:10px; background:#090f21; }
.skip-link:focus { top:8px; }
header.site { width:94%; max-width:1760px; margin:auto; padding:24px 0; border-bottom:1px solid var(--line); gap:24px; }
.brand-lockup { flex-shrink:0; }
.brand { font:800 20px/1.2 system-ui; letter-spacing:.03em; color:var(--text); }
.tagline { font:12px/1.5 system-ui; color:var(--muted); letter-spacing:.03em; }
.brand-emblem { width:48px; height:48px; }
nav.site ul { gap:6px; }
nav.site a { display:block; padding:8px 11px; color:#cbd7ea; font:600 13px/1.5 system-ui; text-decoration:none; border-radius:8px; }
nav.site a:hover,nav.site [aria-current] { color:var(--cyan); background:#102a3c; }
main.page { width:94%; max-width:1760px; padding:32px 0 56px; gap:28px; }
main.page:has(.hero-card) { grid-template-columns:repeat(2,minmax(0,1fr)); }
main.page>.hero-card,main.page>section:has(.app-screenshot),main.page>section:has(.station-art-grid) { grid-column:1/-1; }
section.card { border:1px solid var(--line); background:linear-gradient(135deg,#101b30e8,#0a1020f5); border-radius:18px; padding:30px; min-width:0; }
h1,h2,h3 { color:var(--text); text-shadow:none; font-family:system-ui; font-weight:750; letter-spacing:-.025em; }
h1 { font-size:clamp(32px,4vw,56px); } h2 { font-size:clamp(23px,2vw,32px); } h3 { font-size:21px; }
p { color:#bac9df; margin:0 0 16px; }
.cta { border:1px solid #2b96ca; border-radius:9px; padding:11px 20px; background:linear-gradient(135deg,#1762cd,#6531b7); color:white; font:650 14px/1.5 system-ui; text-shadow:none; cursor:pointer; }
.cta.secondary { background:#101b2e; color:#dceafb; border-color:#3a4963; }
.cta:disabled { opacity:.6; cursor:wait; }
.hero-card { position:relative; overflow:hidden; display:grid; grid-template-columns:1fr 1.3fr; column-gap:40px; padding:48px!important; background:radial-gradient(ellipse at 80% 35%,#212b5f66,transparent 70%),#0b1325!important; }
.hero-card>h2 { grid-column:1; font-size:clamp(42px,4.5vw,76px); line-height:1.03; margin:12px 0 24px; }
.hero-card>h2 span { background:linear-gradient(100deg,#74eeff,#af89ff); background-clip:text; color:transparent; }
.hero-split { display:contents; }
.hero-copy { grid-column:1; max-width:560px; }
.eyebrow { color:var(--cyan); font-size:11px; font-weight:800; letter-spacing:.18em; }
.hero-copy>.eyebrow { margin-bottom:15px; }
.hero-media { grid-column:2; grid-row:1/3; align-self:center; width:100%; border-radius:16px; overflow:hidden; border:1px solid #574c9a; box-shadow:0 16px 60px #0008; }
.hero-banner-img { display:block; width:100%; height:auto; aspect-ratio:8/3; object-fit:cover; }
.preview-label { padding:14px 18px; color:#abc9df; font-size:10px; font-weight:700; letter-spacing:.12em; background:#0b1424; }
.on-air-dot { display:inline-block; width:6px; height:6px; border-radius:50%; margin-right:8px; background:#65eaff; }
.hero-facts { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.hero-facts span { padding:5px 10px; border:1px solid #304362; border-radius:6px; font-size:11px; color:#b8cbe4; }
.gallery-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.screenshot-gallery { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.gallery-tile { min-width:0; margin:0; padding:12px; background:#091121; border:1px solid #29354e; border-radius:12px; }
.gallery-tile img { height:220px; object-fit:contain; background:#050911; }
.gallery-tile figcaption,.gallery-tile figcaption strong { font-family:system-ui; }
.station-art-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
.station-tile { min-width:0; }
.station-tile img { max-width:100%; }
.grid-3 { gap:18px; }
.note { color:var(--muted); font-size:14px; }
footer.site { width:94%; max-width:1760px; margin:auto; padding:24px 0; font:12px/1.6 system-ui; border-top:1px solid var(--line); }
.account-intro { max-width:740px; }
.account-card { max-width:720px; }
.account-card form { display:grid; gap:16px; margin:18px 0; }
.account-card label { display:grid; gap:7px; font-size:14px; color:#cbd9ec; }
.account-card input,.account-card textarea { box-sizing:border-box; width:100%; min-width:0; padding:12px; color:var(--text); border:1px solid #344762; background:#070e1d; border-radius:8px; font:16px/1.5 system-ui; }
.account-card textarea { min-height:130px; overflow-wrap:anywhere; font:12px/1.6 monospace; }
.account-card details { margin:20px 0; border-top:1px solid var(--line); padding-top:14px; }
.account-card summary { cursor:pointer; color:var(--cyan); }
.account-card [hidden] { display:none!important; }
.account-card #account-email { overflow-wrap:anywhere; }
.matrix { display:block; max-width:100%; overflow-x:auto; }
@media(max-width:1100px) { .hero-card { padding:30px!important; column-gap:24px; } .gallery-grid,.screenshot-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); } .station-art-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:700px) { header.site { gap:18px; } nav.site { width:100%; } nav.site ul { flex-wrap:nowrap; overflow-x:auto; padding-bottom:6px; } nav.site li { flex-shrink:0; } main.page,main.page:has(.hero-card) { padding-top:20px; grid-template-columns:1fr; } section.card { padding:20px; } .hero-card { display:flex; flex-direction:column; gap:16px; padding:24px!important; } .hero-card>h2 { font-size:46px; } .hero-copy { order:1; } .hero-media { order:2; } .hero-facts { margin-top:12px; } .gallery-grid,.screenshot-gallery { grid-template-columns:1fr; } .station-art-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .preview-label { font-size:9px; } }

/* Real application photography and the navigable setup reference. */
.page-title { grid-column:1/-1; margin:0; font-size:clamp(30px,4vw,46px); }
.hero-card>h1 { grid-column:1; font-size:clamp(42px,4.5vw,76px); line-height:1.03; margin:12px 0 24px; }
.hero-card>h1 span { color:var(--cyan); }
.hero-live-preview { aspect-ratio:16/9; object-fit:contain; }
main.page>section:has(.real-photo-gallery) { grid-column:1/-1; }
.real-photo-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.product-photo { margin:0; min-width:0; border:1px solid var(--line); border-radius:12px; background:#070d19; overflow:hidden; }
.product-photo>a { display:block; background:#03060d; }
.product-photo img { display:block; width:100%; height:auto; max-height:440px; object-fit:contain; }
.product-photo.portrait img { height:540px; max-height:540px; }
.product-photo figcaption { padding:18px; color:#a9bdd4; font:14px/1.65 system-ui,sans-serif; }
.product-photo figcaption strong { display:block; margin-bottom:6px; color:#edf4ff; font-size:17px; }
main.page:has(.wiki-layout) { display:block; }
.wiki-layout { display:grid; grid-template-columns:240px minmax(0,1fr); gap:28px; margin-top:28px; align-items:start; }
.wiki-contents { position:sticky; top:16px; padding:22px; border:1px solid var(--line); border-radius:14px; background:#0b1325; max-height:calc(100vh - 32px); overflow:auto; }
.wiki-contents h2 { margin:0 0 14px; font-size:21px; }
.wiki-contents ol { padding-left:20px; margin:0 0 16px; }
.wiki-contents li { padding:5px 0; font-size:14px; }
.wiki-contents a { color:#bfd5ed; text-decoration:none; }
.wiki-contents a:hover { color:var(--cyan); text-decoration:underline; }
.wiki-content { min-width:0; }
.wiki-section { margin-bottom:24px; scroll-margin-top:24px; }
.wiki-section h2 { margin-top:0; }
.wiki-section h3 { font-size:21px; margin-top:24px; }
.wiki-section .lead { font-size:22px; color:#edf4ff; }
.wiki-section pre { max-width:100%; overflow-x:auto; font-size:13px; }
.wiki-section code { overflow-wrap:anywhere; }
.wiki-section .matrix { display:table; width:100%; }
.wiki-section .table-scroll { overflow-x:auto; }
.setup-choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin:24px 0; }
.setup-choices article { padding:24px; border:1px solid #2b4961; border-radius:12px; background:#0b182a; }
.setup-choices h3 { margin-top:12px; }
.step-label { font-size:11px; font-weight:800; letter-spacing:.12em; color:var(--cyan); }
.help-callout { border-left:3px solid var(--amber); padding:18px 22px; margin:24px 0; background:#162033; border-radius:0 10px 10px 0; }
.help-callout strong { color:var(--amber); }
.help-callout p { margin:8px 0 0; }
.back-to-contents { display:inline-block; margin-top:16px; font-size:13px; color:var(--cyan); }
.gg-library-close { background:none; border:none; color:#94a3b8; cursor:pointer; font-size:14px; }
.gg-library-empty { padding:12px; color:#94a3b8; font-size:.78rem; }
.wiki-section details { border-top:1px solid var(--line); padding:18px 0; }
.wiki-section summary { cursor:pointer; font-weight:650; color:#edf4ff; }
.wiki-section details p { margin:14px 0 0; }
.wiki-contents a:focus-visible,.product-photo a:focus-visible,.wiki-section summary:focus-visible { outline:3px solid var(--cyan); outline-offset:4px; }
@media(max-width:1000px) { .wiki-layout { grid-template-columns:200px minmax(0,1fr); gap:20px; } .setup-choices { grid-template-columns:1fr; } }
@media(max-width:700px) { .hero-card>h1 { font-size:46px; } .wiki-layout { display:block; } .wiki-contents { position:static; max-height:none; margin-bottom:24px; } .wiki-contents ol { columns:2; column-gap:24px; } .wiki-contents li { break-inside:avoid; } .real-photo-gallery { grid-template-columns:1fr; gap:18px; } .product-photo.portrait img { height:480px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media(max-width:700px) {
  header.site { padding:16px 0; gap:12px; }
  .hero-card>h1 { order:-1; font-size:42px; }
  .hero-card .hero-media { order:0; }
  .hero-card .hero-copy { order:1; }
  body.ggtv-product { --gg-bottom-bar-height:106px; }
  html body.ggtv-product #gg-global-radio-bar { height:106px!important; min-height:106px!important; padding:8px 12px!important; }
  html body.ggtv-product #gg-global-radio-bar .gg-radio-bar-inner { height:88px!important; grid-template-columns:88px minmax(90px,1fr) 96px!important; grid-template-rows:44px 32px!important; gap:8px!important; }
  html body.ggtv-product #gg-global-radio-bar .gg-btn-popout { grid-column:1!important; grid-row:2!important; }
  html body.ggtv-product #gg-global-radio-bar .gg-radio-right { grid-column:2/4!important; grid-row:2!important; }
}