/* SoulOne LIVE 2.1 | Hybrid Pro across all four musician views.
   Safe visual layer: no display:none for transport, mixer, navigation, or audio.
   The existing views and audio graph stay mounted and retain their handlers. */
:root{
  --slp-deep:#0d1f33;
  --slp-navy:#142b44;
  --slp-mid:#20445f;
  --slp-ice:#f2f6fa;
  --slp-blue:#2586d2;
  --slp-accent:#66c1eb;
  --slp-stroke:#d4e1eb;
  --slp-muted:#a1bdd4;
}
html:not(.soulone-ipad-classic) body>.app{
  --live-stage-gap:9px;
  background:transparent;
}
body>.app .panel{box-shadow:0 4px 18px rgba(16,46,74,.07)}
body>.app .top.stage-header{
  border-color:#dae5ee;
  background:linear-gradient(115deg,#fff 0%,#fff 70%,#f7fafc 100%);
  box-shadow:0 4px 15px rgba(13,45,74,.045);
}
body>.app .stage-identity .song-head{
  border-left-color:#dfebf3;
}
body>.app .stage-center .stage-field--key{
  border-color:#e1eaf2;
}
body>.app .stage-center button{
  border:1px solid #d2e2ee;
  background:#f2f7fb;
  color:#235c87;
  box-shadow:none;
  font-weight:800;
}
body>.app .stage-center button:hover:not(:disabled){background:#e2eff9;border-color:#add1ea}
body>.app .stage-center button:focus-visible{outline:2px solid #5bb6f0;outline-offset:2px}
body>.app .sl-desktop-views .sl-mode-group,
body>.app .sl-mobile-view-nav .sl-mobile-presets{
  border-color:#d8e4ed;
  background:#e8f0f6;
  box-shadow:none;
}
body>.app>.stage-footer-note>.protected{color:#57768c}
body>.app .live-workspace .timeline{
  background:linear-gradient(115deg,#13293e,#1b3953)!important;
  color:#f6fafd!important;
  border:1px solid #294b64!important;
  box-shadow:0 7px 22px rgba(9,34,58,.11)!important;
  border-radius:13px;
}
body>.app .live-workspace .timeline .heading .eyebrow{
  color:#e5f5ff!important;
  font-size:11px;
  letter-spacing:.1em;
  font-weight:870;
}
body>.app .live-workspace .timeline #songNote,
body>.app .live-workspace .timeline .small-note{color:#a4c4d9!important}
body>.app .live-workspace .timeline .section-nav{
  background:#0b1f33a3;
  border:1px solid #40607975;
  border-radius:10px;
  padding:3px;
  gap:3px;
}
body>.app .live-workspace .timeline .section-nav .section-label{
  color:#f3f9ff!important;
  font-size:10px;
  font-weight:840;
  padding:0 8px;
}
body>.app .live-workspace .timeline .section-nav button{
  min-height:31px;
  border:1px solid transparent;
  background:#ffffff16;
  color:#d9ecfb;
  box-shadow:none;
  border-radius:7px;
  font-size:11px;
  font-weight:750;
  padding:5px 9px;
}
body>.app .live-workspace .timeline .section-nav button:hover:not(:disabled){
  background:#ffffff2b;
  border-color:#ffffff32;
}
body>.app .live-workspace .timeline .section-nav button.active{
  background:#2675aa;border-color:#58a3d5;color:white;
}
body>.app .live-workspace .timeline .segments{
  margin-top:4px;
}
body>.app .live-workspace .timeline .segment{
  font-weight:820;
  letter-spacing:.02em;
  text-shadow:0 1px 2px #0003;
}
body>.app .live-workspace .timeline .stems-visual{
  border-color:#45627d;
  background:#eaf2f9;
}
body>.app .live-workspace .timeline .wave-name{
  background:#eaf2f9;
  color:#284c6c;
  border-right-color:#cbdde9;
  font-weight:790;
}
body>.app .live-workspace .timeline .wave-row{
  border-bottom-color:#d8e6f0;
}
body>.app .live-workspace .timeline .time-numbers{
  color:#afc8da!important;
  font-size:10px;
  font-variant-numeric:tabular-nums;
}
body>.app .live-workspace .progress-panel{
  background:linear-gradient(105deg,#102238 0%,#17324d 56%,#204968 100%)!important;
  border:1px solid #335875!important;
  color:#eef8ff;
  border-radius:13px;
  box-shadow:0 7px 22px rgba(12,44,72,.13)!important;
}
body>.app .live-workspace .progress-panel .clock{
  color:#fff!important;
  font-variant-numeric:tabular-nums;
  font-weight:870;
  letter-spacing:-.055em;
}
body>.app .live-workspace .progress-panel .clock small{
  color:#bed3e3!important;
  font-weight:680;
}
body>.app .live-workspace .progress-panel .transport button{
  background:#ffffff17;
  border:1px solid #7094b24a;
  color:#e7f4ff;
  box-shadow:none;
  border-radius:9px;
  filter:none;
  animation:none!important;
  transition:background .12s ease,border-color .12s ease;
}
body>.app .live-workspace .progress-panel .transport button:hover:not(:disabled){
  background:#ffffff31;
  border-color:#82b8df7a;
  filter:none;
}
body>.app .live-workspace .progress-panel .transport .start,
body>.app .live-workspace .progress-panel .transport .primary{
  background:#2589d4!important;
  border-color:#4ba6e9!important;
  color:#fff!important;
  box-shadow:0 3px 12px rgba(10,126,222,.2)!important;
}
body>.app .live-workspace .progress-panel .transport .start:hover:not(:disabled){
  background:#379de6!important;
}
body>.app .live-workspace .progress-panel .transport button:focus-visible{
  outline:2px solid #a5dbff;outline-offset:2px;
}
body>.app .live-workspace .progress-panel input[type="range"]{
  accent-color:#4ab0ed;
}
body>.app .live-workspace .download-panel{
  border:1px solid #bdd5e7;
  background:#f3f9fd;
  box-shadow:none;
}
body>.app .live-workspace .download-panel button{
  background:#0f78c1;color:#fff;border-color:#0f78c1;
}
body>.app>.meter-title{
  color:#284b66;
  padding-left:7px!important;
  padding-right:7px!important;
}
body>.app>.meter-title strong{
  font-weight:840;
  color:#244963;
  letter-spacing:-.015em;
}
body>.app>.meter-title .small-note{color:#7892a6}
body>.app>#mixer.clean-mixer{
  background:linear-gradient(145deg,#13293f 0%,#1b3852 100%)!important;
  border:1px solid #2d4a65!important;
  border-radius:15px;
  box-shadow:0 8px 25px rgba(13,45,71,.14)!important;
}
body>.app>#mixer.clean-mixer .clean-group{
  border:1px solid #ffffff25!important;
  background:#ffffff0e!important;
  box-shadow:none!important;
  border-radius:10px;
}
body>.app>#mixer.clean-mixer .clean-group h3{
  color:#b5d3e6!important;
  font-size:10px;
  font-weight:830;
  letter-spacing:.12em;
  text-transform:uppercase;
}
body>.app>#mixer.clean-mixer .strip{
  border:1px solid #bdd2e0!important;
  border-radius:9px;
  box-shadow:none;
  background:linear-gradient(180deg,#fff,#f3f7fb)!important;
}
body>.app>#mixer.clean-mixer .striphead{
  background:linear-gradient(180deg,#dcebf6,#f1f7fb)!important;
  color:#25475e!important;
  border-top:3px solid #4f97cb;
  border-bottom:1px solid #cddce8;
}
body>.app>#mixer.clean-mixer .striphead .track-title{
  color:#27445f;
  font-weight:820;
  letter-spacing:-.015em;
}
body>.app>#mixer.clean-mixer .striphead .route-chip{
  background:#d9eaf8;
  border:1px solid #bfdaee;
  color:#477290;
}
body>.app>#mixer.clean-mixer .clean-group--monitor .striphead{
  border-top-color:#df9648;
}
body>.app>#mixer.clean-mixer .clean-group--music .striphead{
  border-top-color:#519fcb;
}
body>.app>#mixer.clean-mixer .clean-group--master .strip.master .striphead{
  background:linear-gradient(180deg,#1b415e,#14324b)!important;
  border-top:3px solid #64b9e8;
  border-bottom-color:#204c6b;
  color:#f3faff!important;
}
body>.app>#mixer.clean-mixer .clean-group--master .striphead .track-title{
  color:#f3faff!important;
}
body>.app>#mixer.clean-mixer .clean-group--master .striphead .route-chip{
  background:#ffffff20;color:#e7f6ff;border-color:#ffffff25;
}
body>.app>#mixer.clean-mixer .strip .db{
  color:#2f5572;
  font-variant-numeric:tabular-nums;
  font-weight:800;
}
body>.app>#mixer.clean-mixer .strip .dual button{
  border:1px solid #d1dfec;
  background:#f3f8fb;
  color:#2d506e;
  box-shadow:none;
  border-radius:6px;
}
body>.app>#mixer.clean-mixer .strip .dual button.muted{
  color:#fff;background:#d14f60;border-color:#c3495b;
}
body>.app>#mixer.clean-mixer .strip .dual button.soloed{
  color:#fff;background:#d39331;border-color:#c4872f;
}
body>.app>#mixer.clean-mixer .strip .dual button:focus-visible{
  outline:2px solid #56b7ee;
  outline-offset:1px;
}
body>.app>#mixer.clean-mixer .strip .role,
body>.app>#mixer.clean-mixer .strip .master-status{
  color:#7893a5;
  font-weight:780;
}
body>.app #mixer .v-range{accent-color:#3182be}
body>.app .right.live-library-panel{
  background:#fbfcfe;
  border-color:#d7e3ee;
}
body>.app .right.live-library-panel .live-library-header{
  border-bottom-color:#e5ecf2!important;
}
body>.app .right.live-library-panel .tabs{
  border-bottom-color:#e5edf4;
}
body>.app .right.live-library-panel .songitem{
  border-bottom-color:#e9eff4!important;
}
body>.app .right.live-library-panel .sl-song-playing-progress{
  background:#d5e4ef;
}

/* Desktop: use the available height for the timeline and real set list.
   The previous 36dvh mixer made Repertorio's left panel almost unusable. */
@media(min-width:1000px) and (min-height:580px) and (pointer:fine){
  html:not(.soulone-ipad-classic) body>.app:not(.sl-mode-repertoire):not(.sl-mode-stage):not(.stage-mixer-collapsed),
  html:fullscreen body>.app:not(.sl-mode-repertoire):not(.sl-mode-stage):not(.stage-mixer-collapsed){
    grid-template-rows:auto auto minmax(0,1fr) auto clamp(195px,23dvh,244px)!important;
    gap:7px!important;
  }
  html:not(.soulone-ipad-classic) body>.app:not(.sl-mode-repertoire)>.main-grid{
    grid-template-columns:minmax(290px,21.5vw) minmax(0,1fr)!important;
    gap:10px!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .live-library-header{
    padding:10px 12px 8px!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .live-library-header strong{
    font-size:14px!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .live-library-header small{
    font-size:10px!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .sl-now-playing{
    padding:10px 12px 10px!important;
    background:linear-gradient(110deg,#10263a,#1b425d)!important;
    border-bottom:1px solid #385773!important;
    color:#f4faff;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .sl-np-title{
    color:#fff!important;
    font-size:13px!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .sl-np-state{
    color:#b2d1e5!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .sl-np-time{
    color:#d0e6f3!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .sl-pro-transport{
    background:#ffffff19!important;
    border-color:#ffffff28!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .sl-pro-transport button{
    background:#ffffff20!important;
    color:#eaf7ff!important;
    border-color:#ffffff18!important;
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    min-height:30px!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .sl-pro-transport .sl-pro-play{
    background:#2589d4!important;
    color:#fff!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .sl-np-track{
    background:#ffffff2b!important;
    height:5px!important;
    margin-top:8px;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .sl-np-fill{
    background:linear-gradient(90deg,#48a8e7,#6be0d0);
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .tabcontent{
    padding:9px 10px 14px!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .songitem{
    min-height:60px!important;
    padding:7px 8px!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .songitem .name b{
    font-size:12px!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .songitem .sl-mini-transport{
    gap:3px!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .songitem .sl-mini-transport button{
    min-width:28px!important;width:28px!important;flex-basis:28px!important;
    min-height:32px!important;height:32px!important;
    padding:0!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .tabs button{
    min-height:34px!important;padding:7px 3px!important;
    font-size:10px!important;
  }
  body>.app:not(.sl-mode-repertoire)>.main-grid>.live-workspace>.timeline{
    padding:10px 12px!important;
  }
  body>.app:not(.sl-mode-repertoire)>.main-grid>.live-workspace>.progress-panel{
    min-height:60px;
    padding:7px 11px!important;
  }
  body>.app:not(.sl-mode-repertoire)>.main-grid>.live-workspace>.progress-panel .transport .start{
    min-width:64px;height:48px;
  }
  body>.app>#mixer.clean-mixer{
    padding:7px 8px!important;
    gap:7px!important;
  }
  body>.app>#mixer .clean-group{
    padding:4px!important;
  }
  body>.app>#mixer .clean-group h3{
    margin:0 3px 4px!important;
  }
  body>.app>#mixer .striphead,
  body>.app>#mixer .strip.master .striphead{
    flex-basis:39px!important;
    min-height:39px!important;
    max-height:39px!important;
    padding:4px!important;
  }
  body>.app>#mixer .strip .dual{
    flex-basis:26px;
  }
  body>.app>#mixer .strip .dual button{
    height:26px!important;
    min-height:26px!important;
  }
}
/* Keep the wide desk stage out of tablet portrait/landscape overflow. */
@media(min-width:1000px) and (max-width:1250px) and (min-height:580px) and (pointer:fine){
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .sl-pro-transport button{
    width:27px!important;min-width:27px!important;
  }
  body>.app:not(.sl-mode-repertoire) .right.live-library-panel .sl-np-actions{
    gap:5px;
  }
}

/* Mobile: keep established orientation, scroll and window presets untouched.
   Only carry the same stage/transport visual identity into mobile views. */
@media(max-width:1100px) and (pointer:coarse){
  .soul-mobile-console .live-workspace .timeline{
    background:linear-gradient(115deg,#142a40,#1c405d)!important;
    border-color:#2c506e!important;
  }
  .soul-mobile-console .live-workspace .timeline .heading .eyebrow{
    color:#e8f5fc!important;
  }
  .soul-mobile-console .live-workspace .progress-panel{
    background:linear-gradient(110deg,#102238,#1b405c)!important;
    border-color:#345974!important;
  }
  .soul-mobile-console .live-workspace .progress-panel .clock{color:#fff!important}
  .soul-mobile-console .live-workspace .progress-panel .clock small{color:#b5d0e4!important}
  .soul-mobile-console .right.live-library-panel .sl-now-playing{
    background:linear-gradient(110deg,#10263b,#1d4764)!important;
    color:#fff!important;
  }
  .soul-mobile-console .right.live-library-panel .sl-np-title,
  .soul-mobile-console .right.live-library-panel .sl-np-time{
    color:#edf8ff!important;
  }
  .soul-mobile-console .right.live-library-panel .sl-np-state{
    color:#b0d1e6!important;
  }
  .soul-mobile-console #mixer.clean-mixer .clean-group{
    background:#ffffff0e!important;
    border-color:#ffffff29!important;
  }
}
@media(prefers-reduced-motion:reduce){
  body>.app .live-workspace .progress-panel .transport button{
    transition:none!important;
  }
}

/* SoulOne LIVE · Tipografía editorial
 * Mayúsculas reservadas a marca y abreviaturas técnicas (LIVE, BPM, L/R).
 * Preservar tal como se guardaron los nombres de canciones, pistas y artistas. */
html:not(.soulone-ipad-classic) body>.app{
  font-family:Inter,"SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  font-optical-sizing:auto;
  -webkit-font-smoothing:antialiased;
}
body>.app :is(.stage-field .field-label,.stage-menu .menu-caption,
  .sl-view-label,.timeline .heading .section-label,.timeline .heading .eyebrow,
  .clean-group h3,.top .stat small,.download-eyebrow,
  .sl-np-state,.sl-pro-context [data-sl-count]){
  text-transform:none!important;
  letter-spacing:.015em!important;
  font-weight:700!important;
}
body>.app :is(.sl-desktop-views .sl-mode-btn,
  .sl-mobile-view-nav button,.sl-mobile-presets button,
  .right.live-library-panel .tabs button,.stage-menu .tools button,
  .side-actions button){
  text-transform:none!important;
  letter-spacing:0!important;
  font-weight:670!important;
}
body>.app .stage-field .field-label{
  font-size:10px;
  line-height:1.25;
}
body>.app :is(.sl-view-label,.stage-menu .menu-caption,
  .timeline .heading .section-label,.download-eyebrow){
  line-height:1.35;
}
body>.app .right.live-library-panel .sl-np-state{
  font-size:10px;
  line-height:1.25;
}
body>.app .right.live-library-panel .sl-np-title,
body>.app .right.live-library-panel .songitem .name b{
  text-transform:none!important;
  overflow-wrap:normal;
}
body>.app .right.live-library-panel .tabs button{
  white-space:normal;
  line-height:1.2;
}
body>.app .strip.locked .striphead::after{content:"Tono fijo";}
@media(max-width:1100px) and (pointer:coarse){
  .soul-mobile-console .stage-field .field-label{
    font-size:10px;
    letter-spacing:.01em!important;
  }
  .soul-mobile-console .right.live-library-panel .tabs button{
    line-height:1.2;
    text-transform:none!important;
  }
}

/* Mixer typography: natural capitalization and readable, restrained weights.
   Keep channel identifiers (L/R, BPM) and all channel/audio state unchanged. */
body>.app>#mixer.clean-mixer .clean-group h3{
  font-size:11px;
  font-weight:700!important;
  letter-spacing:.015em!important;
  text-transform:none!important;
}
body>.app>#mixer.clean-mixer .striphead .track-title{
  font-size:11px;
  font-weight:700!important;
  letter-spacing:-.01em;
  line-height:1.2;
  text-transform:none!important;
}
body>.app>#mixer.clean-mixer .strip .role{
  font-weight:650!important;
  text-transform:none!important;
  letter-spacing:0;
}
