/* ===== 语言切换：小地球仪 + 菜单 ===== */
.lr-globe{position:absolute;left:6%;bottom:12%;z-index:8;background:none;border:0;padding:0;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;filter:drop-shadow(2px 3px 0 rgba(0,0,0,.42));transition:transform .18s}
.lr-globe:hover{transform:translateY(-3px) scale(1.08)}
.lr-globe .gl-ball{font-size:clamp(24px,2.7vw,48px);line-height:1;animation:globeSpin 7s linear infinite}
.lr-globe .gl-base{width:62%;height:5px;margin-top:-2px;background:#3a2750;border:2px solid #1a1228;border-radius:0 0 3px 3px}
@keyframes globeSpin{0%{transform:rotateY(0)}100%{transform:rotateY(360deg)}}
@media(prefers-reduced-motion:reduce){.lr-globe .gl-ball{animation:none}}
.lang-back{position:fixed;inset:0;z-index:200;background:rgba(8,6,16,.55);backdrop-filter:blur(3px);
  opacity:0;pointer-events:none;transition:opacity .16s}
.lang-back.show{opacity:1;pointer-events:auto}
.lang-menu{position:fixed;left:50%;top:50%;transform:translate(-50%,-46%) scale(.96);z-index:210;
  opacity:0;pointer-events:none;transition:opacity .16s,transform .16s;
  display:flex;flex-direction:column;gap:8px;min-width:220px;padding:18px;
  background:var(--px-panel);border:4px solid var(--px-line,#090611);box-shadow:8px 8px 0 rgba(0,0,0,.55)}
.lang-menu.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.lang-menu .lm-hd{font-family:'Press Start 2P',monospace;font-size:10px;color:#9b8bff;text-align:center;
  margin-bottom:6px;letter-spacing:1px}
.lang-menu button{font-family:'Poppins';font-weight:700;font-size:14px;color:#e9e2ff;cursor:pointer;text-align:left;
  padding:10px 14px;background:var(--px-panel2);border:3px solid var(--px-line,#090611);box-shadow:4px 4px 0 rgba(0,0,0,.45);
  transition:transform .12s,border-color .12s}
.lang-menu button:hover{transform:translate(-1px,-2px);border-color:#ff9bc7}
.lang-menu button.on{background:linear-gradient(120deg,#9b8bff,#ff84bd);color:#fff;border-color:transparent}
/* language switch — sits in the top nav bar; header is hidden on home, so it auto-hides there */
.lang-fab{display:inline-flex;align-items:center;gap:7px;cursor:pointer;flex:0 0 auto;
  font-family:'Press Start 2P',monospace;color:#fff;
  padding:8px 11px;border-radius:4px;border:3px solid #1a1228;image-rendering:pixelated;
  background:linear-gradient(120deg,#9b8bff,#ff84bd);box-shadow:3px 3px 0 #000;
  transition:transform .1s steps(2),box-shadow .1s steps(2)}
.lang-fab:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 #000}
.lang-fab:active{transform:translate(1px,1px);box-shadow:1px 1px 0 #000}
.lang-fab .lf-cur{font-size:11px;line-height:1;min-width:1.6em;text-align:center}
.lang-fab .lf-tag{font-size:8px;letter-spacing:.04em;color:#ffe9a8;border-left:2px solid rgba(255,255,255,.45);padding-left:7px}
@media(max-width:560px){.lang-fab{padding:7px 9px;gap:0}.lang-fab .lf-tag{display:none}}
/* wall frame: always-visible LANG label (no globe) + hover hint, so it reads as language switch */
/* 与海报融为一体：底部淡淡的标题条，不再是抢眼的小黑框 */
.lr-frame .lang-badge{position:absolute;left:0;right:0;bottom:0;z-index:3;text-align:center;
  font-family:'Press Start 2P',monospace;font-size:5.5px;line-height:1.5;letter-spacing:.5px;
  color:rgba(255,255,255,.66);text-shadow:0 1px 1px rgba(0,0,0,.5);
  background:linear-gradient(transparent,rgba(10,8,22,.5));padding:8px 2px 2.5px;
  pointer-events:none;transition:color .2s}
.lr-frame:hover .lang-badge{color:#fff}
.lr-frame:hover .lr-tip{opacity:1;transform:translate(-50%,-12px)}
/* 地图/语言相框不是 .lr-obj，单独补上 hover tip 末尾的「点击进入」CTA（随语言切换） */
.lr-frame .lr-tip:after{content:var(--cta,"· 点击进入");color:#b5651d;font-size:9px}

/* Perma egg cube + its reset chip are home-page-only.
   The JS-side ensurePermaDevil only re-runs on hashchange (popstate) which doesn't fire
   when script.js calls showPage via pushState — pin the home-only rule in CSS instead. */
body:not(.is-home) #devil-perma,
body:not(.is-home) #devil-reset { display:none !important }
/* Mobile: snug the ↻ reset glyph closer to the perma crystal cube. */
@media(max-width:720px){ #devil-reset{ right:50px !important } }
/* ============ 右上角晶莹剔透小方块（Hellmate 彩蛋常驻按钮）============ */
/* 真·立方体：容器给 perspective，cc-box 居中旋转，6 面各 .7em、translateZ ±.35em（半边长）严丝合缝。
   注意：带 translateZ(em) 的面 font-size 必须保持 1em，否则 em 会按缩小后的字号计算导致错位——
   所以 🎵 放进 .cc-front>b 里单独缩字，不动面本身的字号。 */
.crystal-cube{position:relative;display:inline-block;vertical-align:middle;line-height:1;overflow:visible;
  perspective:2.6em;perspective-origin:50% 42%}
.crystal-cube .cc-box{position:absolute;left:50%;top:50%;width:.7em;height:.7em;margin:-.35em 0 0 -.35em;
  transform-style:preserve-3d;transform:rotateX(-22deg) rotateY(-32deg);
  animation:ccSpin 7s ease-in-out infinite alternate}
.crystal-cube .cc-face{position:absolute;width:.7em;height:.7em;box-sizing:border-box;
  border:1px solid rgba(220,236,255,.9);
  background:linear-gradient(135deg,rgba(150,200,255,.34),rgba(255,255,255,.12) 55%,rgba(190,160,255,.30));
  box-shadow:inset 0 0 9px rgba(255,255,255,.55),inset 0 0 3px rgba(150,200,255,.7)}
.crystal-cube .cc-front{transform:translateZ(.35em);display:flex;align-items:center;justify-content:center}
.crystal-cube .cc-front b{font-size:.36em;text-shadow:0 0 6px rgba(255,255,255,.95)}
.crystal-cube .cc-top{transform:rotateX(90deg) translateZ(.35em);
  background:linear-gradient(135deg,rgba(205,228,255,.55),rgba(255,255,255,.25))}
.crystal-cube .cc-right{transform:rotateY(90deg) translateZ(.35em);
  background:linear-gradient(135deg,rgba(150,180,255,.24),rgba(120,140,230,.40))}
.crystal-cube .cc-horn{position:absolute;top:-2%;z-index:2;width:0;height:0;
  border-left:.095em solid transparent;border-right:.095em solid transparent;
  border-bottom:.26em solid rgba(170,135,240,.92);
  filter:drop-shadow(0 0 2px rgba(190,160,255,.7))}
.crystal-cube .cc-horn.l{left:10%;transform:rotate(-26deg)}
.crystal-cube .cc-horn.r{right:10%;transform:rotate(26deg)}
@keyframes ccSpin{from{transform:rotateX(-22deg) rotateY(-38deg)}to{transform:rotateX(-18deg) rotateY(-22deg)}}
@media (prefers-reduced-motion:reduce){.crystal-cube .cc-box{animation:none}}

/* ============ 活动详情链接（便签弹窗内）============ */
.cal-note .cd-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.cal-note .cd-lk2{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;
  padding:5px 10px;border-radius:7px;background:rgba(155,79,44,.15);color:#8f4420;
  border:1px solid rgba(155,79,44,.34);text-decoration:none}
.cal-note .cd-lk2:hover{background:rgba(155,79,44,.28)}

/* ============ 打歌 · 投票页 ============ */
.music-page .ms-wrap{display:flex;flex-direction:column;gap:14px;max-width:880px;margin:8px auto 0}
.music-page .ms-col{display:flex;flex-direction:column;gap:12px}
.music-page .ms-region{font-family:'Poppins';font-size:13px;font-weight:800;letter-spacing:.6px;color:var(--accent2);
  margin:14px 0 6px;padding:0 4px}
.music-page .ms-region:first-child{margin-top:4px}
.music-page .ms-sub{font-size:14px;font-weight:800;letter-spacing:.5px;color:var(--ink);
  background:var(--surf-l);border:2px solid var(--accent);border-radius:8px;padding:7px 13px;
  box-shadow:3px 3px 0 rgba(0,0,0,.4),0 0 12px -2px rgba(155,139,255,.5);align-self:flex-start}
.music-page .ms-vote-grid{display:flex;flex-direction:column;gap:10px}
.music-page .msv-card{display:flex;align-items:center;gap:12px;text-decoration:none;
  background:linear-gradient(180deg,var(--surf),var(--surf-d));border:3px solid var(--edge);border-radius:12px;
  padding:12px 14px;box-shadow:5px 5px 0 rgba(0,0,0,.4);transition:transform .14s,box-shadow .14s}
.music-page .msv-card:hover{transform:translate(-2px,-3px);box-shadow:7px 8px 0 rgba(0,0,0,.45)}
.music-page .msv-ico{font-size:26px;line-height:1;flex:0 0 auto;filter:drop-shadow(0 2px 2px rgba(0,0,0,.3))}
.music-page .msv-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.music-page .msv-show{font-family:'Poppins';font-weight:800;font-size:14px;color:#f4efff;line-height:1.2}
.music-page .msv-app{font-size:11.5px;color:var(--accent)}
.music-page .msv-win{font-size:11px;color:var(--accent2);margin-top:2px}
.music-page .msv-go{margin-left:auto;color:var(--accent2);font-weight:900;font-size:18px;flex:0 0 auto}
.music-page .ms-stage{display:flex;flex-direction:column;gap:7px;margin-bottom:6px}
.music-page .ms-stg-lk{display:block;text-decoration:none;font-size:12.5px;font-weight:600;color:#ffd9ec;
  background:rgba(255,132,189,.1);border:2px solid rgba(255,132,189,.32);border-radius:9px;padding:8px 12px;
  transition:background .14s,transform .14s}
.music-page .ms-stg-lk:hover{background:rgba(255,132,189,.22);transform:translateX(3px)}
.music-page .ms-wins,.music-page .ms-noms{display:flex;flex-direction:column;gap:8px}
.music-page .ms-nom-row{display:flex;align-items:center;gap:11px;background:rgba(155,139,255,.08);
  border:2px solid rgba(155,139,255,.3);border-radius:10px;padding:9px 12px}
.music-page .msn-med{font-size:22px;line-height:1;flex:0 0 auto}
.music-page .ms-win-row{display:flex;align-items:center;gap:11px;background:rgba(255,210,127,.08);
  border:2px solid rgba(255,210,127,.28);border-radius:10px;padding:9px 12px}
.music-page .msw-cup{font-size:22px;line-height:1;flex:0 0 auto}
.music-page .msw-main{display:flex;flex-direction:column;gap:1px;min-width:0}
.music-page .msw-main b{font-size:13px;color:#fff3d6}
.music-page .msw-main span{font-size:11px;color:var(--muted)}
.music-page .ms-empty{font-size:12.5px;color:var(--muted);padding:6px 2px}
@media(max-width:760px){ .music-page .ms-wrap{gap:12px} }

/* ============ 主页：换主题 = 墙上的旋转「黑胶唱片」（中心标贴用主题色，保持色调）============ */
.lr-switch{position:absolute;left:77.8%;top:37.3%;right:auto;bottom:auto;width:4.2%;height:8%;z-index:6}
/* 手机版位置：必须放在基础规则之后才能压过它（媒体查询不加权重，靠后声明取胜）*/
@media(max-width:720px){ .lr-switch{left:28.6%;top:47.1%;right:auto;bottom:auto;width:7%;height:7%} }
/* 唱片：黑胶盘 + 同心纹槽 + 高光斜带；高度撑满、aspect 锁正圆，水平居中 */
.lr-switch .sw-plate{position:absolute;top:0;left:50%;transform:translateX(-50%);height:100%;aspect-ratio:1;
  border-radius:50%;border:3px solid #07060c;display:grid;place-items:center;overflow:hidden;
  background:
    repeating-radial-gradient(circle at 50% 50%,rgba(255,255,255,.05) 0 1px,transparent 1px 3px),
    radial-gradient(circle at 38% 30%,rgba(255,255,255,.16),transparent 30%),
    radial-gradient(circle at 50% 50%,#1b1622 0 30%,#0a0810 31%,#15121d 70%,#070509 100%);
  box-shadow:0 0 12px var(--accent),4px 4px 0 rgba(0,0,0,.4);
  animation:vinylSpin 4.5s linear infinite}
/* 中心标贴：主题色（随主题变，保持色调）+ 中心轴孔 */
.lr-switch .sw-toggle{position:relative;width:42%;height:42%;border-radius:50%;border:2px solid #07060c;
  background:radial-gradient(circle at 36% 30%,rgba(255,255,255,.5),transparent 50%),linear-gradient(140deg,var(--accent),var(--accent2));
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.3);transition:transform .14s}
.lr-switch .sw-toggle:after{content:"";position:absolute;left:50%;top:50%;width:18%;height:18%;
  transform:translate(-50%,-50%);border-radius:50%;background:#07060c;box-shadow:0 0 0 1px rgba(255,255,255,.25)}
.lr-switch:hover .sw-plate{box-shadow:0 0 22px var(--accent2),4px 4px 0 rgba(0,0,0,.4);animation-duration:1.4s}
.lr-switch:hover .sw-toggle{transform:scale(1.08)}
@keyframes vinylSpin{to{transform:translateX(-50%) rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.lr-switch .sw-plate{animation:none}}

/* 主题菜单的色板小点（复用 .lang-menu 外壳）*/
.theme-menu button{display:flex;align-items:center;gap:9px}
.theme-menu .tm-sw{width:14px;height:14px;border-radius:3px;border:2px solid rgba(0,0,0,.5);flex:0 0 auto;
  background:linear-gradient(135deg,var(--s1,#9b8bff),var(--s2,#ff84bd))}

/* Hellmate: per-pillow LOADING overlay — sits just above each of the 7 plush pillows.
   Spinner is a radial ring of white dots (one fades around to look like a spinner),
   followed by "LOADING..." text that stays upright. */
.lr-person .lr-loading{position:absolute;left:50%;bottom:100%;transform:translate(-50%,-2px);z-index:20;
  display:flex;flex-direction:column;align-items:center;gap:1px;pointer-events:none;
  font-family:'Press Start 2P',monospace;font-size:5.5px;letter-spacing:.5px;color:#fff;
  text-shadow:1px 1px 0 #1a1228,0 0 4px rgba(255,255,255,.55);white-space:nowrap}
.lr-loading .ll-spin{position:relative;width:18px;height:18px}
.lr-loading .ll-spin i{position:absolute;left:50%;top:50%;width:2.4px;height:2.4px;border-radius:50%;background:#fff;
  margin:-1.2px 0 0 -1.2px;transform:rotate(var(--a)) translateY(-7px);transform-origin:center;
  opacity:.22;animation:llFade .9s linear infinite;animation-delay:var(--d)}
@keyframes llFade{0%,12%{opacity:1}40%,100%{opacity:.22}}
.lr-loading .ll-txt{display:inline-flex;align-items:baseline}
.lr-loading .ll-dot{display:inline-block;width:.65em;text-align:left;opacity:0;
  animation:llDot 1.1s ease-out forwards}
.lr-loading .ll-dot:nth-child(1){animation-delay:.2s}
.lr-loading .ll-dot:nth-child(2){animation-delay:.45s}
.lr-loading .ll-dot:nth-child(3){animation-delay:.7s}
.lr-loading .ll-dot::before{content:"."}
@keyframes llDot{0%{opacity:0}100%{opacity:1}}
@media(prefers-reduced-motion:reduce){.lr-loading .ll-spin i{animation:none;opacity:1}.lr-loading .ll-dot{animation:none;opacity:1}}
/* While loading shows, plush pillows must not sway or tilt */
.lr-people.loading-pause .lr-person{animation:none !important}
.lr-people.loading-pause .lr-person:hover{transform:none !important}

/* Hellmate 主题：从底部飘上的带角小恶魔（仿 MV 的蓝粉小球）*/
.devil-bit{position:fixed;z-index:9997;pointer-events:none;border-radius:50%;
  background:radial-gradient(circle at 36% 30%,rgba(255,255,255,.6),transparent 42%),var(--c,#ff7ab0);
  box-shadow:0 0 10px var(--c,#ff7ab0),inset -3px -3px 0 rgba(0,0,0,.12)}
/* 角随泡泡缩放（font-size=泡泡直径，用 em）：两角分开不重合，比例固定 */
.devil-bit::before,.devil-bit::after{content:"";position:absolute;top:-0.3em;width:0;height:0;
  border-left:0.15em solid transparent;border-right:0.15em solid transparent;border-bottom:0.34em solid #fff6df;
  filter:drop-shadow(0 0 0.04em rgba(0,0,0,.2))}
.devil-bit::before{left:0.12em;transform:rotate(-20deg)}
.devil-bit::after{right:0.12em;transform:rotate(20deg)}

/* Hellmate：背景墙的巨型小恶魔泡泡（JS 随机生成；圆脸 + 大眼带高光 + 腮红 + 可爱表情；
   半透明泡泡感；font-size = 脸直径，内部用 em 缩放）*/
.big-devil{position:absolute;z-index:0;pointer-events:none;border-radius:50%;image-rendering:auto;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle at 40% 34%,color-mix(in srgb,var(--c) 80%,#fff),var(--c) 60%,color-mix(in srgb,var(--c) 78%,#000) 100%);
  box-shadow:inset -0.08em -0.1em 0.2em rgba(0,0,0,.14),0 0.05em 0.28em rgba(0,0,0,.15)}
.big-devil>span{position:absolute}
/* 角：柔和奶油色 */
.big-devil .bd-horn{top:-0.14em;width:0;height:0;
  border-left:0.095em solid transparent;border-right:0.095em solid transparent;border-bottom:0.22em solid #fff1d2;
  filter:drop-shadow(0 0.02em 0.02em rgba(0,0,0,.18))}
.big-devil .bd-horn.l{left:0.2em;transform:rotate(-18deg)}
.big-devil .bd-horn.r{right:0.2em;transform:rotate(18deg)}
/* 眼睛：像洛杉矶巨蛋的 emoji——白眼球 + 会动的黑眼珠（两眼同步看左 / 右 / 下）*/
.big-devil .bd-eye{top:0.37em;width:0.155em;height:0.175em;border-radius:50%;background:#fff;overflow:hidden;
  box-shadow:inset 0 0.01em 0.02em rgba(0,0,0,.25)}
.big-devil .bd-eye.l{left:0.23em}.big-devil .bd-eye.r{right:0.23em}
/* 彩蛋恶魔（计数/常驻）：不要眼白，纯深色小圆点眼 + 微笑（无墨镜/无白眼球）*/
.cute-devil .bd-eye{top:0.37em;width:0.135em;height:0.18em;border-radius:50%;background:#3a2030;box-shadow:none;overflow:visible}
.cute-devil .bd-eye.l{left:0.235em}.cute-devil .bd-eye.r{right:0.235em}
.big-devil.cute-devil .bd-pupil{display:none}
.cute-devil .bd-blush{display:none}   /* 彩蛋恶魔不要腮红 */
/* 微笑：宽而浅的底弧（圆环只留底边 → 整条一样粗），明显上扬的笑 */
.big-devil.cute-devil.m-happy .bd-mouth{width:0.36em;height:0.26em;top:0.52em;
  border:0.08em solid transparent;border-bottom-color:#5a2f48;border-radius:50%;background:none;box-sizing:border-box}
.big-devil .bd-pupil{position:absolute;left:50%;top:50%;width:0.082em;height:0.094em;border-radius:50%;
  background:#3a2030;transform:translate(-50%,-50%);
  /* 只变一次：先停在起始位（中/左/右/上/下），再转去看向对方 */
  animation:bd-look 2.2s ease-in-out .35s both}
@keyframes bd-look{
  0%,40%{transform:translate(calc(-50% + var(--sx,0em)),calc(-50% + var(--sy,0em)))}
  64%,100%{transform:translate(calc(-50% + var(--px,0em)),calc(-50% + var(--py,0em)))}
}
@media (prefers-reduced-motion:reduce){ .big-devil .bd-pupil{animation:none} }
/* 腮红：眼睛外侧的粉圆 */
.big-devil .bd-blush{top:0.47em;width:0.11em;height:0.07em;border-radius:50%;
  background:rgba(255,120,160,.55);filter:blur(0.01em)}
.big-devil .bd-blush.l{left:0.2em}.big-devil .bd-blush.r{right:0.2em}
/* 嘴：如图——小小张开的笑嘴，居中靠上 */
.big-devil .bd-mouth{left:50%;top:0.5em;transform:translateX(-50%);width:0.1em;height:0.075em;box-sizing:border-box}
.big-devil.m-happy .bd-mouth{border:0.028em solid #5a2f48;border-top:0;border-radius:0.02em 0.02em 1em 1em;background:rgba(120,50,80,.22)}
/* 酷：歪一边的斜嘴 smirk（保留圆点眼，无墨镜）*/
.big-devil.m-cool .bd-mouth{height:0;width:0.12em;border-bottom:0.032em solid #5a2f48;top:0.55em;border-radius:0 0 1em 1em;
  transform:translateX(-40%) rotate(-12deg)}

/* Hellmate：主页客厅也换 MV 蓝粉配色（亮蓝墙 + 粉地板 + 蓝粉天空）。
   房间色变量定义在 .lr-stage 上（元素级），所以要用元素级规则覆盖，documentElement 改不到 */
html[data-theme="hellmate"] .lr-stage{
  --wall:#4f9fd6;--wall2:#6fbdf0;--floor:#e07a9c;--floor2:#ef9bb8;--wood:#cf6088;
  --px-dark:#13203a;--px-shadow:#0a1226;background:#0a1226}
html[data-theme="hellmate"] .lr-sky{
  background:
    repeating-linear-gradient(90deg,transparent 0 7px,rgba(255,255,255,.06) 7px 8px),
    linear-gradient(#7fc4f0 0 45%,#bcdcf2 45% 70%,#ff9bb5 70% 100%)}
html[data-theme="hellmate"] .lr-rug{background:repeating-linear-gradient(90deg,#d96a96 0 16px,#b85078 16px 32px)}
/* 蓝墙花纹：交错小波点（粉 + 白），只铺墙面区，不动地板渐变 */
html[data-theme="hellmate"] .lr-room{
  background:
    radial-gradient(circle,rgba(255,255,255,.14) 2px,transparent 2.5px) 0 0/30px 30px,
    radial-gradient(circle,rgba(255,158,196,.20) 2px,transparent 2.5px) 15px 15px/30px 30px,
    linear-gradient(180deg,var(--wall) 0%,var(--wall2) 60%,var(--wood) 74%,var(--floor) 100%)}

/* ---- 站内搜索 Site search ---- */
.search-btn{background:none;border:0;font-size:1.15rem;cursor:pointer;color:inherit;padding:6px 8px;line-height:1}
.search-btn:hover{transform:scale(1.12)}
.search-ovl{position:fixed;inset:0;z-index:9999;background:rgba(8,6,16,.72);backdrop-filter:blur(4px);display:none;align-items:flex-start;justify-content:center}
.search-ovl.show{display:flex}
.search-box{margin-top:11vh;width:min(620px,92vw);background:#15101f;border:1px solid #2c2440;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.55);overflow:hidden}
.search-input{width:100%;box-sizing:border-box;padding:16px 18px;font-size:1rem;background:#1c1530;border:0;border-bottom:1px solid #2c2440;color:#f3ecff;outline:none}
.search-input::placeholder{color:#8b7fa8}
.search-res{max-height:62vh;overflow-y:auto}
.search-empty{padding:22px;text-align:center;color:#8b7fa8;font-size:.9rem}
.search-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:11px 16px;background:none;border:0;border-bottom:1px solid #221b33;color:#eee;cursor:pointer;font:inherit}
.search-item:hover,.search-item:focus{background:#241c3b}
.si-cat{flex:none;font-size:.7rem;padding:2px 7px;border-radius:6px;color:var(--c);border:1px solid var(--c);opacity:.9}
.si-label{font-weight:600;color:#f3ecff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.si-sub{color:#9b8fb8;font-size:.82rem;margin-left:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42%}
.search-flash{animation:searchFlash 1.9s ease;position:relative;z-index:5}
@keyframes searchFlash{0%,100%{outline:0 solid transparent;outline-offset:2px;box-shadow:none}
  15%,55%{outline:3px solid rgba(255,155,199,.95);outline-offset:3px;box-shadow:0 0 20px rgba(255,155,199,.6)}}

/* ============================================================
   专辑曲目 · Option A 子行布局 (录制/舞台/不同形态/应援)
   桌面：sections 水平流动 + wrap，省右侧空白；移动：垂直堆叠
   ============================================================ */
.track-list .track{flex-direction:column;align-items:stretch;gap:5px}
.track-list .t-head{flex:1 0 100%;padding:0 2px}
.t-sections{display:flex;flex-flow:row wrap;gap:5px 14px;padding:0 2px 2px 30px;align-items:center}
.t-sec{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto}
.t-sec-l{font-size:9.5px;font-weight:700;letter-spacing:.5px;color:var(--muted);
  text-transform:uppercase;padding:2px 6px;border-radius:4px;background:rgba(255,255,255,.04);
  border-left:2px solid var(--sec-c,rgba(255,255,255,.18));align-self:center;text-align:center;white-space:nowrap;flex:0 0 auto}
.t-sec-rec   {--sec-c:#ff9b9b}
.t-sec-stage {--sec-c:#9bb5ff}
.t-sec-forms {--sec-c:#ff9ecb}
.t-sec-cheer {--sec-c:#ffd27f}
.t-sec-links{display:inline-flex;flex-wrap:wrap;gap:5px;align-items:center;min-width:0}
.tl-grp i.g-stages{color:#9bb5ff}
.tl-grp i.g-live{color:#7fc4d4}
.tl-grp i.g-awards{color:#ffd27f}
.tl-grp i.g-forms{color:#ff9ecb}
/* playlist 标记 — 双▶ 区别于单视频 */
.t-links .tl.list,.t-sec-links .tl.list{background:rgba(0,0,0,.18);font-weight:800;letter-spacing:.5px}
.t-links .tl.list.yt:hover,.t-sec-links .tl.list.yt:hover{box-shadow:0 0 8px rgba(255,61,61,.45)}
.t-links .tl.list.bili:hover,.t-sec-links .tl.list.bili:hover{box-shadow:0 0 8px rgba(0,174,236,.45)}
@media(max-width:640px){
  /* 移动端：sub-section 标签置于 links 上方一行 (避免 EN "PRODUCTION" 越栏)
     padding 全清 → 留更多横向空间放小药丸 */
  .t-sections{flex-direction:column;align-items:stretch;gap:3px;padding:0}
  .t-sec{display:flex;flex-direction:column;gap:2px;align-items:stretch}
  .t-sec-l{font-size:8.5px;padding:1px 5px;align-self:flex-start;letter-spacing:.3px}
  .t-sec-links{display:flex;flex-wrap:wrap;gap:4px}
  /* track 行整体也收紧 */
  .track-list .track{padding:5px 2px;gap:3px}
  .track-list .t-head{padding:0}
  .t-num{width:18px;flex-basis:18px;font-size:11px}
  .t-name{font-size:13px}
}

/* ============================================================
   NEXZ.LIB · VS Code 风暗色终端
   规则: 背景全黑；语义色 (注释绿 / 数字青 / 字符串琥珀 / 关键字 = 主题色)
        边框/激活/LED 跟随 var(--accent) / var(--accent2)，主题切换自动换色
   ============================================================ */
.nexz-lib-page{
  --crt-bg:#000;
  --crt-panel:#0a0a0d;      /* bar 略带灰，区别纯黑卡面 */
  --crt-ink:#e8e1f5;
  --crt-comment:#5fa37f;    /* VS Code 注释绿 */
  --crt-number:#7fd6f5;     /* 数字青 */
  --crt-string:#e0a86b;     /* 字符串琥珀 */
  --crt-keyword:var(--accent);   /* 关键字 = 主题色 (紫/粉) */
  --crt-key2:var(--accent2);     /* 次关键字 = 副主题色 */
  --crt-line:color-mix(in srgb,var(--accent) 30%,transparent);
  --crt-line2:color-mix(in srgb,var(--accent) 14%,transparent);
  --crt-glow:color-mix(in srgb,var(--accent) 55%,transparent);
}
.nexz-lib-page .section-head h2{color:var(--ink);text-shadow:0 0 14px var(--crt-glow)}
.nexz-lib-page .section-head .sec-idx{color:var(--accent);letter-spacing:3px}
.lib-crt{max-width:1180px;margin:18px auto 0;background:var(--crt-bg);
  border:1px solid var(--crt-line);border-radius:10px;padding:0;overflow:hidden;
  box-shadow:0 14px 44px rgba(0,0,0,.65),0 0 60px color-mix(in srgb,var(--accent) 10%,transparent);
  font-family:'Cascadia Code','JetBrains Mono','Consolas','Source Code Pro','Courier New',monospace;
  color:var(--crt-ink);position:relative}
/* 轻 scanline (1px/3px)；不要 grid 干扰 */
.lib-crt:before{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px);
  border-radius:10px;z-index:1}
.lib-crt > *{position:relative;z-index:2}
/* 顶 status bar */
.crt-bar{display:flex;align-items:center;gap:10px;padding:8px 14px;
  background:var(--crt-panel);border-bottom:1px solid var(--crt-line);
  color:var(--crt-string);font-size:12px;font-weight:700;letter-spacing:.6px}
.crt-led{width:8px;height:8px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 8px var(--accent),0 0 14px color-mix(in srgb,var(--accent) 60%,transparent);animation:libLed 2.4s ease-in-out infinite}
@keyframes libLed{0%,100%{opacity:.55;transform:scale(.92)}50%{opacity:1;transform:scale(1)}}
.crt-bar-t{flex:1;text-shadow:0 0 8px color-mix(in srgb,var(--crt-string) 50%,transparent);font-family:inherit;color:var(--crt-string)}
.crt-bar-r{font-size:11px;color:var(--crt-number);letter-spacing:.4px;font-weight:800;text-shadow:0 0 6px color-mix(in srgb,var(--crt-number) 50%,transparent)}
.crt-body{padding:14px 16px 16px}
.crt-search{display:flex;flex-direction:column;gap:5px;margin-bottom:8px}
.crt-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-height:28px}
/* prompt 用主题色 (关键字) */
.crt-prompt{flex:0 0 auto;color:var(--crt-keyword);font-size:11.5px;font-weight:800;
  white-space:nowrap;font-family:inherit;letter-spacing:.6px;text-shadow:0 0 6px var(--crt-glow)}
.crt-row-q{align-items:center}
#libQ{flex:1;min-width:220px;background:#0a0a0d;border:1px solid var(--crt-line2);border-radius:3px;
  color:var(--crt-ink);font:inherit;font-size:13px;padding:6px 10px;outline:0;letter-spacing:.4px;caret-color:var(--accent2)}
#libQ::placeholder{color:var(--crt-comment);opacity:.5}
#libQ:focus{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 22%,transparent)}
.crt-clear{background:transparent;border:1px solid var(--crt-line2);color:var(--crt-comment);font:inherit;font-size:11px;padding:3px 8px;border-radius:3px;cursor:pointer}
.crt-clear:hover{color:var(--crt-ink);border-color:var(--accent)}
.crt-chips{display:flex;flex-wrap:wrap;gap:5px;flex:1;min-width:0}
.crt-chip{background:#0a0a0d;border:1px solid var(--crt-line2);color:var(--crt-comment);
  font:inherit;font-size:11px;font-weight:700;padding:3px 9px;border-radius:3px;cursor:pointer;
  letter-spacing:.4px;transition:all .14s;white-space:nowrap}
.crt-chip:hover{color:var(--crt-ink);border-color:var(--accent)}
.crt-chip.on{background:var(--accent);color:#fff;border-color:var(--accent);
  box-shadow:0 0 8px var(--crt-glow),0 0 0 1px color-mix(in srgb,var(--accent) 60%,transparent) inset}
.crt-chip.tag.on{background:var(--cc,var(--accent));border-color:var(--cc,var(--accent));
  box-shadow:0 0 10px color-mix(in srgb,var(--cc,var(--accent)) 60%,transparent);color:#fff}
.crt-chip .crt-dir{font-size:10px;margin-left:3px;opacity:.95;color:var(--crt-string)}
.crt-chip.on .crt-dir{color:#fff}
/* 分隔线 = 注释绿 */
.crt-divider,.crt-foot{font-size:10.5px;color:var(--crt-comment);opacity:.45;letter-spacing:0;white-space:nowrap;overflow:hidden;margin:8px 0;font-family:inherit}
.crt-foot{margin-top:10px;text-align:center}
.crt-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px;align-items:stretch}
.crt-empty{text-align:center;padding:36px 16px;color:var(--crt-string);font-size:13px;letter-spacing:1.5px;
  text-shadow:0 0 6px color-mix(in srgb,var(--crt-string) 50%,transparent)}

/* 单条结果卡 · 终端条目 (VS Code 语义色) */
.lib-card{position:relative;background:#0a0a0d;
  border:1px solid var(--crt-line2);border-left:3px solid var(--bc,var(--accent));
  border-radius:3px;padding:9px 11px;display:flex;flex-direction:column;gap:4px;color:var(--crt-ink);min-height:128px;
  transition:border-color .14s,background .14s,transform .14s}
.lib-card:hover{background:#101015;border-color:var(--accent);transform:translateY(-1px)}
/* 数字 (idx) 用青色 — 右上角 absolute */
.lc-idx{position:absolute;top:7px;right:9px;font-size:10px;color:var(--crt-number);letter-spacing:.5px;font-weight:700;opacity:.8}
/* tag + 更新日期 同一行 flex — 避免 absolute 与 tag 重叠 */
.lc-top{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding-right:36px;min-height:18px}
.lc-upd{font-size:9.5px;color:var(--crt-string);letter-spacing:.4px;font-weight:700;opacity:.88;white-space:nowrap}
/* tag chip 保留分类色 */
.lc-tag{align-self:flex-start;font-size:9.5px;font-weight:700;padding:2px 7px;border-radius:3px;
  background:linear-gradient(180deg,var(--bc),var(--bc2));color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.45);letter-spacing:.5px}
/* 标题用琥珀 (string) — 像 VS Code 函数名/字符串 */
.lc-title{margin:2px 0 0;font-size:13px;font-weight:800;line-height:1.25;color:var(--crt-string);
  text-shadow:0 0 6px color-mix(in srgb,var(--crt-string) 35%,transparent);font-family:'Poppins','Noto Sans SC',sans-serif}
/* 中文名用 ink */
.lc-cn{margin:0;font-size:11.5px;line-height:1.3;color:var(--crt-ink);opacity:.92}
/* 描述用注释绿 */
.lc-desc{margin:0;font-size:10.5px;line-height:1.35;color:var(--crt-comment);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-style:italic}
/* 成员用主题色 (关键字) */
.lc-mem{margin:0;font-size:10px;color:var(--crt-keyword);letter-spacing:.3px;font-weight:600}
.lc-btns{display:flex;gap:5px;margin-top:auto;padding-top:5px}
.lc-btn{flex:1;text-align:center;font:inherit;font-size:10.5px;font-weight:800;padding:5px 8px;border-radius:3px;
  border:1px solid var(--crt-line);text-decoration:none;letter-spacing:.5px;transition:all .14s}
.lc-btn.yt{color:#ff9b9b;background:rgba(255,90,90,.06);border-color:rgba(255,90,90,.32)}
.lc-btn.yt:hover{background:rgba(255,90,90,.22);color:#fff;border-color:#ff5a5a;box-shadow:0 0 8px rgba(255,90,90,.4)}
.lc-btn.bili{color:#7fd6f5;background:rgba(0,174,236,.06);border-color:rgba(0,174,236,.32)}
.lc-btn.bili:hover{background:rgba(0,174,236,.22);color:#fff;border-color:#00aeec;box-shadow:0 0 8px rgba(0,174,236,.4)}
.lc-btn.srch{opacity:.78}

/* CRT 开机转场动画 — 入场一次 */
.lib-crt.in{animation:libBoot 1.05s ease-out 1}
@keyframes libBoot{
  0%  {opacity:0;transform:scale(.985);filter:brightness(0)}
  18% {opacity:1;filter:brightness(2.6);transform:scaleY(.04) scaleX(1)}
  28% {opacity:1;filter:brightness(1.8);transform:scaleY(1) scaleX(1)}
  100%{opacity:1;filter:brightness(1);transform:scale(1)}
}
.lib-crt.in .crt-search,.lib-crt.in .crt-results,.lib-crt.in .crt-divider,.lib-crt.in .crt-foot{animation:libContentIn .55s ease-out .35s 1 both}
.lib-crt.in .crt-bar{animation:libBarIn .35s ease-out .1s 1 both}
@keyframes libBarIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@keyframes libContentIn{from{opacity:0;transform:translateY(8px) skewY(.4deg)}to{opacity:1;transform:none}}
/* 扫描线扫过 */
.lib-crt.in:before{animation:libScan 1.2s ease-out 1}
@keyframes libScan{
  0%   {background-position:0 -100%}
  60%  {background-position:0 0}
  100% {background-position:0 0}
}
@media (prefers-reduced-motion: reduce){
  .lib-crt.in,.lib-crt.in .crt-bar,.lib-crt.in .crt-search,.lib-crt.in .crt-results,.lib-crt.in .crt-divider,.lib-crt.in .crt-foot,.lib-crt.in:before{animation:none}
  .crt-led{animation:none}
}

/* 移动端：紧凑双列 */
@media(max-width:640px){
  .crt-body{padding:11px 12px 14px}
  .crt-bar{padding:8px 12px;font-size:11px}
  .crt-bar-r{display:none}
  .crt-row{gap:6px;min-height:0}
  .crt-prompt{font-size:11px;flex-basis:100%}
  .crt-chip{font-size:10px;padding:2px 7px}
  .crt-results{grid-template-columns:repeat(2,1fr);gap:6px}
  .lib-card{padding:7px 8px;min-height:115px;gap:3px}
  .lc-title{font-size:12px}
  .lc-cn{font-size:10.5px}
  .lc-desc{font-size:9.5px;-webkit-line-clamp:2}
  .lc-mem{font-size:9.5px}
  .lc-btn{font-size:9.5px;padding:4px 5px}
  .lc-idx{font-size:9px;top:5px;right:7px}
  .lc-upd{font-size:8.5px;letter-spacing:.2px}
  .lc-top{padding-right:28px;min-height:0;gap:5px}
  .lc-tag{font-size:8.5px;padding:2px 5px}
  .crt-divider,.crt-foot{font-size:9px}
}
@media(min-width:1024px){
  .crt-results{grid-template-columns:repeat(3,1fr)}
}

/* ============================================================
   手机端 section-head 紧凑化 (所有子页通用)
   原 pixel.css: padding 18 22 / margin-bottom 46 / h2 clamp(21,3vw,34) — 占地大
   ============================================================ */
@media(max-width:720px){
  .section-head{padding:9px 12px;margin-bottom:22px;border-width:3px;box-shadow:5px 5px 0 #000}
  .section-head h2{font-size:clamp(15px,5.2vw,21px) !important;margin:3px 0 5px;text-shadow:2px 2px 0 #000;line-height:1.15}
  .section-head .sec-idx{font-size:10.5px;letter-spacing:1.5px}
  .section-head p{font-size:11px;line-height:1.4}
  /* 子页顶部留白 — 固定 header 82px 高，加 14px 呼吸；底部稍多以平衡 */
  section.page{padding-top:96px}
  .section{padding:24px 22px 52px}
}

/* 专辑封面 (TV 屏内) — 收掉 min-height + 顶 padding 减小，让内容贴近顶部 */
@media(max-width:640px){
  .tvs .album-cover,.album-cover{min-height:auto;padding:10px 14px;gap:3px}
  .ac-title,.tvs .ac-title{font-size:clamp(20px,5.4vw,28px);line-height:1}
  .ac-type{font-size:9.5px;padding:3px 8px}
  .ac-date{font-size:11px}
  /* 成员肖像卡 — 收掉过高的 min-height + 内边距 */
  .csc-portrait{min-height:170px;padding:10px 12px}
  .csc-emoji{font-size:72px;margin:8px 0}
  .csc-idx{top:8px;left:10px;font-size:10px;padding:3px 7px}
  .csc-mbti{padding:5px 8px}
  .csc-info{padding:14px 16px 18px}
  .csc-info>h3{font-size:21px}
  .csc-zoo{margin:6px 0 10px;font-size:12px}
}

/* NEXZ.LIB · FILTERS 单顶折叠 — 整行可点 + caret 右侧 + 收起时 caret 脉冲 + 提示 */
.crt-filters-head{cursor:pointer;user-select:none;transition:background .15s;border-radius:3px}
.crt-filters-head:hover{background:color-mix(in srgb,var(--accent) 8%,transparent)}
.crt-filters-head .crt-prompt{cursor:pointer;user-select:none}
.crt-filters-head .crt-prompt:after{content:" ▸";color:var(--accent2);font-size:13px;margin-left:4px;display:inline-block;transition:transform .2s}
.crt-filters-head[data-fold="1"] .crt-prompt:after{content:" ▾"}
.crt-filters-head[data-fold="0"] .crt-prompt:after{animation:libCaretPulse 1.6s ease-in-out 0s 3}
@keyframes libCaretPulse{0%,100%{transform:translateX(0);opacity:.7}50%{transform:translateX(3px);opacity:1}}
.crt-filters-hint{color:var(--crt-comment);font-size:10px;font-style:italic;letter-spacing:.3px;margin-left:auto;opacity:.7}
.crt-filters-head[data-fold="1"] .crt-filters-hint{display:none}
.crt-filters-head[data-fold="0"] + .crt-filters{display:none}
.crt-filters-head .crt-summary{color:var(--crt-string);font-size:11px;font-weight:700;letter-spacing:.3px}

/* 手机导航条 — 04-pixel.css 把 .nav a padding 改成 7/0；这里恢复 mobile padding */
@media(max-width:720px){
  .nav a{padding:14px 26px !important}
}
