/* FSOC Tea Cabinet v0.36.8
   Tea picker art refreshed to use the Spin Tea bowl for the profile dashboard too. */

#fsoctea-profile-panel .fsoctea-picker-stage{
  position:relative!important;
  isolation:isolate!important;
  width:100%!important;
  min-height:244px!important;
  margin:8px 0 12px!important;
  padding:14px 3px!important;
  box-sizing:border-box!important;
  border:0!important;
  border-radius:0!important;
  overflow:visible!important;
  background:transparent!important;
  display:grid!important;
  grid-template-columns:80px 166px 80px!important;
  align-items:center!important;
  justify-content:center!important;
  column-gap:7px!important;
}

/* Large faded Spin Tea bowl behind the dashboard picker. */
#fsoctea-profile-panel .fsoctea-picker-leaves{
  position:absolute!important;
  z-index:0!important;
  left:50%!important;
  top:57%!important;
  width:356px!important;
  max-width:97vw!important;
  height:auto!important;
  transform:translate(-50%,-50%)!important;
  object-fit:contain!important;
  object-position:center!important;
  opacity:.075!important;
  pointer-events:none!important;
  filter:blur(.35px) drop-shadow(0 0 18px rgba(255,255,255,.10))!important;
}

/* Soft palette glow. */
#fsoctea-profile-panel .fsoctea-picker-stage:after{
  content:""!important;
  position:absolute!important;
  z-index:0!important;
  left:50%!important;
  top:52%!important;
  width:245px!important;
  height:205px!important;
  transform:translate(-50%,-50%)!important;
  border-radius:50%!important;
  background:radial-gradient(circle, color-mix(in srgb,var(--tea-accent) 17%,transparent) 0%, color-mix(in srgb,var(--tea-accent) 5%,transparent) 50%, transparent 73%)!important;
  filter:blur(9px)!important;
  pointer-events:none!important;
}

/* Sparkle layer. The star itself is text, so Android renders it reliably. */
#fsoctea-profile-panel .fsoctea-picker-sparkles{
  position:absolute!important;
  z-index:6!important;
  left:50%!important;
  top:50%!important;
  width:246px!important;
  height:196px!important;
  transform:translate(-50%,-50%)!important;
  pointer-events:none!important;
}
#fsoctea-profile-panel .fsoctea-picker-sparkles i{
  position:absolute!important;
  display:block!important;
  width:18px!important;
  height:18px!important;
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  opacity:.18;
  transform:scale(.62) rotate(-8deg);
  animation:fsocteaTwinkle 2.35s ease-in-out infinite;
  will-change:transform,opacity,filter;
}
#fsoctea-profile-panel .fsoctea-picker-sparkles i::before{
  content:"✦";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  line-height:1;
  color:#eef8ff;
  text-shadow:0 0 5px rgba(255,255,255,.62),0 0 11px color-mix(in srgb,var(--tea-accent) 72%,transparent),0 0 19px color-mix(in srgb,var(--tea-accent) 38%,transparent);
}
#fsoctea-profile-panel .fsoctea-picker-sparkles i:nth-child(1){left:13px;top:64px;animation-delay:.05s}
#fsoctea-profile-panel .fsoctea-picker-sparkles i:nth-child(2){left:48px;top:20px;animation-delay:.65s;transform:scale(.5)}
#fsoctea-profile-panel .fsoctea-picker-sparkles i:nth-child(3){left:35px;bottom:26px;animation-delay:1.25s}
#fsoctea-profile-panel .fsoctea-picker-sparkles i:nth-child(4){right:13px;top:58px;animation-delay:.35s}
#fsoctea-profile-panel .fsoctea-picker-sparkles i:nth-child(5){right:48px;top:18px;animation-delay:1.55s;transform:scale(.5)}
#fsoctea-profile-panel .fsoctea-picker-sparkles i:nth-child(6){right:34px;bottom:24px;animation-delay:.95s}
#fsoctea-profile-panel .fsoctea-picker-sparkles i:nth-child(7){left:50%;top:2px;margin-left:-9px;animation-delay:1.9s;transform:scale(.54)}
@keyframes fsocteaTwinkle{
  0%,100%{opacity:.14;transform:scale(.55) rotate(-10deg);filter:brightness(.92)}
  32%{opacity:.32;transform:scale(.72) rotate(0deg)}
  52%{opacity:1;transform:scale(1.15) rotate(10deg);filter:brightness(1.28)}
  70%{opacity:.42;transform:scale(.78) rotate(4deg)}
}

#fsoctea-profile-panel .fsoctea-picker-stats{
  position:relative!important;
  z-index:4!important;
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
  align-items:stretch!important;
  text-align:center!important;
}
#fsoctea-profile-panel .fsoctea-picker-stats span{
  width:80px!important;
  min-width:0!important;
  min-height:50px!important;
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  padding:6px 4px!important;
  border:1px solid color-mix(in srgb,var(--tea-line) 88%,transparent)!important;
  border-radius:16px!important;
  background:rgba(10,16,22,.93)!important;
  box-shadow:0 4px 13px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.025)!important;
  backdrop-filter:none!important;
  color:var(--tea-muted)!important;
  cursor:pointer!important;
  line-height:1.05!important;
}
#fsoctea-profile-panel .fsoctea-picker-stats strong{font-size:18px!important;line-height:1!important;font-weight:900!important;color:var(--tea-text,#d9e4ed)!important}
#fsoctea-profile-panel .fsoctea-picker-stats small{margin-top:5px!important;font-size:9px!important;line-height:1!important;color:var(--tea-muted)!important}
#fsoctea-profile-panel .fsoctea-picker-stats span.is-active{border-color:color-mix(in srgb,var(--tea-accent) 58%,var(--tea-line))!important;background:color-mix(in srgb,var(--tea-accent) 10%,#0a1016)!important}
#fsoctea-profile-panel .fsoctea-picker-stats span.is-active strong{color:color-mix(in srgb,var(--tea-accent) 70%,#fff 30%)!important}

#fsoctea-profile-panel button.fsoctea-pick-orb{
  position:relative!important;
  z-index:5!important;
  justify-self:center!important;
  width:166px!important;
  height:166px!important;
  min-width:166px!important;
  min-height:166px!important;
  box-sizing:border-box!important;
  border-radius:50%!important;
  border:2px solid color-mix(in srgb,var(--tea-accent) 68%,#dbe9f5 18%)!important;
  background:radial-gradient(circle at 50% 28%,color-mix(in srgb,var(--tea-accent) 22%,#17232d) 0%,color-mix(in srgb,var(--tea-accent) 9%,#091017) 68%,#080d12 100%)!important;
  color:var(--tea-text,#e9f2f8)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  padding:10px!important;
  box-shadow:0 0 0 7px color-mix(in srgb,var(--tea-accent) 7%,transparent),0 15px 31px rgba(0,0,0,.43),inset 0 1px 0 rgba(255,255,255,.12)!important;
  overflow:visible!important;
  cursor:pointer!important;
  transition:transform .16s ease,box-shadow .16s ease!important;
}
#fsoctea-profile-panel button.fsoctea-pick-orb:active{transform:scale(.965)!important}
#fsoctea-profile-panel button.fsoctea-pick-orb:disabled{opacity:.55!important;cursor:default!important}
#fsoctea-profile-panel .fsoctea-pick-orb img{
  width:88px!important;
  height:68px!important;
  object-fit:contain!important;
  margin:-6px 0 4px!important;
  filter:drop-shadow(0 0 8px rgba(255,255,255,.10)) drop-shadow(0 4px 7px rgba(0,0,0,.28))!important;
  pointer-events:none!important;
}
#fsoctea-profile-panel .fsoctea-pick-title{font-size:19px!important;font-weight:900!important;line-height:1.03!important;letter-spacing:-.02em!important;white-space:nowrap!important}
#fsoctea-profile-panel .fsoctea-pick-sub{margin-top:5px!important;font-size:9px!important;font-weight:900!important;letter-spacing:.20em!important;line-height:1!important;color:color-mix(in srgb,var(--tea-accent) 66%,#fff 34%)!important}
#fsoctea-profile-panel .fsoctea-pick-count{margin-top:5px!important;font-size:8.5px!important;line-height:1!important;color:var(--tea-muted)!important}

#fsoctea-profile-panel .fsoctea-owner-actions-secondary{display:grid!important;grid-template-columns:1fr 1.7fr .82fr!important;gap:8px!important;margin:0 0 14px!important}
#fsoctea-profile-panel .fsoctea-owner-actions-secondary button{min-height:44px!important;border:1px solid var(--tea-line)!important;background:color-mix(in srgb,var(--tea-accent) 4%,#0d1217)!important;color:var(--tea-text,#d9e4ed)!important;border-radius:16px!important;padding:8px 7px!important;font-size:12px!important;font-weight:780!important}

@media(max-width:390px){
  #fsoctea-profile-panel .fsoctea-picker-stage{min-height:232px!important;grid-template-columns:74px 154px 74px!important;column-gap:5px!important;padding-left:2px!important;padding-right:2px!important}
  #fsoctea-profile-panel .fsoctea-picker-leaves{width:336px!important;top:58%!important;opacity:.07!important}
  #fsoctea-profile-panel .fsoctea-picker-sparkles{width:230px!important;height:186px!important}
  #fsoctea-profile-panel .fsoctea-picker-stats span{width:74px!important;min-height:49px!important}
  #fsoctea-profile-panel .fsoctea-picker-stats strong{font-size:17px!important}
  #fsoctea-profile-panel .fsoctea-picker-stats small{font-size:8.7px!important}
  #fsoctea-profile-panel button.fsoctea-pick-orb{width:154px!important;height:154px!important;min-width:154px!important;min-height:154px!important}
  #fsoctea-profile-panel .fsoctea-pick-orb img{width:82px!important;height:62px!important}
  #fsoctea-profile-panel .fsoctea-pick-title{font-size:18px!important}
  #fsoctea-profile-panel .fsoctea-owner-actions-secondary{grid-template-columns:1fr 1.72fr .82fr!important}
  #fsoctea-profile-panel .fsoctea-owner-actions-secondary button{font-size:11.5px!important;padding:8px 5px!important}
}

@media(max-width:350px){
  #fsoctea-profile-panel .fsoctea-picker-stage{grid-template-columns:68px 146px 68px!important;column-gap:3px!important}
  #fsoctea-profile-panel .fsoctea-picker-stats span{width:68px!important}
  #fsoctea-profile-panel button.fsoctea-pick-orb{width:146px!important;height:146px!important;min-width:146px!important;min-height:146px!important}
  #fsoctea-profile-panel .fsoctea-owner-actions-secondary{grid-template-columns:1fr!important}
}


/* v0.36.7: Tea Roulette artwork only.
   Use the existing Spin Tea bowl as the roulette mark, with a larger faded echo behind it. */
.fsoctea-randomizer-card{
  isolation:isolate!important;
}
.fsoctea-randomizer-card > *:not(.fsoctea-randomizer-logo-bg){
  position:relative!important;
  z-index:2!important;
}
.fsoctea-randomizer-logo-bg{
  position:absolute!important;
  z-index:0!important;
  left:50%!important;
  top:42%!important;
  width:118%!important;
  max-width:560px!important;
  transform:translate(-50%,-50%)!important;
  opacity:.055!important;
  pointer-events:none!important;
  filter:blur(.35px) drop-shadow(0 0 28px rgba(255,255,255,.10))!important;
}
.fsoctea-randomizer-logo-bg img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  object-fit:contain!important;
}
.fsoctea-randomizer-logo{
  width:112px!important;
  height:86px!important;
  margin:-3px auto 3px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  pointer-events:none!important;
}
.fsoctea-randomizer-logo img{
  display:block!important;
  width:108px!important;
  height:82px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 0 10px rgba(255,255,255,.18)) drop-shadow(0 7px 10px rgba(0,0,0,.35))!important;
}
.fsoctea-randomizer-kicker{
  margin-top:0!important;
  margin-bottom:6px!important;
}
@media(max-width:480px){
  .fsoctea-randomizer-logo{width:104px!important;height:80px!important}
  .fsoctea-randomizer-logo img{width:100px!important;height:76px!important}
  .fsoctea-randomizer-logo-bg{width:132%!important;top:41%!important;opacity:.05!important}
}

/* Native folder visibility settings */
.fsoctea-folder-settings { margin-top: 16px; padding-top: 12px; border-top: 1px solid rgba(180,190,210,.25); }
.fsoctea-folder-settings-items { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; }
.fsoctea-folder-setting { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.fsoctea-folder-setting select { min-width: 126px; max-width: 100%; }
