/* Shared styles for every page.
   Direction: printed paper + ink. Warm off-white ground, near-black ink, hard 2px rules,
   square corners, offset shadows, serif display type with mono labels. Lime (from the logo)
   is used only as a highlighter; deep green is for text on paper.
   --accent is for filled buttons (ink text on it); --brand is for green text on the page. */
:root{
  --bg:#EDE9DC;--card:#F8F5EC;--fg:#16140F;--muted:#5C574A;--line:#16140F;--soft:#CFC9B6;
  --brand:#17602F;--accent:#C4F135;--accent2:#D9FF6A;--on-accent:#16140F;--navy:#16140F;--err:#B42318;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;
  --shadow:5px 5px 0 var(--line);
}
@media(prefers-color-scheme:dark){:root{
  --bg:#14120E;--card:#1D1A14;--fg:#EDE9DC;--muted:#A39D8B;--line:#EDE9DC;--soft:#3A362B;
  --brand:#C4F135;--navy:#EDE9DC;--err:#FF7B6B;
}}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--serif);font-size:17px;background:var(--bg);color:var(--fg);line-height:1.65;
  background-image:radial-gradient(var(--soft) 1px,transparent 1px);background-size:22px 22px}
a{color:var(--fg);text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-color:var(--accent)}
a:hover{background:var(--accent);color:#16140F;text-decoration:none}
code{font-family:var(--mono);font-size:.88em;background:var(--accent);color:#16140F;padding:1px 5px}
::selection{background:var(--accent);color:#16140F}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}

/* header: a masthead with a thick rule */
.site-header{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;padding:22px 0 12px;border-bottom:3px solid var(--line);flex-wrap:wrap}
.logo,.logo:hover{font-family:var(--mono);font-weight:700;font-size:18px;letter-spacing:-.02em;color:var(--fg);display:flex;align-items:center;gap:10px;text-decoration:none;background:none}
.logo img{display:block}
.site-header nav{display:flex;align-items:center;gap:6px 22px;flex-wrap:wrap;font-family:var(--mono);font-size:13px}
.site-header nav a{color:var(--fg);text-decoration:none;padding:2px 0;border-bottom:2px solid transparent;background:none}
.site-header nav a:hover{background:none;border-color:var(--fg)}
.site-header nav a.on{border-color:var(--fg);background:var(--accent);color:#16140F;padding:2px 6px}
select{background:var(--card);color:var(--fg);border:2px solid var(--line);border-radius:0;padding:2px 6px;font:inherit;font-family:var(--mono);font-size:13px}

h1,h2,h3{font-family:var(--serif);font-weight:700;letter-spacing:-.02em}
h1{font-size:clamp(38px,7vw,76px);line-height:1;margin:0 0 16px}
h2{font-size:clamp(26px,3.6vw,36px);line-height:1.1;margin:0 0 16px}
.sub{color:var(--muted);margin:0 0 24px;font-size:19px;max-width:56ch}
section{margin:84px 0}
.box{background:var(--card);border:2px solid var(--line);border-radius:0;padding:20px;box-shadow:var(--shadow)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border:2px solid var(--line);border-radius:0;background:var(--accent);color:var(--on-accent);font:700 14px var(--mono);text-decoration:none;cursor:pointer;box-shadow:4px 4px 0 var(--line);transition:transform .08s,box-shadow .08s}
.btn:hover{background:var(--accent2);color:var(--on-accent);transform:translate(2px,2px);box-shadow:2px 2px 0 var(--line)}
.btn[aria-disabled=true]{opacity:.6;cursor:default;pointer-events:none;box-shadow:none}
.btn.ghost{background:transparent;color:var(--fg)}
.btn.ghost:hover{background:var(--card);color:var(--fg)}
.tag{display:inline-block;font:700 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;background:var(--fg);color:var(--bg)}

/* section labels: "§ 01"-style counters on h2 inside numbered sections */
main,.wrap{counter-reset:sec}
section>h2::before{counter-increment:sec;content:"§ 0" counter(sec);display:block;font:700 13px var(--mono);letter-spacing:.1em;color:var(--brand);margin-bottom:6px}

/* Long-form text (about + legal pages) */
.doc{max-width:720px;margin:40px 0 0}
.doc h1{font-size:clamp(34px,5vw,54px);margin-bottom:8px}
.doc .meta{color:var(--muted);font:13px var(--mono);margin-bottom:32px;padding-bottom:16px;border-bottom:2px solid var(--line)}
.doc h2{font-size:24px;margin:40px 0 8px;padding-top:12px;border-top:1px solid var(--soft)}
.doc h2::before{content:none}
.doc p,.doc li{color:var(--fg)}
.doc ul{padding-left:22px}
.doc .note{background:var(--card);border:2px solid var(--line);border-left:10px solid var(--accent);padding:12px 16px;color:var(--muted);font-size:15px}
.doc .box{box-shadow:3px 3px 0 var(--line)}
.doc table{width:100%;border-collapse:collapse;font-size:15px}
.doc th,.doc td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.doc th{background:var(--card);font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.05em}

.site-footer{border-top:3px solid var(--line);margin-top:96px;padding:24px 0 48px;color:var(--muted);font:13px/1.6 var(--mono)}
.site-footer .links{display:flex;flex-wrap:wrap;gap:8px 22px;margin-bottom:14px}
.site-footer .links a{color:var(--fg)}
.site-footer p{margin:6px 0;max-width:80ch}

[data-lang]:not(.lang-on){display:none!important}
@media(max-width:560px){body{font-size:16px}section{margin:60px 0}.site-header{align-items:flex-start}}