/* Lost & Found admin — a prompt book: running order left, open scene right. */
:root{
  --bg:#f6f4f0; --panel:#ffffff; --ink:#1b1c1f; --muted:#66655f; --line:#e1ddd4;
  --brass:#8a6a2c; --brass-soft:#efe5cf; --dir:#5c6a74; --dir-bg:#eef1f3;
  --rec:#7a3e5d; --rec-bg:#f4e9ef; --ok:#2f6b45; --ok-bg:#e3f0e6; --todo:#9a4a1c; --todo-bg:#f7e7dc;
  --cut:#a33a2a; --cut-bg:#f8e3df; --note:#fff8e6;
  --f-display:"Cormorant Garamond","Iowan Old Style",Georgia,serif;
  --f-body:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#111214; --panel:#1a1b1e; --ink:#ece8df; --muted:#9d9a91; --line:#2c2d31;
  --brass:#d4b46e; --brass-soft:#2e2818; --dir:#a9b6bf; --dir-bg:#1f2428;
  --rec:#d9a3c0; --rec-bg:#2c1f27; --ok:#8fcfa3; --ok-bg:#18281e; --todo:#eaa77c; --todo-bg:#2e2016;
  --cut:#f0998b; --cut-bg:#331c19; --note:#262217; color-scheme:dark}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 var(--f-body);
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
body.center{display:grid;place-items:center;min-height:100vh}
.wrap{max-width:1240px;margin:0 auto;padding-block:20px 60px;display:flex;flex-direction:column;gap:18px}
button,select,input,textarea{font:inherit;color:inherit}
input,select,textarea{background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:8px 10px;width:100%}
textarea{resize:vertical;min-height:70px;line-height:1.45}
label.f{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
a{color:inherit}
.muted{color:var(--muted)}
.small{font-size:12.5px}
.hide{display:none!important}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--panel);padding:7px 13px;border-radius:8px;cursor:pointer;text-decoration:none;font-size:14px;white-space:nowrap}
.btn:hover{border-color:var(--brass)}
.btn.primary{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.btn.small{padding:3px 9px;font-size:12.5px}
.btn.quiet{border-color:transparent;background:none;color:var(--muted)}
.btn.quiet:hover{color:var(--ink);border-color:var(--line)}
.btn.danger{color:var(--cut)}
.btn[disabled]{opacity:.5;cursor:default}
.row-actions{display:flex;gap:6px;flex-wrap:wrap;align-items:center}

/* login */
.login{max-width:440px;width:100%;display:flex;flex-direction:column;gap:14px;padding:28px}
.login h1{font:600 40px/1 var(--f-display);margin:0}
.login h2{font:600 22px/1.2 var(--f-display);margin:6px 0 0}
.login form{display:flex;flex-direction:column;gap:10px}
.login .sep{border-top:1px solid var(--line);margin:6px 0}
.msg{font-size:13.5px;min-height:1.3em}
.msg.err{color:var(--cut)}
.msg.ok{color:var(--ok)}

/* header */
header.top{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:flex-end;justify-content:space-between}
.brand h1{font:600 clamp(30px,4vw,40px)/1 var(--f-display);margin:0}
.brand p{margin:6px 0 0;color:var(--muted);font-size:13.5px}
.facts{display:flex;gap:22px;flex-wrap:wrap;align-items:flex-end}
.fact{display:flex;flex-direction:column}
.fact b{font:500 22px/1.1 var(--f-mono);font-variant-numeric:tabular-nums}
.fact span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.who{font-size:12.5px;color:var(--muted);display:flex;gap:8px;align-items:center}
.bar{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between;border-block:1px solid var(--line);padding-block:10px}
.tabs,.seg{display:flex;gap:4px;flex-wrap:wrap}
.tab,.seg button{border:1px solid transparent;background:none;padding:6px 12px;border-radius:999px;cursor:pointer;color:var(--muted)}
.tab[aria-selected="true"]{background:var(--ink);color:var(--bg)}
.seg{border:1px solid var(--line);border-radius:999px;padding:3px}
.seg button{padding:4px 10px;font-size:13px}
.seg button[aria-pressed="true"]{background:var(--brass-soft);color:var(--ink)}
.ctl{display:flex;gap:12px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--muted)}
.ctl>span{display:flex;gap:6px;align-items:center}

/* scenes */
.scenes{display:grid;grid-template-columns:minmax(250px,320px) minmax(0,1fr);gap:22px;align-items:start}
@media (max-width:880px){.scenes{grid-template-columns:minmax(0,1fr)}}
.rundown{background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden;position:sticky;top:max(12px,env(safe-area-inset-top,0px));max-height:calc(100vh - 24px);display:flex;flex-direction:column}
@media (max-width:880px){.rundown{position:static;max-height:300px}}
.rundown ol{list-style:none;margin:0;padding:0;overflow:auto}
.rundown li button{width:100%;text-align:left;display:grid;grid-template-columns:2.2em minmax(0,1fr) auto;gap:8px;align-items:baseline;padding:9px 12px;border:0;border-bottom:1px solid var(--line);background:none;cursor:pointer}
.rundown li button:hover{background:var(--brass-soft)}
.rundown li button[aria-current="true"]{background:var(--brass-soft);box-shadow:inset 3px 0 0 var(--brass)}
.rn{font:500 12px var(--f-mono);color:var(--muted)}
.rt{min-width:0}.rt b{display:block;font-weight:500;line-height:1.3}.rt small{display:block;color:var(--muted);font-size:12px}
.rd{font:12px var(--f-mono);color:var(--muted);font-variant-numeric:tabular-nums;text-align:right}
.rd .cc{display:block;color:var(--brass)}
.rundown .foot{padding:10px 12px;font-size:12px;color:var(--muted);display:flex;justify-content:space-between;border-top:1px solid var(--line)}

.scene{display:flex;flex-direction:column;gap:18px;min-width:0}
.shead{display:flex;flex-direction:column;gap:6px}
.eyebrow{font:500 12px var(--f-mono);color:var(--brass);letter-spacing:.06em}
.shead h2{font:600 clamp(28px,3.4vw,38px)/1.1 var(--f-display);margin:0;text-wrap:balance}
.shead .alt{font:italic 500 20px/1.2 var(--f-display);color:var(--muted)}
.chips{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.chip{font-size:12px;padding:2px 9px;border-radius:999px;border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.chip.cut{background:var(--cut-bg);color:var(--cut);border-color:transparent}
.chip.have{background:var(--ok-bg);color:var(--ok);border-color:transparent}
.chip.need{background:var(--todo-bg);color:var(--todo);border-color:transparent}
.chip.final{background:var(--ok-bg);color:var(--ok);border-color:transparent}

.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.card>h3,.card .h3{margin:0 0 10px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600;display:flex;justify-content:space-between;align-items:center;gap:8px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:10px}

.cues{display:grid;gap:10px}
.cue{display:grid;grid-template-columns:7.5em minmax(0,1fr) auto;gap:4px 10px;align-items:baseline;padding-bottom:10px;border-bottom:1px solid var(--line)}
.cue:last-child{border-bottom:0;padding-bottom:0}
.ctype{font:500 11px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--brass)}
.cue .extra{grid-column:2 / -1;display:flex;flex-direction:column;gap:8px;min-width:0}
.cue .src{font-size:12px;color:var(--muted);word-break:break-all}
.cue audio,.cue video{width:100%;max-width:560px}
.cue video{border-radius:8px;background:#000}
.cue img{max-width:min(100%,420px);border-radius:8px}
.yt{position:relative;width:100%;max-width:560px;aspect-ratio:16/9}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:8px}
.attach{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.attach input[type=url]{flex:1 1 220px;width:auto}
.progress{font:12px var(--f-mono);color:var(--muted)}
@media (max-width:540px){.cue{grid-template-columns:minmax(0,1fr) auto}.ctype{grid-column:1 / -1}.cue .extra{grid-column:1 / -1}}
.props{display:flex;gap:6px;flex-wrap:wrap}

/* script */
.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-bottom:10px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.script .hdr{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr)) 2.2em;gap:18px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding-bottom:6px;border-bottom:1px solid var(--line);margin-bottom:6px}
.line{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr)) 2.2em;gap:18px;padding:3px 0;align-items:start;border-radius:6px}
.line p{margin:0;min-width:0;font-family:var(--f-display);font-size:19px;line-height:1.38;white-space:pre-wrap}
.line.direction p{font:13.5px/1.45 var(--f-body);color:var(--dir);background:var(--dir-bg);padding:5px 9px;border-radius:6px}
.line.recorded p{font-size:18px;color:var(--rec);background:var(--rec-bg);padding:5px 9px;border-radius:6px}
.line.recorded p::before{content:attr(data-tag);display:block;font:600 10px/1.6 var(--f-body);letter-spacing:.1em;text-transform:uppercase}
.line.title p{font-weight:600;font-size:23px;padding-top:10px}
.line .acts{display:flex;flex-direction:column;gap:2px;opacity:.7}
.line:hover .acts,.line:focus-within .acts,.line.has-c .acts{opacity:1}
.line .acts button{border:0;background:none;cursor:pointer;color:var(--muted);padding:2px;border-radius:5px;font-size:14px;line-height:1}
.line .acts button:hover{color:var(--brass);background:var(--brass-soft)}
.line.has-c .acts .cbtn{color:var(--brass)}
.line.hl{background:var(--note)}
.editor{grid-column:1 / -1;display:flex;flex-direction:column;gap:8px;background:var(--note);padding:10px;border-radius:8px}
.editor .two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:8px}
@media (max-width:640px){.script.both .line,.script.both .hdr{grid-template-columns:minmax(0,1fr) 2.2em;gap:2px 10px}.script.both .line p:nth-of-type(2){grid-column:1;color:var(--muted);font-size:16px;margin-bottom:8px}.script.both .hdr span:nth-child(2){display:none}.script.both .line .acts{grid-row:1 / span 2;grid-column:2}}

/* comments */
.thread{border:1px solid var(--line);border-radius:9px;padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.thread.resolved{opacity:.6}
.thread blockquote{margin:0;font:italic 15px/1.35 var(--f-display);color:var(--muted);border-left:2px solid var(--brass);padding-left:8px;cursor:pointer}
.cm{display:flex;flex-direction:column;gap:2px}
.cm .meta{font-size:12px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.cm .meta b{color:var(--ink);font-weight:600}
.cm .body{white-space:pre-wrap}
.cm.reply{margin-left:14px;padding-left:10px;border-left:1px solid var(--line)}
.threads{display:flex;flex-direction:column;gap:10px}
.newc{display:flex;flex-direction:column;gap:8px}
.newc .q{font:italic 14px var(--f-display);color:var(--muted)}

/* tables */
.tablewrap{overflow-x:auto;background:var(--panel);border:1px solid var(--line);border-radius:10px}
table{border-collapse:collapse;width:100%;min-width:680px;font-size:14px}
th,td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
td.n{font:12px var(--f-mono);color:var(--muted);white-space:nowrap}
.linkbox{display:flex;gap:8px;align-items:center;background:var(--note);border-radius:8px;padding:8px 10px;margin-top:8px}
.linkbox code{font:12px var(--f-mono);word-break:break-all;flex:1}
.checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:4px 12px;max-height:220px;overflow:auto;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:13.5px}
.checks label,.inline{display:flex;gap:6px;align-items:center}
.checks input,.inline input{width:auto}
.export{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:18px}
.export p{margin:0 0 10px;color:var(--muted)}.export ul{margin:0 0 14px;padding-left:18px;color:var(--muted)}
.toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:999px;font-size:14px;z-index:20;max-width:calc(100% - 32px)}
.hist li{margin-bottom:8px}
.hist del{color:var(--cut)}.hist ins{color:var(--ok);text-decoration:none}
@media (prefers-reduced-motion:no-preference){.scene{animation:in .16s ease-out}@keyframes in{from{opacity:.5}to{opacity:1}}}

/* text-only view */
.textonly{display:block}
.tx{max-width:760px;margin:0 auto;padding:8px 0 60px}
.tx.both{max-width:none}
.txs{margin-bottom:34px}
.txs h2{font-family:var(--f-display);font-weight:600;font-size:26px;margin:0 0 12px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.txs h2 span{font:500 13px var(--f-mono);color:var(--brass);vertical-align:middle;margin-right:6px}
.txl{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;margin:0 0 10px}
.tx.both .txl{grid-template-columns:repeat(2,minmax(0,1fr))}
.txl p{margin:0;font-family:var(--f-display);font-size:21px;line-height:1.45;white-space:pre-wrap}
.txl.recorded p{font-style:italic;color:var(--rec)}
.txl.title p{font-weight:600}
@media (max-width:640px){.tx.both .txl{grid-template-columns:minmax(0,1fr);gap:2px}.tx.both .txl p[lang="en"]{color:var(--muted);font-size:17px}}
@media print{.top,.bar{display:none}.txs{break-inside:avoid-page}}
/* voice recorder */
.recorder{display:flex;flex-direction:column;gap:10px;border:1px solid var(--rec);background:var(--rec-bg);border-radius:10px;padding:12px 14px;margin-bottom:12px}
.recorder .rhead{display:flex;justify-content:space-between;align-items:center}
.recorder .rtime{font:500 18px var(--f-mono);display:flex;align-items:center;gap:8px}
.recorder .dot{width:10px;height:10px;border-radius:50%;background:#d23;display:inline-block;animation:blink 1s infinite}
.recorder audio{width:100%;max-width:560px}
@keyframes blink{50%{opacity:.25}}

/* scene actions */
.sceneactions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.btn.big{padding:10px 18px;font-size:15px;font-weight:600}
.hint{margin:8px 0 0;font-size:13px;color:var(--muted)}
.cutnote{margin:10px 0 0;padding:8px 12px;border-radius:8px;background:var(--todo-bg);color:var(--todo);font-size:14px}
.rundown li.is-cut{opacity:.5}
.rundown li.is-cut b{text-decoration:line-through}
/* coloured Edit scene button */
.btn.edit{background:#b5651d;color:#fff;border-color:#b5651d;box-shadow:0 2px 6px rgba(181,101,29,.35)}
.btn.edit:hover{background:#9a5416;border-color:#9a5416}

/* Text only button + editable text view */
.btn.txtbtn{background:#2a5d8f;color:#fff;border-color:#2a5d8f;font-weight:600;margin-right:8px}
.btn.txtbtn:hover{background:#224d77}
.btn.txtbtn.on{background:#fff;color:#2a5d8f;box-shadow:inset 0 0 0 2px #2a5d8f}
.txhint{max-width:760px;margin:6px auto 4px}
.tx [contenteditable]{border-radius:6px;padding:2px 6px;margin:-2px -6px;cursor:text;outline:none;transition:background .15s}
.tx [contenteditable]:hover{background:var(--brass-soft)}
.tx [contenteditable]:focus{background:var(--panel);box-shadow:0 0 0 2px #2a5d8f}
.tx [contenteditable]:empty::before{content:"…";color:var(--muted)}
.tx .saving{opacity:.6}
.tx .saved{background:var(--ok-bg)}

/* Text view / Scene view toggle */
.viewtog{display:inline-flex;border:2px solid #2a5d8f;border-radius:999px;padding:2px;margin-right:10px;background:var(--panel)}
.viewtog button{border:0;background:none;padding:6px 14px;border-radius:999px;cursor:pointer;font-weight:600;font-size:14px;color:#2a5d8f}
.viewtog button[aria-pressed="true"]{background:#2a5d8f;color:#fff}

/* Performance view */
.viewtog button{white-space:nowrap}
body.perfmode{background:#0d0d0f;color:#eee}
body.perfmode .top{display:none}
body.perfmode .bar{border-color:#2a2a2e}
body.perfmode .bar .tab,body.perfmode .bar .seg button,body.perfmode .bar>.ctl>span{color:#aaa}
body.perfmode .viewtog{background:#16161a}
.perf{display:flex;flex-direction:column;gap:18px;padding:10px 0 40px}
.pbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:#0d0d0f;padding:10px 0;border-bottom:1px solid #2a2a2e}
.pbar h2{flex:1;margin:0;font-family:var(--f-display);font-size:34px;font-weight:600;color:#fff;min-width:200px}
.pnum{font:600 28px var(--f-mono);color:#e0a458}.pnum small{font-size:13px;color:#888;margin-left:4px}
.pdur{font:14px var(--f-mono);color:#999}
.pclockw{display:flex;align-items:center;gap:6px;font:600 24px var(--f-mono);color:#7fd3a0}
.pbtn{background:#1d1d22;color:#eee;border:1px solid #33333a;border-radius:8px;padding:6px 12px;font-size:16px;cursor:pointer}
.pbtn:hover{background:#2a2a31}.pbtn:disabled{opacity:.3;cursor:default}
.pbtn.big{padding:14px 26px;font-size:18px;font-weight:600}
.pwarn{margin:0;color:#f0a070}
.pcues{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.pcue{background:#17171c;border:1px solid #2c2c33;border-left:4px solid #7fd3a0;border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:6px}
.pcue.todo{border-left-color:#e08a50}
.pcue .ctype{font:600 11px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:#e0a458}
.pcue b{font-weight:500;color:#fff}
.pcue .src{font-size:11px;color:#777;word-break:break-all}.pcue a.src{color:#777}
.pcue .todo{color:#e08a50;font-size:13px}
.pcue audio,.pcue video,.pcue img{width:100%;border-radius:6px}
.pcue .yt{max-width:none}
.pscript{display:flex;flex-direction:column;gap:14px;max-width:1000px}
.pscript.both{max-width:none}
.pl .ptx{display:grid;grid-template-columns:minmax(0,1fr);gap:30px}
.pscript.both .pl .ptx{grid-template-columns:repeat(2,minmax(0,1fr))}
.pl p{margin:0;font-family:var(--f-display);font-size:32px;line-height:1.4;color:#f4f1ea;white-space:pre-wrap}
.pscript.both .pl p[lang="en"]{color:#b9b5ad}
.pl.direction p{font:17px/1.5 var(--f-body);color:#8fa3b0;font-style:italic}
.pl.title p{font-weight:600;color:#e0a458}
.pl.recorded{border-left:4px solid #d9a3c0;padding-left:14px}
.pl.recorded p{color:#e8c3d6}
.ptag{display:block;font:600 11px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:#d9a3c0;margin-bottom:4px}
.pnav{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #2a2a2e;padding-top:18px;margin-top:10px}
.pnext{color:#999;text-align:center}.pnext b{color:#ddd;font-weight:500}
.phelp{color:#666;font-size:13px;margin:0}
@media (max-width:640px){.pl p{font-size:24px}.pscript.both .pl .ptx{grid-template-columns:minmax(0,1fr);gap:4px}.pbar h2{font-size:24px}}
.viewlbl{font-size:12px;color:var(--muted);margin-right:6px;align-self:center}
body.perfmode .bar .tab{display:none}

/* coloured buttons */
.btn.play{background:#2f7d4a;color:#fff;border-color:#2f7d4a;font-weight:600}
.btn.play:hover{background:#266a3e}
.btn.play.on{background:#fff;color:#2f7d4a;box-shadow:inset 0 0 0 2px #2f7d4a}
.btn.recb{background:#c0392b;color:#fff;border-color:#c0392b;font-weight:600}
.btn.recb:hover{background:#a3301f}
.btn.upl{background:#2a5d8f;color:#fff;border-color:#2a5d8f}
.btn.upl:hover{background:#224d77}
.btn.lnk{background:#6b4fa0;color:#fff;border-color:#6b4fa0}
.btn.lnk:hover{background:#5a4288}
.btn.del{background:#fff;color:#c0392b;border-color:#c0392b}
.btn.del:hover{background:#c0392b;color:#fff}
.btn.small.edit{box-shadow:none}
.player{display:inline-flex;align-items:center;gap:8px}
.ptime{font:12px var(--f-mono);color:var(--muted)}
/* narration */
.narrcard{border-color:var(--rec)}
.narrs{display:flex;flex-direction:column;gap:8px}
.narr{border:1px solid var(--line);border-left:4px solid var(--rec);border-radius:8px;padding:9px 12px;display:flex;flex-direction:column;gap:8px}
.narr .nhead{display:flex;justify-content:space-between;align-items:center;gap:8px}
.narr .ntools{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.narrcard .muted{margin:0}
.pcue .ptime{color:#999}

/* scene editor */
.sceneed textarea{font:16px/1.5 var(--f-display);width:100%;resize:vertical}
.sceneed .paras textarea{min-height:240px}
.sceneed label small{color:var(--muted);font-weight:400}
.txs h2{display:flex;align-items:center;gap:10px}
.txs h2 .btn{margin-left:auto}
.sceneed .grid2.paras,.sceneed .grid2:nth-of-type(2){grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:640px){.sceneed .grid2.paras,.sceneed .grid2:nth-of-type(2){grid-template-columns:minmax(0,1fr)}}
/* ---- Spotify, suggestions, offline ---- */
.btn.spbtn{background:#1f7a4d;border-color:#1f7a4d;color:#fff}.btn.spbtn:hover{background:#18633e}
.btn.sugbtn{background:#6b4fa0;border-color:#6b4fa0;color:#fff}.btn.sugbtn:hover{background:#5a4288}
.chip.spchip{background:#1f7a4d;color:#fff;border-color:#1f7a4d}
.chip.needfile{background:#fff4e5;color:#9a4a10;border-color:#e0a458}
.chip.offchip{background:#c0392b;color:#fff;border-color:#c0392b}
.chip.offok{background:#2a5d8f;color:#fff;border-color:#2a5d8f}
.spot{display:flex;align-items:center;gap:10px;padding:6px 0;min-width:0}
.spot img,.spot .spimg{width:44px;height:44px;border-radius:4px;object-fit:cover;flex:none;background:#222;color:#aaa;display:grid;place-items:center}
.spot .spt{display:flex;flex-direction:column;min-width:0;flex:1}
.spot .spt b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spot .spt small{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spot .spa{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.spot .spa select{font-size:13px;padding:4px 6px}
.spemb{width:100%;max-width:520px;border:0;border-radius:12px;display:block}
.spsearch{display:flex;flex-direction:column;gap:6px;width:100%}
.spsearch .spres{display:flex;flex-direction:column;border-top:1px solid var(--line,#ddd)}
.spsearch .spres .spot{border-bottom:1px solid var(--line,#ddd)}
.spline{color:#1f7a4d;margin-top:2px}
.sugg{border:1px solid #c9bde0;background:rgba(107,79,160,.06);border-radius:10px;padding:12px;margin-bottom:12px}
.suggitem{display:flex;flex-direction:column;gap:4px;padding:10px 0;border-bottom:1px solid var(--line,#ddd)}
.suggitem:last-of-type{border-bottom:0}
.pcue .spot .spt small{color:#999}.pcue .spot .spt b{color:#fff}
.pcue .chip.needfile{align-self:flex-start}
/* tablet: Performance view navigation always reachable, bigger targets */
body.perfmode .pnav{position:sticky;bottom:0;background:#0d0d0f;padding-bottom:calc(14px + env(safe-area-inset-bottom));z-index:5}
@media (pointer:coarse){.pbtn{min-width:48px;min-height:48px}.pbtn.big{padding:20px 34px;font-size:22px;flex:1 1 0}.pnav{gap:10px}.pnav .pnext{flex:1 1 100%;order:-1;text-align:center}.pnav{flex-wrap:wrap}}
/* ---- scene edit mode ---- */
.scene.editing .sceneed{border:2px solid #b5651d;box-shadow:0 0 0 4px rgba(181,101,29,.12)}
.edbanner{position:sticky;top:0;z-index:4;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;background:#b5651d;color:#fff;border-radius:8px;padding:10px 14px;margin:-4px -4px 0}
.edbanner b{font-weight:600}
.edbanner .btn.quiet{color:#fff;border-color:rgba(255,255,255,.6);background:transparent}
.edbanner .btn.edsave{background:#fff;color:#b5651d;border-color:#fff;font-weight:600}
.btn.edit[aria-pressed="true"]{box-shadow:inset 0 0 0 2px #fff,0 0 0 2px #b5651d}
.sceneed .edh{margin:6px 0 0;font:600 12px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.sceneed .edh small{font-weight:400;text-transform:none;letter-spacing:0;margin-left:6px}
.sceneed .grid2.one,.sceneed .grid2.paras.one{grid-template-columns:minmax(0,1fr)!important}
.sceneed .lnote{background:rgba(181,101,29,.1);border-radius:6px;padding:8px 10px;margin:0}