/* Shared chrome + prose styling for the legal pages (privacy, cookies, terms).
   Same design tokens as index.html's inline <style> — kept in sync manually
   since index.html's own styles stay inline (unique full-page layout, not
   reused elsewhere) while these three simpler article pages share one sheet. */
:root{
  --night:        #0a1119;
  --dusk:         #0e1720;
  --dusk-2:       #16232f;
  --panel:        #142130;
  --line:         #223347;
  --amber:        #e3a34e;
  --amber-soft:   rgba(227,163,78,.14);
  --amber-dim:    #8a6a3a;
  --teal:         #5fa8a0;
  --red:          #c9705f;
  --cream:        #ece7da;
  --muted:        #94a2b0;
  --faint:        #5c6b78;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --display: 'Space Grotesk', 'Inter', -apple-system, sans-serif;
}
*{box-sizing:border-box;}
body{
  margin:0; background:var(--night); color:var(--cream);
  font-family:var(--sans); line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--amber); text-decoration:underline; text-underline-offset:2px;}
:focus-visible{outline:2px solid var(--amber); outline-offset:3px; border-radius:3px;}
.wrap{max-width:820px; margin:0 auto; padding:0 32px;}
@media (max-width:640px){ .wrap{padding:0 22px;} }

nav.top{
  position:sticky; top:0; z-index:40;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 32px;
  background:rgba(10,17,25,.9);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.word{
  font-family:'Big Shoulders Display', sans-serif; font-weight:800;
  font-size:22px; letter-spacing:0.5px; line-height:1; text-transform:uppercase;
  color:#F4F1E6; text-decoration:none;
}
.word span{color:#E8A33D;}
nav.top a.back{font-size:14px; font-weight:500; color:var(--muted); text-decoration:none;}
nav.top a.back:hover{color:var(--cream);}

main{padding:64px 0 100px;}
main h1{
  font-family:var(--display); font-weight:600; font-size:clamp(28px,4vw,40px);
  letter-spacing:-.01em; margin:0 0 10px; color:var(--cream);
}
main .updated{font-size:13px; color:var(--faint); margin:0 0 46px;}
main h2{
  font-family:var(--display); font-weight:600; font-size:20px;
  color:var(--cream); margin:44px 0 14px; letter-spacing:-.005em;
}
main h3{font-size:15.5px; font-weight:600; color:var(--cream); margin:26px 0 8px;}
main p{color:var(--muted); font-size:15px; line-height:1.75; margin:0 0 16px;}
main ul, main ol{color:var(--muted); font-size:15px; line-height:1.75; padding-left:22px; margin:0 0 16px;}
main li{margin-bottom:6px;}
main strong{color:var(--cream); font-weight:600;}

table.cookie-table{width:100%; border-collapse:collapse; margin:20px 0 28px; font-size:13.5px;}
table.cookie-table th, table.cookie-table td{
  text-align:left; padding:10px 12px; border-bottom:1px solid var(--line); color:var(--muted); vertical-align:top;
}
table.cookie-table th{color:var(--cream); font-weight:600; font-family:var(--display); font-size:12px; letter-spacing:.03em; text-transform:uppercase;}
table.cookie-table code{color:var(--amber); font-family:ui-monospace,'SF Mono',monospace; font-size:12.5px;}

.placeholder{background:var(--amber-soft); border:1px dashed var(--amber-dim); border-radius:6px; padding:1px 6px; color:var(--amber); font-style:normal;}

.cookie-settings-btn{
  display:inline-block; margin-top:6px;
  font-family:inherit; font-size:13.5px; font-weight:600; cursor:pointer;
  padding:10px 18px; border-radius:9px; border:1px solid var(--line);
  background:transparent; color:var(--cream); text-decoration:none;
}
.cookie-settings-btn:hover{border-color:var(--muted);}

footer{
  padding:36px 0; background:var(--night); border-top:1px solid var(--line);
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px;
}
footer .f-word{font-family:var(--display); font-weight:600; letter-spacing:.1em; text-transform:uppercase; font-size:13px; color:var(--muted);}
footer .f-meta{font-size:12.5px; color:var(--faint);}
footer .f-legal{display:flex; gap:16px; flex-wrap:wrap;}
footer .f-legal a, footer .f-legal button{
  font-size:12.5px; color:var(--faint); text-decoration:none;
  background:none; border:none; padding:0; font-family:inherit; cursor:pointer;
}
footer .f-legal a:hover, footer .f-legal button:hover{color:var(--muted);}