:root{--bg:#fff;--fg:#1c2530;--mut:#5b6775;--line:#d9dee5;--acc:#0b6b5d;--card:#f6f8fa;--wbg:#fff6e0;--warn:#8a5a00;--pr:#9a3412;--prbg:#fff1e6}
@media(prefers-color-scheme:dark){:root{--bg:#14181d;--fg:#e8ecf0;--mut:#9aa6b2;--line:#2b333c;--acc:#52c7b3;--card:#1c2229;--wbg:#33280f;--warn:#f0c36b;--pr:#ffb27a;--prbg:#3a2314}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.8 system-ui,"Noto Sans JP",sans-serif}
a{color:var(--acc)}
main{max-width:760px;margin:0 auto;padding:12px 16px 32px}
header.top{max-width:760px;margin:0 auto;padding:10px 16px;display:flex;flex-wrap:wrap;gap:4px 18px;align-items:center;border-bottom:1px solid var(--line)}
header.top nav{display:flex;flex-wrap:wrap;gap:0 14px}
header.top a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none}
footer{max-width:760px;margin:0 auto;padding:12px 16px 40px;color:var(--mut);font-size:14px;border-top:1px solid var(--line)}
h1{font-size:25px;line-height:1.4;margin:16px 0 8px}h2{font-size:19px;margin:22px 0 6px}h3{font-size:16px;margin:14px 0 4px}
.band{background:var(--wbg);color:var(--warn);padding:8px 16px;text-align:center;font-weight:700}
.meta{color:var(--mut);font-size:14px}.note{color:var(--mut);font-size:14px}.aud{color:var(--mut)}.rel{margin:2px 0;font-size:14px;color:var(--mut)}
ul.list,ol.rank{list-style:none;padding:0}ul.list li,ol.rank li{border-bottom:1px solid var(--line);padding:10px 0}
.fr{display:inline-block;border-radius:4px;padding:1px 8px;font-size:13px;font-weight:700;border:1px solid var(--line)}
.fr-release{background:var(--card)}.fr-edit{background:var(--card);color:var(--acc)}.fr-pr{background:var(--prbg);color:var(--pr);border-color:var(--pr)}
.banner{padding:8px 12px;border-radius:6px;background:var(--card);border:1px solid var(--line);font-weight:700}
p.banner.fr-pr,.prfoot{background:var(--prbg);color:var(--pr);border:1px solid var(--pr);padding:8px 12px;border-radius:6px;font-weight:700}
.feature{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:4px 14px 10px;margin:14px 0}
.why{margin:2px 0;font-size:14px}.ended{color:var(--mut)}
a.btn,button{background:var(--acc);color:#fff;border:0;border-radius:6px;padding:8px 14px;min-height:44px;display:inline-flex;align-items:center;text-decoration:none;font:inherit;cursor:pointer}
input,select,textarea{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:6px;background:var(--bg);color:var(--fg);max-width:100%}
img{max-width:100%;height:auto}figure{margin:14px 0}figcaption{font-size:13px;color:var(--mut)}
@media(max-width:560px){h1{font-size:22px}}