:root{color-scheme:light;--green:#203e35;--gold:#a18040;--cream:#f7f4ec;--line:#e2dbcc}*{box-sizing:border-box}body{margin:0;color:var(--green);background:var(--cream);font:18px/1.8 "Microsoft YaHei",sans-serif}header{background:var(--green);color:#fff;padding:14px max(18px,calc((100vw - 1200px)/2));display:flex;align-items:center;gap:24px;justify-content:space-between;flex-wrap:wrap}a{color:inherit;overflow-wrap:anywhere}header a{text-decoration:none}header nav{display:flex;gap:18px;flex-wrap:wrap}.brand{display:flex;align-items:center;gap:12px;font-size:24px;font-weight:bold}.brand img{width:48px;height:48px;border-radius:50%}main{max-width:1200px;margin:auto;padding:28px 20px}h1{font-size:clamp(25px,4vw,36px);line-height:1.5;overflow-wrap:anywhere}h2{font-size:23px;line-height:1.55}.hint{color:#697469;font-size:15px}.notice{padding:12px;border-left:4px solid var(--gold);background:#eee7d7}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:20px}.card,.album{background:#fffdf8;border:1px solid var(--line);border-radius:16px;overflow:hidden}.album{padding:24px;text-decoration:none}.card>div{padding:20px}.card img,.cover{width:100%;aspect-ratio:16/9;object-fit:cover}.cover{display:grid;place-items:center;background:#eae4d4;color:var(--gold)}.player-frame{aspect-ratio:16/9;width:100%;background:#142720;border-radius:12px;overflow:hidden}.player-frame video,.player-frame iframe{display:block;width:100%;height:100%;border:0}.player-frame [hidden]{display:none}button,.button{font:inherit;padding:9px 16px;border:1px solid #c9c0aa;border-radius:10px;background:#fffdf8;color:var(--green);cursor:pointer;text-decoration:none}.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:18px 0}.toolbar label{white-space:nowrap}input[type=range]{width:100%;accent-color:var(--gold);height:30px}details{margin-top:24px;padding:16px;background:#fffdf8;border:1px solid var(--line);border-radius:10px}details li{padding:7px}a[aria-current=page]{font-weight:bold;color:var(--gold)}footer{text-align:center;padding:32px;font-size:14px;color:#697469}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #b9964a;outline-offset:2px}@media(max-width:520px){body{font-size:17px}main{padding:18px 12px}header{padding:12px}.brand img{width:40px;height:40px}.brand{font-size:22px}.toolbar button,.toolbar .button{padding:8px 12px}}
/* Long source addresses and credits must wrap on narrow screens. */
main,main p,main a,main h1,main h2{overflow-wrap:anywhere;min-width:0}
