/* CD Creator : aperçu en haut, barre d'actions, onglets de réglages en dessous (textes sur deux colonnes). */
#app.studio.cd{flex-direction:column;overflow:auto;background:#c0c0c0;}
.cd-barre{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:4px 8px;border-bottom:1px solid #808080;font:11px Arial;flex:none;}
.cd-barre label{display:flex;align-items:center;gap:4px;margin:0;}
.cd-barre select{font:11px Arial;width:auto!important;display:inline-block;}
#cd-mise-en-page>label+select,#cd-mise-en-page>select{margin-right:6px;}
#studio-barre-apercu{flex:none;}
.cd-apercu{flex:none!important;height:max(280px,46vh);overflow:auto;flex-direction:row!important;flex-wrap:wrap;justify-content:center;align-items:flex-start!important;padding:12px;background:#808080;}
#cd-actions{justify-content:center;background:#c0c0c0;border-top:1px solid #fff;}
#cd-onglets{display:flex;flex-wrap:wrap;gap:1px;padding:6px 6px 0;flex:none;}
#cd-onglets .s-onglet{font:11px Arial;color:#000;}
#cd-panneaux{flex:none;margin:0 6px 8px;border:2px solid;border-color:#fff #808080 #808080 #fff;background:#c0c0c0;padding:8px 10px;font:11px Arial;}
.cd-panneau fieldset{border:2px groove #dfdfdf;padding:6px 8px 8px;margin:0 0 8px;min-width:0;}
.cd-panneau legend{padding:0 3px;}
.cd-panneau label{display:block;margin:6px 0 2px;}
.cd-panneau input[type=text],.cd-panneau input[type=number],.cd-panneau select,.cd-panneau textarea{width:100%;font:11px Arial;background:#fff;border:2px inset #808080;padding:3px 4px;}
.cd-panneau textarea{min-height:120px;resize:vertical;font-family:'Courier New',monospace;}
.cd-panneau input[type=range]{width:100%;}
.cd-aide{margin:4px 0 8px;font-size:11px;color:#202020;}
.cd-rangee{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px;margin-bottom:8px;}
.cd-rangee>.s-ligne{flex:0 1 auto;}.cd-rangee>.s-ligne>*{flex:0 0 auto;}
.cd-libre{border-top:1px solid #808080;border-bottom:1px solid #fff;padding:6px 0;}
.cd-2col{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;align-items:start;margin-bottom:8px;}
.cd-3col{display:grid;grid-template-columns:repeat(3,1fr);gap:0 12px;}
.cd-champ{min-width:0;}
.cd-champ-titre{float:right;}.cd-champ-titre label{margin:6px 0 0;font-size:10px;color:#404040;}
.cd-cases{display:flex;flex-wrap:wrap;gap:2px 16px;}.cd-cases label{margin:2px 0;}
.cd-colonne{min-width:0;display:flex;flex-direction:column;gap:2px;}.cd-colonne .s-btn{align-self:flex-start;margin-top:6px;}
/* Tracklist ligne par ligne */
.cd-tracklist{border:2px inset #808080;background:#fff;display:flex;flex-direction:column;min-width:0;}
.cd-tl-tete{display:flex;justify-content:space-between;align-items:center;padding:4px 6px;background:#dfdfdf;border-bottom:1px solid #808080;}
.cd-tl-total{font-family:'Courier New',monospace;color:#006000;font-weight:bold;}
.cd-tl-liste{max-height:260px;overflow:auto;}
.cd-tl-liste .cd-aide{padding:6px;}
.cd-tl-ligne{display:flex;align-items:center;gap:3px;padding:2px 4px;border-bottom:1px dotted #c0c0c0;}
.cd-tl-num{width:22px;flex:none;text-align:right;color:#808080;font-family:'Courier New',monospace;}
.cd-panneau .cd-tl-ligne input.cd-tl-titre{flex:1;min-width:0;border:1px solid transparent;background:transparent;padding:2px;}
.cd-panneau .cd-tl-ligne input.cd-tl-duree{width:52px;flex:none;border:1px solid transparent;background:transparent;padding:2px;text-align:right;font-family:'Courier New',monospace;}
.cd-panneau .cd-tl-ligne input:focus{border:1px solid #000080;background:#fff;outline:none;}
.cd-mini{width:20px;height:18px;padding:0;display:inline-flex;align-items:center;justify-content:center;flex:none;}
.cd-tl-pied{display:flex;gap:4px;padding:4px;border-top:1px solid #808080;background:#dfdfdf;}
.cd-panneau .cd-tl-pied input.cd-tl-titre-neuf{flex:1;min-width:0;width:auto;}
.cd-panneau .cd-tl-pied input.cd-tl-duree-neuve{width:62px;flex:none;}
.cd-tl-ajouter{width:26px;padding:0;display:inline-flex;align-items:center;justify-content:center;}
@media (max-width:700px){
  .cd-2col,.cd-3col{grid-template-columns:1fr;}
  .cd-apercu{height:auto;max-height:60vh;}
  #app.studio.cd{height:auto;}
}
/* Onglet Cover : vignettes, curseurs avec valeur, boutons collés */
.cd-vignettes{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px;}
.cd-vignette{width:84px;height:84px;padding:2px;background:#fff;border:2px solid;border-color:#808080 #fff #fff #808080;cursor:pointer;display:flex;align-items:center;justify-content:center;font:11px Arial;}
.cd-vignette img{max-width:100%;max-height:100%;display:block;}
.cd-vignette.on{outline:2px solid #000080;outline-offset:1px;}
.cd-importer{background:#c0c0c0;border-color:#fff #808080 #808080 #fff;white-space:normal;}
.cd-curseur{display:flex;align-items:center;gap:8px;margin:6px 0;}
.cd-libelle{width:78px;flex:none;}
.cd-curseur input[type=range]{flex:1;min-width:80px;max-width:260px;}
.cd-valeur{width:62px;flex:none;font-family:'Courier New',monospace;}
.cd-segments{display:inline-flex;}.cd-segments .s-btn{margin-left:-2px;}.cd-segments .s-btn.on{border-color:#808080 #fff #fff #808080;background:#d8d8d8;font-weight:bold;}
.cd-petit{padding:1px 6px!important;flex:none!important;}
.cd-tourne{animation:cd-tourner 3s linear infinite;border-radius:50%;}
@keyframes cd-tourner{to{transform:rotate(360deg);}}
@media (prefers-reduced-motion:reduce){.cd-tourne{animation-duration:12s;}}
.et-face canvas.cd-rond{box-shadow:none;filter:drop-shadow(3px 3px 0 #000);}
.cd-apercu .et-face[hidden]{display:none;}
#cd-onglets .s-onglet{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;}
.cd-carte{max-width:620px;}
.cd-carte-tete{display:flex;align-items:baseline;gap:18px;margin:2px 0 8px;}
.cd-grand{font-size:14px;}
.cd-vos{color:#000080;font-weight:bold;}
.cd-vignette{position:relative;width:96px;height:96px;}
.cd-px{position:absolute;left:0;right:0;bottom:0;background:rgba(255,255,255,.85);font:10px Arial;text-align:center;}
.cd-importer{flex-direction:column;gap:4px;}
.cd-icone{width:24px;height:22px;padding:0!important;display:inline-flex;align-items:center;justify-content:center;flex:none!important;}
.cd-2col.cd-seul{grid-template-columns:1fr;}
.cd-colonne[hidden]{display:none;}
@media (max-width:700px){#cd-onglets{flex-wrap:nowrap;overflow-x:auto;}#cd-onglets .s-onglet{flex:none;}}
.cd-tl-total.cd-trop{color:#c00000;}
/* L'aperçu reste visible pendant qu'on règle les onglets (écrans assez hauts) */
@media (min-width:701px) and (min-height:700px){
  .cd-apercu{position:sticky;top:0;z-index:3;height:max(260px,40vh);box-shadow:0 2px 0 #404040;}
}
.cd-panneau [hidden],#cd-mise-en-page [hidden]{display:none!important;}
