:root{
  --bg:#15181c; --panel:#1d2126; --panel2:#232830; --panel3:#2a3038; --line:#2c333b; --line2:#3a424c;
  --ink:#e6e9ec; --muted:#8b949e; --faint:#5c6672;
  --accent:#4f8cff; --accent2:#2f6fe0; --red:#e5322d; --amber:#f5a524; --green:#2fbf71; --purple:#8e6cf0; --cyan:#00b4d8;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --sans:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --radius:6px; --top:46px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font:13px/1.4 var(--sans);-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
input,select,textarea{background:#12151a;border:1px solid var(--line);border-radius:var(--radius);padding:6px 8px;color:var(--ink);min-width:0}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:var(--accent)}
input[type=checkbox]{width:auto;accent-color:var(--accent)}
select{padding-right:22px}
textarea{resize:vertical}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#3a424c;border-radius:6px}::-webkit-scrollbar-track{background:transparent}
.boot{padding:40px;text-align:center;color:var(--muted)}
.hidden{display:none!important}
.muted{color:var(--muted)}.faint{color:var(--faint)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.right{text-align:right}
.nowrap{white-space:nowrap}
.flex{display:flex;align-items:center;gap:8px}
.grow{flex:1 1 auto;min-width:0}
.wrap{flex-wrap:wrap}
.sp{flex:1}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--panel3);border:1px solid var(--line2);border-radius:var(--radius);padding:6px 11px;font-weight:600;color:var(--ink);white-space:nowrap;line-height:1.2}
.btn:hover{background:#333b45;border-color:#4a5462}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.primary:hover{background:var(--accent2)}
.btn.danger{background:#4a1d1d;border-color:#7a2b2b;color:#ffb3b3}.btn.danger:hover{background:#5e2222}
.btn.ok{background:#1d4a30;border-color:#2b7a4a;color:#b3ffcf}
.btn.sm{padding:3px 8px;font-size:12px}
.btn.xs{padding:1px 6px;font-size:11px;font-weight:500}
.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}.btn.ghost:hover{background:var(--panel3);color:var(--ink)}
.btn.icon{padding:5px 7px}
.btn .badge{background:var(--red);color:#fff;border-radius:10px;padding:0 6px;font-size:11px;min-width:18px;text-align:center}

/* top bar */
.topbar{position:fixed;top:0;left:0;right:0;height:var(--top);background:#101317;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;padding:0 12px;z-index:50}
.topbar .brand{font-weight:800;letter-spacing:.04em;text-transform:uppercase;font-size:13px;color:#fff;display:flex;align-items:center;gap:8px}
.topbar .brand i{display:inline-block;width:10px;height:10px;background:var(--red);border-radius:50%;box-shadow:0 0 8px var(--red)}
.topbar nav{display:flex;gap:2px;margin-left:8px}
.topbar nav a{color:var(--muted);padding:6px 10px;border-radius:var(--radius);font-weight:600}
.topbar nav a.active,.topbar nav a:hover{color:#fff;background:var(--panel2)}
.topbar .clock{font-family:var(--mono);font-size:18px;font-weight:700;color:#fff;letter-spacing:.04em;font-variant-numeric:tabular-nums}
.topbar .user{color:var(--muted);font-weight:600}
.topbar .user b{color:var(--ink)}
main{position:absolute;top:var(--top);left:0;right:0;bottom:0;overflow:auto;padding:14px 16px;transition:right .28s cubic-bezier(.2,.8,.2,1)}
main.with-dock{right:340px}
main.grid-view{padding:0}

/* login */
.login{max-width:380px;margin:12vh auto;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:28px}
.login h1{margin:0 0 4px;font-size:20px}.login p{color:var(--muted);margin:0 0 18px}
.login label{display:block;margin:12px 0 4px;color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.login input{width:100%}
.login .btn{width:100%;justify-content:center;margin-top:18px;padding:10px}
.login .err{background:#3b1d1d;border:1px solid var(--red);border-radius:var(--radius);padding:8px 10px;margin-top:12px;color:#ffb3b3}

/* toasts */
#toasts{position:fixed;right:16px;bottom:16px;z-index:200;display:flex;flex-direction:column;gap:8px;max-width:360px}
.toast{background:#262c34;border:1px solid var(--line2);border-left:4px solid var(--accent);border-radius:var(--radius);padding:10px 12px;box-shadow:0 8px 24px rgba(0,0,0,.4);animation:toastin .2s ease-out;cursor:pointer}
.toast.error{border-left-color:var(--red)}.toast.ok{border-left-color:var(--green)}.toast.msg{border-left-color:var(--purple)}
.toast b{display:block;margin-bottom:2px}
@keyframes toastin{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}

/* page header */
.page-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.page-h h1{font-size:18px;margin:0;font-weight:700}
.page-h .sub{color:var(--muted)}

/* tables */
table.list{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
table.list th{background:#181c21;color:var(--muted);text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
table.list td{padding:7px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
table.list tr:last-child td{border-bottom:0}
table.list tr.click{cursor:pointer}table.list tr.click:hover td{background:var(--panel2)}
table.list td.num,table.list th.num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.tag{display:inline-block;padding:1px 7px;border-radius:4px;font-size:11px;font-weight:700;letter-spacing:.03em;background:var(--panel3);color:var(--ink);white-space:nowrap}
.tag.type{color:#fff;text-transform:uppercase}
.st{display:inline-block;padding:1px 7px;border-radius:4px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.st-draft{background:#3a3f47;color:#c9d1d9}.st-ready{background:#1d4a30;color:#7ee2a4}.st-approved{background:#1f3d6b;color:#9cc4ff}.st-aired{background:#2a2f36;color:#8b949e;text-decoration:line-through}.st-hold{background:#5a3a10;color:#ffd27f}
.ou{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums}
.ou.over{color:#ff6b6b}.ou.under{color:var(--green)}.ou.zero{color:var(--muted)}

/* rundown grid view */
.rd-head{position:sticky;top:0;z-index:20;background:var(--bg);border-bottom:1px solid var(--line);padding:8px 14px 6px}
.rd-title{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rd-title h1{font-size:17px;margin:0;font-weight:800}
.rd-title .meta{color:var(--muted)}
.rd-title .status{margin-left:auto}
.strip{display:flex;gap:2px;margin-top:8px;flex-wrap:wrap;align-items:stretch}
.strip .cell{background:var(--panel);border:1px solid var(--line);padding:5px 12px 4px;min-width:96px;display:flex;flex-direction:column;justify-content:center}
.strip .cell:first-child{border-radius:6px 0 0 6px}.strip .cell:last-of-type{border-radius:0 6px 6px 0}
.strip .cell small{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700}
.strip .cell b{font-family:var(--mono);font-size:19px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.15;color:#fff}
.strip .cell.ou b.over{color:#ff6b6b}.strip .cell.ou b.under{color:var(--green)}
.strip .cell.live{background:#3b1414;border-color:#7a2b2b}.strip .cell.live b{color:#ff8a80}
.strip .cell.edit b{cursor:text}.strip .cell.edit b:hover{text-decoration:underline dotted}
.strip .actions{display:flex;gap:6px;align-items:center;margin-left:auto;flex-wrap:wrap}
.presence{display:flex;gap:4px}
.avatar{width:24px;height:24px;border-radius:50%;background:var(--panel3);border:1px solid var(--line2);display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:#fff;letter-spacing:.02em}
.avatar.editing{border-color:var(--amber);color:var(--amber)}

.rd-grid{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;font-size:12.5px}
.rd-grid th{position:sticky;top:0;z-index:5;background:#181c21;color:var(--muted);text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;padding:6px 8px;border-bottom:1px solid var(--line);border-right:1px solid #1e2329;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;user-select:none}
.rd-grid th.num{text-align:right}
.rd-grid td{padding:4px 8px;border-bottom:1px solid #22272e;border-right:1px solid #1e2329;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;height:30px}
.rd-grid td.num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.rd-grid td.page{font-family:var(--mono);font-weight:700;color:var(--muted)}
.rd-grid td.slug{font-weight:700;color:#fff}
.rd-grid td.edit{cursor:text}
.rd-grid td.edit:hover{box-shadow:inset 0 0 0 1px var(--line2)}
.rd-grid td.editing{padding:0}
.rd-grid td.editing input,.rd-grid td.editing select{width:100%;height:30px;border-radius:0;border:2px solid var(--accent);background:#0e1116}
.rd-grid td.manual{color:#fff;font-weight:700}
.rd-grid td.manual:after{content:"•";color:var(--amber);margin-left:4px}
.rd-grid tr.story{cursor:default;background:var(--panel)}
.rd-grid tr.story:nth-child(even){background:#1a1e23}
.rd-grid tr.story:hover td{background:#252b33}
.rd-grid tr.story.selected td{background:#1e2c45;box-shadow:inset 0 -1px 0 var(--accent),inset 0 1px 0 var(--accent)}
.rd-grid tr.story.selected td:first-child{box-shadow:inset 3px 0 0 var(--accent),inset 0 -1px 0 var(--accent),inset 0 1px 0 var(--accent)}
.rd-grid tr.story.float td{color:var(--muted);font-style:italic}
.rd-grid tr.story.float td.slug:before{content:"FLOAT ";color:var(--amber);font-style:normal;font-size:10px;font-weight:800}
.rd-grid tr.story.killed td{text-decoration:line-through;color:var(--faint)}
.rd-grid tr.story.aired td{color:var(--faint)}
.rd-grid tr.story.break td{background:#22262c;color:var(--muted);font-style:italic}
.rd-grid tr.story.onair td{background:#3b1414!important;color:#fff}
.rd-grid tr.story.onair td:first-child{box-shadow:inset 4px 0 0 var(--red)}
.rd-grid tr.story.onair td.slug:before{content:"● ON AIR ";color:#ff6b6b;font-style:normal;font-size:10px;font-weight:800;animation:blink 1.2s steps(1) infinite}
@keyframes blink{50%{opacity:.35}}
.rd-grid tr.story.next td{background:#1b3a2a}
.rd-grid tr.story.dragging td{opacity:.35}
.rd-grid tr.drop-before td{box-shadow:inset 0 2px 0 var(--accent)}
.rd-grid tr.drop-after td{box-shadow:inset 0 -2px 0 var(--accent)}
.rd-grid tr.block td{background:#252a31;border-bottom:1px solid var(--line2);font-weight:800;color:#fff;height:32px;letter-spacing:.02em}
.rd-grid tr.block td .letter{display:inline-block;background:var(--accent);color:#fff;border-radius:4px;padding:1px 8px;margin-right:10px;font-family:var(--mono);font-size:12px}
.rd-grid tr.block td .bstats{font-weight:600;color:var(--muted);margin-left:12px;font-family:var(--mono);font-size:11.5px}
.rd-grid tr.block td .bstats .ho{color:var(--amber)}
.rd-grid tr.block td .btools{float:right;display:flex;gap:4px}
.rd-grid tr.totals td{background:#181c21;font-weight:700;color:var(--muted);border-top:2px solid var(--line2);font-family:var(--mono);font-size:12px;white-space:normal;overflow:visible;height:36px}
.rd-grid .lock{color:var(--amber);font-weight:800;font-size:11px}
.rd-grid .row-tools{display:none;gap:2px}
.rd-grid tr.story:hover .row-tools,.rd-grid tr.story.selected .row-tools{display:inline-flex}
.rd-grid td.tools{overflow:visible;text-align:right}
.gfxchip{display:inline-block;background:#3a2a5c;color:#d7c4ff;border-radius:3px;padding:0 5px;font-size:10.5px;margin-right:3px;font-weight:600}
.cuechip{display:inline-block;background:var(--panel3);color:#c9d1d9;border-radius:3px;padding:0 5px;font-size:10.5px;margin-right:3px;font-weight:600}
.empty{padding:40px;text-align:center;color:var(--muted)}
.empty .btn{margin-top:10px}

/* modal */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:100;display:flex;align-items:center;justify-content:center;padding:16px}
.modal{background:var(--panel);border:1px solid var(--line2);border-radius:10px;width:560px;max-width:100%;max-height:92vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.modal.wide{width:900px}.modal.narrow{width:420px}
.modal h2{margin:0;padding:14px 18px;border-bottom:1px solid var(--line);font-size:15px}
.modal .body{padding:14px 18px;overflow:auto}
.modal .foot{padding:12px 18px;border-top:1px solid var(--line);display:flex;gap:8px;justify-content:flex-end}
.form{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
.form .full{grid-column:1/-1}
.form label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;margin-bottom:3px}
.form input,.form select,.form textarea{width:100%}
.form .check{display:flex;align-items:center;gap:8px;text-transform:none;letter-spacing:0;font-size:13px;color:var(--ink);font-weight:500;margin-top:18px}
.help{color:var(--muted);font-size:12px;margin-top:4px}

/* editor overlay */
#editor{position:fixed;inset:var(--top) 0 0 0;background:var(--bg);z-index:60;display:flex;flex-direction:column}
#editor .ed-head{display:flex;align-items:center;gap:8px;padding:8px 14px;border-bottom:1px solid var(--line);background:#101317;flex-wrap:wrap}
#editor .ed-head .page{font-family:var(--mono);font-weight:800;font-size:16px;color:var(--accent)}
#editor .ed-head input.slug{font-weight:800;font-size:15px;width:320px;text-transform:uppercase}
#editor .ed-head .lockinfo{color:var(--amber);font-weight:700}
#editor .ed-head .saved{color:var(--muted);font-size:12px}
#editor .ed-head .saved.dirty{color:var(--amber)}
#editor .ed-props{display:flex;gap:8px;padding:6px 14px;border-bottom:1px solid var(--line);background:var(--panel);flex-wrap:wrap;align-items:flex-end}
#editor .ed-props label{display:flex;flex-direction:column;font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;gap:2px}
#editor .ed-props input,#editor .ed-props select{padding:4px 6px}
#editor .ed-props .est{font-family:var(--mono);font-size:16px;color:#fff;font-weight:700}
#editor .ed-body{flex:1;display:flex;min-height:0}
#editor .ed-side{width:260px;border-right:1px solid var(--line);background:var(--panel);overflow:auto;padding:10px;display:flex;flex-direction:column;gap:12px}
#editor .ed-side h4{margin:0 0 6px;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
#editor .ed-side .chips{display:flex;flex-wrap:wrap;gap:4px}
#editor .ed-side .chip{border:1px solid var(--line2);background:var(--panel3);border-radius:4px;padding:3px 7px;font-size:11px;font-weight:700;cursor:pointer;color:#fff}
#editor .ed-side .chip:hover{filter:brightness(1.2)}
#editor .ed-side .att{display:flex;gap:6px;align-items:center;margin-bottom:6px;border:1px solid var(--line);border-radius:4px;padding:4px}
#editor .ed-side .att img{width:44px;height:32px;object-fit:cover;border-radius:3px;background:#000}
#editor .ed-side .att .n{font-size:11px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#editor .ed-main{flex:1;overflow:auto;padding:12px 16px 80px}
#editor.readonly .ed-main{opacity:.85}
.para{display:grid;grid-template-columns:230px 1fr;border:1px solid var(--line);border-radius:6px;margin-bottom:8px;background:var(--panel)}
.para.active{border-color:var(--accent)}
.para .ph{grid-column:1/-1;display:flex;align-items:center;gap:6px;padding:4px 8px;background:#181c21;border-bottom:1px solid var(--line);border-radius:6px 6px 0 0;font-size:11px}
.para .ph select,.para .ph input{padding:2px 5px;font-size:11px}
.para .ph .ptype{font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.para .ph .tools{margin-left:auto;display:flex;gap:2px}
.para .pc{padding:8px;border-right:1px solid var(--line);font-family:var(--mono);font-size:11.5px;text-transform:uppercase;display:flex;flex-direction:column;gap:4px;background:#1a1e24}
.para .cue{display:flex;align-items:flex-start;gap:5px;border-left:3px solid var(--accent);background:var(--panel2);padding:3px 6px;border-radius:0 4px 4px 0;cursor:pointer;line-height:1.3}
.para .cue.k-gfx{border-left-color:var(--purple)}.para .cue.k-video{border-left-color:var(--green)}.para .cue.k-audio{border-left-color:var(--amber)}.para .cue.k-mos{border-left-color:var(--cyan)}.para .cue.k-image{border-left-color:#ff8fab}.para .cue.k-note{border-left-color:var(--muted)}
.para .cue b{font-size:10px;color:var(--muted)}
.para .cue .x{margin-left:auto;color:var(--faint);cursor:pointer;font-weight:800}.para .cue .x:hover{color:var(--red)}
.para .cue img{max-width:100%;max-height:60px;display:block;border-radius:3px}
.para .cue .fields{font-family:var(--sans);text-transform:none;color:#c9d1d9;font-size:11px}
.para .cue .auto{color:var(--cyan);font-size:10px}
.para .addcue{background:none;border:1px dashed var(--line2);color:var(--muted);border-radius:4px;padding:3px;font-size:11px;font-family:var(--sans);text-transform:none}
.para .addcue:hover{border-color:var(--accent);color:var(--ink)}
.para .pt{padding:8px}
.para .pt textarea{width:100%;border:0;background:transparent;padding:4px;font-size:16px;line-height:1.45;min-height:56px;resize:none;overflow:hidden;font-family:var(--sans);color:#fff}
.para .pt textarea:focus{outline:none;background:#0e1116;border-radius:4px}
.para.t-sot .pt textarea,.para.t-pkg .pt textarea{font-style:italic;color:#ffd7a0;font-size:14px}
.para.t-note .pt textarea{color:var(--muted);font-size:13px}
.para .pt .pinfo{font-size:11px;color:var(--faint);font-family:var(--mono);text-align:right}
.ed-addbar{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}
.ed-estimate{position:sticky;bottom:0;background:#101317;border-top:1px solid var(--line);padding:8px 14px;display:flex;gap:18px;font-family:var(--mono);font-size:12px;color:var(--muted)}
.ed-estimate b{color:#fff}
.cue-pop{position:absolute;z-index:120;background:var(--panel);border:1px solid var(--line2);border-radius:8px;padding:10px;width:300px;box-shadow:0 12px 40px rgba(0,0,0,.5)}
.cue-pop label{display:block;font-size:10px;text-transform:uppercase;color:var(--muted);font-weight:700;margin:6px 0 2px}
.cue-pop input,.cue-pop select,.cue-pop textarea{width:100%;font-size:12px}
.cue-pop .row{display:flex;gap:6px;margin-top:8px;justify-content:flex-end}
.tpl-form{display:grid;gap:4px}
.tpl-form input,.tpl-form textarea,.tpl-form select{font-size:11px;padding:3px 5px;text-transform:none;font-family:var(--sans)}

/* producer mode */
.prod{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:1300px}
.prod .card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px 14px}
.prod .card h3{margin:0 0 6px;font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.prod .big{font-family:var(--mono);font-size:52px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;color:#fff}
.prod .huge{font-family:var(--mono);font-size:72px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.prod .card.air{border-color:#7a2b2b;background:#2a1212}
.prod .card.air .slug{font-size:26px;font-weight:800;color:#fff;margin:4px 0}
.prod .card.next{border-color:#2b7a4a;background:#122a1c}
.prod .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}
.prod .stat small{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700}
.prod .stat b{font-family:var(--mono);font-size:22px;font-variant-numeric:tabular-nums;color:#fff}
.prod .controls{display:flex;gap:8px;flex-wrap:wrap;grid-column:1/-1}
.prod .controls .btn{font-size:16px;padding:14px 22px}
.prod .controls .btn.next{background:var(--green);border-color:var(--green);color:#04170c;font-size:22px;padding:18px 40px;flex:1;justify-content:center}
.prod .list{grid-column:1/-1}
.prod .list table{width:100%}
.prod .cuebtns{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}

/* messages dock */
#dock{position:fixed;top:var(--top);right:0;bottom:0;width:340px;background:var(--panel);border-left:1px solid var(--line);display:flex;flex-direction:column;z-index:40;transform:translateX(105%);visibility:hidden;transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s linear .28s;box-shadow:-8px 0 24px rgba(0,0,0,.35)}
#dock.open{transform:none;visibility:visible;transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s}
#dock .scopes{display:flex;gap:4px;padding:8px;border-bottom:1px solid var(--line);flex-wrap:wrap;max-height:130px;overflow:auto}
#dock .scopes .btn{position:relative}
#dock .scopes .btn.active{background:var(--accent);border-color:var(--accent);color:#fff}
#dock .scopes .dot{width:7px;height:7px;border-radius:50%;background:var(--faint);display:inline-block}
#dock .scopes .dot.on{background:var(--green)}
#dock .msgs{flex:1;overflow:auto;padding:10px;display:flex;flex-direction:column;gap:8px}
#dock .m{max-width:88%;background:var(--panel3);border-radius:10px;padding:6px 10px;align-self:flex-start}
#dock .m.mine{align-self:flex-end;background:#1f3d6b}
#dock .m .who{font-size:10px;color:var(--muted);font-weight:700;margin-bottom:2px}
#dock .m .t{white-space:pre-wrap;word-wrap:break-word}
#dock .m .ts{font-size:10px;color:var(--faint);text-align:right}
#dock .send{display:flex;gap:6px;padding:8px;border-top:1px solid var(--line)}
#dock .send textarea{flex:1;height:38px;resize:none}
#dock .head{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--line);font-weight:700}

/* admin */
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:14px;flex-wrap:wrap}
.tabs a{padding:8px 12px;color:var(--muted);font-weight:700;border-bottom:2px solid transparent}
.tabs a.active{color:#fff;border-bottom-color:var(--accent)}
.permgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:4px 14px}
.permgrid label{display:flex;gap:8px;align-items:flex-start;font-size:12px;padding:3px 0}
.permgrid label span{color:var(--muted)}
.colrow{display:grid;grid-template-columns:26px 1fr 1fr 110px 70px 60px 60px 60px;gap:6px;align-items:center;padding:4px 0;border-bottom:1px solid var(--line)}
.colrow .h{font-size:10px;text-transform:uppercase;color:var(--muted);font-weight:700}
.colrow input,.colrow select{padding:3px 6px;font-size:12px}
.drag{cursor:grab;color:var(--faint)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.cardx{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px}
.cardx h3{margin:0 0 6px;font-size:14px}

/* rundown list */
.rdl{display:grid;gap:8px}
.rdl .day{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800;margin:10px 0 2px}
.rdl .rdi{display:grid;grid-template-columns:70px 1fr auto auto auto;gap:12px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 14px;cursor:pointer}
.rdl .rdi:hover{border-color:var(--accent)}
.rdl .rdi .t{font-family:var(--mono);font-weight:800;font-size:15px;color:#fff}
.rdl .rdi .n{font-weight:700}
.rdl .rdi .n small{display:block;color:var(--muted);font-weight:500}

/* mobile cards */
.mcards{padding:8px}
.mcard{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin-bottom:6px;display:grid;grid-template-columns:44px 1fr auto;gap:8px;align-items:center}
.mcard.block{background:#252a31;font-weight:800}
.mcard .pg{font-family:var(--mono);font-weight:800;color:var(--muted)}
.mcard .sl{font-weight:700;color:#fff}
.mcard .sub{color:var(--muted);font-size:11px}
.mcard .d{font-family:var(--mono);font-weight:700;text-align:right}
.mcard.onair{border-color:var(--red);background:#3b1414}
.mcard.float{opacity:.6}

.kbd{font-family:var(--mono);background:var(--panel3);border:1px solid var(--line2);border-radius:3px;padding:0 4px;font-size:11px}
.search-res .r{padding:8px 10px;border-bottom:1px solid var(--line);cursor:pointer}.search-res .r:hover{background:var(--panel2)}
.act{padding:5px 0;border-bottom:1px solid var(--line);font-size:12px}
.act .ts{font-family:var(--mono);color:var(--faint);margin-right:8px}
.versions .v{display:flex;gap:10px;padding:6px 0;border-bottom:1px solid var(--line);align-items:center}

@media (max-width:900px){
  main.with-dock{right:0}
  #dock{width:100%;transform:translateY(105%)}
  #dock.open{transform:none}
  #editor .ed-side{display:none}
  #editor.showside .ed-side{display:flex;position:absolute;inset:0;width:100%;z-index:5}
  .para{grid-template-columns:1fr}
  .para .pc{border-right:0;border-bottom:1px solid var(--line)}
  .prod{grid-template-columns:1fr}
  .form{grid-template-columns:1fr}
  .topbar nav a{padding:6px 7px}
  .topbar .clock{font-size:15px}
  .strip .cell{min-width:74px;padding:4px 8px}
  .strip .cell b{font-size:15px}
}
@media (max-width:600px){
  .topbar .user span.name{display:none}
  .topbar .brand span{display:none}
  main{padding:10px}
  .rdl .rdi{grid-template-columns:60px 1fr auto}
  .rdl .rdi .hide-m{display:none}
  #editor .ed-head input.slug{width:100%}
  .prod .huge{font-size:56px}.prod .big{font-size:40px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media print{.topbar,#dock,#toasts{display:none}}

/* ---- grid cursor, multi-select, batch bar, hit times */
.rd-grid td.cursor{box-shadow:inset 0 0 0 2px var(--accent)!important;background:#1e2c45}
.rd-grid tr.story.multi td{background:#1a2740;box-shadow:inset 0 -1px 0 #2b4a7a}
.rd-grid tr.story.multi td:first-child{box-shadow:inset 3px 0 0 #2b4a7a}
.rd-grid td.over{color:#ff6b6b}.rd-grid td.under{color:var(--green)}
.tag.hit{background:#5a3a10;color:#ffd27f;font-size:10px}
.batchbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;background:#1f3d6b;border:1px solid #2b5a9a;border-radius:6px;padding:6px 10px;margin-top:8px}
.batchbar b{color:#fff;margin-right:6px}
body.studio-mode .topbar{display:none}
body.studio-mode main{top:0}
body.studio-mode #dock{display:none}
/* ---- wires */
.wires{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}
.wire{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 12px;cursor:pointer}
.wire:hover{border-color:var(--accent)}
.wire .wh{display:flex;gap:8px;align-items:center;font-size:11px;margin-bottom:4px}
.wire .wt{font-weight:700;color:#fff;margin-bottom:4px}
.wire .wx{color:var(--muted);font-size:12px;max-height:54px;overflow:hidden}
/* ---- editor: MOS object results */
.mosres{max-height:220px;overflow:auto;margin-top:6px}
.mosobj{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:4px;padding:4px 6px;margin-bottom:4px;cursor:pointer;font-size:11px}
.mosobj:hover{border-color:var(--cyan)}
.mosobj b{color:#fff}
.para .cue.k-mos{border-left-color:var(--cyan)}

/* ---- v1.2: colours, changed markers, formatting toolbar, palette, light theme, density */
.rd-grid td.page.colored{box-shadow:inset 4px 0 0 var(--rowcolor)}
.rd-grid tr.story .chg{color:var(--amber);margin-left:4px;font-size:9px;vertical-align:middle}
.rd-grid tr.story.changed td.slug{text-decoration:underline dotted var(--amber)}
.palette{display:flex;gap:8px;flex-wrap:wrap}
.palette .sw{width:34px;height:34px;border-radius:50%;border:2px solid transparent;cursor:pointer}
.palette .sw.on{border-color:#fff}
.palette .sw.none{background:var(--panel3);color:var(--muted)}
.fmt-bar{display:inline-flex;gap:2px}
.search-res .excerpt{color:var(--ink);font-size:12px;margin-top:3px;white-space:pre-wrap;max-height:48px;overflow:hidden}
.search-res .r{border-left:4px solid transparent}
body.dense .rd-grid td{height:24px;padding:2px 6px;font-size:12px}
body.dense .rd-grid tr.block td{height:26px}
.para .pt textarea b,.para .pt textarea i{font-weight:inherit}
/* light theme */
body.light{--bg:#f3f4f6;--panel:#ffffff;--panel2:#f7f8fa;--panel3:#e9ecef;--line:#d5d9df;--line2:#c3c9d1;--ink:#1a1d21;--muted:#5c6672;--faint:#8b949e;--accent:#1d5fd1;--accent2:#174ca8}
body.light .topbar{background:#ffffff;border-bottom-color:var(--line)}
body.light .topbar .brand,body.light .topbar .clock,body.light .rd-title h1,body.light .strip .cell b,body.light .rd-grid td.slug,body.light .prod .big,body.light .prod .huge,body.light .prod .stat b,body.light .rd-grid tr.block td,body.light .rdl .rdi .t,body.light .mcard .sl,body.light .modal h2,body.light .cardx h3,body.light .page-h h1,body.light .login h1,body.light .topbar .user b,body.light .strip .cell.live b,body.light #editor .ed-props .est,body.light .rd-grid tr.story.onair td,body.light .topbar nav a.active{color:var(--ink)}
body.light .topbar nav a.active,body.light .topbar nav a:hover{background:var(--panel3);color:var(--ink)}
body.light .rd-grid th,body.light table.list th,body.light .rd-grid tr.totals td{background:#eef0f3;color:var(--muted)}
body.light .rd-grid tr.story{background:#fff}body.light .rd-grid tr.story:nth-child(even){background:#f7f8fa}body.light .rd-grid tr.story:hover td{background:#eef2f9}
body.light .rd-grid tr.story.selected td,body.light .rd-grid td.cursor{background:#dbe7ff}
body.light .rd-grid tr.block td{background:#e3e7ed}
body.light .rd-grid tr.story.onair td{background:#ffd6d6!important}
body.light .rd-grid tr.story.next td{background:#d9f5e4}
body.light .strip .cell,body.light .cardx,body.light .modal,body.light .login,body.light .toast,body.light .rdl .rdi,body.light .mcard,body.light .wire,body.light #dock,body.light #dock .m,body.light .prod .card,body.light .para,body.light #editor .ed-side,body.light #editor .ed-props{background:var(--panel);border-color:var(--line)}
body.light .strip .cell.live{background:#ffe3e3;border-color:#f3b3b3}
body.light input,body.light select,body.light textarea{background:#fff;border-color:var(--line2);color:var(--ink)}
body.light .btn{background:#f1f3f5;border-color:var(--line2);color:var(--ink)}body.light .btn:hover{background:#e6e9ed}
body.light .btn.primary{background:var(--accent);color:#fff}body.light .btn.ghost{background:transparent;border-color:transparent}
body.light #editor{background:var(--bg)}body.light #editor .ed-head,body.light .ed-estimate{background:#fff;border-color:var(--line)}
body.light .para .ph{background:#f1f3f5}body.light .para .pc{background:#f7f8fa}body.light .para .pt textarea{color:var(--ink)}body.light .para .pt textarea:focus{background:#fff}
body.light .para .cue{background:#eef0f3}body.light .ed-side .chip{background:#fff;color:var(--ink)}
body.light .tag{background:#e3e7ed;color:var(--ink)}body.light .kbd{background:#eef0f3;color:var(--ink)}
body.light .prod .card.air{background:#ffe3e3;border-color:#f3b3b3}body.light .prod .card.next{background:#e0f5e8;border-color:#b6e2c4}
body.light .st-draft{background:#e3e7ed;color:#333}
body.light #toasts .toast{color:var(--ink)}
body.light .batchbar{background:#dbe7ff;border-color:#b3c7ee}body.light .batchbar b{color:var(--ink)}
body.light .avatar{background:#e3e7ed;color:var(--ink)}

/* ---- v1.3: dashboard, live tally */
.dash{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:12px}
.dash .cardx.wide{grid-column:1/-1}
.dash-rd{display:grid;grid-template-columns:60px 1fr auto auto auto;gap:12px;align-items:center;padding:8px 10px;border-radius:6px;border:1px solid var(--line);margin-bottom:6px;color:var(--ink)}
.dash-rd:hover{border-color:var(--accent)}
.dash-rd.live{border-color:#7a2b2b;background:#2a1212}
.dash-rd .t{font-weight:800;font-size:15px;color:#fff}
.dash-rd .n b,.dash-row .n b{color:#fff;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash-rd .n small,.dash-row .n small{color:var(--muted);display:block}
.dash-row{display:flex;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line);color:var(--ink)}
.dash-row .n{flex:1;min-width:0}
#tb-live{font-weight:800;max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;animation:blink 1.5s steps(1) infinite}
body.light .dash-rd .t,body.light .dash-rd .n b,body.light .dash-row .n b{color:var(--ink)}
body.light .dash-rd.live{background:#ffe3e3;border-color:#f3b3b3}

/* ---- v1.4: columns layout, float/lock columns, images, producer aired rows, cue column resizer */
.rd-grid th{cursor:grab;position:relative}
.rd-grid th.drop-col{box-shadow:inset 3px 0 0 var(--accent)}
.rd-grid th .col-resize{position:absolute;top:0;right:-3px;width:7px;height:100%;cursor:col-resize}
.rd-grid th .col-resize:hover{background:var(--accent)}
.rd-grid th.col-menu{cursor:pointer;text-align:center;color:var(--accent)}
.rd-grid td.toggle{cursor:pointer;text-align:center}
.rd-grid td.toggle:hover{box-shadow:inset 0 0 0 1px var(--line2)}
.tag.floattag{background:#5a3a10;color:#ffd27f;letter-spacing:.06em}
.rowlock{color:var(--amber);font-weight:800;font-size:11px}
.rowlock-off{opacity:.25}
.rd-grid td.toggle:hover .rowlock-off{opacity:.8}
.rd-grid tr.story.rowlocked td{box-shadow:inset 0 -1px 0 #3b3120}
.rd-grid tr.story.rowlocked td.slug:after{content:" 🔒";font-size:10px}
.rd-grid td.thumbs{padding:1px 4px}
.thumb{height:24px;width:auto;max-width:44px;object-fit:cover;border-radius:3px;margin-right:3px;vertical-align:middle;background:#000}
.prod table.list tr.aired td{background:#17321f;color:#8fd6a8}
.prod table.list tr.aired td .st{opacity:.7}
.prod table.list tr.onair td{background:#3b1414;color:#fff}
.prod table.list tr.next td{background:#122a1c}
.prod table.list tr.float td,.prod table.list tr.killed td{opacity:.5}
.rd-grid tr.story.aired td{background:#172a1f}
.rd-grid tr.story.aired .st-aired{background:#1d4a30;color:#7ee2a4;text-decoration:none}
.rd-grid tr.story.aired td.page:before{content:"✔ ";color:#2fbf71}
#editor{--cuecol:230px}
.para{grid-template-columns:var(--cuecol) 1fr}
.para .pc{position:relative}
.para .pc .pc-resize{position:absolute;top:0;right:-4px;width:8px;height:100%;cursor:col-resize}
.para .pc .pc-resize:hover{background:var(--accent);opacity:.6}
body.light .rd-grid tr.story.aired td{background:#e3f5ea}
body.light .prod table.list tr.aired td{background:#dff3e6;color:#1d4a30}
@media (max-width:900px){.para{grid-template-columns:1fr}.para .pc .pc-resize{display:none}}
.rd-grid tr.block td .btotal{cursor:pointer;color:#fff;border-bottom:1px dotted var(--muted)}
.rd-grid tr.block td .btotal:hover{color:var(--accent);border-bottom-color:var(--accent)}
.rd-grid td[data-col="rowlock"]{font-size:14px}

/* ---- on-air graphics preview */
.gfx-frame{position:relative;overflow:hidden;border-radius:6px;background:#111;border:1px solid var(--line2);flex:none}
.gfx-canvas{position:absolute;left:0;top:0;transform-origin:0 0;overflow:hidden}
.gfx-canvas.gfx-video{background:radial-gradient(ellipse at 50% 40%,#3b4a5e 0%,#1b2330 55%,#0c1017 100%)}
.gfx-canvas.gfx-video:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 2px,transparent 2px 6px);pointer-events:none}
.gfx-el{position:absolute;box-sizing:border-box;overflow:hidden}
.gfx-text span{width:100%;white-space:pre-wrap;word-wrap:break-word}
.gfx-image{display:flex;align-items:center;justify-content:center}
.gfx-ph{color:#8b949e;font:600 40px Arial,sans-serif;text-transform:uppercase;letter-spacing:.1em}
.gfx-safe{position:absolute;border:2px dashed rgba(255,255,255,.35);pointer-events:none}
.gfx-safe.title{border-color:rgba(255,220,63,.45)}
.gfx-frame.designer .gfx-el{cursor:move;outline:1px dashed rgba(255,255,255,.25)}
.gfx-frame.designer .gfx-el.sel{outline:3px solid #ffd23f;z-index:5}
.gfx-designer{display:grid;grid-template-columns:1fr 300px;gap:12px}
.gfx-designer .props .form{grid-template-columns:1fr 1fr;gap:6px 10px}
.gfx-designer .props .form input,.gfx-designer .props .form select{padding:4px 6px;font-size:12px}
.gfx-designer .props label{font-size:10px}
.gfx-ellist{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0}
.gfx-ellist .chip{border:1px solid var(--line2);background:var(--panel3);border-radius:4px;padding:2px 8px;font-size:11px;cursor:pointer}
.gfx-ellist .chip.on{border-color:#ffd23f;color:#ffd23f}
.cue .gfx-mini{margin-top:4px}
.cue .gfx-mini .gfx-frame{border-radius:4px}
@media (max-width:900px){.gfx-designer{grid-template-columns:1fr}}