/* AusterShield — legal / support pages */
@import url("fonts.css");
:root {
  --bg:#060608; --fg:#fff; --mute:rgba(255,255,255,.6); --faint:rgba(255,255,255,.38); --ghost:rgba(255,255,255,.18);
  --line:rgba(255,255,255,.1); --line2:rgba(255,255,255,.22); --surface:rgba(255,255,255,.04);
  --zen:#00e5ff; --hard:#ff003c; --amber:#ffb300; --acc:var(--zen);
  --mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --sans:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --disp:"Space Grotesk", var(--sans);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--fg); font:15.5px/1.7 var(--sans); -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(ellipse 60% 40% at 50% 0%, rgba(0,229,255,.08), transparent 70%), radial-gradient(rgba(255,255,255,.06) 1px, transparent 1.2px);
  background-size:auto, 26px 26px; background-repeat:no-repeat, repeat; }
a { color:var(--acc); text-decoration:none; } a:hover { text-decoration:underline; text-underline-offset:3px; }
nav { position:sticky; top:0; z-index:5; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px clamp(1.25rem, 4vw, 3.5rem); background:rgba(6,6,8,.72); backdrop-filter:blur(16px) saturate(140%); border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:11px; color:var(--fg); }
.brand:hover { text-decoration:none; }
.brand svg { width:28px; height:28px; color:var(--acc); filter:drop-shadow(0 0 8px rgba(0,229,255,.6)); }
.brand b { font:700 13px/1 var(--mono); letter-spacing:.28em; }
.brand small { display:block; font:500 8px/1 var(--mono); letter-spacing:.34em; color:var(--faint); margin-top:5px; }
.back { font:500 11px/1 var(--mono); letter-spacing:.18em; text-transform:uppercase; color:var(--mute); }
.back:hover { color:var(--fg); text-decoration:none; }
.wrap { max-width:780px; margin:0 auto; padding:72px 24px 96px; }
header { border-bottom:1px solid var(--line); padding-bottom:28px; margin-bottom:44px; }
.eyebrow { font:500 11px/1 var(--mono); letter-spacing:.32em; text-transform:uppercase; color:var(--hard); margin:0 0 16px; }
h1 { font:700 clamp(2rem, 5vw, 3rem)/1.05 var(--disp); letter-spacing:-.02em; margin:0 0 12px; }
.meta { color:var(--faint); font:500 11px/1.6 var(--mono); letter-spacing:.16em; text-transform:uppercase; margin:0; }
h2 { font:500 11.5px/1.4 var(--mono); letter-spacing:.3em; text-transform:uppercase; color:var(--zen); margin:46px 0 14px; padding-top:8px; }
h3 { font:600 16px/1.4 var(--disp); margin:26px 0 8px; }
p, li { color:rgba(255,255,255,.82); }
p { margin:0 0 14px; }
ul { padding-left:20px; margin:0 0 16px; } li { margin-bottom:8px; }
strong { color:var(--fg); font-weight:600; }
code { font:500 .92em var(--mono); color:var(--fg); background:var(--surface); border:1px solid var(--line); padding:1px 6px; border-radius:5px; }
table { width:100%; border-collapse:collapse; margin:18px 0 22px; font-size:14px; display:block; overflow-x:auto; }
th, td { border:1px solid var(--line); padding:11px 13px; text-align:left; vertical-align:top; }
th { background:var(--surface); color:var(--mute); font:600 10.5px/1.4 var(--mono); letter-spacing:.18em; text-transform:uppercase; white-space:nowrap; }
.callout { border:1px solid rgba(255,0,60,.35); background:rgba(255,0,60,.06); padding:16px 18px; margin:22px 0; border-radius:12px; }
.callout p { margin:0; }
.callout.cyan { border-color:rgba(0,229,255,.3); background:rgba(0,229,255,.05); }
mark[data-todo] { background:rgba(255,179,0,.16); color:var(--amber); padding:0 5px; border-radius:4px; border:1px dashed rgba(255,179,0,.5); font:inherit; }
.cards { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:12px; margin:8px 0 20px; }
.card { border:1px solid var(--line); background:var(--surface); border-radius:14px; padding:18px; }
.card small { display:block; font:500 9.5px/1 var(--mono); letter-spacing:.26em; text-transform:uppercase; color:var(--faint); margin-bottom:10px; }
.card b { display:block; font:600 15px/1.35 var(--disp); margin-bottom:6px; }
.card p { font-size:13.5px; margin:0; color:var(--mute); }
footer { margin-top:64px; padding-top:24px; border-top:1px solid var(--line); color:var(--faint); font:500 11px/1.8 var(--mono); letter-spacing:.14em; text-transform:uppercase; display:flex; gap:18px; flex-wrap:wrap; }
footer a { color:var(--mute); } footer a:hover { color:var(--fg); }
@media (max-width:600px) { .wrap { padding:44px 18px 80px; } h1 { font-size:2rem; } table { font-size:13px; } th, td { padding:9px 10px; } .cards { grid-template-columns:1fr; } }
