:root{--accent:#f5b301;--accent-ink:#1a1400;--ok:#22b765;--warn:#e9a400;--bad:#e5484d;--r:12px;font-size:17px;
  --bg:#f2f2f7;--stagebg:#e4e4e9;--bar:rgba(250,250,252,.92);--panel:#ffffff;--panel2:#f2f2f7;--fill:#e9e9ee;--line:rgba(60,60,67,.16);--text:#111114;--muted:#6c6c74;--tint:#8f5300;--sel:rgba(245,179,1,.18);--shadow:0 12px 40px rgba(0,0,0,.18),0 0 0 .5px rgba(0,0,0,.12);--input:#fff}
[data-theme=dark]{--bg:#0d0f14;--stagebg:#000;--bar:rgba(20,22,28,.92);--panel:#1b1e25;--panel2:#13151b;--fill:#2a2e38;--line:rgba(255,255,255,.12);--text:#eef1f6;--muted:#9aa4b5;--tint:#f5b301;--sel:rgba(245,179,1,.16);--shadow:0 12px 40px rgba(0,0,0,.6),0 0 0 .5px rgba(255,255,255,.1);--input:#0f1218}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}
body{min-height:100dvh}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.boot{padding:40px;text-align:center;color:var(--muted)}
.boot-help{max-width:520px;margin:0 auto;padding:max(28px,env(safe-area-inset-top)) 22px 28px;text-align:left;color:var(--text);line-height:1.45}
.boot-help h1{font-size:1.35rem;margin:8px 0 10px}
.boot-help p{margin:0 0 12px}
.boot-step,.boot-err{font-size:.9rem;background:var(--fill);border-radius:10px;padding:10px 12px;overflow-wrap:anywhere}
.boot-err{color:var(--bad)}
.boot-btns{display:flex;flex-direction:column;gap:10px;margin:18px 0 10px}
.boot-small{font-size:.78rem;color:var(--muted)}
.safe-banner{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:9999;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#fff4c2;color:#3a2c00;border:1px solid #e9c64a;box-shadow:var(--shadow);font-size:.86rem}
.safe-banner span{flex:1}
h1,h2,h3{margin:0 0 .5em;line-height:1.15}
.muted{color:var(--muted)}.small{font-size:.82rem}.strong{font-weight:600}
.hidden{display:none!important}.spacer{flex:1}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45em;min-height:50px;padding:0 20px;border-radius:12px;border:1px solid var(--line);background:var(--panel);font-weight:600;white-space:nowrap;text-decoration:none;color:var(--text)}
.btn:active{transform:scale(.98)}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn.danger{color:var(--bad)}
.btn.ghost{background:transparent;border-color:transparent}
.btn.small{min-height:42px;padding:0 14px;font-size:.88rem}
.btn.wide{width:100%}
.btn[disabled]{opacity:.45;pointer-events:none}
input[type=text],input[type=number],input[type=search],select,textarea{width:100%;min-height:48px;padding:10px 14px;border-radius:10px;border:1px solid var(--line);background:var(--input);font-size:1rem;color:var(--text)}
textarea{min-height:120px}
label{display:block;font-size:.85rem;color:var(--muted);margin:14px 0 6px}
.chip{display:inline-block;padding:2px 9px;border-radius:999px;background:var(--fill);font-size:.78rem;font-weight:600;color:var(--text);white-space:nowrap}
.chip.accent{background:var(--sel);color:var(--tint)}
.dot{width:10px;height:10px;border-radius:50%;background:var(--muted);flex:none;display:inline-block}
.dot.ok{background:var(--ok)}.dot.warn{background:var(--warn)}.dot.bad{background:var(--bad)}.dot.off{background:transparent;border:2px solid var(--muted)}
/* home & join */
.home{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 20px;text-align:center;gap:18px}
.logo{font-size:2.6rem;font-weight:800;letter-spacing:-.02em}.logo span{color:var(--tint)}
.home .choices{display:grid;gap:14px;width:min(520px,100%);margin-top:10px}
.home .choice{min-height:92px;font-size:1.2rem;flex-direction:column;gap:2px}
.home .choice small{font-weight:400;font-size:.8rem;opacity:.8}
.home-theme{width:min(320px,100%)}
.install{max-width:520px;font-size:.85rem}
.join{max-width:620px;margin:0 auto;padding:max(24px,env(safe-area-inset-top)) 20px 40px}
.join .codein{font-size:2rem;letter-spacing:.2em;text-transform:uppercase;font-weight:800}
.instgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:16px}
.instgrid .btn{min-height:68px;flex-direction:column;white-space:normal}
.instgrid .btn[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent)}
/* ===== reader: forScore-style full-screen page ===== */
.reader{position:fixed;inset:0;background:var(--stagebg);overflow:hidden}
.stage{position:absolute;inset:0;touch-action:pan-y pinch-zoom;user-select:none;-webkit-user-select:none}
.pages{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:4px}
.pages canvas{background:#fff;box-shadow:0 1px 6px rgba(0,0,0,.18);max-width:100%;max-height:100%}
[data-theme=dark] .pages canvas{box-shadow:none}
.night canvas{filter:invert(1) hue-rotate(180deg)}
.stage .overlay,.viewer .overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--muted);padding:30px;gap:10px;font-size:1.1rem}
.overlay b{color:var(--text);font-size:1.5rem}
.ovbtns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:10px}
.pagehint{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.6);color:#fff;padding:4px 12px;border-radius:99px;font-size:.82rem;pointer-events:none;opacity:0}
.pagehint.show{animation:hint 1.6s ease}
@keyframes hint{0%,70%{opacity:1}100%{opacity:0}}
.reader.chrome-on .pagehint{opacity:0;animation:none}
.zoneflash{position:absolute;top:0;bottom:0;width:30%;pointer-events:none;opacity:0}
.zoneflash.left{left:0;background:linear-gradient(90deg,rgba(245,179,1,.18),transparent)}.zoneflash.right{right:0;background:linear-gradient(270deg,rgba(245,179,1,.18),transparent)}
.zoneflash.on{animation:zf .35s ease}
@keyframes zf{0%{opacity:1}100%{opacity:0}}
/* title bar */
.titlebar{position:absolute;left:0;right:0;top:0;z-index:10;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;padding:4px 8px;padding-top:max(4px,env(safe-area-inset-top));min-height:54px;background:var(--bar);-webkit-backdrop-filter:saturate(1.6) blur(18px);backdrop-filter:saturate(1.6) blur(18px);border-bottom:.5px solid var(--line);transition:transform .22s ease,opacity .22s ease}
.tb-side{display:flex;align-items:center;gap:2px;min-width:0}.tb-right{justify-content:flex-end}
.tb-center{display:flex;align-items:center;gap:2px;min-width:0;max-width:min(46vw,520px)}
.tbtn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:46px;height:46px;padding:0 8px;border:0;border-radius:10px;background:transparent;color:var(--tint)}
.tbtn.small{min-width:30px;padding:0 2px}
.tbtn:hover{background:var(--fill)}.tbtn.on{background:var(--sel)}
.tbtn:active{opacity:.6}
.ico{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.tbtn.small .ico{width:20px;height:20px}
.tb-title{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;border:0;background:transparent;padding:2px 6px;border-radius:10px;color:var(--text);height:46px}
.tb-title:hover{background:var(--fill)}
.tt{font-weight:700;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.ts{font-size:.75rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.linkpill{border:1px solid var(--line);border-radius:999px;height:38px;padding:0 10px 0 6px;margin-left:4px}
.linkpill .ico{width:22px;height:22px}
.linkpill .lbl{font-size:.8rem;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
/* bottom: seek bar */
.bottombar{position:absolute;left:0;right:0;bottom:0;z-index:10;display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,3fr) minmax(0,1fr);align-items:center;gap:10px;padding:6px 10px;padding-bottom:max(6px,env(safe-area-inset-bottom));min-height:54px;background:var(--bar);-webkit-backdrop-filter:saturate(1.6) blur(18px);backdrop-filter:saturate(1.6) blur(18px);border-top:.5px solid var(--line);transition:transform .22s ease,opacity .22s ease}
.reader:not(.chrome-on) .titlebar{transform:translateY(-110%);opacity:0;pointer-events:none}
.reader:not(.chrome-on) .bottombar{transform:translateY(110%);opacity:0;pointer-events:none}
.songnav{display:flex;align-items:center;gap:4px;min-width:0;height:44px;border:0;background:transparent;color:var(--tint);font-weight:600;font-size:.88rem;border-radius:10px;padding:0 6px}
.songnav span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.songnav.next{justify-content:flex-end}.songnav .ico{width:20px;height:20px}
.songnav[disabled]{visibility:hidden}
.nextlbl{font-size:.82rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right}.nextlbl.left{text-align:left;color:var(--tint);font-weight:600}
.seek{position:relative;height:44px;touch-action:none;cursor:pointer}
.seek-rail{position:absolute;left:14px;right:14px;top:0;bottom:0}
.seek-track{position:absolute;left:0;right:0;top:50%;height:0}
.seek-track i{position:absolute;top:-3px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--muted);opacity:.55}
.seek-knob{position:absolute;top:50%;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.35),0 0 0 .5px rgba(0,0,0,.2);pointer-events:none;transition:left .15s}
.seek-bubble{position:absolute;bottom:52px;width:150px;margin-left:-75px;background:var(--panel);border-radius:12px;box-shadow:var(--shadow);padding:8px;text-align:center;pointer-events:none}
.seek-bubble img{width:100%;display:block;border-radius:4px;background:#fff;min-height:60px}
.seek-lbl{font-size:.8rem;font-weight:600;margin-top:6px}
.seek.empty{visibility:hidden}
/* connection banner (always visible) */
.banner{position:absolute;left:50%;transform:translateX(-50%);top:calc(64px + env(safe-area-inset-top));z-index:12;background:#b45309;color:#fff;padding:8px 16px;border-radius:999px;font-size:.88rem;font-weight:600;box-shadow:var(--shadow);max-width:calc(100% - 24px);text-align:center}
/* popover menus */
.poplayer{position:absolute;inset:0;pointer-events:none;z-index:20}
.popscrim{position:absolute;inset:0;pointer-events:auto;background:rgba(0,0,0,.06)}
.popover{position:absolute;pointer-events:auto;background:var(--panel);border-radius:14px;box-shadow:var(--shadow);display:flex;flex-direction:column;animation:pop .16s ease}
@keyframes pop{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
.poparrow{position:absolute;top:-8px;width:18px;height:18px;margin-left:-9px;background:var(--panel);transform:rotate(45deg);border-radius:3px;box-shadow:-1px -1px 0 .5px var(--line)}
.popinner{position:relative;overflow:auto;border-radius:14px;max-height:inherit;min-height:0;flex:1 1 auto;-webkit-overflow-scrolling:touch;padding-bottom:8px}
.navbar{position:sticky;top:0;z-index:2;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:52px;padding:4px 6px;background:var(--panel);border-bottom:.5px solid var(--line)}
.nb-l,.nb-r{display:flex;align-items:center;gap:2px;min-width:0}.nb-r{justify-content:flex-end}
.nb-t{font-weight:700;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}
.nbtn{display:inline-flex;align-items:center;gap:2px;height:42px;padding:0 8px;border:0;background:transparent;color:var(--tint);font-weight:500;border-radius:8px;white-space:nowrap}
.nbtn .ico{width:22px;height:22px}.nbtn.strong{font-weight:700}
.navbar .tbtn{min-width:42px;height:42px}
.pad{padding:10px 14px 4px}.pad.tight{padding-top:0}
.search{min-height:40px!important;border-radius:10px!important;background:var(--fill)!important;border:0!important;padding:8px 12px!important}
.seg{display:flex;background:var(--fill);border-radius:9px;padding:2px;gap:2px}
.seg button{flex:1;min-height:36px;border:0;border-radius:7px;background:transparent;font-size:.86rem;font-weight:600;color:var(--text);padding:0 8px;white-space:nowrap}
.seg button[aria-checked=true]{background:var(--panel);box-shadow:0 1px 3px rgba(0,0,0,.18)}
[data-theme=dark] .seg button[aria-checked=true]{background:#3a3f4b}
.group{margin-top:10px}
.group-h{padding:8px 16px 6px;font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.cell{display:flex;align-items:center;gap:12px;min-height:54px;padding:6px 10px 6px 16px;position:relative;cursor:default}
.cell[role=button]{cursor:pointer}
.cell[role=button]:active{background:var(--fill)}
.cell+.cell::before,.list-cells>.cell~.cell::before{content:"";position:absolute;top:0;left:16px;right:0;border-top:.5px solid var(--line)}
.cell.current{background:var(--sel)}
.cell.current::after{content:"";position:absolute;left:0;top:6px;bottom:6px;width:4px;border-radius:0 4px 4px 0;background:var(--accent)}
.cell.danger .cell-title{color:var(--bad)}
.cell-lead{flex:none;display:flex;align-items:center;justify-content:center;width:28px;color:var(--tint)}
.cell-lead .ico{width:24px;height:24px}
.cell-main{flex:1;min-width:0}
.cell-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cell-sub{font-size:.78rem;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cell-acc{flex:none;display:flex;align-items:center;gap:2px;color:var(--muted)}
.cell-acc .tbtn{min-width:42px;height:42px}
.cell-acc .ico.chev{width:18px;height:18px;color:var(--muted)}
.cell-acc .ico.chk{color:var(--tint)}
.cell-acc select{width:auto;min-height:38px;padding:4px 8px;font-size:.85rem}
.num{font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
.mini{min-width:40px;height:40px;border:1px solid var(--line);border-radius:9px;background:var(--panel);font-weight:700}
.mini.danger{color:var(--bad)}.mini[disabled]{opacity:.35}
.handle{width:40px!important;height:40px;border-radius:9px;background:var(--fill);color:var(--muted)!important;font-size:1.3rem;cursor:grab;touch-action:none}
.setitem{touch-action:pan-y}
.setitem.dragging{opacity:.9;background:var(--panel);box-shadow:var(--shadow);z-index:3}
.switch{width:50px;height:30px;border-radius:99px;background:var(--fill);position:relative;transition:background .15s;flex:none}
.switch::after{content:"";position:absolute;top:2px;left:2px;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:left .15s}
.switch.on{background:var(--ok)}.switch.on::after{left:22px}
.foot{font-size:.8rem;color:var(--muted);padding:10px 16px;margin:0;line-height:1.4}
.joinbox{display:flex;align-items:center;gap:14px;padding:6px 16px;flex-wrap:wrap}
.code{font-size:2.6rem;font-weight:800;letter-spacing:.16em;color:var(--tint);font-variant-numeric:tabular-nums}
.qr{background:#fff;border-radius:10px;padding:6px;display:inline-block}
.qr img{display:block;width:132px;height:132px;image-rendering:pixelated}
.progress{height:8px;background:var(--fill);border-radius:99px;overflow:hidden;margin-top:12px}
.progress>i{display:block;height:100%;background:var(--accent);width:3%;transition:width .2s}
/* band status screen */
.bandfull-h{display:flex;align-items:center;gap:12px;margin-bottom:14px}.bandfull-h h2{margin:0}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.tile{border-radius:14px;padding:14px;background:var(--panel2);border:1px solid var(--line)}
.tile.bad{border-color:var(--bad)}.tile.warn{border-color:var(--warn)}
.tile-h{display:flex;align-items:center;gap:8px;font-size:1.05rem}.tile-i{color:var(--tint);font-weight:700;margin-top:4px}
.tile-s{font-size:.82rem;color:var(--muted);margin-top:6px}.tile-p{font-size:.82rem;margin-top:4px}
/* modal (song editor, imports, doubles) */
.modal-back{position:fixed;inset:0;background:rgba(0,0,0,.4);display:flex;align-items:flex-start;justify-content:center;z-index:50;padding:max(20px,env(safe-area-inset-top)) 12px 20px;overflow:auto}
.modal{background:var(--panel);border-radius:16px;width:min(720px,100%);padding:20px;box-shadow:var(--shadow)}
.modal.wide{width:min(1100px,100%)}
.modal .actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:18px}
.modal h2{display:flex;align-items:center;gap:10px}
.modal .toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.modal .list{display:flex;flex-direction:column;gap:8px}
.modal .row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:var(--panel2);border:1px solid var(--line)}
.modal .row .main{flex:1;min-width:0}.modal .row .title{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.modal .row .meta{color:var(--muted);font-size:.8rem;margin-top:3px}
.card{background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:16px}
.partrow{display:grid;grid-template-columns:1fr 1.2fr auto auto;gap:8px;align-items:center;margin-top:8px}
.partrow .fname{font-size:.8rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.check{display:flex;align-items:center;gap:12px;min-height:50px;padding:6px 12px;border-radius:10px;border:1px solid transparent;background:transparent}
.check input{width:22px;height:22px;accent-color:var(--accent)}
.viewer{height:70vh;position:relative;background:var(--stagebg);border-radius:12px;overflow:hidden}
.viewer .pagehint{opacity:1}
#toast{position:fixed;left:50%;top:calc(70px + env(safe-area-inset-top));transform:translate(-50%,-20px);background:rgba(28,28,32,.92);color:#fff;padding:10px 18px;border-radius:999px;font-size:.92rem;font-weight:600;opacity:0;pointer-events:none;transition:.2s;z-index:100;max-width:calc(100% - 24px);text-align:center}
#toast.show{opacity:1;transform:translate(-50%,0)}
@media (max-width:700px){
  .titlebar{grid-template-columns:auto 1fr auto;padding-left:2px;padding-right:2px}
  .tbtn{min-width:40px;padding:0 4px}.ico{width:24px;height:24px}
  .tb-center{max-width:none}.tb-center>.tbtn:first-child{display:none}
  .linkpill .lbl{display:none}
  .bottombar{grid-template-columns:auto 1fr auto}.songnav span,.nextlbl{max-width:22vw}
}

/* phones: give the song title room — search lives at the top of the Scores panel, the title itself opens the song menu */
@media (max-width:440px){
  .titlebar{gap:2px;padding-left:max(2px,env(safe-area-inset-left));padding-right:max(4px,env(safe-area-inset-right))}
  .tb-left>.tbtn,.tb-right>.tbtn{min-width:38px;padding:0 2px}
  .tb-center>.tbtn.small{display:none}
  .tb-title{padding:2px 2px;align-items:center}
  .linkpill{margin-left:0;padding:0 6px 0 4px}
}
.cell.wrap .cell-title,.cell.wrap .cell-sub{white-space:normal}

/* ---------- v3: library organising ---------- */
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips.browse{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:6px;mask-image:linear-gradient(90deg,#000 92%,transparent)}
.chips.browse::-webkit-scrollbar{display:none}
.chipbtn{flex:none;min-height:36px;padding:0 13px;border-radius:999px;border:0;background:var(--fill);font-size:.86rem;font-weight:600;color:var(--text);white-space:nowrap}
.chipbtn[aria-checked=true]{background:var(--accent);color:var(--accent-ink)}
.pad.tight{padding-top:4px}
.navbar .nbtn.on{color:var(--text)}
.ico.fico.tinted{fill:currentColor;fill-opacity:.22}
.ico.fico.dim{opacity:.45}
.selico{color:var(--muted)}
.selcell.picked .selico{color:var(--accent)}
.ico .fillc{fill:currentColor;stroke:currentColor}
.ico .onfill{stroke:var(--panel);stroke-width:2.2}
.selcell.picked{background:var(--sel)}
.grip{display:inline-flex;align-items:center;justify-content:center;width:40px;height:44px;color:var(--muted);touch-action:none;cursor:grab;border-radius:8px}
.grip:active{cursor:grabbing;background:var(--fill)}
.grip .ico{width:22px;height:22px}
.dragghost{position:fixed;z-index:200;pointer-events:none;display:flex;align-items:center;gap:8px;max-width:280px;padding:8px 14px;border-radius:12px;background:var(--panel);color:var(--text);font-weight:600;box-shadow:var(--shadow);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dragghost .ico{width:20px;height:20px;color:var(--tint)}
.dropover{background:var(--sel)!important;outline:2px dashed var(--accent);outline-offset:-3px}
.selbar{position:sticky;bottom:-8px;z-index:3;background:var(--panel);border-top:.5px solid var(--line);padding:8px 10px 12px;box-shadow:0 -6px 16px rgba(0,0,0,.06)}
.selcount{font-size:.8rem;font-weight:600;color:var(--muted);padding:0 4px 6px}
.selbtns{display:flex;flex-wrap:wrap;gap:6px}
.selbtn{display:inline-flex;align-items:center;gap:5px;min-height:38px;padding:0 10px;border:0;border-radius:9px;background:var(--fill);font-size:.82rem;font-weight:600;color:var(--tint)}
.selbtn .ico{width:18px;height:18px}
.selbtn.danger{color:var(--bad)}
.selbtn:disabled{opacity:.4}
.swatches{display:flex;flex-wrap:wrap;gap:8px}
.swatch{width:34px;height:34px;border-radius:50%;border:2px solid var(--line);background:var(--fill);padding:0;display:inline-flex;align-items:center;justify-content:center;color:var(--tint)}
.swatch.on{border-color:var(--text);box-shadow:0 0 0 2px var(--panel) inset}
.swatch.ic{border-radius:10px}.swatch.ic .ico{width:20px;height:20px}
.ftree{display:flex;flex-direction:column;gap:2px;max-height:60vh;overflow:auto}
.frow{display:flex;align-items:center;gap:6px;padding-right:4px}
.fpick{flex:1;display:flex;align-items:center;gap:10px;min-height:46px;padding:0 10px;border:0;border-radius:10px;background:transparent;text-align:left;font-weight:600}
.fpick:hover{background:var(--fill)}.fpick:disabled{opacity:.4}
.fpick .ico{width:22px;height:22px;color:var(--tint)}
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:4px 12px}
.fchips{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.chip.fchip{display:inline-flex;align-items:center;gap:6px;padding:4px 4px 4px 10px;font-size:.84rem}
.chip.fchip .ico{width:16px;height:16px;color:var(--tint)}
.chipx{border:0;background:transparent;width:26px;height:26px;border-radius:50%;font-size:1rem;color:var(--muted)}
.stars{display:flex;gap:2px}
.star{border:0;background:transparent;font-size:1.6rem;line-height:1;width:40px;height:44px;color:var(--fill);-webkit-text-stroke:1px var(--muted)}
.star.on{color:var(--accent);-webkit-text-stroke:0}
.modal textarea[rows="2"]{min-height:72px}
.nbtn .nbl{max-width:140px;overflow:hidden;text-overflow:ellipsis}

.popdone{display:none}
@media (max-width:600px){
  .popdone{display:block;flex:none;margin:0;border:0;border-top:.5px solid var(--line);border-radius:0 0 14px 14px;background:var(--panel);color:var(--tint);font-weight:700;font-size:1rem;min-height:50px;width:100%}
  .popinner{border-radius:14px 14px 0 0}
}

/* ===================== v4: forScore-faithful chrome & menus ===================== */
.tbpill{display:flex;align-items:center;gap:0;border-radius:14px;background:var(--fill);padding:1px}
[data-theme=dark] .tbpill{background:rgba(255,255,255,.07)}
.tbpill .tbtn{min-width:42px;height:42px;border-radius:12px}
.tb-right{gap:6px}
.tb-chev .ico{width:18px;height:18px}
.reader.seek-pin:not(.chrome-on) .bottombar{transform:none;opacity:1;pointer-events:auto}
.stage.sepia canvas{filter:sepia(.42) saturate(1.15) brightness(.98)}
/* key chips (one song in several concert keys) */
.keychips{grid-column:1/-1;display:flex;justify-content:center;gap:6px;flex-wrap:wrap;padding:0 0 2px}
.kchip{min-height:34px;min-width:52px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:var(--panel);font-weight:700;font-size:.92rem;color:var(--text)}
.kchip[aria-checked=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.nextlbl.warnlbl{color:var(--bad);font-weight:600}
/* popup menu */
.pmenu-back{position:fixed;inset:0;z-index:80}
.pmenu{position:fixed;background:var(--panel);border-radius:14px;box-shadow:var(--shadow);padding:6px 0;overflow:auto;animation:pop .14s ease;max-height:calc(100dvh - 16px)}
.pm-title{padding:8px 16px 6px;font-size:.8rem;color:var(--muted);font-weight:600}
.pm-h{padding:8px 16px 4px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.pm-sep{height:6px;background:var(--panel2);margin:5px 0}
.pm-item{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;padding:0 14px 0 6px;border:0;background:transparent;text-align:left;font-size:.98rem;color:var(--text)}
.pm-item:active,.pm-item:hover{background:var(--fill)}
.pm-item[disabled]{opacity:.38}
.pm-item.danger{color:var(--bad)}.pm-item.orange{color:#e8590c}
.pm-chk{width:22px;flex:none;display:flex;justify-content:center;color:var(--tint)}.pm-chk .ico{width:18px;height:18px}
.pm-l{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pm-item>.ico{width:20px;height:20px;color:var(--muted);flex:none}
/* nav bar buttons: ⋯ and ≡ in a pill, like forScore 15 */
.nbpill{display:flex;align-items:center;border-radius:999px;background:var(--fill);padding:1px}
.nbi{display:inline-flex;align-items:center;justify-content:center;width:40px;height:38px;border:0;background:transparent;border-radius:999px;color:var(--tint)}
.nbi .ico{width:22px;height:22px}.nbi.small{width:34px;height:34px}
.nbi.red{color:#fff;background:var(--bad)}
.nbi.okbtn{background:#0a84ff;color:#fff;margin-left:2px}
.navbar{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
/* content bar */
.cbar{display:flex;gap:2px;margin:8px 10px 4px;padding:2px;border-radius:12px;background:var(--fill);overflow-x:auto;scrollbar-width:none}
.cbar::-webkit-scrollbar{display:none}
.cbar-b{flex:1 0 auto;min-width:42px;height:38px;display:flex;align-items:center;justify-content:center;border:0;border-radius:10px;background:transparent;color:var(--muted)}
.cbar-b .ico{width:22px;height:22px}
.cbar-l{display:none}
.cbar-b[aria-selected=true]{background:var(--panel);color:var(--tint);box-shadow:0 1px 3px rgba(0,0,0,.16)}
.cbar-sep{flex:none;width:1px;margin:8px 3px;background:var(--line)}
.findrow{display:flex;align-items:center;gap:6px;margin:6px 10px 4px;padding:0 10px;border-radius:10px;background:var(--fill);color:var(--muted)}
.findrow .ico{width:18px;height:18px;flex:none}
.findrow .find{border:0;background:transparent;min-height:38px;padding:4px 0;font-size:.98rem}
.findrow .find:focus{outline:none}
.filterchip{display:flex;align-items:center;gap:6px;margin:4px 10px;padding:4px 4px 4px 10px;border-radius:10px;background:var(--sel);color:var(--tint);font-size:.85rem;font-weight:600}
.filterchip span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filterchip .ico{width:18px;height:18px}
.editbar{margin:6px 10px 0;padding:8px 12px;border-radius:10px;background:var(--panel2);font-size:.82rem;color:var(--muted)}
/* rows */
.fslist{position:relative}
.cell.srow{padding:0;overflow:hidden;align-items:stretch}
.srow>.rfg{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:6px 6px 6px 16px;background:var(--panel);position:relative;z-index:1;transition:transform .18s}
.srow.swiping>.rfg{transition:none}
.srow.swiped>.rfg{transform:translateX(calc(-96px * var(--nact, 1)))}
.srow.current>.rfg{background:var(--sel)}
.srow.sel>.rfg{background:var(--sel)}
.swipe-acts{position:absolute;right:0;top:0;bottom:0;display:flex;z-index:0}
.swa{border:0;min-width:96px;color:#fff;font-weight:700;font-size:.92rem}
.swa.red{background:var(--bad)}.swa.orange{background:#e8590c}
.cell-meta{display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:3px;font-size:.74rem;color:var(--muted);font-variant-numeric:tabular-nums}
.cell-meta .ml-r{color:#d99a00}.cell-meta .ml-k{font-weight:700;color:var(--text)}
.ibtn-i{flex:none;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:0;background:transparent;color:var(--tint);border-radius:50%}
.ibtn-i .ico{width:24px;height:24px}
.selc{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;border:2px solid var(--muted);flex:none}
.selc.on{background:#0a84ff;border-color:#0a84ff;color:#fff}.selc .ico{width:16px;height:16px;stroke-width:3}
.ribbon-i{color:#e5484d;display:flex}.ribbon-i .ico{width:20px;height:20px}
.handle{display:inline-flex;align-items:center;justify-content:center;width:40px;height:42px;color:var(--muted);touch-action:none;cursor:grab}
.sech{position:sticky;top:52px;z-index:2;padding:4px 16px;font-size:.78rem;font-weight:700;color:var(--muted);background:var(--panel2);border-top:.5px solid var(--line)}
.idx-wrap{position:sticky;top:60px;height:0;z-index:4}
.idx{position:absolute;right:1px;top:0;display:flex;flex-direction:column;align-items:center;max-height:calc(100dvh - 240px);overflow:hidden}
.idx button{border:0;background:transparent;color:var(--tint);font-size:.66rem;font-weight:700;line-height:1;padding:2px 4px;min-width:20px}
.fslist .srow>.rfg{padding-right:24px}
/* grid layout */
.fslist.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;padding:10px 12px}
.fslist.grid>.sech,.fslist.grid>.idx-wrap{display:none}
.gcell{position:relative;border-radius:12px;background:var(--panel2);overflow:hidden;cursor:pointer;border:1px solid var(--line)}
.gcell.current,.gcell.sel{outline:3px solid var(--accent)}
.gimgw{position:relative;aspect-ratio:1/0.82;background:#fff;overflow:hidden}
.gthumb{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.gimgw .selc{position:absolute;right:8px;bottom:8px;background:rgba(255,255,255,.8)}
.gtxt{padding:8px 34px 8px 10px}.gtxt .cell-title{font-size:.88rem}
.gcell .ibtn-i{position:absolute;right:0;bottom:2px;width:36px;height:36px}
/* full-screen sheets (metadata panel, setlist editor) */
.sheet-back{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;padding:max(10px,env(safe-area-inset-top)) 10px max(10px,env(safe-area-inset-bottom))}
.sheet{width:min(860px,100%);height:min(760px,100%);background:var(--panel);border-radius:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden;animation:pop .16s ease}
.sheet-h{flex:none;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:6px;min-height:56px;padding:6px 10px;border-bottom:.5px solid var(--line)}
.sheet-t{text-align:center;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sheet-m{flex:1;min-height:0;display:flex}
.sheet-tabs{flex:none;width:190px;padding:10px 8px;border-right:.5px solid var(--line);background:var(--panel2);display:flex;flex-direction:column;gap:2px}
.stab{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 10px;border:0;border-radius:10px;background:transparent;color:var(--text);font-weight:600;text-align:left}
.stab .ico{width:22px;height:22px;color:var(--tint)}
.stab.on{background:var(--sel)}
.sheet-b{flex:1;min-width:0;overflow:auto;padding:6px 0 24px;-webkit-overflow-scrolling:touch}
.mthumb{display:flex;align-items:center;justify-content:center;gap:6px;padding:12px}
.mthumb-c{display:flex;flex-direction:column;align-items:center;gap:6px}
.mcanvas{width:150px;max-height:200px;object-fit:contain;background:#fff;border-radius:6px;box-shadow:0 1px 6px rgba(0,0,0,.2)}
.mthumb.stack{flex-direction:column;gap:4px;text-align:center;padding:16px}
.mfields{border-top:.5px solid var(--line)}
.mrow{display:grid;grid-template-columns:34px 128px 1fr;align-items:center;gap:6px;min-height:52px;padding:4px 12px 4px 8px;border-bottom:.5px solid var(--line)}
.mrow.area{align-items:start;padding-top:10px}
.mbox{width:26px;height:26px;border-radius:7px;border:2px solid var(--line);background:transparent;display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;padding:0}
.mbox.set,.mbox.add{background:#0a84ff;border-color:#0a84ff}.mbox .ico{width:16px;height:16px;stroke-width:3}
.mlabel{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:.9rem;font-weight:600;min-width:0}
.mlabel .ico{width:20px;height:20px;color:var(--tint);flex:none}
.mctl{min-width:0}
.minput{display:flex;align-items:center;gap:4px}
.minput input{min-height:42px;border-color:transparent;background:var(--panel2)}
.mctl textarea{min-height:64px;background:var(--panel2);border-color:transparent}
.sugg{display:flex;gap:6px;overflow-x:auto;padding:6px 0 2px}.sugg .chipbtn{min-height:32px}
.starsel,.diffsel{display:flex;align-items:center;gap:4px}
.starsel .star{border:0;background:transparent;font-size:1.5rem;color:var(--line);padding:0 2px;line-height:1}
.starsel .star.on{color:#f5b301}
.dot3{width:22px;height:22px;border-radius:50%;border:2px solid var(--tint);background:transparent;margin-right:2px}
.dot3.on{background:var(--tint)}
.clr{border:0;background:var(--fill);width:28px;height:28px;border-radius:50%;color:var(--muted);margin-left:6px}
.keyro{display:flex;align-items:center;gap:8px;font-weight:700}
.keyhead{display:flex;align-items:center;gap:10px}
.boxed{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.swatches{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}
.swatch{width:38px;height:38px;border-radius:50%;border:2px solid var(--line);background:var(--fill)}.swatch.on{outline:3px solid var(--text);outline-offset:2px}
.wrapchips{padding:6px 14px;max-height:40vh;overflow:auto}
.pad0{padding:6px 0}
/* setlist editor */
.sheet.se{width:min(1100px,100%);height:min(900px,100%)}
.se-tabs{display:none}
.se-body{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr}
.se-left,.se-right{overflow:auto;min-width:0;-webkit-overflow-scrolling:touch}
.se-left{border-right:.5px solid var(--line);background:var(--panel2)}
.se-h{position:sticky;top:0;z-index:3;display:flex;align-items:center;gap:8px;min-height:48px;padding:4px 12px;background:inherit;border-bottom:.5px solid var(--line)}
.se-left .se-h{background:var(--panel2)}.se-right .se-h{background:var(--panel)}
.se-left .cell{background:var(--panel2)}
.rm{border:0;background:transparent;color:var(--bad);width:36px;height:36px;display:flex;align-items:center;justify-content:center;margin-left:8px}
.rm .ico{width:22px;height:22px}
.pulse>.cell-main{animation:pulse 1s ease-in-out infinite}
@keyframes pulse{50%{opacity:.35}}
.cell.pulse{background:var(--sel)!important}
.slhead{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 16px;color:var(--muted);font-size:.84rem}
/* display options tiles */
.dtiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:12px}
.dtile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:78px;border-radius:14px;border:1px solid var(--line);background:var(--panel2);color:var(--text);font-size:.78rem;font-weight:600;text-align:center;padding:6px}
.dtile .ico{width:26px;height:26px;color:var(--muted)}
.dtile.on{background:var(--sel);border-color:var(--accent)}.dtile.on .ico{color:var(--tint)}
/* metronome & pitch pipe */
.metro{display:flex;flex-direction:column;gap:12px;padding:12px 16px}
.metro-bpm{display:flex;align-items:center;justify-content:space-between}
.metro-bpm>div{display:flex;flex-direction:column;align-items:center}
.metro-bpm b{font-size:2.6rem;font-variant-numeric:tabular-nums;line-height:1}
.mbtn{width:56px;height:56px;border-radius:50%;border:1px solid var(--line);background:var(--panel2);font-size:1.6rem;font-weight:700;color:var(--tint)}
.metro input[type=range]{width:100%;min-height:30px;accent-color:var(--accent);padding:0}
.metro-beats{display:flex;justify-content:center;gap:10px}
.beat{width:16px;height:16px;border-radius:50%;background:var(--fill);transition:background .05s}
.beat.on{background:var(--tint)}.beat.one.on{background:var(--bad)}
.metro-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.pitchgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:6px 16px 14px}
.pnote{min-height:56px;border-radius:12px;border:1px solid var(--line);background:var(--panel2);font-size:1.1rem;font-weight:700;color:var(--text)}
.pnote:active{background:var(--sel)}
@media (max-width:700px){
  .tb-center>.tbtn:first-child{display:none}
  .tbpill .tbtn{min-width:38px;height:40px;padding:0 2px}
  .sheet-back{padding:0}
  .sheet,.sheet.se{width:100%;height:100%;border-radius:0}
  .sheet-m{flex-direction:column-reverse}
  .sheet-tabs{width:auto;flex-direction:row;border-right:0;border-top:.5px solid var(--line);padding:4px 4px max(4px,env(safe-area-inset-bottom))}
  .stab{flex:1;flex-direction:column;gap:2px;font-size:.66rem;min-height:50px;padding:2px;justify-content:center}
  .mrow{grid-template-columns:30px 104px 1fr;padding-right:8px}
  .se-tabs{display:flex;border-bottom:.5px solid var(--line)}
  .se-tabs .stab{flex-direction:row;font-size:.85rem}
  .se-body{display:block;overflow:hidden}
  .se-left,.se-right{height:100%}
  .sheet.se[data-tab=lib] .se-left,.sheet.se[data-tab=set] .se-right{display:none}
  .dtiles{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:480px){
  .mrow{grid-template-columns:28px 1fr;grid-template-areas:"b l" "c c"}
  .mrow>.mbox{grid-area:b}.mrow>.mlabel{grid-area:l}.mrow>.mctl{grid-area:c}
}
@media (max-width:440px){
  .tb-right{gap:3px}
  .tbpill .tbtn{min-width:35px}
  .tb-center>.tbtn.tb-chev{display:inline-flex;min-width:24px}
  .tb-left,.tb-right{flex:none}
}

/* title-bar buttons stay tappable while a menu is open: tapping another one switches menus, like forScore */
.reader .titlebar{z-index:25}
.navbar.nb-large{border-bottom:0;min-height:46px}
.ltitle{margin:0;padding:0 16px 4px;font-size:1.75rem;font-weight:800;letter-spacing:-.01em}
.ptoolbar{position:sticky;bottom:-8px;z-index:3;display:flex;justify-content:center;gap:28px;padding:4px 0 6px;margin-top:8px;background:var(--panel);border-top:.5px solid var(--line)}

/* ---- v5: import / backup / export ---- */
.modal h3{font-size:15px;margin:18px 0 6px}
.modal .actions .spacer{flex:1}
.modal .btn .ico{width:18px;height:18px;vertical-align:-4px}
.modal ol.steps,.modal ul.steps{margin:8px 0 4px;padding-left:22px;line-height:1.45}
.modal ol.steps li,.modal ul.steps li{margin:4px 0}
.modal input[type=url]{width:100%;margin-top:12px}
.modal .row0{display:flex;gap:8px;align-items:center}
.modal .row0 input{margin-top:0;flex:1;min-width:0}
.modal .cell{border-radius:12px;background:var(--panel2);border:1px solid var(--line)}
.checkgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;margin-top:6px}
.checkrow{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:var(--panel2);border:1px solid var(--line);font-size:15px;cursor:pointer}
.checkrow input{width:20px;height:20px;margin:0;accent-color:var(--accent)}
.modal .seg{margin:6px 0 10px}
.bkbar{position:fixed;left:50%;transform:translateX(-50%);bottom:max(16px,env(safe-area-inset-bottom));z-index:45;display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:center;background:var(--panel);color:var(--text);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:14px;padding:10px 14px;max-width:calc(100vw - 24px);font-size:15px}
body.dropping::after{content:"Drop PDFs, a folder, a .zip or a forScore .4sb to import";position:fixed;inset:12px;border:3px dashed var(--accent);border-radius:20px;background:rgba(0,0,0,.35);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:600;z-index:80;pointer-events:none;text-align:center;padding:20px}
@media (max-width:480px){.modal{padding:16px}.modal .actions .btn{flex:1 1 auto}.checkgrid{grid-template-columns:1fr 1fr}}
.modal input[type=url]{min-height:46px;padding:0 12px;border-radius:10px;border:1px solid var(--line);background:var(--input,var(--panel2));color:var(--text);font-size:16px;box-sizing:border-box}

/* ---- v5: play score ---- */
.playbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(max(10px,env(safe-area-inset-bottom)) + 64px);z-index:40;width:min(760px,calc(100vw - 16px));background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:10px 12px 8px;display:flex;flex-direction:column;gap:8px}
.playbar .pb-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.playbar .pbtn{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--panel2);display:inline-flex;align-items:center;justify-content:center;color:var(--text);flex:none}
.playbar .pbtn.big{width:52px;height:52px;background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.playbar .pbtn .ico{width:22px;height:22px}
.playbar .pbtn.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.playbar .pb-title{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.2}
.playbar .pb-title b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.playbar .pb-title span{color:var(--muted);font-size:14px;font-variant-numeric:tabular-nums}
.playbar .pb-ctl{font-size:14px}
.playbar .pb-speed{display:flex;align-items:center;gap:8px;flex:1 1 220px;min-width:200px}
.playbar .pb-speed input{flex:1;accent-color:var(--accent)}
.playbar .pb-bpm{min-width:64px;text-align:right;font-variant-numeric:tabular-nums}
.playbar select{min-height:38px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);color:var(--text);padding:0 8px;font-size:15px}
.playbar .pb-ci{display:flex;align-items:center;gap:6px}
.playbar .btn.small{min-height:38px}
.playbar .btn.on{background:var(--accent);color:var(--accent-ink)}
.playbar .pchip{min-height:34px;padding:0 10px;border-radius:99px;border:1px solid var(--line);background:var(--panel2);color:var(--muted);font-size:13px}
.playbar .pchip.on{color:var(--text);border-color:var(--accent)}
.playbar .pb-strip{display:flex;gap:4px;overflow-x:auto;padding:2px 0 4px;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}
.playbar .pbar{flex:none;min-width:34px;height:30px;border-radius:7px;border:1px solid var(--line);background:var(--panel2);color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}
.playbar .pbar.inr{background:var(--sel,rgba(0,122,255,.15));color:var(--text)}
.playbar .pbar.cur{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700}
.playbar .pb-note{font-size:12px;color:var(--muted)}
@media (max-width:480px){.playbar{bottom:calc(max(8px,env(safe-area-inset-bottom)) + 56px);padding:8px}.playbar .pb-speed{flex-basis:100%}}
.playbar select{width:auto;flex:none}
@media (max-width:480px){.playbar .pb-title b{font-size:15px}.playbar .pbtn.big{width:46px;height:46px}}

/* v6: reading notes from the PDF */
.rn-prog{height:8px;border-radius:4px;background:var(--line, #e5e5ea);overflow:hidden;margin:14px 0 6px}
.rn-fill{height:100%;width:4%;background:var(--accent, #0a84ff);transition:width .2s}
.rn-lbl{font-size:13px;color:var(--muted)}
.playbar .pb-mr{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.playbar .pb-mr span{flex:1 1 200px}

/* v6: Links (forScore's Links) */
.lk-layer{position:absolute;inset:0;pointer-events:none;z-index:3}
.lk-from{position:absolute;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:2px solid #fff;background:rgba(10,132,255,.88);color:#fff;display:flex;align-items:center;justify-content:center;pointer-events:auto;box-shadow:0 1px 5px rgba(0,0,0,.35);padding:0;cursor:pointer}
.lk-from svg{width:18px;height:18px;stroke:#fff}
.lk-from.edit{background:rgba(10,132,255,.95)}
.lk-from.pending{animation:lkpulse 1s ease-in-out infinite;background:rgba(255,149,0,.95);pointer-events:none}
.lk-to{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:3px dashed rgba(10,132,255,.9);background:rgba(10,132,255,.12)}
.lk-n{position:absolute;right:-8px;top:-8px;min-width:16px;height:16px;border-radius:8px;background:#1c1c1e;color:#fff;font-size:10px;line-height:16px;text-align:center;font-weight:700;padding:0 3px}
.lk-target{position:absolute;width:60px;height:60px;margin:-30px 0 0 -30px;border-radius:50%;border:4px solid rgba(10,132,255,.9);animation:lktarget 1.5s ease-out forwards}
.lk-back{position:absolute;left:14px;bottom:calc(56px + env(safe-area-inset-bottom, 0px));pointer-events:auto;display:flex;align-items:center;gap:6px;background:rgba(10,132,255,.95);color:#fff;border:0;border-radius:99px;padding:9px 14px 9px 10px;font-size:.92rem;font-weight:600;box-shadow:0 2px 10px rgba(0,0,0,.3)}
.lk-back svg{width:18px;height:18px;stroke:#fff}
.lk-capture{position:absolute;inset:0;z-index:4;cursor:crosshair;background:rgba(10,132,255,.04)}
.lk-banner{position:absolute;left:50%;bottom:calc(12px + env(safe-area-inset-bottom, 0px));transform:translateX(-50%);z-index:5;width:min(560px,calc(100% - 20px));background:var(--panel, #fff);color:var(--text, #000);border-radius:14px;box-shadow:0 4px 18px rgba(0,0,0,.25);padding:10px 12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.lk-msg{flex:1 1 220px;display:flex;flex-direction:column;font-size:.86rem;gap:2px}
.lk-msg b{font-size:.98rem}
.lk-acts{display:flex;align-items:center;gap:6px;margin-left:auto}
.lk-pg{font-size:.82rem;color:var(--muted);min-width:44px;text-align:center}
@keyframes lkpulse{50%{transform:scale(1.15)}}
@keyframes lktarget{0%{transform:scale(.3);opacity:1}100%{transform:scale(1.4);opacity:0}}

/* ---------- v7: customisable toolbar, settings, current-setlist drawer ---------- */
.tbpill[hidden]{display:none}
.tb-side .tbpill{flex:none}
.tbtn:disabled{opacity:.35}
.tb-more .ico{width:24px;height:24px}
.edgezone{position:absolute;left:0;top:64px;bottom:64px;width:22px;z-index:6;touch-action:none;background:transparent}
.edgezone.off{display:none}
.drawer-back{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,0);transition:background .2s}
.drawer-back.open{background:rgba(0,0,0,.28)}
.drawer{position:absolute;left:0;top:0;bottom:0;width:min(380px,88vw);background:var(--panel);box-shadow:4px 0 28px rgba(0,0,0,.22);transform:translateX(-102%);transition:transform .22s ease;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left)}
.drawer-back.open .drawer{transform:none}
.dr-head{display:flex;align-items:center;gap:8px;padding:10px 8px 8px 16px;border-bottom:.5px solid var(--line)}
.dr-t{flex:1;min-width:0;display:flex;flex-direction:column}
.dr-t small{color:var(--muted);font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.dr-t b{font-size:1.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dr-note{padding:8px 16px 4px;margin:0}
.dr-list{flex:1;overflow:auto;padding-bottom:max(12px,env(safe-area-inset-bottom))}
.dr-row{cursor:pointer}
.lp-tag{display:inline-block;margin-top:2px;font-size:.74rem;font-weight:700;color:var(--tint);text-transform:uppercase;letter-spacing:.03em}
.ss-head{display:flex;flex-direction:column;gap:2px;padding:10px 16px 4px}
.ss-head b{font-size:1.15rem}
.ss-head span{color:var(--muted);font-size:.9rem}
.ss-head small{color:var(--muted);font-size:.78rem}
.stepper{display:flex;gap:6px}
.stepper .mbtn{width:40px;height:36px;border-radius:10px;border:1px solid var(--line);background:var(--fill);font-size:1.25rem;color:var(--text)}
.keychips.inpanel{position:static;display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-start;padding:0;background:none;box-shadow:none;transform:none}
.as-lbl{font-size:.82rem;color:var(--muted);font-weight:600;margin:0 2px 6px}
.as-sel{width:100%;height:40px;border-radius:10px;border:1px solid var(--line);background:var(--fill);color:var(--text);padding:0 10px;font-size:1rem}
.tbe-note{padding:8px 16px 2px}
.ico.inl{width:16px;height:16px;vertical-align:-3px}
.tbe-row{gap:6px;align-items:center;touch-action:pan-y}
.tbe-row .cell-lead .ico{color:var(--tint)}
.tbe-ic{flex:none;width:38px;height:38px;border:0;background:transparent;color:var(--tint);border-radius:10px;display:inline-flex;align-items:center;justify-content:center}
.tbe-ic.danger{color:#e5484d}
.tbe-ic:hover{background:var(--fill)}
.tbe-handle{flex:none;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;color:var(--muted);touch-action:none;cursor:grab}
.tbe-row.dragging{position:relative;z-index:3;background:var(--panel);box-shadow:0 6px 18px rgba(0,0,0,.18);transition:none}
.tbe-list .tbe-row:not(.dragging){transition:transform .15s}
.tbe-add{display:flex;gap:6px;flex:none}
.tbe-add .btn.small{padding:6px 10px;min-height:34px}
@media (max-width:440px){.tbe-add{flex-direction:column;gap:4px}}
@media (max-width:440px){
  .tbpill .tbtn{min-width:33px;padding:0 1px}
  .tbpill .tbtn .ico{width:23px;height:23px}
  .tb-right{gap:2px}
}
.drawer,.drawer-back{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.srow.current>.rfg,.srow.sel>.rfg{background:linear-gradient(var(--sel),var(--sel)),var(--panel)}

/* v7.1: no previous/next song at the bottom — the seek bar takes the width */
.bottombar.nosongnav{grid-template-columns:minmax(0,1fr)}
.bottombar.nosongnav.partonly{grid-template-columns:minmax(0,auto) minmax(0,1fr)}
.bottombar.nosongnav.partonly .nextlbl.left{max-width:28vw}

/* v7.1: swipe-to-delete rows — the actions stay hidden until the row moves */
.srow:not(.swiping):not(.swiped)>.swipe-acts{visibility:hidden}
.srow{touch-action:pan-y}
#toast.withbtn{pointer-events:auto;display:flex;align-items:center;gap:10px;padding-right:8px}
.toast-undo{border:0;background:rgba(255,255,255,.18);color:#ffd27a;font-weight:700;border-radius:999px;padding:6px 12px;font-size:.9rem}
/* v7.1: score tabs editor */
.ste-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.ste-head h2{margin:0}
.ste-list{max-height:min(60vh,520px);overflow:auto;margin-bottom:10px}
.ste-row{gap:10px;touch-action:pan-y}.ste-row.off .cell-title,.ste-row.off .cell-lead{opacity:.45}
.ste-row.dragging{position:relative;z-index:3;box-shadow:0 6px 18px rgba(0,0,0,.18);background:var(--panel)}
.ste-handle{touch-action:none;cursor:grab;color:var(--muted);display:inline-flex;padding:6px}
.switch.fixed{opacity:.5}
/* phones: every score tab fits without scrolling */
@media (max-width:500px){.cbar-b{flex:1 1 0;min-width:30px}.cbar-b .ico{width:20px;height:20px}.cbar-sep{margin:8px 1px}}
/* v7.1: setlist drawer levels */
.drawer,.drawer .dr-list,.drawer .dr-row{touch-action:pan-y}
.dr-head .dr-up{margin-left:-10px}
.drawer.bump{animation:drbump .25s}
@keyframes drbump{30%{transform:translateX(10px)}}

/* v7.1: player: a sound and volume per line, metronome */
.playbar .pb-lines{gap:6px 12px}
.playbar .pb-line{display:flex;align-items:center;gap:6px;flex:1 1 300px;min-width:0}
.playbar .pb-line .pb-lsel{flex:0 1 auto;min-width:0;max-width:150px}
.playbar .pb-vol{flex:1 1 60px;min-width:50px;max-width:140px;accent-color:var(--accent)}
.playbar .pb-metrow{display:flex;align-items:center;gap:6px}
.playbar .pb-metrow .pbtn{width:38px;height:38px}
.playbar .pb-vol:disabled{opacity:.35}
@media (max-width:480px){.playbar .pb-line{flex-basis:100%}}

/* v7.2: A–Z strip scrub + letter bubble */
.idx{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.idx button{touch-action:none;transition:transform .08s}
.idx:not(.az-active){transition:transform .2s ease}
.idx.az-active{background:color-mix(in srgb,var(--tint) 10%,transparent);border-radius:12px}
.idx button.az-on{transform:scale(1.35)}
.az-bubble{position:fixed;z-index:9999;width:84px;height:84px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:44px;font-weight:700;color:var(--panel);background:var(--tint);box-shadow:0 6px 24px rgba(0,0,0,.28);pointer-events:none;opacity:0;transform:scale(.6);transition:opacity .18s ease,transform .18s ease;left:-200px;top:-200px}
.az-bubble.on{opacity:1;transform:scale(1);transition:opacity .08s ease,transform .08s ease,top .04s linear}
.az-bubble.out{opacity:0;transform:scale(.85)}

/* 7.3: setlist from setlist */
.swa.blue{background:#0a84ff}
.se-top{position:sticky;top:0;z-index:3;background:var(--panel)}
.se-top .se-h{position:static}
.se-src{padding:8px 12px 2px}
.se-src .seg button{min-height:32px}
.slp-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.slp-song{cursor:pointer}
.slp-song.sel{background:var(--sel)}
.slp-song .chip{margin-left:6px;flex:none}
.slp-sw{margin:10px 0 0}
.sheet-back~.modal-back{z-index:70}

/* 7.3 smoothness: one iOS-like easing, transform/opacity only */
:root{--ease:cubic-bezier(.32,.72,0,1)}
.drawer-back,.drawer-back.open{background:transparent;transition:none}
.drawer-scrim{position:absolute;inset:0;background:rgba(0,0,0,.28);opacity:0;transition:opacity .3s var(--ease)}
.drawer-back.open .drawer-scrim{opacity:1}
.drawer{transform:translate3d(-103%,0,0);transition:transform .3s var(--ease);overflow:hidden;contain:layout paint}
.drawer-back.open .drawer{transform:translate3d(0,0,0)}
.drawer-back.dragging .drawer{will-change:transform}
/* v7.8: a drawer gliding shut still takes the touch (so it never reaches the score); the edge can pick it back up */
.drawer-back{z-index:85;isolation:isolate;-webkit-transform:translateZ(0);transform:translateZ(0)}
.drawer-back.closing{pointer-events:auto}
.dr-pane{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;background:var(--panel)}
.dr-pane.dr-old{position:absolute;left:0;right:0;bottom:0;z-index:1;pointer-events:none}
.popover{animation:pop .24s var(--ease)}
@keyframes pop{from{opacity:0;transform:translate3d(0,-6px,0) scale(.98)}to{opacity:1;transform:none}}
.sheet{animation:sheetin .32s var(--ease)}
@keyframes sheetin{from{opacity:0;transform:translate3d(0,24px,0)}to{opacity:1;transform:none}}
.modal{animation:modalin .24s var(--ease)}
@keyframes modalin{from{opacity:0;transform:translate3d(0,8px,0) scale(.97)}to{opacity:1;transform:none}}
.srow>.rfg{transition:transform .28s var(--ease)}
.srow.swiping>.rfg{transition:none;will-change:transform}
.srow.swiped>.rfg{transform:translate3d(calc(-96px * var(--nact, 1)),0,0)}
.switch::after{left:2px;transition:transform .22s var(--ease)}
.switch.on::after{left:2px;transform:translate3d(20px,0,0)}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* v7.4: "Getting this song…" progress on a musician's tablet */
.getbar{width:min(260px,70vw);height:6px;border-radius:3px;background:rgba(127,127,127,.25);overflow:hidden;margin:12px auto 0}
.getbar i{display:block;height:100%;background:var(--accent,#0a84ff);border-radius:3px;transition:width .15s linear}

/* v7.5: download choice with three/four options; labels may wrap */
.seg.seg-wrap button{white-space:normal;line-height:1.15;padding:4px 6px;min-height:40px}
.seg.seg4{flex-wrap:wrap}
.seg.seg4 button{flex:1 1 calc(50% - 2px)}
@media (min-width:700px){.seg.seg4 button{flex:1 1 0}}
.dl-next{margin:8px -2px 0;border-radius:10px;overflow:hidden;background:var(--panel)}
.dl-next .cell{min-height:52px}
.rdy{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;border-radius:13px;font-weight:700;font-size:.85rem}
.rdy.ok{background:rgba(52,199,89,.16);color:#1f9d4a}
.rdy.wait{background:var(--fill);color:var(--muted)}

/* v7.5: no iOS text-selection / copy callout on long-press anywhere in the app (only real text fields select) */
html,body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior-x:none}
input,textarea,[contenteditable],[contenteditable] *{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
img,canvas{-webkit-user-drag:none;-webkit-touch-callout:none}
.seg.seg3 button:last-child{flex-grow:1.35}

/* v7.6: musician join — iOS inset-grouped instrument list */
.join2{max-width:640px;padding-bottom:calc(110px + env(safe-area-inset-bottom))}
.join2 .jtop{padding:0 4px 4px}
.join2 .jback{margin-left:-14px}
.join2 h1{font-size:2rem;font-weight:800;margin:6px 0 2px;letter-spacing:-.01em}
.join2 .jsub{margin:0 0 6px;color:var(--muted);font-size:1rem}
.jsec{margin-top:22px}
.jsec-h{padding:0 16px 7px;font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.jlist{background:var(--panel);border-radius:12px;overflow:hidden}
.jrow{display:flex;align-items:center;gap:12px;min-height:52px;padding:0 16px;position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent}
.jrow+.jrow::before{content:"";position:absolute;top:0;left:56px;right:0;border-top:.5px solid var(--line)}
.jrow:active{background:var(--fill)}
.jrow:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:12px}
.jico{flex:none;width:28px;display:flex;justify-content:center;color:var(--tint)}
.jico .ico{width:24px;height:24px}
.jname{flex:1;min-width:0;font-size:1.02rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jhint{flex:none;font-size:.8rem;color:var(--muted)}
.jcheck{flex:none;width:22px;display:flex;justify-content:center;color:var(--tint);visibility:hidden}
.jcheck .ico{width:20px;height:20px;stroke-width:2.6}
.jrow.on .jcheck{visibility:visible}
.jrow.on .jname{font-weight:600}
.jmore .jname{color:var(--tint)}
.jmore .jico{color:var(--tint)}
.jcount{flex:none;font-size:.85rem;color:var(--muted)}
.jchev{flex:none;display:flex;color:var(--muted);transition:transform .25s ease}
.jchev .ico{width:20px;height:20px}
.jmore.open .jchev{transform:rotate(180deg)}
.jmorewrap[hidden]{display:none}
.jbar{position:fixed;left:0;right:0;bottom:0;z-index:5;padding:12px 20px calc(12px + env(safe-area-inset-bottom));background:var(--bar);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);border-top:.5px solid var(--line)}
.jbar .jgo{display:flex;width:100%;max-width:600px;margin:0 auto;min-height:54px;font-size:1.08rem;border-radius:14px}


/* v7.9: Leader | Musician switch, big join QR, camera scanner */
.roleseg button{min-height:40px;font-size:.95rem}
.joinbox2{align-items:flex-start;gap:16px;padding:10px 16px}
.joinbox2 .joininfo{flex:1;min-width:150px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.joinbox2 .joininfo .btn{display:inline-flex;align-items:center;gap:6px}
.joinbox2 .joininfo .btn svg{width:18px;height:18px}
button.qr{border:0;cursor:pointer}
.qr.qr-lg img{width:200px;height:200px}
@media (max-width:480px){.joinbox2{flex-direction:column;align-items:center}.joinbox2 .joininfo{align-items:center;text-align:center}.qr.qr-lg img{width:min(240px,62vw);height:min(240px,62vw)}}
.qrfull{text-align:center}
.qrfull h2{justify-content:center}
.qr.qr-xl{padding:10px;border-radius:14px}
.qr.qr-xl img{width:min(420px,78vw,60vh);height:min(420px,78vw,60vh)}
.qrfull .code.big{font-size:2.4rem;font-weight:800;letter-spacing:.2em;margin-top:10px}
.join .scanbtn{width:100%;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:14px;align-items:center;text-align:left;padding:14px 18px;margin:14px 0 4px;min-height:72px;border-radius:14px;background:var(--accent);color:var(--accent-ink);border:0;font-weight:700;font-size:1.1rem}
.join .scanbtn svg{grid-row:1/3;width:34px;height:34px;stroke:currentColor}
.join .scanbtn small{font-weight:500;opacity:.85;font-size:.85rem}
.join .ordiv{display:flex;align-items:center;gap:10px;color:var(--muted,#888);font-size:.85rem;margin:14px 0 2px}
.join .ordiv::before,.join .ordiv::after{content:"";flex:1;height:1px;background:var(--line,rgba(127,127,127,.3))}
.join .joinerr:empty{display:none}
.join .joinerr{margin:10px 0 0;line-height:1.35}
.jname-in{margin-top:10px}.jname-in input{width:100%;max-width:340px}
.jwait{padding-top:20px}
.scan-ov{position:fixed;inset:0;z-index:200;background:#000;color:#fff;overflow:hidden}
.scan-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.scan-frame{position:absolute;left:50%;top:46%;width:min(70vw,52vh,360px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:18px;box-shadow:0 0 0 200vmax rgba(0,0,0,.45)}
.scan-frame .c{position:absolute;width:34px;height:34px;border:4px solid #fff}
.scan-frame .tl{left:-2px;top:-2px;border-right:0;border-bottom:0;border-top-left-radius:18px}
.scan-frame .tr{right:-2px;top:-2px;border-left:0;border-bottom:0;border-top-right-radius:18px}
.scan-frame .bl{left:-2px;bottom:-2px;border-right:0;border-top:0;border-bottom-left-radius:18px}
.scan-frame .br{right:-2px;bottom:-2px;border-left:0;border-top:0;border-bottom-right-radius:18px}
.scan-ov.hit .scan-frame .c{border-color:#30d158}
.scan-top{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;gap:12px;padding:max(14px,env(safe-area-inset-top)) 16px 12px;background:linear-gradient(rgba(0,0,0,.55),transparent)}
.scan-top b{font-size:1.05rem}
.scan-top .btn{background:rgba(255,255,255,.18);color:#fff;border:0}
.scan-bot{position:absolute;left:0;right:0;bottom:0;padding:16px 20px max(22px,env(safe-area-inset-bottom));text-align:center;background:linear-gradient(transparent,rgba(0,0,0,.6))}
.scan-msg{margin:0 0 10px;font-weight:600;font-size:1rem}
.scan-bot .btn{color:#fff;background:transparent;border:1px solid rgba(255,255,255,.5)}

/* v7.9: visible Sort control on the Scores list */
.sortbar{display:flex;justify-content:flex-end;padding:2px 14px 4px}
.sortbtn{display:inline-flex;align-items:center;gap:6px;border:0;background:var(--fill);color:var(--text);border-radius:999px;padding:6px 12px;font-size:.86rem;min-height:32px}
.sortbtn svg{width:16px;height:16px}
.sortbtn b{font-weight:700}
.sortbtn .sortdir{font-weight:700;color:var(--tint)}

/* v8.0: Local link (no internet) */
.ll-sheet{max-width:560px;margin:0 auto}
.ll-sheet h2{display:flex;align-items:center;gap:8px}
.ll-sheet h2 svg{width:24px;height:24px}
.ll-help{color:var(--muted);font-size:.9rem;margin:2px 0 8px;line-height:1.35}
.ll-steps{margin:4px 0 10px;padding-left:22px;font-size:.92rem;line-height:1.45}
.ll-codebox{display:flex;flex-direction:column;align-items:center;gap:8px;margin:6px 0 10px}
.qr.ll-qr{background:#fff;padding:10px;border-radius:14px;display:inline-block;line-height:0}
.qr.ll-qr img{width:min(320px,74vw,48vh);height:min(320px,74vw,48vh);image-rendering:pixelated}
.ll-codeacts{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.ll-codeacts .btn svg{width:16px;height:16px;vertical-align:-3px}
.ll-raw{width:100%;font-size:.8rem;color:var(--muted)}
.ll-raw code{display:block;word-break:break-all;user-select:text;-webkit-user-select:text;padding:6px 8px;background:var(--fill);border-radius:8px;margin-top:4px}
.ll-acts{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 8px}
.ll-acts .btn.primary{flex:1 1 220px;min-height:48px;font-size:1.02rem}
.ll-acts .btn svg{width:20px;height:20px;vertical-align:-4px}
.ll-pastebox{display:flex;gap:8px;align-items:stretch;margin:4px 0 6px}
.ll-paste{flex:1;min-width:0;font:inherit;font-size:.85rem;font-family:ui-monospace,Menlo,monospace;padding:8px 10px;border-radius:10px;border:1px solid var(--line);background:var(--input,var(--panel));color:var(--text);resize:vertical;user-select:text;-webkit-user-select:text}
.ll-err{color:var(--bad);font-size:.9rem;margin:6px 0}
.ll-ok{color:var(--ok);font-weight:600;display:flex;align-items:center;gap:6px;justify-content:center}
.ll-ok svg{width:22px;height:22px}
.ll-wait{color:var(--muted);font-size:.9rem;text-align:center;margin:8px 0}
.ll-big{font-size:1.15rem;font-weight:700;text-align:center;margin:6px 0 2px}
.ll-list{margin-top:4px}
.ll-cell .cell-lead svg{color:var(--accent)}
.ll-ready{padding:2px 0 6px}
.ll-rrow{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid var(--line)}
.ll-rrow:last-child{border-bottom:0}
.ll-rico{flex:0 0 24px;height:24px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:.85rem;background:rgba(255,149,0,.18);color:#c46a00}
.ll-rrow.ok .ll-rico{background:rgba(52,199,89,.16);color:#1f9d4a}
.ll-rmain{flex:1;min-width:0;display:flex;flex-direction:column}
.ll-rmain b{font-size:.93rem;font-weight:600}
.ll-rmain span{font-size:.8rem;color:var(--muted)}
.ll-prog{font-weight:700;font-size:.85rem;color:var(--accent)}
.ll-sel{margin:6px 12px;max-width:calc(100% - 24px);font:inherit;font-size:.88rem;padding:6px 8px;border-radius:8px;border:1px solid var(--line);background:var(--input,var(--panel));color:var(--text)}
.ll-banner{white-space:nowrap;position:fixed;left:50%;transform:translateX(-50%);bottom:calc(14px + env(safe-area-inset-bottom));z-index:60;display:flex;align-items:center;gap:12px;padding:8px 10px 8px 14px;border-radius:14px;background:var(--panel);color:var(--text);box-shadow:0 6px 24px rgba(0,0,0,.25);font-size:.9rem;font-weight:600;max-width:calc(100vw - 24px)}
.ll-banner svg{width:18px;height:18px;vertical-align:-4px;color:var(--warn)}
.join .lljoin{display:flex;align-items:center;gap:6px;margin:6px auto 0;font-weight:600}
.join .lljoin svg{width:18px;height:18px}

/* ---------- v8.1: PIN lock screen, "Join a different band", notices ---------- */
.lockscr{gap:12px}
.lockscr h1{margin:4px 0 0;font-size:1.6rem}
.lockico{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--accent,#2563eb);color:#fff}
.lockico .ico{width:30px;height:30px}
.lockform{display:flex;gap:10px;width:min(340px,100%)}
.pinin{flex:1;min-width:0;font-size:1.5rem;letter-spacing:.35em;text-align:center;padding:12px 10px;border:1px solid var(--line);border-radius:12px;background:var(--bg2,#fff);color:var(--text);font-variant-numeric:tabular-nums}
.modal .pinin{display:block;width:100%;margin:8px 0 0;box-sizing:border-box}
.pinerr{color:var(--bad,#c62828);min-height:1.2em;margin:4px 0 0}
.lockjoin{margin-top:18px;opacity:.9}
.lockjoin .ico{width:18px;height:18px;vertical-align:-4px}
.shake{animation:bsShake .35s}
@keyframes bsShake{20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.joinnew{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:46px;font-weight:700}
.joinnew .ico{width:20px;height:20px}
.endedbtn{margin-top:16px;width:min(340px,90%);pointer-events:auto}
.bs-notice{position:fixed;left:50%;top:calc(env(safe-area-inset-top,0px) + 58px);transform:translate(-50%,-20px);opacity:0;pointer-events:none;z-index:9999;max-width:min(92vw,520px);background:#1f7a3a;color:#fff;font-weight:700;padding:12px 16px;border-radius:14px;box-shadow:0 8px 24px rgba(0,0,0,.25);text-align:center;transition:opacity .25s,transform .25s}
.bs-notice.show{opacity:1;transform:translate(-50%,0)}
.pinin::placeholder{letter-spacing:normal;font-size:1rem;opacity:.6}
.endedbtn .joinnew{white-space:normal;text-align:center;padding:10px 16px;box-sizing:border-box}

/* ---------- 8.4: Dropbox / Google Drive ---------- */
.cloudrow .cell-lead .ico{color:#0061fe}
.cloudrow.off{opacity:.55}
.cloudrow.on .cell-acc .btn{min-height:36px}
.cbhead{display:flex;align-items:center;gap:6px;margin:-4px -6px 0}
.cbhead .cbtitle{flex:1;min-width:0;margin:0;justify-content:center;text-align:center;font-size:1.08rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.cbacct{display:flex;align-items:center;gap:4px;justify-content:center;margin:2px 0 10px}
.cbacct .ico{width:16px;height:16px;color:#0061fe}
.cbsearch{width:100%;margin-bottom:10px}
.cblist{background:var(--panel2);border-radius:12px;overflow:auto;max-height:min(58vh,560px);-webkit-overflow-scrolling:touch}
.cbrow{display:flex;align-items:center;min-height:54px;position:relative;background:var(--panel)}
.cbrow+.cbrow::before{content:"";position:absolute;top:0;left:92px;right:0;border-top:.5px solid var(--line)}
.cbrow.on{background:var(--sel)}
.cbchk{flex:none;width:48px;height:54px;border:0;background:none;color:var(--muted);display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer}
.cbchk .ico{width:24px;height:24px}
.cbrow.on .cbchk{color:var(--tint)}
.cbmain{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding:6px 12px 6px 0;cursor:pointer;min-height:54px}
.cbrow:not(:has(.cbchk)) .cbmain{padding-left:14px}
.cbmain:active{background:var(--fill)}
.cbico{flex:none;width:32px;display:flex;justify-content:center;color:var(--tint)}
.cbrow.dir .cbico{color:#0061fe}
.cbico .ico{width:28px;height:28px}
.cbname{flex:1;min-width:0;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cbname small{display:block;font-weight:400;font-size:.76rem;color:var(--muted);margin-top:2px}
.cbmain .ico.chev{width:18px;height:18px;color:var(--muted);flex:none}
.cbstatus{min-height:1em;margin:6px 2px 0}
.cbbar{display:flex;align-items:center;gap:10px;margin-top:10px;position:sticky;bottom:0}
.cbbar .spacer{flex:1}
.cbbackup{margin:4px 0 6px}
.cbline{display:flex;align-items:center;gap:4px;margin:6px 0 2px;flex-wrap:wrap}
.cbline .ico{width:18px;height:18px;color:#0061fe}
.jsax{display:flex;gap:8px;padding:2px 16px 12px 56px;background:var(--panel)}
.jsax[hidden]{display:none}
.jsax button{flex:1;min-height:44px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);color:var(--text);font:inherit;font-size:.86rem;font-weight:600;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;cursor:pointer;padding:2px 4px}
.jsax button small{font-size:.68rem;font-weight:500;color:var(--muted)}
.jsax button[aria-checked=true]{background:var(--sel);border-color:var(--tint);color:var(--tint)}
.jsax button[aria-checked=true] small{color:var(--tint)}
@media (max-width:480px){ .jsax{padding-left:16px} .cbrow+.cbrow::before{left:88px} }

/* ---------- 8.5: Import button, "Add to a setlist?", Language ---------- */
.as85 { max-width: 460px; }
.as85 .as85-h { margin-bottom: 4px; }
.as85 .as85-songs { margin: 0 0 6px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.as85-list { display: flex; flex-direction: column; gap: 6px; max-height: min(46vh, 380px); overflow-y: auto; margin: 8px 0 10px; -webkit-overflow-scrolling: touch; }
.as85-row { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--line, #ddd); border-radius: 12px; cursor: pointer; min-height: 44px; }
.as85-row.on { border-color: var(--accent, #0a84ff); background: color-mix(in srgb, var(--accent, #0a84ff) 9%, transparent); }
.as85-row input { width: 22px; height: 22px; flex: none; accent-color: var(--accent, #0a84ff); margin: 0; }
.as85-name { flex: 1; min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.as85-meta { flex: none; font-size: 13px; opacity: .65; white-space: nowrap; }
.as85-ln { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 6px; border-radius: 6px; border: 1px solid currentColor; }
.as85-new { display: inline-flex; align-items: center; gap: 4px; }
.as85-new svg { width: 18px; height: 18px; }
.lang85 { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.lang85-b { flex: 1 1 120px; min-height: 44px; border-radius: 10px; border: 1px solid var(--line, #ccc); background: transparent; color: inherit; font: inherit; font-weight: 600; cursor: pointer; }
.lang85-b.on { border-color: var(--accent, #0a84ff); background: var(--accent, #0a84ff); color: #fff; }
.lang85-chip { position: fixed; top: calc(env(safe-area-inset-top, 0px) + 10px); inset-inline-end: 12px; z-index: 30; display: inline-flex; align-items: center; gap: 4px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line, #ccc); background: var(--panel, rgba(255,255,255,.9)); color: inherit; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.lang85-chip svg { width: 16px; height: 16px; }
/* right-to-left (Hebrew): the chrome mirrors, the music does not */
html[dir=rtl] body { text-align: right; }
html[dir=rtl] .stage, html[dir=rtl] .stage .pages, html[dir=rtl] .ann-layer, html[dir=rtl] .ann-capture, html[dir=rtl] .seek, html[dir=rtl] .ann-pager, html[dir=rtl] .seekbar, html[dir=rtl] .thumbs, html[dir=rtl] .player .pscore, html[dir=rtl] .pbars, html[dir=rtl] canvas { direction: ltr; }
html[dir=rtl] input[type=range] { direction: ltr; }
html[dir=rtl] .chev, html[dir=rtl] .navbar .back svg { transform: scaleX(-1); }
html[dir=rtl] input[type=text], html[dir=rtl] input[type=search], html[dir=rtl] textarea { text-align: right; }
html[dir=rtl] .tb-title > *, html[dir=rtl] .as85-name { unicode-bidi: plaintext; }
html[dir=rtl] .i18n-ltr { direction: ltr; unicode-bidi: isolate; }
html[dir=rtl] .tb-title .ts { unicode-bidi: normal; direction: rtl; }
html[dir=rtl] [dir=auto] { text-align: right; }
html[dir=rtl] .tb-title [dir=auto], html[dir=rtl] .tb-title > * { text-align: center; }

/* ---- 8.6 setlist switcher ---- */
.titlebar { position: relative; }
.sw86-title { position: absolute; left: 50%; top: calc(100% + 6px); transform: translateX(-50%); z-index: 6; display: inline-flex; align-items: center; gap: 6px; max-width: min(78vw, 420px);
  padding: 5px 12px; border-radius: 999px; border: 1px solid var(--line, rgba(0,0,0,.12)); background: var(--panel, #fff); color: var(--ink, #111); font: 600 13px/1.2 -apple-system, system-ui, sans-serif; box-shadow: 0 2px 10px rgba(0,0,0,.12); cursor: pointer; white-space: nowrap; }
.sw86-title .sw86-tn { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.sw86-title .sw86-ti { font-weight: 400; opacity: .65; flex: none; }
.sw86-title .sw86-car { flex: none; opacity: .7; }
.sw86-title.pinned::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent, #e8590c); flex: none; }
.reader:not(.chrome-on) .sw86-title { display: none; }
.sw86-scrim { position: fixed; inset: 0; z-index: 9000; background: rgba(0,0,0,.28); display: flex; align-items: flex-start; justify-content: center; padding-top: calc(env(safe-area-inset-top, 0px) + 64px); }
.sw86-sheet { width: min(92vw, 420px); max-height: 70vh; overflow: auto; background: var(--panel, #fff); color: var(--ink, #111); border-radius: 14px; box-shadow: 0 12px 40px rgba(0,0,0,.25); padding: 6px 0; }
.sw86-h { display: flex; align-items: center; justify-content: space-between; padding: 8px 14px 6px; font-size: 15px; }
.sw86-x { border: 0; background: none; font-size: 16px; padding: 4px 8px; color: inherit; cursor: pointer; }
.sw86-row { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 14px; border: 0; background: none; color: inherit; text-align: start; font: inherit; cursor: pointer; border-top: 1px solid var(--line, rgba(0,0,0,.08)); }
.sw86-row.cur { background: rgba(232,89,12,.08); }
.sw86-ic { width: 22px; height: 22px; flex: none; color: var(--accent, #e8590c); display: inline-flex; }
.sw86-ic svg, .sw86-pin svg, .sw86-all svg { width: 20px; height: 20px; }
.sw86-main { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.sw86-name { font-weight: 600; font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sw86-sub { font-size: 12.5px; opacity: .65; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sw86-go svg { width: 16px; height: 16px; opacity: .5; }
[dir=rtl] .sw86-go svg { transform: scaleX(-1); }
.sw86-tip { margin: 6px 14px 8px; font-size: 13px; opacity: .7; }
.sw86-foot { display: flex; gap: 8px; padding: 10px 12px 6px; border-top: 1px solid var(--line, rgba(0,0,0,.08)); flex-wrap: wrap; }
.sw86-pin, .sw86-all { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--line, rgba(0,0,0,.12)); background: none; color: inherit; font: 500 14px/1.2 -apple-system, system-ui, sans-serif; cursor: pointer; }
.sw86-back { position: absolute; left: 50%; transform: translateX(-50%); bottom: 90px; z-index: 30; display: inline-flex; align-items: center; gap: 8px; max-width: min(86vw, 440px);
  padding: 8px 14px; border-radius: 999px; border: 0; background: rgba(28,28,30,.88); color: #fff; font: 600 14px/1.2 -apple-system, system-ui, sans-serif; box-shadow: 0 4px 16px rgba(0,0,0,.25); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sw86-back .sw86-arr { font-size: 16px; }
.reader:not(.chrome-on) .sw86-back { opacity: .92; }
.cell-title .pin86 { display: inline-block; width: 14px; height: 14px; vertical-align: -2px; margin-inline-start: 6px; color: var(--accent, #e8590c); }
.swa.orange { background: #e8590c; color: #fff; }

/* ---------- 8.6: "Add to setlist" bar after an import · duplicate files ---------- */
.ab86 { position: fixed; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom)); transform: translate(-50%, 24px); opacity: 0; z-index: 60;
  display: flex; align-items: center; gap: 8px; max-width: min(560px, calc(100vw - 20px)); box-sizing: border-box;
  padding: 6px 6px 6px 14px; border-radius: 999px; background: rgba(28,28,32,.95); color: #fff; box-shadow: 0 8px 28px rgba(0,0,0,.28);
  transition: opacity .22s, transform .22s; pointer-events: none; }
.ab86.show { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
[dir=rtl] .ab86 { padding: 6px 14px 6px 6px; }
.ab86 .ab86-ok .ico { width: 18px; height: 18px; color: #4ade80; display: block; }
.ab86 .ab86-txt { flex: 1 1 auto; min-width: 0; display: flex; align-items: baseline; font-weight: 600; font-size: .92rem; white-space: nowrap; overflow: hidden; }
.ab86 .ab86-txt > * { flex: 0 0 auto; }
.ab86 .ab86-txt .ab86-t { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.ab86 .ab86-txt > span { margin-inline-start: .3em; }
.ab86 .ab86-add { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: 999px; border: 0;
  background: var(--accent, #3b82f6); color: #fff; font: inherit; font-weight: 700; font-size: .9rem; white-space: nowrap; cursor: pointer; }
.ab86 .ab86-add .ico { width: 18px; height: 18px; }
.ab86 .ab86-x { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(255,255,255,.12); color: #fff; font-size: 16px; cursor: pointer; }
.dup86 { max-width: 480px; }
.dup86 .dup86-count { font-size: .78rem; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.dup86 .dup86-h { margin: 0 0 6px; font-size: 1.15rem; line-height: 1.3; display: block; overflow-wrap: anywhere; }
.dup86 .dup86-why { margin: 0 0 10px; }
.dup86 .dup86-card { border-radius: 12px; background: var(--panel2); border: 1px solid var(--line); padding: 10px 12px; margin: 8px 0; }
.dup86 .dup86-card.new { border-style: dashed; }
.dup86 .dup86-lbl { font-size: .72rem; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.dup86 .dup86-title { font-weight: 700; margin-top: 2px; overflow-wrap: anywhere; }
.dup86 .dup86-meta { color: var(--muted); font-size: .84rem; margin-top: 3px; overflow-wrap: anywhere; }
.dup86 .dup86-all { display: flex; align-items: center; gap: 10px; margin: 12px 2px 4px; font-weight: 600; cursor: pointer; }
.dup86 .dup86-all input { width: 20px; height: 20px; margin: 0; flex: 0 0 auto; }
.dup86 .dup86-btns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.dup86 .dup86-btns .btn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 64px; padding: 8px 6px; text-align: center; white-space: normal; height: auto; }
.dup86 .dup86-btns .btn small { font-size: .7rem; font-weight: 500; color: var(--muted); line-height: 1.2; overflow-wrap: anywhere; }
.dup86 .dup86-btns .dup86-replace b { color: var(--danger, #dc2626); }
@media (max-width: 360px) { .dup86 .dup86-btns { grid-template-columns: 1fr; } .dup86 .dup86-btns .btn { min-height: 52px; } }
.dup86-sum { max-width: 620px; }
.dup86 .dup86-allrow { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0; }
.dup86 .dup86-allrow .btn { flex: 1 1 0; min-width: 0; white-space: normal; line-height: 1.2; min-height: 46px; padding: 6px 8px; height: auto; }
.dup86 .dup86-allrow .btn.on { background: var(--accent, #3b82f6); color: #fff; border-color: transparent; }
.dup86 .dup86-list { display: flex; flex-direction: column; gap: 6px; max-height: min(52vh, 460px); overflow-y: auto; -webkit-overflow-scrolling: touch; }
.dup86 .dup86-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; background: var(--panel2); border: 1px solid var(--line); }
.dup86 .dup86-row .main { flex: 1; min-width: 0; }
.dup86 .dup86-row .title { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dup86 .dup86-row .meta { color: var(--muted); font-size: .78rem; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dup86 .dup86-row select { flex: 0 0 auto; max-width: 42%; min-height: 40px; }

/* ---- 8.7 backup & restore ---- */
.bk87-h{margin-bottom:6px}
.bk87-last{margin:0 0 10px;color:var(--muted,#667)}
.bk87-card{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:12px;background:var(--panel2,rgba(127,127,127,.08));margin:0 0 12px}
.bk87-ico{flex:0 0 48px;width:48px;height:48px}
.bk87-ico img{width:48px;height:48px;display:block}
.bk87-what{display:flex;flex-direction:column;gap:3px;min-width:0}
.bk87-what b{font-size:15px}
.bk87-name{display:flex;align-items:center;gap:10px;margin:0 0 10px}
.bk87-name span{flex:0 0 auto;font-size:14px}
.bk87-name input{flex:1 1 auto;min-width:0}
.bk87-file{display:flex;align-items:center;gap:6px;flex-wrap:wrap;word-break:break-word}
.bk87-file svg{width:20px;height:20px;flex:0 0 20px}
.bk87-fname{font-weight:600;direction:ltr;unicode-bidi:isolate}
.bk87-parts{background:rgba(245,179,1,.14);border-radius:10px;padding:8px 10px}
.bk87-sum{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:12px;background:var(--panel2,rgba(127,127,127,.08));margin:0 0 10px}
.bk87-from{word-break:break-word}
.bk87-row{display:flex;align-items:center;gap:8px}
.bk87-row svg{width:18px;height:18px;flex:0 0 18px;opacity:.75}
.bk87-warn{background:rgba(214,40,40,.12);color:inherit;border-radius:10px;padding:8px 10px;font-size:14px}
.bk87-danger-h{color:var(--bad,#c62828)}
.bk87-acts .btn{white-space:normal}
.bk87-tip{margin-top:12px}
@media (max-width:430px){.bk87-acts{flex-direction:column-reverse;align-items:stretch}.bk87-acts .spacer{display:none}.bk87-acts .btn{width:100%;justify-content:center}}
.bk87-pickrow{margin-bottom:10px}
.bk87-stack{display:flex;flex-direction:column;align-items:stretch;gap:8px}
.bk87-stack .btn{width:100%;justify-content:center;white-space:normal}

/* ---------- 8.8: pinned setlists on top; floating mini-player ---------- */
.sech.pin88-h{display:flex;align-items:center;gap:6px}
.sech.pin88-h .ico{width:15px;height:15px}
.playbar.pb-float{left:auto;right:auto;bottom:auto;top:auto;transform:none;width:min(390px,calc(100vw - 12px));max-height:calc(100vh - 12px);padding:6px 8px 6px;gap:6px;border-radius:18px;
  background:color-mix(in srgb,var(--panel) 94%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 30px rgba(0,0,0,.28);transition:opacity .2s;touch-action:manipulation;z-index:45}
.playbar.pb-float .pb-head{flex-wrap:nowrap;gap:4px}
.playbar.pb-float .pbtn{width:36px;height:36px}
.playbar.pb-float .pbtn .ico{width:19px;height:19px}
.playbar.pb-float .pbtn.big{width:44px;height:44px}
.playbar.pb-float .pb-title{cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;padding:0 2px}
.playbar.pb-float .pb-title b{font-size:14px}
.playbar.pb-float .pb-title span{font-size:12px}
.playbar .pb-grip{flex:none;width:22px;height:40px;display:inline-flex;align-items:center;justify-content:center;color:var(--muted);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;margin-inline-start:-2px}
.playbar .pb-grip .ico{width:18px;height:18px}
.playbar.pb-drag{opacity:.85;cursor:grabbing;transition:none}
.playbar.pb-drag .pb-title,.playbar.pb-drag .pb-grip{cursor:grabbing}
.playbar.pb-float .pb-body{display:flex;flex-direction:column;gap:6px;overflow:auto;max-height:min(46vh,340px);overscroll-behavior:contain}
.playbar.pb-float .pb-speed{min-width:0;flex:1 1 100%}
.playbar.pb-float .pb-metrow .pb-vol{max-width:90px}
.playbar.pb-float .pb-line .pb-vol{max-width:110px}
.playbar.pb-float select{min-height:34px;font-size:14px}
.playbar.pb-float .btn.small{min-height:34px;font-size:14px}
.playbar.pb-float .pb-note{font-size:11.5px}
.playbar.pb-float .pb-ctl{gap:6px}
.playbar.pb-float .pb-line{flex-basis:100%}
.playbar.pb-float .pb-expbtn{display:none}
.playbar.pb-float.pb-min{width:auto;max-width:min(330px,calc(100vw - 12px));border-radius:999px;padding:4px 6px}
.playbar.pb-float.pb-min .pb-body,.playbar.pb-float.pb-min .pb-stop,.playbar.pb-float.pb-min .pb-ghostbtn,.playbar.pb-float.pb-min .pb-minbtn{display:none}
.playbar.pb-float.pb-min .pb-expbtn{display:inline-flex}
.playbar.pb-float.pb-min .pb-title{max-width:150px}
.playbar.pb-float.pb-min .pbtn.big{width:40px;height:40px}
.playbar.pb-float.pb-ghost{opacity:.5}
.playbar.pb-float.pb-ghost.pb-touch,.playbar.pb-float.pb-ghost.pb-drag{opacity:1}
@media (hover:hover){.playbar.pb-float.pb-ghost:hover{opacity:1}}
.playbar.pb-float.pb-ghost .pb-ghostbtn{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.playbar.pb-loading .pb-head .pbtn:not(.pb-close),.playbar.pb-loading .pb-body{pointer-events:none;opacity:.4}
.playbar.pb-float.pb-phone:not(.pb-min){width:min(350px,calc(100vw - 12px))}
.playbar.pb-float.pb-phone .pb-body{max-height:min(40vh,300px)}
@media (max-width:480px){.playbar.pb-float{padding:5px 6px}.playbar.pb-float .pb-speed{flex-basis:100%}}

/* ---------- 8.9.3: Hebrew names under English titles (Hebrew mode only) ---------- */
.he-sub{display:block;direction:rtl;unicode-bidi:isolate;font-size:.8em;line-height:1.3;color:var(--muted);font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;min-width:0}
.cell-main > .he-sub, .gtxt > .he-sub{margin-top:0}
.cell-title + .he-sub.cell-sub{font-size:.8rem}
.tb-title .tb-he{font-size:.74rem;line-height:1.15;text-align:center;max-width:100%}
.tb-title.has-he893 > .ts{display:none}
.sw86-main > .he-sub{font-size:.74rem}
.ss-head > .he-sub{font-size:.82rem}
.he-input{text-align:right;font-family:inherit}
.he-minput{display:flex;gap:6px;align-items:center}
.he-minput .he-input{flex:1;min-width:0}
.he-suggest{flex:none;white-space:nowrap}
.he-guess{box-sizing:border-box;width:100%;flex-basis:100%;display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:6px 0 2px;padding:6px 8px;border-radius:10px;background:var(--fill)}
.he-guess b{font-size:1rem}
.he-guess-note{flex-basis:100%}
.he-ta{width:100%;box-sizing:border-box;font:inherit;font-size:.9rem;padding:8px;border-radius:10px;border:1px solid var(--line);background:var(--input);color:var(--text);resize:vertical;min-height:110px}
.he-lbl{margin:12px 0 6px}
.he-chk{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:10px 0;color:var(--text);font-size:.9rem}
.he-chk input{width:20px;height:20px}
.he-top{gap:8px}
.he-out{margin-top:8px}
.he-sum{font-size:.88rem;margin:6px 0}
.he-bad{color:var(--bad,#c62828)}
.he-prev{max-height:44vh;overflow:auto;border:1px solid var(--line);border-radius:10px;-webkit-overflow-scrolling:touch}
.he-row{display:grid;grid-template-columns:20px minmax(0,1fr) minmax(0,1fr);gap:2px 8px;padding:6px 8px;border-bottom:1px solid var(--line);font-size:.88rem;align-items:baseline}
.he-row:last-child{border-bottom:0}
.he-row .he-st{font-weight:700;color:var(--ok,#2e7d32)}
.he-row.he-none .he-st{color:var(--bad,#c62828)}
.he-row.he-kept .he-st{color:var(--muted)}
.he-en,.he-he{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.he-he{text-align:right}
.he-note{grid-column:2 / 4}
.he-note:empty{display:none}
.he-tip{margin:8px 0 0}
.he-file{display:flex;gap:4px;flex-wrap:wrap}