/* SoundSplit : redesign « Analyser une piste » (handoff haute fidélité) */
:root{--bg:#0A0A0F;--surface:#0E0E14;--surface2:#111118;--surface3:#16161E;--accent:#7C5CFF;--accent2:#3DDC97;--accent3:#7C5CFF;--text:#ECECF1;--muted:#6B6B7A;--muted2:#8B8B9A;--border:rgba(255,255,255,.06);--border-a:rgba(167,139,250,.5);--green:#3DDC97;--blue:#38BDF8;--r:14px}
html,body{background:#0A0A0F!important;color:#ECECF1}
body,body *{font-family:'DM Sans',system-ui,sans-serif!important}
body{font-size:14px}
.orb,body::before,body::after,.upload-zone::after,.pcard.featured::before{display:none!important}
body *{box-shadow:none!important;text-shadow:none!important}
body *:not(input){background-image:none!important}
.feat-card:hover,.rcard:hover,.pcard:hover,.btn-analyze:hover,.btn-up:hover,.hist-item:hover,.play-btn:hover,.pbtn:hover,.nav-item:hover,.upload-zone:hover{transform:none!important}
.ds-mono,.ds-mono *,.fmt,.prog-pct,.p-time,.credits-chip,.credits-chip *,.plan-chip,#usage-text,.lyrics-box,.ds-sec-lbl,.ds-tc,.ds-model,#file-meta-display,.ds-meta,.sec-badge{font-family:'DM Mono',ui-monospace,monospace!important}
::selection{background:rgba(124,92,255,.35)}

/* ---------- Layout ---------- */
@media(min-width:901px){.app{grid-template-columns:232px 1fr!important;grid-template-rows:60px 1fr!important}}
.topbar{height:60px;padding:0 20px!important;border-bottom:1px solid rgba(255,255,255,.06)!important;background:#0A0A0F!important;display:flex!important;align-items:center;gap:24px;backdrop-filter:none!important}
.sidebar{background:#0A0A0F!important;border-right:1px solid rgba(255,255,255,.06)!important;padding:20px 12px!important;display:flex!important;flex-direction:column;gap:2px}
.main{padding:40px 48px 64px!important;background:transparent!important}
.main>div{max-width:1040px;margin-left:auto!important;margin-right:auto!important}
#panel-analyze>*:not(.panel-hidden)+*{margin-top:32px}

/* ---------- Header ---------- */
.logo{width:212px;flex:none;display:flex;align-items:center;gap:10px;font-size:16px!important;font-weight:700!important;letter-spacing:-.01em;color:#ECECF1!important}
.logo em{font-style:normal;color:inherit!important;-webkit-text-fill-color:currentColor!important}
.logo-mark{width:30px!important;height:30px!important;border-radius:8px!important;background:#7C5CFF!important;display:flex!important;align-items:center;justify-content:center;gap:2px;font-size:0!important}
.logo-mark i{display:block;width:2px;border-radius:1px;background:#fff}
.logo-mark i:nth-child(1){height:8px}.logo-mark i:nth-child(2){height:14px}.logo-mark i:nth-child(3){height:18px}.logo-mark i:nth-child(4){height:11px;opacity:.6}.logo-mark i:nth-child(5){height:6px;opacity:.6}
.topbar-center{margin-left:auto;flex:none!important;position:static!important;transform:none!important}
.credits-chip{height:32px;display:inline-flex!important;align-items:center;gap:10px;padding:0 12px!important;border-radius:8px!important;background:rgba(255,255,255,.03)!important;border:1px solid rgba(255,255,255,.06)!important;font-size:12px!important;color:#8B8B9A!important}
.credits-chip b{color:#ECECF1!important;font-weight:500}
.ds-seg{display:inline-flex;gap:3px}.ds-seg i{width:14px;height:4px;border-radius:2px;background:rgba(255,255,255,.08)}.ds-seg i.on{background:#3DDC97}
.topbar-right{display:flex!important;align-items:center;gap:12px}
.plan-chip{height:24px;display:inline-flex!important;align-items:center;padding:0 8px!important;border-radius:6px!important;border:1px solid rgba(255,255,255,.08)!important;background:transparent!important;color:#8B8B9A!important;font-size:11px!important;text-transform:uppercase;letter-spacing:.06em;cursor:pointer}
.btn-up{height:36px;padding:0 16px!important;border-radius:9px!important;background:#ECECF1!important;color:#0A0A0F!important;font-size:13px!important;font-weight:600!important;border:0!important;cursor:pointer;transition:background .15s}
.btn-up:hover{background:#fff!important}

/* ---------- Sidebar ---------- */
.s-label,.s-div,#nav-report{display:none!important}
.nav-item{height:36px;display:flex!important;align-items:center;gap:10px;padding:0 10px!important;border-radius:8px!important;color:#8B8B9A!important;font-size:14px!important;font-weight:400;border:0!important;background:transparent!important;transition:background .15s,color .15s;margin:0!important}
.nav-item::before,.nav-item::after{display:none!important}
.nav-item:hover{background:rgba(255,255,255,.04)!important;color:#ECECF1!important}
.nav-item.active{background:rgba(124,92,255,.12)!important;color:#ECECF1!important;font-weight:500}
.nav-item.active .nav-icon{color:#A78BFA}
.nav-icon{width:16px;height:16px;display:inline-flex!important;align-items:center;justify-content:center;font-size:0!important;flex:none;opacity:1!important}
.nav-icon svg,.ds-ic{width:16px;height:16px;display:block}
.ds-flex{flex:1;min-height:24px}
.sidebar-bottom{margin-top:14px!important;padding:0!important;border:0!important;position:static!important}
.usage-widget{padding:14px!important;border-radius:10px!important;background:#111118!important;border:1px solid rgba(255,255,255,.06)!important;display:flex;flex-direction:column;gap:10px}
.usage-row{display:flex;justify-content:space-between;align-items:center;font-size:12px!important;color:#8B8B9A!important;margin:0!important}
#usage-text{font-size:12px;color:#ECECF1;font-weight:400}
.usage-bar{height:4px!important;border-radius:2px!important;background:rgba(255,255,255,.06)!important;margin:0!important;overflow:hidden}
.usage-fill{background:#7C5CFF!important;border-radius:2px!important}
.ds-pro{font-size:12px;font-weight:500;color:#A78BFA;cursor:pointer;text-decoration:none;transition:color .15s}.ds-pro:hover{color:#C4B5FD}

/* ---------- En-tête de page ---------- */
.sec-hdr{display:block!important;margin:0 0 0!important}
#panel-analyze>.sec-hdr .sec-badge{display:none!important}
.sec-title{font-size:28px!important;font-weight:600!important;letter-spacing:-.02em;color:#ECECF1!important;line-height:1.2;-webkit-text-fill-color:currentColor!important}
.ds-sub{margin-top:8px;font-size:15px;color:#8B8B9A;line-height:1.5}
.sec-badge{display:inline-flex!important;margin-top:8px;padding:0!important;border:0!important;background:transparent!important;color:#8B8B9A!important;font-size:12px!important}

/* ---------- Zone de dépôt ---------- */
.upload-zone{position:relative;display:flex!important;flex-direction:column;align-items:center;gap:22px;padding:48px 32px 40px!important;border-radius:16px!important;border:1.5px dashed rgba(255,255,255,.12)!important;background:#0E0E14!important;text-align:center;cursor:pointer;transition:border-color .15s,background .15s!important;min-height:0!important}
.upload-zone:hover{border-color:rgba(167,139,250,.5)!important}
.upload-zone.drag-over{border-color:#A78BFA!important;background:rgba(124,92,255,.08)!important}
.upload-zone>*{margin:0!important}
.upload-icon{height:56px;display:flex!important;align-items:center;gap:3px;font-size:0!important;animation:none!important;filter:none!important}
.upload-icon span{width:3px;border-radius:2px;background:#A78BFA;display:block}
.upload-title{font-size:18px!important;font-weight:600!important;color:#ECECF1!important}
.upload-sub{font-size:14px!important;color:#8B8B9A!important;margin-top:-14px!important}
.upload-sub b{color:#A78BFA;font-weight:500}
.ds-btn{height:40px;display:inline-flex;align-items:center;gap:8px;padding:0 18px;border-radius:10px;background:#7C5CFF;color:#fff;font-size:14px;font-weight:600;border:0;cursor:pointer;transition:background .15s}
.ds-btn:hover,.upload-zone:hover .ds-btn{background:#8B6DFF}
.ds-btn svg{width:14px;height:14px}
.formats{display:block!important;font-size:11px!important;color:#6B6B7A!important;letter-spacing:.02em}
.ds-err{margin-top:10px;font-size:13px;color:#FF6B81}

/* ---------- Carte fichier ---------- */
.file-loaded,.analysis-progress,#results-section{border-radius:16px!important;border:1px solid rgba(255,255,255,.08)!important;background:#111118!important;padding:24px!important}
.file-loaded:not(.panel-hidden){display:flex!important;flex-direction:column;align-items:stretch!important;gap:20px}
.ds-fhead{display:flex;align-items:center;gap:14px;min-width:0}
.file-thumb,.ds-thumb{width:44px!important;height:44px!important;border-radius:10px!important;background:rgba(124,92,255,.14)!important;color:#A78BFA;display:flex!important;align-items:center;justify-content:center;font-size:0!important;flex:none}
.file-info,.ds-info{flex:1;min-width:0}
.file-name,.ds-name{font-size:15px!important;font-weight:600!important;color:#ECECF1!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.file-meta,.ds-meta{font-size:12px!important;color:#8B8B9A!important;margin-top:3px}
#waveform-anim{display:none!important}
.ds-wave{height:64px;display:flex;align-items:center;gap:2px}
.ds-wave i{flex:1;min-width:1px;border-radius:1px;background:rgba(255,255,255,.12);transition:background .15s}
.ds-wave i.on{background:#A78BFA}
.ds-ghost{height:32px;padding:0 12px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:transparent;color:#8B8B9A;font-size:13px;cursor:pointer;transition:color .15s,border-color .15s;flex:none}
.ds-ghost:hover{color:#ECECF1;border-color:rgba(255,255,255,.2)}
.ds-ffoot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:20px;border-top:1px solid rgba(255,255,255,.06)}
.ds-sum{font-size:13px;color:#8B8B9A}
.btn-analyze{height:40px!important;display:inline-flex!important;align-items:center;gap:8px;padding:0 18px!important;border-radius:10px!important;background:#7C5CFF!important;color:#fff!important;font-size:14px!important;font-weight:600!important;border:0!important;cursor:pointer;transition:background .15s!important;width:auto!important;margin:0!important;animation:none!important}
.btn-analyze:hover{background:#8B6DFF!important}
.btn-analyze:disabled{opacity:.4;cursor:not-allowed}

/* ---------- Traitement ---------- */
.analysis-progress:not(.panel-hidden){display:flex!important;flex-direction:column;gap:20px}
.prog-header{display:flex!important;align-items:center;gap:14px;margin:0!important}
.prog-title{flex:1;min-width:0;font-size:15px!important;font-weight:600!important;color:#ECECF1!important}
.prog-pct{font-size:13px!important;color:#A78BFA!important;font-weight:400!important;-webkit-text-fill-color:currentColor!important}
.main-prog-bar{display:none!important}
.main-prog-fill{background:#A78BFA!important}
.steps-list{display:flex!important;flex-wrap:wrap;gap:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.06);margin:0!important}
.step-item{display:flex!important;align-items:center;gap:8px;padding:0!important;background:transparent!important;border:0!important;font-size:13px!important;color:#6B6B7A!important;opacity:1!important}
.step-item::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.step-item .step-ic,.step-item .spinner{display:none!important}
.step-item.s-active{color:#ECECF1!important}
.step-item.s-done{color:#3DDC97!important}
#step-3,#step-4,#step-5{display:none!important}

/* ---------- Résultats ---------- */
#results-section>.sec-hdr{display:flex!important;align-items:center;gap:14px;margin-bottom:8px!important}
#results-section>.sec-hdr .sec-title{font-size:15px!important;letter-spacing:0;flex:1;min-width:0}
#results-section>.sec-hdr .sec-badge{margin:0;font-size:12px!important}
.ds-done{font-size:13px;font-weight:500;color:#3DDC97;flex:none}
.results-grid{display:block!important}
.results-grid>.rcard.fw{display:none!important}
.rcard{display:grid!important;grid-template-columns:120px 1fr auto;align-items:center;gap:16px;padding:12px 0!important;border:0!important;border-top:1px solid rgba(255,255,255,.05)!important;border-radius:0!important;background:transparent!important;margin:0!important}
.rcard:first-child{border-top:0!important}
.rcard-hdr{display:contents!important}
.rcard-type{order:1;display:flex!important;align-items:center;gap:10px;min-width:0}
.rcard-icon{width:8px!important;height:8px!important;min-width:8px;border-radius:2px!important;font-size:0!important;padding:0!important;border:0!important}
.rcard-icon.ic-p{background:#38BDF8!important}.rcard-icon.ic-g{background:#A78BFA!important}.rcard-icon.ic-b{background:#ECECF1!important}
.rcard-label{font-size:14px!important;font-weight:500!important;color:#ECECF1!important;white-space:nowrap}
.rcard-sub{display:none!important}
.audio-player{order:2;display:flex!important;align-items:center;gap:12px;min-width:0;padding:0!important;background:transparent!important;border:0!important;margin:0!important}
.player-ctrls{display:contents!important}
.play-btn{order:1;width:32px!important;height:32px!important;min-width:32px;border-radius:50%!important;border:1px solid rgba(255,255,255,.12)!important;background:transparent!important;color:#ECECF1!important;font-size:10px!important;display:flex!important;align-items:center;justify-content:center;padding:0!important;cursor:pointer;transition:border-color .15s}
.play-btn:hover{border-color:rgba(255,255,255,.3)!important}
.player-wave{order:2;flex:1;min-width:60px;height:34px!important;display:flex!important;align-items:center;gap:2px;margin:0!important;cursor:pointer}
.pwb{flex:1;min-width:1px;border-radius:1px!important;background:rgba(255,255,255,.12)!important}
#pw-1 .pwb.pl{background:#38BDF8!important}#pw-2 .pwb.pl{background:#A78BFA!important}
.p-time{order:3;font-size:12px!important;color:#6B6B7A!important;min-width:32px}
#pt-1,#pt-2{order:3}#pd-1,#pd-2{order:5}
.p-slider{order:4;width:90px!important;flex:none;accent-color:#A78BFA;height:3px}
.dl-btn{order:3;background:transparent!important;border:0!important;padding:0!important;color:#A78BFA!important;font-size:13px!important;font-weight:500!important;cursor:pointer;white-space:nowrap;transition:color .15s}
.dl-btn:hover{color:#C4B5FD!important}
.lyrics-box{order:4;grid-column:1/-1;max-height:220px;overflow:auto;padding:14px 16px!important;border-radius:10px!important;background:#0E0E14!important;border:1px solid rgba(255,255,255,.06)!important;font-size:12.5px!important;line-height:1.7!important;color:#C9C9D3!important;white-space:pre-wrap}
.lyrics-box:empty{display:none}
.ds-rfoot{display:flex!important;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:16px!important;padding-top:20px;border-top:1px solid rgba(255,255,255,.06);text-align:left!important}
.ds-rfoot .btn-analyze{height:36px!important;background:transparent!important;border:1px solid rgba(255,255,255,.1)!important;color:#ECECF1!important;font-size:13px!important;font-weight:500!important}
.ds-rfoot .btn-analyze:hover{border-color:rgba(255,255,255,.2)!important;background:transparent!important}
.ds-note{font-size:12px;color:#6B6B7A}
@media(max-width:700px){.rcard{grid-template-columns:1fr auto}.audio-player{grid-column:1/-1;order:5}.p-slider{display:none}}

/* ---------- Inclus / Bientôt ---------- */
#welcome-section:not(.panel-hidden){display:flex!important;flex-direction:column;gap:32px}
.ds-sec-lbl{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#6B6B7A;margin-bottom:12px}
.ds-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:12px}
.ds-card{display:flex;flex-direction:column;gap:16px;padding:20px;border-radius:14px;background:#111118;border:1px solid rgba(255,255,255,.08)}
.ds-card h3{margin:0;font-size:15px;font-weight:600;color:#ECECF1}
.ds-card p{margin:4px 0 0;font-size:13px;color:#8B8B9A;line-height:1.5}
.ds-prev{display:flex;flex-direction:column;gap:8px}
.ds-prev>div{display:flex;align-items:center;gap:10px;font-size:12px;color:#8B8B9A}
.ds-prev>div>span:first-child{width:64px;flex:none}
.ds-bar{flex:1;height:6px;border-radius:3px;opacity:.85}
.ds-tc{color:#6B6B7A;font-size:12px;width:44px;flex:none}
.ds-model{font-size:11px;color:#6B6B7A}
.ds-soon{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:1px;border-radius:14px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.06);overflow:hidden}
.ds-soon>div{padding:18px;background:#0A0A0F}
.ds-soon b{display:block;font-size:14px;font-weight:600;color:#C9C9D3}
.ds-soon span{display:block;margin-top:4px;font-size:12.5px;color:#7A7A89;line-height:1.5}
.ds-notify{display:inline-block;margin-top:14px;font-size:13px;font-weight:500;color:#A78BFA;text-decoration:none;cursor:pointer}.ds-notify:hover{color:#C4B5FD}

/* ---------- Autres panneaux : mêmes tokens ---------- */
.pcard,.hist-item,.mo-box,.feat-card{background:#111118!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:14px!important}
.pcard.featured{border-color:#7C5CFF!important}
.pbadge{background:#7C5CFF!important;color:#fff!important}
.pbtn{border-radius:10px!important;border:1px solid rgba(255,255,255,.1)!important;background:transparent!important;color:#ECECF1!important}
.pbtn-sol{background:#7C5CFF!important;border-color:#7C5CFF!important;color:#fff!important}
.h-thumb{background:rgba(124,92,255,.14)!important;color:#A78BFA}
.toast{background:#16161E!important;border:1px solid rgba(255,255,255,.1)!important;color:#ECECF1!important;border-radius:10px!important}
.mo{background:rgba(5,5,8,.7)!important;backdrop-filter:none!important}
input,select,textarea{caret-color:#A78BFA}
@media(max-width:600px){.main{padding:24px 16px 48px!important}.logo{width:auto}.credits-chip>span:first-child{display:none}}
/* correctifs de mise en page */
.main{display:block!important}
@media(min-width:901px){.app{height:100vh!important;min-height:0!important;overflow:hidden}.main{overflow-y:auto!important;min-height:0}.sidebar{overflow-y:auto}}
@media(max-width:900px){.sidebar{display:none!important}}
.upload-zone.panel-hidden,.sec-hdr.panel-hidden,.panel-hidden{display:none!important}
.steps-list{flex-direction:row!important}#panel-analyze>*:not(:first-child){margin-top:32px}.rcard .dl-btn{grid-column:3}@media(max-width:700px){.rcard .dl-btn{grid-column:2}}
@media(max-width:900px){.app{grid-template-columns:minmax(0,1fr)!important}.main,.topbar{min-width:0}}@media(max-width:600px){.topbar{gap:10px;padding:0 12px!important}.plan-chip{display:none!important}.logo{width:auto!important}.btn-up{padding:0 12px!important}.upload-zone{padding:36px 16px 32px!important}}
.btn-up{white-space:nowrap}@media(max-width:420px){.logo{font-size:0!important;gap:0}}
