/* SoulOne LIVE v0.17 — subtle count-in display, desktop + mobile. */
.sl-section-cue-preferences{
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 12px;
  margin:10px 0 8px;
  flex-wrap:wrap;
  border:1px solid #d6e5f0;
  border-radius:9px;
  background:#f4f9fd;
  color:#365c7b;
  font-size:12px;
  font-weight:780;
  cursor:pointer;
}
.sl-section-cue-preferences input{
  width:16px;
  height:16px;
  flex:0 0 16px;
  margin:0;
  accent-color:#0b79c4;
  cursor:pointer;
}
.sl-section-cue-preferences small{
  flex:1 1 100%;
  color:#728ca2;
  font-size:10px;
  font-weight:560;
  line-height:1.35;
  margin-left:25px;
}
.sl-marker-cue{
  position:fixed;
  z-index:2990;
  bottom:max(22px,env(safe-area-inset-bottom,0px) + 22px);
  left:50%;
  transform:translateX(-50%);
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  gap:12px;
  align-items:center;
  max-width:calc(100vw - 26px);
  width:min(400px,calc(100vw - 26px));
  min-height:93px;
  padding:13px 15px;
  border:1px solid #bbd7ea;
  border-radius:14px;
  background:#f7fbff;
  box-shadow:0 10px 36px rgba(17,48,75,.21);
  color:#233f59;
  pointer-events:auto;
}
.sl-marker-cue[hidden]{display:none!important}
.sl-marker-caption{
  font-size:11px;
  font-weight:820;
  letter-spacing:.04em;
  color:#456d8b;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
}
.sl-marker-numbers{
  display:flex;
  gap:8px;
  justify-content:center;
  align-items:center;
  width:100%;
}
.sl-marker-digit{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  flex:0 0 38px;
  font-weight:900;
  font-size:18px;
  border:1px solid #d7e5f0;
  border-radius:9px;
  color:#809db2;
  background:#fff;
  font-variant-numeric:tabular-nums;
  transition:background .11s,color .11s,border-color .11s;
}
.sl-marker-digit.is-current{
  background:#0977c5;
  border-color:#0977c5;
  color:white;
  box-shadow:0 3px 11px #0b78c53b;
}
.sl-marker-digit.is-done{
  background:#e4f5ef;
  border-color:#b4dfd1;
  color:#208970;
}
.sl-marker-cancel{
  border:0;
  background:transparent;
  color:#5b7c94;
  font-size:11px;
  font-weight:760;
  padding:4px 9px;
  border-radius:7px;
  cursor:pointer;
}
.sl-marker-cancel:hover{background:#e8f3fb}
.sl-marker-cancel:focus-visible{outline:2px solid #1284d1;outline-offset:2px}
@media(max-width:650px){
 .sl-section-cue-preferences{font-size:11px;line-height:1.3}
 .sl-marker-cue{padding:12px;width:min(320px,calc(100vw - 22px));gap:8px}
 .sl-marker-digit{width:34px;height:34px;flex-basis:34px;font-size:17px}
}
@media(prefers-reduced-motion:reduce){
 .sl-marker-digit{transition:none}
}
