:root{
  --glass:rgba(0,0,0,.16);
  --glass2:rgba(0,0,0,.10);
  --stroke:rgba(255,255,255,.12);
  --stroke2:rgba(255,255,255,.08);
  --text:rgba(255,255,255,.92);
  --muted:rgba(255,255,255,.72);
  --muted2:rgba(255,255,255,.58);
  --shadow:0 18px 60px rgba(0,0,0,.55);
  --shadow2:0 12px 40px rgba(0,0,0,.40);
  --r18:18px;
  --r22:22px;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  background:transparent!important;
  color:var(--text)!important;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  letter-spacing:.01em;
  min-height:100%;
  position:relative;
}
/* Always-on background art (do not change the image; just enforce it everywhere) */
body::before{
  content:"";
  position:fixed; inset:0;
  z-index:0; pointer-events:none;
  background:url(/assets/hud/bg.jpg) center/cover no-repeat;
  filter:contrast(1.06) saturate(1.02);
}
body::after{
  content:"";
  position:fixed; inset:0;
  z-index:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(0,0,0,.58), rgba(0,0,0,.78));
}
main,#main,.wrap{position:relative;z-index:1;background:transparent!important}
.wrap{max-width:1120px;margin:0 auto;padding:56px 20px}
@media (max-width:720px){.wrap{padding:32px 16px}}
/* Brand typography */
.t1{font-weight:800;letter-spacing:.02em}
.t2{color:var(--muted);margin-top:2px}
/* Headings */
h1,h2,h3{margin:0 0 10px 0;letter-spacing:-.03em;line-height:1.06;color:var(--text)!important}
h1{font-weight:780;font-size:clamp(34px,5vw,56px)}
h2{font-weight:740;font-size:clamp(22px,3vw,30px)}
p,li{color:var(--muted)!important;line-height:1.62}
small,.small{color:var(--muted2)!important}
/* Links */
a{color:rgba(255,255,255,.92)!important;text-underline-offset:3px}
a:hover{color:#fff!important}
/* Glass surfaces: force consistency site-wide */
.header,.topbar,.navbar,.nav,.menu,[class*="nav"],[class*="header"]{
  background:var(--glass)!important;
  border:1px solid var(--stroke)!important;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:var(--shadow2);
  border-radius:var(--r18);
}
.card,.panel,.box,.tile,.section,.callout,.hero,.glass,.surface,
[class*="card"],[class*="panel"],[class*="shell"],[class*="frame"],[class*="surface"]{
  background:var(--glass)!important;
  border:1px solid var(--stroke)!important;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:var(--shadow);
  border-radius:var(--r22);
}
/* Ensure no big gray “page slabs” hide the background */
.page, [class*="page-"], section, article{background:transparent!important}
/* Nav polish */
nav a,.nav a,.menu a{text-decoration:none;padding:10px 12px;border-radius:12px}
nav a:hover,.nav a:hover,.menu a:hover{background:rgba(255,255,255,.08)!important}
.active{background:rgba(255,255,255,.10)!important;border:1px solid rgba(255,255,255,.10)!important}
/* Buttons */
.btn,.button,button,input[type=submit],a.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--glass2)!important;
  border:1px solid var(--stroke)!important;
  color:var(--text)!important;
  border-radius:12px;
  padding:10px 14px;
  font-weight:700;
}
.btn:hover,.button:hover,button:hover,input[type=submit]:hover,a.btn:hover{background:rgba(255,255,255,.10)!important}
.btn.primary,.primary.btn{background:rgba(255,255,255,.12)!important;border-color:rgba(255,255,255,.18)!important}
/* Forms */
label{color:rgba(255,255,255,.84)!important;font-weight:700}
input[type=text],input[type=email],input[type=password],textarea,select{
  width:100%;
  background:rgba(0,0,0,.18)!important;
  border:1px solid var(--stroke)!important;
  color:var(--text)!important;
  border-radius:12px;
  padding:12px 12px;
  outline:none;
}
input:focus,textarea:focus,select:focus{
  border-color:rgba(255,255,255,.24)!important;
  box-shadow:0 0 0 3px rgba(255,255,255,.06)!important;
}
/* Dividers + footer */
hr,.rule,.divider{border:0;border-top:1px solid var(--stroke2)!important;opacity:1}
footer,.footer{color:rgba(255,255,255,.62)!important}
