/* SharpXI legal pages. Shares the landing page's tokens; no third party origin,
   so the Content Security Policy on this host stays at default-src 'self'. */

@font-face { font-family:"Archivo"; src:url("/fonts/archivo-800.woff2") format("woff2"); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:"Archivo"; src:url("/fonts/archivo-900i.woff2") format("woff2"); font-weight:900; font-style:italic; font-display:swap; }
@font-face { font-family:"Jakarta"; src:url("/fonts/jakarta-400.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Jakarta"; src:url("/fonts/jakarta-700.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }

:root{
  --ink:#0e1015; --card:#171a21; --raised:#1c2029;
  --hair:#252a35; --hair-2:#333a47;
  --text:#edeff5; --text-2:#969dac; --text-3:#868d9c;
  --accent:#6d86e8; --accent-lift:#8ba0ee;
  --win:#4caf6d; --flag:#e8a221;
  --shadow:0 1px 3px rgba(0,0,0,.34);
  --r-card:20px; --r-pill:999px;
}
*{ box-sizing:border-box; }
html,body{ max-width:100%; overflow-x:hidden; }
body{
  margin:0; background:var(--ink); color:var(--text);
  font-family:"Jakarta",system-ui,-apple-system,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased; line-height:1.7;
}
.wrap{ max-width:760px; margin:0 auto; padding:0 20px; }
a{ color:var(--accent-lift); }

header{ padding:28px 0 0; }
.brand{ display:inline-flex; align-items:center; gap:10px; text-decoration:none; }
.word{ font-family:"Archivo",sans-serif; font-weight:800; font-size:22px; letter-spacing:-.6px; color:var(--text); }
.word i{ font-weight:900; font-style:italic; color:var(--accent); }
.tag{ padding:4px 10px; border-radius:var(--r-pill); background:rgba(109,134,232,.18); color:var(--accent-lift); font-weight:700; font-size:10.5px; }

h1{ font-family:"Archivo",sans-serif; font-weight:800; font-size:clamp(28px,5vw,38px);
    letter-spacing:-1px; line-height:1.12; margin:34px 0 10px; text-wrap:balance; }
.lede{ font-size:16px; color:var(--text-2); margin:0 0 8px; }
.stamp{ font-size:12.5px; color:var(--text-3); margin:0 0 26px; }

nav.toc{ background:var(--card); border-radius:var(--r-card); padding:16px 18px; margin:0 0 30px; box-shadow:var(--shadow); }
nav.toc b{ display:block; font-size:11px; letter-spacing:.9px; color:var(--text-3); margin-bottom:8px; }
nav.toc ol{ margin:0; padding-left:20px; }
nav.toc li{ margin:3px 0; font-size:13.5px; }

h2{ font-family:"Archivo",sans-serif; font-weight:800; font-size:19px; margin:34px 0 8px;
    letter-spacing:-.2px; scroll-margin-top:20px; }
h3{ font-size:15px; font-weight:700; margin:22px 0 6px; }
p,li{ font-size:14.5px; color:var(--text); }
p{ margin:0 0 12px; }
ul,ol{ margin:0 0 14px; padding-left:22px; }
li{ margin:5px 0; }
strong{ font-weight:700; }

.tw{ overflow-x:auto; margin:0 0 16px; }
table{ width:100%; border-collapse:collapse; font-size:13.5px; min-width:420px; }
th,td{ text-align:left; padding:11px 12px; border-bottom:1px solid var(--hair); vertical-align:top; }
th{ color:var(--text-3); font-weight:700; font-size:11px; letter-spacing:.6px; text-transform:uppercase; white-space:nowrap; }
td:first-child{ font-weight:700; }

.note{
  background:var(--card); border-left:3px solid var(--accent); border-radius:0 12px 12px 0;
  padding:14px 16px; margin:0 0 18px;
}
.note p:last-child{ margin:0; }
.note.warn{ border-left-color:var(--flag); }

footer{ margin-top:44px; padding:22px 0 60px; border-top:1px solid var(--hair); color:var(--text-3); font-size:12.5px; }
footer p{ font-size:12.5px; color:var(--text-3); margin:0 0 8px; max-width:66ch; }
.legal-links{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; }
.legal-links a{
  display:inline-flex; align-items:center; min-height:44px; padding:0 14px;
  border-radius:var(--r-pill); border:1px solid var(--hair-2);
  font-weight:700; font-size:12.5px; text-decoration:none; color:var(--text);
}
.legal-links a:hover{ border-color:var(--accent); color:var(--accent-lift); }
.legal-links a[aria-current]{ background:var(--accent); border-color:var(--accent); color:#0a0c11; }

@media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }
