:root { color-scheme: dark; --paper:#eee6df; --muted:#bcb0bd; --gold:#e6cba5; --line:#62516e; --panel:#201825; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#130f19; color:var(--paper); font-family:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN",serif; line-height:1.9; }
a { color:var(--gold); text-underline-offset: .25em; }
a:focus-visible,summary:focus-visible { outline:3px solid var(--gold); outline-offset:5px; }
.skip { position:absolute; left:1rem; top:-5rem; z-index:5; }.skip:focus { top:1rem; }
.preview { text-align:center; font: .85rem/1.5 sans-serif; padding:.65rem; background:#473441; }
.hero { max-width:1000px; margin:auto; text-align:center; padding:3.5rem 1.5rem 3rem; }
.eyebrow { color:var(--gold); font-size:.85rem; letter-spacing:.15em; }
.logo { display:block; width:min(580px,90%); height:210px; object-fit:contain; margin:1rem auto; }
h1 { font-size:clamp(1.6rem,4vw,2.8rem); line-height:1.7; letter-spacing:.12em; font-weight:500; }
.tagline { margin:1.5rem 0 2rem; font-size:1.1rem; }.mobile { display:none; }
.button { display:inline-block; padding:.7rem 1.5rem; border:1px solid var(--gold); border-radius:3px; background:#342735; color:#f8e5c9; text-decoration:none; }
.button:hover { background:#50364d; }
main { max-width:940px; margin:auto; padding:0 1.5rem; }
.intro { text-align:center; padding:0 0 3rem; }
.card { background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:2rem; margin:2rem 0; scroll-margin-top:2rem; }
h2 { font-size:1.5rem; font-weight:500; margin:.4rem 0 1rem; }.actions { display:flex; align-items:center; flex-wrap:wrap; gap:1.4rem; }
.muted,figcaption { color:var(--muted); font-size:.9rem; }.hash { overflow-wrap:anywhere; font: .8rem/1.7 monospace; }
.visual { margin:3rem 0; }.visual img { display:block; width:100%; height:auto; border-radius:4px; }.visual figcaption { margin-top:.8rem; }
.credits { text-align:center; padding:2rem 0; }.credits p { margin:.3rem 0; }
details { margin-top:1rem; }summary { cursor:pointer; color:var(--gold); }.notice { color:var(--muted); font-size:.85rem; padding:1.4rem 0 2rem; border-top:1px solid var(--line); }
footer { text-align:center; color:var(--muted); padding:2rem 1rem; font-size:.85rem; border-top:1px solid var(--line); }
@media(max-width:600px) { .hero { padding-top:2rem; }.logo { height:150px; }main { padding:0 1rem; }.card { padding:1.3rem; }.mobile { display:block; }.intro { text-align:left; }.intro br { display:none; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }