:root{color-scheme:dark;--bg:#090a12;--surface:#11121e;--surface2:#171626;--line:#2a283b;--purple:#a88cff;--muted:#a6a3b7;--ink:#f5f3ff}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.mc-studio-voix{margin:0;background:radial-gradient(ellipse at 50% 0%,rgba(107,70,193,.14),transparent 45%),#090a12;color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",sans-serif;min-height:100vh}
button,input,select{font:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
.voice-shell{width:min(1160px,calc(100% - 30px));margin:20px auto 85px}
.voice-hero{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:38px;border:1px solid #312647;border-radius:25px;background:linear-gradient(125deg,#201936,#11121c 65%);margin-bottom:16px;overflow:hidden}
.voice-hero .hero-copy{flex:1;max-width:760px}
.eyebrow{font-size:.7rem;letter-spacing:.17em;font-weight:850;color:#c6b6ff}
.voice-hero h1{font-size:clamp(2rem,5vw,3.7rem);line-height:1.14;letter-spacing:-.045em;margin:12px 0}
.voice-hero h1 em{font-style:normal;color:#b9a4ff}
.voice-hero p{font-size:1rem;line-height:1.75;color:#c5bfd6;max-width:720px;margin:0}
.hero-icon{flex:0 0 200px;height:140px;display:grid;place-items:center;background:rgba(130,85,255,.09);border-radius:24px}
.hero-icon svg{width:160px}
.audio-tool-navigation{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin-bottom:20px}
.audio-tool-navigation a{text-decoration:none;display:flex;gap:9px;align-items:center;justify-content:center;min-height:60px;padding:12px 15px;border-radius:15px;border:1px solid #302b42;background:#131420;color:#d8d5e5;font-weight:800;text-align:center;line-height:1.3;font-size:.89rem}
.audio-tool-navigation a span{font-size:1.4rem;color:#b5a1fa}
.audio-tool-navigation a.active{border-color:#aa86ff;background:#231d36;color:#f3eaff}
.surface{background:linear-gradient(160deg,#171725,#10111b);border:1px solid #322d43;border-radius:20px;padding:24px;margin-bottom:18px;min-width:0}
.section-top{display:flex;align-items:flex-start;gap:14px;margin-bottom:21px}
.section-top h2{font-size:1.25rem;margin:0 0 6px;line-height:1.3}
.section-top p{font-size:.87rem;line-height:1.55;margin:0;color:#b5b0c5}
.step{flex:0 0 39px;display:grid;place-items:center;width:39px;height:39px;border:1px solid #534277;border-radius:12px;background:#2a2143;color:#c4b1ff;font-size:.8rem;font-weight:950}
.workflow-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.13fr);gap:18px}
.workflow-grid>.surface{height:fit-content}
.access-panel{border:1px solid #463454;border-radius:16px;background:#191523;padding:18px 21px;margin-bottom:18px}
.access-panel strong{color:#ddc9ff}
.access-panel p{color:#c1bacd;margin:8px 0 0}
.access-panel a{color:#d2b8ff}
.upload-drop{min-height:270px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:11px;text-align:center;border:1.5px dashed #5a457b;background:#171528;border-radius:18px;padding:20px;cursor:pointer;transition:background .15s,border-color .15s}
.upload-drop.dragging,.upload-drop:hover{border-color:#b59aff;background:#24203b}
.drop-sign{width:63px;height:63px;border-radius:17px;background:#2a2245;color:#c5b3ff;display:grid;place-items:center;font-size:2rem}
.upload-drop strong{font-size:1.12rem}
.upload-drop small{color:#aca6be;line-height:1.4;font-size:.77rem}
.voice-file-preview{display:grid;gap:12px;margin-top:14px}
.voice-file-preview .file-info{display:flex;flex-direction:column;gap:4px;min-width:0}
.file-info strong{word-break:break-word}
.file-info small{color:#a7a0bc}
.voice-file-preview audio{width:100%;height:49px}
.quiet-btn{min-height:43px;padding:10px 15px;border:1px solid #504363;border-radius:12px;background:#1e1a2c;color:#dbcafa;font-weight:750}
.quiet-btn:hover{border-color:#bb9cff}
.primary-btn{padding:14px 21px;border:1px solid #b398ff;border-radius:14px;background:linear-gradient(140deg,#9e78ef,#7554da);color:#130c24;font-weight:950;font-size:.96rem;box-shadow:0 6px 25px #6343a526;min-height:52px}
.primary-btn:disabled{filter:grayscale(.8);opacity:.45;cursor:not-allowed}
.slider-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 24px}
.slider-field{display:block;min-width:0}
.slider-field>span{display:flex;justify-content:space-between;gap:6px;font-weight:760;font-size:.83rem;line-height:1.5}
.slider-field output{color:#cbb6ff;font-size:.78rem}
.slider-field input{width:100%;accent-color:#ac8eff;margin:12px 0 1px;min-height:21px}
.slider-field small{font-size:.7rem;color:#9691aa}
.switch-stack{display:grid;gap:10px;margin-top:20px}
.switch-row{display:flex;gap:12px;align-items:start;padding:12px 14px;background:#11111e;border-radius:13px;border:1px solid #2b283b;cursor:pointer}
.switch-row input{margin-top:4px;accent-color:#ab86ff;transform:scale(1.12)}
.switch-row span{display:flex;flex-direction:column;gap:4px}
.switch-row strong{font-size:.85rem}
.switch-row small{font-size:.74rem;line-height:1.5;color:#aaa4bd}
.format-select{margin:20px 0;display:flex;align-items:center;justify-content:space-between;gap:13px}
.format-select label{font-size:.85rem;font-weight:740}
.format-select select{background:#0e0d19;color:#f6f4fc;border:1px solid #4a4262;border-radius:11px;min-height:46px;padding:8px}
.reset-params{width:100%}
.voice-filters{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:19px}
.voice-filters button{border:1px solid #453950;background:#1b1728;color:#d0c7e8;border-radius:30px;min-height:40px;padding:8px 15px;font-size:.82rem;font-weight:780}
.voice-filters button.active{color:#160d2a;background:#b6a1ff;border-color:#b6a1ff}
.voice-presets-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.voice-preset{appearance:none;text-align:left;display:flex;flex-direction:column;gap:10px;border:1px solid #363044;border-radius:15px;background:#151522;padding:15px;min-height:136px;color:#f3edff}
.voice-preset .preset-top{display:flex;align-items:center;justify-content:space-between;gap:5px}
.voice-preset .preset-top span{color:#ae95f3;font-size:1.12rem}
.voice-preset .preset-check{border:1px solid #675785;border-radius:7px;width:24px;height:24px;display:grid;place-items:center;color:transparent}
.voice-preset strong{font-size:.91rem;line-height:1.4}
.voice-preset small{font-size:.73rem;color:#aaa6b9;line-height:1.5}
.voice-preset.selected{border-color:#b498ff;background:#27203b;box-shadow:inset 0 0 0 1px #ac8dff}
.voice-preset.selected .preset-check{background:#a98cff;color:#241837;font-weight:900}
.generate-row{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:23px;background:#11111c;border:1px solid #342c47;border-radius:16px;padding:16px 18px}
.generate-row>div{display:flex;flex-direction:column;gap:6px}
.generate-row strong{font-size:.92rem}
.generate-row small{color:#a9a4b6;font-size:.77rem}
.work-status{margin:13px 0 0;padding:9px 13px;line-height:1.5;color:#afa9bf;font-size:.82rem}
.work-status.error{color:#ffb3bd}
.work-status.success{color:#acdabe}
.voices-output-list,.voice-history-list{display:grid;gap:12px}
.voice-output-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:15px;background:#141421;border:1px solid #3c354c;border-radius:15px;min-width:0}
.voice-output-label{min-width:0;display:flex;flex-direction:column;gap:5px}
.voice-output-label strong{font-size:.93rem}
.voice-output-label small{color:#a6a0b8;font-size:.74rem}
.voice-output-actions{display:flex;align-items:center;gap:8px}
.voice-output-row audio{grid-column:1/-1;width:100%;margin-top:4px;height:42px}
.voice-output-actions .quiet-btn{white-space:nowrap;min-height:42px}
.voice-output-actions .primary-btn{min-height:42px;padding:8px 12px;font-size:.81rem}
.voice-history-panel details>summary{cursor:pointer;font-weight:800;list-style-position:inside}
.voice-history-panel details>summary span{display:inline-flex;flex-direction:column;gap:6px;vertical-align:middle}
.voice-history-panel details>summary small{font-size:.73rem;color:#ada6bd;font-weight:400}
.history-actions{display:flex;justify-content:flex-end;margin:18px 0}
.voice-history-item{border:1px solid #393449;border-radius:15px;padding:15px}
.voice-history-item>div:first-child{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:13px}
.voice-history-item strong{font-size:.83rem;word-break:break-word}
.voice-history-item small{color:#aaa4b7;font-size:.75rem}
.voice-history-item .quiet-btn{min-height:36px}
.voice-history-item .voices-output-list{margin-top:11px}
.voice-footnote{max-width:940px;margin:18px auto;color:#a59eb5;font-size:.79rem;line-height:1.7}
@media(max-width:960px){.voice-presets-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero-icon{flex-basis:140px}}
@media(max-width:750px){.workflow-grid{grid-template-columns:1fr}.voice-presets-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.voice-hero{padding:24px}.hero-icon{display:none}}
@media(max-width:530px){
  .voice-shell{width:calc(100% - 18px);margin-top:12px}
  .voice-hero{padding:20px;border-radius:17px}
  .voice-hero p{font-size:.88rem}
  .surface{padding:16px;border-radius:16px;margin-bottom:12px}
  .audio-tool-navigation{gap:5px}
  .audio-tool-navigation a{padding:9px 5px;min-height:66px;flex-direction:column;gap:4px;font-size:.71rem}
  .audio-tool-navigation a span{font-size:1.17rem}
  .section-top h2{font-size:1.08rem}
  .slider-grid{gap:14px}
  .voice-presets-grid{gap:9px}
  .voice-preset{padding:11px;min-height:132px}
  .voice-preset strong{font-size:.82rem}
  .generate-row{flex-direction:column;align-items:stretch}
  .generate-row .primary-btn{width:100%}
  .voice-output-row{grid-template-columns:1fr;gap:11px}
  .voice-output-actions{width:100%}
  .voice-output-actions button{flex:1}
  .format-select{flex-wrap:wrap}
  .voice-history-item>div:first-child{align-items:start;flex-direction:column}
  input:not([type="range"]):not([type="checkbox"]), select, textarea{font-size:16px!important}
}

/* V2 — aperçu prioritaire, waveform 10 s, mode rapide et suivi des rendus */
.waveform-studio{
  margin-top:20px;
  padding:16px;
  background:linear-gradient(155deg,#171229,#0e111e);
  border:1px solid rgba(185,154,255,.36);
  border-radius:18px;
  display:grid;
  gap:12px;
  min-width:0;
}
.waveform-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:7px}
.waveform-heading strong{font-size:.93rem;line-height:1.4;color:#f0e7ff}
.waveform-heading small{font-size:.74rem;color:#c4b0f3}
.waveform-canvas-wrap{
  position:relative;min-width:0;width:100%;
  height:150px;overflow:hidden;border-radius:14px;
  border:1px solid #574675;background:#100e1b;
}
.waveform-canvas-wrap canvas{
  width:100%;height:150px;display:block;
  touch-action:none;cursor:grab;outline:none;
}
.waveform-canvas-wrap canvas:active{cursor:grabbing}
.waveform-canvas-wrap canvas:focus-visible{outline:2px solid #c4b3ff;outline-offset:-3px}
.waveform-loading{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  padding:18px;text-align:center;background:rgba(15,13,25,.88);color:#d5c8fb;
  font-size:.82rem;pointer-events:none;line-height:1.5;
}
.waveform-timestamps{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:8px;align-items:end}
.waveform-timestamps label{
  display:flex;flex-direction:column;gap:5px;font-size:.75rem;font-weight:750;color:#d5c4f6;min-width:0
}
.waveform-timestamps input{
  min-width:0;width:100%;min-height:46px;padding:8px 10px;
  border:1px solid #54436c;border-radius:10px;
  background:#100f1e;color:#f4edff;font-size:16px!important;
}
.waveform-timestamps button{min-height:46px;padding:10px 13px}
.waveform-ab-controls{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.65fr) auto;
  gap:8px;align-items:center;min-width:0
}
.waveform-ab-controls button{min-height:48px;padding:9px 9px;font-size:.83rem}
.waveform-ab-controls .primary-btn{font-size:.85rem}
.voice-auto-preview,.preview-loop{
  font-size:.75rem;color:#d9c8f7;display:flex;align-items:center;gap:6px;
  cursor:pointer;
}
.voice-auto-preview input,.preview-loop input{width:18px;height:18px;accent-color:#ad90ff}
.preview-explain{
  font-size:.78rem;line-height:1.6;color:#b7b0cb;
  padding:10px 12px;border-radius:11px;background:#121324;border:1px solid rgba(178,147,255,.1);
  margin:0;overflow-wrap:anywhere
}
.preview-explain.error{color:#ffb0bf;border-color:rgba(255,112,135,.36)}
.preview-explain.success{color:#b9f4d1;border-color:rgba(132,204,159,.36)}
#voice-modified-player{width:100%;height:48px;margin:0}
.preview-loop{min-height:26px}
.voice-mode-controls{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;margin:0 0 18px;padding:5px;border-radius:12px;
  border:1px solid #3b3051;background:#100f1b
}
.voice-mode-controls button{
  min-height:45px;border:0;border-radius:9px;background:transparent;
  color:#b2a9c6;font-size:.85rem;font-weight:800
}
.voice-mode-controls button.active{background:#39305c;color:#f4eaff}
body.voice-quick-mode .slider-field:has(#speed),
body.voice-quick-mode .slider-field:has(#bass),
body.voice-quick-mode .slider-field:has(#treble),
body.voice-quick-mode .switch-stack,
body.voice-quick-mode .format-select,
body.voice-quick-mode .reset-params{display:none}
.voice-preset.is-previewing{box-shadow:inset 0 0 0 1px #d8c1ff,0 0 0 1px #b89af9}
.voice-preview-label{color:#e1c8ff!important;font-weight:800}
.voice-job-progress{
  margin:18px 0 0;padding:16px;border-radius:14px;
  border:1px solid rgba(175,145,244,.35);background:#181426;
  display:flex;flex-direction:column;gap:10px;
}
.voice-job-progress-bar{height:9px;border-radius:8px;background:#312c46;overflow:hidden}
.voice-job-progress-bar span{
  display:block;width:0%;height:100%;background:linear-gradient(90deg,#9c85ea,#ccaaff);
  transition:width .25s linear;
}
.voice-job-progress strong{font-size:.83rem;color:#dfd0fd}
.voice-job-progress .quiet-btn{width:100%}
@media (max-width:750px){
  .workflow-grid{grid-template-columns:1fr}
  .waveform-studio{padding:12px;gap:10px}
}
@media (max-width:460px){
  .waveform-timestamps{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 56px}
  .waveform-timestamps input{padding:8px 5px}
  .waveform-timestamps button{padding:8px 3px}
  .waveform-ab-controls{grid-template-columns:1fr 1.28fr;gap:7px}
  .waveform-ab-controls .voice-auto-preview{grid-column:1/-1;min-height:35px}
  .waveform-ab-controls button{font-size:.78rem}
  .waveform-heading strong{font-size:.86rem}
  .voice-preset small{font-size:.7rem}
}

/* Studio Voix V2.1 : préécoute toujours accessible, hors de la zone d'édition. */
.voice-floating-preview[hidden]{display:none!important}
.voice-floating-preview{
  position:fixed;
  left:50%;
  top:12px; /* La hauteur réelle du header est appliquée en JS. */
  bottom:auto;
  transform:translateX(-50%);
  z-index:119; /* Le menu du header global (z-index:120) reste prioritaire. */
  width:min(740px,calc(100vw - 24px));
  padding:10px 12px;
  border:1px solid rgba(196,165,255,.64);
  border-radius:18px;
  background:rgba(23,19,38,.96);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  box-shadow:0 14px 42px rgba(0,0,0,.53),0 0 0 1px rgba(90,73,145,.17);
  display:grid;
  grid-template-columns:minmax(0,1fr) 110px minmax(150px,180px);
  align-items:center;
  gap:9px;
}
.voice-floating-summary{display:flex;flex-direction:column;min-width:0;gap:4px;padding-left:5px}
.voice-floating-summary strong{font-size:.87rem;color:#f2ebff;white-space:nowrap}
.voice-floating-summary small{font-size:.74rem;color:#c4b6e6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.voice-floating-preview button{min-height:47px;font-size:.82rem;border-radius:12px;padding:9px 11px}
.voice-reset-toolbar{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:stretch;
  gap:9px;
  margin:0 0 8px;
}
.voice-reset-toolbar button{
  min-width:0;
  min-height:46px;
  padding:10px 12px;
  border-radius:11px;
  font-weight:750;
  font-size:.83rem;
  line-height:1.35;
  white-space:normal;
}
.voice-reset-toolbar .voice-undo-reset-button{
  color:#e7dcff;
  border:1px solid rgba(197,167,255,.55);
  background:rgba(88,60,129,.22);
}
.voice-reset-toolbar .voice-undo-reset-button:disabled{
  opacity:.47;
  cursor:not-allowed;
}
.voice-reset-feedback{
  font-size:.75rem;
  line-height:1.5;
  color:#bfb3d3;
  margin:0 0 18px;
}
@media(max-width:480px){
  .voice-reset-toolbar{gap:7px;}
  .voice-reset-toolbar button{padding:9px 7px;font-size:.74rem;}
  .voice-reset-feedback{font-size:.72rem;}
}
.voice-floating-preview .primary-btn{white-space:nowrap}
/* Barre désormais en haut : aucune marge supplémentaire sous les réglages. */
.voice-extra-effects{margin:17px 0 5px;display:grid;gap:10px}
body.voice-quick-mode .voice-extra-effects{display:none}
.voice-effects-group{
  border:1px solid rgba(185,162,239,.25);
  background:rgba(12,12,23,.64);
  border-radius:14px;
  padding:0 13px;
}
.voice-effects-group summary{
  min-height:54px;
  display:flex;align-items:center;justify-content:space-between;
  gap:8px;cursor:pointer;color:#e8dbff;
  font-size:.86rem;font-weight:850;padding:12px 2px;
  list-style:none;
}
.voice-effects-group summary::-webkit-details-marker{display:none}
.voice-effects-group summary:after{content:"⌄";color:#b9a0f8;font-size:1.3rem;transform:rotate(-90deg);transition:transform .12s}
.voice-effects-group[open] summary:after{transform:rotate(0)}
.voice-effects-group summary small{font-size:.69rem;font-weight:500;color:#b3a6cd;margin-left:auto}
.voice-effects-group .slider-grid{padding:10px 2px 19px}
.voice-effects-group .slider-field{padding-top:3px}
.voice-formants-setting{margin:3px 0 14px}
.voice-effects-warning{padding:0 4px;color:#b1a4c5;font-size:.73rem;line-height:1.65;margin:3px 0}
@media(max-width:750px){
  .voice-floating-preview{
    top:12px;
    bottom:auto;
    width:calc(100vw - 24px);
  }
}
@media(max-width:480px){
  .voice-floating-preview{
    padding:8px;gap:6px;border-radius:15px;
    grid-template-columns:minmax(0,1fr) 73px minmax(118px,1.3fr);
  }
  .voice-floating-summary{padding-left:2px}
  .voice-floating-summary strong{font-size:.75rem}
  .voice-floating-summary small{font-size:.67rem}
  .voice-floating-preview button{font-size:.72rem;padding:7px 6px;min-height:47px}
  .voice-effects-group{padding:0 10px}
  .voice-effects-group summary{font-size:.78rem}
  .voice-effects-group summary small{font-size:.65rem}
}
@media(prefers-reduced-motion:reduce){
  .voice-effects-group summary:after{transition:none}
}