.yt-account-card{
  margin:16px 0 14px;
  padding:16px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  border-radius:22px;
  background:
    radial-gradient(circle at 100% 0,rgba(255,45,85,.16),transparent 38%),
    linear-gradient(145deg,rgba(18,29,50,.98),rgba(7,15,29,.98));
  box-shadow:0 18px 45px rgba(0,0,0,.24);
}
body.route-tv .yt-account-card{display:none!important}
.yt-account-head{display:flex;align-items:flex-start;gap:12px}
.yt-account-brand{
  display:grid;
  place-items:center;
  flex:0 0 44px;
  width:44px;
  height:44px;
  border-radius:14px;
  background:linear-gradient(145deg,#ff3158,#d70a2f);
  color:#fff;
  font-size:17px;
  text-indent:2px;
  box-shadow:0 10px 24px rgba(224,21,56,.28);
}
.yt-account-copy{min-width:0;flex:1}
.yt-account-kicker{
  display:block;
  margin:1px 0 4px;
  color:#6ee8d8;
  font-size:9px;
  font-weight:900;
  letter-spacing:.14em;
}
.yt-account-copy h3{margin:0;color:#fff;font-size:17px;line-height:1.2}
.yt-account-copy p{margin:5px 0 0;color:#91a0b7;font-size:11px;line-height:1.45}
.yt-account-badge{
  flex:0 0 auto;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;
  background:rgba(255,255,255,.045);
  color:#a7b4c8;
  font-size:8px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  white-space:nowrap;
}
.yt-account-badge.connected{border-color:rgba(61,220,169,.22);background:rgba(61,220,169,.1);color:#58e1b4}
.yt-account-badge.error{border-color:rgba(255,101,123,.2);background:rgba(255,101,123,.1);color:#ff8395}
.yt-account-setup{
  margin-top:14px;
  padding:13px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:16px;
  background:rgba(4,11,23,.58);
}
.yt-account-setup p{margin:0 0 10px;color:#b8c4d5;font-size:11px;line-height:1.5}
.yt-account-setup small{display:block;margin-top:9px;color:#74859e;font-size:9px;line-height:1.45;text-align:center}
.yt-connect-button{
  width:100%;
  border:1px solid rgba(255,255,255,.12)!important;
  background:linear-gradient(135deg,#fff,#e8edf5)!important;
  color:#172036!important;
  box-shadow:0 10px 24px rgba(0,0,0,.18)!important;
}
.yt-connect-button:before{
  content:"G";
  display:inline-grid;
  place-items:center;
  width:20px;
  height:20px;
  margin-right:7px;
  border-radius:50%;
  background:#fff;
  color:#4285f4;
  font-weight:950;
}
.yt-connect-button:disabled{opacity:.56;cursor:not-allowed}
.yt-account-connected{margin-top:14px}
.yt-account-profile{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 12px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:15px;
  background:rgba(4,11,23,.55);
}
.yt-account-profile img{
  width:36px;
  height:36px;
  flex:0 0 36px;
  border-radius:50%;
  object-fit:cover;
  background:#172238;
}
.yt-account-profile>div{min-width:0;flex:1}
.yt-account-profile small{display:block;color:#7788a1;font-size:8px;font-weight:850;text-transform:uppercase;letter-spacing:.07em}
.yt-account-profile strong{display:block;margin-top:3px;overflow:hidden;color:#fff;font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.yt-text-button{
  min-height:32px;
  padding:5px 9px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:9px;
  background:#16233a;
  color:#b8c6da;
  font-size:8px;
  font-weight:850;
}
.yt-account-search{
  margin-top:12px;
  padding:12px;
  border:1px solid rgba(111,87,255,.24);
  border-radius:17px;
  background:
    radial-gradient(circle at 100% 0,rgba(43,207,193,.1),transparent 42%),
    rgba(6,13,27,.72);
}
.yt-account-search-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.yt-account-search-head>div{min-width:0}
.yt-account-search-head small{
  display:block;
  color:#6ee8d8;
  font-size:8px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.yt-account-search-head strong{display:block;margin-top:3px;color:#f4f7fc;font-size:12px}
.yt-account-search-head>span{
  flex:0 0 auto;
  padding:5px 8px;
  border:1px solid rgba(61,220,169,.2);
  border-radius:999px;
  background:rgba(61,220,169,.08);
  color:#58e1b4;
  font-size:7px;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.yt-account-search-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:10px}
.yt-account-search-form input{min-width:0;font-size:11px}
.yt-account-search-form .btn{min-width:76px;padding-inline:12px}
.yt-account-search-note{display:block;margin-top:8px;color:#71829b;font-size:8px;line-height:1.5}
.yt-account-search-status{
  min-height:18px;
  margin:8px 1px 0;
  color:#8293ab;
  font-size:9px;
  line-height:1.45;
}
.yt-account-search-status.error{color:#ff8998}
.yt-account-search-results{display:grid;gap:9px;margin-top:10px}
.yt-account-divider{display:flex;align-items:center;gap:8px;margin:14px 0 0;color:#8293ab;font-size:8px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.yt-account-divider:before,.yt-account-divider:after{content:"";height:1px;flex:1;background:rgba(255,255,255,.08)}
.yt-playlist-field{display:block;margin-top:12px}
.yt-playlist-field>span{display:block;margin:0 0 6px;color:#c9d4e4;font-size:10px;font-weight:850}
.yt-playlist-field select{width:100%;font-size:11px}
.yt-playlist-status{
  min-height:18px;
  margin:8px 1px 0;
  color:#8191a9;
  font-size:9px;
  line-height:1.45;
}
.yt-playlist-status.error{color:#ff8998}
.yt-playlist-songs{display:grid;gap:9px;margin-top:10px}
.yt-account-song{
  display:grid;
  grid-template-columns:84px minmax(0,1fr);
  gap:11px;
  padding:9px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:15px;
  background:rgba(5,12,24,.72);
}
.yt-account-song img{
  width:84px;
  height:52px;
  border-radius:9px;
  background:#111b2e;
  object-fit:cover;
}
.yt-account-song-copy{min-width:0}
.yt-account-song-copy strong{
  display:-webkit-box;
  overflow:hidden;
  color:#f4f7fc;
  font-size:11px;
  line-height:1.35;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.yt-account-song-copy small{
  display:block;
  margin-top:4px;
  overflow:hidden;
  color:#8090a8;
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.yt-account-song-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;grid-column:1/-1}
.yt-account-song-actions .btn{min-height:34px;padding:6px 8px;font-size:9px}
.yt-account-song-actions .yt-now{grid-column:1/-1;background:linear-gradient(135deg,#7258ff,#20cdbc)}
.yt-load-more{width:100%;margin-top:10px}
.yt-playlist-empty{
  padding:24px 12px;
  border:1px dashed rgba(255,255,255,.09);
  border-radius:14px;
  color:#7f8fa7;
  font-size:10px;
  line-height:1.5;
  text-align:center;
}

@media(max-width:520px){
  .yt-account-card{margin:14px -1px;padding:13px;border-radius:18px}
  .yt-account-head{align-items:center;flex-wrap:wrap}
  .yt-account-copy{flex:1 1 calc(100% - 58px)}
  .yt-account-badge{margin-left:56px}
  .yt-account-song{grid-template-columns:76px minmax(0,1fr)}
  .yt-account-song img{width:76px;height:48px}
  .yt-account-search-form{grid-template-columns:1fr}
  .yt-account-search-form .btn{width:100%}
}
