/* Static edition pages. Brand tokens match the app and the Brevo emails:
   cream ground, orange accent, heavy display weights, 2px borders. */
:root{
  --paper:#f4f0e7; --card:#fffdf7; --ink:#171717; --muted:#6e6a62;
  --accent:#ff5a36; --line:#171717;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font:17px/1.6 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  -webkit-text-size-adjust:100%;
}
header{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  flex-wrap:wrap; padding:16px 22px; border-bottom:2px solid var(--line);
}
.brand{font-weight:900; letter-spacing:.06em; text-decoration:none; color:var(--ink)}
.listen{
  text-decoration:none; font-weight:800; font-size:14px; color:#fff;
  background:var(--accent); padding:9px 14px; border-radius:10px;
}
.listen:hover{filter:brightness(.94)}
main{max-width:44rem; margin:0 auto; padding:28px 22px 64px}
.kicker{
  color:var(--accent); font-weight:900; letter-spacing:.1em;
  font-size:12px; margin:0 0 6px; text-transform:uppercase;
}
h1{font-size:clamp(30px,6vw,46px); line-height:1.05; margin:0 0 14px; letter-spacing:-.02em}
h2{font-size:22px; margin:36px 0 12px; letter-spacing:-.01em}
.lede{font-size:19px; margin:0 0 14px}
.meta{color:var(--muted); font-size:14px; margin:10px 0}
.meta a{color:var(--muted)}
a{color:var(--ink)}
audio{width:100%; margin:14px 0 4px}
ol.points{margin:0; padding-left:1.3em}
ol.points li{margin:0 0 12px; padding-left:.2em}
ol.quiz{margin:0; padding-left:1.3em}
ol.quiz>li{margin:0 0 18px}
ol.quiz p{margin:0 0 8px; font-weight:600}
ol.options{margin:0; padding-left:1.2em; color:var(--muted); font-size:15px}
dl.menu{
  margin:0; background:var(--card); border:2px solid var(--line);
  border-radius:14px; padding:16px 18px;
}
dl.menu>div{display:flex; gap:12px; padding:5px 0}
dl.menu dt{font-weight:800; min-width:5.5rem}
dl.menu dd{margin:0}
ul.shelf{list-style:none; margin:0; padding:0}
ul.shelf li{border-bottom:2px solid var(--line)}
ul.shelf a{
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
  padding:15px 2px; text-decoration:none;
}
ul.shelf a:hover{background:var(--card)}
ul.shelf strong{font-size:19px}
ul.shelf span{color:var(--muted); font-size:14px; align-self:center}
nav.more{margin-top:40px; padding-top:18px; border-top:2px solid var(--line); font-size:15px}
@media (prefers-color-scheme:dark){
  :root{--paper:#14130f; --card:#1e1c17; --ink:#f2efe6; --muted:#a49e91; --line:#3a352c}
  .listen{color:#14130f}
}