/* ===== Teleprompter ITB — estilos ===== */
:root{
  --bg:#0b0b0d; --bg2:#121215; --card:#151519; --card2:#1b1b20; --border:#26262c; --border2:#33333b;
  --text:#ececf1; --muted:#9a9aa6; --muted2:#6c6c78;
  --accent:#4c7ef3; --accent2:#3b6be0; --green:#2fcf7a; --red:#e0475a; --yellow:#f5c542; --purple:#9b7bf5;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --sans:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --radius:10px; --radius-sm:7px;
  --safe-top:env(safe-area-inset-top,0px); --safe-bottom:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:14px;-webkit-text-size-adjust:100%}
html,body{overscroll-behavior:none;overflow-x:hidden}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:var(--card2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 12px;color:var(--text);line-height:1.2;user-select:none;-webkit-tap-highlight-color:transparent}
button:hover{border-color:var(--border2);background:#202026}
button:active{transform:translateY(1px)}
button:disabled{opacity:.45;cursor:default;transform:none}
button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
button.primary:hover{background:var(--accent2)}
button.danger{border-color:#5a2a30;color:#ff8a96}
button.danger:hover{background:#2a1418}
button.ghost{background:transparent;border-color:transparent}
button.ghost:hover{background:var(--card2)}
button.icon{padding:6px;width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center}
button.active{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:#1a2340}
button.sm{padding:5px 9px;font-size:12px}
button.lg{padding:14px 18px;font-size:16px}
input[type=text],input[type=password],input[type=number],input[type=url],select,textarea{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 10px;color:var(--text);outline:none;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--accent)}
input[type=range]{width:100%;accent-color:var(--accent)}
input[type=color]{width:38px;height:30px;border:1px solid var(--border);border-radius:6px;background:var(--bg2);padding:2px}
a{color:#8fb1ff}
svg.i{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-4px;flex:none}
.row{display:flex;align-items:center;gap:8px}
.row.wrap{flex-wrap:wrap}
.grow{flex:1;min-width:0}
.muted{color:var(--muted)}
.tiny{font-size:11px;color:var(--muted2)}
.mono{font-family:var(--mono)}
.hidden{display:none!important}
.mobile-only{display:none}
@media (max-width:760px){.mobile-only{display:inline-flex}}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:14px}
.card h3,.panel h3{margin:0 0 10px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
.badge{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;background:var(--card2);border:1px solid var(--border);color:var(--muted)}
.badge.green{color:var(--green);border-color:#1f4d34;background:#0f2419}
.badge.red{color:#ff8a96;border-color:#5a2a30;background:#2a1418}
.badge.yellow{color:var(--yellow);border-color:#5a4a1a;background:#2a2210}
.badge.blue{color:#9db8ff;border-color:#2a3d70;background:#131c33}
.badge.purple{color:#c7b5ff;border-color:#3d3070;background:#1c1733}
.dot{width:8px;height:8px;border-radius:50%;background:var(--muted2);display:inline-block;flex:none}
.dot.green{background:var(--green);box-shadow:0 0 6px var(--green)}
.dot.yellow{background:var(--yellow)}
.dot.red{background:var(--red)}
.kbd{font-family:var(--mono);font-size:11px;padding:2px 7px;border:1px solid var(--border2);border-bottom-width:2px;border-radius:5px;background:var(--bg2);color:var(--text)}
hr.sep{border:0;border-top:1px solid var(--border);margin:12px 0}

/* ===== Toasts ===== */
.toasts{position:fixed;left:50%;bottom:calc(20px + var(--safe-bottom));transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:9999;pointer-events:none}
.toast{background:#202026;border:1px solid var(--border2);border-radius:8px;padding:10px 14px;box-shadow:0 8px 30px rgba(0,0,0,.5);font-size:13px;animation:toastin .2s ease;max-width:90vw}
.toast.error{border-color:#7a2a35;background:#2a1418}
.toast.ok{border-color:#1f4d34}
@keyframes toastin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ===== Modal ===== */
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px;animation:fadein .15s}
.modal{background:var(--card);border:1px solid var(--border2);border-radius:14px;width:min(560px,100%);max-height:min(90vh,900px);display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.modal.wide{width:min(860px,100%)}
.modal header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--border)}
.modal header h2{margin:0;font-size:15px}
.modal .body{padding:16px;overflow:auto}
.modal footer{padding:12px 16px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px}
@keyframes fadein{from{opacity:0}to{opacity:1}}
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.field label{font-size:12px;color:var(--muted);font-weight:600}
.field .hint{font-size:11px;color:var(--muted2)}
.field-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--border)}
.field-row:last-child{border-bottom:0}
.field-row label{font-size:13px}
.field-row .val{font-family:var(--mono);font-size:12px;color:var(--muted);min-width:52px;text-align:right}
.field-row input[type=range]{width:160px}
.seg{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden}
.seg button{border:0;border-radius:0;background:transparent;padding:6px 10px;font-size:12px}
.seg button+button{border-left:1px solid var(--border)}
.seg button.on{background:var(--accent);color:#fff}
.switch{position:relative;width:40px;height:22px;border-radius:999px;background:var(--border2);border:0;padding:0;flex:none}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .15s}
.switch.on{background:var(--accent)}
.switch.on::after{left:21px}

/* ===== Topbar ===== */
.topbar{display:flex;align-items:center;gap:12px;padding:8px 14px;padding-top:calc(8px + var(--safe-top));background:var(--bg2);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50;min-height:44px}
.topbar .brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;text-decoration:none;color:var(--text)}
.topbar .brand .logo{width:24px;height:24px}
.topbar .view-name{color:var(--muted);border-left:1px solid var(--border);padding-left:12px}
.topbar .spacer{flex:1}
.clock{font-family:var(--mono);font-size:13px;display:flex;align-items:baseline;gap:6px}
.clock .tz{font-size:10px;color:var(--muted2);font-family:var(--sans)}
.conn{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.conn.on{color:var(--green)}

.topbar .brand span{white-space:nowrap}
@media (max-width:640px){
  .topbar{gap:8px;padding-left:10px;padding-right:10px}
  .topbar .clock .tz{display:none}
  .topbar .conn span:last-child{display:none}
  .topbar .view-name{padding-left:8px}
  .topbar .brand span{display:none}
}

/* ===== Home ===== */
.home{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 16px;text-align:center}
.home .logo{width:56px;height:56px;margin-bottom:12px}
.home h1{margin:0 0 8px;font-size:34px;letter-spacing:-.02em}
.home p.sub{color:var(--muted);font-size:16px;margin:0 0 28px}
.home .stack{display:flex;flex-direction:column;gap:10px;width:min(320px,100%)}
.home .stack button{padding:13px 16px;font-size:15px}
.home .sessions{width:min(520px,100%);margin-top:34px;text-align:left}
.home .sessions .item{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--card);margin-bottom:8px}
.home .sessions .item .code{font-family:var(--mono);font-weight:700;letter-spacing:.06em}
.home footer{margin-top:40px;color:var(--muted2);font-size:12px}
.setup{max-width:720px;margin:40px auto;padding:0 16px}
.setup pre{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:12px;overflow:auto;font-size:12px}

/* ===== Editor ===== */
.editor-layout{display:grid;grid-template-columns:300px minmax(0,1fr) 340px;height:calc(100vh - 45px - var(--safe-top));height:calc(100dvh - 45px - var(--safe-top))}
.editor-layout>*{min-height:0}
.sidebar{border-right:1px solid var(--border);overflow:auto;padding:12px;display:flex;flex-direction:column;gap:12px;background:var(--bg2)}
.sidebar.right{border-right:0;border-left:1px solid var(--border)}
.panel{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:12px}
.panel.collapsible>h3{cursor:pointer;display:flex;align-items:center;justify-content:space-between;margin:0}
.panel.collapsible.closed>*:not(h3){display:none}
.panel.collapsible>h3 .chev{transition:transform .15s}
.panel.collapsible.closed>h3 .chev{transform:rotate(-90deg)}
.editor-main{display:flex;flex-direction:column;min-width:0}
.toolbar{display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:1px solid var(--border);flex-wrap:wrap;background:var(--bg2)}
.toolbar .group{display:flex;gap:4px;align-items:center}
.toolbar .divider{width:1px;height:22px;background:var(--border);margin:0 4px}
.editor-scroll{flex:1;overflow:auto;padding:20px 24px 120px}
.editor-content{max-width:820px;margin:0 auto;min-height:60vh;outline:none;font-size:18px;line-height:1.6;caret-color:var(--accent)}
.editor-content:empty::before,.editor-content.is-empty::before{content:attr(data-placeholder);color:var(--muted2);pointer-events:none}
.editor-content p,.editor-content h1,.editor-content h2,.editor-content div{margin:0 0 .6em}
.editor-content h1,.editor-content h2{font-size:1.35em;font-weight:700;color:#fff}
.editor-content p.slug,.editor-content .slug{font-family:var(--mono);font-weight:700;color:var(--yellow);background:#2a2210;border-left:3px solid var(--yellow);padding:3px 8px;border-radius:4px}
.editor-content hr.slide-break{border:0;border-top:2px dashed var(--purple);margin:14px 0;position:relative;height:0}
.editor-content hr.slide-break::after{content:"— — —  quebra de slide";position:absolute;left:50%;top:-9px;transform:translateX(-50%);background:var(--bg);color:var(--purple);font-size:11px;padding:0 8px;letter-spacing:.06em}
.editor-content b,.editor-content strong{font-weight:800;color:#fff}
.editor-content .c-yellow{color:var(--yellow)}.editor-content .c-red{color:#ff6b7a}.editor-content .c-green{color:var(--green)}.editor-content .c-blue{color:#7fa6ff}
.editor-content mark.findhit{background:#5a4a1a;color:#fff;border-radius:2px}
.editor-content mark.findhit.cur{background:var(--yellow);color:#000}
.statusbar{display:flex;align-items:center;gap:14px;padding:6px 12px;border-top:1px solid var(--border);font-size:12px;color:var(--muted);background:var(--bg2);flex-wrap:wrap}
.findbar{display:flex;gap:6px;align-items:center;padding:6px 10px;border-bottom:1px solid var(--border);background:var(--card)}
.findbar input{width:220px}
.link-row{display:flex;align-items:center;gap:6px;margin-bottom:8px}
.link-row .lbl{width:70px;font-size:12px;color:var(--muted)}
.link-row input{font-family:var(--mono);font-size:11px;padding:6px 8px}
.script-item{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:7px;cursor:pointer;border:1px solid transparent}
.script-item:hover{background:var(--card2)}
.script-item.active{border-color:var(--accent);background:#151c33}
.script-item .title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.device-item{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--border);font-size:12px}
.device-item:last-child{border-bottom:0}
.device-item .name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.device-item .type{font-size:10px;color:var(--muted2);text-transform:uppercase;letter-spacing:.06em}
.preview-wrap{display:flex;flex-direction:column;gap:8px}
.preview-frame{position:relative;background:#000;border:1px solid var(--border);border-radius:8px;overflow:hidden;aspect-ratio:16/10}
.preview-frame .prompter-stage{position:absolute;inset:0}
.menu{position:absolute;background:var(--card2);border:1px solid var(--border2);border-radius:8px;padding:4px;z-index:200;min-width:190px;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.menu button{display:flex;width:100%;text-align:left;background:transparent;border:0;padding:8px 10px;border-radius:5px;gap:8px;align-items:center;font-size:13px}
.menu button:hover{background:#2a2a31}
.menu button.danger{color:#ff8a96}
.rundown-item{border:1px solid var(--border);border-radius:8px;padding:8px;margin-bottom:6px;background:var(--bg2)}
.rundown-item.live{border-color:var(--red);background:#2a1418}
.rundown-item.standby{border-color:#5a4a1a}
.rundown-item .t{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:600}
.rundown-item .t button.icon{width:26px;height:26px;padding:2px}
.rundown-item .prev{font-size:11px;color:var(--muted2);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rundown-item .acts{display:flex;gap:4px;margin-top:6px;flex-wrap:wrap}
.rundown-link{display:flex;justify-content:center;margin:-2px 0 4px}
.rundown-link button{font-size:11px;padding:2px 8px;color:var(--muted2)}
.rundown-link button.on{color:var(--purple);border-color:var(--purple)}
.rev-item{padding:8px 10px;border:1px solid var(--border);border-radius:8px;margin-bottom:6px;cursor:pointer;font-size:12px;display:flex;align-items:center;gap:8px}
.rev-item:hover{background:var(--card2)}
.rev-item.sel{border-color:var(--accent)}
.diff{font-family:var(--sans);white-space:pre-wrap;font-size:14px;line-height:1.5;background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:10px;max-height:50vh;overflow:auto}
.diff ins{background:#123d24;color:#9df0b7;text-decoration:none}
.diff del{background:#4a1a22;color:#ffb0ba;text-decoration:line-through}
.rev-preview{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:10px;max-height:50vh;overflow:auto;font-size:14px;line-height:1.5}

@media (max-width:1100px){.editor-layout{grid-template-columns:260px minmax(0,1fr)}.sidebar.right{display:none}.editor-layout.show-right{grid-template-columns:260px minmax(0,1fr) 320px}.editor-layout.show-right .sidebar.right{display:flex}}
@media (max-width:760px){
  .topbar{flex-wrap:wrap;row-gap:6px;padding:6px 10px;padding-top:calc(6px + var(--safe-top))}
  .topbar .spacer{display:none}
  .topbar .view-name{display:none}
  .topbar .badge.mono{display:none}
  .topbar .row{flex-wrap:wrap}
  .topbar .row:last-of-type{width:100%;order:10}
  .topbar .conn{order:5;margin-left:auto}
  .topbar .clock{order:6}
  .topbar .clock .mono{font-size:12px}
  .editor-layout{display:flex;flex-direction:column;height:auto;min-height:calc(100dvh - 90px)}
  .sidebar{border-right:0;border-bottom:1px solid var(--border);max-height:none;padding:8px;gap:8px}
  .sidebar .panel{padding:8px 10px}
  .sidebar.right{display:none}
  .editor-layout.show-right .sidebar.right{display:flex;position:fixed;left:0;right:0;top:0;bottom:0;z-index:70;border:0;background:var(--bg);padding-top:calc(12px + var(--safe-top));overflow:auto}
  .toolbar{padding:6px 8px;gap:4px}
  .toolbar button{padding:6px 8px;font-size:12px}
  .editor-scroll{padding:14px 14px 100px}
  .editor-content{font-size:17px}
  .link-row input{font-size:10px}
  .modal{max-height:92dvh}
}

/* ===== Prompter ===== */
.prompter-root{position:fixed;inset:0;background:var(--p-bg,#000);color:var(--p-fg,#fff);overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:none;-webkit-touch-callout:none}
.prompter-stage{cursor:grab}.prompter-stage:active{cursor:grabbing}
.prompter-root.light{--p-bg:#fff;--p-fg:#000}
.prompter-stage{position:absolute;inset:0;overflow:hidden;background:var(--p-bg,#000);color:var(--p-fg,#fff)}
.prompter-stage.mirror-h{transform:scaleX(-1)}
.prompter-stage.mirror-v{transform:scaleY(-1)}
.prompter-stage.mirror-h.mirror-v{transform:scale(-1,-1)}
.prompter-track{position:absolute;left:0;right:0;top:0;will-change:transform}
.prompter-text{margin:0 auto;font-family:var(--p-font,var(--sans));font-size:var(--p-size,48px);line-height:var(--p-lh,1.4);text-align:var(--p-align,left);width:var(--p-width,90%);word-wrap:break-word;overflow-wrap:break-word}
.prompter-text p,.prompter-text div,.prompter-text h1,.prompter-text h2{margin:0 0 .55em}
.prompter-text h1,.prompter-text h2{font-size:1.2em;font-weight:800}
.prompter-text b,.prompter-text strong{font-weight:800}
.prompter-text .slug{font-family:var(--mono);font-size:.55em;letter-spacing:.06em;text-transform:uppercase;opacity:.75;border-top:2px solid rgba(128,128,128,.45);padding-top:.5em;margin-top:1em}
.prompter-text hr.slide-break{border:0;border-top:2px dashed currentColor;opacity:.35;margin:1em 0}
.prompter-text .c-yellow{color:#ffd54a}.prompter-text .c-red{color:#ff5c6c}.prompter-text .c-green{color:#4ade80}.prompter-text .c-blue{color:#7fb0ff}
.prompter-root.light .prompter-text .c-yellow{color:#a06e00}.prompter-root.light .prompter-text .c-red{color:#c81e2f}.prompter-root.light .prompter-text .c-green{color:#127a3a}.prompter-root.light .prompter-text .c-blue{color:#1d4fb8}
.prompter-text .cue{display:inline-block;width:.35em;height:.35em;border-radius:50%;background:var(--purple);vertical-align:middle;margin:0 .15em}
.reading-line{position:absolute;left:4%;right:4%;top:var(--p-line,40%);height:0;border-top:2px solid rgba(255,255,255,.28);pointer-events:none;z-index:3}
.prompter-root.light .reading-line{border-color:rgba(0,0,0,.25)}
.reading-line{left:0;right:0;padding:0}
.reading-line .state-icon{position:absolute;left:14px;top:-30px;width:60px;height:60px;opacity:.85;color:var(--p-fg,#fff);filter:drop-shadow(0 0 6px var(--p-bg,#000))}
.reading-line .state-icon svg{width:60px;height:60px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.prompter-hud{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;gap:14px;padding:12px 18px;padding-top:calc(12px + var(--safe-top));z-index:5;pointer-events:none;background:linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,0))}
.prompter-root.light .prompter-hud{background:linear-gradient(rgba(255,255,255,.7),rgba(255,255,255,0))}
.prompter-hud .brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:16px;color:inherit;text-decoration:none;pointer-events:auto}
.prompter-hud .brand .logo{width:26px;height:26px}
.prompter-hud .spacer{flex:1}
.prompter-hud .devname{font-family:var(--mono);font-size:13px;font-weight:600}
.prompter-hud .pct{font-family:var(--mono);font-size:13px;min-width:40px;text-align:right}
.prompter-tools{position:absolute;right:16px;bottom:calc(16px + var(--safe-bottom));display:flex;gap:6px;z-index:6}
.prompter-tools .grp{display:flex;gap:4px;background:rgba(20,20,24,.85);border:1px solid var(--border);border-radius:8px;padding:4px}
.prompter-tools button{background:transparent;border-color:transparent;color:#ddd}
.prompter-tools button:hover{background:#2a2a31}
.prompter-tools button.active{background:#1a2340;border-color:var(--accent)}
.prompter-root.light .prompter-tools .grp{background:rgba(255,255,255,.9)}
.prompter-root.light .prompter-tools button{color:#222}
.prompter-root.hide-ui .prompter-hud,.prompter-root.hide-ui .prompter-tools,.prompter-root.hide-ui .slide-counter{display:none}
.prompter-root.hide-ui .reading-line .state-icon{display:none}
.blackout{position:absolute;inset:0;background:#000;z-index:20;display:flex;align-items:center;justify-content:center;color:#666;font-family:var(--mono);letter-spacing:.3em;font-size:22px}
.countdown-overlay{position:absolute;inset:0;z-index:15;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.75);color:#fff;font-family:var(--mono);font-size:min(40vw,40vh);font-weight:700}
.identify-overlay{position:absolute;inset:0;z-index:30;background:var(--accent);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;font-size:min(10vw,64px);font-weight:800;animation:blink .5s 5}
.identify-overlay small{font-size:.35em;font-weight:500;opacity:.9;font-family:var(--mono)}
@keyframes blink{50%{opacity:.5}}
.slide-counter{position:absolute;left:50%;bottom:calc(18px + var(--safe-bottom));transform:translateX(-50%);font-family:var(--mono);font-size:14px;opacity:.7;z-index:6;background:rgba(0,0,0,.4);padding:4px 12px;border-radius:999px}
.prompter-root.light .slide-counter{background:rgba(255,255,255,.6)}
.slide-view{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:6vh 4vw;overflow:hidden}
.slide-view .prompter-text{max-height:100%;overflow:hidden}
.side-panel{position:absolute;right:16px;bottom:calc(64px + var(--safe-bottom));width:min(360px,calc(100vw - 32px));max-height:calc(100vh - 140px);overflow:auto;background:rgba(20,20,24,.97);border:1px solid var(--border2);border-radius:12px;padding:14px;z-index:40;color:var(--text);font-size:13px;box-shadow:0 12px 40px rgba(0,0,0,.6)}
.side-panel h4{margin:0 0 10px;font-size:14px;display:flex;justify-content:space-between;align-items:center}
.disconnected{position:fixed;inset:0;background:var(--bg);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;color:var(--muted);z-index:100}

/* ===== Remote ===== */
.remote{max-width:640px;margin:0 auto;padding:12px 12px calc(40px + var(--safe-bottom));display:flex;flex-direction:column;gap:10px}
.status-chip{display:flex;justify-content:center;padding:8px;border:1px solid var(--border);border-radius:var(--radius);background:var(--card)}
.bigbtn{width:100%;padding:18px;font-size:19px;font-weight:700;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;gap:10px}
.bigbtn svg.i{width:24px;height:24px}
.bigbtn.play{background:var(--green);border-color:var(--green);color:#052b16}
.bigbtn.pause{background:var(--yellow);border-color:var(--yellow);color:#2b2000}
.bigbtn.restart{background:var(--accent);border-color:var(--accent);color:#fff}
.jumps{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.jumps.two{grid-template-columns:1fr 1fr;margin-top:4px}
.jumps button{padding:12px 6px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;display:flex;align-items:center;justify-content:center;gap:6px}
.speed-panel .head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.speed-panel .val{font-family:var(--mono);font-size:15px;font-weight:700;background:var(--bg2);border:1px solid var(--border);padding:4px 10px;border-radius:6px;min-width:60px;text-align:center}
.speed-ticks{position:relative;height:30px;margin:0 6px}
.speed-ticks span{position:absolute;top:0;transform:translateX(-50%);font-family:var(--mono);font-size:10px;color:var(--muted2);text-align:center}
.speed-ticks span::before{content:"";display:block;width:1px;height:8px;background:var(--border2);margin:0 auto 3px}
.speed-labels{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted2);margin:6px 6px 12px}
.speed-labels .on{color:var(--text);font-weight:700}
.presets{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;border-top:1px solid var(--border);padding-top:12px}
.presets button{font-family:var(--mono);font-size:12px;padding:8px 10px;min-width:52px}
.presets button.on{border-color:var(--accent);background:#1a2340}
.speed-hint{text-align:center;font-size:11px;color:var(--muted2);font-style:italic;margin-top:8px}
.remote-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:560px){.remote-grid{grid-template-columns:1fr}}
.tabs{display:flex;background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:3px;margin-bottom:8px}
.tabs button{flex:1;border:0;background:transparent;border-radius:6px;padding:7px;font-size:13px}
.tabs button.on{background:var(--card2);border:1px solid var(--border2)}
table.slug-table{width:100%;border-collapse:collapse;font-size:13px}
table.slug-table th{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left;padding:6px 8px;background:var(--bg2)}
table.slug-table td{padding:8px;border-top:1px solid var(--border);cursor:pointer}
table.slug-table tr.past td{color:var(--muted2)}
table.slug-table tr.cur td{background:var(--red);color:#fff;font-weight:600}
table.slug-table td.pos{font-family:var(--mono);text-align:right;width:52px}
table.slug-table td.n{font-family:var(--mono);color:var(--muted);width:30px}
.quick-edit{min-height:200px;max-height:50vh;overflow:auto;background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:10px;font-size:14px;line-height:1.5;outline:none}
.quick-edit:focus{border-color:var(--accent)}
.quick-edit p,.quick-edit div,.quick-edit h1,.quick-edit h2{margin:0 0 .5em}
.quick-edit .slug{color:var(--yellow);font-family:var(--mono);font-weight:700}
.quick-edit hr.slide-break{border:0;border-top:2px dashed var(--purple);margin:8px 0}
.mini-preview{position:relative;background:#000;border:1px solid var(--border);border-radius:8px;overflow:hidden;height:220px;touch-action:none;cursor:grab}
.mini-preview .hint{position:absolute;right:8px;bottom:6px;font-size:10px;color:#777;z-index:5;pointer-events:none}
.mini-preview .prompter-stage{position:absolute;inset:0}
.mini-preview .pct{position:absolute;left:8px;bottom:6px;font-family:var(--mono);font-size:11px;color:#aaa;z-index:5}
.mini-preview .chip{position:absolute;right:8px;top:8px;z-index:5}
.slide-nav{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center}
.slide-nav .cnt{font-family:var(--mono);font-size:14px;padding:0 10px}
.remote footer{text-align:center;color:var(--muted2);font-size:11px;margin-top:10px}
.script-select{display:flex;gap:8px;align-items:center}
.remote .panel h3 .cnt{background:var(--bg2);border:1px solid var(--border);border-radius:999px;padding:1px 8px;font-family:var(--mono);color:var(--text)}

/* ===== Gate (senha) ===== */
.gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.gate .card{width:min(380px,100%)}

/* Editor de texto: seleção */
::selection{background:#3b5bb5;color:#fff}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
