/* SoulOne LIVE v52 — required account gate, shared Supabase Auth with Studio.
   No user sees the player or demo without a verified account and ready tracks. */
html.sl-auth-locked body>.app,
html.sl-auth-locked body>.cloud-toolbar,
html.sl-auth-locked body>.soulone-live-boot,
html.sl-auth-locked body>.cloud-shade,
html.sl-auth-locked body>#overlay{
  display:none!important;
}
#sl52-access[hidden],#sl52-access [hidden]{display:none!important}
#sl52-access{
  position:fixed;inset:0;z-index:2147483500;
  display:none;align-items:center;justify-content:center;
  padding:max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  overflow:auto;overscroll-behavior:contain;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#edf1f5;
  background:radial-gradient(ellipse 82% 60% at 50% -18%,#16202d 0%,#080d15 53%,#05080d 100%);
}
html.sl-auth-locked #sl52-access{display:flex!important}
#sl52-access *{box-sizing:border-box}
#sl52-access .sl52-panel{
  width:min(100%,420px);
  display:flex;flex-direction:column;align-items:stretch;
  padding:clamp(22px,5vw,32px);
  border:1px solid #344151;border-radius:15px;
  background:#10151d;
  box-shadow:0 26px 65px #0007;
}
#sl52-access .sl52-brand{display:flex;align-items:center;gap:12px;margin-bottom:27px}
#sl52-access .sl52-emblem{width:72px;height:52px;flex:0 0 72px;object-fit:contain;border:0;border-radius:0;background:transparent;filter:none;box-shadow:none}
#sl52-access .sl52-brandstack{display:flex;min-width:0;flex-direction:column;gap:5px} #sl52-access .sl52-brandname{display:flex;align-items:center;gap:8px} #sl52-access .sl52-attribution{color:#9aaabd;font-size:10px;letter-spacing:.03em;font-weight:500}
#sl52-access .sl52-brandname strong{font-size:19px;letter-spacing:.03em;font-weight:800;color:#f5f5f7}
#sl52-access .sl52-live{font-size:10px;font-weight:750;letter-spacing:.08em;border:1px solid #2b78d1;background:#132f55;color:#a9d2ff;border-radius:5px;padding:4px 6px}
#sl52-access h1{font-size:24px;line-height:1.2;letter-spacing:-.02em;margin:0 0 7px;font-weight:720;color:#f4f9ff}
#sl52-access .sl52-desc{font-size:13px;line-height:1.6;color:#aeb8c6;margin:0 0 21px}
#sl52-access form{display:flex;flex-direction:column;gap:14px}
#sl52-access label{display:flex;flex-direction:column;gap:7px;color:#c5cdd8;font-weight:570;font-size:12px}
#sl52-access input{
  width:100%;height:45px;padding:9px 12px;color:#edf7fd;
  background:#0b111a;border:1px solid #3f4c5c;border-radius:9px;
  font:500 14px/1.3 inherit;outline:0;
}
#sl52-access input:focus-visible{border-color:#5aaaff;box-shadow:0 0 0 2px #388ce544}
#sl52-access button,#sl52-access .sl52-link{
  appearance:none;display:inline-flex;align-items:center;justify-content:center;
  min-height:43px;border-radius:9px;padding:9px 13px;
  cursor:pointer;text-decoration:none;font:650 13px/1.3 inherit;
  border:1px solid #394b60;color:#dae5ef;background:#1b2838;
  transition:background .12s ease;
}
#sl52-access .sl52-primary{color:#f9fbff;background:#116fdb;border-color:#3c92fa}
#sl52-access button:disabled{opacity:.6;cursor:wait}
#sl52-access button:focus-visible,#sl52-access a:focus-visible{outline:2px solid #86bfff;outline-offset:3px}
#sl52-access .sl52-secondary-actions{display:flex;gap:8px;flex-wrap:wrap}
#sl52-access .sl52-secondary-actions>*{flex:1 1 auto}
#sl52-access .sl52-error{font-size:12px;line-height:1.45;color:#ffb6a9;margin:0;min-height:0}
#sl52-access .sl52-notice{font-size:12px;line-height:1.5;color:#a8bacb;margin:0 0 12px}
#sl52-access .sl52-spinner{display:inline-block;width:17px;height:17px;border:2px solid #385477;border-top-color:#6caefd;border-radius:50%;animation:sl52-spin 1s linear infinite;margin-right:10px}
#sl52-access .sl52-check{font-size:14px;color:#cfdfed;margin:2px 0 14px}
@keyframes sl52-spin{to{transform:rotate(360deg)}}
#sl52-access .sl52-help{
  border-top:1px solid #303b49;padding-top:16px;margin:24px 0 0;
  font-size:11px;line-height:1.6;text-align:center;color:#899db3;
}
#sl52-access .sl52-help a{color:#8ac6ff}
@media(max-width:480px){
 #sl52-access{align-items:flex-start}
 #sl52-access .sl52-panel{margin:auto 0;padding:22px 19px;border-radius:14px}
 #sl52-access .sl52-brand{margin-bottom:22px}
 #sl52-access h1{font-size:21px}
}

/* SOULONE® official icon is transparent vector artwork; never add a second tile. */
#sl52-access .sl52-brand{gap:10px!important;align-items:center!important}
#sl52-access .sl52-panel:focus-within{border-color:#46607d}
#sl52-access .sl52-primary:hover:not(:disabled){background:#197cef}
#sl52-access .sl52-primary:active:not(:disabled){background:#0c60c0}
#sl52-access .sl52-live{box-shadow:none!important}
@media(max-width:480px){#sl52-access .sl52-emblem{width:60px;height:45px;flex-basis:60px}}
