:root{--bg:#08080b;--bg2:#101016;--panel:#14141c;--line:#2a2633;--ink:#e8e0cc;--mute:#a59c88;--gold:#c9a227;--gold2:#e9d9a6;--red:#b3122e;--blood:#8a0b1f;--c:#c9a227;
--serif:"Cinzel","Trajan Pro",Georgia,"Times New Roman",serif;--body:Georgia,"Iowan Old Style","Palatino Linotype",serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--bg) radial-gradient(1200px 600px at 50% -200px,#1b1320,transparent);color:var(--ink);font:17px/1.7 var(--body)}
a{color:var(--gold2);text-decoration-color:rgba(201,162,39,.4);text-underline-offset:3px}a:hover{color:#fff}
img{max-width:100%;height:auto}
h1,h2,h3{font-family:var(--serif);font-weight:700;line-height:1.2;letter-spacing:.02em;color:#f2e8cf}
h1{font-size:clamp(2rem,5vw,3.2rem);margin:.2em 0}h2{font-size:1.6rem;margin:1.6em 0 .6em;padding-bottom:.25em;border-bottom:1px solid var(--line)}
h2::before{content:"✠ ";color:var(--c);font-size:.8em}h3{font-size:1.15rem}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#000;padding:8px;z-index:99}
.muted{color:var(--mute)}.small{font-size:.86rem}.red{color:#ff4d5e;font-weight:bold}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}.narrow{max-width:820px}
.lede{font-size:1.15rem;color:#d6ccb3;max-width:760px}
.eyebrow{font-family:var(--serif);text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;color:var(--gold);margin:0}
/* header */
.top{position:sticky;top:0;z-index:50;background:rgba(8,8,11,.92);backdrop-filter:blur(8px);border-bottom:1px solid #3a2a1a;box-shadow:0 2px 20px #000}
.topin{max-width:1300px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:10px 20px}
.brand{font-family:var(--serif);font-size:1.25rem;color:var(--gold);text-decoration:none;display:flex;gap:8px;align-items:center;white-space:nowrap;text-shadow:0 0 12px rgba(201,162,39,.35)}
.sig{color:var(--red);font-size:1.4rem}
nav#mainnav{display:flex;gap:4px;flex-wrap:wrap}
nav#mainnav a{font-family:var(--serif);font-size:.86rem;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:#cfc3a5;padding:6px 10px;border-radius:3px}
nav#mainnav a:hover,nav#mainnav a.on{color:#fff;background:linear-gradient(#2a1416,#1a0c0f);box-shadow:inset 0 -2px 0 var(--red)}
.navtog{display:none;background:none;border:1px solid var(--line);color:var(--gold);font-size:1.3rem;border-radius:4px;padding:2px 10px}
.gsearch{margin-left:auto;position:relative}
.gsearch input,#q,#gq,select{background:#0e0e14;border:1px solid #3b3343;color:var(--ink);padding:8px 12px;border-radius:4px;font:inherit;font-size:.95rem}
.gsearch input{width:250px}.gsearch input:focus,#q:focus{outline:2px solid var(--gold);border-color:transparent}
.gsr{position:absolute;right:0;top:110%;width:340px;max-height:70vh;overflow:auto;background:#111118;border:1px solid #3b3343;border-radius:6px;box-shadow:0 10px 40px #000;z-index:60}
.gsr a{display:flex;gap:10px;align-items:center;padding:7px 10px;text-decoration:none;color:var(--ink);border-left:3px solid var(--c)}
.gsr a:hover,.gsr a.sel{background:#1e1822}.gsr img{width:30px;height:40px;object-fit:cover;border-radius:3px}
.gsr small{display:block;color:var(--mute);font-size:.78rem}.gsr .ftag{font-size:.7rem;text-transform:uppercase;color:var(--c);margin-left:auto}
/* hero */
.hero{position:relative;min-height:min(78vh,680px);display:flex;align-items:flex-end;overflow:hidden;border-bottom:2px solid #3a1a1a}
.heroimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.1) contrast(1.05)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,8,11,.1),rgba(8,8,11,.55) 55%,var(--bg))}
.herotext{position:relative;z-index:2;max-width:1200px;margin:0 auto;padding:40px 20px 50px;width:100%}
.herotext h1{font-size:clamp(2.6rem,8vw,5.2rem);text-shadow:0 4px 30px #000,0 0 40px rgba(179,18,46,.4);margin:.1em 0}
.btn{display:inline-block;font-family:var(--serif);text-transform:uppercase;letter-spacing:.08em;font-size:.85rem;padding:10px 18px;border-radius:3px;text-decoration:none;color:#fff;background:linear-gradient(#c01834,#7d0c1d);border:1px solid #e0485c;cursor:pointer}
.btn.ghost{background:rgba(0,0,0,.5);border-color:var(--gold);color:var(--gold2)}.btn.small{padding:6px 12px;font-size:.75rem}
.ctas{display:flex;gap:10px;flex-wrap:wrap}
/* start here */
.start{margin:30px 0}.steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px;counter-reset:s}
.steps a{display:flex;gap:12px;align-items:center;padding:10px;background:linear-gradient(90deg,#16121a,#0f0f14);border:1px solid var(--line);border-left:4px solid var(--c);border-radius:6px;text-decoration:none;color:var(--ink);position:relative}
.steps a:hover{border-color:var(--c);transform:translateY(-2px);transition:.15s}
.steps .n{position:absolute;left:52px;top:6px;background:var(--c);color:#000;font:bold .75rem var(--serif);width:22px;height:22px;border-radius:50%;display:grid;place-items:center}
.steps strong{display:block;font-family:var(--serif);color:#fff}.steps span{font-size:.88rem;color:var(--mute)}
.mini{object-fit:cover;border-radius:4px;border:1px solid rgba(255,255,255,.15);flex:none;background:#111}
.cols3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.cols3>div{background:var(--panel);border:1px solid var(--line);padding:4px 20px;border-radius:6px;border-top:3px solid var(--red)}
.note{background:#120f15;border:1px solid var(--line);border-left:4px solid var(--gold);padding:6px 20px;border-radius:4px;margin:24px 0}
/* group tiles */
.gtiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.gtile{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:6px;border:1px solid var(--line);text-decoration:none;box-shadow:inset 0 0 0 0 var(--c)}
.gtile .gimg{width:100%;height:100%;object-fit:cover;transition:transform .4s}.gtile:hover .gimg{transform:scale(1.07)}
.gtile::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 30%,rgba(0,0,0,.9));border-bottom:4px solid var(--c)}
.gname{position:absolute;left:12px;bottom:26px;z-index:2;font:700 1.1rem var(--serif);color:#fff;text-shadow:0 2px 6px #000}
.gcount{position:absolute;left:12px;bottom:6px;z-index:2;font-size:.8rem;color:var(--c);filter:brightness(1.4)}
/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px}
.card{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:6px;overflow:hidden;text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s;border-bottom:3px solid var(--c)}
.card:hover{transform:translateY(-4px);box-shadow:0 10px 30px rgba(0,0,0,.6),0 0 0 1px var(--c)}
.pwrap{aspect-ratio:3/4;overflow:hidden;background:#111}.pwrap img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}.pwrap img.wide-img{object-fit:contain;background:radial-gradient(circle at 50% 50%,#1d1726,#09080d)}.card:hover .pwrap img{transform:scale(1.05)}
.cbody{padding:10px 12px 12px}.cbody h3{margin:0;font-size:1rem}.ctitle{margin:.2em 0 .4em;font-size:.82rem;color:var(--mute);line-height:1.35}
.fac{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--c);filter:brightness(1.3)}
.chip{display:inline-block;font-size:.78rem;padding:3px 10px;border-radius:20px;border:1px solid var(--c);color:#fff;background:color-mix(in srgb,var(--c) 22%,transparent);text-decoration:none;margin:2px 2px 2px 0}
.chip:hover{background:var(--c)}
.crumbs{font-size:.85rem;color:var(--mute);margin:18px 0 6px}.crumbs a{color:var(--mute)}
/* filters */
.filters{position:sticky;top:58px;z-index:20;background:rgba(8,8,11,.95);padding:10px 0;margin-bottom:12px;border-bottom:1px solid var(--line)}
.fbtns{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.fbtn{font:.8rem var(--serif);letter-spacing:.05em;padding:6px 12px;border-radius:20px;border:1px solid var(--c,#666);background:transparent;color:var(--ink);cursor:pointer}
.fbtn.on,.fbtn:hover{background:var(--c,#c9a227);color:#000}
.frow{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
/* character page */
.cbanner{height:220px;overflow:hidden;position:relative;border-bottom:3px solid var(--c)}
.cbimg{width:100%;height:100%;object-fit:cover;opacity:.75}.cbanner::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent,var(--bg))}
.char{position:relative;margin-top:-120px;z-index:2}
.chead{display:grid;grid-template-columns:minmax(220px,340px) 1fr;gap:32px;align-items:end}.chead:has(.wide-hero){grid-template-columns:minmax(300px,480px) 1fr}
.pfig{margin:0}.portrait.big{width:100%;height:auto;border-radius:6px;border:2px solid var(--c);box-shadow:0 0 0 4px #000,0 20px 60px rgba(0,0,0,.8),0 0 40px color-mix(in srgb,var(--c) 35%,transparent);display:block}
.pfig figcaption{font-size:.75rem;color:var(--mute);margin-top:6px;font-style:italic}
.chead .title{font-size:1.2rem;color:#d8ccaa;font-style:italic;margin:.1em 0 .6em}
.facts{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}.facts div{background:var(--panel);border:1px solid var(--line);padding:6px 14px;border-radius:4px}
.facts dt{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--mute)}.facts dd{margin:0;font-weight:bold}
.art{font-size:.86rem}
.cwrap{display:grid;grid-template-columns:200px 1fr;gap:40px;margin-top:30px}
.toc{position:sticky;top:80px;align-self:start;display:flex;flex-direction:column;border-left:2px solid var(--line);padding-left:12px;font-size:.88rem}
.toc p{font:700 .75rem var(--serif);text-transform:uppercase;letter-spacing:.12em;color:var(--gold);margin:0 0 6px}
.toc a{color:var(--mute);text-decoration:none;padding:3px 0}.toc a:hover,.toc a.on{color:#fff}.toc a.on{box-shadow:-14px 0 0 -12px var(--c)}
.ccontent{max-width:780px;min-width:0}.ccontent section:first-child h2{margin-top:0}
p.drop::first-letter{float:left;font:700 3.6em/0.85 var(--serif);color:var(--c);margin:.08em .1em 0 0;text-shadow:0 0 20px color-mix(in srgb,var(--c) 50%,transparent)}
.brutal{margin:34px 0;padding:6px 26px 14px;border:2px solid #c0142f;border-left:8px solid #c0142f;background:linear-gradient(135deg,#2a070d,#14070a 60%);border-radius:4px;box-shadow:0 0 30px rgba(192,20,47,.25),inset 0 0 40px rgba(0,0,0,.5)}
.brutal h2{border:0;margin:.2em 0 .4em;color:#ffd7dc}.brutal h2::before{content:"☠ ";color:#ff3b54}
.bmk{font:700 .75rem var(--serif);text-transform:uppercase;letter-spacing:.2em;color:#ff4d5e;margin:12px 0 0}
.bsrc{font-size:.82rem;color:#d9a3aa;border-top:1px solid #5a1a24;padding-top:8px}.bsrc span{font-weight:bold;color:#ff8090}
.events{padding-left:1.2em}.events li{margin-bottom:.6em}.events li::marker{color:var(--c);font-weight:bold}
.battles{list-style:none;padding:0}.battles li{padding:10px 14px;margin-bottom:8px;background:var(--panel);border-left:3px solid var(--c);border-radius:3px}
.battles strong{color:#fff;font-family:var(--serif)}
.apps li{margin-bottom:.3em}
.conns{list-style:none;padding:0;display:grid;gap:10px}
.conn{display:flex;gap:12px;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--c);padding:10px;border-radius:4px}
.conn p{margin:.2em 0 0;font-size:.92rem}.rtype{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;background:#231c26;padding:2px 7px;border-radius:3px;color:#d8c99c}
.facrels{list-style:none;padding:0}.facrels li{margin-bottom:8px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.peers{display:flex;flex-wrap:wrap;gap:8px}.peer{display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);padding:4px 10px 4px 4px;border-radius:4px;text-decoration:none;color:var(--ink);font-size:.88rem}
.peer:hover{border-color:var(--gold)}
.contested{background:#131019;border:1px dashed #6b5a8a;padding:4px 20px;border-radius:4px}
.prevnext{display:flex;justify-content:space-between;gap:12px;margin:50px 0 30px;border-top:1px solid var(--line);padding-top:20px}
.pn{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);background:var(--panel);border:1px solid var(--line);padding:8px 14px;border-radius:6px;font-family:var(--serif)}
.pn small{display:block;color:var(--mute);font-size:.72rem}.pn:hover{border-color:var(--gold)}.next{text-align:right}
/* factions */
.grp{margin:36px 0}.gband{position:relative;height:120px;overflow:hidden;border-radius:6px;border-bottom:3px solid var(--c)}
.gband .gimg{width:100%;height:100%;object-fit:cover;opacity:.6}.gband h2{position:absolute;left:20px;bottom:6px;margin:0;border:0;text-shadow:0 2px 10px #000}
.gband h2::before{content:none}.dot{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--c);margin-right:8px;box-shadow:0 0 8px var(--c)}
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-top:12px}
.fcard{background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--c);padding:4px 14px 12px;border-radius:4px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column}
.fcard:hover{border-color:var(--c)}.fcard p{font-size:.86rem;color:var(--mute);margin:.2em 0 .6em;flex:1}.faces{display:flex;gap:3px;margin-bottom:4px}
.fhero{position:relative;height:340px;overflow:hidden;border-bottom:3px solid var(--c);display:flex;align-items:flex-end}
.fhimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.fhero::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 20%,var(--bg))}
.fhtext{position:relative;z-index:2;width:100%}.fsum{max-width:820px;font-size:1.08rem}
/* graph */
#net{height:72vh;min-height:480px;background:radial-gradient(#15111a,#07070a);border:1px solid var(--line);border-radius:6px}
.gctl{display:flex;flex-direction:column;gap:10px;margin-bottom:10px}.gchecks{display:flex;flex-wrap:wrap;gap:10px;font-size:.85rem}.gchecks label{display:flex;align-items:center;gap:4px}
.lbl{font-size:.85rem}
/* tables */
.tblwrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.9rem}th,td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left}th{font-family:var(--serif);color:var(--gold)}
.tc{display:flex;align-items:center;gap:8px}.badge{font-size:.7rem;padding:2px 8px;border-radius:10px;text-transform:uppercase}.badge.ok{background:#173d22;color:#8ef0a7}
ul.plain li{margin-bottom:.5em}
footer{margin-top:60px;border-top:1px solid #3a2a1a;background:#060608;padding:20px 0;font-size:.85rem;color:var(--mute)}.footin{max-width:1200px;margin:0 auto;padding:0 20px}
/* mobile */
@media (max-width:900px){
 .cwrap{grid-template-columns:1fr}.toc{position:static;flex-direction:row;flex-wrap:wrap;gap:4px 12px;border-left:0;border-bottom:1px solid var(--line);padding:0 0 10px}.toc p{width:100%}
 .chead{grid-template-columns:1fr;text-align:left}.pfig{max-width:280px}.pfig.wide-hero{max-width:100%}.char{margin-top:-90px}
 .topin{flex-wrap:wrap;gap:10px}.navtog{display:block;margin-left:auto}nav#mainnav{display:none;width:100%;flex-direction:column}nav#mainnav.open{display:flex}
 .gsearch{width:100%;margin:0;order:5}.gsearch input{width:100%}.gsr{width:100%}
 .filters{top:96px}
}
@media (max-width:520px){body{font-size:16px}.grid{grid-template-columns:repeat(2,1fr);gap:10px}.cbody{padding:8px}.hero{min-height:560px}.cbanner{height:150px}.prevnext{flex-direction:column}.steps{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* units */
.deepcuts{margin:34px 0;padding:6px 26px 14px;border:2px solid #c9a227;border-left:8px solid #c9a227;background:linear-gradient(135deg,#1d1808,#0e0d08 60%);border-radius:4px;box-shadow:0 0 24px rgba(201,162,39,.18)}
.deepcuts h2{border:0;margin:.2em 0 .4em;color:#f3e3b0}.deepcuts h2::before{content:"✦ ";color:#c9a227}
.deepcuts .bmk{color:#c9a227}.deepcuts ul{padding-left:1.1em}.deepcuts li{margin:.6em 0}.deepcuts .bsrc{display:block;font-size:.85rem;color:#b9a77a;margin-top:.2em}
.ucat{margin-top:1.6em;border-bottom:1px solid var(--line);padding-bottom:4px}
.ugrid{margin-bottom:1.2em}
.deepcuts .bsrc{border-top:1px solid #4a3d14;padding-top:4px}.deepcuts .bsrc span{color:#e0c060}
/* wargear */
.wggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(265px,1fr));gap:12px;margin:14px 0 20px}
.wgitem{display:flex;gap:12px;align-items:flex-start;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--c);padding:10px 12px;border-radius:6px;text-decoration:none;color:var(--ink);transition:transform .15s,border-color .15s,box-shadow .15s}
.wgitem:hover{transform:translateY(-2px);border-color:var(--c);box-shadow:0 8px 24px rgba(0,0,0,.55)}
.wgitem .mini{width:54px;height:72px;border-radius:4px;object-fit:cover;flex:none;border:1px solid rgba(255,255,255,.18)}
.wgitem div{min-width:0;flex:1}
.wgitem strong{display:block;font-family:var(--serif);color:#fff;font-size:.96rem;line-height:1.25;margin-bottom:3px}
.wgitem .rtype{display:inline-block;margin-bottom:4px;font-size:.66rem;background:#231c26;color:var(--gold2);border:1px solid rgba(201,162,39,.3)}
.wgitem p{margin:3px 0 0;font-size:.82rem;color:var(--mute);line-height:1.38}
.wgnote{background:#121018;border:1px solid var(--line);border-left:4px solid var(--c);padding:10px 16px;border-radius:4px;margin:10px 0 16px;font-size:.95rem}
.wgnote strong{font-family:var(--serif);color:var(--gold2);text-transform:uppercase;letter-spacing:.06em;font-size:.78rem;display:block;margin-bottom:3px}

/* multi-image hero gallery & lightbox */
.pfig.has-gallery{display:flex;flex-direction:column;gap:8px}
.gal-stage{position:relative;border-radius:6px;overflow:hidden}
.gal-zoom{position:absolute;top:10px;right:10px;z-index:4;background:rgba(8,8,11,.82);border:1px solid var(--gold);color:var(--gold2);width:34px;height:34px;border-radius:6px;font-size:1.05rem;cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 12px rgba(0,0,0,.6);transition:background .15s,transform .15s}
.gal-zoom:hover{background:var(--gold);color:#000;transform:scale(1.06)}
.gal-badge{position:absolute;bottom:10px;right:10px;z-index:4;background:rgba(8,8,11,.85);border:1px solid rgba(201,162,39,.5);color:var(--gold2);font:600 .72rem var(--serif);letter-spacing:.05em;padding:3px 9px;border-radius:14px;cursor:pointer;backdrop-filter:blur(4px)}
.gal-badge:hover{background:var(--gold);color:#000}
.gal-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:2px}
.gal-thumb{position:relative;padding:0;background:#0e0e14;border:2px solid var(--line);border-radius:5px;overflow:hidden;cursor:pointer;aspect-ratio:3/4;transition:border-color .15s,transform .15s}
.gal-thumb img{width:100%;height:100%;object-fit:cover;display:block;opacity:.72;transition:opacity .15s}.gal-thumb img.wide-img{object-fit:contain;background:#0a090e}
.gal-thumb:hover img,.gal-thumb.active img{opacity:1}
.gal-thumb.active{border-color:var(--c,var(--gold));box-shadow:0 0 10px color-mix(in srgb,var(--c,var(--gold)) 55%,transparent)}
.gal-thumb .gt-tag{position:absolute;inset:auto 0 0 0;background:linear-gradient(transparent,rgba(0,0,0,.92));color:#f2e8cf;font:600 .62rem var(--serif);letter-spacing:.04em;padding:8px 3px 3px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gal-cap{min-height:2.5em;line-height:1.4}
.gal-lightbox{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:24px}
.gal-lightbox[hidden]{display:none!important}
.glb-backdrop{position:absolute;inset:0;background:rgba(4,4,7,.92);backdrop-filter:blur(8px)}
.glb-box{position:relative;z-index:2;display:flex;align-items:center;gap:16px;max-width:1050px;width:100%;max-height:92vh}
.glb-main{flex:1;display:flex;flex-direction:column;align-items:center;background:#101017;border:1px solid var(--gold);border-radius:8px;padding:16px;box-shadow:0 24px 80px #000}
.glb-img{max-height:70vh;width:auto;max-width:100%;object-fit:contain;border-radius:4px;border:1px solid var(--line)}
.glb-meta{text-align:center;margin-top:12px;max-width:720px}
.glb-tag{display:inline-block;font:700 .72rem var(--serif);text-transform:uppercase;letter-spacing:.12em;color:var(--gold);margin-bottom:4px}
.glb-title{display:block;font:700 1.15rem var(--serif);color:#fff;margin-bottom:4px}
.glb-cap{margin:0;font-size:.9rem;color:var(--ink)}
.glb-close{position:absolute;top:-12px;right:-12px;width:38px;height:38px;border-radius:50%;background:#1a1218;border:1px solid var(--gold);color:#fff;font-size:1.1rem;cursor:pointer;z-index:3}
.glb-nav{background:rgba(20,20,28,.85);border:1px solid var(--gold);color:var(--gold2);width:44px;height:44px;border-radius:50%;font-size:1.6rem;cursor:pointer;display:grid;place-items:center;flex:none}
.glb-nav:hover,.glb-close:hover{background:var(--gold);color:#000}

/* upgraded connections web */
.gtabs{display:flex;flex-wrap:wrap;gap:6px;border-bottom:1px solid var(--line);padding-bottom:10px}
.gtab{font:700 .8rem var(--serif);letter-spacing:.06em;text-transform:uppercase;padding:8px 14px;border-radius:5px;border:1px solid var(--line);background:#121118;color:var(--mute);cursor:pointer;transition:.15s}
.gtab:hover{color:#fff;border-color:var(--gold)}
.gtab.active{background:linear-gradient(135deg,#2a161d,#180e13);color:var(--gold2);border-color:var(--gold);box-shadow:0 0 16px rgba(201,162,39,.22)}
.spot-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;background:#111017;border:1px solid var(--line);border-left:3px solid var(--gold);padding:8px 12px;border-radius:6px}
.spot-lbl{font:700 .75rem var(--serif);text-transform:uppercase;letter-spacing:.08em;color:var(--gold)}
.spot-pills{display:flex;flex-wrap:wrap;gap:6px;flex:1}
.spot-pill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 4px;border-radius:20px;border:1px solid var(--line);background:#171621;color:var(--ink);font-size:.8rem;cursor:pointer;transition:.15s}
.spot-pill img{width:22px;height:28px;object-fit:cover;border-radius:50%;border:1px solid var(--c)}
.spot-pill:hover,.spot-pill.active{border-color:var(--c);background:color-mix(in srgb,var(--c) 24%,#14141c);color:#fff}
.hop-tog{display:flex;gap:4px;margin-left:auto}
.hop-btn{font:600 .74rem var(--serif);padding:5px 10px;border-radius:4px;border:1px solid var(--line);background:#0d0d12;color:var(--mute);cursor:pointer}
.hop-btn.active{background:var(--gold);color:#000;border-color:var(--gold)}
.gzoom{display:flex;gap:4px;margin-left:auto}
.gstage{display:grid;grid-template-columns:1fr 360px;gap:16px;align-items:start;margin-top:8px}
.gnet-wrap{min-width:0}
#net{height:68vh;min-height:520px;background:radial-gradient(circle at 50% 45%,#1c1524,#08080c 75%);border:1px solid var(--line);border-radius:8px;box-shadow:inset 0 0 60px rgba(0,0,0,.8)}
.gpanel{background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:8px;padding:14px;max-height:68vh;min-height:520px;display:flex;flex-direction:column;overflow:hidden}
.gp-head{display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:12px}
.gp-port{width:68px;height:90px;object-fit:cover;border-radius:6px;border:2px solid var(--c);flex:none}
.gp-meta{min-width:0}
.gp-eyebrow{font:700 .7rem var(--serif);text-transform:uppercase;letter-spacing:.1em;display:block}
.gp-meta h2{font-size:1.2rem;margin:2px 0;border:0;padding:0}
.gp-meta h2::before{content:none}
.gp-title{font-size:.82rem;color:var(--mute);margin:0;font-style:italic}
.gp-actions{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.gp-list-wrap{flex:1;display:flex;flex-direction:column;min-height:0}
.gp-list-wrap h3{font-size:.86rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gold2);margin:4px 0 8px}
.gp-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding-right:4px}
.gp-conn{display:flex;gap:10px;align-items:flex-start;background:#101016;border:1px solid var(--line);border-left:3px solid var(--c);padding:8px 10px;border-radius:5px;cursor:pointer;transition:border-color .15s,background .15s}
.gp-conn:hover{background:#191622;border-color:var(--c)}
.gp-conn img{width:38px;height:50px;object-fit:cover;border-radius:4px;flex:none;border:1px solid rgba(255,255,255,.15)}
.gp-cbody{min-width:0;flex:1}
.gp-ctop{display:flex;justify-content:space-between;gap:6px;align-items:baseline;flex-wrap:wrap}
.gp-ctop strong{font-family:var(--serif);font-size:.9rem;color:#fff}
.gp-cfac{display:block;font-size:.72rem;color:var(--mute)}
.gp-cbody p{margin:4px 0 0;font-size:.8rem;color:#d6ccb3;line-height:1.35}
@media (max-width:960px){
  .gstage{grid-template-columns:1fr}
  .gpanel{max-height:none;min-height:auto}
}