/* Mac dashboard visual system. Phone pages do not load this stylesheet. */
.dashboard {
  --dash-panel:#111b28;
  --dash-border:#2b3b50;
  --dash-muted:#9aadc4;
  --dash-accent:#a6c9fc;
  background:radial-gradient(ellipse at 85% 0%,#1a293e 0,transparent 48%),#0a1018;
}
.dashboard .topbar {
  min-height:80px; height:80px;
  padding:0 max(28px,calc((100vw - 1304px)/2));
  background:#0a111bd9; border-bottom-color:#263449;
}
.dashboard .brand { gap:18px; }
.dashboard .brand-logo { width:126px; height:46px; }
.dashboard .brand strong { font-size:14px; letter-spacing:.05em; }
.dashboard .brand small { color:#94a8c1; font-size:11px; margin-top:5px; }
.dashboard .connection { padding:9px 13px; border:1px solid #2e3b4e; border-radius:24px; background:#111c29; font-size:11px; max-width:360px; }
.dashboard .connection span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dashboard .connection i { flex:0 0 7px; width:7px; height:7px; box-shadow:0 0 10px currentColor; }
.dashboard .dashboard-main { max-width:1360px; padding:18px 28px 56px; }
.dashboard .dashboard-intro { margin-bottom:16px; }
/* Keep the eyebrow near the title, even beside taller Tally controls. */
.dashboard .dashboard-intro-top { min-height:32px; margin-bottom:2px; align-items:flex-end; }
.dashboard .dashboard-intro-top .eyebrow { line-height:1.2; margin:0; }
.dashboard .eyebrow { color:#92a6bf; font-size:10px; letter-spacing:.15em; }
.dashboard .header-actions { flex-wrap:nowrap; }
.dashboard .header-actions button { min-height:32px; padding:6px 12px; font-size:12px; }
.dashboard .dashboard-title-row { gap:24px; margin-bottom:2px; }
.dashboard .dashboard-title-row h1 { font-size:30px; line-height:1.3; letter-spacing:-.025em; }
.dashboard #dashboardDescription { font-size:13px; line-height:1.65; color:var(--dash-muted); }
.dashboard .dashboard-nav { padding:4px; gap:4px; background:#0d1724; border-color:#30435b; border-radius:13px; box-shadow:0 6px 18px #02070d20; }
.dashboard .dashboard-nav-link { padding:9px 14px; gap:10px; font-size:12px; min-height:40px; }
.dashboard .dashboard-nav-link[aria-current="page"] { background:#253b57; border-color:#4d6c90; box-shadow:inset 0 1px #ffffff09; }
.dashboard .dashboard-nav-link small { font-size:9px; padding:3px 6px; }
.dashboard .primary,.dashboard .secondary { min-height:42px; border-radius:10px; font-size:12px; font-weight:650; transition:background .15s,border-color .15s; }
.dashboard .primary { background:#eb3046; border-color:#f04155; box-shadow:0 4px 12px #ba192b1a; }
.dashboard .primary:hover { background:#fa4056; }
.dashboard .secondary { background:#152234; border-color:#35495f; }
.dashboard .secondary:hover { background:#20344c; border-color:#577392; }
.dashboard button:disabled,.dashboard input:disabled,.dashboard select:disabled { opacity:.64; }
.dashboard button:focus-visible,.dashboard a:focus-visible,.dashboard select:focus-visible,.dashboard input:focus-visible { outline:2px solid #a6c9fc; outline-offset:3px; }
.dashboard .compact { min-height:34px; padding:7px 11px; font-size:11px; }
.dashboard input:not([type="range"]):not([type="checkbox"]),.dashboard select {
  min-height:42px; border:1px solid #364c64; border-radius:9px; background:#0b1521; color:#e5edf8; font-size:12px;
}
.dashboard select { padding-right:28px; }
.dashboard .video-panel,.dashboard .intercom-panel { background:linear-gradient(145deg,#142132,#101925); border:1px solid var(--dash-border); border-radius:18px; box-shadow:0 10px 32px #00000012; }
.dashboard .video-panel { padding:22px; }
.dashboard .video-heading { margin-bottom:20px; }
.dashboard .video-heading h2,.dashboard .intercom-panel h2 { font-size:22px; line-height:1.4; }
.dashboard .video-heading .eyebrow { margin-bottom:6px; }
.dashboard .video-badge { color:#b7cce5; background:#0e1a29; border-color:#39526e; padding:7px 11px; }
.dashboard .video-layout { grid-template-columns:minmax(0,1.5fr) minmax(340px,1fr); gap:22px; align-items:start; }
.dashboard .video-preview-column { gap:14px; }
.dashboard .video-monitor { border-radius:12px; border-color:#3b5068; box-shadow:0 5px 16px #00000026; }
.dashboard .video-monitor span { font-size:10px; background:#0a111bdd; padding:6px 9px; backdrop-filter:blur(8px); }
.dashboard .video-form { min-width:0; display:grid; gap:14px; }
.dashboard .video-control-group { min-width:0; padding:16px; background:#0f1a28; border:1px solid #2e4158; border-radius:12px; }
.dashboard .video-control-group h3 { display:flex; align-items:center; gap:9px; margin:0 0 14px; color:#e5effd; font-size:13px; font-weight:650; }
.dashboard .control-step { display:grid; place-items:center; flex:0 0 24px; height:24px; background:#1e334e; border:1px solid #365374; border-radius:7px; font:10px ui-monospace,monospace; color:#a6c9fc; }
.dashboard .video-control-group label { font-size:11px; margin-bottom:7px; color:#a7b9cf; }
.dashboard .video-control-group h3+label { margin-top:0; }
.dashboard .video-options { grid-template-columns:1.2fr .7fr 1fr; gap:8px; }
.dashboard .video-options select { padding-left:9px; font-size:11px; }
.dashboard .video-detail { color:#95acc8; font-size:11px; line-height:1.8; }
.dashboard .video-actions { margin:0; display:grid; grid-template-columns:minmax(0,1fr) 104px; gap:10px; }
.dashboard .video-actions button { min-height:44px; }
.dashboard #videoError:empty { display:none; }
.dashboard .video-insights { background:#0f1b2a; padding:16px; border-color:#2e435b; }
.dashboard .video-insights-heading { margin-bottom:12px; }
.dashboard .video-insights-heading h3 { font-size:13px; }
.dashboard .video-insights-metric { background:#0b1521; border-color:#2a3e55; }
.dashboard .video-insights-metric strong { font-size:14px; }
.dashboard .video-insights-empty { font-size:11px; color:#a1b5ce; }
.dashboard .video-insights .video-insights-note { color:#92a9c5; }
.dashboard .ndi-output { padding:16px; margin-top:20px; border:1px solid #2e4158; border-radius:12px; background:#0f1a28; }
.dashboard .ndi-output summary { color:#dceafb; font-size:13px; line-height:1.6; }
.dashboard .ndi-options { grid-template-columns:1.6fr .8fr .8fr .7fr auto; gap:10px; margin-top:16px; }
.dashboard .video-footnote { font-size:10px; color:#8a9fba; margin-top:18px; padding-top:14px; }
/* Camera cards use space evenly for either the five L4 or eight ATEM inputs. */
.dashboard .input-grid { gap:14px; }
.dashboard .input-card { padding:19px 17px 15px; border-radius:15px; border-color:#314158; background:linear-gradient(155deg,#172437,#111b29); box-shadow:0 5px 18px #00000012; }
.dashboard .input-card:hover { transform:translateY(-2px); border-color:#6680a1; }
.dashboard .input-card::before { content:''; position:absolute; left:0; right:0; top:0; height:3px; background:#3d536e; }
.dashboard .input-card[data-tally="program"] { border-color:#874454; background:linear-gradient(155deg,#2e2130,#17202e); }
.dashboard .input-card[data-tally="program"]::before { background:#ff4e66; }
.dashboard .input-card[data-tally="preview"] { border-color:#397866; background:linear-gradient(155deg,#16372f,#14202e); }
.dashboard .input-card[data-tally="preview"]::before { background:#5ae0ac; }
.dashboard .card-top { margin-bottom:21px; gap:6px; }
.dashboard .input-number { font-size:10px; color:#a4b6cd; letter-spacing:.06em; }
.dashboard .tally-pill { font-size:9px; padding:5px 7px; letter-spacing:.03em; white-space:nowrap; }
.dashboard .tally-pill.program { color:#ff98a6; border-color:#a25063; background:#552535; }
.dashboard .tally-pill.preview { color:#9aefd0; border-color:#3a846c; background:#174c3b; }
.dashboard .input-card h2 { font-size:21px; margin-bottom:4px; letter-spacing:-.015em; }
.dashboard .input-origin { margin:0 0 14px; color:#94abc5; font-size:11px; }
.dashboard .input-url { font-size:10px; color:#90a6c1; margin-bottom:16px; }
.dashboard .input-link-row { display:flex; align-items:center; gap:6px; min-width:0; margin-bottom:14px; padding:5px 6px 5px 9px; border:1px solid #31465e; border-radius:9px; background:#0b1726; }
.dashboard .input-link-row .input-url { flex:1; min-width:0; margin:0; }
.dashboard .copy-tally-link { display:inline-flex; align-items:center; justify-content:center; gap:4px; flex:none; width:70px; min-height:32px; padding:5px; border:1px solid #3c5776; border-radius:6px; background:#203750; color:#d9eaff; font:600 10px system-ui,sans-serif; cursor:pointer; }
.dashboard .copy-tally-link:hover { background:#2b496b; border-color:#759bc4; }
.dashboard .copy-tally-link:focus-visible { outline:2px solid #a4cfff; outline-offset:2px; }
.dashboard .copy-tally-link.is-copied { background:#17483d; border-color:#367f6b; color:#9bf0ce; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
#manualCopyUrl { display:block; width:100%; }
.dashboard .card-actions { gap:7px; padding-top:12px; border-color:#33475b; }
.dashboard .card-actions .open-link { font-size:11px; min-height:34px; display:flex; align-items:center; color:#d4e6fc; }
.dashboard .rename-camera { min-height:34px; font-size:10px; padding:7px 8px; background:#1a2b40; }
.dashboard .help-card { background:#101e2f; border-color:#2c435c; margin-top:22px; padding:18px; border-radius:13px; }
.dashboard .help-icon { background:#233d5c; color:#b2d4ff; }
.dashboard .help-card strong { font-size:13px; }
.dashboard .help-card p { font-size:12px; color:#9fb4cf; }
.dashboard .demo-controls { border-color:#776039; background:#272116; border-radius:13px; padding:18px; }
/* Intercom shares the same card and control rhythm. */
.dashboard .intercom-notice { border-color:#3d5065; background:#122031; padding:16px 18px; border-radius:13px; margin-bottom:18px; }
.dashboard .intercom-notice strong { font-size:13px; }
.dashboard .intercom-notice p { font-size:11px; color:#a6bad2; }
.dashboard .intercom-panel { padding:20px; }
.dashboard .intercom-layout { grid-template-columns:minmax(305px,.8fr) minmax(0,1.65fr); gap:18px; align-items:start; }
.dashboard .intercom-panel-heading { margin-bottom:17px; }
.dashboard .intercom-director-state { padding:10px 12px; border:1px solid #30465e; border-radius:9px; background:#0f1a28; margin-bottom:18px; }
.dashboard .intercom-device-fields label,.dashboard .intercom-mode-label { font-size:12px; color:#b1c4dc; }
.dashboard .intercom-device-note { color:#9aafc9; font-size:11px; }
.dashboard .intercom-team-count { padding:7px 10px; border:1px solid #344e67; border-radius:20px; background:#0e1a28; font-size:10px; }
.dashboard .intercom-member-grid { gap:12px; }
.dashboard .intercom-member { padding:15px; background:#111f2e; border-color:#30475e; border-radius:12px; }
.dashboard .intercom-member.selected { background:#112a29; border-color:#35695f; }
.dashboard .intercom-member.audio-connected { border-color:#53b89b; }
.dashboard .intercom-member-number { color:#93b0c7; font-size:10px; }
.dashboard .intercom-member-name { font-size:15px; }
.dashboard .intercom-member-label input { width:18px; height:18px; flex-basis:18px; }
.dashboard .intercom-member-audio { grid-template-columns:minmax(0,1fr) 66px; gap:9px; margin-top:13px; }
.dashboard .intercom-receive-monitor { padding:7px 9px 4px; }
.dashboard .intercom-receive-heading,.dashboard .intercom-receive-heading output { font-size:9px; }
.dashboard .intercom-waveform { height:32px; }
.dashboard .intercom-receive-mute { min-height:56px; font-size:10px; }
.dashboard .intercom-member-presence,.dashboard .intercom-member-footer a { font-size:10px; }
.dashboard .intercom-receive-help { color:#9cb5cd; font-size:11px; }
.dashboard .intercom-talk-console { grid-template-columns:1fr; gap:14px; }
.dashboard .intercom-ptt { min-height:52px; font-size:13px; }
.dashboard .intercom-setup { border-radius:13px; background:#101d2d; }
.dashboard .intercom-setup summary { line-height:1.7; }
.dashboard dialog { background:#122033; border-color:#405874; border-radius:17px; }
.dashboard dialog .muted { font-size:13px; }
@media (min-width:1100px) { .dashboard .input-grid[data-input-count="5"] { grid-template-columns:repeat(5,minmax(0,1fr)); } }
@media (min-width:1200px) { .dashboard .intercom-member-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:1099px) and (min-width:851px) { .dashboard .input-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:1050px) {
  .dashboard .dashboard-title-row { grid-template-columns:1fr; gap:12px; }
  .dashboard .dashboard-title-row .dashboard-nav { justify-self:start; }
  .dashboard .video-layout { grid-template-columns:minmax(0,1.25fr) minmax(310px,1fr); gap:16px; }
  .dashboard .intercom-layout { grid-template-columns:minmax(280px,.85fr) minmax(0,1.3fr); }
  .dashboard .intercom-member-footer { flex-wrap:wrap; gap:7px; }
}
@media (max-width:850px) {
  .dashboard .dashboard-main { padding:18px 20px 40px; }
  .dashboard .topbar { padding-left:20px; padding-right:20px; }
  .dashboard .video-layout { grid-template-columns:1fr; }
  .dashboard .ndi-options { grid-template-columns:1fr 1fr; }
  .dashboard .ndi-options label:first-child,.dashboard .ndi-options button { grid-column:1/-1; }
  .dashboard .intercom-layout { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .dashboard .topbar { height:auto; min-height:80px; gap:10px; padding-top:12px; padding-bottom:12px; }
  .dashboard .brand { gap:10px; }
  .dashboard .brand-logo { width:92px; height:34px; }
  .dashboard .brand strong { font-size:11px; }
  .dashboard .connection { padding:7px 9px; max-width:100%; }
  .dashboard .dashboard-title-row h1 { font-size:28px; }
  .dashboard .dashboard-nav { width:100%; }
  .dashboard .dashboard-nav-link { min-height:44px; padding:10px 8px; font-size:11px; }
  .dashboard .header-actions { flex-wrap:wrap; }
  .dashboard .video-panel,.dashboard .intercom-panel { padding:16px; }
  .dashboard .video-control-group { padding:14px; }
}
@media (max-width:440px) {
  .dashboard .input-grid,.dashboard .intercom-member-grid { grid-template-columns:1fr; }
  .dashboard .video-options { grid-template-columns:1fr 1fr; }
  .dashboard .video-options label:last-child { grid-column:1/-1; }
  .dashboard .intercom-director-actions { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { .dashboard button,.dashboard a,.dashboard .input-card { transition:none; } .dashboard .input-card:hover { transform:none; } }

/* English interface: clearer text hierarchy and consistent section labels. */
.dashboard { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif; }
.dashboard .dashboard-title-row h1 { font-size:30px; font-weight:720; letter-spacing:-.035em; }
.dashboard .dashboard-nav-link { gap:9px; }
.dashboard .dashboard-nav-link svg { flex:0 0 16px; color:#8eafd7; }
.dashboard .dashboard-nav-link[aria-current="page"] svg { color:#d6e8ff; }
.dashboard .video-control-group h3 { font-size:14px; letter-spacing:-.01em; }
.dashboard .video-control-group label { font-size:12px; }
.dashboard .video-detail { font-size:12px; line-height:1.65; }
.dashboard .video-insights-metric span { font-size:11px; }
.dashboard .video-insights-empty { font-size:12px; }
.dashboard .video-insights .video-insights-note { font-size:11px; }
.dashboard .input-origin { font-size:12px; }
.dashboard .intercom-receive-help { font-size:11px; line-height:1.65; }
.dashboard .intercom-ptt { font-size:12px; }
.dashboard .intercom-director-actions button { padding:10px 9px; font-size:11px; }
.dashboard .intercom-setup summary { font-size:13px; }
@media (max-width:600px) { .dashboard .dashboard-title-row h1 { font-size:27px; } .dashboard .dashboard-nav-link svg { display:none; } }