/* juke.moe 首页。配色令牌取自 kiralu 的「演出海报 poster」（页面里叫浅色）和「夜班档 night」（深色）。
 * 每个区块（.k0 到 .k7）有自己的底色 --kN、文字色 --iN、卡片色 --dN，两套外观各给一组；
 * 区块之间没有直线：下一区块的颜色从上一区块底部的曲线（.edge）里漫上来。
 * 挂件示意用的是真正的挂件样式表和脚本（/song-request.css、/song-request-view.js），由 juke.js 在示意区接近视口时加载。 */
/* 标题和字标用自托管的 Archivo Black（拉丁）和 Noto Sans SC Black（汉字），均为 SIL OFL 1.1，许可证文本在 /_juke/fonts/ 里。
 * 汉字只含页面标题用到的 145 个字；其余文字（歌名、主播名等运行时内容）按字体栈逐字回退到系统字体。
 * 标题改字后要重新生成 juke-han.woff2 和这里的 unicode-range（做法见 docs/juke.md）。 */
@font-face{font-family:"Juke Latin";src:url(/_juke/fonts/juke-latin.woff2) format("woff2");font-weight:100 900;font-display:swap;
  unicode-range:U+0020-007E,U+00A0-00FF,U+2013-2014,U+2018-201D,U+2026}
@font-face{font-family:"Juke Han";src:url(/_juke/fonts/juke-han.woff2) format("woff2");font-weight:100 900;font-display:swap;
  unicode-range:U+B7,U+2197,U+3001-3002,U+300C-300D,U+4E09-4E0A,U+4E0D,U+4E13,U+4E3B,U+4E48,U+4E86,U+4E8E,U+4EBA,U+4EC0,U+4EE5,U+4EF6,U+4EFB,U+4EFD,U+4F17,U+4F55,U+4F7F,U+505A,U+5165,U+5199,U+51ED,U+5230,U+5355,U+53BB,U+53D1,U+53E3,U+53EF-53F0,U+53F7,U+540D,U+5417,U+5462,U+548C,U+54D4,U+54E9,U+5728,U+5730,U+573A,U+5740,U+57DF,U+586B,U+5907,U+591A,U+597D,U+5B50,U+5C55,U+5DF1,U+5E26,U+5E38,U+5E55,U+5F39,U+5F53,U+5F55,U+5F97,U+600E,U+610F,U+623F,U+624B,U+626B,U+627E,U+6302,U+6362,U+63A5,U+63D2,U+64AD,U+653E,U+6548,U+6559,U+662F,U+66F4,U+6700,U+6709,U+671F,U+672C,U+673A,U+679C,U+6837,U+68AF,U+6B4C,U+6B65,U+6CA1,U+6CE8,U+6D4F,U+70B9,U+7269,U+7279,U+7528,U+7591,U+767B,U+7684,U+76D2,U+76F2,U+76F4,U+76F8,U+770B,U+77ED,U+7801,U+793A,U+793C,U+7A0B,U+7B54,U+7ED9,U+7EDF,U+7EED,U+80FD,U+81EA,U+85CF,U+8981,U+89C1-89C2,U+89C8,U+8BA1,U+8BB0,U+8BC1,U+8EAB,U+8FC7,U+8FD1,U+8FDB,U+91CC,U+94FE,U+95EE,U+95F4,U+9636,U+968F-9690,U+9884,U+9898,U+9AA4,U+FF01,U+FF08-FF09,U+FF0C,U+FF1A-FF1B,U+FF1F}
:root{
  color-scheme:light;
  --font:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Noto Sans SC","WenQuanYi Zen Hei",sans-serif;
  --font-d:"Juke Latin","Juke Han","PingFang SC","HarmonyOS Sans SC","Microsoft YaHei","Noto Sans CJK SC","WenQuanYi Zen Hei",sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",monospace;
  --c1:#ffb400;--c2:#ff5a5f;--c3:#7fe0b6;--c4:#c7b8ff;--c5:#ff9ec0;--blk:#1c1847;
  --lw:3px;--r:0px;--hov:#ffb400;--hov-fg:#1c1847;--focus:0 0 0 3px #ffb400;
  --stage:#2a2563;--ray:rgba(255,241,214,.12);--vinyl:#14122a;--err:#a32024;--halo:#fff1d6;
  --tape-bg:#1c1847;--tape-fg:#fff1d6;
  --k0:#fff1d6;--i0:#1c1847;--d0:#fffaf0;
  --k1:#ffb400;--i1:#1c1847;--d1:#fff1d6;
  --k2:#2a2563;--i2:#fff1d6;--d2:#1c1847;
  --k3:#ff5a5f;--i3:#1c1847;--d3:#fffaf0;
  --k4:#fff1d6;--i4:#1c1847;--d4:#fffaf0;
  --k5:#c7b8ff;--i5:#1c1847;--d5:#fffaf0;
  --k6:#fff1d6;--i6:#1c1847;--d6:#fffaf0;
  --k7:#1c1847;--i7:#fff1d6;--d7:#1c1847;
  --k8:#7fe0b6;--i8:#1c1847;--d8:#fffaf0;
  --eh:clamp(44px,8.5vw,128px);
}
@media (prefers-color-scheme:dark){:root:not([data-skin]){
  color-scheme:dark;--focus:0 0 0 3px rgba(255,180,0,.6);--blk:#15122f;--stage:#0e0c24;--err:#ff9db1;--halo:#fff1d6;
  --tape-bg:#ffb400;--tape-fg:#15122f;
  --k0:#15122f;--i0:#fff1d6;--d0:#1e1a45;
  --k1:#ffb400;--i1:#15122f;--d1:#fff1d6;
  --k2:#2b2475;--i2:#fff1d6;--d2:#15122f;
  --k3:#ff5a5f;--i3:#15122f;--d3:#fffaf0;
  --k4:#15122f;--i4:#fff1d6;--d4:#1e1a45;
  --k5:#4b3fb8;--i5:#fff1d6;--d5:#15122f;
  --k6:#15122f;--i6:#fff1d6;--d6:#1e1a45;
  --k7:#ffb400;--i7:#15122f;--d7:#15122f;
  --k8:#16584b;--i8:#fff1d6;--d8:#10201f;
}}
html[data-skin=night]{
  color-scheme:dark;--focus:0 0 0 3px rgba(255,180,0,.6);--blk:#15122f;--stage:#0e0c24;--err:#ff9db1;--halo:#fff1d6;
  --tape-bg:#ffb400;--tape-fg:#15122f;
  --k0:#15122f;--i0:#fff1d6;--d0:#1e1a45;
  --k1:#ffb400;--i1:#15122f;--d1:#fff1d6;
  --k2:#2b2475;--i2:#fff1d6;--d2:#15122f;
  --k3:#ff5a5f;--i3:#15122f;--d3:#fffaf0;
  --k4:#15122f;--i4:#fff1d6;--d4:#1e1a45;
  --k5:#4b3fb8;--i5:#fff1d6;--d5:#15122f;
  --k6:#15122f;--i6:#fff1d6;--d6:#1e1a45;
  --k7:#ffb400;--i7:#15122f;--d7:#15122f;
  --k8:#16584b;--i8:#fff1d6;--d8:#10201f;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--k0);color:var(--i0);font-family:var(--font);line-height:1.65;font-size:16px;-webkit-text-size-adjust:100%}
h1,h2,h3,p{margin:0}
a{color:inherit}
:focus-visible{outline:none;box-shadow:var(--focus)}
.ic{width:1.6em;height:1.6em;display:block}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.skip{position:absolute;left:12px;top:-60px;background:var(--d0);color:var(--i0);padding:8px 14px;z-index:60;border:var(--lw) solid var(--i0)}.skip:focus{top:10px}
.page{position:relative;overflow-x:hidden;overflow-x:clip}

/* 区块与曲线边缘 */
.blk{position:relative;padding:72px 0 calc(var(--eh) + 44px);color:var(--fg);--line:var(--fg)}
.k0{--bk:var(--k0);--fg:var(--i0);--card:var(--d0);--btn:var(--c1)}
.k1{--bk:var(--k1);--fg:var(--i1);--card:var(--d1);--btn:var(--c2)}
.k2{--bk:var(--k2);--fg:var(--i2);--card:var(--d2);--btn:var(--c1)}
.k3{--bk:var(--k3);--fg:var(--i3);--card:var(--d3);--btn:var(--c1)}
.k4{--bk:var(--k4);--fg:var(--i4);--card:var(--d4);--btn:var(--c1)}
.k5{--bk:var(--k5);--fg:var(--i5);--card:var(--d5);--btn:var(--c1)}
.k6{--bk:var(--k6);--fg:var(--i6);--card:var(--d6);--btn:var(--c1)}
.k8{--bk:var(--k8);--fg:var(--i8);--card:var(--d8);--btn:var(--c1)}
.k7{--bk:var(--k7);--fg:var(--i7);--card:var(--d7);--btn:var(--c1);padding-bottom:0}
.k0{padding-top:0}
.bgl{position:absolute;inset:0;background:var(--bk);z-index:0}
.blk>.wrap{position:relative;z-index:2}
.edge{transform-origin:50% 100%;position:absolute;left:0;width:100%;bottom:-28px;height:calc(var(--eh) + 28px);z-index:0;pointer-events:none;will-change:transform}
.edge path{fill:var(--next)}
.k0 .edge{--next:var(--k1)}.k1 .edge{--next:var(--k2)}.k2 .edge{--next:var(--k8)}.k8 .edge{--next:var(--k3)}.k3 .edge{--next:var(--k5)}
.has-crowd .k3 .edge{--next:var(--k4)}
.k4 .edge{--next:var(--k5)}.k5 .edge{--next:var(--k6)}.k6 .edge{--next:var(--k7)}
section[hidden]{display:none}

/* 贯穿全页的五线谱，由 fx.js 按页面尺寸画出 */
.rib{position:absolute;left:0;top:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:visible}
.rib .nt{opacity:0;transform-box:fill-box;transform-origin:50% 100%;transform:scale(.3);transition:opacity .25s,transform .35s cubic-bezier(.3,1.6,.5,1)}
.rib .nt.on{opacity:1;transform:none}

/* 导航 */
.nav{display:flex;align-items:center;gap:18px;padding:14px 0;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:8px;font-weight:900;font-size:22px;letter-spacing:.02em;color:var(--fg);text-decoration:none;font-family:var(--font-d)}
.brand .ic{width:30px;height:30px}
.brand .ic{overflow:visible}
.js .brand .ic{animation:wob 1s .5s cubic-bezier(.3,1.5,.5,1) 1 both}
@media (hover:hover){.brand:hover .ic{animation:wob .7s cubic-bezier(.3,1.5,.5,1)}}
.brand:active .ic{transform:rotate(-30deg)}
@keyframes wob{0%{transform:rotate(0)}30%{transform:rotate(-40deg) scale(1.08)}60%{transform:rotate(25deg)}100%{transform:rotate(0)}}
.nav nav{display:flex;gap:2px}
.nav nav a{padding:6px 12px;color:var(--fg);text-decoration:none;font-weight:700;font-size:14px;border:var(--lw) solid transparent;border-radius:var(--r)}
.nav nav a:hover{background:var(--hov);color:var(--hov-fg);border-color:var(--hov-fg)}
.skins{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:12px}
.seg{display:inline-flex;border:var(--lw) solid var(--line);background:var(--card);color:var(--fg);border-radius:var(--r);overflow:hidden}
.seg button{font:inherit;font-size:13px;font-weight:700;min-height:34px;padding:0 12px;border:0;background:none;color:inherit;cursor:pointer}
.seg button+button{border-left:var(--lw) solid var(--line)}
.seg button[aria-pressed=true]{background:var(--fg);color:var(--card)}
.seg button:hover:not([aria-pressed=true]){background:var(--hov);color:var(--hov-fg)}

/* 首屏 */
.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:24px;align-items:center;padding:12px 0 8px}
.kick{display:inline-block;font-weight:800;font-size:13px;letter-spacing:.08em;padding:4px 12px;background:var(--c2);color:var(--blk);border:var(--lw) solid var(--line);border-radius:var(--r)}
.big{font-family:var(--font-d);font-weight:900;font-size:clamp(112px,21vw,290px);line-height:.8;letter-spacing:-.03em;margin:20px 0 .2em -.02em;color:var(--fg);text-shadow:.045em .045em 0 var(--c2)}
.tagline{font-size:clamp(28px,3.6vw,48px);font-weight:900;line-height:1.2;letter-spacing:0;font-family:var(--font-d)}
.tagline mark{background:var(--c1);color:var(--blk);padding:0 .15em;border-radius:var(--r)}
.pitch{margin-top:14px;max-width:34em;font-size:17px}
.disc{position:relative;aspect-ratio:1;width:min(100%,430px);justify-self:center;display:grid;place-items:center}
.disc::before{content:"";position:absolute;inset:-14%;border-radius:50%;background:repeating-conic-gradient(var(--c1) 0 7deg,transparent 7deg 15deg);-webkit-mask:radial-gradient(circle,#000 0 60%,transparent 70%);mask:radial-gradient(circle,#000 0 60%,transparent 70%);animation:sun 90s linear infinite}
.disc::after{content:"";position:absolute;inset:6%;border-radius:50%;background:var(--c2);border:var(--lw) solid var(--line)}
.ringtext{position:absolute;inset:-8%;width:116%;height:116%;z-index:2;pointer-events:none;animation:sun 60s linear infinite reverse}
.ringtext text{font:900 21px/1 var(--font);letter-spacing:.04em;fill:var(--blk);paint-order:stroke;stroke:var(--halo);stroke-width:5px;stroke-linejoin:round}
@keyframes sun{to{transform:rotate(360deg)}}
.disc .m-rec{position:relative;z-index:1;width:84%;height:84%}
.disc .m-rec{border-radius:50%;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.m-rec.grab{cursor:grabbing}.m-rec.grab .rec-spin{animation-play-state:paused}
.rec-svg{display:block;width:100%;height:100%;overflow:visible}
.rec-spin{transform-box:fill-box;transform-origin:center;animation:spin 7s linear infinite}
.rec-pop,.rec-sv{transform-box:fill-box;transform-origin:center}
@keyframes spin{to{transform:rotate(360deg)}}
.deco{position:absolute;z-index:1;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:2px 10px;padding:8px 14px;background:var(--card);color:var(--fg);border:var(--lw) solid var(--line);box-shadow:4px 4px 0 var(--line);font-size:12px;font-weight:800;letter-spacing:.08em;pointer-events:none;border-radius:var(--r)}
.deco b{font-family:var(--font-d);font-size:15px}
.deco i{grid-row:1/3;grid-column:2;width:44px;height:30px;justify-self:end;background:repeating-linear-gradient(90deg,var(--fg) 0 2px,transparent 2px 5px,var(--fg) 5px 9px,transparent 9px 11px)}
.deco span{grid-column:1}
.d1{top:414px;left:44.5%;transform:rotate(-7deg)}
@media (max-width:1359px){.d1{display:none}}

/* 吉祥物 */
.mascot{all:unset;display:block;cursor:pointer;position:relative;-webkit-tap-highlight-color:transparent}
.mascot:focus-visible{outline:3px solid var(--c1);outline-offset:4px;border-radius:12px}
.mv{display:block;width:100%;height:auto;overflow:visible}
.mv .halo{fill:var(--halo);stroke:var(--halo);stroke-width:14;stroke-linejoin:round}
.mv .sh{fill:#1c1847;stroke:#1c1847;stroke-width:5;stroke-linejoin:round}
.mv .bd{stroke:#1c1847;stroke-width:5;stroke-linejoin:round}
.mv .ol,.rec-svg .ol{fill:none;stroke:#1c1847;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.eye .sc{fill:#fff;stroke:#1c1847;stroke-width:4}
.eye .pu{fill:#1c1847}.eye .gl{fill:#fff}
.eye .hp{display:none;fill:none;stroke:#1c1847;stroke-width:5;stroke-linecap:round}
.eye{transform-box:fill-box;transform-origin:center;animation:blink 5.6s infinite}
.pp{transition:transform .12s ease-out}
.ch{fill:#ff7b9c;opacity:.75}
.mo-o{display:none}
.mascot.cheer .mo-s,.mascot.cheer .sc,.mascot.cheer .pp{display:none}
.mascot.cheer .mo-o,.mascot.cheer .hp{display:inline}
.mascot.cheer .eye{animation:none}
.sleepy .mascot .eye{animation:none;transform:scaleY(.22)}
.eye.wink{animation:wink .55s ease-in-out}
@keyframes blink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.08)}}
@keyframes wink{0%,100%{transform:scaleY(1)}30%,70%{transform:scaleY(.06)}}
.bob{transform-box:fill-box;transform-origin:50% 100%;animation:bob 3.4s ease-in-out infinite}
.m-tape .bob{animation-duration:2.9s;animation-delay:-1s}.m-mic .bob{animation-duration:3.8s;animation-delay:-2s}.m-boom .bob{animation-duration:2.6s;animation-delay:-.6s}.m-radio .bob{animation-duration:4.1s;animation-delay:-1.4s}.m-rec .bob{animation-duration:4.4s}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1.2deg)}}
.sleepy .bob{animation:none}
.mascot.hop .mv,.mascot.hop .rec-svg{animation:hop .62s cubic-bezier(.3,1.6,.5,1)}
@keyframes hop{0%{transform:translateY(0) scale(1,1)}25%{transform:translateY(4px) scale(1.06,.92)}60%{transform:translateY(-22px) scale(.96,1.05)}100%{transform:translateY(0) scale(1,1)}}
.m-slot{position:relative}
.m-tape-slot{position:absolute;right:33%;bottom:calc(100% - 22px);width:clamp(86px,10vw,128px);z-index:3}
.m-straddle{position:absolute;z-index:3;width:clamp(96px,12vw,150px)}
.m-boom-slot{left:7%;bottom:-62px}
.m-radio-slot{right:9%;bottom:-58px}
.m-mic-slot{position:absolute;right:20px;bottom:calc(100% - 20px);width:clamp(84px,9vw,112px);z-index:3}
.m-juke-slot{width:clamp(112px,13vw,168px);align-self:start;margin-top:-92px}
.m-rec .rec-svg{overflow:visible}

/* 贴纸气泡 */
.sticker{position:absolute;left:50%;bottom:88%;z-index:6;white-space:nowrap;background:var(--sb,#fffaf0);color:#1c1847;border:3px solid #1c1847;border-radius:16px 16px 16px 3px;padding:3px 12px;font:900 15px/1.4 var(--font);box-shadow:3px 3px 0 #1c1847;pointer-events:none;opacity:0;transform:translate(-50%,0) scale(0) rotate(var(--rot,-6deg));transform-origin:30% 100%}
.sticker.on{animation:pop .5s cubic-bezier(.34,1.56,.64,1) forwards}
.sticker.off{animation:unpop .22s ease-in forwards}
@keyframes pop{from{opacity:1;transform:translate(-50%,0) scale(0) rotate(calc(var(--rot,-6deg)*3))}to{opacity:1;transform:translate(-50%,0) scale(1) rotate(var(--rot,-6deg))}}
@keyframes unpop{from{opacity:1;transform:translate(-50%,0) scale(1) rotate(var(--rot,-6deg))}to{opacity:0;transform:translate(-50%,-8px) scale(.6) rotate(var(--rot,-6deg))}}
.sticker.z{background:transparent;border:0;box-shadow:none;color:var(--fg);font-size:22px;letter-spacing:.1em}

/* 点唱台：带撕口的票 */
.room{position:relative;margin-top:36px;--stub:196px}
.ticket{position:relative;display:grid;grid-template-columns:minmax(0,1fr) var(--stub);--rz:-1.1deg}
.tk-main{background:var(--card);border:var(--lw) solid var(--line);border-right:0;border-radius:var(--r) 0 0 var(--r);padding:8px 8px 4px 22px;box-shadow:6px 6px 0 var(--line);min-width:0}
.tk-head{display:flex;align-items:baseline;gap:12px;padding-top:4px}
.tk-head b{font-size:18px;font-weight:900;letter-spacing:.12em}
.tk-head small{font-size:12px;letter-spacing:.14em;opacity:.8}
.tk-no{margin-left:auto;font-family:var(--mono);font-weight:800;font-size:13px;letter-spacing:.08em;opacity:.8;padding-right:8px}
.ticket .in{display:flex;align-items:center;min-width:0;gap:2px}
.ticket label{font-weight:800;opacity:.75;font-size:20px;white-space:nowrap;font-family:var(--font-d)}
.ticket input{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:30px;font-weight:900;letter-spacing:.03em;color:inherit;outline:none;padding:10px 4px 12px;font-family:var(--font-d)}
.ticket input::placeholder{font-size:17px;font-weight:600;color:inherit;opacity:.6;letter-spacing:0}
.ticket:focus-within .tk-main{box-shadow:6px 6px 0 var(--line),var(--focus)}
.tk-stub{position:relative;display:grid;align-content:center;justify-items:center;gap:8px;padding:10px 14px;background:var(--c1);color:var(--blk);border:var(--lw) solid var(--line);border-left:4px dotted var(--line);border-radius:0 var(--r) var(--r) 0;box-shadow:6px 6px 0 var(--line);transform-origin:0 100%}
.tk-stub::before,.tk-stub::after{content:"";position:absolute;left:-12px;width:20px;height:20px;border-radius:50%;background:var(--bk)}
.tk-stub::before{top:-12px}.tk-stub::after{bottom:-12px}
.bars{display:block;height:22px;width:100%;background:repeating-linear-gradient(90deg,currentColor 0 2px,transparent 2px 5px,currentColor 5px 9px,transparent 9px 11px,currentColor 11px 12px,transparent 12px 16px)}
.ticket.tearing .tk-stub{animation:tear .75s cubic-bezier(.5,0,.8,.45) forwards}
.ticket.tearing .tk-main{animation:tug .3s ease-out}
@keyframes tear{0%{transform:none}25%{transform:translate(5px,-4px) rotate(5deg)}100%{transform:translate(170px,90px) rotate(34deg);opacity:0}}
@keyframes tug{50%{transform:translateX(-5px)}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;font:inherit;font-weight:900;font-size:16px;letter-spacing:.08em;color:var(--blk);background:var(--btn,var(--c1));border:var(--lw) solid var(--line);border-radius:var(--r);box-shadow:4px 4px 0 var(--line);cursor:pointer;text-decoration:none;white-space:nowrap;transition:transform .08s,box-shadow .08s,background-color .15s}
.btn:hover{background:var(--hov);color:var(--hov-fg)}
.btn:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--line)}
.btn.alt{background:var(--card);color:var(--fg)}
.btn.alt:hover{background:var(--hov);color:var(--hov-fg)}
.tk-stub .btn{box-shadow:3px 3px 0 var(--line);min-height:44px;padding:0 18px;color:var(--blk);background:var(--card);color:var(--fg)}
.tk-stub .btn:active{box-shadow:0 0 0 var(--line);transform:translate(3px,3px)}
.msg{min-height:1.6em;margin-top:14px;font-size:14px;font-weight:700;color:var(--err)}
.hint{font-size:14px;opacity:.88}
.room .hint{margin-top:-6px}
.hint code,.k{white-space:nowrap;font-family:var(--mono);font-size:.92em;padding:1px 8px;border:var(--lw) solid var(--line);background:var(--card);color:var(--fg);border-radius:var(--r);font-weight:700}

/* 最近看过：访客自己浏览器里记的几份歌单，头像加名字 */
.seen{position:relative;margin-top:26px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.seen[hidden]{display:none}
.seen-h{display:flex;align-items:center;gap:10px}
.seen-h h2{font-size:13px;font-weight:800;letter-spacing:.18em}
.seen-clear{font:inherit;font-size:13px;font-weight:700;min-height:44px;padding:0 8px;background:none;border:0;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer;opacity:.85}
.seen-clear:hover{opacity:1}
.seen-l{list-style:none;margin:0;padding:0 0 4px;display:flex;flex-wrap:wrap;gap:12px 14px;min-width:0}
.sn{display:inline-flex;align-items:center;min-width:0;max-width:100%;min-height:44px;background:var(--card);color:var(--fg);border:var(--lw) solid var(--line);border-radius:var(--r);box-shadow:3px 3px 0 var(--line);transform:rotate(var(--r,0deg));transition:transform .15s}
.js .sn{animation:snpop .45s cubic-bezier(.34,1.56,.64,1) backwards;animation-delay:calc(var(--i,0)*45ms)}
@keyframes snpop{from{opacity:0;transform:scale(.6) rotate(calc(var(--r,0deg)*3))}to{opacity:1;transform:rotate(var(--r,0deg))}}
.sn-a{display:flex;align-items:center;gap:8px;min-width:0;padding:4px 6px 4px 8px;color:inherit;text-decoration:none;font-weight:800;font-size:14px}
.sn-a:hover{background:var(--hov);color:var(--hov-fg)}
.sn-a:active{transform:translate(2px,2px)}
.sn-n{min-width:0;max-width:11em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sn-av{flex:none;width:28px;height:28px;border-radius:50%;background:var(--c1);color:#1c1847;border:2px solid #1c1847;display:grid;place-items:center;font:900 14px/1 var(--font-d);overflow:hidden}
.sn-av img{width:100%;height:100%;object-fit:cover;display:block}
.sn-x{flex:none;width:44px;min-height:44px;font:inherit;font-size:18px;font-weight:700;line-height:1;background:none;border:0;border-left:2px dashed var(--line);color:inherit;cursor:pointer;opacity:.8}
.sn-x:hover{background:var(--hov);color:var(--hov-fg);opacity:1}
.sn-x:active{transform:translate(2px,2px)}

/* 跑马灯胶带：斜着横过首屏与下一区块的交界 */
.tape{position:absolute;left:-8vw;right:-8vw;bottom:calc(var(--eh)*.34);z-index:3;transform:rotate(-3.2deg) skewX(var(--sk,0deg));background:var(--tape-bg);color:var(--tape-fg);overflow:hidden;white-space:nowrap;font-weight:900;letter-spacing:.14em;font-size:16px;line-height:40px;border-block:3px solid #1c1847;pointer-events:none}
.tape-in{display:inline-block;will-change:transform}
.tape span{margin:0 18px}.tape i{font-style:normal;opacity:.7}

/* 区块标题 */
.sh{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:34px}
.sh h2{font-family:var(--font-d);font-size:clamp(32px,4.6vw,56px);font-weight:900;letter-spacing:0;line-height:1.1;text-shadow:3px 3px 0 var(--c2)}
.k3 .sh h2,.k5 .sh h2{text-shadow:3px 3px 0 var(--c1)}
.sh small{font-size:13px;font-weight:700;letter-spacing:.06em;opacity:.8;font-family:var(--font-d)}
.sh p{flex:1 1 280px;margin-left:auto;text-align:right;font-size:15px}

/* 添加 */
#get .sh{margin-bottom:84px}
.feature{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px 32px;align-items:center;padding:28px;background:var(--card);color:var(--fg);border:var(--lw) solid var(--line);border-radius:var(--r);box-shadow:8px 8px 0 var(--line);--rz:-.6deg}
.ft-text h3{font-family:var(--font-d);font-size:clamp(28px,3.4vw,42px);font-weight:900;line-height:1.2}
.ft-text h3 small{display:block;font-family:var(--font-d);font-size:12px;font-weight:800;letter-spacing:.16em;opacity:.8;margin-bottom:4px}
.ft-text p{font-size:17px;line-height:1.6;max-width:36em;margin-top:6px}
.feature .go{font-size:16px;padding:12px 20px}

/* 倾斜与抬起 */
.tilt{transform:perspective(900px) rotateZ(var(--rz,0deg)) rotateX(var(--tx,0deg)) rotateY(var(--ty,0deg)) translateY(var(--lift,0));transition:transform .22s ease-out}

/* 现场 */
.vword{position:absolute;z-index:1;left:clamp(4px,1.6vw,26px);top:90px;writing-mode:vertical-rl;font-family:var(--font-d);font-weight:900;font-size:clamp(46px,6vw,92px);line-height:1;letter-spacing:.06em;color:transparent;-webkit-text-stroke:2px var(--fg);opacity:.5;pointer-events:none;white-space:nowrap}
.k2{padding-bottom:calc(var(--eh) + 70px)}
.live{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:28px;align-items:start}
.stagecol{min-width:0}
.screen{position:relative;border:var(--lw) solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:8px 8px 0 var(--line);padding:38px 14px 12px;display:flex;flex-direction:column;gap:12px;
  background:
    radial-gradient(circle at 12% 18%,rgba(255,255,255,.5) 0 2.4%,transparent 2.8%),radial-gradient(circle at 24% 62%,rgba(255,236,170,.45) 0 3.4%,transparent 3.8%),
    radial-gradient(circle at 8% 84%,rgba(255,255,255,.35) 0 2%,transparent 2.4%),radial-gradient(circle at 33% 30%,rgba(190,240,255,.4) 0 1.8%,transparent 2.2%),
    radial-gradient(ellipse 120px 70px at 16% 100%,#241a52 0 62%,transparent 64%),radial-gradient(circle 34px at 16% 66%,#241a52 0 92%,transparent 96%),
    linear-gradient(165deg,#ffb36b 0%,#f0587a 36%,#8a47b8 68%,#2a2563 100%)}
.screen .live-tag{position:absolute;left:14px;top:12px;z-index:2;font-size:11px;font-weight:900;letter-spacing:.2em;background:var(--c2);color:#1c1847;padding:2px 10px;border:2px solid #1c1847;border-radius:var(--r)}
.sr-host{all:initial;display:block;box-sizing:border-box;position:relative;margin-left:auto;width:min(100%,420px);aspect-ratio:420/480;font:16px/normal system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;color:#fff}
.sr-host .fb{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border-radius:12px;background:rgba(20,22,28,.88);color:#f9fafb;font-size:17px}
.sr-host .fb b{font-size:14px;letter-spacing:.2em;color:#38bdf8}.sr-host .fb i{font-style:normal}.sr-host .fb u{text-decoration:none;opacity:.7;margin-right:10px}.sr-host .fb s{text-decoration:none;opacity:.8;font-size:13px;margin-left:10px}
.dm-line{align-self:flex-start;min-height:30px;background:rgba(20,18,50,.62);color:#fff1d6;padding:5px 14px;border-radius:99px;font-size:14px;line-height:1.5}
.dm-line:empty{visibility:hidden}
.dm-line.pop{animation:dmpop .45s cubic-bezier(.34,1.56,.64,1)}
@keyframes dmpop{from{opacity:0;transform:translateY(8px) scale(.9)}to{opacity:1;transform:none}}
.pickbar{display:flex;gap:10px 12px;align-items:center;flex-wrap:wrap;margin-top:22px;font-size:13px;font-weight:700}
.chips{display:flex;flex-wrap:wrap;gap:8px;flex:1 1 280px}
.chip{font:inherit;font-size:13px;font-weight:800;min-height:36px;padding:0 12px;color:var(--fg);background:var(--card);border:var(--lw) solid var(--line);border-radius:var(--r);cursor:pointer}
.chip[aria-pressed=true]{background:var(--fg);color:var(--card)}
.chip:hover:not([aria-pressed=true]){background:var(--hov);color:var(--hov-fg)}
.pick1{min-height:40px;padding:0 18px;font-size:14px;background:var(--c1)}
html:not(.js) .pickbar{display:none}
.setlist{display:grid;gap:22px}
.setlist h3{font-size:14px;font-weight:900;letter-spacing:.2em;font-family:var(--font-d);margin-bottom:10px;display:flex;gap:10px;align-items:center}
.setlist h3::after{content:"";flex:1;height:var(--lw);background:repeating-linear-gradient(90deg,var(--line) 0 8px,transparent 8px 14px)}
.setlist ol{list-style:none;margin:0;padding:0;display:grid;counter-reset:n;border:var(--lw) solid var(--line);background:var(--card);border-radius:var(--r);box-shadow:6px 6px 0 var(--line)}
.setlist li{counter-increment:n;display:grid;grid-template-columns:62px 1fr;align-items:center;gap:6px;padding:14px 16px 14px 0;border-bottom:var(--lw) dashed var(--line);font-size:16px;font-weight:400}
.setlist li:last-child{border-bottom:0}
.setlist li::before{content:"0" counter(n);font-family:var(--font-d);font-weight:900;font-size:34px;line-height:1;text-align:center;color:var(--c2);letter-spacing:-.04em}
.cmd{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cmd .ci{all:unset;position:relative;box-sizing:border-box;cursor:pointer;border:var(--lw) solid var(--line);padding:12px 14px;border-radius:var(--r);display:grid;gap:2px;color:#1c1847;box-shadow:4px 4px 0 var(--line);transition:transform .08s,box-shadow .08s}
.cmd .ci:focus-visible{box-shadow:4px 4px 0 var(--line),var(--focus)}
.cmd .ci:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--line)}
@media (hover:hover) and (pointer:fine){.cmd .ci:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--line)}.cmd .ci:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--line)}}
.cmd b{font-family:var(--font-d);font-size:20px;font-weight:900;line-height:1.3}
.cmd span{font-size:13.5px;opacity:.88}
.cmd .ci:nth-child(1){background:var(--c1)}.cmd .ci:nth-child(2){background:var(--c3)}.cmd .ci:nth-child(3){background:var(--c5)}.cmd .ci:nth-child(4){background:var(--c4)}
/* 二维码示意票 */
.qrt{display:grid;grid-template-columns:minmax(0,1fr) auto;background:var(--c4);color:#1c1847;border:var(--lw) solid var(--line);border-radius:var(--r);box-shadow:6px 6px 0 var(--line);--rz:-1.8deg;margin-top:10px}
.qrt-main{padding:14px 16px;display:grid;gap:4px;align-content:center}
.qrt-main small{font-size:11px;font-weight:900;letter-spacing:.2em;opacity:.8}
.qrt-main b{font-family:var(--font-d);font-size:26px;font-weight:900;line-height:1.2}
.qrt-main span{font-size:13.5px}
.qrt-main .bars{margin-top:8px;height:16px;max-width:200px}
.qrt-stub{position:relative;display:grid;gap:4px;justify-items:center;padding:12px 14px;border-left:4px dotted #1c1847;background:#fffaf0}
.qrt-stub::before,.qrt-stub::after{content:"";position:absolute;left:-12px;width:20px;height:20px;border-radius:50%;background:var(--bk)}
.qrt-stub::before{top:-12px}.qrt-stub::after{bottom:-12px}
.qrbox{width:104px;height:104px;color:#000}
.qr{display:block;width:100%;height:100%}
.qrt-stub span{font:800 11px/1 var(--mono);letter-spacing:.1em}

/* 自己的地址：短链接、子域名、自己的域名 */
.own{position:relative;margin-top:64px;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2.2fr);gap:10px 28px;align-items:start;padding:22px 26px;background:var(--card);color:var(--fg);border:var(--lw) solid var(--line);border-radius:var(--r);box-shadow:8px 8px 0 var(--line);--rz:.5deg}
.own-h small{display:block;font-family:var(--font-d);font-size:12px;font-weight:800;letter-spacing:.2em;opacity:.8;margin-bottom:4px}
.own-h h3{font-family:var(--font-d);font-size:clamp(24px,2.6vw,32px);font-weight:900;line-height:1.2}
.own-l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.own-l li{display:grid;gap:8px;align-content:start;padding:2px 18px;border-left:var(--lw) dashed var(--line)}
.own-l li:first-child{border-left:0;padding-left:0}
.own-l b{font-size:15px;font-weight:900;letter-spacing:.06em}
.own-l .k{justify-self:start;max-width:100%;overflow-wrap:anywhere;font-size:14px}
.own-l span{font-size:13.5px;line-height:1.55;opacity:.92}
.own-f{grid-column:1/-1;font-size:14px;font-weight:800;padding-top:12px;border-top:var(--lw) dashed var(--line)}

/* 浏览歌单：找歌、找主播 */
.k8{padding-top:118px}
.bv{display:grid;gap:18px}
.bv-tabs{justify-self:start}
.bv-tabs button{min-height:44px;padding:0 20px;font-size:15px}
.bv-pane[hidden]{display:none}
.bv-bar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.bv-q{flex:1 1 260px;max-width:460px;background:var(--card)}
.bv-sort button{min-height:44px}
.bv-st{min-height:0;font-size:14px;font-weight:700}
.bv-st:empty{display:none}
.bv-st .btn{min-height:40px;margin-left:10px;padding:0 16px;font-size:14px}
.btn[hidden]{display:none}
.bv-more{margin-top:18px;min-height:44px}
.bv-more[disabled]{opacity:.65;cursor:default;box-shadow:none}
.bv-ns{font-size:14px}
.bs-list,.bc-grid{list-style:none;margin:0;padding:0}
.bs-list{display:grid;gap:14px}
.bs-it{background:var(--card);color:var(--fg);border:var(--lw) solid var(--line);border-radius:var(--r);box-shadow:5px 5px 0 var(--line);transform:rotate(var(--r,0deg));min-width:0}
.bs-it.open{transform:none}
.bs-row{all:unset;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) auto 20px;gap:2px 14px;align-items:center;width:100%;padding:12px 16px;cursor:pointer}
.bs-row:focus-visible{box-shadow:inset 0 0 0 3px var(--c1)}
.bs-row:hover{background:var(--hov);color:var(--hov-fg)}
.bs-t{font-size:18px;font-weight:900;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bs-a{grid-column:1;font-size:13px;opacity:.85;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bs-n{grid-column:2;grid-row:1/3;justify-self:end;font-size:12.5px;font-weight:800;background:var(--c1);color:#1c1847;border:2px solid #1c1847;padding:2px 10px;white-space:nowrap}
.bs-row::after{content:"▾";grid-column:3;grid-row:1/3;font-size:14px;transition:transform .2s}
.bs-it.open .bs-row::after{transform:rotate(180deg)}
.bs-more-box{padding:4px 16px 16px;border-top:var(--lw) dashed var(--line)}
.bs-more-box[hidden]{display:none}
.bs-chips{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.bs-chips .sn{box-shadow:3px 3px 0 var(--line)}
.bc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px 16px}
.bc{display:grid;grid-template-columns:44px minmax(0,1fr);gap:0 12px;align-items:center;padding:12px 14px;text-decoration:none;color:var(--fg);background:var(--card);border:var(--lw) solid var(--line);border-radius:var(--r);box-shadow:5px 5px 0 var(--line);transform:rotate(var(--r,0deg));transition:transform .12s,box-shadow .12s}
.bc:hover{background:var(--hov);color:var(--hov-fg)}
.bc:focus-visible{box-shadow:5px 5px 0 var(--line),var(--focus)}
.bc:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--line)}
.bc .sn-av{grid-row:1/3;width:44px;height:44px;font-size:20px}
.bc-n{font-size:16px;font-weight:900;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bc-s{font:800 13px/1.4 var(--mono);opacity:.85}
.sk{display:block;height:64px;background:var(--card);border:var(--lw) solid var(--line);box-shadow:5px 5px 0 var(--line);opacity:.5;animation:skp 1.1s ease-in-out infinite alternate}
.sk.c{height:76px}
@keyframes skp{from{opacity:.28}to{opacity:.6}}
.bv-lim{margin-top:14px;font-size:13.5px;font-weight:700}

/* 后台入口 */
.k3{padding-top:118px}
.door{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}
.door .l{display:flex;flex-direction:column;gap:14px;padding-top:10px}
.door .l h2{font-family:var(--font-d);font-size:clamp(38px,5.4vw,66px);font-weight:900;line-height:1.05;letter-spacing:0;text-shadow:3px 3px 0 var(--c1)}
.door .l h2 small{display:block;font-family:var(--font-d);font-size:.3em;letter-spacing:.24em;margin-bottom:10px;opacity:1;text-shadow:none}
.door .l p{font-size:16px;font-weight:400}
.cred{border:var(--lw) solid var(--line);background:#fffaf0;color:#1c1847;padding:14px 16px;font-size:14.5px;font-weight:400;border-radius:var(--r);box-shadow:5px 5px 0 var(--line);margin-top:6px}
.cred b{display:block;font-size:15.5px;margin-bottom:2px}
.card-form{position:relative;padding:30px;background:var(--card);color:var(--fg);border:var(--lw) solid var(--line);border-radius:var(--r);box-shadow:8px 8px 0 var(--line);display:grid;gap:14px;align-content:start;--rz:.6deg;margin-top:54px}
.card-form label{display:grid;gap:6px;font-weight:800;font-size:14px;letter-spacing:.04em}
.fld{width:100%;min-height:50px;padding:0 14px;font:inherit;font-size:17px;font-weight:600;color:var(--fg);background:transparent;border:var(--lw) solid var(--line);border-radius:var(--r);outline:none}
.fld:focus{box-shadow:var(--focus)}.fld::placeholder{color:inherit;opacity:.55}.fld[aria-invalid=true]{border-color:var(--err)}
select.fld{appearance:none;-webkit-appearance:none;padding-right:44px;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 24px) 50%,calc(100% - 17px) 50%;background-size:7px 7px;background-repeat:no-repeat}
select.fld option,select.fld optgroup{color:#1c1847;background:#fffaf0}
.pw{position:relative}.pw .fld{padding-right:84px}
.pw button{position:absolute;right:6px;top:50%;transform:translateY(-50%);min-height:36px;padding:0 12px;font:inherit;font-weight:800;font-size:13px;background:var(--card);color:var(--fg);border:var(--lw) solid var(--line);border-radius:var(--r);cursor:pointer}
.btns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:4px}
.btns .btn:first-child{order:2}
.card-form .msg{margin-top:-4px}
.card-form .hint{margin-top:-2px}

/* 最近在用：收藏卡 */
.deck{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:34px 20px;padding:12px 6px 34px;perspective:1400px}
.cd{position:relative;aspect-ratio:5/7;transform:rotate(var(--r,0deg)) translateY(0);transition:transform .28s cubic-bezier(.3,1.4,.5,1)}
.cd:hover,.cd:focus-within,.cd.flip{transform:rotate(0deg) translateY(-12px) scale(1.04);z-index:4}
.cd-in{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.3,1.2,.5,1)}
.cd.flip .cd-in{transform:rotateY(180deg)}
.face{all:unset;box-sizing:border-box;position:absolute;inset:0;display:flex;flex-direction:column;gap:7px;padding:10px;background:#fffaf0;color:#1c1847;border:4px solid #1c1847;border-radius:14px;box-shadow:6px 6px 0 var(--line);-webkit-backface-visibility:hidden;backface-visibility:hidden}
button.face{cursor:pointer}
.face:focus-visible{box-shadow:6px 6px 0 var(--line),0 0 0 4px var(--c1)}
.face.back{transform:rotateY(180deg);background:var(--ac)}
.cd:not(.flip) .back,.cd.flip .front{visibility:hidden}
.cd-top{display:flex;align-items:center;justify-content:space-between;gap:6px}
.cd-name{font:900 16px/1.1 var(--font-d);letter-spacing:.01em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd-star{flex:none;font-size:13px;letter-spacing:-.05em;color:#1c1847}
.art{flex:1;min-height:0;display:grid;place-items:center;background:var(--ac);border:3px solid #1c1847;border-radius:8px;position:relative;overflow:hidden}
.art::before{content:"";position:absolute;width:150%;aspect-ratio:1;left:-25%;bottom:-70%;border-radius:50%;background:rgba(255,255,255,.35)}
.av{position:relative;width:64%;aspect-ratio:1;border-radius:50%;background:#fffaf0;border:3px solid #1c1847;display:grid;place-items:center;font:900 34px/1 var(--font-d);color:#1c1847;overflow:hidden;box-shadow:3px 3px 0 #1c1847}
.av img{width:100%;height:100%;object-fit:cover;display:block}
.stats{display:flex;gap:6px;align-items:center}
.stat{display:flex;align-items:center;gap:4px;padding:1px 7px 1px 5px;border:2px solid #1c1847;border-radius:6px;font:800 13px/1.5 var(--mono);font-variant-numeric:tabular-nums}
.stat svg{width:12px;height:12px}
.dot{margin-left:auto;width:16px;height:16px;border-radius:50%;background:#1c1847}
.cd-foot{display:flex;justify-content:space-between;font:800 10.5px/1.2 var(--mono);letter-spacing:.06em}
.cd-link{font:900 17px/1.25 var(--font-d);word-break:break-all;margin-top:6px}
.face.back .cd-note{font-size:12.5px;line-height:1.45}
.face.back .bars{margin-top:auto;height:26px;color:#1c1847}
.face.back .btn{min-height:40px;padding:0 14px;font-size:14px;box-shadow:3px 3px 0 #1c1847;border-color:#1c1847;color:#1c1847;background:#fffaf0}
.face.back .btn.back-flip{background:transparent;box-shadow:none;min-height:30px;font-size:12px;padding:0 8px}
.face.back .btn:hover{background:var(--c1)}
.back-row{display:flex;gap:6px;flex-wrap:wrap;align-items:center}

/* 常见问题 */
.faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.qa{border:var(--lw) solid var(--line);background:var(--card);padding:20px 22px;border-radius:var(--r);display:grid;gap:8px;align-content:start;box-shadow:6px 6px 0 var(--line)}
.qa:nth-child(odd){transform:rotate(-.5deg)}.qa:nth-child(even){transform:rotate(.5deg)}
.qa:last-child:nth-child(odd){grid-column:1/-1}
.qa h3{font-size:19px;font-weight:900;display:flex;gap:10px;line-height:1.4}
.qa h3::before{content:"Q";font-family:var(--font-d);background:var(--fg);color:var(--card);width:28px;height:28px;display:grid;place-items:center;flex:none;font-size:15px;border-radius:var(--r)}
.qa p{font-size:15px;padding-left:38px}

/* 更多插件：安静的链接 */
.more h2{font-size:15px;font-weight:800;letter-spacing:.06em}
.more>p{margin-top:4px;font-size:14px;opacity:.85}
.more ul{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 28px}
.more li a{display:grid;grid-template-columns:22px minmax(0,1fr);gap:2px 10px;align-items:start;padding:10px 0;border-bottom:1px solid var(--line);text-decoration:none}
.more li a:hover b{text-decoration:underline}
.more .ic{width:22px;height:22px;margin-top:2px}
.more b{font-size:14.5px;font-weight:800}.more b i{font-style:normal;font-weight:600;opacity:.7;margin-left:6px}
.more span{grid-column:2;font-size:13px;line-height:1.5;opacity:.85}
.k6{padding-bottom:calc(var(--eh) + 90px)}

/* 页脚 */
.k7 .in{display:grid;grid-template-columns:1.2fr 1fr;gap:20px 40px;padding:64px 0 48px;font-size:14.5px;font-weight:600}
.big2{font-family:var(--font-d);font-size:46px;font-weight:900;line-height:1;letter-spacing:-.04em;margin-bottom:10px}
.k7 a{color:inherit;font-weight:800}.k7 p+p{margin-top:6px}
.k7 .k{background:transparent;color:inherit;border-color:currentColor}

.big span{display:inline-block}
.lamp{min-height:1.4em;margin-top:-6px;font-size:13px;font-weight:700}
.lamp:not(:empty)::before{content:"";display:inline-block;width:10px;height:10px;margin-right:8px;border-radius:50%;background:#2fbf71;border:2px solid var(--line);vertical-align:-1px}

/* 无 JS 时一切直接可见；有 JS 时区块里的卡片按贴纸「盖章」进入 */
.js .rv{opacity:0;transform:scale(1.35) rotate(.6deg) skewX(-5deg) translateY(-10px)}
.js .rv.in{opacity:1;transform:none;animation:stamp .55s cubic-bezier(.34,1.56,.64,1) backwards;animation-delay:calc(var(--d,0)*70ms)}
.qa.rv.in:nth-child(odd){transform:rotate(-.5deg)}.qa.rv.in:nth-child(even){transform:rotate(.5deg)}
@keyframes stamp{from{opacity:0;transform:scale(1.35) rotate(.6deg) skewX(-5deg) translateY(-10px)}to{opacity:1;transform:none}}
.js .big span{animation:rise .8s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i)*70ms)}
@keyframes rise{from{opacity:0;transform:translateY(46%)}to{opacity:1;transform:none}}
.ticket.shake{animation:shake .45s ease-in-out}
@keyframes shake{20%{transform:translateX(-8px) rotate(-1.1deg)}40%{transform:translateX(8px) rotate(-1.1deg)}60%{transform:translateX(-5px) rotate(-1.1deg)}80%{transform:translateX(4px) rotate(-1.1deg)}}

::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){z-index:1}::view-transition-new(root){z-index:2}

@media (max-width:1000px){
  .hero{grid-template-columns:1fr;gap:12px}
  .disc{width:min(70%,360px);order:-1;margin-top:8px;margin-bottom:20px}
  .room{margin-top:96px}
  .live,.door,.faq{grid-template-columns:1fr}
  .own{grid-template-columns:1fr}.own-l{grid-template-columns:1fr;gap:14px}.own-l li,.own-l li:first-child{padding:0 0 0 14px;border-left:var(--lw) dashed var(--line)}
  .more ul{grid-template-columns:1fr}
  .nav nav{display:none}.skins{margin-left:0}
  .sh p{text-align:left;margin-left:0}
  .deco{display:none}
  .card-form{margin-top:60px}
  .m-tape-slot{right:6%}
}
@media (max-width:640px){
  .wrap{padding:0 16px}
  .k8{padding-top:96px}.bc-grid{grid-template-columns:1fr}.bs-row{padding:10px 12px}.bs-t{font-size:16px}
  .blk{padding-top:56px}.k0{padding-top:0}.k3{padding-top:96px}
  .big{font-size:clamp(104px,34vw,150px)}
  .room{--stub:0px}
  .ticket{grid-template-columns:1fr}
  .tk-main{border-right:var(--lw) solid var(--line);border-radius:var(--r) var(--r) 0 0;padding-left:16px}
  .tk-stub{grid-template-columns:1fr auto;gap:14px;border-left:var(--lw) solid var(--line);border-top:4px dotted var(--line);border-radius:0 0 var(--r) var(--r);padding:10px 14px}
  .tk-stub::before,.tk-stub::after{top:-12px;bottom:auto}
  .tk-stub::before{left:-12px}.tk-stub::after{left:auto;right:-12px}
  .ticket input{font-size:26px}
  .ticket.tearing .tk-stub{animation-name:tear-m}
  @keyframes tear-m{0%{transform:none}25%{transform:translate(0,6px) rotate(-3deg)}100%{transform:translate(60px,120px) rotate(18deg);opacity:0}}
  .m-tape-slot{right:4%;width:84px}
  .feature{grid-template-columns:1fr;gap:10px;padding:22px 18px}
  .m-juke-slot{width:100px;margin-top:-86px}
  .cmd{grid-template-columns:1fr}
  .card-form{padding:22px 18px}
  .btns{grid-template-columns:1fr}
  .skins span{display:none}.seg button{padding:0 9px}
  .screen{padding:44px 12px 12px}
  .k7 .in{grid-template-columns:1fr}
  .vword{display:none}
  .deck{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 14px}
  .cd-name{font-size:13px}
  .m-boom-slot{left:5%;bottom:-56px}.m-radio-slot{right:5%;bottom:-52px}
  .tape{font-size:14px;line-height:34px}
}
@media (hover:none){.tilt{transform:rotateZ(var(--rz,0deg))}.cd:hover{transform:rotate(var(--r,0deg))}}
@media (prefers-reduced-motion:reduce){
  .js .rv{opacity:1;transform:none}.js .big span{animation:none}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .tilt{transform:rotateZ(var(--rz,0deg))}
  .js .sn{animation:none}.sk{animation:none}
  .js .brand .ic,.brand:hover .ic{animation:none}
  .sticker{opacity:1;transform:translate(-50%,0) scale(1) rotate(var(--rot,-6deg))}
  .cd:hover,.cd:focus-within{transform:rotate(var(--r,0deg))}
}
.howto{margin-top:34px}
