:root{--paper: #ede9e4;--paper-2: #dcd7d1;--ink: #0b0b0c;--white: #ffffff;--line: 5px;--line-2: 3px;--offset: 8px;--shadow: var(--offset) var(--offset) 0 var(--ink);--shadow-sm: 4px 4px 0 var(--ink);--shadow-press: 1px 1px 0 var(--ink);--shadow-brand: var(--offset) var(--offset) 0 var(--brand);--radius: 0px;--shade: var(--brand-deep);--rim: var(--brand-soft);--font-display: "Smiley Sans", "得意黑", "Noto Sans SC", "Microsoft YaHei UI", system-ui, sans-serif;--font-body: "Noto Sans SC", "Microsoft YaHei UI", system-ui, sans-serif;--gap: 18px;--maxw: 1200px}:root,[data-theme=pink]{--brand: #e8007c;--brand-deep: #77104b;--brand-soft: #ffb9d9;--on-brand: #ffffff}[data-theme=acid]{--brand: #d9ff00;--brand-deep: #5f6b00;--brand-soft: #f0ffa0;--on-brand: #0b0b0c}[data-theme=cyan]{--brand: #00b8f0;--brand-deep: #00506e;--brand-soft: #a6e9ff;--on-brand: #0b0b0c}[data-theme=ember]{--brand: #ff5a00;--brand-deep: #7a2a00;--brand-soft: #ffc29e;--on-brand: #ffffff}[data-theme=violet]{--brand: #8a3fbe;--brand-deep: #3a1a4d;--brand-soft: #e8b9ff;--on-brand: #ffffff}[data-theme=navy]{--brand: #4a4f80;--brand-deep: #1a1924;--brand-soft: #c6cbe8;--on-brand: #ffffff}[data-theme=lime]{--brand: #7cb529;--brand-deep: #17411b;--brand-soft: #dcf29a;--on-brand: #ffffff}[data-theme=gold]{--brand: #fdef55;--brand-deep: #4c390f;--brand-soft: #fdfda2;--on-brand: #1c2653}[data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .22s steps(4,end),transform .22s steps(4,end)}[data-reveal].in{opacity:1;transform:none}.band-track{display:inline-block;white-space:nowrap;animation:band-slide 26s linear infinite;will-change:transform}.band:hover .band-track{animation-play-state:paused}@keyframes band-slide{0%{transform:translate(0)}to{transform:translate(-50%)}}.about{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;align-items:center}.about .emblem{justify-self:center;width:100%;max-width:300px}.about .emblem svg{width:100%;height:auto;display:block;filter:drop-shadow(8px 8px 0 var(--ink))}.about h2{margin-top:0}.about p{color:#3c3c40;max-width:46ch}.card .hint{display:block;margin:10px 16px 14px;font-size:11px;font-weight:800;color:var(--card-brand, var(--brand));letter-spacing:.5px}@media(prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none;transition:none}.band-track{animation:none}.hero-art,.btn,.card{transition:none}}@media(max-width:760px){.about{grid-template-columns:1fr;gap:24px}.about .emblem{max-width:200px}}.card{display:block}.card .portrait{display:block;width:100%;aspect-ratio:3 / 4;object-fit:cover;object-position:top center;background:var(--brand-soft);border-bottom:var(--line) solid var(--ink)}.card .thumb-big{aspect-ratio:3 / 4;display:flex;align-items:center;justify-content:center;background:var(--brand-soft);color:var(--brand-deep);border:var(--line) solid var(--ink);box-shadow:var(--shadow);font-family:var(--font-display);font-weight:900;letter-spacing:2px}.dim{color:#55555a}.small{font-size:12.5px}.about .note{font-size:12.5px;color:var(--muted);margin-top:14px}.about .note b{color:var(--brand)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background-color:var(--paper);background-image:radial-gradient(rgba(11,11,12,.07) 1px,transparent 1.2px);background-size:5px 5px;color:var(--ink);font-family:var(--font-body);line-height:1.6;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{max-width:100%}.topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--gap);padding:14px 20px;border-bottom:var(--line) solid var(--ink);background:var(--paper);position:sticky;top:0;z-index:20}.brand{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:900;font-size:19px;letter-spacing:1px;text-transform:uppercase;background:var(--white);color:var(--ink);padding:4px 14px;border:var(--line) solid var(--ink);box-shadow:var(--shadow-sm)}.brand svg{flex:none}.topbar nav{display:flex;gap:20px;font-weight:800;font-size:14px}.topbar nav a{border-bottom:var(--line-2) solid transparent;padding-bottom:1px}.topbar nav a:hover{border-bottom-color:var(--brand);color:var(--brand-deep)}main{max-width:var(--maxw);margin:0 auto;padding:0 20px 90px}.swatchbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:16px 0;border-bottom:var(--line-2) solid var(--ink)}.swatchbar .lbl{font-family:var(--font-display);font-weight:900;font-size:12px;letter-spacing:2px;text-transform:uppercase}.swatch{width:30px;height:30px;padding:0;cursor:pointer;border:var(--line-2) solid var(--ink);background:var(--c, #fff);box-shadow:3px 3px 0 var(--ink);transition:transform .1s ease}.swatch:hover{transform:translate(-2px,-2px)}.swatch[aria-pressed=true]{outline:var(--line-2) solid var(--ink);outline-offset:3px}.hero{display:grid;grid-template-columns:1.12fr .88fr;gap:36px;align-items:center;padding:44px 0 60px;border-bottom:var(--line) solid var(--ink)}.hero h1{font-family:var(--font-display);font-weight:900;font-size:clamp(30px,6vw,76px);line-height:.98;margin:0 0 22px;letter-spacing:-.5px;word-break:keep-all;text-shadow:7px 7px 0 var(--brand)}.hero h1 em{font-style:normal;display:inline-block;background:var(--brand);color:var(--on-brand);padding:0 12px 4px;border:var(--line) solid var(--ink);box-shadow:var(--shadow-sm);transform:rotate(-1.5deg)}.hero p{max-width:44ch;font-size:16px;color:#3c3c40;font-weight:500}.btns{display:flex;gap:14px;margin-top:28px;flex-wrap:wrap}.btn{font-family:var(--font-display);font-weight:900;font-size:15px;letter-spacing:.5px;padding:12px 24px;border:var(--line) solid var(--ink);background:var(--white);color:var(--ink);box-shadow:var(--shadow-sm);cursor:pointer;display:inline-block;transition:transform .1s ease,box-shadow .1s ease}.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}.btn:active{transform:translate(3px,3px);box-shadow:var(--shadow-press)}.btn.primary{background:var(--brand);color:var(--on-brand)}.hero-art{position:relative;justify-self:center;width:100%;max-width:330px;transition:transform .1s linear}.hero-art img{display:block;width:100%;border:var(--line) solid var(--ink);background:var(--brand-soft);box-shadow:var(--shadow)}.hero-art .sticker{position:absolute;right:-22px;bottom:-20px;font-family:var(--font-display);font-weight:900;font-size:13px;background:var(--brand-soft);color:var(--brand-deep);border:var(--line) solid var(--ink);padding:8px 12px;box-shadow:var(--shadow-sm);transform:rotate(6deg)}.band{margin:0 -20px;background:var(--ink);color:var(--paper);border-top:var(--line) solid var(--ink);border-bottom:var(--line) solid var(--ink);padding:10px 0;overflow:hidden;white-space:nowrap;font-family:var(--font-display);font-weight:900;letter-spacing:3px;text-transform:uppercase;font-size:14px}.band span{padding:0 28px}.band b{color:var(--brand-soft)}.sec-title{font-family:var(--font-display);font-weight:900;font-size:clamp(22px,3vw,32px);text-transform:uppercase;letter-spacing:1px;margin:62px 0 20px;display:flex;align-items:center;gap:14px}.sec-title:before{content:"";width:34px;height:13px;flex:none;background:var(--brand);border:var(--line-2) solid var(--ink)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--gap)}.card{border:var(--line) solid var(--ink);background:var(--white);transition:transform .1s ease,box-shadow .1s ease}.card:hover{transform:translate(-4px,-4px);box-shadow:var(--offset) var(--offset) 0 var(--card-brand, var(--brand))}.card .thumb{aspect-ratio:4 / 3;border-bottom:var(--line) solid var(--ink);display:flex;align-items:center;justify-content:center;background:var(--brand-soft);color:var(--brand-deep);font-family:var(--font-display);font-weight:900;letter-spacing:2px;font-size:13px}.card h3{font-size:17px;margin:14px 16px 4px;font-weight:900}.card p{margin:0 16px;font-size:13px;color:#55555a}.card .tags{margin:12px 16px 16px;display:flex;gap:8px;flex-wrap:wrap}.card .tags span{font-size:11px;font-weight:800;padding:1px 8px;border:var(--line-2) solid var(--ink);background:var(--paper)}.foot{border-top:var(--line) solid var(--ink);padding:20px;font-size:12px;color:#55555a;max-width:var(--maxw);margin:0 auto}@media(max-width:760px){.hero{grid-template-columns:1fr;padding:34px 0 44px;gap:26px}.hero-art{order:-1;max-width:230px}.hero-art .sticker{right:-10px}}
