/* 演讲台 Rostrumly · A 新闻演播室：海军蓝底、直播红、标题黄；Barlow Condensed 窄体大写 + Barlow
   版式：首屏带下方字幕条（随表单变）；表单竖排三段节目单，左编号、中填写、右监视器 */
:root{
  --radius:4px;--radius-ctl:3px;--radius-pill:4px;
  --bg:#0a1a31;--panel:#10284a;--panel-2:#0d2240;--line:#ffffff1c;--line-2:#ffffff33;
  --gold:#e11d2e;--gold-bright:#ffc93c;--gold-deep:#a3121f;--gold-soft:#3a1420;
  --ink:#ffffff;--ink-dim:#b9c7dc;--ink-faint:#7f93b3;--warn:#ff8a3d;
  --glow-1:transparent;--glow-2:transparent;--glow-3:transparent;
  --font-display:"Barlow Condensed","Barlow",system-ui,"PingFang SC","Microsoft YaHei","Noto Sans Thai","Leelawadee UI","Noto Sans Arabic",sans-serif;
  --font-body:"Barlow",system-ui,"Segoe UI","PingFang SC","Microsoft YaHei","Noto Sans Thai","Leelawadee UI","Noto Sans Arabic",sans-serif;
}
html,body{overflow-x:clip}
body{background:var(--bg);font-size:15px}
body::before{background:linear-gradient(180deg,#0f2a50 0,#0a1a31 520px)}

/* ---------- 顶栏：深蓝 + 底下一道直播红 ---------- */
header{background:#0b1f3aee;border-bottom:3px solid var(--gold)}
.tb{height:68px}
.logo{border-radius:3px;background:var(--gold);font-family:var(--font-display);font-weight:800;font-size:22px}
.brand .nm{font-family:var(--font-display);font-weight:800;font-size:22px;letter-spacing:.06em;text-transform:uppercase;line-height:1}
.brand .sub{font-family:var(--font-display);font-weight:600;font-size:11px;letter-spacing:.24em;color:var(--ink-dim)}
.pill-btn,.lang-select{border-radius:3px;background:transparent;border:1px solid var(--line-2);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
  font-family:var(--font-display);font-weight:600;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.pill-btn:hover,.lang-select:hover{background:#ffffff14;transform:none}
.lang-select{text-transform:none;letter-spacing:0}
.avatar{border-radius:3px;background:#23497e}
.banner{border-radius:3px}

/* ---------- 首屏 ---------- */
#view-new{max-width:1240px;padding:44px 40px 72px}
.rs-hero{margin-bottom:34px}
.rs-kicker{display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:700;font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim)}
.rs-live{background:var(--gold);color:#fff;padding:2px 9px;letter-spacing:.16em;font-weight:800;position:relative;padding-inline-start:22px}
.rs-live::before{content:"";position:absolute;inset-inline-start:8px;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;background:#fff;animation:rsBlink 1.4s infinite}
@keyframes rsBlink{50%{opacity:.25}}
.rs-hero h1{font-family:var(--font-display);font-weight:800;font-size:clamp(40px,6vw,76px);line-height:.95;text-transform:uppercase;margin:16px 0 14px;letter-spacing:.005em;white-space:nowrap}
.rs-hero p{color:var(--ink-dim);font-size:17px;max-width:720px;margin:0 0 26px;line-height:1.55}
.rs-ticker{display:flex;align-items:stretch;font-family:var(--font-display);font-size:19px;font-weight:600;overflow:hidden;max-width:100%}
.rs-ticker b{background:var(--gold);color:#fff;padding:7px 16px;font-weight:800;letter-spacing:.1em;flex-shrink:0}
.rs-ticker input{background:#fff;color:#0b1f3a;padding:7px 16px;border:0;border-radius:0;min-width:0;flex:1 1 auto;font:inherit;outline:none}
.rs-ticker input::placeholder{color:#7f93b3}
.rs-ticker input:focus{box-shadow:inset 0 -3px 0 var(--gold)}
.rs-ticker em{font-style:normal;background:#0b1f3a;color:var(--gold-bright);padding:7px 16px;letter-spacing:.08em;white-space:nowrap;flex-shrink:0;border:1px solid #ffffff22;border-inline-start:0}

/* ---------- 节目单：竖排三段 ---------- */
.form-grid{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line-2)}
.fcard.rs-seg{display:grid;grid-template-columns:96px minmax(0,1fr) 340px;gap:0 32px;align-items:start;
  background:transparent;border:0;border-bottom:1px solid var(--line-2);border-radius:0;padding:30px 0;box-shadow:none;position:relative}
.fcard.rs-seg:hover{border-color:var(--line-2)}
.fcard.rs-seg::before{content:"";position:absolute;inset-inline-start:0;top:30px;bottom:30px;width:4px;background:#ffffff1f;transition:background .2s}
.fcard.rs-seg:focus-within::before{background:var(--gold)}
.rs-rail{padding-inline-start:20px}
.rs-no{font-family:var(--font-display);font-weight:800;font-size:56px;line-height:.9;color:#ffffff38;transition:color .2s}
.fcard.rs-seg:focus-within .rs-no{color:var(--gold-bright)}
.rs-body{display:flex;flex-direction:column;gap:16px;min-width:0}
.rs-body h3{font-family:var(--font-display);font-weight:800;font-size:28px;letter-spacing:.04em;text-transform:uppercase;margin:0}
.rs-body h3 .code{display:none}
.field label{font-family:var(--font-display);font-weight:600;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-dim)}
.field textarea,.field input,.field select{background:#071630;border:1px solid var(--line-2);border-radius:3px;font-size:15px;color:#fff}
.field textarea:hover,.field input:hover,.field select:hover,.field textarea:focus,.field input:focus,.field select:focus{background:#071630;border-color:#ffffff66}
.field textarea:focus,.field input:focus,.field select:focus{box-shadow:0 0 0 2px #e11d2e66;border-color:var(--gold)}
.field select option{background:#0b1f3a}
.uploader{border-radius:3px;background:#071630;border:1px dashed #ffffff4d;font-size:14px}
.uploader.set{border-color:var(--gold-bright);color:var(--gold-bright)}
.row2{gap:16px}

/* 监视器 */
.rs-mon{position:sticky;top:96px}
.rs-mon svg{display:block;width:100%;height:auto;border:6px solid #050d1c;border-radius:4px;box-shadow:0 0 0 1px #ffffff22,0 18px 40px #0008;background:#06142a}
.rs-cap{margin-top:10px;font-family:var(--font-display);font-weight:600;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint)}
.rs-mon text{font-family:"Barlow Condensed","Barlow",system-ui,sans-serif}
.m-lab,.m-tc{font-size:11px;font-weight:700;letter-spacing:.14em;fill:#7f93b3}
.m-tc{fill:#ffc93c}
.m-pr{font-size:19px;font-weight:700;fill:#fff}
.m-pr.next{fill:#ffffff99}
.m-pr.dim{fill:#ffffff55;font-weight:600}
.m-note{font-size:11px;font-weight:600;letter-spacing:.06em;fill:#ffc93c}
.m-live{font-size:10px;font-weight:800;letter-spacing:.14em;fill:#fff}
.m-chip{font-size:12px;font-weight:700;letter-spacing:.12em;fill:#ffc93c}
.m-l3a{font-size:11px;font-weight:800;letter-spacing:.12em;fill:#fff}
.m-l3b{font-size:12px;font-weight:700;fill:#0b1f3a}
.m-set{font-size:11px;font-weight:700;letter-spacing:.1em;fill:#fff;text-transform:uppercase}
.m-cam{font-size:9.5px;font-weight:700;letter-spacing:.1em;fill:#b9c7dc}
.rs-cam .cone{fill:#ffffff10;stroke:#ffffff26;stroke-width:1}
.rs-cam .body{fill:#b9c7dc}
.rs-cam .tally{fill:#33476a}
.rs-cam0 .tally{animation:rsTally 4.8s infinite 0s}
.rs-cam1 .tally{animation:rsTally 4.8s infinite 1.6s}
.rs-cam2 .tally{animation:rsTally 4.8s infinite 3.2s}
.rs-cam0 .cone{animation:rsCone 4.8s infinite 0s}
.rs-cam1 .cone{animation:rsCone 4.8s infinite 1.6s}
.rs-cam2 .cone{animation:rsCone 4.8s infinite 3.2s}
@keyframes rsTally{0%,33%{fill:#e11d2e}34%,100%{fill:#33476a}}
@keyframes rsCone{0%,33%{fill:#e11d2e22;stroke:#e11d2e77}34%,100%{fill:#ffffff10;stroke:#ffffff26}}
@media (prefers-reduced-motion:reduce){.rs-cam .tally,.rs-cam .cone,.rs-live::before{animation:none}}

/* 开始 */
.start-row{margin-top:30px;gap:18px}
.start-row .btn,.btn{border-radius:3px;background:var(--gold);border:0;color:#fff;box-shadow:0 10px 26px #e11d2e40;
  font-family:var(--font-display);font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.start-row .btn{font-size:20px;padding:15px 34px}
.btn:hover{background:#f0283a;transform:none}
.start-row .btn::before{content:"";width:9px;height:9px;border-radius:50%;background:#fff;margin-inline-end:4px}

/* ---------- 页脚 ---------- */
.rs-foot{position:relative;z-index:1;border-top:1px solid var(--line);padding:22px 16px;text-align:center;
  font-family:var(--font-display);font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:13px;color:var(--ink-faint)}

/* ---------- 手机 ---------- */
@media (max-width:1100px){
  .fcard.rs-seg{grid-template-columns:64px minmax(0,1fr)}
  .rs-mon{grid-column:2;position:static;margin-top:22px}
  .rs-no{font-size:40px}
  .rs-rail{padding-inline-start:16px}
}
@media (max-width:640px){
  #view-new{padding:28px 16px 56px}
  .tb{height:auto;min-height:60px;flex-wrap:wrap;padding:10px 16px;row-gap:10px}
  .tb-right{flex-wrap:wrap;gap:8px;width:100%;justify-content:flex-start}
  .rs-hero h1{white-space:normal;font-size:44px}
  .rs-ticker{flex-wrap:wrap;font-size:16px}
  .rs-ticker input{flex-basis:calc(100% - 80px)}
  .rs-ticker em{flex-basis:100%;border-inline-start:1px solid #ffffff22;border-top:0}
  .fcard.rs-seg{grid-template-columns:minmax(0,1fr);padding:24px 0}
  .fcard.rs-seg::before{top:24px;bottom:auto;height:44px}
  .rs-rail{padding-inline-start:16px}
  .rs-mon{grid-column:1}
  .row2{grid-template-columns:minmax(0,1fr)}
}
.avatar:empty{display:none}

/* ---------- 制作页：导播间 ---------- */
.run-top{padding:22px 40px 4px}
.run-top .rt-title{font-family:var(--font-display);font-weight:800;font-size:30px;letter-spacing:.04em;text-transform:uppercase}
.pkg-btn{border-radius:3px;background:var(--gold);border:0;box-shadow:none;font-family:var(--font-display);font-weight:800;font-size:15px;letter-spacing:.08em;text-transform:uppercase}
.run-layout{grid-template-columns:minmax(0,1fr) 360px;gap:28px;padding:14px 40px 56px}
.rs-desk{position:sticky;top:86px;display:flex;flex-direction:column;gap:14px;background:#071630;border:1px solid var(--line-2);border-radius:4px;padding:16px}
.rs-desk .step-nav,.rs-desk .info-panel{position:static}
.rs-desk-h{font-family:var(--font-display);font-weight:800;font-size:18px;letter-spacing:.14em;text-transform:uppercase;border-bottom:3px solid var(--gold);padding-bottom:8px}
/* 节目单：每行 编号 · 名称 · 指示灯 */
.step-nav{gap:0;counter-reset:rd}
.sn-group{font-family:var(--font-display);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-bright);margin:12px 0 4px;padding:0}
.sn-item{counter-increment:rd;border-radius:0;border:0;border-bottom:1px solid #ffffff14;padding:9px 6px;font-size:14px;gap:12px}
.sn-item::before{content:counter(rd,decimal-leading-zero);font-family:var(--font-display);font-weight:800;font-size:16px;color:var(--ink-faint);width:22px}
.sn-item .lbl{order:1}
.sn-item .st{order:2;width:12px;height:12px;border:0;background:#33476a;font-size:0}
.sn-item .st.done{background:#3fbf7f}
.sn-item .st.doing{background:var(--gold);box-shadow:0 0 10px var(--gold);animation:rsBlink 1.2s infinite}
.sn-item .st.doing::after{display:none}
.sn-item .st.await{background:var(--gold-bright)}
.sn-item .st.stale,.sn-item .st.failed{background:var(--warn)}
.sn-item .code{display:none}
.sn-item.on{background:#ffffff14;color:#fff}
.sn-item:hover{background:#ffffff0d}
.ip-card{border-radius:3px;background:#0d2240;border-color:#ffffff1c}
.ip-card h4{font-family:var(--font-display);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim)}
.btn.gold-line,.btn.ghost{border-radius:3px;background:transparent;border:1px solid var(--line-2);color:#fff;box-shadow:none}
.btn.gold-line:hover,.btn.ghost:hover{background:#ffffff14;color:#fff}
/* 各段：左边状态条 */
.step{border-radius:3px;background:#0d2240;border:1px solid #ffffff1c;border-inline-start:5px solid #33476a;box-shadow:none}
.step.doing{border-inline-start-color:var(--gold);box-shadow:none}
.step.await{border-inline-start-color:var(--gold-bright);box-shadow:none;border-color:#ffc93c66}
.step:has(.state.done){border-inline-start-color:#3fbf7f}
.step-head h3{font-family:var(--font-display);font-weight:800;font-size:22px;letter-spacing:.04em;text-transform:uppercase}
.step-head .state{font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase}
.step-head .state.doing{background:var(--gold);color:#fff;padding:2px 10px}
.scriptbox,.locked-note{border-radius:3px;background:#071630}
.out,.clip,.final-video{border-radius:3px}
.gate-hint{font-family:var(--font-display);letter-spacing:.04em}
@media (max-width:1100px){
  .run-layout{grid-template-columns:minmax(0,1fr)}
  .rs-desk{position:static;order:-1}
}
@media (max-width:640px){.run-top,.run-layout{padding-inline:16px}}

