/* ---- JetBrains Mono : shared with the landing page ---- */
@font-face { font-family:'JetBrains Mono'; font-style:normal; font-weight:400; font-display:swap; src:url('/assets/fonts/JetBrainsMono-Regular.ttf') format('truetype'); }
@font-face { font-family:'JetBrains Mono'; font-style:normal; font-weight:500; font-display:swap; src:url('/assets/fonts/JetBrainsMono-Medium.ttf') format('truetype'); }
@font-face { font-family:'JetBrains Mono'; font-style:normal; font-weight:600; font-display:swap; src:url('/assets/fonts/JetBrainsMono-SemiBold.ttf') format('truetype'); }
@font-face { font-family:'JetBrains Mono'; font-style:normal; font-weight:700; font-display:swap; src:url('/assets/fonts/JetBrainsMono-Bold.ttf') format('truetype'); }

:root{
  --bg:#0a0b10;
  --bg-1:#12141f;
  --bg-2:#191c2a;
  --bg-3:#212436;
  --line:rgba(198,202,245,0.10);
  --line-soft:rgba(198,202,245,0.05);
  --line-strong:rgba(205,213,255,0.18);

  --fg:#ECE3D2;
  --fg-soft:#8b8fb0;
  --fg-faint:#454a66;

  --green:#9ece6a;
  --blue:#7aa2f7;
  --red:#f7768e;
  --amber:#e0af68;

  --green-glow:rgba(158,206,106,0.35);

  --mono:'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --maxw:1240px;
  --legalw:760px;

  --nav-top:18px;
  --wrap-px:32px;
  --section-py:80px;
  --stack-gap:28px;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--mono);
  background:var(--bg);
  color:var(--fg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  line-height:1.7;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed; inset:0;
  background-image:
    linear-gradient(to right, var(--line-soft) 1px, transparent 1px),
    linear-gradient(to bottom, var(--line-soft) 1px, transparent 1px);
  background-size:48px 48px;
  pointer-events:none;
  z-index:0;
  mask-image:radial-gradient(ellipse 90% 60% at 50% 0%, #000 30%, transparent 75%);
}
a{ color:inherit; text-decoration:none; }
::selection{ background:rgba(158,206,106,0.28); color:var(--bg); }

a:focus-visible, button:focus-visible{ outline:2px solid var(--green); outline-offset:3px; border-radius:2px; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 var(--wrap-px); position:relative; z-index:1; }

/* ===================== NAV ===================== */
nav{ position:fixed; top:18px; left:0; right:0; z-index:50; display:flex; justify-content:center; padding:0 20px; }
.nav-inner{
  width:100%; max-width:920px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  background:rgba(10,11,16,0.86);
  border:1px solid var(--line);
  border-radius:10px;
  padding:9px 14px;
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  box-shadow:0 12px 32px -18px rgba(0,0,0,0.7);
}
.nav-dots{ display:flex; gap:6px; margin-right:4px; }
.nav-dots span{ width:9px; height:9px; border-radius:50%; }
.brand{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:14.5px; letter-spacing:-0.01em; }
.brand img{ width:24px; height:24px; border-radius:6px; display:block; }
.nav-links{ display:flex; align-items:center; gap:24px; font-size:13px; color:var(--fg-soft); }
.nav-links a{ transition:color .15s ease; }
.nav-links a::before{ content:"~/"; color:var(--fg-faint); }
.nav-links a:hover{ color:var(--green); }
.nav-links a.current{ color:var(--green); }
.nav-cta{
  font-size:13px; font-weight:700;
  padding:9px 18px; border-radius:6px;
  background:var(--green); color:var(--bg);
  border:1px solid var(--green);
  transition:background .2s ease, transform .15s ease, box-shadow .2s ease;
}
.nav-cta:hover{ background:var(--bg); color:var(--green); transform:translateY(-1px); box-shadow:0 0 18px var(--green-glow); }
.nav-cta::before{ content:"$ "; opacity:0.6; }

/* ===================== LEGAL LAYOUT ===================== */
main{ position:relative; z-index:1; }
.legal-hero{ padding-top:calc(var(--nav-top) + 52px + var(--section-py)); padding-bottom:40px; }
.legal-hero .wrap{ max-width:var(--legalw); }
.sec-kicker{ font-size:13px; color:var(--green); letter-spacing:0.04em; margin-bottom:14px; font-weight:600; }
.sec-kicker::before{ content:"// "; color:var(--fg-faint); }
.legal-hero h1{ font-family:var(--mono); font-size:clamp(32px,5.5vw,52px); line-height:1.2; font-weight:700; letter-spacing:-0.01em; color:var(--fg); margin-bottom:14px; }
.legal-date{ font-size:13px; color:var(--fg-faint); }
.legal-date::before{ content:"# "; }

.legal-body{ padding-bottom:var(--section-py); }
.legal-body .wrap{ max-width:var(--legalw); }

/* ---- callouts ---- */
.callout{
  background:var(--bg-1);
  border:1px solid var(--line);
  border-left:3px solid var(--green);
  border-radius:0 8px 8px 0;
  padding:20px 24px;
  margin:0 0 40px;
}
.callout.warn{ border-left-color:var(--amber); }
.callout-label{ font-size:11px; color:var(--green); letter-spacing:1.5px; text-transform:uppercase; margin-bottom:10px; display:block; font-weight:700; }
.callout.warn .callout-label{ color:var(--amber); }
.callout p{ font-size:14.5px; color:var(--fg); line-height:1.75; margin:0; }

/* ---- table of contents ---- */
.win{ background:var(--bg-1); border:1px solid var(--line); border-radius:10px; overflow:hidden; margin-bottom:48px; }
.win-bar{ display:flex; align-items:center; gap:8px; padding:13px 16px; background:var(--bg-2); border-bottom:1px solid var(--line); }
.win-bar .wdot{ width:11px; height:11px; border-radius:50%; }
.win-bar .win-title{ margin-left:10px; font-size:12px; color:var(--fg-soft); }
.toc{ padding:8px 0; }
.toc ol{ list-style:none; counter-reset:toc; }
.toc ol li{ counter-increment:toc; border-top:1px dashed var(--line); }
.toc ol li:first-child{ border-top:none; }
.toc ol li a{
  display:flex; align-items:center; gap:12px;
  padding:11px 24px; font-size:13.5px; color:var(--fg-soft);
  transition:color .15s ease;
}
.toc ol li a::before{ content:counter(toc, decimal-leading-zero); color:var(--fg-faint); font-size:12px; min-width:20px; }
.toc ol li a:hover{ color:var(--green); }

/* ---- sections ---- */
.section{ margin-bottom:52px; }
.section-number{ font-size:11px; color:var(--fg-faint); letter-spacing:2px; text-transform:uppercase; margin-bottom:10px; display:block; }
h2{ font-family:var(--mono); font-size:22px; font-weight:700; color:var(--fg); margin-bottom:18px; letter-spacing:-0.01em; }
h2::before{ content:"// "; color:var(--fg-faint); font-weight:400; }
h3{ font-size:14.5px; font-weight:700; color:var(--fg); margin:24px 0 12px; }
p{ color:var(--fg-soft); margin-bottom:16px; font-size:14.5px; line-height:1.8; }
p:last-child{ margin-bottom:0; }
strong{ color:var(--fg); font-weight:600; }

.divider{ border:none; border-top:1px solid var(--line); margin:48px 0; }

/* ---- lists ---- */
ul.check-list{ list-style:none; margin:16px 0; }
ul.check-list li{ font-size:13px; color:var(--fg-soft); padding:9px 0; padding-left:24px; position:relative; border-top:1px dashed var(--line); }
ul.check-list li:first-child{ border-top:none; }
ul.check-list li::before{ content:'✓'; position:absolute; left:0; color:var(--green); font-size:12px; font-weight:700; }

ul.plain-list{ list-style:none; margin:16px 0; }
ul.plain-list li{ font-size:14.5px; color:var(--fg-soft); padding:5px 0 5px 22px; position:relative; line-height:1.7; }
ul.plain-list li::before{ content:'›'; position:absolute; left:0; color:var(--green); }

/* ---- inline code / path blocks ---- */
code{ font-family:var(--mono); font-size:13px; color:var(--green); background:rgba(158,206,106,0.08); border:1px solid rgba(158,206,106,0.15); padding:1px 6px; border-radius:4px; }
.path-block{ padding:6px 0; }
.path-block code{
  display:block; background:none; border:none; border-radius:0;
  color:var(--green); font-size:13px; padding:7px 24px; line-height:1.9;
  border-top:1px dashed var(--line);
}
.path-block code:first-child{ border-top:none; }
.path-block code .comment{ color:var(--fg-faint); }

/* ---- license cards ---- */
.license-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:20px 0; }
.license-card{ background:var(--bg-1); border:1px solid var(--line); border-radius:10px; padding:20px; }
.license-card-title{ font-size:12px; color:var(--green); letter-spacing:1px; text-transform:uppercase; margin-bottom:10px; display:block; font-weight:700; }
.license-card p{ font-size:13px; margin:0; color:var(--fg-soft); }

/* ---- services table ---- */
.services-table{ width:100%; border-collapse:collapse; margin:20px 0; font-size:13.5px; }
.services-table th{ font-size:11px; color:var(--fg-faint); letter-spacing:1px; text-transform:uppercase; text-align:left; padding:10px 0; border-bottom:1px solid var(--line); font-weight:600; }
.services-table td{ padding:12px 0; color:var(--fg-soft); border-bottom:1px dashed var(--line); vertical-align:top; }
.services-table tr:last-child td{ border-bottom:none; }
.services-table td:first-child{ color:var(--fg); white-space:nowrap; padding-right:16px; font-weight:600; }
.services-table a{ color:var(--green); }
.services-table a:hover{ text-shadow:0 0 10px var(--green-glow); }

/* ---- contact box ---- */
.contact-box{ display:flex; align-items:center; gap:18px; }
.contact-box-icon{ font-size:18px; color:var(--green); flex-shrink:0; padding-left:24px; }
.contact-box .rows{ padding:10px 24px 18px 0; }
.contact-box p{ margin:0 0 4px; font-size:13.5px; color:var(--fg-soft); }
.contact-box a{ color:var(--green); }
.contact-box a:hover{ text-shadow:0 0 10px var(--green-glow); }

/* ---- disclaimer ---- */
.disclaimer{ margin-top:48px; text-align:center; }
.disclaimer p{ font-size:12px; color:var(--fg-faint); line-height:1.7; }

/* ===================== FOOTER ===================== */
footer{ border-top:1px solid var(--line); padding:0; position:relative; z-index:1; }
.foot-inner{ display:flex; align-items:center; justify-content:space-between; gap:var(--stack-gap); flex-wrap:wrap; padding-block:calc(var(--section-py) * 0.65); }
.foot-left{ display:flex; align-items:center; gap:14px; }
.foot-left img{ width:22px; height:22px; border-radius:6px; }
.foot-left .name{ font-size:14px; font-weight:700; }
.foot-links{ display:flex; gap:22px; font-size:13px; color:var(--fg-soft); }
.foot-links a::before{ content:"~/"; color:var(--fg-faint); }
.foot-links a:hover{ color:var(--green); }
.foot-links a.current{ color:var(--green); }
.foot-tag{ font-size:13px; color:var(--fg-faint); }
.statusbar{ display:flex; align-items:center; justify-content:space-between; gap:18px; padding:11px 0; border-top:1px solid var(--line); font-size:11.5px; color:var(--fg-faint); flex-wrap:wrap; }
.statusbar .ok{ color:var(--green); }
.statusbar .ok::before{ content:"● "; }

/* ===================== RESPONSIVE ===================== */
@media (max-width:880px){
  :root{ --section-py:64px; --wrap-px:24px; }
  .nav-links{ display:none; }
  .nav-inner{ max-width:100%; }
}

@media (max-width:560px){
  :root{ --section-py:48px; --wrap-px:18px; --nav-top:12px; }
  nav{ padding:0 12px; }
  .nav-inner{ padding:8px 10px; gap:12px; }
  .nav-dots{ display:none; }
  .brand{ font-size:13px; }
  .legal-hero h1{ font-size:clamp(26px,8vw,38px); }
  .license-grid{ grid-template-columns:1fr; }
  .toc ol li a{ padding:10px 16px; }
  .contact-box{ flex-direction:column; align-items:flex-start; gap:8px; }
  .contact-box-icon{ padding-left:16px; }
  .contact-box .rows{ padding:0 16px 16px; }
  .foot-inner{ flex-direction:column; align-items:flex-start; gap:16px; }
  .foot-links{ flex-wrap:wrap; gap:14px; font-size:12px; }
  .statusbar{ flex-direction:column; align-items:flex-start; gap:6px; font-size:11px; }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
}
