/* WO-0263: the supplied Network key art, shared with the companion. */
:root{--bg0:#0e124a;--bg1:#0e124a;--edge:rgba(255,211,106,.32);--edge-hi:rgba(255,211,106,.66);--cyan:#ffdb72;--pink:#ffb858;--text:#f7f5ff;--muted:#d0c8eb;--dim:#bfb5dc;--ink:#211044}
body{background:radial-gradient(ellipse at 72% 8%,rgba(232,130,31,.14),transparent 45%),linear-gradient(160deg,#0e124a,#0e124a 65%);background-attachment:fixed}
.city{height:100vh;background-image:url(network-starfield.webp);opacity:.13;mask-image:linear-gradient(#000,transparent);-webkit-mask-image:linear-gradient(#000,transparent)}
.brand img{width:220px;height:auto;margin:0}.top{padding:10px 0}.mobile-brand img{width:180px;height:auto}.mtop{gap:12px;padding-bottom:10px}.brand,.mobile-brand{flex:none}
.nav a.on,.chip.on{background:#ffdb72;color:var(--ink);border-color:#ffe8a7;box-shadow:0 0 20px #e9a02c33}.nav a.on .ico{color:var(--ink)}
.hero{background:radial-gradient(ellipse at 80% 20%,rgba(234,139,34,.22),transparent 58%),linear-gradient(130deg,#13133f,#0e124a);overflow:hidden;margin-top:6px}
.hero::after{background:linear-gradient(90deg,rgba(27,16,70,.2),transparent 65%)}
.hero .mascot img{filter:drop-shadow(0 18px 30px rgba(0,0,0,.45)) drop-shadow(0 0 14px rgba(151,113,255,.28))}
.hero .lines{margin-top:12px}.hero .gold{margin-top:30px}.presents{color:#ffdb72;background:none;filter:none}
.glass{background-color:#13133f;border-color:var(--edge)}.hero.glass{background-color:#0e124a}.glow-ico{color:#ffdb72;filter:drop-shadow(0 0 8px #ffc85755)}.c-blue,.c-violet{color:#ffdb72}
.tz span{border-color:var(--edge)}.tz span b{color:#ffdb72}.pill{border-color:#ffdb7266;box-shadow:0 0 16px #e9a02c22}.dot{box-shadow:0 0 10px #ffb858}
.tile{background:linear-gradient(145deg,#201b50,#13133f)}.tile .s{color:var(--dim)}.tile .ico,.vhead .ico{color:#ffdb72}.play:not(.soon){background:#ffdb72;color:#211044;border-color:#ffe8a7;box-shadow:0 0 14px #ffc85733}
.tabs{background:linear-gradient(#13133fee,#170d3ef5)}.tabs a.on{color:#ffdb72}.tabs a.on .ib{background:#ffdb7215;box-shadow:0 0 0 1.5px #ffdb72,0 0 18px #ffc85733}
.drawer .panel{background:linear-gradient(#0e124a,#0e124a)}.drawer .panel a.on{background:#ffdb721c}
.star-motif{width:54px;height:54px;object-fit:contain}.vhead .star-motif{width:54px;height:54px}
@media(max-width:899px){.hero{padding:22px 20px;background:radial-gradient(ellipse at 80% 0%,#df841d22,transparent 70%),#13133f}.hero .presents,h1.big{max-width:64%}.hero .lines{max-width:60%}.hero h1.big{font-size:clamp(32px,8.6vw,40px)}.hero .lines{margin-top:8px}.hero .gold{margin-top:20px}.star-motif{width:44px;height:44px}}
@media(prefers-reduced-motion:reduce){.view,.dot.live{animation:none}}
/* Keep the full presenting pose inside the hero's rounded top edge. */
@media(min-width:900px){.hero .mascot{top:8px}.hero .mascot img{height:100%;object-fit:contain;object-position:bottom}}

/* Fix 2: sampled dark starfield, with only the outer artwork feathered.
   The 5% side / 7% top margins leave the lettering, globe and ribbon opaque.
   The elliptical layer softens the corners; linear layers reach zero on every edge. */
body{background:#0e124a}.city{opacity:0}
.brand img,.mobile-brand img{
  --art-mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(0deg,transparent,#000 7%,#000 93%,transparent),radial-gradient(ellipse 40% 26% at 0% 0%,transparent 25%,#000 100%),radial-gradient(ellipse 40% 26% at 100% 0%,transparent 25%,#000 100%),radial-gradient(ellipse 40% 26% at 0% 100%,transparent 25%,#000 100%),radial-gradient(ellipse 40% 26% at 100% 100%,transparent 25%,#000 100%);
  -webkit-mask-image:var(--art-mask);mask-image:var(--art-mask);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
