/* Shared styles for the legal + support pages (terms.html, privacy.html,
   support.html). Tokens and header/footer match index.html. */
:root{
  --color-navy:#0B1026;
  --color-purple:#6C3CFF;
  --color-pink:#FF4D8D;
  --color-cyan:#34D1FF;
  --color-yellow:#FFC857;
  --color-green:#4ADE80;
  --color-starlight:#EAF2FF;
  --color-slate:#A0AEC0;
  --color-surface:#1E293B;
  --color-white:#FFFFFF;
  --ink:#0B1026;
  --ink-2:#12182E;
  --line:rgba(234,242,255,.14);
  --maxw:820px;
  font-synthesis:none;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--ink);
  color:var(--color-starlight);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  font-size:17px;
  line-height:1.65;
  overflow-x:hidden;
}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px;}
a{color:var(--color-cyan);}
a:hover{color:var(--color-yellow);}
a:focus-visible{outline:2px solid var(--color-yellow);outline-offset:3px;}

header{
  position:sticky;top:0;z-index:50;
  background:rgba(11,16,38,.9);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
header::after{
  content:"";display:block;height:3px;
  background:linear-gradient(90deg,var(--color-pink),var(--color-yellow),var(--color-green),var(--color-cyan),var(--color-purple));
}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px;gap:12px;max-width:1120px;}
.brand img{height:44px;width:auto;display:block;image-rendering:pixelated;}
.nav-links{display:flex;gap:18px;font-size:15px;font-weight:500;}
.nav-links a{color:var(--color-starlight);text-decoration:none;}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--color-cyan);}

main.wrap{padding-top:44px;padding-bottom:64px;}
.eyebrow{
  font-family:"Press Start 2P",system-ui,sans-serif;
  font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--color-yellow);margin:0 0 14px;
}
h1{font-size:clamp(30px,6vw,44px);line-height:1.12;margin:0 0 14px;color:var(--color-white);letter-spacing:-.02em;}
h2{font-size:22px;line-height:1.25;margin:40px 0 10px;color:var(--color-white);}
h3{font-size:18px;margin:24px 0 6px;color:var(--color-white);}
p,li{color:var(--color-starlight);}
ul{padding-left:22px;}
li{margin:4px 0;}
.draft{
  display:inline-block;
  font-weight:700;font-size:14px;
  color:var(--color-navy);background:var(--color-yellow);
  padding:6px 12px;border-radius:8px;margin:0 0 18px;
}
.note{
  border:1px solid var(--line);border-left:4px solid var(--color-yellow);
  background:rgba(30,41,59,.6);
  border-radius:10px;padding:14px 16px;margin:18px 0;
}
.confirm{
  background:rgba(255,77,141,.18);
  color:var(--color-white);
  border:1px dashed var(--color-pink);
  border-radius:6px;padding:0 5px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.88em;
}
.toc{border:1px solid var(--line);border-radius:12px;padding:12px 18px;background:rgba(30,41,59,.4);}
.toc ol{margin:6px 0;padding-left:22px;}
.table-wrap{overflow-x:auto;}
table{border-collapse:collapse;width:100%;font-size:15px;margin:12px 0;}
th,td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top;}
th{color:var(--color-white);background:rgba(30,41,59,.7);}

footer{border-top:1px solid var(--line);padding:28px 0 36px;background:var(--ink-2);font-size:14px;}
footer .links{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:10px;}
footer .links a{color:var(--color-slate);text-decoration:none;}
footer .links a:hover{color:var(--color-yellow);}
footer p{color:var(--color-slate);margin:6px 0 0;}

@media (max-width:520px){
  body{font-size:16px;}
  .nav-links{gap:12px;font-size:14px;}
  .brand img{height:36px;}
}
.updated{color:var(--color-slate);font-size:14px;margin:0 0 18px;}