:root{
  --bg:#ffffff;
  --text:#1f2937;
  --muted:#6b7280;
  --brand:#0ea5e9;
  --card:#f8fafc;
  --border:#e5e7eb;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Liberation Sans', sans-serif;
  background:var(--bg); color:var(--text); line-height:1.6
}
a{color:var(--brand); text-decoration:none}
a:hover{text-decoration:underline}
.header{position:sticky; top:0; z-index:10; background:#fff; border-bottom:1px solid var(--border)}
.header .inner{max-width:1000px; margin:0 auto; padding:10px 16px; display:flex; align-items:center; justify-content:space-between; gap:12px}
.logo{font-weight:800}
.nav{display:flex; gap:12px; align-items:center; flex-wrap:wrap}
.dropdown{position:relative}
.dropdown > a{display:inline-flex; gap:6px; align-items:center; padding:6px 8px; border-radius:8px}
.dropdown .menu{
  position:absolute; top:calc(100% + 4px); right:0; left:auto;
  background:#fff; border:1px solid var(--border); border-radius:10px; min-width:220px; max-width:min(420px, calc(100vw - 24px));
  box-shadow:0 6px 24px rgba(16,24,40,.08); padding:6px; display:none; max-height:60vh; overflow:auto
}
.dropdown:hover .menu{display:block}
.dropdown .menu a, .dropdown .menu span{display:block; padding:8px 10px; white-space:normal; overflow-wrap:anywhere}
.wrap{max-width:1000px; margin:0 auto; padding:18px 16px}
.footer{max-width:1000px; margin:24px auto; padding:16px; color:var(--muted); border-top:1px solid var(--border)}
.cards{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px,1fr)); gap:14px; margin:12px 0}
.card{background:var(--card); border:1px solid var(--border); border-radius:12px; padding:12px}
.card img{width:100%; height:auto; border-radius:10px; display:block}
.title{margin:6px 0}
.caption{color:var(--muted); font-size:.95rem}
.btn{display:inline-block; background:var(--brand); color:#fff; border:none; padding:8px 12px; border-radius:8px; cursor:pointer}
.btn:hover{opacity:.9; text-decoration:none}
.spacer{height:8px}
.edition-title{font-weight:800; margin:12px 0 8px}
.hero{background:linear-gradient(180deg,#f7fbff,transparent); border:1px solid var(--border); border-radius:16px; padding:18px}
.grid{display:grid; gap:16px}
.grid-2{grid-template-columns:1fr 1fr}
@media (max-width: 820px){ .grid-2{grid-template-columns:1fr} }
.figure{border-radius:12px; background:#f3f4f6; padding:10px; border:1px solid var(--border)}
blockquote{border-left:4px solid var(--brand); margin:12px 0; padding:6px 12px; background:#f0f9ff; border-radius:6px}