/* Base UI for standalone pages: tokens, nav, page head, .doc, cards, footer.
   Extracted verbatim from privacy.html, where this block was inline. legal-pages.css
   layers the light theme on top and must load AFTER this file.
   manny-guide.html linked only the override layer and had no base at all, which is
   why that page rendered as unstyled serif text with its pill SVG blown up to full
   size -- an override sheet cannot lay out a page on its own. */
  :root{
    --bg:#050810; --bg2:#080d18; --panel:#0d1420; --panel2:#111a28;
    --line:#1a2434; --line2:#22303f;
    --ink:#f2f7fa; --ink2:#b8c6d4; --muted:#7d8ea0;
    --violet:#14b8a6; --violet2:#2dd4bf; --violet-ink:#5eead4;
    --grad:linear-gradient(90deg,#22c55e 0%,#14b8a6 52%,#3b82f6 100%);
    --grad-text:linear-gradient(90deg,#34d399 0%,#22d3ee 46%,#3b82f6 100%);
    --glow:rgba(20,184,166,.5);
    --maxw:880px;
    --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;}
  body{background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.7;
    -webkit-font-smoothing:antialiased;overflow-x:hidden;}
  a{color:var(--violet2);text-decoration:none;}
  a:hover{text-decoration:underline;}
  ::selection{background:var(--violet);color:#fff;}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
  .wrap.wide{max-width:1400px;}

  /* ---------- nav (matches the home page lockup) ---------- */
  header.nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(14px);
    background:rgba(5,8,16,.72);border-bottom:1px solid var(--line);}
  .nav .wrap{display:flex;align-items:center;justify-content:space-between;height:84px;}
  .brand{display:flex;align-items:center;gap:13px;color:var(--ink);}
  .brand:hover{text-decoration:none;}
  .mark{width:54px;height:54px;flex:0 0 54px;display:block;}
  .mark img{width:100%;height:100%;display:block;}
  .wordmark{display:flex;flex-direction:column;line-height:1.05;font-size:21px;
    font-weight:800;letter-spacing:-.02em;}
  .wordmark .w2{background:var(--grad-text);-webkit-background-clip:text;
    background-clip:text;color:transparent;}
  .navright{display:flex;align-items:center;gap:24px;}
  .back{font-size:15px;color:var(--ink2);font-weight:500;}
  .back:hover{color:var(--ink);text-decoration:none;}
  .btn{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:15px;
    padding:13px 24px;border-radius:12px;border:1px solid transparent;transition:.18s;
    background:var(--grad);color:#fff;white-space:nowrap;
    box-shadow:0 8px 24px -8px var(--glow),inset 0 1px 0 rgba(255,255,255,.25);}
  .btn:hover{transform:translateY(-2px);text-decoration:none;
    box-shadow:0 14px 34px -10px var(--glow),inset 0 1px 0 rgba(255,255,255,.3);}

  /* ---------- page head ---------- */
  .pagehead{position:relative;text-align:center;padding:60px 0 40px;}
  .pagehead::before{content:"";position:absolute;top:-220px;left:50%;transform:translateX(-50%);
    width:900px;max-width:130vw;height:520px;z-index:-1;pointer-events:none;
    background:radial-gradient(closest-side,rgba(20,184,166,.18),transparent 72%);filter:blur(22px);}
  .pill{display:inline-flex;align-items:center;gap:9px;padding:9px 18px;border-radius:999px;
    border:1px solid rgba(45,212,191,.32);background:rgba(20,184,166,.07);
    font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--violet-ink);}
  .pill svg{width:15px;height:15px;fill:var(--violet2);}
  .pagehead h1{font-size:clamp(34px,4.6vw,52px);font-weight:800;letter-spacing:-.03em;
    line-height:1.1;margin-top:20px;color:#fff;}
  .pagehead h1 .g{background:var(--grad-text);-webkit-background-clip:text;
    background-clip:text;color:transparent;}
  .updated{color:var(--muted);font-size:14.5px;margin-top:14px;}

  /* ---------- document panel ---------- */
  main{padding-bottom:88px;}
  .doc{background:var(--panel);border:1px solid var(--line);border-radius:20px;
    padding:44px 46px;box-shadow:0 40px 90px -50px rgba(0,0,0,.9);}
  .doc>.lead{font-size:17px;color:var(--ink2);margin-bottom:4px;}
  .doc h2{font-size:21px;font-weight:700;color:#fff;letter-spacing:-.01em;
    margin:36px 0 12px;display:flex;align-items:baseline;gap:12px;}
  .doc h2:first-child{margin-top:0;}
  .doc h2 .n{flex:0 0 auto;font-size:13px;font-weight:800;color:var(--violet2);
    font-variant-numeric:tabular-nums;letter-spacing:.04em;}
  .doc h3{font-size:16.5px;font-weight:700;margin-bottom:7px;}
  .doc p,.doc li{color:var(--ink2);font-size:16px;margin-bottom:14px;}
  .doc ul{padding-left:22px;margin-bottom:16px;}
  .doc li{margin-bottom:9px;}
  .doc li::marker{color:var(--violet2);}
  .doc strong{color:var(--ink);font-weight:600;}
  .doc hr{border:none;border-top:1px solid var(--line);margin:34px 0;}

  /* support-page contact cards */
  .cards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:22px 0 30px;}
  .card{background:var(--panel2);border:1px solid var(--line2);border-radius:14px;padding:20px 22px;}
  .card .ci{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;
    background:rgba(45,212,191,.1);border:1px solid rgba(45,212,191,.22);margin-bottom:13px;}
  .card .ci svg{width:19px;height:19px;fill:none;stroke:var(--violet2);stroke-width:1.9;
    stroke-linecap:round;stroke-linejoin:round;}
  .card p{font-size:14.5px;margin:0;}

  /* ---------- footer (matches the home page) ---------- */
  footer{border-top:1px solid var(--line);padding:48px 0 40px;background:var(--bg2);}
  footer .wrap{display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap;align-items:flex-start;}
  footer .brand{margin-bottom:12px;}
  footer .sub{color:var(--muted);font-size:14px;max-width:290px;}
  footer .cols{display:flex;gap:60px;flex-wrap:wrap;}
  footer .col h4{font-size:13px;text-transform:uppercase;letter-spacing:.08em;
    color:var(--muted);margin-bottom:14px;}
  footer .col a{display:block;color:var(--ink2);font-size:14.5px;margin-bottom:10px;transition:.15s;}
  footer .col a:hover{color:var(--violet2);text-decoration:none;}
  .copyright{border-top:1px solid var(--line);margin-top:40px;padding-top:22px;
    color:var(--muted);font-size:13px;text-align:center;}

  /* ---------- responsive ---------- */
  @media(max-width:820px){
    .nav .wrap{height:76px;}
    .back{display:none;}
  }
  @media(max-width:620px){
    .wrap{padding:0 18px;}
    .nav .wrap{height:78px;}
    .mark{width:54px;height:54px;flex:0 0 54px;}
    .wordmark{font-size:18px;}
    .btn{padding:11px 16px;font-size:14px;}
    .pagehead{padding:40px 0 28px;}
    .doc{padding:26px 20px;border-radius:16px;}
    .doc p,.doc li{font-size:15.5px;}
    .doc h2{font-size:19px;gap:9px;}
    .cards{grid-template-columns:1fr;}
    footer .wrap{flex-direction:column;gap:26px;}
    footer .cols{gap:34px;}
  }