/* Tsukiro 3.6.46 — chat geometry + bounded authentication bootstrap. */
:root{
  --launch-focus:rgba(255,112,174,.72);
  --launch-border:rgba(255,255,255,.085);
  --launch-panel:#121117;
}

/* Layout safety: prevents one-pixel side overflows and accidental horizontal scroll. */
html,body{max-width:100%;overflow-x:clip}
img,video,canvas,svg,iframe{max-width:100%}
button,input,select,textarea{font:inherit}
button,[role="button"],a.button{touch-action:manipulation}

/* Consistent keyboard focus without neon glow. */
:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:2px solid var(--launch-focus)!important;
  outline-offset:3px!important;
}

/* Geometrically centered close controls — avoids crooked font-glyph × rendering. */
.tsukiro-close-button,
.community-chat-panel header .community-chat-close{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  min-height:38px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  flex:0 0 38px!important;
  border:1px solid rgba(255,255,255,.07)!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.035)!important;
  color:#c9c3cc!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  line-height:0!important;
  overflow:hidden!important;
}
.tsukiro-close-button svg,
.community-chat-panel header .community-chat-close svg{
  width:18px!important;
  height:18px!important;
  display:block!important;
  overflow:visible!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.tsukiro-close-button:hover,
.community-chat-panel header .community-chat-close:hover{
  color:#fff!important;
  border-color:rgba(255,133,190,.16)!important;
  background:rgba(255,255,255,.06)!important;
}

/* Chat release polish. */
.community-chat-panel{
  width:min(420px,100vw)!important;
  max-width:100vw!important;
  height:100dvh!important;
  background:linear-gradient(180deg,#121117 0%,#0d0c11 100%)!important;
}
.community-chat-panel header{
  min-height:72px!important;
  padding:15px 16px!important;
  gap:14px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,0))!important;
}
.community-chat-panel header>div{min-width:0}
.community-chat-panel header strong{line-height:1.25!important}
.community-chat-panel header small{line-height:1.35!important}
.community-chat-form button:disabled{opacity:.48!important;cursor:wait!important;transform:none!important}
.chat-empty{display:grid!important;gap:5px!important}
.chat-empty strong{color:#ded9e2;font-size:14px}
.chat-empty span{color:#817a86;font-size:11px}

/* Panels and modals always stay inside the viewport. */
:where(.modal-card,.dialog,.sheet,.drawer,.search-results,.v19-notification-panel,.direct-messages-panel){
  max-width:calc(100vw - 20px);
}

/* Inputs: avoid iOS zoom and clipped text on smaller screens. */
@media(max-width:760px){
  input,select,textarea{font-size:16px!important}
  .community-chat-panel{width:100vw!important}
  .community-chat-panel header{padding-left:14px!important;padding-right:14px!important}
}

/* Prevent accidental motion/flicker for users who ask the OS for reduced motion. */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
}

/* Remove a few remaining legacy purple tails from currently visible interactive states. */
.watch-center-play:hover,
.watch-party-chat-form button,
.community-chat-form button{
  background-image:linear-gradient(135deg,#20131d 0%,#71324f 58%,#e36fa5 100%)!important;
}
.watch-episode-card.active{
  background-image:linear-gradient(135deg,rgba(35,18,29,.96),rgba(223,99,157,.13))!important;
  border-color:rgba(236,122,174,.34)!important;
}
.party-dock__top{
  background-image:linear-gradient(135deg,rgba(255,104,165,.055),rgba(255,255,255,.012))!important;
}

/* Keep the repaired hero progress subtle and readable. */
#heroRotationProgressFill{
  background:linear-gradient(90deg,#2b121f 0%,#8f315c 55%,#f07eaf 100%)!important;
  box-shadow:0 0 12px rgba(224,93,157,.20)!important;
}

/* Consistent SVG send action: avoids font-glyph alignment differences across browsers. */
.community-chat-form .community-chat-send{
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  line-height:0!important;
}
.community-chat-form .community-chat-send svg{
  width:18px!important;
  height:18px!important;
  display:block!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}


/* 3.6.46 — community chat is a real overlay, never hidden under the navbar. */
.community-chat{
  z-index:12000!important;
  inset:0!important;
  width:0!important;
  height:0!important;
}
.community-chat-backdrop{
  z-index:0!important;
  background:rgba(5,4,7,.68)!important;
  backdrop-filter:blur(6px)!important;
}
.community-chat-fab{
  z-index:2!important;
  right:18px!important;
  bottom:max(18px,env(safe-area-inset-bottom))!important;
}
.community-chat.is-open .community-chat-fab{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(8px)!important;
}
.community-chat-panel{
  z-index:1!important;
  top:16px!important;
  right:16px!important;
  bottom:16px!important;
  left:auto!important;
  width:min(400px,calc(100vw - 32px))!important;
  max-width:calc(100vw - 32px)!important;
  height:auto!important;
  min-height:0!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,#131118 0%,#0c0b10 100%)!important;
  box-shadow:0 28px 90px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.035)!important;
  transform:translate3d(calc(100% + 32px),0,0)!important;
  will-change:transform!important;
}
.community-chat-panel.open{transform:translate3d(0,0,0)!important}
.community-chat-panel header{
  min-height:70px!important;
  padding:15px 15px 14px 17px!important;
  border-bottom:1px solid rgba(255,255,255,.065)!important;
  background:rgba(255,255,255,.012)!important;
}
.community-chat-panel header strong{font-size:15px!important;letter-spacing:-.015em!important}
.community-chat-panel header small{margin-top:4px!important;color:#817985!important;font-size:10px!important}
.community-chat-messages{
  padding:14px!important;
  overscroll-behavior:contain!important;
  background:radial-gradient(circle at 75% 0,rgba(218,91,151,.045),transparent 34%)!important;
}
.chat-message{
  padding:12px 13px!important;
  border:1px solid rgba(255,255,255,.055)!important;
  border-radius:15px!important;
  background:#17151b!important;
}
.chat-message a{color:#f0b0ce!important}
.community-chat-form{
  min-width:0!important;
  padding:10px 11px calc(10px + env(safe-area-inset-bottom))!important;
  border-top:1px solid rgba(255,255,255,.065)!important;
  background:#0d0c10!important;
}
.community-chat-form input{
  min-width:0!important;
  width:100%!important;
  border-color:rgba(255,255,255,.075)!important;
  background:#151219!important;
}
.community-chat-form.hidden{display:none!important}
.community-chat-auth{
  min-height:100%;
  display:grid;
  place-items:center;
  align-content:center;
  gap:9px;
  padding:34px 24px;
  text-align:center;
}
.community-chat-auth svg{width:30px;height:30px;fill:none;stroke:#d98bad;stroke-width:1.55}
.community-chat-auth strong{font-size:15px;color:#f1ebf0}
.community-chat-auth span{max-width:270px;color:#877f8a;font-size:11px;line-height:1.55}
.community-chat-auth a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  margin-top:4px;
  padding:0 15px;
  border:1px solid rgba(236,122,174,.22);
  border-radius:12px;
  background:linear-gradient(135deg,#1b1319,#6e304e 72%,#d8699c);
  color:#fff;
  font-size:11px;
  font-weight:850;
}

/* Direct messages use the same overlay hierarchy and centered SVG controls. */
.ts-dm{z-index:12020!important}
.ts-dm__panel{top:16px!important;bottom:16px!important;right:16px!important}
.ts-dm__close,.ts-dm__back{
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  line-height:0!important;
}
.ts-dm__close svg,.ts-dm__back svg{width:17px;height:17px;display:block;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* The profile splash is only a short hand-off, not a blocking network screen. */
body[data-page="profile"] .profile-boot{transition:opacity .14s ease,visibility .14s ease!important}
body[data-page="profile"] .profile-boot__card{width:min(calc(100% - 30px),420px)!important;padding:27px!important}
body[data-page="profile"] .profile-boot__brand{margin-bottom:9px!important}
body[data-page="profile"] .profile-boot__progress i{animation-duration:.72s!important}

@media(max-width:760px){
  .community-chat-backdrop{display:none!important}
  .community-chat-panel{
    inset:0!important;
    width:100dvw!important;
    max-width:none!important;
    height:100dvh!important;
    min-height:100dvh!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    transform:translate3d(100%,0,0)!important;
  }
  .community-chat-panel.open{transform:translate3d(0,0,0)!important}
  .community-chat-panel header{
    min-height:calc(66px + env(safe-area-inset-top))!important;
    padding:calc(12px + env(safe-area-inset-top)) 13px 12px 15px!important;
  }
  .community-chat-messages{padding:12px!important}
  .community-chat-form{padding-left:10px!important;padding-right:10px!important}
  .community-chat-form input{font-size:16px!important}
  .ts-dm__panel{inset:0!important;width:100dvw!important;max-width:none!important;border:0!important;border-radius:0!important}
  .ts-dm__header{padding-top:calc(14px + env(safe-area-inset-top))!important}
}
