/* 構造だけを持つ共通CSS。色・書体・質感は themes/*.css が決める */
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--bg); color:var(--text); font-family:var(--font-body); line-height:1.8; }
a { color:inherit; }
img { max-width:100%; display:block; }
.wrap { max-width:1080px; margin:0 auto; padding:0 16px; }
header.site .wrap { display:flex; align-items:center; justify-content:space-between; gap:16px; }
header.site nav { display:flex; gap:18px; font-size:.82rem; }
header.site nav a { text-decoration:none; color:var(--muted); }
.brand { text-decoration:none; }
.pr { display:inline-block; font-size:.7rem; color:var(--muted); margin:14px 0 0; }
.hero { padding:40px 0 28px; }
.eyebrow { margin:0 0 10px; font-size:.75rem; color:var(--muted); }
h1, h2 { font-family:var(--font-head); font-weight:var(--head-weight, 600); }
h1 { line-height:1.35; margin:.3em 0; }
.lead { color:var(--muted); }
.moments { list-style:none; padding:0; margin:0; }
.moments a { display:grid; grid-template-columns:auto 1fr; column-gap:16px; text-decoration:none; }
.moments .m-no { grid-row:span 2; }
.moments small { color:var(--muted); }
.grid { display:grid; gap:var(--gap, 20px); grid-template-columns:repeat(auto-fill, minmax(var(--card-min, 240px), 1fr)); }
.card { display:flex; flex-direction:column; gap:4px; position:relative; }
.cover { aspect-ratio:var(--cover-ratio, 4/3); display:flex; flex-direction:column; justify-content:flex-end; padding:12px; overflow:hidden; }
.cover img { width:100%; height:100%; object-fit:cover; margin:-12px; width:calc(100% + 24px); height:calc(100% + 24px); }
.no { display:none; }
.badges { min-height:0; display:flex; gap:6px; flex-wrap:wrap; }
.badge { font-size:.68rem; }
.title { font-weight:600; line-height:1.5; }
.meta { color:var(--muted); font-size:.78rem; }
.price { font-weight:600; }
.price .was { color:var(--muted); text-decoration:line-through; font-weight:400; margin-left:.5em; font-size:.82rem; }
.spark { width:100%; height:28px; color:var(--muted); }
.btn { text-decoration:none; text-align:center; margin-top:auto; }
footer.site { margin-top:72px; padding:28px 0 48px; font-size:.75rem; color:var(--muted); }
footer.site a { margin-right:1.2em; color:var(--muted); }
#age-gate { position:fixed; inset:0; z-index:10; display:none; align-items:center; justify-content:center; padding:16px; background:var(--gate-bg); }
#age-gate .box { max-width:440px; text-align:center; padding:32px 24px; }
#age-gate button { font:inherit; cursor:pointer; margin:6px; padding:12px 20px; }
@media (max-width:640px) { header.site nav { display:none; } }
