
/* V101 — High Contrast Readability & Conversion Clarity */

:root{
  --hc-black:#030305;
  --hc-panel:#08080c;
  --hc-white:#ffffff;
  --hc-muted:#c8c8d2;
  --hc-border:rgba(255,255,255,.34);
}

body,button,input,select,textarea{color:var(--hc-white)}
p,small,.meta,.muted,.card p,.guide p,.section-head p,.mode-copy small,.queue-empty,.bottom-player small,.title-panel p,.microphone-help-examples{
  color:var(--hc-muted)!important;
}

.guide h2,.section-head h2,.rail h2,.rail h3,.sidebar h2,.sidebar h3,.card h3,.mode-copy strong,.learning-path h2,.learning-path h3,.right-world h2,.right-world h3{
  color:#fff!important;
  text-shadow:0 1px 12px rgba(0,0,0,.9);
}

.guide,.rail section,.sidebar .nav-group,.card,.mode-btn,.queue-item,.learning-path,.right-world section,.progress-panel,.continue-panel,.recommended-panel,.playlists-panel{
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01)),var(--hc-panel)!important;
  border-color:var(--hc-border)!important;
  box-shadow:0 14px 30px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.08)!important;
}

.pill,.guide-meta .pill,.tag,.keyword{
  color:#fff!important;
  background:#0a0a0f!important;
  border:1px solid rgba(255,255,255,.42)!important;
  font-weight:800!important;
}

.sidebar,.rail{background:linear-gradient(180deg,#050507,#020203)!important}
.sidebar .nav-title,.rail .eyebrow,.rail-label,.section-kicker,.eyebrow{
  color:#f3f3f7!important;
  opacity:1!important;
}
.sidebar .nav-btn,.rail button,.card-actions button,.queue-item{
  color:#fff!important;
  background:linear-gradient(180deg,#15151b,#060608)!important;
  border:1px solid rgba(255,255,255,.38)!important;
}

.topbar .search-wrap{
  background:linear-gradient(180deg,#0b0b10,#030305)!important;
  border:1px solid rgba(255,255,255,.45)!important;
}
.topbar .search-wrap input{
  color:#fff!important;
  font-size:15px!important;
  font-weight:750!important;
}
.topbar .search-wrap input::placeholder{
  color:#e8e8ee!important;
  opacity:1!important;
}
.search-example-line{
  color:#f2f2f6!important;
  font-size:12px!important;
  line-height:1.15!important;
  font-weight:850!important;
  letter-spacing:.015em!important;
  text-shadow:0 1px 7px #000!important;
}
.help-console-title{color:#fff!important}

#submitSearch{
  color:#fff!important;
  border:1px solid #fff!important;
  background:linear-gradient(180deg,#b56cff,#7d2adb 58%,#35104e)!important;
}
#voiceSearch{
  color:#fff!important;
  border:1px solid rgba(255,255,255,.52)!important;
  background:linear-gradient(180deg,#17171d,#050507)!important;
}

.topbar .premium,button.premium#maxLevelButton{
  color:#09070d!important;
  background:linear-gradient(115deg,rgba(255,255,255,.95),rgba(255,255,255,.25) 20%,transparent 40%),linear-gradient(180deg,#fff 0%,#f6f4f8 47%,#ddd8e3 76%,#beb6c8 100%)!important;
  border:2px solid #fff!important;
  box-shadow:0 0 0 2px #0a0710,0 0 0 4px rgba(158,78,231,.6),0 14px 28px rgba(0,0,0,.62),0 0 24px rgba(146,63,220,.35),inset 0 2px 0 #fff,inset 0 -10px 16px rgba(42,22,52,.12)!important;
}
.topbar .premium .premium-label,button.premium#maxLevelButton .premium-label{
  color:#0b0710!important;
  font-size:11px!important;
  font-weight:950!important;
  line-height:1.08!important;
  text-shadow:none!important;
}
.topbar .premium .premium-label small,button.premium#maxLevelButton .premium-label small{
  color:#51375c!important;
  font-size:7px!important;
  font-weight:900!important;
  opacity:1!important;
  text-shadow:none!important;
}

.progress-panel strong,.progress-panel span,.continue-panel strong,.recommended-panel strong,.playlists-panel strong{color:#fff!important}
.progress-panel small,.continue-panel small,.recommended-panel small,.playlists-panel small{color:var(--hc-muted)!important}

@media(max-width:900px){
  .topbar .search-wrap input{font-size:14px!important}
  .search-example-line{font-size:11px!important;left:18px!important;right:122px!important}
  .guide,.card,.rail section{background:#060608!important}
}
@media(max-width:430px){
  .search-example-line{font-size:10px!important;right:112px!important}
}
