:root{
    color-scheme: dark;
    --bg:#05070b; --ink:#fff; --dim:rgba(255,255,255,.66); --faint:rgba(255,255,255,.6);
    --line:rgba(255,255,255,.10); --line-2:rgba(255,255,255,.18);
    --cyan:#0095E0; --pink:#f80868; --grid-line:rgba(255,255,255,.05);
    --mono:"JetBrains Mono",ui-monospace,monospace;
    --disp:"Barlow Condensed",system-ui,sans-serif;
    --body:"Space Grotesk",system-ui,sans-serif;
  }
  /* Light theme: matches index.html. Neon accents darken for legibility; the
     wordmark (a logotype) keeps its brand colors. Dark-native effects soften. */
  html[data-theme="light"]{
    color-scheme: light;
    --bg:#eef1f6; --ink:#0A0E15; --dim:rgba(10,14,21,.74); --faint:rgba(10,14,21,.6);
    --line:rgba(10,14,21,.12); --line-2:rgba(10,14,21,.22);
    --cyan:#0a63a0; --pink:#c30a59; --grid-line:rgba(10,14,21,.05);
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} body{transition:none} }
  body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--body); -webkit-font-smoothing:antialiased; min-height:100svh; transition:background-color .35s ease, color .35s ease}
  a{color:inherit}
  a:focus-visible{outline:3px solid var(--cyan); outline-offset:3px}
  a:focus:not(:focus-visible){outline:none}
  .bg{position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden}
  .bg .glow{position:absolute; inset:-20%;
    background:radial-gradient(40% 40% at 82% 4%, rgba(0,149,224,.16), transparent 60%),radial-gradient(40% 42% at 8% 96%, rgba(248,8,104,.12), transparent 60%)}
  .bg .grid{position:absolute; inset:0;
    background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);
    background-size:54px 54px,54px 54px;
    -webkit-mask-image:radial-gradient(150% 130% at 50% 0%, #000 40%, transparent 100%);
    mask-image:radial-gradient(150% 130% at 50% 0%, #000 40%, transparent 100%)}
  .vignette{position:fixed; inset:0; z-index:1; pointer-events:none; background:radial-gradient(140% 120% at 50% 30%, transparent 62%, rgba(0,0,0,.5) 100%)}

  .wrap{position:relative; z-index:2; max-width:680px; margin:0 auto; padding:clamp(26px,5vh,52px) clamp(20px,5vw,40px) 80px;
    padding-top:max(clamp(26px,5vh,52px),env(safe-area-inset-top));
    padding-right:max(clamp(20px,5vw,40px),env(safe-area-inset-right));
    padding-bottom:max(80px,env(safe-area-inset-bottom));
    padding-left:max(clamp(20px,5vw,40px),env(safe-area-inset-left))}

  .top{display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:clamp(34px,7vh,72px)}
  .top .word{height:24px; width:auto; display:block; filter:drop-shadow(0 6px 24px rgba(0,149,224,.25))}
  .back{display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); text-decoration:none; transition:color .15s}
  .back:hover{color:var(--ink)}

  .eyebrow{font-family:var(--mono); font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--cyan); margin:0 0 16px}
  h1{margin:0 0 10px; font-family:var(--disp); font-style:italic; font-weight:800; text-transform:lowercase; letter-spacing:-.01em; line-height:.95; font-size:clamp(40px,7vw,68px)}
  .updated{font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--faint); margin:0 0 30px}

  .note{display:flex; gap:12px; padding:16px 18px; border:1px solid var(--line-2); border-left:2px solid var(--pink); border-radius:10px; background:rgba(248,8,104,.05); margin:0 0 36px}
  .note .k{font-family:var(--mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--pink); flex:0 0 auto; padding-top:2px}
  .note p{margin:0; font-size:13.5px; line-height:1.55; color:var(--dim)}

  .lead{font-size:clamp(15px,1.8vw,17px); line-height:1.65; color:var(--dim); margin:0 0 36px; max-width:60ch}
  .lead b{color:var(--ink); font-weight:600}

  section{padding:24px 0; border-top:1px solid var(--line)}
  section:first-of-type{border-top:0}
  .sec-h{display:flex; align-items:baseline; gap:14px; margin:0 0 12px}
  .sec-h h2{margin:0; font-family:var(--disp); font-style:italic; font-weight:800; text-transform:lowercase; font-size:clamp(20px,3vw,26px); line-height:1}
  section p{margin:0 0 12px; font-size:14.5px; line-height:1.62; color:var(--dim); max-width:62ch}
  section p:last-child{margin-bottom:0}
  section a{color:var(--cyan); text-decoration:underline; text-underline-offset:2px}
  section a:hover{text-decoration-thickness:2px}
  ul{margin:6px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:9px; max-width:62ch}
  li{position:relative; padding-left:20px; font-size:14.5px; line-height:1.55; color:var(--dim)}
  li::before{content:""; position:absolute; left:2px; top:9px; width:6px; height:6px; border-radius:50%; background:var(--cyan); opacity:.7}
  li b{color:var(--ink); font-weight:600}

  .stance{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:46px; padding-top:24px; border-top:1px solid var(--line); font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--faint)}
  .stance .dot{color:var(--line-2)} .stance b{color:var(--dim); font-weight:500}

  .pfoot{margin-top:18px; font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--faint)}
  .pfoot a{color:var(--faint); text-decoration:underline; text-underline-offset:3px} .pfoot a:hover,.pfoot a:focus-visible{color:var(--ink)}

  @media (max-width:560px){ .note{flex-direction:column; gap:6px} }
  @media (prefers-contrast:more){
    html[data-theme="dark"]{--dim:rgba(255,255,255,.92); --faint:rgba(255,255,255,.82); --line-2:rgba(255,255,255,.5)}
    html[data-theme="light"]{--dim:rgba(10,14,21,.95); --faint:rgba(10,14,21,.85); --line-2:rgba(10,14,21,.55)}
  }
  /* Light theme: soften dark-native effects + neutral wordmark shadow */
  html[data-theme="light"] .bg .glow{opacity:.5}
  html[data-theme="light"] .vignette{background:radial-gradient(140% 120% at 50% 30%, transparent 72%, rgba(10,14,21,.05) 100%)}
  html[data-theme="light"] .top .word{filter:drop-shadow(0 6px 22px rgba(10,14,21,.12))}
  /* Theme toggle: 44px button, shown only with scripting (needs JS + localStorage) */
  .top-end{display:flex; align-items:center; gap:14px}
  .theme-toggle{display:none; align-items:center; justify-content:center; width:44px; height:44px; padding:0; border-radius:999px; border:1px solid var(--line-2); background:transparent; color:var(--faint); cursor:pointer; transition:color .15s,border-color .15s,background .15s}
  .theme-toggle:hover{color:var(--ink); background:rgba(127,127,127,.1)}
  .theme-toggle:focus-visible{outline:2px solid var(--cyan); outline-offset:3px}
  .theme-toggle svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2}
  html[data-theme="dark"] .theme-toggle .i-moon{display:none}
  html[data-theme="light"] .theme-toggle .i-sun{display:none}
  @media (scripting: enabled){ .theme-toggle{display:inline-flex} }
  /* a11y: Windows High Contrast / forced-colors parity (matches index.html) -
     repaint link focus + the theme toggle with system color keywords. */
  @media (forced-colors:active){
    a:focus-visible{outline:3px solid Highlight; outline-offset:3px}
    .theme-toggle{border:1px solid ButtonText; color:ButtonText}
    .theme-toggle:hover{background:ButtonFace; color:ButtonText}
    .theme-toggle:focus-visible{outline:3px solid Highlight; outline-offset:2px}
  }

/* spacing utility (was an inline style on a section paragraph) */
.mt-s{margin-top:14px}

/* ---- privacy-policy document structure ---- */
.toc{margin:0 0 36px; padding:18px 20px; border:1px solid var(--line); border-radius:10px; background:rgba(127,127,127,.04)}
.toc .k{display:block; font-family:var(--mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--faint); margin:0 0 12px}
.toc ul{margin:0; gap:7px}
.toc li{padding-left:16px; font-size:13.5px}
.toc li::before{top:8px; width:4px; height:4px}
.toc a{color:var(--dim); text-decoration:none}
.toc a:hover,.toc a:focus-visible{color:var(--ink); text-decoration:underline}
section h3{margin:18px 0 6px; font-family:var(--disp); font-style:italic; font-weight:800; text-transform:lowercase; font-size:18px; line-height:1.1; color:var(--ink)}
.svc{border:1px solid var(--line); border-radius:10px; padding:13px 16px; margin:10px 0; background:rgba(127,127,127,.03)}
.svc-name{color:var(--ink); font-weight:600; font-size:14.5px}
.svc .meta{font-family:var(--mono); font-size:11px; letter-spacing:.03em; color:var(--faint); margin:6px 0 0; line-height:1.6}
dl{margin:0}
dt{font-weight:600; color:var(--ink); margin:16px 0 4px; font-size:14.5px}
dd{margin:0 0 4px 0; font-size:14px; line-height:1.62; color:var(--dim); max-width:62ch}
.attrib{margin-top:18px; font-family:var(--mono); font-size:10px; letter-spacing:.08em; line-height:1.7; color:var(--faint)}
.attrib a{color:var(--faint); text-decoration:underline; text-underline-offset:3px}
.attrib a:hover,.attrib a:focus-visible{color:var(--ink)}

  /* a11y: skip-to-main link, hidden until keyboard focus (CSP-safe, in CSS not inline) */
  .skip-link{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--cyan);color:#02131c;font-family:var(--mono);font-size:12px;letter-spacing:.06em;padding:10px 16px;border-radius:0 0 8px 0;text-decoration:none}
  .skip-link:focus{left:0}