:root {
  --bg: #0f1013;
  --panel: #191b20;
  --line: rgba(255, 255, 255, .1);
  --text: #efede8;
  --dim: #8f949e;
  --live: #ff3b3b;
  --gold: #ffc94a;
  --bond: #6fdc8c;
  --wander: #6fb6ff;
  --sus: #ff7a6b;
  --pink: #ff9cc0;
  --mono: ui-monospace, 'SF Mono', Menlo, monospace;
  --tmono: 'VT323', ui-monospace, Menlo, monospace;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font: 15px/1.7 -apple-system, 'PingFang SC', 'Noto Sans SC', sans-serif; }
.dim { color: var(--dim); }
.gold { color: var(--gold); }
img.miss { visibility: hidden; }
.btn { border: 1px solid var(--line); background: var(--panel); color: var(--text); border-radius: 10px; padding: 10px 18px; cursor: pointer; font: inherit; }
.btn.primary { background: var(--gold); color: #1a1406; border: 0; font-weight: 700; }
.btn.big { padding: 14px 40px; font-size: 17px; }
.btn.wide { width: 100%; margin-top: 12px; }
.btn:active, .opt:active, .pick:active { transform: scale(.98); }
.rec { color: var(--live); font-family: var(--mono); font-weight: 700; letter-spacing: .05em; animation: blink 1.4s infinite; }
@keyframes blink { 50% { opacity: .35; } }

/* 布局：舞台 + 控制台 */
.game { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 14px; padding: 14px; max-width: 1500px; margin: 0 auto; align-items: start; }
.console { display: grid; gap: 10px; }

/* 舞台 */
.stage { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: linear-gradient(160deg, #2a2f3a, #14161b); cursor: pointer; user-select: none; }
.stage .bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.figs { position: absolute; inset: 6% 0 0 0; }
.fig { position: absolute; bottom: 0; height: calc(92% * var(--h, 1)); left: calc((var(--i) + .5) / var(--n) * 100%); transform: translateX(-50%); transition: filter .25s, transform .25s; }
.fig img { height: 100%; display: block; filter: drop-shadow(0 6px 18px rgba(0, 0, 0, .35)); }
.fig.dim { filter: brightness(.6) saturate(.8); }
.fig.on { transform: translateX(-50%) scale(1.03); }
.fig-name { display: none; }
.fig img.miss + .fig-name { display: block; position: absolute; bottom: 40%; left: 50%; transform: translateX(-50%); padding: 4px 10px; background: rgba(0, 0, 0, .5); border-radius: 8px; }
.osd { position: absolute; top: 12px; left: 14px; display: flex; gap: 10px; align-items: baseline; font-size: 13px; text-shadow: 0 1px 4px rgba(0, 0, 0, .7); }
.osd small { color: #ddd; }

.dlg { position: absolute; left: 3%; right: 3%; bottom: 4%; min-height: 26%; padding: 16px 22px 14px; border-radius: 14px; background: rgba(18, 20, 26, .86); backdrop-filter: blur(6px); border: 1px solid rgba(255, 255, 255, .12); font-size: clamp(14px, 1.5vw, 19px); }
.dlg p { margin: 0; }
.tagname { position: absolute; top: -14px; left: 18px; padding: 2px 14px; border-radius: 8px; background: var(--gold); color: #1a1406; font-weight: 800; font-size: 14px; }
.tagname.ear { background: var(--live); color: #fff; }
.dlg.narr { font-style: italic; color: #e2dfd6; background: rgba(10, 11, 14, .78); }
.dlg.room { border-color: rgba(255, 59, 59, .5); color: #ffd2d2; }
.dlg.cue { border-color: var(--live); }
.dlg .chips { margin-top: 6px; }
.more { position: absolute; right: 5%; bottom: 7%; color: var(--gold); animation: bob 1s infinite; }
@keyframes bob { 50% { transform: translateY(4px); } }
.wait { position: absolute; top: 12px; right: 14px; background: var(--live); color: #fff; font-weight: 700; font-size: 13px; padding: 4px 12px; border-radius: 99px; animation: blink 1.2s infinite; }
.stage.ph-choose { cursor: default; }

/* 控制台卡片 */
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; }
.card p { margin: 4px 0; }
.tag { font-size: 13px; font-weight: 800; color: var(--gold); margin-bottom: 6px; }
.tag.red { color: var(--live); }
.tag small { display: block; font-weight: 400; color: var(--dim); }
.him-head { display: flex; gap: 10px; align-items: center; margin-bottom: 6px; }
.him-head small { display: block; color: var(--dim); font-size: 12px; }
.ava { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; object-position: 50% 8%; background: #2a2d34; }
.mood { margin-left: 8px; padding: 0 8px; border-radius: 99px; font-size: 12px; color: #111; font-weight: 700; }
.mood.go { background: var(--sus); }
.mood.mid { background: var(--gold); }
.mood.stay { background: var(--bond); }
.meter { display: grid; grid-template-columns: 34px 1fr 18px; align-items: center; gap: 8px; font-size: 12px; }
.meter i { height: 6px; background: #2a2d34; border-radius: 3px; overflow: hidden; }
.meter em { display: block; height: 100%; transition: width .5s; }
.meter em.bond { background: var(--bond); }
.meter em.wander { background: var(--wander); }
.meter em.sus { background: var(--sus); }
.meter b { font-family: var(--mono); text-align: right; }
.actors { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
.actor { font-size: 12px; background: #22252b; border-radius: 10px; padding: 6px 10px; display: grid; }
.actor small { color: var(--dim); }
.actor span { color: var(--pink); letter-spacing: .08em; }

.pick { width: 100%; text-align: left; display: grid; gap: 2px; background: #22252b; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin-top: 8px; color: var(--text); cursor: pointer; font: inherit; }
.pick:hover, .opt:hover { border-color: var(--gold); }
.p-time { font-size: 12px; color: var(--dim); font-family: var(--mono); }
.p-title { font-size: 19px; font-weight: 800; }
.p-title small { font-size: 12px; color: var(--pink); font-weight: 400; margin-left: 8px; }
.p-pitch { font-size: 13px; color: var(--dim); }

.ear-card { border-color: rgba(255, 59, 59, .55); box-shadow: 0 0 0 3px rgba(255, 59, 59, .12); }
.opt { width: 100%; text-align: left; display: grid; gap: 6px; border: 1px solid var(--line); background: #22252b; color: var(--text); border-radius: 12px; padding: 12px 14px; margin-top: 8px; cursor: pointer; font: inherit; }
.chips { display: flex; flex-wrap: wrap; gap: 4px; }
.fx { font-size: 11px; font-family: var(--mono); padding: 1px 6px; border-radius: 4px; background: #2c3038; }
.fx.up { color: var(--bond); }
.fx.down { color: var(--sus); }
.fx.r { color: var(--gold); }
.fx.r.down { color: var(--sus); }
.fx.n { color: var(--pink); }
.big { font-family: var(--mono); font-size: 40px; font-weight: 800; }
.big small { font-size: 16px; color: var(--dim); }
.big.ok { color: var(--bond); }
.big.bad { color: var(--sus); }
.e-name { font-size: 26px; font-weight: 800; color: var(--gold); }
.log p { font-size: 13px; color: var(--dim); }
.log p::before { content: '› '; color: var(--live); }

/* 标题 */
/* 标题页：导播间的监视器墙 + 导播台，标题压在中间一条虚化带上 */
.title-screen { position: fixed; inset: 0; overflow: hidden; background: #0d0e11 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.title-screen::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 80% 70% at 50% 40%, rgba(120, 150, 190, .10), transparent 70%); }
.tw { position: absolute; z-index: 0; left: 2.2vw; right: 2.2vw; top: 2.4vh; bottom: 15vh; display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(3, 1fr); gap: 12px; }
.tw .m { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 7px 7px 0; border-radius: 9px; background: linear-gradient(#25282e, #17191d); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 8px 24px rgba(0, 0, 0, .45), 0 0 34px rgba(150, 180, 220, .06); }
.tw .scr { position: relative; flex: 1; min-height: 0; overflow: hidden; border-radius: 4px; background: #000; }
.tw .scr img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.92) brightness(.86) contrast(1.04); }
.tw .scr::before { content: ''; position: absolute; inset: 0; z-index: 1; background: repeating-linear-gradient(0deg, rgba(0, 0, 0, .10) 0 1px, transparent 1px 3px); }
.tw .scr::after { content: ''; position: absolute; inset: 0; z-index: 2; border-radius: 4px; background: linear-gradient(155deg, rgba(255, 255, 255, .10), transparent 38%); box-shadow: inset 0 0 40px rgba(0, 0, 0, .55); }
.tw .lab { display: flex; align-items: center; gap: 7px; height: 24px; font: 16px var(--tmono); color: #8d929c; letter-spacing: .04em; white-space: nowrap; overflow: hidden; }
.tw .lab i { width: 6px; height: 6px; border-radius: 50%; background: #46d17a; box-shadow: 0 0 6px #46d17a; flex: none; }
.tw .m.main { grid-column: 2 / 4; grid-row: 1 / 3; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 0 0 2px rgba(255, 59, 59, .55), 0 0 40px rgba(255, 59, 59, .18), 0 8px 24px rgba(0, 0, 0, .45); }
.tw .m.main .scr img { filter: none; animation: kb 26s ease-in-out infinite alternate; }
.tw .m.main .lab { color: #ffb4b4; }
.tw .m.main .lab i { background: var(--live); box-shadow: 0 0 8px var(--live), 0 0 16px var(--live); animation: blink 1.2s steps(1) infinite; }
.tw .onair { position: absolute; right: 12px; top: 10px; z-index: 3; font: 18px var(--tmono); color: #fff; background: var(--live); padding: 0 8px; border-radius: 2px; }
.t-desk { position: absolute; z-index: 0; left: 0; right: 0; bottom: 0; height: 15vh; overflow: hidden; border-top: 1px solid rgba(255, 255, 255, .08); }
.t-desk img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 100%; filter: brightness(.55) saturate(.8); }
.t-desk::after { content: ''; position: absolute; inset: 0; background: linear-gradient(rgba(13, 14, 17, .85), transparent 45%); }
.t-band { display: none; }
.t-card { position: absolute; left: 0; right: 0; top: 52%; transform: translateY(-50%); z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 16px; }
.t-card::before { content: ''; position: absolute; z-index: -1; left: 0; right: 0; top: -9vh; bottom: -9vh; backdrop-filter: blur(5px) brightness(.6); -webkit-backdrop-filter: blur(5px) brightness(.6); -webkit-mask: linear-gradient(transparent, #000 30%, #000 70%, transparent); mask: linear-gradient(transparent, #000 30%, #000 70%, transparent); }
.t-card small { font: 22px var(--tmono); letter-spacing: .22em; color: #ff6b6b; text-shadow: 0 0 10px rgba(255, 59, 59, .5); background: rgba(10, 10, 12, .55); padding: 2px 14px; border-radius: 3px; }
.t-card h1 { margin: 6px 0 0; font-family: 'Noto Serif SC', serif; font-weight: 900; font-size: clamp(40px, 7.4vw, 124px); line-height: 1.1; letter-spacing: .06em; padding-left: .06em; white-space: nowrap; background: linear-gradient(#fff 30%, #e7ddca); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 4px 18px rgba(0, 0, 0, .55)); }
.t-rule { width: min(520px, 60vw); height: 4px; margin: 14px 0 26px; border-radius: 2px; background: linear-gradient(90deg, transparent, var(--live) 18%, var(--live) 82%, transparent); box-shadow: 0 0 14px rgba(255, 59, 59, .6); }
.t-btns { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.t-go { background: linear-gradient(#ff4a4a, #e02a2a); color: #fff; border: 0; border-radius: 999px; padding: 16px 38px; font-family: inherit; font-weight: 700; font-size: 20px; letter-spacing: .12em; cursor: pointer; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 6px 18px rgba(0, 0, 0, .45); transition: transform .12s, background .2s; }
.t-go:hover { background: linear-gradient(#ff5a5a, #e83636); }
.t-ghost:hover { background: linear-gradient(#33373f, #22252b); }
.t-go:active, .t-ghost:active { transform: scale(.96); }
.t-ghost { background: linear-gradient(#2a2d34, #1b1d22); border: 1px solid rgba(255, 255, 255, .22); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 6px 18px rgba(0, 0, 0, .45); color: #eee; border-radius: 999px; padding: 15px 28px; font-size: 16px; font-family: inherit; cursor: pointer; transition: transform .12s; }
@keyframes kb { from { transform: scale(1); } to { transform: scale(1.08) translate(-1.5%, 1%); } }
@media (max-width: 640px) {
  .tw { left: 10px; right: 10px; top: 10px; bottom: 12vh; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(4, 1fr); gap: 8px; }
  .tw .m.main { grid-column: 1 / 3; grid-row: 1 / 3; }
  .tw .m:nth-child(n+8) { display: none; }
  .tw .lab { font-size: 13px; height: 20px; }
  .t-card { top: 62%; }
  .t-card small { font-size: 16px; }
  .t-desk { height: 12vh; }
}

@media (max-width: 900px) {
  .game { grid-template-columns: 1fr; padding: 0 0 20px; gap: 10px; }
  .stage { border-radius: 0; aspect-ratio: 4 / 5; }
  .stage .bg { object-position: 50% 50%; }
  .figs { inset: 4% 0 30% 0; }
  .fig { height: calc(100% * var(--h, 1)); }
  .dlg { min-height: 30%; padding: 16px 16px 12px; font-size: 15px; }
  .console { padding: 0 12px; }
}
.arr-d { display: none; }
@media (max-width: 900px) {
  .arr-r { display: none; }
  .arr-d { display: inline; }
}

/* 两个目标 */
.goal { position: relative; }
.g-tag { font-size: 12px; font-weight: 800; letter-spacing: .04em; margin-bottom: 6px; }
.goal.open .g-tag { color: var(--gold); }
.goal.secret { border-color: rgba(111, 220, 140, .35); }
.goal.secret .g-tag { color: var(--bond); }
.goal small { display: block; color: var(--dim); font-size: 12px; line-height: 1.5; }
.trust { display: grid; grid-template-columns: auto 1fr 18px; gap: 8px; align-items: center; font-size: 12px; }
.trust i { display: flex; gap: 3px; }
.trust em { flex: 1; height: 8px; border-radius: 2px; background: #2a2d34; }
.trust em.on { background: var(--gold); }
.trust em.on.low { background: var(--sus); }
.trust b { font-family: var(--mono); text-align: right; }
.mood.ready { background: var(--bond); }
.mood.panic { background: var(--sus); }
.mood.stuck { background: #8f949e; }

/* 别让他发现：疑心条、今日收视、选项标签 */
.goal .g-tag { color: var(--gold); }
.susbar { display: grid; grid-template-columns: 1fr 22px; gap: 8px; align-items: center; margin: 6px 0 4px; }
.susbar i { display: flex; gap: 3px; }
.susbar em { flex: 1; height: 10px; border-radius: 2px; background: #2a2d34; }
.susbar em.on { background: var(--bond); }
.susbar.wary em.on { background: var(--gold); }
.susbar.edge em.on, .susbar.found em.on { background: var(--sus); }
.susbar b { font-family: var(--mono); text-align: right; }
.mood.calm { background: var(--bond); }
.mood.wary { background: var(--gold); }
.mood.edge, .mood.found { background: var(--sus); }
.today { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; font-size: 13px; margin: 4px 0; }
.today b { color: var(--gold); font-family: var(--mono); font-size: 16px; }
.today small { color: var(--dim); }
.strike { color: var(--sus); }
.actor.hot { border: 1px solid var(--sus); }
.brief p { margin: 2px 0; }
.otag { display: inline-block; font-size: 12px; padding: 0 6px; margin-right: 6px; border-radius: 4px; background: #2c3038; }
.t-calm .otag { color: var(--bond); }
.t-show .otag { color: var(--gold); }
.t-ad .otag { color: #7fd3ff; }
.opt.cut { border-style: dashed; }
.opt.cut:disabled { opacity: .4; cursor: default; }

/* ================= 三种布局 ================= */
.game.la, .game.lb, .game.lc { display: block; max-width: 1500px; margin: 0 auto; padding: 12px; }
.tag small { display: inline; margin-left: 8px; }
.status .st-row { display: flex; align-items: center; gap: 8px; }
.st-k { font-size: 12px; color: var(--dim); }
.status .today { margin-top: 2px; }
.brief .tag { margin-bottom: 2px; }
.brief p { margin: 2px 0; font-size: 14px; }
.brief .dim { font-size: 12px; }
.phase .tag { margin-bottom: 4px; }
.opts { display: grid; gap: 8px; }
.opts .opt { margin: 0; }

/* B · 上下分屏：舞台限高，下面三栏控制台 */
.lb .stage { max-height: 64vh; width: 100%; aspect-ratio: auto; height: min(64vh, calc((100vw - 24px) * 9 / 16)); }
.dock { display: grid; grid-template-columns: 260px 260px minmax(0, 1fr); gap: 12px; margin-top: 12px; }
.dock-col { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; }
.lb .dock .opts { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.lb .actors { margin-top: 10px; }

/* C · 导播间式：顶部状态条 + 大舞台 + 窄侧栏只放耳麦 */
.hudbar { display: grid; grid-template-columns: 300px minmax(0, 1fr) 300px; gap: 16px; align-items: center; background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 10px 14px; margin-bottom: 12px; }
.hudbar .actors { margin: 0; }
.lc-body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 12px; align-items: start; }
.lc .stage { height: min(78vh, calc((100vw - 380px) * 9 / 16)); aspect-ratio: auto; }
.rail .phase { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 12px; }
.rail .ear-card { border-color: rgba(255, 59, 59, .55); }

/* A · 影院式：舞台占满屏，状态和任务做成角标，选项浮在画面上 */
.la .stage { height: calc(100vh - 24px); aspect-ratio: auto; }
.hud-tl, .hud-tr { position: absolute; top: 44px; z-index: 4; background: rgba(12, 13, 16, .62); backdrop-filter: blur(6px); border: 1px solid rgba(255, 255, 255, .1); border-radius: 12px; padding: 8px 12px; cursor: default; }
.hud-tl { left: 14px; max-width: 300px; }
.hud-tr { right: 14px; width: 270px; }
.hud-tr .actors { margin-top: 6px; }
.ov-panel { position: absolute; z-index: 5; right: 14px; top: 50%; transform: translateY(-50%); width: min(400px, 44%); max-height: 70%; overflow: auto; background: rgba(16, 17, 22, .9); backdrop-filter: blur(8px); border: 1px solid rgba(255, 59, 59, .45); border-radius: 14px; padding: 12px; cursor: default; }
.la .ph-choose .dlg { right: calc(14px + min(400px, 44%) + 12px); }
.la .wait { display: none; }

/* 切换布局 */
.switcher { position: fixed; left: 12px; bottom: 12px; z-index: 60; display: flex; gap: 4px; align-items: center; font-size: 12px; color: var(--dim); background: rgba(12, 13, 16, .85); border: 1px solid var(--line); border-radius: 99px; padding: 4px 6px 4px 12px; }
.switcher button { border: 0; border-radius: 99px; background: #2a2d34; color: var(--text); font: 700 12px var(--mono); width: 28px; height: 24px; cursor: pointer; }
.switcher button.on { background: var(--gold); color: #1a1406; }

/* ================= 弹幕 ================= */
#dm { position: absolute; z-index: 20; pointer-events: none; overflow: hidden; border-radius: 14px; }
.dm-item { position: absolute; left: 100%; white-space: nowrap; font-size: clamp(13px, 1.25vw, 17px); font-weight: 700; color: #fff; text-shadow: 0 0 3px #000, 0 1px 2px #000; animation: dm-fly linear forwards; opacity: .92; }
.dm-item.hot { color: #ff8a7a; }
@keyframes dm-fly { from { transform: translateX(0); } to { transform: translateX(calc(-100vw - 100%)); } }

/* 窄屏：都退成上下排列 */
@media (max-width: 900px) {
  .game.la, .game.lb, .game.lc { padding: 0 0 70px; }
  .lb .stage, .lc .stage, .la .stage { height: auto; aspect-ratio: 4 / 5; border-radius: 0; }
  .dock, .hudbar, .lc-body { grid-template-columns: 1fr; margin: 10px 12px 0; }
  .lc-body { margin: 0; }
  .rail { padding: 0 12px; }
  .hud-tl { display: none; }
  .hud-tr { top: auto; bottom: 34%; right: 8px; width: 200px; padding: 6px 8px; }
  .ov-panel { top: auto; bottom: 8px; transform: none; left: 8px; right: 8px; width: auto; max-height: 60%; }
  .la .ph-choose .dlg { display: none; }
  #dm { border-radius: 0; }
}
.dlg { min-height: 0; padding-bottom: 18px; }
.dlg p { min-height: 2.2em; }
@media (max-width: 900px) { .switcher { bottom: auto; top: 8px; left: auto; right: 8px; } }

/* 定稿：导播间式。舞台按屏幕高度撑满，右侧窄栏放耳麦和本场指令 */
.lc .stage { height: min(calc(100vh - 150px), calc((100vw - 380px) * 9 / 16)); min-height: 420px; }
.rail { display: grid; gap: 10px; }
.rail .log { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 12px; }
.rail .log p { margin: 2px 0; }

.lc .stage { height: max(420px, calc(100vh - 150px)); }
@media (max-width: 900px) { .lc .stage { height: auto; } }

/* 顶栏：疑心 + 收视实时曲线 */
.hudbar { grid-template-columns: 300px minmax(0, 1fr); }
.curve .cv-head { display: flex; align-items: baseline; gap: 8px; font-size: 12px; color: var(--dim); }
.curve .cv-head b { font: 800 20px var(--mono); color: var(--text); }
.curve .cv-head b.ok { color: var(--bond); }
.curve .cv-head b.low { color: var(--gold); }
.cv-legend { margin-left: auto; display: flex; align-items: center; gap: 4px; }
.cv-legend i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-left: 8px; }
.curve svg { width: 100%; height: 64px; display: block; margin-top: 2px; }
.cv-line { fill: none; stroke: var(--gold); stroke-width: 2; vector-effect: non-scaling-stroke; }
.cv-area { fill: rgba(255, 201, 74, .12); stroke: none; }
.cv-target { stroke: var(--sus); stroke-width: 1; stroke-dasharray: 5 4; vector-effect: non-scaling-stroke; }
.mk-calm { fill: var(--bond); background: var(--bond); }
.mk-show { fill: var(--gold); background: var(--gold); }
.mk-ad { fill: #7fd3ff; background: #7fd3ff; }
.mk-alarm { fill: var(--sus); background: var(--sus); }
.situ p { font-size: 13px; margin: 4px 0; }
.situ p.hot { color: var(--sus); }
.rail .situ { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 12px; }

/* 场记板 */
.slate-board { position: absolute; inset: 0; z-index: 8; display: grid; place-items: center; align-content: safe center; overflow-y: auto; padding: 12px 0; gap: 14px; background: rgba(8, 9, 12, .72); backdrop-filter: blur(3px); cursor: default; animation: sb-in .45s ease-out; }
@keyframes sb-in { from { opacity: 0; transform: translateY(14px); } }
.sb-clap { width: min(560px, 86%); height: 36px; border-radius: 8px 8px 0 0; margin-bottom: -14px; background: repeating-linear-gradient(-45deg, #f2f0ea 0 22px, #15161a 22px 44px); transform-origin: left bottom; transform: rotate(-16deg); }
.sb-body { width: min(560px, 86%); background: #15161a; border: 3px solid #f2f0ea; border-radius: 0 0 10px 10px; padding: 14px 18px; color: #f2f0ea; font-size: 14px; }
.sb-head { display: flex; justify-content: space-between; font: 700 13px var(--mono); color: #c9c6bd; border-bottom: 1px solid #444; padding-bottom: 6px; }
.sb-title { font-size: 30px; font-weight: 900; letter-spacing: .08em; margin: 8px 0 6px; }
.sb-row { display: grid; grid-template-columns: 70px 1fr; gap: 8px; padding: 4px 0; border-bottom: 1px dashed #333; }
.sb-row span, .sb-plot span { color: #9a978f; font-size: 12px; }
.sb-plot { display: grid; grid-template-columns: 70px 1fr; gap: 8px; padding: 6px 0; border-bottom: 1px dashed #333; }
.sb-plot p { margin: 0; line-height: 1.6; }
.sb-go { letter-spacing: .06em; }
@media (max-width: 900px) { .hudbar { grid-template-columns: 1fr; } .sb-title { font-size: 22px; } .sb-body { font-size: 12px; } }

/* ================= 镜头语言 ================= */
.cam { position: absolute; inset: 0; transform: var(--to); animation: cam-move .7s cubic-bezier(.3, .7, .2, 1); will-change: transform; }
@keyframes cam-move { from { transform: var(--from); } to { transform: var(--to); } }
.cam.pan { animation: cam-move .7s cubic-bezier(.3, .7, .2, 1), cam-pan 9s ease-in-out .7s infinite alternate; }
@keyframes cam-pan { from { transform: var(--to); } to { transform: var(--to) translateX(-5%); } }
.stage.shake .cam { animation: cam-move .7s cubic-bezier(.3, .7, .2, 1), cam-shake .45s linear; }
@keyframes cam-shake { 0%, 100% { translate: 0 0; } 15% { translate: -14px 6px; } 30% { translate: 12px -8px; } 45% { translate: -9px -5px; } 60% { translate: 8px 7px; } 80% { translate: -4px 2px; } }
.flash { position: absolute; inset: 0; z-index: 6; background: #fff; pointer-events: none; animation: flash .5s ease-out forwards; }
@keyframes flash { from { opacity: .85; } to { opacity: 0; } }
.sfx { position: absolute; z-index: 7; top: 16%; left: var(--x); pointer-events: none; font: 900 clamp(34px, 5.5vw, 78px)/1 'ZCOOL KuaiLe', 'PingFang SC', sans-serif; color: #fff3c4; -webkit-text-stroke: 3px #1b1306; paint-order: stroke fill; text-shadow: 4px 5px 0 #c8341f; transform: rotate(var(--r)); animation: sfx-pop .9s cubic-bezier(.2, 1.6, .4, 1) forwards; }
@keyframes sfx-pop { 0% { transform: rotate(var(--r)) scale(.2); opacity: 0; } 25% { transform: rotate(var(--r)) scale(1.18); opacity: 1; } 45% { transform: rotate(var(--r)) scale(1); } 85% { opacity: 1; } 100% { transform: rotate(var(--r)) scale(1.04); opacity: 0; } }
.prop-shot { position: absolute; inset: 0; z-index: 5; overflow: hidden; background: #000; animation: prop-in .35s ease-out; }
.prop-shot img { width: 100%; height: 100%; object-fit: cover; animation: prop-zoom 6s ease-out forwards; }
.prop-shot img.miss + .prop-cap { top: 45%; }
@keyframes prop-in { from { opacity: 0; transform: scale(1.06); } }
@keyframes prop-zoom { from { transform: scale(1.02); } to { transform: scale(1.14); } }
.prop-cap { position: absolute; left: 18px; top: 46px; padding: 3px 12px; border-radius: 6px; background: rgba(0, 0, 0, .6); border: 1px solid rgba(255, 255, 255, .25); font-size: 13px; letter-spacing: .1em; color: #ffe3a3; }
.prop-cap::before { content: '特写 · '; color: #aaa; }
.stage { overflow: hidden; }

/* 打板：点 Action 后板子合上，啪一声闪白，再开拍 */
.clapping .sb-clap { animation: sb-snap .16s ease-in forwards; }
@keyframes sb-snap { to { transform: rotate(0); } }
.clapping .sb-body, .clapping .sb-go { animation: sb-hit .16s .14s ease-out; }
@keyframes sb-hit { 50% { transform: translateY(5px); } }
.clapping::after { content: '啪！'; position: absolute; top: 18%; left: 50%; transform: translateX(-50%); font: 900 64px/1 'PingFang SC', sans-serif; color: #fff3c4; -webkit-text-stroke: 3px #1b1306; paint-order: stroke fill; text-shadow: 4px 5px 0 #c8341f; animation: sfx-pop .6s .15s cubic-bezier(.2, 1.6, .4, 1) both; --r: -6deg; }
.clapping { animation: sb-out .3s .45s ease-in forwards; }
@keyframes sb-out { to { opacity: 0; transform: scale(1.04); } }

/* 耳麦条：顶部，红色，和台上的对话框分开 */
.ear-bar { position: absolute; z-index: 9; top: 42px; left: 50%; transform: translateX(-50%); width: min(620px, 80%); display: flex; gap: 10px; align-items: flex-start; padding: 10px 14px; border-radius: 12px; background: rgba(30, 8, 10, .88); border: 1px solid rgba(255, 59, 59, .6); box-shadow: 0 0 0 3px rgba(255, 59, 59, .12), 0 8px 24px rgba(0, 0, 0, .4); animation: ear-bar-in .25s ease-out; cursor: pointer; }
/* 名字别和右栏耳麦卡的 ear-in 重了：那个没有 translateX(-50%)，动画结束会横跳半个身位 */
@keyframes ear-bar-in { from { opacity: 0; transform: translate(-50%, -8px); } to { opacity: 1; transform: translate(-50%, 0); } }
.ear-bar b { font-size: 12px; color: #ff8a8a; }
.ear-bar p { margin: 2px 0 0; color: #ffe1e1; font-size: clamp(14px, 1.3vw, 17px); }
.ear-bar.me { border-color: rgba(255, 201, 74, .7); background: rgba(30, 24, 8, .9); }
.ear-bar.me b { color: var(--gold); }
.ear-bar.me p { color: #fff3d0; }
.ear-ico { flex: none; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; display: grid; place-items: center; background: #2a1012; font-size: 20px; }
.ear-ava { width: 100%; height: 100%; object-fit: cover; object-position: 50% 6%; }
.dlg.held { opacity: .45; }

/* 新玩法说明、剧组档案 */
.rail .tip { background: #2a2410; border: 1px solid rgba(255, 201, 74, .55); border-radius: 14px; padding: 12px; }
.rail .tip p { font-size: 13px; margin: 0; line-height: 1.65; }
.rail .files { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 12px; }
.file-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.ftab { position: relative; border: 1px solid var(--line); background: #22252b; color: var(--text); border-radius: 99px; padding: 3px 12px; font: inherit; font-size: 13px; cursor: pointer; }
.ftab.on { background: var(--gold); color: #1a1406; border-color: var(--gold); }
.ftab i { position: absolute; top: -2px; right: -2px; width: 8px; height: 8px; border-radius: 50%; background: var(--sus); }
.file-body { margin-top: 10px; display: grid; gap: 6px; }
.file-body p { margin: 0; font-size: 13px; line-height: 1.6; display: grid; grid-template-columns: 64px 1fr; gap: 6px; }
.file-body span { color: var(--dim); font-size: 12px; }
.file-body .secret { color: #ffd9a0; }

/* ================= 第三轮：顶栏收紧、右栏层次、画面放缓 ================= */
.hudbar { grid-template-columns: 260px minmax(0, 1fr) 260px; padding: 8px 14px; gap: 18px; }
.curve svg { height: 36px; }
.curve .cv-head b { font-size: 17px; }
.curve .cv-head .strike { margin-left: auto; }
.dayinfo { font-size: 13px; text-align: right; line-height: 1.6; }
.dayinfo b { font-size: 15px; }
.countdown { display: inline-block; margin-left: 6px; padding: 0 8px; border-radius: 99px; background: rgba(255, 59, 59, .15); color: #ff9a8f; font-size: 12px; }
.lc .stage { height: max(420px, calc(100vh - 118px)); }

/* 右栏：任务（金边）→ 耳麦（红，最醒目）→ 演员状态 → 档案 / 指令（收起来的标签页） */
.rail { gap: 10px; }
.rc { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 10px 12px; }
.rc-h { font-size: 12px; font-weight: 800; color: var(--dim); letter-spacing: .08em; margin-bottom: 6px; }
.rc-h small { font-weight: 400; margin-left: 6px; }
.rc.task { border-left: 4px solid var(--gold); background: linear-gradient(90deg, rgba(255, 201, 74, .08), var(--panel) 60%); }
.rc.task .rc-h { color: var(--gold); }
.rc.task p { margin: 0 0 6px; font-size: 15px; font-weight: 600; line-height: 1.55; }
.task-meta { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: var(--dim); }
.task-meta b { color: var(--text); }
.rail .phase { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 12px; }
.rail .phase:not(.ear-card):not(.tip) .tag { color: var(--dim); font-size: 12px; }
.rail .ear-card { border: 2px solid var(--live); box-shadow: 0 0 0 4px rgba(255, 59, 59, .1), 0 10px 30px rgba(0, 0, 0, .35); padding: 14px; }
.rail .ear-card .tag { font-size: 15px; }
.rail .ear-card .opt { font-size: 15px; padding: 12px 14px; }
.act-row { padding: 6px 0; border-top: 1px dashed var(--line); }
.act-row:first-of-type { border-top: 0; padding-top: 0; }
.act-top { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; font-size: 13px; }
.act-top small { color: var(--dim); font-size: 11px; }
.act-now { margin-left: auto; font-size: 12px; color: var(--dim); }
.act-row.warm .act-now { color: var(--gold); }
.act-row.hot .act-now { color: var(--sus); font-weight: 700; }
.act-bar { display: flex; gap: 3px; margin: 5px 0 2px; }
.act-bar em { flex: 1; height: 6px; border-radius: 2px; background: #2a2d34; position: relative; }
.act-bar em.on { background: var(--pink); }
.act-row.hot .act-bar em.on { background: var(--sus); }
.act-bar em.mark::after { content: ''; position: absolute; right: -2px; top: -3px; width: 1px; height: 12px; background: rgba(255, 255, 255, .35); }
.act-next { color: var(--dim); font-size: 11px; }
.more-card { padding-top: 6px; }
.mtabs { display: flex; gap: 4px; margin-bottom: 8px; border-bottom: 1px solid var(--line); }
.mtab { position: relative; border: 0; background: none; color: var(--dim); font: inherit; font-size: 13px; padding: 6px 10px; cursor: pointer; border-bottom: 2px solid transparent; }
.mtab.on { color: var(--text); border-bottom-color: var(--gold); }
.mtab i { position: absolute; top: 4px; right: 0; width: 7px; height: 7px; border-radius: 50%; background: var(--sus); }
.more-card .log p { margin: 2px 0; font-size: 13px; color: var(--dim); }
.more-card .log p::before { content: '› '; color: var(--live); }
.rail .tip { background: #2a2410; border: 1px solid rgba(255, 201, 74, .55); }

/* 画面放缓：机位慢一点、不再一直横摇、震动和拟声字收一收 */
.cam { animation-duration: 1.2s !important; animation-timing-function: ease-in-out !important; }
.cam.pan { animation: cam-move 1.2s ease-in-out; }
@keyframes cam-shake { 0%, 100% { translate: 0 0; } 20% { translate: -6px 3px; } 40% { translate: 5px -3px; } 60% { translate: -3px 2px; } 80% { translate: 2px -1px; } }
.stage.shake .cam { animation: cam-move 1.2s ease-in-out, cam-shake .35s linear !important; }
.sfx { font-size: clamp(26px, 3.6vw, 52px); -webkit-text-stroke: 2px #1b1306; text-shadow: 3px 3px 0 #c8341f; }
.flash { animation: flash .6s ease-out forwards; }
@keyframes flash { from { opacity: .45; } to { opacity: 0; } }
.prop-shot { animation: prop-in .6s ease-out; }
@keyframes prop-zoom { from { transform: scale(1.02); } to { transform: scale(1.07); } }
.fig.enter { animation: fig-in .5s ease-out; }
@keyframes fig-in { from { opacity: 0; translate: 0 12px; } }
@media (max-width: 900px) { .hudbar { grid-template-columns: 1fr; } .dayinfo { text-align: left; } }
.more-card .files { background: none; border: 0; padding: 0; }
@media (min-width: 901px) { .rail { max-height: calc(100vh - 118px); overflow-y: auto; scrollbar-width: thin; align-content: start; } }
.figs .fig { height: calc((92% - (var(--n) - 2) * 3%) * var(--h, 1)); }

/* 封面版本号 + 更新日志 */
.ver { position: absolute; right: 16px; bottom: 14px; z-index: 2; border: 1px solid rgba(255, 255, 255, .25); background: rgba(12, 13, 16, .6); color: #d8d4ca; font: 12px var(--mono); padding: 4px 10px; border-radius: 99px; cursor: pointer; backdrop-filter: blur(4px); }
.ver:hover { color: var(--gold); border-color: var(--gold); }
.cl-mask { position: fixed; inset: 0; z-index: 90; background: rgba(0, 0, 0, .55); display: grid; place-items: center; padding: 16px; }
.cl-box { width: min(560px, 100%); max-height: 80vh; display: flex; flex-direction: column; background: var(--panel); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 20px 60px rgba(0, 0, 0, .5); cursor: default; }
.cl-head { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.cl-head b { font-size: 17px; }
.cl-head span { color: var(--dim); font: 12px var(--mono); }
.cl-x { margin-left: auto; width: 32px; height: 32px; border: 0; background: none; color: var(--text); font-size: 22px; cursor: pointer; }
.cl-list { overflow-y: auto; padding: 6px 16px 16px; text-align: left; }
.cl-list section { padding: 12px 0; border-bottom: 1px dashed var(--line); }
.cl-list section:last-child { border-bottom: 0; }
.cl-ver { display: flex; align-items: baseline; gap: 8px; }
.cl-ver b { font-family: var(--mono); color: var(--gold); }
.cl-ver small { margin-left: auto; color: var(--dim); font-family: var(--mono); }
.cl-list section.now .cl-ver span::after { content: '当前'; margin-left: 6px; font-size: 11px; padding: 0 6px; border-radius: 99px; background: var(--gold); color: #1a1406; }
.cl-list ul { margin: 6px 0 0; padding-left: 18px; color: #d8d4ca; font-size: 13px; line-height: 1.7; }

/* ================= 第四轮：右栏质感 ================= */
.rail .rc, .rail .phase { background: linear-gradient(180deg, #23262e, #1b1d22); border: 1px solid rgba(255, 255, 255, .07); box-shadow: 0 8px 22px rgba(0, 0, 0, .28); }
/* 今日通告单：一张纸 */
.rail .rc.task { background: #efe5cf; color: #2a2116; border: 0; border-left: 0; box-shadow: 0 8px 22px rgba(0, 0, 0, .35); position: relative; padding: 12px 14px 12px; background-image: repeating-linear-gradient(0deg, transparent 0 23px, rgba(120, 90, 40, .12) 23px 24px); }
.rail .rc.task::before { content: '通告'; position: absolute; top: 10px; right: 12px; padding: 0 6px; border: 2px solid #b5382c; color: #b5382c; font-weight: 900; font-size: 12px; transform: rotate(8deg); border-radius: 4px; opacity: .8; }
.rail .rc.task .rc-h { color: #8a5a1f; }
.rail .rc.task .rc-h small { color: #8a7a60; }
.rail .rc.task p { color: #1d160d; }
.rail .rc.task .task-meta { color: #6e604a; }
.rail .rc.task .task-meta b { color: #2a2116; }
/* 耳麦：红色标题条 */
.rail .ear-card { padding: 0; overflow: hidden; background: linear-gradient(180deg, #2a1d1f, #1c1a1e); }
.ear-head { display: flex; align-items: center; gap: 8px; padding: 10px 14px; background: linear-gradient(90deg, #c8231f, #8e1a1d); color: #fff; font-weight: 800; font-size: 15px; }
.ear-head small { margin-left: auto; font-weight: 400; opacity: .8; font-size: 12px; }
.ear-dot { width: 8px; height: 8px; border-radius: 50%; background: #fff; animation: blink 1s infinite; }
.rail .ear-card .opts { padding: 12px; gap: 10px; }
.rail .ear-card .opt { position: relative; background: linear-gradient(180deg, #2b2e36, #24262d); border: 1px solid rgba(255, 255, 255, .08); border-left: 4px solid var(--dim); transition: transform .12s, border-color .12s, background .12s; }
.rail .ear-card .opt:hover { transform: translateX(-3px); background: #30333c; }
.rail .ear-card .t-calm { border-left-color: var(--bond); }
.rail .ear-card .t-show { border-left-color: var(--gold); }
.rail .ear-card .t-ad { border-left-color: #7fd3ff; }
.rail .ear-card .cut { border-left-color: var(--sus); border-style: solid; }
/* 演员状态：带头像 */
.act-ava { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; object-position: 50% 6%; background: #2a2d34; align-self: center; }
.act-top { align-items: center; }
.rail .rc-h { display: flex; align-items: center; gap: 6px; }
.rail .actors-card .rc-h::before { content: '🎭'; }
.rail .more-card .mtabs { margin-top: 2px; }
.night-card .big { font-size: 34px; }

/* 对讲机气泡：画面里，对讲机旁边 */
.dlg { z-index: 6; }
.radio-bubble { position: absolute; z-index: 8; top: 18%; right: 6%; max-width: 46%; padding: 12px 16px; border-radius: 16px 16px 16px 4px; background: #fffbe8; color: #1e1a10; box-shadow: 0 8px 24px rgba(0, 0, 0, .4); animation: ear-in-r .3s ease-out; cursor: pointer; }
.radio-bubble.on-prop { top: 22%; right: 8%; }
.radio-bubble b { display: block; font-size: 12px; color: #a35a10; margin-bottom: 2px; }
.radio-bubble p { margin: 0; font-size: clamp(15px, 1.4vw, 19px); font-weight: 600; line-height: 1.5; }
@keyframes ear-in-r { from { opacity: 0; transform: translateY(-6px) scale(.97); } }

/* 收工：手机里的剧组群 */
.phone-wrap { position: absolute; inset: 0; z-index: 9; display: grid; place-items: center; background: rgba(6, 7, 10, .55); backdrop-filter: blur(3px); cursor: pointer; }
.phone { width: min(380px, 86%); height: 92%; display: flex; flex-direction: column; border-radius: 34px; background: #ededed; border: 8px solid #111; box-shadow: 0 30px 80px rgba(0, 0, 0, .6); overflow: hidden; color: #111; animation: phone-up .45s cubic-bezier(.2, .8, .2, 1); cursor: default; }
@keyframes phone-up { from { transform: translateY(40px); opacity: 0; } }
.ph-top { display: flex; justify-content: space-between; padding: 6px 18px 0; font: 600 12px var(--mono); }
.ph-head { padding: 8px 14px 10px; text-align: center; font-weight: 700; font-size: 15px; border-bottom: 1px solid #d6d6d6; background: #f5f5f5; }
.ph-head small { color: #777; font-weight: 400; margin-left: 2px; }
.ph-body { flex: 1; overflow-y: auto; padding: 10px 12px; display: flex; flex-direction: column; gap: 10px; scroll-behavior: smooth; }
.cm { display: flex; gap: 8px; align-items: flex-start; animation: cm-in .25s ease-out; }
@keyframes cm-in { from { opacity: 0; transform: translateY(6px); } }
.cm.me { flex-direction: row-reverse; }
.cm-ava { flex: none; width: 34px; height: 34px; border-radius: 6px; object-fit: cover; object-position: 50% 6%; background: #ccc; display: grid; place-items: center; font-size: 18px; }
.cm-ava.me { background: #2f6fe0; color: #fff; font-size: 13px; font-weight: 700; }
.cm-main { max-width: 76%; display: flex; flex-direction: column; gap: 2px; }
.cm.me .cm-main { align-items: flex-end; }
.cm-name { font-size: 11px; font-weight: 400; color: #888; }
.cm-bubble { background: #fff; padding: 8px 10px; border-radius: 8px; font-size: 14px; line-height: 1.5; }
.cm.me .cm-bubble { background: #95ec69; }
.cm-bubble .chips { margin-top: 4px; }
.cm-voice { background: #fff; padding: 8px 10px; border-radius: 8px; font-size: 13px; }
.cm-voice span { color: #333; font-family: var(--mono); }
.cm-voice small { display: block; margin-top: 4px; padding-top: 4px; border-top: 1px dashed #ddd; color: #555; font-size: 13px; line-height: 1.5; }
.cm-sticker { font-size: 44px; line-height: 1; }
.cm-file { background: #fff; padding: 10px 12px; border-radius: 8px; font-size: 13px; border-left: 4px solid #2f6fe0; }
.cm-red { background: #f2a23a; color: #fff; padding: 10px 12px; border-radius: 8px; min-width: 170px; }
.cm-red b { display: block; }
.cm-red small { opacity: .85; font-size: 11px; }
.cm-sys { align-self: center; font-size: 11px; color: #888; background: #dadada; padding: 2px 8px; border-radius: 4px; }
/* @谁：群里回话先点名 */
.cm-at { color: #1f5fd1; font-weight: 700; }
.cm.me .cm-at { color: #1d5a12; }
.cm-typing { font-size: 12px; color: #999; }
.cm-card { background: #fff; border-radius: 10px; padding: 10px 12px; min-width: 220px; border-top: 4px solid #e2462f; }
.cmc-h { font-size: 12px; color: #666; }
.cmc-big { font: 800 26px var(--mono); }
.cmc-big.ok { color: #2a9d55; }
.cmc-big.bad { color: #e2462f; }
.cmc-big small { font-size: 12px; color: #888; font-weight: 400; }
.cmc-row { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: 12px; color: #444; }
.cm-replies { border-top: 1px solid #d6d6d6; background: #f7f7f7; padding: 8px 10px; display: grid; gap: 6px; }
.cm-replies small { color: #777; }
.cm-reply { text-align: left; border: 1px solid #cfcfcf; background: #fff; border-radius: 8px; padding: 8px 10px; font: inherit; font-size: 13px; cursor: pointer; display: grid; gap: 4px; color: #111; }
.cm-reply:hover { border-color: #2f6fe0; }
.cm-reply .fx { background: #eef1f6; }
.cm-done { text-align: center; padding: 8px; font-size: 12px; color: #777; border-top: 1px solid #d6d6d6; }

.act-row.gone .act-now { color: var(--dim); }
.act-row.gone { opacity: .7; }

.rail .ear-card .t-end { border-left-color: #c58bff; }
.t-end .otag { color: #d9b3ff; }

/* ================= 镜头语言：单人近景、过肩、剧情插画、小监视器 ================= */
.shot { position: absolute; inset: 0; overflow: hidden; }
.shot.cut { animation: shot-cut .28s ease-out; }
@keyframes shot-cut { from { opacity: .35; filter: brightness(1.6); } }
.shot .bg.soft { position: absolute; inset: -4%; width: 108%; height: 108%; object-fit: cover; filter: blur(7px) brightness(.72) saturate(.9); }
.shot.single .solo { position: absolute; left: 50%; bottom: -38%; height: 150%; transform: translateX(-50%); }
.shot.single .solo img { height: 100%; filter: drop-shadow(0 10px 30px rgba(0, 0, 0, .45)); }
@keyframes solo-drift { from { transform: translateX(-50%) scale(1); } to { transform: translateX(-50%) scale(1.04); } }
.shot.ots .ots-back { position: absolute; left: -10%; bottom: -60%; height: 175%; filter: blur(5px) brightness(.45); transform: scaleX(-1); }
.shot.ots .ots-back img, .shot.ots .ots-face img { height: 100%; }
.shot.ots .ots-face { position: absolute; left: 58%; bottom: -30%; height: 125%; transform: translateX(-50%); }
.shot.cg .cgimg { width: 100%; height: 100%; object-fit: cover; animation: cg-drift 14s ease-out forwards; }
@keyframes cg-drift { from { transform: scale(1.02); } to { transform: scale(1.09) translate(-1%, -1%); } }
.camno { font: 700 11px var(--mono); padding: 1px 6px; border: 1px solid rgba(255, 255, 255, .5); border-radius: 3px; color: #fff; }
.pip { position: absolute; z-index: 7; right: 14px; top: 46px; width: 22%; aspect-ratio: 16 / 10; border-radius: 8px; overflow: hidden; border: 2px solid rgba(255, 255, 255, .85); box-shadow: 0 8px 24px rgba(0, 0, 0, .5); background: #000; animation: pip-in .35s ease-out; }
@keyframes pip-in { from { opacity: 0; transform: translateY(-6px); } }
.pip-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: blur(3px) brightness(.6); }
.pip-fig { position: absolute; left: 50%; bottom: -60%; height: 170%; transform: translateX(-50%); }
.pip span { position: absolute; left: 6px; bottom: 5px; font: 700 10px var(--mono); color: #fff; background: rgba(200, 30, 30, .85); padding: 0 5px; border-radius: 3px; }
.stage .wait { z-index: 8; }
.stage.shake .shot { animation: cam-shake .35s linear; }

/* 反馈修正：手机不再每条消息都跳；头像、近景立绘不截头顶 */
.phone, .phone-wrap { animation: none; }
.phone.enter { animation: phone-up .45s cubic-bezier(.2, .8, .2, 1); }
.phone-wrap.enter { animation: fade-in .3s ease-out; }
@keyframes fade-in { from { opacity: 0; } }
.ph-body { scroll-behavior: auto; }
.cm { animation: none; }
.cm.fresh { animation: cm-in .25s ease-out; }
.cm-ava, .ava, .act-ava, .ear-ava { object-position: 50% 0% !important; }
img.cm-ava { padding-top: 2px; }
.shot.single .solo { height: 122%; bottom: -28%; }
.shot.ots .ots-face { height: 115%; bottom: -24%; }
.pip-fig { height: 140%; bottom: -46%; }

/* 开场认人：导播间的监视器墙，王总站在左边 */
.wall-room { position: absolute; inset: 0; }
.wall-room .wall-bg { filter: blur(3px) brightness(.45); transform: scale(1.06); }
.wall-frame { position: absolute; left: 27%; right: 3%; top: 10%; bottom: 23%; overflow: hidden; border-radius: 10px; background: #0c0d10; box-shadow: 0 0 0 6px #1d2025, 0 0 0 7px rgba(255, 255, 255, .08), 0 20px 50px rgba(0, 0, 0, .6); }
.wall-grid { position: absolute; inset: 0; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 6px; padding: 6px; transform: var(--to); animation: wall-move 1s cubic-bezier(.5, 0, .2, 1); }
@keyframes wall-move { from { transform: var(--from); } to { transform: var(--to); } }
.wm { position: relative; overflow: hidden; border-radius: 4px; background: #000; }
.wscr { position: absolute; inset: 0; }
.wscr .wbg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.85) brightness(.8); transition: filter .6s; }
.wscr .wfig { position: absolute; left: 50%; bottom: -30%; height: 118%; transform: translateX(-50%); filter: brightness(.85); transition: filter .6s; }
.wm.on .wbg, .wm.on .wfig { filter: none; }
.wscr::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, rgba(0, 0, 0, .12) 0 1px, transparent 1px 3px), linear-gradient(155deg, rgba(255, 255, 255, .08), transparent 40%); box-shadow: inset 0 0 50px rgba(0, 0, 0, .5); }
.wlab { position: absolute; left: 8px; top: 5px; z-index: 2; display: flex; align-items: center; gap: 6px; font: 12px var(--mono); color: #dfe3ea; background: rgba(0, 0, 0, .55); padding: 1px 7px; border-radius: 3px; }
.wlab i { width: 6px; height: 6px; border-radius: 50%; background: #46d17a; box-shadow: 0 0 6px #46d17a; }
.wm.on .wlab i { background: var(--live); box-shadow: 0 0 6px var(--live); }
.wall-boss { position: absolute; left: -3%; bottom: -16%; height: 100%; z-index: 3; filter: brightness(.72) drop-shadow(0 10px 30px rgba(0, 0, 0, .6)); transition: filter .4s; }
.wall-boss img { height: 100%; }
.wall-boss.on { filter: brightness(1) drop-shadow(0 10px 30px rgba(0, 0, 0, .6)); }

/* 喊停：舞台右侧的红色按钮；抓到了闪 CUT!，乱喊冒一个问号 */
/* 穿帮：画面定格、监视器亮红框，耳麦卡片顶上一条警报 */
.stage.slip-on::after { content: ''; position: absolute; inset: 0; z-index: 7; pointer-events: none; border: 4px solid #ff3b3b; box-shadow: inset 0 0 60px rgba(255, 40, 40, .45); animation: slip-blink 1s steps(2) infinite; }
.slip-tag { position: absolute; left: 50%; top: 14px; z-index: 8; transform: translateX(-50%); padding: 6px 16px; border-radius: 6px; font: 700 15px/1 var(--tmono, monospace); letter-spacing: .12em; color: #fff; background: #e02424; box-shadow: 0 4px 14px rgba(0, 0, 0, .4); animation: slip-blink 1s steps(2) infinite; }
@keyframes slip-blink { 50% { opacity: .45; } }
.ear-slip { margin: 0 0 10px; padding: 10px 12px; border-radius: 10px; font-size: 14px; line-height: 1.5; color: #ffe1e1; background: linear-gradient(rgba(224, 36, 36, .32), rgba(160, 20, 20, .28)); border: 1px solid rgba(255, 80, 80, .55); }
.ear-slip b { display: inline-block; margin-right: 8px; padding: 1px 7px; border-radius: 4px; font-size: 12px; color: #fff; background: #e02424; }

/* ===== 耳麦选项：不再标圆场/抓马/广告，左边是序号（也可以按数字键）；效果默认藏起来，开关打开才显示 ===== */
.rail .ear-card .opt { display: grid; grid-template-columns: auto 1fr; align-items: start; column-gap: 10px; row-gap: 6px; }
.rail .ear-card .opt .chips { grid-column: 2; }
.rail .ear-card:not(.fx-on) .opt { border-left-color: rgba(255, 255, 255, .14); }
.okey { display: grid; place-items: center; width: 22px; height: 22px; margin-top: 1px; border-radius: 6px; font: 700 12px/1 var(--mono); color: #ffb0b0; background: rgba(255, 59, 59, .14); box-shadow: inset 0 0 0 1px rgba(255, 59, 59, .35); }
.otext { line-height: 1.55; }
.fx-toggle { display: flex; align-items: center; gap: 8px; margin: 0 14px 12px; padding: 0; border: 0; background: none; color: var(--dim); font: inherit; font-size: 12px; cursor: pointer; }
.fx-toggle i { position: relative; width: 30px; height: 17px; border-radius: 99px; background: #3a3d45; transition: background .2s; }
.fx-toggle i::after { content: ''; position: absolute; left: 2px; top: 2px; width: 13px; height: 13px; border-radius: 50%; background: #cfd3da; transition: transform .2s; }
.fx-toggle.on { color: var(--text); }
.fx-toggle.on i { background: var(--live); }
.fx-toggle.on i::after { transform: translateX(13px); background: #fff; }
/* ===== 右栏（焦点式）：只突出现在该看的那一块，其余压暗收到底部 ===== */
.rail { display: flex; flex-direction: column; gap: 10px; }
@media (min-width: 901px) { .rail { height: calc(100vh - 118px); } }
.d-focus { display: grid; gap: 10px; }
.rail .ear-card .opt { font-size: 16px; padding: 14px; }
.rail .ear-card { box-shadow: 0 0 0 1px rgba(255, 59, 59, .5), 0 16px 40px rgba(0, 0, 0, .45), 0 0 50px rgba(255, 59, 59, .12); }
.d-mini { font-size: 12px; line-height: 1.6; color: #8f949e; padding: 0 4px; }
.d-mini span { display: inline-block; margin-right: 6px; padding: 0 6px; border-radius: 4px; background: rgba(255, 201, 74, .12); color: var(--gold); font-weight: 700; }
.d-tip { border-left: 3px solid var(--gold); background: rgba(255, 201, 74, .07); border-radius: 0 10px 10px 0; padding: 8px 12px; }
.d-tip b { display: block; font-size: 12px; color: var(--gold); margin-bottom: 2px; }
.d-tip p { margin: 0; font-size: 12.5px; line-height: 1.65; color: #cfc9b8; }
.d-wait { text-align: center; font-size: 13px; color: #ff8a8a; padding: 6px; animation: blink 1.6s infinite; }
.d-dock { margin-top: auto; display: grid; gap: 8px; padding-top: 10px; border-top: 1px solid rgba(255, 255, 255, .06); }
.d-actors { display: grid; gap: 4px; }
.d-act { display: flex; align-items: center; gap: 8px; padding: 4px 6px; border-radius: 8px; font-size: 12px; color: #7e838d; }
.d-ava { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; object-position: 50% 0; background: #23262c; filter: grayscale(.4); }
.d-act b { color: #b9bdc5; font-weight: 600; }
.d-act .st { color: #6d727c; }
.d-dots { margin-left: auto; display: flex; gap: 3px; }
.d-dots i { width: 12px; height: 4px; border-radius: 2px; background: #2a2d33; }
.d-dots i.on { background: #6f7480; }
.d-act.warm { background: rgba(255, 201, 74, .07); }
.d-act.warm .st, .d-act.warm b { color: var(--gold); }
.d-act.warm .d-dots i.on { background: var(--gold); }
.d-act.hot { background: rgba(255, 59, 59, .1); }
.d-act.hot .st, .d-act.hot b { color: #ff7a6b; }
.d-act.hot .d-dots i.on { background: var(--live); }
.d-act.warm .d-ava, .d-act.hot .d-ava { filter: none; }
.d-act.gone { opacity: .6; }
.d-tabs { display: flex; gap: 6px; }
.d-tabs button { position: relative; flex: 1; border: 1px solid rgba(255, 255, 255, .08); background: none; color: #8f949e; border-radius: 8px; padding: 6px 8px; font: inherit; font-size: 12px; cursor: pointer; }
.d-tabs button:hover { color: #ddd; border-color: rgba(255, 255, 255, .18); }
.d-tabs button.on { color: #fff; background: rgba(255, 255, 255, .08); }
.d-tabs i { position: absolute; top: 4px; right: 6px; width: 6px; height: 6px; border-radius: 50%; background: var(--sus); }
.d-panel { max-height: 38vh; overflow-y: auto; background: #1a1c21; border: 1px solid rgba(255, 255, 255, .06); border-radius: 10px; padding: 10px; }
.d-panel .files { background: none; border: 0; padding: 0; }
.d-panel .log p { margin: 2px 0; font-size: 13px; color: var(--dim); }

/* ===== 右栏质感：底板有一点颗粒和内高光；重点卡片浮起来，其余平铺 ===== */
.rail { padding: 12px; border-radius: 16px; background: linear-gradient(180deg, rgba(255, 255, 255, .025), transparent 30%), #16171b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .035 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), inset 0 0 0 1px rgba(255, 255, 255, .035), 0 14px 36px rgba(0, 0, 0, .38); }
@media (max-width: 900px) { .rail { margin: 0 12px; } }

/* 今日通告：一张纸，有纸纹、胶带和一点卷角阴影 */
.rail .rc.task { position: relative; margin: 6px 2px 4px; padding: 16px 16px 12px; border-radius: 3px; transform: rotate(-.4deg); background: #f1e7d1 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .35 0 0 0 0 .2 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)'/%3E%3C/svg%3E"); box-shadow: 0 1px 1px rgba(0, 0, 0, .25), 0 10px 22px rgba(0, 0, 0, .4), inset 0 -30px 40px -30px rgba(120, 90, 40, .18); }
.rail .rc.task::after { content: ''; position: absolute; left: 50%; top: -9px; width: 74px; height: 20px; transform: translateX(-50%) rotate(-2deg); background: rgba(236, 226, 196, .55); box-shadow: 0 1px 2px rgba(0, 0, 0, .15); backdrop-filter: blur(1px); }
.rail .rc.task .rc-h { font-family: 'Noto Serif SC', serif; font-weight: 700; letter-spacing: .14em; color: #8a3b1e; }
.rail .rc.task p { font-family: 'Noto Serif SC', serif; font-weight: 700; font-size: 15.5px; line-height: 1.6; color: #1d150c; }
.rail .rc.task .task-meta { padding-top: 6px; border-top: 1px dashed rgba(90, 60, 30, .3); }

/* 耳麦卡：唯一的红色，浮在最上面 */
.rail .ear-card { border: 0; border-radius: 14px; overflow: hidden; background: linear-gradient(180deg, #2b1d20 0%, #1d1b20 38%, #18191d 100%); box-shadow: 0 0 0 1px rgba(255, 86, 86, .5), inset 0 1px 0 rgba(255, 255, 255, .08), 0 18px 44px rgba(0, 0, 0, .55), 0 0 60px rgba(255, 59, 59, .12); animation: ear-in .35s cubic-bezier(.2, .8, .2, 1); }
@keyframes ear-in { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: none; } }
.rail .ear-head { position: relative; padding: 11px 14px; background: linear-gradient(180deg, rgba(255, 255, 255, .14), transparent 55%), linear-gradient(90deg, #d62b25, #8c181b); text-shadow: 0 1px 2px rgba(0, 0, 0, .35); letter-spacing: .06em; }
.rail .ear-head::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, rgba(0, 0, 0, .08) 0 1px, transparent 1px 3px); pointer-events: none; }
.rail .ear-head small { font-family: var(--mono); }
.rail .ear-dot { box-shadow: 0 0 0 3px rgba(255, 255, 255, .25), 0 0 10px #fff; }
.rail .ear-card .opts { padding: 12px; gap: 8px; }
.rail .ear-card .opt, .rail .ear-card:not(.fx-on) .opt { border: 1px solid rgba(255, 255, 255, .08); border-left: 1px solid rgba(255, 255, 255, .08); border-radius: 11px; background: linear-gradient(180deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .025)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 2px 8px rgba(0, 0, 0, .28); color: #f1efe9; transition: transform .15s, border-color .15s, background .15s, box-shadow .15s; }
.rail .ear-card .opt:hover { transform: translateY(-1px); border-color: rgba(255, 96, 96, .55); background: linear-gradient(180deg, rgba(255, 70, 70, .16), rgba(255, 70, 70, .06)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 6px 18px rgba(0, 0, 0, .35), 0 0 0 3px rgba(255, 59, 59, .08); }
.rail .ear-card .opt:active { transform: translateY(1px); }
.rail .ear-card .opt.cut { border-style: dashed; background: rgba(255, 255, 255, .02); }
.rail .okey { width: 24px; height: 24px; border-radius: 7px; color: #e9e9ec; background: linear-gradient(180deg, #3d4048, #2a2c32); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 2px 0 #0e0f12, 0 3px 6px rgba(0, 0, 0, .35); transition: background .15s, color .15s; }
.rail .opt:hover .okey { color: #fff; background: linear-gradient(180deg, #ff5a52, #d8261f); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 2px 0 #6e1210, 0 0 12px rgba(255, 59, 59, .55); }
.rail .fx-toggle { margin: 0; width: 100%; padding: 10px 14px 12px; border-top: 1px solid rgba(255, 255, 255, .05); }
.rail .fx { background: rgba(0, 0, 0, .3); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06); }

/* 选择时上面那一行“今日”，和新玩法说明 */
.d-mini { color: #a9adb6; padding: 2px 4px 0; }
.d-tip { position: relative; border-left: 0; border-radius: 10px; padding: 10px 12px 10px 14px; background: linear-gradient(90deg, rgba(255, 201, 74, .13), rgba(255, 201, 74, .035)); box-shadow: inset 3px 0 0 var(--gold), inset 0 0 0 1px rgba(255, 201, 74, .14); }
.d-tip b { letter-spacing: .06em; }

/* 底部：演员状态两行小卡，档案和指令是分段按钮 */
.d-dock { gap: 10px; padding-top: 12px; border-top: 0; position: relative; }
.d-dock::before { content: ''; position: absolute; left: 6px; right: 6px; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .1), transparent); }
.d-act { padding: 6px 8px; border-radius: 10px; background: rgba(255, 255, 255, .025); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04); }
.d-ava { width: 26px; height: 26px; box-shadow: 0 0 0 2px #24272d, 0 0 0 3px rgba(255, 255, 255, .06); }
.d-dots i { height: 5px; box-shadow: inset 0 1px 1px rgba(0, 0, 0, .5); }
.d-act.warm { box-shadow: inset 0 0 0 1px rgba(255, 201, 74, .25); }
.d-act.warm .d-dots i.on { box-shadow: 0 0 6px rgba(255, 201, 74, .5); }
.d-act.hot { box-shadow: inset 0 0 0 1px rgba(255, 59, 59, .35); }
.d-act.hot .d-dots i.on { box-shadow: 0 0 6px rgba(255, 59, 59, .6); }
.d-tabs { gap: 3px; padding: 3px; border-radius: 11px; background: rgba(0, 0, 0, .3); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 255, 255, .04); }
.d-tabs button { border: 0; border-radius: 8px; padding: 7px 8px; }
.d-tabs button.on { color: #fff; background: linear-gradient(180deg, #363940, #2a2c32); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .09), 0 1px 3px rgba(0, 0, 0, .45); }
.d-panel { border: 0; border-radius: 12px; background: rgba(0, 0, 0, .22); box-shadow: inset 0 1px 3px rgba(0, 0, 0, .45), inset 0 0 0 1px rgba(255, 255, 255, .04); animation: ear-in .25s ease-out; }

/* 收工、结局卡也浮起来 */
.rail .phase:not(.ear-card) { border: 0; border-radius: 14px; background: linear-gradient(180deg, #25272d, #1c1d22); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 0 0 1px rgba(255, 255, 255, .05), 0 14px 32px rgba(0, 0, 0, .4); }
.d-live { display: grid; grid-template-columns: auto auto 1fr auto; align-items: center; gap: 4px 8px; padding: 10px 12px; border-radius: 12px; background: rgba(255, 255, 255, .025); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .05); font-size: 12px; color: #9ca1ab; }
.d-live .rec { font-size: 10px; }
.d-live b { color: #e6e6e6; font-weight: 700; letter-spacing: .06em; }
.d-live small { font-family: var(--mono); color: #7d828c; }
.d-live p { grid-column: 1 / -1; margin: 2px 0 0; font-size: 11.5px; color: #6f747e; }
.d-steps { display: flex; gap: 4px; justify-self: center; }
.d-steps i { width: 16px; height: 4px; border-radius: 2px; background: #2c2f36; }
.d-steps i.done { background: #6f7480; }
.d-steps i.now { background: var(--live); box-shadow: 0 0 6px rgba(255, 59, 59, .6); }

/* 顶栏左边：陈安的疑心 + 林夏入戏 + 许大成怨气 */
.hudbar { grid-template-columns: auto minmax(220px, 1fr) 240px; }
.status { display: flex; align-items: stretch; gap: 0; }
.st-sus { width: 220px; padding-right: 16px; }
.st-act { width: 150px; padding: 0 14px; border-left: 1px solid rgba(255, 255, 255, .07); }
.st-ava { flex: none; width: 20px; height: 20px; border-radius: 50%; object-fit: cover; object-position: 50% 0; background: #23262c; filter: grayscale(.5); }
.st-act .st-k { white-space: nowrap; }
.st-warn { margin-left: auto; font-size: 11px; font-weight: 700; white-space: nowrap; }
.st-dots { display: grid; grid-template-columns: repeat(5, 1fr) 14px; gap: 3px; align-items: center; margin: 6px 0 4px; }
.st-dots em { height: 10px; border-radius: 2px; background: #2a2d34; }
.st-dots em.on { background: #7b808b; }
.st-dots b { font-family: var(--mono); text-align: right; font-size: 13px; }
.st-act.warm .st-dots em.on { background: var(--gold); box-shadow: 0 0 6px rgba(255, 201, 74, .45); }
.st-act.warm .st-warn { color: var(--gold); }
.st-act.hot .st-dots em.on { background: var(--sus); box-shadow: 0 0 6px rgba(255, 59, 59, .55); }
.st-act.hot .st-warn { color: var(--sus); }
.st-act.warm .st-ava, .st-act.hot .st-ava { filter: none; }
.st-act.hot .st-ava { box-shadow: 0 0 0 2px var(--sus); }
.st-gone { margin-top: 8px; font-size: 12px; color: var(--dim); }
.st-act.gone { opacity: .6; }
@media (max-width: 900px) { .status { flex-wrap: wrap; gap: 8px 0; } .st-sus { width: 100%; padding: 0; } .st-act { flex: 1; width: auto; } .st-sus + .st-act { border-left: 0; padding-left: 0; } }
.prop-shot.still, .prop-shot.still img { animation: none; }
.prop-shot.still img { transform: scale(1.08); }

/* 耳麦标题字小一点 */
.rail .ear-head { font-size: 13px; padding: 9px 14px; }
/* 开场认人：人物卡 */
.pcard { position: absolute; right: 4%; top: 12%; z-index: 6; width: min(300px, 42%); display: grid; grid-template-columns: 76px 1fr; gap: 12px; padding: 14px 14px 12px; border-radius: 14px; color: #f3ead8; background: linear-gradient(160deg, rgba(40, 34, 30, .96), rgba(20, 18, 18, .96)); border: 1px solid rgba(232, 190, 110, .45); box-shadow: 0 14px 40px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .08); pointer-events: none; }
.pcard .pc-ava { width: 76px; height: 76px; border-radius: 10px; object-fit: cover; object-position: top; background: #3a302a; }
.pcard b { display: block; font-size: 20px; letter-spacing: .08em; color: #ffd98a; }
.pcard small { display: block; margin: 2px 0 6px; font-size: 12px; opacity: .75; }
.pcard p { margin: 0; font-size: 13px; line-height: 1.55; }
.pcard .pc-foot { grid-column: 1 / -1; padding-top: 8px; border-top: 1px dashed rgba(232, 190, 110, .3); font-size: 11px; letter-spacing: .1em; color: #e8be6e; }
.pcard.in { animation: pcard-in .45s cubic-bezier(.2, .8, .3, 1.2); }
.pcard.out { animation: pcard-out .9s cubic-bezier(.5, 0, .7, .4) forwards; }
@keyframes pcard-in { from { opacity: 0; transform: translateY(14px) scale(.92); } }
@keyframes pcard-out { 25% { opacity: 1; transform: none; } 100% { opacity: .2; transform: translate(var(--dx, 45vw), var(--dy, 55vh)) scale(.12); } }
.d-tabs button.ping { animation: tab-ping .5s .75s 3 ease-in-out; }
@keyframes tab-ping { 50% { background: #e8be6e; color: #1a1612; transform: scale(1.08); } }
@media (max-width: 640px) { .pcard { width: 62%; grid-template-columns: 52px 1fr; padding: 10px; gap: 8px; } .pcard .pc-ava { width: 52px; height: 52px; } .pcard b { font-size: 16px; } .pcard p { display: none; } }

/* 存档 / 读档：三个栏位 */
.sl-box { width: min(520px, 100%); }
.sl-list { padding: 10px 14px 14px; display: grid; gap: 8px; }
.sl-row { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06); text-align: left; }
.sl-row.just { box-shadow: inset 0 0 0 1px var(--gold); }
.sl-no { flex: none; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; background: rgba(255, 255, 255, .08); font: 600 14px var(--mono); color: var(--gold); }
.sl-info { flex: 1; min-width: 0; }
.sl-info b { display: block; font-size: 14px; }
.sl-info p { margin: 3px 0 2px; font-size: 12.5px; color: #c9c5bb; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sl-info small { font: 11px var(--mono); color: var(--dim); }
.sl-btns { flex: none; display: flex; gap: 6px; }
.sl-btns .btn { padding: 6px 12px; font-size: 13px; }
.sl-btns .btn:active { transform: scale(.95); }
@media (max-width: 520px) { .sl-row { flex-wrap: wrap; } .sl-btns { width: 100%; justify-content: flex-end; } }

/* ===== 2026-11-08 反馈：字号统一、顶栏工具、收工卡、结局演出 ===== */
/* 右栏字号：标题比正文大一号，选项正文小一号 */
.rail .rc.task .rc-h { font-size: 15px; }
.rail .rc.task p { font-size: 13.5px; font-weight: 600; }
.rail .otext { font-size: 13.5px; }
.rail .phase .tag { font-size: 15px; }

/* 顶栏右边：日程 + 存档/声音 */
.hud-r { display: grid; gap: 6px; justify-items: end; }
.hud-tools { display: flex; gap: 6px; }
.hud-tools button { border: 1px solid rgba(255, 255, 255, .14); background: rgba(255, 255, 255, .05); color: #d6d8de; border-radius: 8px; padding: 4px 10px; font: inherit; font-size: 12px; cursor: pointer; }
.hud-tools button:hover { color: #fff; border-color: rgba(255, 255, 255, .3); }
.hud-tools button:active { transform: scale(.95); }
body:has(main.game) .snd { display: none; }
.curve .cv-head .strike { color: var(--dim); }
.curve .cv-head .strike.on { color: var(--sus); font-weight: 700; }
@media (max-width: 900px) { .hud-r { justify-items: start; } }

/* 收工卡 */
.nc-pass { margin: 4px 0 8px; font-size: 13px; }
.nc-pass.ok { color: var(--bond); }
.nc-pass.bad { color: var(--sus); }
.nc-list { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 6px; }
.nc-list li { display: grid; gap: 2px; }
.nc-list small { color: #a9adb6; font-size: 12px; line-height: 1.5; }

/* 手机里直接继续 */
.cm-next { display: block; width: calc(100% - 20px); margin: 8px 10px 10px; padding: 10px; border: 0; border-radius: 10px; background: #07c160; color: #fff; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.cm-next:active { transform: scale(.97); }

/* 结局：他不装了——画面发红、雪花、抖 */
.stage.end-found::after { content: ''; position: absolute; inset: 0; z-index: 7; pointer-events: none; background: radial-gradient(ellipse at center, transparent 40%, rgba(120, 0, 0, .55)), repeating-linear-gradient(0deg, rgba(0, 0, 0, .18) 0 2px, transparent 2px 4px); animation: found-flicker 2.4s steps(1) infinite; mix-blend-mode: multiply; }
.stage.end-found .shot, .stage.end-found .cam { animation: found-glitch 3.2s infinite; }
@keyframes found-flicker { 0%, 100% { opacity: 1; } 47% { opacity: .75; } 48% { opacity: 1; } 83% { opacity: .6; } 84% { opacity: 1; } }
@keyframes found-glitch { 0%, 92%, 100% { transform: none; filter: none; } 93% { transform: translateX(-6px); filter: hue-rotate(-20deg) saturate(1.6); } 95% { transform: translateX(5px); } 97% { transform: none; filter: contrast(1.4); } }
.stage.end-found .rec { color: #ff3b3b; animation: slip-blink .5s steps(1) infinite; }

/* 手机：顶栏一列（上面那条三列规则会把页面撑到 580px 宽） */
@media (max-width: 900px) { .hudbar { grid-template-columns: minmax(0, 1fr); } .hud-r { justify-items: stretch; } .hud-r .dayinfo { text-align: left; } }
@media (max-width: 900px) { .lc .stage { height: auto; width: 100%; } }

/* 冷开场：先装成一款普通古风游戏，导播间界面全藏起来 */
main.game.cold .hudbar, main.game.cold .rail, main.game.cold .osd, main.game.cold .pip { display: none; }
main.game.cold .lc-body { grid-template-columns: minmax(0, 1fr); }
main.game.cold .stage { border-radius: 0; box-shadow: none; }
body:has(main.game.cold) #dm { display: none; }
/* 穿帮那一下：顶栏、右栏滑进来，片名砸下来 */
main.game.reveal .hudbar { animation: hud-in .6s cubic-bezier(.2, .8, .2, 1); }
main.game.reveal .rail { animation: rail-in .7s cubic-bezier(.2, .8, .2, 1); }
@keyframes hud-in { from { opacity: 0; transform: translateY(-30px); } }
@keyframes rail-in { from { opacity: 0; transform: translateX(40px); } }
.title-drop { position: absolute; inset: 0; z-index: 12; display: grid; place-items: center; pointer-events: none; background: radial-gradient(ellipse at center, rgba(0, 0, 0, .55), rgba(0, 0, 0, .15) 70%); animation: td-bg 2.6s ease-out forwards; }
.title-drop b { font-family: 'Noto Serif SC', serif; font-weight: 900; font-size: clamp(34px, 6vw, 84px); letter-spacing: .12em; color: #fff; text-shadow: 0 4px 30px rgba(0, 0, 0, .7), 0 0 2px #000; animation: td-in 2.6s cubic-bezier(.2, .8, .2, 1) forwards; }
@keyframes td-in { 0% { opacity: 0; transform: scale(1.35); filter: blur(6px); } 18% { opacity: 1; transform: scale(1); filter: none; } 80% { opacity: 1; } 100% { opacity: 0; } }
@keyframes td-bg { 0%, 80% { opacity: 1; } 100% { opacity: 0; } }

/* 冷开场：上下电影黑边 */
main.game.cold .stage::before, main.game.cold .stage::after { content: ''; position: absolute; left: 0; right: 0; height: 9%; z-index: 11; background: #000; pointer-events: none; }
main.game.cold .stage::before { top: 0; }
main.game.cold .stage::after { bottom: 0; }
main.game.cold .stage .dlg { bottom: 11%; }
/* 树上藏着的摄像头：红点闪一下 */
.redeye { position: absolute; z-index: 8; left: 81%; top: 24%; width: 14px; height: 14px; border-radius: 50%; background: #ff2a2a; box-shadow: 0 0 10px 3px rgba(255, 40, 40, .8); animation: redeye 1.6s steps(1) 2; pointer-events: none; }
@keyframes redeye { 0%, 30% { opacity: 1; } 31%, 100% { opacity: 0; } }
/* 镜头后拉：5×5 监视器墙，正中那一格是刚才的账房，从满屏缩回原位，再淡出露出导播间 */
.pullback { position: absolute; inset: 0; z-index: 10; background: #050608; overflow: hidden; animation: pb-out 3.4s ease-in forwards; pointer-events: none; }
.pb-grid { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(5, 1fr); grid-template-rows: repeat(5, 1fr); gap: 0.6%; padding: 0.6%; transform-origin: 50% 50%; animation: pb-zoom 2.2s cubic-bezier(.7, 0, .25, 1) forwards; }
.pb-tile { position: relative; overflow: hidden; border-radius: 2px; background: #111; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.pb-tile img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.8) brightness(.8); }
.pb-tile span { position: absolute; left: 6%; top: 6%; font: 700 clamp(6px, .7vw, 10px) var(--mono); color: #fff; background: rgba(0, 0, 0, .55); padding: 0 3px; }
.pb-tile.me img { filter: none; }
.pb-tile.me { box-shadow: 0 0 0 2px #ff3b3b; }
@keyframes pb-zoom { 0% { transform: scale(5); } 15% { transform: scale(5); } 100% { transform: scale(1); } }
@keyframes pb-out { 0%, 78% { opacity: 1; } 100% { opacity: 0; } }
.title-drop.late, .title-drop.late b { animation-delay: 1.9s; animation-fill-mode: both; }

/* 话筒杆：叠在账房插画上，从房梁滑下来，晃两下停住 */
.shot.cg { container-type: size; }
.boom-sprite { --iw: max(100cqw, 177.78cqh); --ih: calc(var(--iw) * .5625); position: absolute; z-index: 2; left: calc((100cqw - var(--iw)) / 2 + var(--iw) * .41); top: calc((100cqh - var(--ih)) / 2 - var(--ih) * .19); width: calc(var(--iw) * .36); pointer-events: none; transform-origin: 100% 0; filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .35)); }
.boom-sprite.b-收, .boom-sprite.b-收.anim { transform: translate(18%, -105%); }
.boom-sprite.b-降.anim { animation: boom-drop 2.6s cubic-bezier(.25, .8, .3, 1) both; }
.boom-sprite.b-收.anim { animation: boom-up .7s cubic-bezier(.6, 0, .9, .4) both; }
@keyframes boom-drop { 0% { transform: translate(18%, -105%) rotate(0); } 70% { transform: translate(0, 2%) rotate(-1.5deg); } 82% { transform: translate(0, -1%) rotate(1deg); } 92% { transform: translate(0, .5%) rotate(-.4deg); } 100% { transform: none; } }
@keyframes boom-up { from { transform: none; } to { transform: translate(18%, -105%); } }

/* 直播画面角上的广告字幕 */
.ad-banner { position: absolute; z-index: 9; right: 3%; bottom: 26%; padding: 8px 14px 8px 10px; border-radius: 6px; background: linear-gradient(90deg, #ff3b3b, #ff8a00); color: #fff; font-weight: 800; font-size: clamp(13px, 1.4vw, 18px); letter-spacing: .04em; box-shadow: 0 6px 20px rgba(0, 0, 0, .4); animation: ad-in .5s cubic-bezier(.2, .8, .2, 1) both; pointer-events: none; }
.ad-banner b { margin-right: 8px; padding: 1px 6px; border-radius: 3px; background: rgba(0, 0, 0, .25); font-size: .7em; vertical-align: middle; }
@keyframes ad-in { from { opacity: 0; transform: translateX(30px); } }
/* 轮到耳麦三选一：画面四周一圈红色呼吸光（穿帮时是更强的 slip-on） */
.stage.alert-on::after { content: ''; position: absolute; inset: 0; z-index: 8; pointer-events: none; border-radius: inherit; box-shadow: inset 0 0 0 3px rgba(255, 59, 59, .85), inset 0 0 170px rgba(190, 0, 0, .6); animation: heartbeat 1.1s ease-out infinite; will-change: opacity; }
@keyframes heartbeat { 0% { opacity: .3; } 9% { opacity: 1; } 20% { opacity: .45; } 31% { opacity: .9; } 60%, 100% { opacity: .3; } }
@keyframes alert-breathe { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
/* 回看 */
.bl-box { width: min(620px, 100%); }
.bl-list { overflow-y: auto; padding: 8px 18px 18px; text-align: left; font-size: 14px; line-height: 1.7; }
.bl-list p { margin: 8px 0; }
.bl-list b { display: inline-block; min-width: 4.5em; margin-right: 8px; color: var(--gold); }
.bl-narr { color: #b9b6ad; font-style: italic; }
.bl-room b, .bl-cue b { color: #ff8a8a; }
.bl-cue { color: #ffe1a6; }
.hud-tools button { white-space: nowrap; }

/* 选章 */
.ch-box { width: min(560px, 100%); }
.ch-list { overflow-y: auto; padding: 10px 14px 14px; display: grid; gap: 6px; }
.ch-row { display: grid; grid-template-columns: 13em 1fr; grid-template-rows: auto auto; column-gap: 12px; text-align: left; padding: 10px 12px; border: 0; border-radius: 10px; background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06); color: var(--text); font: inherit; cursor: pointer; }
.ch-row:hover { background: rgba(255, 201, 74, .1); box-shadow: inset 0 0 0 1px rgba(255, 201, 74, .4); }
.ch-row:active { transform: scale(.98); }
.ch-act { grid-row: span 2; align-self: center; font: 12px var(--mono); color: var(--gold); }
.ch-row b { font-size: 15px; }
.ch-row small { color: #a9adb6; font-size: 12px; line-height: 1.5; }
@media (max-width: 520px) { .ch-row { grid-template-columns: 1fr; } .ch-act { grid-row: auto; } }
.task-meta .spon.todo { color: #ff6b6b; font-weight: 700; }
.task-meta .spon.ok { color: #2f9e6e; font-weight: 700; }

/* 结局落幕卡 */
.endcard { position: absolute; inset: 0; z-index: 14; display: grid; place-items: center; background: radial-gradient(ellipse at center, rgba(0, 0, 0, .55), rgba(0, 0, 0, .88)); animation: ec-in 1.6s ease-out both; }
.ec-box { text-align: center; padding: 28px 36px; max-width: 520px; }
.ec-box small { font: 12px var(--mono); letter-spacing: .2em; color: #b9b6ad; }
.ec-box h2 { margin: 10px 0 6px; font-family: 'Noto Serif SC', serif; font-weight: 900; font-size: clamp(24px, 3.2vw, 40px); letter-spacing: .08em; white-space: nowrap; color: #fff; animation: ec-title 1.8s cubic-bezier(.2, .8, .2, 1) both; }
.ec-box p { margin: 0 0 18px; color: var(--gold); font-size: 15px; }
.ec-rows { display: grid; gap: 6px; margin: 0 auto 20px; max-width: 320px; }
.ec-row { display: flex; justify-content: space-between; gap: 16px; padding: 6px 12px; border-radius: 8px; background: rgba(255, 255, 255, .06); font-size: 13px; color: #c9c5bb; }
.ec-row b { color: #fff; }
@keyframes ec-in { from { opacity: 0; } }
@keyframes ec-title { from { opacity: 0; letter-spacing: .5em; filter: blur(4px); } }

/* 场记板：矮屏收紧，别被截断 */
@media (max-height: 820px) { .slate-board { gap: 8px; } .sb-body { padding: 10px 16px; font-size: 13px; } .sb-title { font-size: 24px; margin: 4px 0 2px; } .sb-row { padding: 2px 0; } .sb-plot { padding: 4px 0; } .sb-plot p { line-height: 1.45; } .sb-clap { height: 28px; } }
/* 压暗：灯一盏一盏灭。用一层黑幕盖上去，不用 filter（filter 每帧重算整张大图，会卡） */
.cam.dim-in::after, .cam.dim-on::after, .shot.dim-in::after, .shot.dim-on::after { content: ''; position: absolute; inset: 0; background: rgba(4, 4, 10, .6); pointer-events: none; will-change: opacity; }
.cam.dim-in::after, .shot.dim-in::after { animation: dim-down 2.8s ease-in both; }
@keyframes dim-down { from { opacity: 0; } }

/* 等导演下指令：画面慢慢推近、颜色发冷发灰、上下黑边压进来、四角压暗，红框按心跳跳 */
.stage.tense :is(.cam, .shot) > :is(img, .figs, .solo, .ots-back, .ots-face) { animation: tense-push 10s cubic-bezier(.2, .6, .3, 1) var(--tt, 0s) forwards; will-change: transform; }
@keyframes tense-push { from { transform: scale(1); } to { transform: scale(1.09); } }
.tense-bars { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at center, rgba(10, 20, 40, .22) 45%, rgba(0, 0, 0, .7) 100%); animation: fade-in .6s var(--tt, 0s) both; will-change: opacity; }
.tense-bars::before, .tense-bars::after { content: ''; position: absolute; left: 0; right: 0; height: 8%; background: #000; animation: bar-in .55s cubic-bezier(.2, .8, .3, 1) var(--tt, 0s) both; }
.tense-bars::before { top: 0; transform-origin: top; }
.tense-bars::after { bottom: 0; transform-origin: bottom; }
@keyframes bar-in { from { transform: scaleY(0); } }
@keyframes fade-in { from { opacity: 0; } }
.stage.tense .rec { animation: slip-blink .7s steps(2) infinite; }

/* 桌面端整页固定一屏，不上下滑：顶栏定高，下面舞台和右栏吃满剩下的高度，右栏内容多了在栏里滚 */
@media (min-width: 901px) {
  body:has(main.game.lc) { overflow: hidden; }
  .game.lc { height: 100vh; height: 100dvh; box-sizing: border-box; display: flex; flex-direction: column; align-items: stretch; }
  .game.lc > .hudbar { flex: none; }
  .game.lc > .lc-body { flex: 1; min-height: 0; align-items: stretch; grid-template-rows: minmax(0, 1fr); }
  .lc .stage { height: auto; min-height: 0; }
  .game.lc .lc-body > .rail { height: auto; max-height: none; min-height: 0; overflow-y: auto; }
}
/* 性能：舞台上的对白框、耳麦条不再做背景模糊——底下画面一直在推、在摇、在压暗，模糊每帧都要重算，会卡。背景本来就近乎不透明 */
.stage .dlg, .stage .ear-bar, .stage .hud-tl, .stage .hud-tr { backdrop-filter: none; -webkit-backdrop-filter: none; }

/* 一年后：不再是导播间的监视器——收掉顶栏、右栏、LIVE 角标和弹幕，整块画面像片尾，字幕居中压在下方 */
.game.epi .hudbar, .game.epi .rail, .game.epi .osd, .game.epi .wait, .game.epi .pip { display: none; }
.game.epi .lc-body { grid-template-columns: minmax(0, 1fr); }
.game.epi .stage { border: 0; box-shadow: none; background: #000; }
.game.epi .stage::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(0, 0, 0, .25), transparent 30%, transparent 55%, rgba(0, 0, 0, .78)); }
.game.epi .dlg { z-index: 2; left: 50%; right: auto; transform: translateX(-50%); width: min(820px, 86%); min-height: 0; bottom: 8%; background: none; border: 0; box-shadow: none; text-align: center; font-family: 'Noto Serif SC', serif; font-style: normal; font-size: 19px; line-height: 1.9; color: #f4efe4; text-shadow: 0 2px 10px rgba(0, 0, 0, .9); animation: epi-in .9s ease-out; }
.game.epi .dlg b, .game.epi .dlg .who { display: none; }
@keyframes epi-in { from { opacity: 0; transform: translate(-50%, 8px); } }
/* 顶栏：今天的赞助植入了没有 */
.curve .cv-head .spon { font-size: 12px; padding: 1px 8px; border-radius: 99px; white-space: nowrap; }
.curve .cv-head .spon.miss { color: #ffb1a8; background: rgba(224, 36, 36, .18); border: 1px solid rgba(255, 90, 80, .45); animation: slip-blink 1.6s steps(2) infinite; }
.curve .cv-head .spon.ok { color: #9be3b0; background: rgba(60, 180, 100, .14); border: 1px solid rgba(90, 200, 120, .35); }
/* 结局卡：中途停播的原因 */
.ec-why { margin: 4px auto 14px; max-width: 460px; text-align: left; padding: 10px 14px; border-radius: 10px; background: rgba(224, 36, 36, .1); border: 1px solid rgba(255, 90, 80, .3); font-size: 13px; }
.ec-why b { display: block; color: #ffb1a8; margin-bottom: 6px; }
.ec-why p { margin: 3px 0; display: flex; gap: 8px; align-items: baseline; }
.ec-why p span { color: var(--dim); font-size: 12px; white-space: nowrap; }
.ec-why p em { margin-left: auto; font-style: normal; color: #ffb1a8; white-space: nowrap; }
.ec-why small { display: block; margin-top: 8px; color: var(--dim); line-height: 1.6; }

/* 试探：耳麦卡片上的黄框 */
.ear-slip.ear-test { color: #fff3d1; background: linear-gradient(rgba(240, 180, 40, .28), rgba(190, 130, 20, .22)); border-color: rgba(255, 200, 80, .55); }
.ear-slip.ear-test b { background: #d99a12; }
/* 下雨：他让下，就下了 */
.rain { position: absolute; inset: 0; pointer-events: none; opacity: .9; background-color: rgba(20, 30, 50, .25); background-image: repeating-linear-gradient(104deg, transparent 0 14px, rgba(210, 225, 250, .55) 14px 15.5px, transparent 15.5px 38px); background-size: 160px 220px; animation: rain-fall .5s linear infinite; will-change: background-position; }
@keyframes rain-fall { to { background-position: -40px 220px; } }

/* 镜头后拉：开场视频（账房 → 监视器墙 → 导播间，8 秒）。视频放不了就退回下面那层 5×5 动画 */
.pullvid { position: absolute; inset: 0; z-index: 11; width: 100%; height: 100%; object-fit: cover; background: #000; pointer-events: none; }
.pullvid.done { animation: pv-out .7s ease-out forwards; }
@keyframes pv-out { to { opacity: 0; } }
.title-drop.vid, .title-drop.vid b { animation-delay: 6.3s; animation-fill-mode: both; }

/* 关键时刻的短视频：盖在插画上，播完停在最后一帧；放不了就直接露出底下的插画 */
.stage video.film { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #000; pointer-events: none; animation: fade-in .4s ease-out; }
