/**
 * Chorus Global — chorusglobal.org
 * Copyright © 2026 Ryan Fish
 * Licensed under AGPL-3.0 — https://www.gnu.org/licenses/agpl-3.0.en.html
 */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#f7f4ef;--surface:#fff;--ink:#1c1917;--ink2:#44403c;
  --accent:#c4622d;--al:#fdf0e8;--ad:#9e4d22;
  --muted:#78716c;--border:rgba(28,25,23,0.09);--bm:rgba(28,25,23,0.18);
  --sw:240px;--serif:'Cormorant Garamond',Georgia,serif;--sans:'Jost',system-ui,sans-serif;--r:4px;
}
html,body{height:100%}
html{font-size:15px}body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-weight:300;line-height:1.6;overflow-x:hidden;height:100%}
#splash{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;background:var(--bg);overflow:hidden}
.si{position:relative;z-index:2;text-align:center;padding:32px 24px;max-width:600px}
.se{font-size:9px;letter-spacing:0.3em;text-transform:uppercase;color:var(--muted);opacity:0;animation:ri .7s ease .9s both}
.sl{font-family:var(--serif);font-size:clamp(60px,12vw,108px);font-weight:300;line-height:.95;letter-spacing:-.02em;margin:16px 0 6px;opacity:0;animation:ri .8s ease 1.1s both}
.sl span{color:var(--accent)}
.ss{font-size:13px;letter-spacing:.12em;color:var(--muted);text-transform:uppercase;margin-bottom:48px;opacity:0;animation:ri .6s ease 1.3s both}
.sb{display:flex;flex-direction:column;gap:10px;align-items:center;opacity:0;animation:ri .6s ease 1.6s both}
@media(min-width:440px){.sb{flex-direction:row;justify-content:center}}
.sbtn{padding:13px 40px;font-family:var(--sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;cursor:pointer;border:none;transition:all .16s}
.sbp{background:var(--accent);color:#fff}.sbp:hover{background:var(--ad);transform:translateY(-2px);box-shadow:0 8px 24px rgba(196,98,45,.28)}
.sbs{background:transparent;color:var(--ink);border:1px solid var(--bm)}.sbs:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}
.sf{font-size:10px;color:var(--muted);opacity:0;animation:ri .5s ease 1.9s both;margin-top:16px;letter-spacing:.06em}
@keyframes ri{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
#curtain{position:fixed;inset:0;z-index:1999;background:var(--bg);opacity:0;pointer-events:none;transition:opacity .26s ease}
#curtain.on{opacity:1;pointer-events:all}
html,body{height:100%;margin:0;padding:0}
#app{display:none}#app.show{display:flex;flex-direction:column;width:100%;min-height:100vh}
#layout{display:flex;flex-direction:row;flex:1;min-height:0}
#sidebar{width:var(--sw);flex-shrink:0;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow-y:auto;position:sticky;top:0;height:100vh;z-index:200}
#main{flex:1;min-width:0;width:calc(100% - var(--sw));overflow-y:auto;overflow-x:hidden;background:var(--bg)}
#topbar{display:none;position:sticky;top:0;z-index:300;background:var(--surface);border-bottom:1px solid var(--border);height:52px;align-items:center;justify-content:space-between;padding:0 16px}
.tl{font-family:var(--serif);font-size:22px;font-weight:400}.tl span{color:var(--accent)}
.hbg{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;gap:4px;padding:4px}
.hbg span{display:block;width:20px;height:1.5px;background:var(--ink)}
.sbl{padding:24px 20px 18px;border-bottom:1px solid var(--border)}
.sbl h1{font-family:var(--serif);font-size:24px;font-weight:300;line-height:1;letter-spacing:-.01em}.sbl h1 span{color:var(--accent)}
.sbl p{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-top:3px}
.sbsec{padding:14px 12px 3px;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.ni{display:flex;align-items:center;gap:10px;padding:8px 12px;cursor:pointer;border-radius:var(--r);margin:1px 8px;font-size:12px;letter-spacing:.04em;color:var(--ink2);transition:all .14s;border:none;background:none;width:calc(100% - 16px);text-align:left;font-family:var(--sans);font-weight:400;white-space:nowrap}
.ni:hover{background:var(--bg);color:var(--ink)}.ni.on{background:var(--al);color:var(--accent);font-weight:500}
.ni svg{width:14px;height:14px;opacity:.5;flex-shrink:0}.ni.on svg{opacity:1}
.sbb{margin-top:auto;padding:14px;border-top:1px solid var(--border)}
.scb{width:100%;padding:10px;background:var(--accent);color:#fff;border:none;font-family:var(--sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;font-weight:500;transition:background .15s;border-radius:var(--r)}
.scb:hover{background:var(--ad)}
@media(max-width:768px){
  #topbar{display:flex}
  #sidebar{position:fixed;left:0;top:0;bottom:0;z-index:1000;transform:translateX(-100%);transition:transform .24s ease;box-shadow:4px 0 32px rgba(0,0,0,.12);width:280px;height:100%}
  #sidebar.open{transform:translateX(0)}
  .cp{padding:24px 20px 80px}
}
body.dark #topbar{background:var(--surface);border-bottom:1px solid var(--border)}
body.dark .hbg span{background:var(--ink)}
body.dark .tl{color:var(--ink)}
.cp{display:none;padding:36px 40px 80px;max-width:860px;width:100%;box-sizing:border-box;min-height:100%;margin:0 auto}.cp.on{display:block}
.pt{font-family:var(--serif);font-size:32px;font-weight:400;margin-bottom:4px;line-height:1.1}
.pd{font-size:12px;color:var(--muted);letter-spacing:.04em;margin-bottom:28px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.hh{margin-bottom:40px}.hh h2{font-family:var(--serif);font-size:clamp(28px,4vw,44px);font-weight:300;line-height:1.15;margin-bottom:12px}.hh h2 em{font-style:italic;color:var(--accent)}
.hh p{font-size:14px;color:var(--muted);max-width:520px;line-height:1.75}
.tc{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin-top:28px}
.tcd{border:1px solid var(--border);background:var(--surface);padding:16px 14px;cursor:pointer;transition:all .15s;text-align:left;border-radius:var(--r)}
.tcd:hover{border-color:var(--accent);background:var(--al);transform:translateY(-2px);box-shadow:0 6px 20px rgba(196,98,45,.1)}
.tci{font-size:18px;margin-bottom:8px;display:block}.tcn{font-size:11px;letter-spacing:.06em;color:var(--ink2);font-weight:500}
label{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:5px;margin-top:14px}
input[type=text],input[type=email],input[type=password],select,textarea{width:100%;border:1px solid var(--bm);background:var(--bg);padding:10px 13px;font-family:var(--sans);font-size:13px;color:var(--ink);outline:none;transition:border-color .15s;font-weight:300;border-radius:var(--r);-webkit-appearance:none;appearance:none}
input:focus,select:focus,textarea:focus{border-color:var(--accent);background:#fff}
textarea{min-height:80px;resize:vertical}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
@media(max-width:500px){.g2,.g3{grid-template-columns:1fr}}
.btn{border:none;background:var(--accent);color:#fff;padding:11px 26px;font-family:var(--sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:all .15s;font-weight:500;margin-top:16px;border-radius:var(--r)}
.btn:hover{background:var(--ad);transform:translateY(-1px);box-shadow:0 8px 24px rgba(196,98,45,.28)}.btn:active{transform:scale(.98)}
.bg{border:1px solid var(--bm);background:transparent;color:var(--ink2);padding:11px 22px;font-family:var(--sans);font-size:11px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:all .15s;font-weight:400;margin-top:16px;margin-left:8px;border-radius:var(--r)}
.bg:hover{border-color:var(--accent);color:var(--accent)}
.ob{margin-top:16px;border:1px solid var(--border);padding:18px 20px;background:var(--surface);font-size:13px;line-height:1.8;display:none;border-radius:var(--r)}.ob.show{display:block}
.or{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;border-bottom:1px solid var(--border)}.or:last-child{border-bottom:none}
.ol{color:var(--muted);font-size:10px;letter-spacing:.1em;text-transform:uppercase}.ov{font-weight:400}.ov.hi{color:var(--accent)}
.bbd{text-align:center;padding:12px 0 8px}.bbn{font-family:var(--serif);font-size:72px;font-weight:300;line-height:1}.bbu{font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-top:2px}
.br{display:flex;justify-content:center;gap:14px;margin:16px 0}
.bd{width:13px;height:13px;border-radius:50%;border:1px solid var(--bm);transition:all .05s}.bd.on{background:var(--accent);border-color:var(--accent);transform:scale(1.25)}
input[type=range]{width:100%;accent-color:var(--accent);cursor:pointer;margin:6px 0}
.tb{text-align:center;padding:12px 0}.tn{font-family:var(--serif);font-size:64px;font-weight:300;line-height:1}.thz{font-size:11px;color:var(--muted);letter-spacing:.1em;margin-top:4px}
.nw{position:relative;height:5px;background:var(--border);border-radius:3px;margin:20px 0;overflow:hidden}
.np{position:absolute;top:0;height:100%;width:4px;background:var(--accent);border-radius:2px;transition:left .08s linear;left:50%}
.ct{text-align:center;font-size:12px;color:var(--muted);min-height:20px}
.pb{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:14px}.pb label{margin:0}.pb select{width:auto;padding:7px 11px;font-size:12px}
.ptg{font-size:10px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;background:var(--surface);border:1px solid var(--bm);padding:7px 13px;color:var(--muted);font-family:var(--sans);transition:all .14s;border-radius:var(--r)}.ptg.on{border-color:var(--accent);color:var(--accent);background:var(--al)}
.ks{overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch}
.kb{position:relative;height:200px;min-width:580px;user-select:none;display:flex}
.wk{flex:1;border:1px solid #d1c9c1;background:#fff;cursor:pointer;position:relative;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px;font-size:8px;color:#b5aca4;letter-spacing:.05em;transition:background .05s;touch-action:none;border-radius:0 0 3px 3px}
.wk:hover{background:#f5f0ea}.wk.pressed{background:#e0d4c8}.wk.hl{background:#fdf0e8;border-color:var(--accent)}.wk.sq{background:#f5dcc8}
.bk{position:absolute;width:18px;height:58%;background:#1c1917;top:0;z-index:2;cursor:pointer;transition:background .05s;touch-action:none;border-radius:0 0 2px 2px;transform:translateX(-50%)}
.bk:hover{background:#2e2925}.bk.pressed{background:#4a3f38}.bk.hl{background:var(--accent)}.bk.sq{background:var(--ad)}
.kl{font-family:var(--serif);font-size:13px;font-style:italic;color:var(--accent);margin-top:10px;min-height:22px;text-align:center}
.rb{display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.rd{width:8px;height:8px;border-radius:50%;background:#c0392b;display:none}.rd.on{display:inline-block;animation:blink 1s ease infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
.cc{margin-top:16px;padding:20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);display:none}.cc.show{display:block}
.cn{font-family:var(--serif);font-size:36px;font-weight:400;color:var(--accent)}.cs{font-size:12px;color:var(--muted);letter-spacing:.05em;margin-top:4px}
.sk{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.sd{padding:7px 14px;border:1px solid var(--bm);font-size:11px;letter-spacing:.06em;border-radius:var(--r);transition:all .12s}.sd.in{background:var(--accent);color:#fff;border-color:var(--accent)}
.slr{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border)}
.sln{font-size:10px;color:var(--muted);width:18px;flex-shrink:0}.slt{flex:1;font-size:13px}.sld{font-size:11px;color:var(--muted);flex-shrink:0}
.slx{cursor:pointer;color:var(--muted);font-size:17px;line-height:1;border:none;background:none;padding:0 4px;transition:color .12s}.slx:hover{color:#b91c1c}
.pc{text-align:center;padding:20px 0}.pck{font-family:var(--serif);font-size:60px;font-weight:300;line-height:1}.pph{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-top:8px}
.sr{margin-top:16px;font-size:13px;line-height:1.9}.sr p{margin-bottom:8px}.ok{color:#166534}.no{color:#991b1b}
.scr{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--border)}
.sct{font-size:13px;font-weight:400}.scc{font-size:10px;color:var(--muted);letter-spacing:.05em;margin-top:2px}
.sca{font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--accent);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .14s;margin-left:14px;flex-shrink:0;white-space:nowrap}.sca:hover{border-color:var(--accent)}
.scl{font-size:12px;color:var(--muted);padding:16px 0;letter-spacing:.04em}
.rt{width:100%;border-collapse:collapse;font-size:12px;margin-top:12px}
.rt th{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding:8px;border-bottom:1px solid var(--bm);text-align:left}
.rt td{padding:8px;border-bottom:1px solid var(--border);font-weight:300}.rt tr:hover td{background:var(--al)}
.mpp strong{font-weight:600;font-size:13px;color:var(--ink);display:block;margin-bottom:3px}
#modal{position:fixed;inset:0;z-index:1000;background:rgba(28,25,23,.65);display:none;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(6px)}
#modal.open{display:flex}
.mi{background:#fff;max-width:460px;width:100%;padding:36px;position:relative;animation:ri .2s ease both;border-radius:var(--r)}
.mx{position:absolute;top:14px;right:14px;cursor:pointer;font-size:20px;color:var(--muted);background:none;border:none;line-height:1;transition:color .14s}.mx:hover{color:var(--ink)}
.mt{font-family:var(--serif);font-size:28px;font-weight:400;margin-bottom:4px}
.ms{font-size:12px;color:var(--muted);margin-bottom:18px;line-height:1.65}
.tc2{display:flex;align-items:flex-start;gap:10px;margin-top:14px;font-size:12px;color:var(--muted);line-height:1.55}
.tc2 input{margin-top:2px;accent-color:var(--accent);flex-shrink:0;width:14px;height:14px}.tc2 a{color:var(--accent)}
.mp{font-size:11px;color:var(--muted);margin-top:14px;padding-top:14px;border-top:1px solid var(--border);line-height:1.7}.mp strong{color:var(--ink);font-weight:500}
.fl{font-size:12px;padding:10px 14px;margin-top:10px;display:none;border-radius:var(--r)}.fl.show{display:block}
.fl.ok{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0}.fl.err{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}
#p-terms .th{font-family:var(--serif);font-size:22px;font-weight:400;margin:28px 0 10px}
#p-terms p{font-size:13px;color:var(--muted);line-height:1.85;margin-bottom:10px}#p-terms strong{color:var(--ink);font-weight:500}
.db{border-top:1px solid var(--border);padding:44px 0;text-align:center;margin-top:32px}.db p{font-size:12px;color:var(--muted);line-height:1.8;margin-bottom:16px}
.dl{display:inline-block;border:1px solid var(--bm);padding:12px 32px;font-family:var(--sans);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);text-decoration:none;transition:all .15s;cursor:pointer;background:none;font-weight:400;border-radius:var(--r)}.dl:hover{border-color:var(--accent);color:var(--accent)}
#sov{display:none;position:fixed;inset:0;z-index:398;background:rgba(28,25,23,.4)}#sov.show{display:block}
#wmap{height:clamp(320px,65vh,700px);border:1px solid var(--border);border-radius:var(--r);margin-top:16px;width:100%;min-width:0;max-width:100%;box-sizing:border-box}
.cbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;align-items:center}.cbar label{margin:0;flex-shrink:0}.cbar select{width:auto;flex:1;min-width:200px}
.mpp{font-family:var(--sans);font-size:12px;line-height:1.5;max-width:220px}
.mpd{font-size:10px;letter-spacing:.08em;color:var(--muted);margin-bottom:4px}
.mpt{color:var(--ink2);margin-bottom:8px;font-size:12px}
.mpa{color:var(--accent);font-size:10px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--accent)}
.leaflet-control-attribution{display:none!important}
/* Song Packager */
.pkg-drop{border:1px dashed var(--bm);background:var(--bg);border-radius:var(--r);padding:28px 16px;text-align:center;cursor:pointer;transition:all .15s;margin-top:6px}
.pkg-drop:hover,.pkg-drop.over{border-color:var(--accent);background:var(--al)}
.pkg-drop.filled{border-style:solid;border-color:var(--accent);background:var(--al)}
.pkg-drop-icon{font-size:24px;margin-bottom:6px}
.pkg-drop-label{font-size:11px;color:var(--muted);letter-spacing:.04em;word-break:break-all}

/* Dark mode */
body.dark{
  --bg:#171412;--surface:#1f1b18;--ink:#f0ece6;--ink2:#c4bbb4;
  --accent:#e07845;--al:#2a1f17;--ad:#c4622d;
  --muted:#7a6f68;--border:rgba(240,236,230,0.08);--bm:rgba(240,236,230,0.15);
}
body.dark #splash{background:var(--bg)}
body.dark .sbs{color:var(--ink);border-color:var(--bm)}
body.dark input[type=text],body.dark input[type=email],body.dark input[type=number],body.dark select,body.dark textarea{background:var(--bg);color:var(--ink);border-color:var(--bm)}
body.dark input:focus,body.dark select:focus,body.dark textarea:focus{background:#1a1511;border-color:var(--accent)}
body.dark .wk{background:#2a2420;border-color:#3d3530;color:#6b5f58}
body.dark .wk:hover{background:#332b26}.body.dark .wk.pressed{background:#443830}
body.dark .bk{background:#0d0b09}
body.dark .pkg-drop{background:var(--bg)}

/* Dark mode toggle */
.dm-toggle{background:none;border:1px solid var(--bm);border-radius:20px;cursor:pointer;display:flex;align-items:center;gap:6px;padding:5px 10px;font-family:var(--sans);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);transition:all .2s;white-space:nowrap}
.dm-toggle:hover{border-color:var(--accent);color:var(--accent)}
.dm-toggle .dm-icon{font-size:13px;line-height:1}

/* Context switcher */
.ctx-bar{display:flex;gap:8px;margin-bottom:32px;padding-bottom:24px;border-bottom:1px solid var(--border)}
.ctx-btn{flex:1;padding:10px 8px;border:1px solid var(--bm);background:var(--surface);border-radius:var(--r);font-family:var(--sans);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink2);cursor:pointer;transition:all .18s;font-weight:400}
.ctx-btn:hover{border-color:var(--accent);color:var(--accent)}
.ctx-btn.active{background:var(--ctx-accent,var(--accent));color:#fff;border-color:var(--ctx-accent,var(--accent));font-weight:500}
.ctx-label{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.ctx-cards{display:none}.ctx-cards.active{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}

/* Context color schemes */
body.ctx-artist{--accent:#8b3a8b;--al:#f9f0f9;--ad:#6d2c6d}
body.ctx-artist.dark{--accent:#c47ec4;--al:#2a152a;--ad:#8b3a8b}
body.ctx-student{--accent:#2563a8;--al:#eef4fc;--ad:#1a4d8f}
body.ctx-student.dark{--accent:#5b9fd4;--al:#0f1f33;--ad:#2563a8}

/* What's new strip */
.whats-new{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:14px 18px;margin-bottom:28px;display:flex;align-items:center;gap:14px}
.wn-badge{background:var(--accent);color:#fff;font-size:9px;letter-spacing:.14em;text-transform:uppercase;padding:3px 8px;border-radius:2px;flex-shrink:0;font-weight:500}
.wn-items{flex:1;overflow:hidden}
.wn-item{font-size:12px;color:var(--ink2);line-height:1.5}
.wn-item span{color:var(--muted);font-size:11px;margin-left:6px}

/* About page */
#p-about .ab-hero{font-family:var(--serif);font-size:clamp(22px,3vw,32px);font-weight:300;line-height:1.4;color:var(--ink);margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--border)}
#p-about .ab-hero em{color:var(--accent);font-style:italic}
#p-about .ab-body{font-size:13px;color:var(--ink2);line-height:1.95;max-width:640px}
#p-about .ab-body p{margin-bottom:18px}
#p-about .ab-body strong{color:var(--ink);font-weight:500}
#p-about .ab-stat{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin:32px 0}
#p-about .ab-stat-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px;text-align:center}
#p-about .ab-stat-n{font-family:var(--serif);font-size:36px;font-weight:300;color:var(--accent);line-height:1}
#p-about .ab-stat-l{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:4px}

/* PWA install prompt */
.pwa-bar{display:none;position:fixed;bottom:16px;right:16px;z-index:500;background:var(--surface);border:1px solid var(--bm);border-radius:var(--r);padding:14px 18px;box-shadow:0 8px 32px rgba(0,0,0,.12);max-width:280px;animation:ri .3s ease}
.pwa-bar.show{display:block}
.pwa-bar p{font-size:12px;color:var(--ink2);line-height:1.6;margin-bottom:10px}
.pwa-bar strong{color:var(--ink);font-weight:500;display:block;margin-bottom:4px}
.pwa-btns{display:flex;gap:8px}
.pwa-install{background:var(--accent);color:#fff;border:none;border-radius:var(--r);padding:8px 14px;font-family:var(--sans);font-size:11px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;font-weight:500}
.pwa-dismiss{background:none;border:none;color:var(--muted);font-size:11px;cursor:pointer;font-family:var(--sans);padding:8px}

/* Song Packager timeline */
.pkg-step{margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--border)}
.pkg-step-label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;font-weight:500}
.pkg-tl-wrap{margin-bottom:6px}
.pkg-tl-track{height:56px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);display:flex;overflow:hidden;position:relative}
.pkg-tl-leadin{background:rgba(196,98,45,0.1);border-right:2px solid var(--accent);display:flex;align-items:center;justify-content:center;flex-shrink:0;min-width:8px;transition:width .3s ease;position:relative}
.pkg-tl-audio{flex:1;background:rgba(196,98,45,0.2);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.pkg-tl-tail{background:rgba(196,98,45,0.1);border-left:2px solid var(--accent);display:flex;align-items:center;justify-content:center;flex-shrink:0;min-width:8px;transition:width .3s ease}
.pkg-tl-tag{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);writing-mode:vertical-rl;opacity:.7}
.pkg-tl-wave{position:absolute;inset:0;width:100%;height:100%}
.pkg-tl-filename{font-size:10px;color:var(--accent);letter-spacing:.06em;font-weight:500;position:relative;z-index:1;background:rgba(253,240,232,0.7);padding:2px 8px;border-radius:2px;max-width:80%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.dark .pkg-tl-filename{background:rgba(42,31,23,0.8)}
.pkg-tl-markers{display:flex;justify-content:space-between;padding:4px 2px 0;font-size:10px;color:var(--muted)}
