/* Shared styles for the homepage, policy pages and 404: white graph paper, ink lines, sketchy buttons. */
:root{
  color-scheme:light;
  --paper:#ffffff; --grid:#eef2f8; --ink:#1f2a44; --muted:#5b6985; --panel:#ffffff; --line:#c3cfe0;
  --sun:#ffd84d; --rose:#f08fa8; --link:#2456c9;
  --hand:"Gaegu","Comic Sans MS",cursive; --ui:"Kalam",cursive;
  --body:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --wob:255px 15px 225px 15px/15px 225px 15px 255px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;color:var(--ink);font:18px/1.55 var(--ui);background-color:var(--paper);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:28px 28px}
a{color:inherit}
:focus-visible{outline:3px solid var(--link);outline-offset:3px;border-radius:6px}
.wrap{width:min(1120px,100% - 32px);margin:0 auto}
.skip{position:absolute;left:-999px;top:8px;background:var(--panel);padding:8px 12px;border:2px solid var(--ink);z-index:9}
.skip:focus{left:8px}

.site-nav{display:flex;align-items:center;gap:18px;padding:18px 0}
.brand{font:700 34px/1 var(--hand);letter-spacing:.5px;text-decoration:none}
.brand span{background:linear-gradient(transparent 55%,var(--sun) 55% 88%,transparent 88%)}
.site-nav .links{margin-left:auto;display:flex;gap:18px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.site-nav .links a:not(.btn){text-decoration:none;color:var(--muted)}
.site-nav .links a:not(.btn):hover{color:var(--ink);text-decoration:underline}

.btn{display:inline-block;font:20px var(--ui);color:var(--ink);background:var(--panel);border:2px solid var(--ink);border-radius:var(--wob);padding:8px 20px;text-decoration:none;box-shadow:3px 4px 0 var(--ink);transition:transform .12s,box-shadow .12s}
.btn:hover{transform:translate(-1px,-2px);box-shadow:4px 6px 0 var(--ink)}
.btn.go{background:var(--sun)}
.btn.small{font-size:16px;padding:4px 14px;box-shadow:2px 3px 0 var(--ink)}
@media (prefers-reduced-motion:reduce){.btn{transition:none}.btn:hover{transform:none}}

h1,h2,h3{font-family:var(--hand);text-wrap:balance}

.site-foot{border-top:1.5px dashed var(--line);margin-top:60px;padding:24px 0 40px;color:var(--muted);display:flex;gap:10px 22px;flex-wrap:wrap;font-size:16px}
.site-foot a{text-decoration:none}
.site-foot a:hover{color:var(--ink);text-decoration:underline}
.site-foot .spacer{flex:1}

/* Policy pages: one comfortable reading column on a white card. */
.doc{background:var(--panel);border:2px solid var(--ink);border-radius:18px 12px 20px 14px;box-shadow:4px 6px 0 var(--ink);padding:clamp(20px,5vw,48px);margin:20px auto 0;max-width:820px;font:17px/1.65 var(--body)}
.doc h1{font-size:clamp(40px,7vw,58px);line-height:1;margin:0 0 6px}
.doc .updated{color:var(--muted);margin:0 0 26px;font-size:15px}
.doc h2{font-size:30px;line-height:1.1;margin:34px 0 8px}
.doc h3{font-size:23px;margin:22px 0 4px}
.doc p,.doc ul{margin:0 0 14px}
.doc ul{padding-left:22px}
.doc li{margin:4px 0}
.doc a{color:var(--link)}
.doc .summary{background:#fffbe3;border:1.5px solid #e9c83f;border-radius:12px;padding:14px 18px;margin:0 0 20px}
.doc .summary ul{margin:6px 0 0}
.doc table{border-collapse:collapse;width:100%;font-size:15.5px;margin:6px 0 16px}
.doc th,.doc td{text-align:left;padding:8px 10px;border-bottom:1.5px solid var(--line);vertical-align:top}
.doc th{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.doc .tablewrap{overflow-x:auto}

@media (max-width:640px){
  .site-nav{flex-wrap:wrap;gap:10px}
  .site-nav .links{gap:12px;font-size:16px}
  .site-nav .links .hide{display:none}
  .brand{font-size:30px}
}
