/* =====================================================================
   SORA Project v100 — responsive header, full avatar frames, verified
   alignment, medium-density admin UI, GPU card motion and SEO polish.
   ===================================================================== */
:root {
  --v100-accent: var(--sora-accent, #2998f6);
  --v100-accent-2: var(--sora-accent-2, #28c4f4);
  --v100-ease: cubic-bezier(.25, 1, .5, 1);
  --v100-panel: linear-gradient(145deg, rgba(15, 31, 51, .98), rgba(7, 18, 31, .98));
  --v100-line: rgba(83, 181, 244, .18);
  --v100-shadow: 0 18px 46px rgba(0, 0, 0, .30);
  --v100-admin-sidebar: 224px;
}

/* ---------------------------------------------------------------------
   Verified marks: fixed geometry, no baseline drift, no nickname clipping.
   --------------------------------------------------------------------- */
.verified-badge,
.user-chip .verified-badge,
.team-card .verified-badge,
.profile-name-row .verified-badge,
.comment .verified-badge {
  position: static !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 999px !important;
  vertical-align: middle !important;
  align-self: center !important;
  transform: none !important;
  line-height: 1 !important;
}
.verified-badge i {
  display: block !important;
  margin: 0 !important;
  font-size: 9px !important;
  line-height: 1 !important;
  transform: none !important;
}

.user-chip-identity,
.profile-name-row,
.team-card .team-name-row {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  line-height: 1.2 !important;
}
.user-chip-name,
.profile-name,
.team-card .team-member-name {
  min-width: 0 !important;
  max-width: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
  line-height: 1.2 !important;
}
.user-chip-name { white-space: nowrap !important; }
.profile-name { white-space: normal !important; overflow-wrap: anywhere !important; }
.team-card .team-member-name {
  display: inline-block !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  font-size: 14px !important;
  letter-spacing: -.018em !important;
}
.team-card.is-name-long .team-member-name { font-size: 12.9px !important; letter-spacing: -.035em !important; }
.team-card.is-name-very-long .team-member-name { font-size: 11.8px !important; letter-spacing: -.045em !important; }
.team-card .team-name-row .verified-badge { margin-left: 1px !important; }

/* Wider cards prevent the verification icon from eating long nicknames. */
.team-grid {
  grid-template-columns: repeat(auto-fit, minmax(176px, 1fr)) !important;
  gap: 14px !important;
  align-items: stretch !important;
}
.team-card {
  min-width: 0 !important;
  overflow: visible !important;
}
.team-card .team-member-line { overflow: visible !important; }

/* ---------------------------------------------------------------------
   Avatar frames: profile receives the exact same thick layered ring as
   cards/header. Higher specificity defeats old profile-only box shadows.
   --------------------------------------------------------------------- */
.profile-public-card,
.profile-public-body,
.profile-topline,
.profile-identity,
.avatar-presence {
  overflow: visible !important;
}
.profile-public-card .profile-public-avatar.avatar-frame,
.profile-public-card .profile-public-avatar[class*="avatar-frame-"] {
  position: relative !important;
  border: 3px solid rgba(4, 11, 20, .98) !important;
  outline: 0 !important;
  box-shadow:
    0 0 0 3px rgba(8, 18, 31, .98),
    0 0 0 7px var(--frame-ring, #42b9ff),
    0 12px 28px rgba(0, 0, 0, .38),
    0 0 28px var(--frame-glow, rgba(41, 152, 246, .34)) !important;
  background-clip: padding-box !important;
  isolation: isolate !important;
}
.profile-public-card .profile-public-avatar.avatar-frame::before,
.profile-public-card .profile-public-avatar[class*="avatar-frame-"]::before {
  z-index: 6 !important;
}
.profile-public-card .profile-public-avatar.avatar-frame::after,
.profile-public-card .profile-public-avatar[class*="avatar-frame-"]::after {
  z-index: 7 !important;
}
.user-chip .avatar-frame-compact {
  border: 2px solid rgba(4, 11, 20, .98) !important;
  outline: 0 !important;
  box-shadow:
    0 0 0 2px rgba(8, 18, 31, .98),
    0 0 0 4px var(--frame-ring, #42b9ff),
    0 6px 15px rgba(0, 0, 0, .36),
    0 0 17px var(--frame-glow, rgba(41, 152, 246, .30)) !important;
}

/* ---------------------------------------------------------------------
   Release-card motion — only transforms/opacity on animated layers.
   --------------------------------------------------------------------- */
.release-card,
.new-episode-card,
.recommend-card,
.schedule-card,
.favorite-release-card,
.project-release-card-simple {
  position: relative !important;
  transform: translate3d(0, 0, 0) !important;
  will-change: auto !important;
  transition:
    transform .30s var(--v100-ease),
    box-shadow .30s var(--v100-ease),
    border-color .30s var(--v100-ease) !important;
}
.release-card::after,
.new-episode-card::after,
.recommend-card::after,
.schedule-card::after,
.favorite-release-card::after,
.project-release-card-simple::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  border-radius: inherit;
  opacity: 0;
  transform: translate3d(-28%, 0, 0) skewX(-13deg);
  background: linear-gradient(105deg, transparent 28%, rgba(143, 222, 255, .12) 48%, transparent 68%);
  transition: transform .44s var(--v100-ease), opacity .28s ease;
}
.release-poster,
.new-episode-poster,
.recommend-poster,
.schedule-card img,
.favorite-release-card .release-poster,
.project-release-poster {
  overflow: hidden !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  will-change: auto !important;
  transition: transform .30s var(--v100-ease), filter .30s var(--v100-ease) !important;
  background-size: cover !important;
  background-position: center !important;
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .release-card,
  .new-episode-card,
  .recommend-card,
  .schedule-card,
  .favorite-release-card,
  .project-release-card-simple,
  .release-poster,
  .new-episode-poster,
  .recommend-poster,
  .favorite-release-card .release-poster,
  .project-release-poster { will-change: transform !important; }
  .release-card:hover,
  .new-episode-card:hover,
  .recommend-card:hover,
  .schedule-card:hover,
  .favorite-release-card:hover,
  .project-release-card-simple:hover {
    transform: translate3d(0, -7px, 0) !important;
    border-color: rgba(79, 191, 255, .50) !important;
    box-shadow: 0 22px 48px rgba(0, 0, 0, .40), 0 0 0 1px rgba(71, 184, 255, .16) !important;
  }
  .release-card:hover::after,
  .new-episode-card:hover::after,
  .recommend-card:hover::after,
  .schedule-card:hover::after,
  .favorite-release-card:hover::after,
  .project-release-card-simple:hover::after {
    opacity: 1;
    transform: translate3d(28%, 0, 0) skewX(-13deg);
  }
  .release-card:hover .release-poster,
  .new-episode-card:hover .new-episode-poster,
  .recommend-card:hover .recommend-poster,
  .favorite-release-card:hover .release-poster,
  .project-release-card-simple:hover .project-release-poster {
    transform: translate3d(0, 0, 0) scale(1.05) !important;
    filter: saturate(1.06) brightness(1.04) !important;
  }
}

/* ---------------------------------------------------------------------
   Header/mobile navigation: deterministic two-row header and a clean
   off-canvas menu. Burger is outside the navigation in v100 markup.
   --------------------------------------------------------------------- */
.nav-burger {
  display: none;
  align-items: center;
  justify-content: center;
}
.site-header .header-inner { overflow: visible !important; }
.site-header .main-nav { overflow: visible !important; }

/* ---------------------------------------------------------------------
   Admin: medium density, larger hit targets, compact grouping.
   --------------------------------------------------------------------- */
.admin-shell { grid-template-columns: var(--v100-admin-sidebar) minmax(0, 1fr) !important; }
.admin-sidebar {
  width: var(--v100-admin-sidebar) !important;
  padding: 12px 10px !important;
}
.admin-brand {
  min-height: 66px !important;
  padding: 13px 14px !important;
  margin-bottom: 10px !important;
  border-radius: 16px !important;
}
.admin-brand-copy strong { font-size: 14px !important; line-height: 1.1 !important; }
.admin-brand-copy small { margin-top: 4px !important; font-size: 9px !important; }
.admin-nav { gap: 4px !important; }
.admin-nav a {
  min-height: 42px !important;
  padding: 6px 10px !important;
  gap: 10px !important;
  border-radius: 12px !important;
  font-size: 12.2px !important;
  font-weight: 720 !important;
  line-height: 1.15 !important;
}
.admin-nav a i {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 10px !important;
  font-size: 12px !important;
}
.admin-content { min-width: 0 !important; }
.admin-topbar {
  min-height: 64px !important;
  padding: 8px 18px !important;
}
.admin-main {
  width: 100% !important;
  max-width: 1380px !important;
  margin: 0 auto !important;
  padding: 20px 22px 34px !important;
}
.admin-page-heading { margin-bottom: 15px !important; }
.admin-page-heading h1 { font-size: clamp(24px, 2.1vw, 32px) !important; }
.admin-page-heading p { font-size: 13px !important; }
.stats-grid.admin-dashboard-stats-v99 {
  gap: 12px !important;
  margin-bottom: 14px !important;
}
.admin-dashboard-stats-v99 .stat-card {
  min-height: 92px !important;
  padding: 15px 16px !important;
  border-radius: 17px !important;
}
.admin-dashboard-stats-v99 .stat-card > i {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  font-size: 16px !important;
}
.admin-dashboard-stats-v99 .stat-num { font-size: 25px !important; }
.admin-dashboard-stats-v99 .stat-label { font-size: 10px !important; }
.admin-dashboard-stats-v99 .stat-card > b { font-size: 9px !important; }
.admin-dashboard-grid-v99 {
  grid-template-columns: minmax(0, 1.65fr) minmax(310px, .72fr) !important;
  gap: 14px !important;
}
.admin-panel { padding: 16px !important; border-radius: 18px !important; }
.admin-release-list-v99 { gap: 7px !important; }
.admin-release-list-v99 article {
  min-height: 58px !important;
  padding: 7px 9px !important;
  border-radius: 13px !important;
}
.admin-release-cover-v99 { width: 42px !important; height: 48px !important; min-width: 42px !important; border-radius: 9px !important; }
.admin-release-copy-v99 strong { font-size: 11.5px !important; }
.admin-release-copy-v99 small { font-size: 9px !important; }
.admin-quick-grid-v99 { gap: 8px !important; }
.admin-quick-grid-v99 a {
  min-height: 72px !important;
  padding: 11px !important;
  border-radius: 14px !important;
}
.admin-quick-grid-v99 a > i { width: 35px !important; height: 35px !important; min-width: 35px !important; }
.admin-quick-grid-v99 strong { font-size: 11.5px !important; }
.admin-quick-grid-v99 small { font-size: 9px !important; }
.admin-dashboard-bottom-v99 { gap: 14px !important; margin-top: 14px !important; }
.admin-menu-toggle { display: none; }

/* ---------------------------------------------------------------------
   Light-theme parity for new layers.
   --------------------------------------------------------------------- */
:root[data-theme="light"] .profile-public-card .profile-public-avatar.avatar-frame,
:root[data-theme="light"] .profile-public-card .profile-public-avatar[class*="avatar-frame-"] {
  border-color: rgba(255, 255, 255, .98) !important;
  box-shadow:
    0 0 0 3px rgba(255, 255, 255, .98),
    0 0 0 7px var(--frame-ring, #2998f6),
    0 12px 28px rgba(47, 79, 118, .22),
    0 0 24px var(--frame-glow, rgba(41, 152, 246, .24)) !important;
}
:root[data-theme="light"] .admin-sidebar,
:root[data-theme="light"] .admin-topbar,
:root[data-theme="light"] .admin-panel,
:root[data-theme="light"] .admin-dashboard-stats-v99 .stat-card {
  color: #17283d !important;
}

/* ---------------------------------------------------------------------
   Tablet and phone adaptations.
   --------------------------------------------------------------------- */
@media (max-width: 1180px) {
  :root { --v100-admin-sidebar: 208px; }
  .admin-main { padding-inline: 16px !important; }
  .admin-dashboard-grid-v99 { grid-template-columns: minmax(0, 1.35fr) minmax(285px, .78fr) !important; }
  .team-grid { grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)) !important; }
}

@media (max-width: 900px) {
  :root { --site-header-height: 132px; }
  body { padding-top: var(--site-header-height) !important; }
  .site-header { height: auto !important; }
  .site-header .container.header-inner {
    min-height: 0 !important;
    padding: 10px 14px 12px !important;
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) 48px !important;
    grid-template-areas:
      "logo spacer burger"
      "search search search" !important;
    align-items: center !important;
    gap: 10px !important;
  }
  .site-header .logo-sp-word {
    grid-area: logo !important;
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
  }
  .site-header .global-search {
    grid-area: search !important;
    order: initial !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 48px !important;
    margin: 0 !important;
  }
  .site-header .global-search > button {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
  }
  .nav-burger {
    grid-area: burger !important;
    display: inline-flex !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    margin: 0 !important;
    justify-self: end !important;
    border-radius: 14px !important;
    color: #eaf7ff !important;
    background: linear-gradient(145deg, rgba(17, 37, 59, .98), rgba(8, 21, 37, .98)) !important;
    border: 1px solid rgba(86, 180, 239, .22) !important;
  }
  .site-header .main-nav {
    position: fixed !important;
    top: calc(var(--site-header-height) + 8px) !important;
    right: 12px !important;
    left: auto !important;
    z-index: 1300 !important;
    width: min(330px, calc(100vw - 24px)) !important;
    max-height: calc(100dvh - var(--site-header-height) - 22px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    display: none !important;
    grid-template-columns: 1fr !important;
    align-content: start !important;
    gap: 7px !important;
    padding: 12px !important;
    border-radius: 20px !important;
    border: 1px solid rgba(84, 177, 238, .24) !important;
    background: linear-gradient(155deg, rgba(11, 25, 43, .995), rgba(5, 13, 24, .995)) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .58) !important;
  }
  .site-header .main-nav.nav-open { display: grid !important; }
  .site-header .main-nav > .btn,
  .site-header .main-nav > .nav-dropdown,
  .site-header .main-nav > .user-chip {
    width: 100% !important;
    max-width: none !important;
  }
  .site-header .main-nav > .btn:not(.btn-icon),
  .site-header .main-nav .nav-dropdown-toggle,
  .site-header .main-nav .btn-staff {
    min-height: 46px !important;
    justify-content: flex-start !important;
    padding-inline: 14px !important;
    font-size: 13px !important;
  }
  .site-header .main-nav .btn-icon {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
  }
  .site-header .main-nav .user-chip {
    min-height: 54px !important;
    padding: 7px 10px !important;
  }
  .site-header .main-nav .nav-dropdown-menu {
    position: static !important;
    width: 100% !important;
    margin-top: 5px !important;
    box-shadow: none !important;
  }

  body.mobile-nav-open { overflow: hidden !important; }
  body.mobile-nav-open::after {
    content: "";
    position: fixed;
    inset: var(--site-header-height) 0 0;
    z-index: 1250;
    pointer-events: none;
    background: rgba(2, 8, 16, .46);
    backdrop-filter: blur(2px);
  }

  /* Admin off-canvas on tablets/phones. */
  .admin-shell { display: block !important; }
  .admin-sidebar {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    z-index: 1500 !important;
    width: min(260px, 86vw) !important;
    transform: translate3d(-105%, 0, 0) !important;
    transition: transform .28s var(--v100-ease) !important;
    box-shadow: 24px 0 70px rgba(0, 0, 0, .48) !important;
  }
  .admin-body.admin-nav-open .admin-sidebar { transform: translate3d(0, 0, 0) !important; }
  .admin-body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 1450;
    pointer-events: none;
    opacity: 0;
    background: rgba(2, 8, 16, .62);
    backdrop-filter: blur(3px);
    transition: opacity .24s ease;
  }
  .admin-body.admin-nav-open::before { pointer-events: auto; opacity: 1; }
  .admin-menu-toggle {
    display: inline-grid !important;
    place-items: center !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    padding: 0 !important;
    border-radius: 12px !important;
    color: #eef9ff !important;
    border: 1px solid rgba(83, 181, 244, .22) !important;
    background: rgba(19, 46, 74, .74) !important;
  }
  .admin-content { width: 100% !important; }
  .admin-main { max-width: none !important; padding: 16px 13px 28px !important; }
  .admin-dashboard-grid-v99,
  .admin-dashboard-bottom-v99 { grid-template-columns: 1fr !important; }
  .admin-dashboard-side-v99 { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 640px) {
  :root { --site-header-height: 128px; }
  .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
  .team-card { padding: 12px 10px !important; }
  .team-card .team-member-name { font-size: 12.9px !important; }
  .team-card.is-name-long .team-member-name { font-size: 11.8px !important; }
  .team-card.is-name-very-long .team-member-name { font-size: 10.8px !important; }
  .team-card .verified-badge { flex-basis: 14px !important; width: 14px !important; height: 14px !important; min-width: 14px !important; min-height: 14px !important; }
  .profile-public-card .profile-public-avatar.avatar-frame,
  .profile-public-card .profile-public-avatar[class*="avatar-frame-"] {
    box-shadow:
      0 0 0 3px rgba(8, 18, 31, .98),
      0 0 0 6px var(--frame-ring, #42b9ff),
      0 10px 24px rgba(0, 0, 0, .36),
      0 0 24px var(--frame-glow, rgba(41, 152, 246, .32)) !important;
  }
  .admin-topbar { padding-inline: 10px !important; }
  .admin-topbar-title small { display: none !important; }
  .admin-topbar-title strong { font-size: 14px !important; }
  .admin-topbar .admin-open-site span { display: none !important; }
  .admin-topbar .user-chip-name { display: none !important; }
  .stats-grid.admin-dashboard-stats-v99 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 9px !important; }
  .admin-dashboard-stats-v99 .stat-card { min-height: 82px !important; padding: 11px !important; }
  .admin-dashboard-stats-v99 .stat-card > b { display: none !important; }
  .admin-dashboard-side-v99 { grid-template-columns: 1fr !important; }
  .admin-quick-grid-v99 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 420px) {
  .site-header .container.header-inner { padding-inline: 10px !important; }
  .team-grid { grid-template-columns: 1fr !important; }
  .team-card .team-member-name,
  .team-card.is-name-long .team-member-name,
  .team-card.is-name-very-long .team-member-name { font-size: 14px !important; letter-spacing: -.02em !important; }
  .admin-quick-grid-v99 { grid-template-columns: 1fr !important; }
}

@media (prefers-reduced-motion: reduce) {
  .release-card,
  .new-episode-card,
  .recommend-card,
  .schedule-card,
  .favorite-release-card,
  .project-release-card-simple,
  .release-poster,
  .new-episode-poster,
  .recommend-poster,
  .admin-sidebar {
    transition: none !important;
    will-change: auto !important;
  }
  .release-card::after,
  .new-episode-card::after,
  .recommend-card::after,
  .schedule-card::after,
  .favorite-release-card::after,
  .project-release-card-simple::after { display: none !important; }
}

/* Clean semantic release poster: no pseudo pixels, no background seams. */
.release-page .release-hero-poster {
  overflow: hidden !important;
  background: #07111d !important;
  clip-path: inset(0 round 20px) !important;
}
.release-page .release-hero-poster > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
  border: 0 !important;
  border-radius: inherit !important;
  transform: translateZ(0) !important;
  image-rendering: auto !important;
}