/* v0.14.0 — Share-inspired monochrome navigation and Refract-inspired library. */

:root {
  --share-bg: #fff;
  --share-surface: #fff;
  --share-text: #151515;
  --share-muted: #777;
  --share-faint: #aaa;
  --share-line: #e6e6e6;
  --share-selected: #edf2f6;
  --share-selected-text: #245b82;
  --share-logo: #e45e4b;
  --share-header-height: 64px;
  --share-mobile-header-height: 88px;
  --share-mobile-nav-height: 64px;
  --primary: var(--share-logo);
  --on-surface: var(--share-text);
  --on-surface-variant: var(--share-muted);
  --surface: var(--share-bg);
  --surface-container-low: var(--share-surface);
  --surface-container: var(--share-surface);
  --surface-container-high: var(--share-selected);
  --outline-variant: var(--share-line);
}

/* The live mobile header uses the workspace class names below. Keep it in the
   normal flow so the first poster starts immediately after the compact bar. */
@media (max-width: 719px) {
  html body .mobile-workspace-heading,
  html body.view-home main .library .mobile-workspace-heading,
  html body.view-database main .library .mobile-workspace-heading {
    position: sticky !important;
    inset: auto !important;
    top: 0 !important;
    z-index: 48 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: calc(54px + env(safe-area-inset-top)) !important;
    height: calc(54px + env(safe-area-inset-top)) !important;
    margin: 0 !important;
    padding: env(safe-area-inset-top) 14px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    color: var(--share-text) !important;
    background: var(--share-surface) !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body .mobile-workspace-title,
  html body.mobile-database-tab .mobile-workspace-heading > .mobile-workspace-title {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  html body .mobile-workspace-title > p,
  html body .mobile-workspace-meta {
    display: none !important;
  }

  html body .mobile-workspace-title > h2,
  html body.mobile-database-tab .mobile-workspace-heading h2 {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--share-text) !important;
    font-family: Inter, "Noto Sans SC", "Microsoft YaHei", sans-serif !important;
    font-size: 21px !important;
    font-weight: 520 !important;
    line-height: 1.15 !important;
    letter-spacing: -.025em !important;
  }

  html body:not(.view-database) .mobile-workspace-actions {
    display: none !important;
  }

  html body.view-database .mobile-workspace-actions {
    position: absolute !important;
    top: calc(env(safe-area-inset-top) + 7px) !important;
    right: 8px !important;
    bottom: auto !important;
    left: auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 2px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  html body.view-database .mobile-workspace-actions > button {
    display: grid !important;
    place-items: center !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    color: var(--share-text) !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body.view-database .mobile-workspace-actions .material-symbols-rounded {
    font-size: 28px !important;
    font-weight: 380 !important;
  }

  #profileDialog.mobile-tab-page .profile-overview-grid {
    gap: 8px !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
  }

  #profileDialog.mobile-tab-page .profile-overview-grid > div {
    border-radius: 12px !important;
    background: var(--share-group) !important;
  }
}

@media not all {
/* ========================================================================== */
/* v0.14.4 — Share restraint + Refract information hierarchy                 */
/* This final cascade is intentionally self-contained. It also normalizes     */
/* legacy secondary views that pre-date the three-tab redesign.               */
/* ========================================================================== */

:root {
  --share-bg: #ffffff;
  --share-page: #ffffff;
  --share-surface: #ffffff;
  --share-card: #f7f8f9;
  --share-group: #f1f2f4;
  --share-text: #17181a;
  --share-muted: #6f747b;
  --share-faint: #9ca1a8;
  --share-line: #e4e6e8;
  --share-card-line: #e0e3e6;
  --share-selected: #e8eff3;
  --share-selected-text: #285f85;
  --share-accent: #e45e4b;
}

html[data-mode="dark"] {
  color-scheme: dark;
  --share-bg: #24272c;
  --share-page: #24272c;
  --share-surface: #2a2e34;
  --share-card: #31363e;
  --share-group: #2c3036;
  --share-text: #f2f3f5;
  --share-muted: #b0b5bd;
  --share-faint: #858c95;
  --share-line: #414750;
  --share-card-line: #454b54;
  --share-selected: #394650;
  --share-selected-text: #a4cee9;
}

html,
body,
main,
.hero,
.library,
.site-footer {
  color: var(--share-text) !important;
  background: var(--share-page) !important;
}

html[data-mode="dark"] body::before,
html[data-mode="dark"] body::after {
  display: none !important;
}

.muted,
.card-context,
.episode-name,
.card-remaining,
.profile-stat-label,
.profile-activity-summary,
.profile-activity-legend,
.mobile-profile-actions small {
  color: var(--share-muted) !important;
}

/* The old wallpaper/color choices remain migratable in data, but the visible
   appearance UI is now deliberately limited to light/dark plus the headline. */
.personalize-dialog section:has(.theme-options),
.personalize-dialog section.background-section {
  display: none !important;
}

/* Secondary surfaces now use the same restrained visual system. */
#showDialog,
#historyDialog,
#profileDialog,
#droppedDialog,
#profileEditDialog,
#updatesDialog,
#searchDialog,
#personalizeDialog,
#accountDialog,
#pwaInstallDialog,
#mobileMenuDialog {
  color: var(--share-text) !important;
  border-color: var(--share-line) !important;
  border-radius: 18px !important;
  background: var(--share-page) !important;
  box-shadow: 0 18px 64px rgb(0 0 0 / 18%) !important;
}

.dialog-fixed,
.dialog-head,
.insights-head,
.personalize-head,
.account-head,
.pwa-install-dialog-head,
.mobile-menu-head,
.season-tabs {
  color: var(--share-text) !important;
  border-color: var(--share-line) !important;
  background: var(--share-surface) !important;
  box-shadow: none !important;
}

.dialog-body,
.insights-body,
.personalize-body,
.account-body,
.pwa-install-dialog-body,
.mobile-menu-body,
.episode-list,
.history-list,
.updates-list,
.search-results {
  color: var(--share-text) !important;
  background: var(--share-page) !important;
}

.episode,
.history-entry,
.update-entry,
.search-result-item,
.account-card,
.account-section,
.personalize-dialog section,
.profile-edit-fields,
.dropped-show-card {
  color: var(--share-text) !important;
  border-color: var(--share-line) !important;
  background: var(--share-surface) !important;
  box-shadow: none !important;
}

.season-tabs button,
.view-toggle button,
.filter-tabs button {
  border-color: var(--share-line) !important;
  background: var(--share-group) !important;
  color: var(--share-muted) !important;
  box-shadow: none !important;
}

.season-tabs button.active,
.view-toggle button.active,
.filter-tabs button.active {
  color: var(--share-selected-text) !important;
  border-color: color-mix(in srgb, var(--share-selected-text) 38%, var(--share-line)) !important;
  background: var(--share-selected) !important;
}

.remote-search,
.headline-editor,
.login-form label,
.register-form label,
.profile-edit-fields label,
.search-dialog .search-field {
  border-color: var(--share-line) !important;
  background: var(--share-group) !important;
  box-shadow: none !important;
}

.remote-search {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 6px !important;
  align-items: center !important;
  padding: 5px 5px 5px 16px !important;
  border: 1px solid var(--share-line) !important;
  border-radius: 999px !important;
  outline: 0 !important;
}

.remote-search:focus-within {
  border-color: color-mix(in srgb, var(--share-accent) 58%, var(--share-line)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--share-accent) 12%, transparent) !important;
}

.remote-search input,
.headline-editor input,
.login-form input,
.register-form input,
.profile-edit-fields input,
.search-dialog input {
  color: var(--share-text) !important;
  border-color: var(--share-line) !important;
  border-radius: 14px !important;
  background: var(--share-group) !important;
  box-shadow: none !important;
}

.remote-search input {
  min-width: 0 !important;
  border: 0 !important;
  background: transparent !important;
  outline: 0 !important;
}

.remote-search .primary-button,
.search-dialog .primary-button {
  border-radius: 999px !important;
}

.episode {
  border-width: 0 0 1px !important;
  border-radius: 0 !important;
}

.episode.selected {
  border-radius: 14px !important;
  background: var(--share-selected) !important;
}

.episode .episode-check,
.card-quick-watch {
  aspect-ratio: 1 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}

/* Calendar cells must remain real squares at every zoom level. */
.profile-activity-frame,
.profile-activity-calendar {
  box-shadow: none !important;
}

.profile-activity-calendar {
  width: max-content !important;
  min-width: calc(var(--activity-weeks, 1) * 13px) !important;
}

.profile-activity-grid {
  grid-template-rows: repeat(7, 10px) !important;
  grid-auto-columns: 10px !important;
  gap: 3px !important;
}

.activity-cell,
.profile-activity-legend i {
  width: 10px !important;
  height: 10px !important;
  min-width: 10px !important;
  min-height: 10px !important;
  aspect-ratio: 1 / 1 !important;
  border: 0 !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}

@media (min-width: 720px) {
  .topbar {
    padding-inline: max(28px, calc((100vw - 1160px) / 2)) !important;
  }

  .hero,
  .library {
    width: min(1160px, calc(100% - 56px)) !important;
    max-width: 1160px !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
  }

  .desktop-primary-nav button,
  .top-actions > button,
  .top-actions > .menu-wrap > button {
    min-height: 40px !important;
    font-size: 13px !important;
    font-weight: 550 !important;
    line-height: 1 !important;
  }

  .brand {
    font-size: 22px !important;
  }

  .hero h1 {
    max-width: 720px !important;
    font-family: "Noto Serif SC", "Songti SC", SimSun, serif !important;
    font-size: clamp(38px, 4vw, 58px) !important;
    font-weight: 600 !important;
    letter-spacing: -.035em !important;
  }

  .show-card {
    border: 1px solid var(--share-card-line) !important;
    background: var(--share-card) !important;
  }

  .show-card:hover {
    outline: 2px solid color-mix(in srgb, var(--share-selected-text) 65%, transparent) !important;
    outline-offset: 2px !important;
    transform: none !important;
  }

  .show-card:hover .poster,
  .show-card:hover .poster img {
    transform: none !important;
  }

  #profileDialog.desktop-profile-page {
    position: fixed !important;
    inset: var(--topbar-height, 64px) 0 0 !important;
    width: 100vw !important;
    max-width: none !important;
    height: calc(100dvh - var(--topbar-height, 64px)) !important;
    max-height: none !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  #profileDialog.desktop-profile-page .insights-body {
    width: min(1160px, calc(100% - 56px)) !important;
    margin-inline: auto !important;
  }
}

@media (max-width: 719px) {
  html:not(.app-ready),
  html:not(.app-ready) body {
    background: var(--share-page) !important;
  }

  html:not(.app-ready)::before {
    display: none !important;
    content: none !important;
  }

  html:not(.app-ready)::after {
    content: "OnlyShows." !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483647 !important;
    display: grid !important;
    place-items: center !important;
    color: var(--share-accent) !important;
    background: var(--share-page) !important;
    font: 800 30px/1 Inter, "Segoe UI", sans-serif !important;
    letter-spacing: -.05em !important;
  }

  .hero {
    display: none !important;
  }

  .library {
    padding-top: 0 !important;
  }

  .mobile-view-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 48 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: 100% !important;
    min-height: calc(54px + env(safe-area-inset-top)) !important;
    height: calc(54px + env(safe-area-inset-top)) !important;
    padding: env(safe-area-inset-top) 14px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    color: var(--share-text) !important;
    background: var(--share-surface) !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .mobile-view-header h2,
  .mobile-view-header .mobile-view-title {
    position: static !important;
    inset: auto !important;
    align-self: center !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--share-text) !important;
    font-family: Inter, "Noto Sans SC", "Microsoft YaHei", sans-serif !important;
    font-size: 21px !important;
    font-weight: 520 !important;
    line-height: 1.15 !important;
    letter-spacing: -.025em !important;
    transform: none !important;
  }

  .mobile-view-header .mobile-view-meta,
  .mobile-view-header .library-count {
    display: none !important;
  }

  .mobile-view-header .mobile-view-actions,
  .mobile-view-header .library-actions {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    align-items: center !important;
    align-self: center !important;
    gap: 4px !important;
    margin: 0 !important;
    transform: none !important;
  }

  .mobile-view-header .mobile-view-actions button,
  .mobile-view-header .library-actions button {
    display: grid !important;
    place-items: center !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    color: var(--share-text) !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .mobile-view-header .material-symbols-rounded {
    font-size: 28px !important;
    font-weight: 400 !important;
  }

  .show-grid {
    align-content: start !important;
    background: var(--share-page) !important;
  }

  .show-grid:not(.view-database) {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 8px 0 calc(var(--mobile-nav-height, 58px) + env(safe-area-inset-bottom) + 10px) !important;
  }

  .show-grid:not(.view-database) .show-card {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 82px minmax(0, 1fr) !important;
    grid-template-rows: 1fr !important;
    width: auto !important;
    min-height: 142px !important;
    margin: 0 10px !important;
    padding: 10px 12px 10px 10px !important;
    border: 1px solid var(--share-card-line) !important;
    border-radius: 15px !important;
    background: var(--share-card) !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  .show-grid:not(.view-database) .poster {
    grid-column: 1 !important;
    width: 82px !important;
    height: 122px !important;
    min-height: 122px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 11px !important;
    overflow: hidden !important;
    background: var(--share-group) !important;
  }

  .show-grid:not(.view-database) .poster img {
    width: 100% !important;
    height: 100% !important;
    border-radius: inherit !important;
    object-fit: cover !important;
  }

  .show-grid:not(.view-database) .card-content {
    position: relative !important;
    grid-column: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    height: 122px !important;
    padding: 1px 0 0 14px !important;
  }

  .show-grid:not(.view-database) .card-context {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    z-index: 2 !important;
    display: block !important;
    max-width: 84px !important;
    margin: 0 !important;
    color: var(--share-faint) !important;
    font-size: 10px !important;
    font-weight: 450 !important;
    line-height: 1.2 !important;
    text-align: right !important;
    white-space: nowrap !important;
  }

  .show-grid:not(.view-database) .card-context > span:first-child {
    display: none !important;
  }

  .show-grid:not(.view-database) .card-air-date {
    display: block !important;
    color: inherit !important;
  }

  .show-grid:not(.view-database) .card-top {
    min-width: 0 !important;
    padding-right: 86px !important;
  }

  .show-grid:not(.view-database) .card-top h3 {
    margin: 0 !important;
    color: var(--share-text) !important;
    font-size: 18px !important;
    font-weight: 650 !important;
    line-height: 1.28 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .show-grid:not(.view-database) .card-episode-row {
    position: static !important;
    display: block !important;
    min-width: 0 !important;
    margin-top: 6px !important;
  }

  .show-grid:not(.view-database) .next-episode {
    color: var(--share-selected-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
  }

  .show-grid:not(.view-database) .episode-name {
    margin-top: 4px !important;
    color: var(--share-muted) !important;
    font-size: 13px !important;
    font-weight: 420 !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .show-grid:not(.view-database) .progress-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 9px !important;
    padding-right: 44px !important;
  }

  .show-grid:not(.view-database) .progress-track {
    height: 4px !important;
  }

  .show-grid:not(.view-database) .progress-row > span {
    color: var(--share-muted) !important;
    font-size: 11px !important;
    font-weight: 500 !important;
  }

  .show-grid:not(.view-database) .card-remaining {
    margin-top: 5px !important;
    padding-right: 42px !important;
    color: var(--share-muted) !important;
    font-size: 11px !important;
    font-weight: 430 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .show-grid:not(.view-database) .card-quick-watch {
    position: absolute !important;
    right: 0 !important;
    bottom: 1px !important;
    display: grid !important;
    place-items: center !important;
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    margin: 0 !important;
    border: 2px solid var(--share-card-line) !important;
    border-radius: 50% !important;
    color: var(--share-text) !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .show-grid:not(.view-database) .card-quick-watch:hover,
  .show-grid:not(.view-database) .card-quick-watch:active {
    transform: none !important;
  }

  .show-grid.view-database {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-content: start !important;
    gap: 16px 9px !important;
    padding: 10px 10px calc(var(--mobile-nav-height, 58px) + env(safe-area-inset-bottom) + 10px) !important;
  }

  .show-grid.view-database .show-card {
    display: grid !important;
    grid-template-rows: auto 62px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .show-grid.view-database .poster {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 2 / 3 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 11px !important;
    overflow: hidden !important;
    background: var(--share-group) !important;
  }

  .show-grid.view-database .poster img {
    width: 100% !important;
    height: 100% !important;
    border-radius: inherit !important;
    object-fit: cover !important;
  }

  .show-grid.view-database .card-content {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    height: 62px !important;
    padding: 6px 1px 0 !important;
  }

  .show-grid.view-database .card-context,
  .show-grid.view-database .episode-name,
  .show-grid.view-database .card-air-date,
  .show-grid.view-database .card-remaining,
  .show-grid.view-database .card-quick-watch {
    display: none !important;
  }

  .show-grid.view-database .card-top,
  .show-grid.view-database .card-episode-row,
  .show-grid.view-database .next-episode,
  .show-grid.view-database .progress-row {
    margin: 0 !important;
    padding: 0 !important;
  }

  .show-grid.view-database .card-top h3 {
    margin: 0 !important;
    color: var(--share-text) !important;
    font-size: 13px !important;
    font-weight: 620 !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .show-grid.view-database .next-episode {
    margin-top: 4px !important;
    color: var(--share-muted) !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
  }

  .show-grid.view-database .progress-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 4px !important;
    margin-top: 5px !important;
  }

  .show-grid.view-database .progress-track {
    height: 3px !important;
  }

  .show-grid.view-database .progress-row > span {
    color: var(--share-muted) !important;
    font-size: 9px !important;
  }

  .mobile-library-controls {
    color: var(--share-text) !important;
    border-color: var(--share-line) !important;
    background: var(--share-surface) !important;
    box-shadow: none !important;
  }

  .mobile-library-controls .remote-search {
    border-radius: 999px !important;
    background: var(--share-group) !important;
  }

  #profileDialog.mobile-tab-page .insights-head {
    min-height: calc(54px + env(safe-area-inset-top)) !important;
    height: calc(54px + env(safe-area-inset-top)) !important;
    padding: env(safe-area-inset-top) 14px 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
  }

  #profileDialog.mobile-tab-page .insights-head h2 {
    font-family: Inter, "Noto Sans SC", "Microsoft YaHei", sans-serif !important;
    font-size: 21px !important;
    font-weight: 520 !important;
    letter-spacing: -.025em !important;
  }

  #profileDialog.mobile-tab-page .insights-body {
    padding: 12px 14px calc(var(--mobile-nav-height, 58px) + env(safe-area-inset-bottom) + 20px) !important;
  }

  #profileDialog.mobile-tab-page .profile-overview-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1px !important;
    overflow: hidden !important;
    border: 1px solid var(--share-line) !important;
    border-radius: 15px !important;
    background: var(--share-line) !important;
  }

  #profileDialog.mobile-tab-page .profile-overview-grid > div {
    min-height: 78px !important;
    padding: 12px !important;
    border: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    background: var(--share-surface) !important;
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .profile-overview-grid strong {
    font-size: 22px !important;
    font-weight: 580 !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-hub {
    border: 0 !important;
    background: transparent !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-account,
  #profileDialog.mobile-tab-page .mobile-profile-actions {
    border: 1px solid var(--share-line) !important;
    border-radius: 15px !important;
    background: var(--share-surface) !important;
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions {
    padding: 0 14px !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions > button {
    min-height: 58px !important;
    padding: 10px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: var(--share-text) !important;
    background: transparent !important;
    box-shadow: inset 0 -1px var(--share-line) !important;
    font-size: 17px !important;
    font-weight: 420 !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions > button:last-child {
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions > button > .material-symbols-rounded:last-child {
    display: none !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions > button > .material-symbols-rounded:first-child {
    color: var(--share-muted) !important;
    font-size: 25px !important;
    font-weight: 350 !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions b {
    font-size: 17px !important;
    font-weight: 430 !important;
  }

  #profileDialog.mobile-tab-page .profile-activity-section,
  #profileDialog.mobile-tab-page .profile-activity-frame {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .profile-activity-grid {
    grid-template-rows: repeat(7, 11px) !important;
    grid-auto-columns: 11px !important;
    gap: 3px !important;
  }

  #profileDialog.mobile-tab-page .activity-cell {
    width: 11px !important;
    height: 11px !important;
    min-width: 11px !important;
    min-height: 11px !important;
  }

  #showDialog,
  #historyDialog,
  #droppedDialog,
  #profileEditDialog,
  #updatesDialog,
  #searchDialog,
  #personalizeDialog,
  #accountDialog,
  #pwaInstallDialog,
  #mobileMenuDialog {
    inset: 0 !important;
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: none !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--share-page) !important;
    box-shadow: none !important;
  }

  #showDialog .dialog-fixed,
  #historyDialog .insights-head,
  #droppedDialog .insights-head,
  #profileEditDialog .insights-head,
  #updatesDialog .insights-head,
  #searchDialog .dialog-head,
  #personalizeDialog .personalize-head,
  #accountDialog .account-head,
  #pwaInstallDialog .pwa-install-dialog-head,
  #mobileMenuDialog .mobile-menu-head {
    min-height: calc(54px + env(safe-area-inset-top)) !important;
    padding: env(safe-area-inset-top) 14px 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    background: var(--share-surface) !important;
  }

  #showDialog .dialog-fixed h2,
  #historyDialog .insights-head h2,
  #droppedDialog .insights-head h2,
  #profileEditDialog .insights-head h2,
  #updatesDialog .insights-head h2,
  #searchDialog .dialog-head h2,
  #personalizeDialog .personalize-head h2,
  #accountDialog .account-head h2,
  #pwaInstallDialog .pwa-install-dialog-head h2,
  #mobileMenuDialog .mobile-menu-head h2 {
    font-family: Inter, "Noto Sans SC", "Microsoft YaHei", sans-serif !important;
    font-size: 21px !important;
    font-weight: 520 !important;
    letter-spacing: -.025em !important;
  }
}

/* Actual mobile workspace header aliases; kept last to win over legacy rules. */
@media (max-width: 719px) {
  html body .mobile-workspace-heading,
  html body.view-home main .library .mobile-workspace-heading,
  html body.view-database main .library .mobile-workspace-heading {
    position: sticky !important;
    inset: auto !important;
    top: 0 !important;
    z-index: 48 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: calc(54px + env(safe-area-inset-top)) !important;
    height: calc(54px + env(safe-area-inset-top)) !important;
    margin: 0 !important;
    padding: env(safe-area-inset-top) 14px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    color: var(--share-text) !important;
    background: var(--share-surface) !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body .mobile-workspace-title,
  html body.mobile-database-tab .mobile-workspace-heading > .mobile-workspace-title {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  html body .mobile-workspace-title > p,
  html body .mobile-workspace-meta {
    display: none !important;
  }

  html body .mobile-workspace-title > h2,
  html body.mobile-database-tab .mobile-workspace-heading h2 {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--share-text) !important;
    font-family: Inter, "Noto Sans SC", "Microsoft YaHei", sans-serif !important;
    font-size: 21px !important;
    font-weight: 520 !important;
    line-height: 1.15 !important;
    letter-spacing: -.025em !important;
  }

  html body:not(.view-database) .mobile-workspace-actions {
    display: none !important;
  }

  html body.view-database .mobile-workspace-actions {
    position: absolute !important;
    top: calc(env(safe-area-inset-top) + 7px) !important;
    right: 8px !important;
    bottom: auto !important;
    left: auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 2px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  html body.view-database .mobile-workspace-actions > button {
    display: grid !important;
    place-items: center !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    color: var(--share-text) !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body.view-database .mobile-workspace-actions .material-symbols-rounded {
    font-size: 28px !important;
    font-weight: 380 !important;
  }

  #profileDialog.mobile-tab-page .profile-overview-grid {
    gap: 8px !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
  }

  #profileDialog.mobile-tab-page .profile-overview-grid > div {
    border-radius: 12px !important;
    background: var(--share-group) !important;
  }
}
}

/* v0.14.3 — final Share/Refract alignment pass. */
:root {
  --share-page: #fff;
  --share-card: #fff;
  --share-card-line: #e7e7e7;
  --share-group: #f5f5f5;
}

html[data-mode="dark"] {
  --share-page: #000;
  --share-card: #000;
  --share-card-line: #262626;
  --share-group: #151515;
}

html,
body,
main,
.library,
.hero,
.site-footer,
.profile-dialog,
.profile-dialog .insights-scroll {
  background: var(--share-page) !important;
}

.card-quick-watch {
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  flex: 0 0 40px !important;
  aspect-ratio: 1 !important;
  box-sizing: border-box !important;
  border: 2px solid var(--share-faint) !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
}

.card-quick-watch:hover,
.card-quick-watch:focus-visible {
  border-color: var(--share-text) !important;
  outline: 2px solid color-mix(in srgb, var(--share-text) 24%, transparent) !important;
  outline-offset: 2px !important;
}

@media (min-width: 1081px) {
  .topbar {
    grid-template-columns: auto auto minmax(0, 1fr) !important;
    column-gap: 38px !important;
  }

  .topbar .top-actions {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 2px !important;
  }

  html body .topbar .top-actions > #exportButton,
  html body .topbar .top-actions > #importButton,
  html body .topbar .top-actions > #personalizeButton,
  html body .topbar .top-actions > #historyButton,
  html body .topbar .top-actions > #updatesButton,
  html body .topbar .top-actions > #accountButton {
    min-height: 34px !important;
    padding: 0 6px !important;
    display: inline-flex !important;
    align-items: center !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: var(--share-muted) !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
  }
}

@media (min-width: 720px) and (max-width: 1080px) {
  html body .topbar .top-actions > #exportButton,
  html body .topbar .top-actions > #importButton,
  html body .topbar .top-actions > #personalizeButton,
  html body .topbar .top-actions > #historyButton,
  html body .topbar .top-actions > #updatesButton {
    display: none !important;
  }

  html body .topbar .top-actions > #mobileMenuButton {
    display: grid !important;
  }
}

@media (min-width: 720px) {
  body.view-profile > main,
  body.view-profile > .site-footer {
    visibility: hidden !important;
    pointer-events: none !important;
  }

  #profileDialog.desktop-profile-page {
    position: fixed !important;
    inset: var(--share-header-height) 0 0 !important;
    z-index: 70 !important;
    width: 100vw !important;
    max-width: none !important;
    height: calc(100dvh - var(--share-header-height)) !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--share-page) !important;
    color: var(--share-text) !important;
    box-shadow: none !important;
    transform: none !important;
  }

  #profileDialog.desktop-profile-page::backdrop {
    display: none !important;
    background: transparent !important;
  }

  #profileDialog.desktop-profile-page .insights-head {
    width: min(1180px, 100%) !important;
    height: 112px !important;
    margin: 0 auto !important;
    padding: 28px 28px 18px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    background: var(--share-page) !important;
  }

  #profileDialog.desktop-profile-page .insights-head p {
    color: var(--share-logo) !important;
  }

  #profileDialog.desktop-profile-page #closeProfile {
    display: none !important;
  }

  #profileDialog.desktop-profile-page .insights-scroll {
    width: min(1180px, 100%) !important;
    height: calc(100dvh - var(--share-header-height) - 112px) !important;
    max-height: none !important;
    margin: 0 auto !important;
    padding: 24px 28px 72px !important;
    overflow: auto !important;
    background: var(--share-page) !important;
  }

  #profileDialog.desktop-profile-page .profile-overview-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  #profileDialog.desktop-profile-page .profile-data-summary {
    display: none !important;
  }

  #profileDialog.desktop-profile-page .mobile-profile-hub {
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: var(--share-group) !important;
  }
}

@media (max-width: 719px) {
  :root {
    --share-mobile-header-height: calc(50px + env(safe-area-inset-top));
    --share-mobile-nav-height: calc(50px + env(safe-area-inset-bottom));
  }

  html,
  body,
  main,
  .library,
  html body #profileDialog.mobile-tab-page,
  html body #profileDialog.mobile-tab-page .insights-scroll {
    background: var(--share-page) !important;
  }

  html body .mobile-workspace-heading,
  html body.view-home main .library .mobile-workspace-heading,
  html body.view-database main .library .mobile-workspace-heading,
  #profileDialog.mobile-tab-page .insights-head {
    position: sticky !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: var(--share-mobile-header-height) !important;
    min-height: var(--share-mobile-header-height) !important;
    margin: 0 !important;
    padding: env(safe-area-inset-top) 8px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    border-radius: 0 !important;
    background: var(--share-page) !important;
    box-shadow: none !important;
  }

  html body .mobile-workspace-title > p {
    display: none !important;
  }

  html body .mobile-workspace-title > h2,
  html body.mobile-database-tab .mobile-workspace-heading h2,
  #profileDialog.mobile-tab-page .insights-head h2 {
    position: absolute !important;
    right: auto !important;
    bottom: 12px !important;
    left: 50% !important;
    margin: 0 !important;
    color: var(--share-text) !important;
    font-family: Inter, "Noto Sans SC", "PingFang SC", sans-serif !important;
    font-size: 21px !important;
    font-weight: 650 !important;
    line-height: 1 !important;
    letter-spacing: -.035em !important;
    transform: translateX(-50%) !important;
  }

  html body.view-database .mobile-workspace-actions {
    right: 4px !important;
    bottom: 4px !important;
    height: 42px !important;
    gap: 0 !important;
  }

  html body.view-database .mobile-workspace-actions > button {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
  }

  html body.view-database .mobile-workspace-actions > button > .material-symbols-rounded {
    font-size: 26px !important;
    font-variation-settings: "wght" 350, "opsz" 24 !important;
  }

  html body.view-home:not(.mobile-profile-tab) main > .library,
  html body.view-database:not(.mobile-profile-tab) main > .library {
    min-height: 100dvh !important;
    padding: 0 0 var(--share-mobile-nav-height) !important;
    background: var(--share-page) !important;
  }

  .show-grid,
  .view-home .show-grid {
    margin: 0 !important;
    padding: 0 0 var(--share-mobile-nav-height) !important;
    gap: 0 !important;
    background: var(--share-page) !important;
  }

  #showGrid > .timeline-card,
  #showGrid > .timeline-card:hover,
  #showGrid > .timeline-card:focus-within,
  #showGrid > .timeline-card:active {
    min-height: 124px !important;
    padding: 9px 12px !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    gap: 11px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    border-radius: 0 !important;
    background: var(--share-page) !important;
  }

  #showGrid > .timeline-card .poster-frame,
  #showGrid > .timeline-card .poster {
    width: 72px !important;
    height: 106px !important;
    align-self: center !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
  }

  #showGrid > .timeline-card .card-content {
    min-height: 106px !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    background: transparent !important;
  }

  #showGrid > .timeline-card .card-context {
    margin: 0 0 3px !important;
    font-size: 10px !important;
  }

  #showGrid > .timeline-card .card-top {
    min-height: 20px !important;
    margin: 0 !important;
  }

  #showGrid > .timeline-card h3 {
    font-size: 16px !important;
    line-height: 1.25 !important;
  }

  #showGrid > .timeline-card .card-episode-row {
    min-height: 32px !important;
    margin: 5px 0 0 !important;
    align-items: center !important;
  }

  #showGrid > .timeline-card .next-episode {
    font-size: 12px !important;
  }

  #showGrid > .timeline-card .episode-name {
    margin-top: 1px !important;
    font-size: 11px !important;
  }

  #showGrid > .timeline-card .card-quick-watch {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    flex-basis: 34px !important;
  }

  #showGrid > .timeline-card .progress-row {
    margin: 7px 0 0 !important;
    gap: 8px !important;
  }

  html body.view-database:not(.mobile-profile-tab) main #showGrid.show-grid,
  .view-database .show-grid {
    padding: 8px 10px calc(var(--share-mobile-nav-height) + 8px) !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-content: start !important;
    gap: 14px 8px !important;
    background: var(--share-page) !important;
  }

  #showGrid > .database-card,
  #showGrid > .database-card:hover,
  #showGrid > .database-card:focus-within,
  #showGrid > .database-card:active {
    grid-template-rows: auto 66px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  #showGrid > .database-card .poster-frame,
  #showGrid > .database-card .poster {
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
  }

  #showGrid > .database-card .card-content {
    height: 66px !important;
    padding: 6px 1px 0 !important;
    grid-template-rows: minmax(28px, auto) 14px 1fr !important;
    background: transparent !important;
  }

  #showGrid > .database-card .card-top {
    min-height: 28px !important;
  }

  #showGrid > .database-card h3 {
    font-size: 12px !important;
    line-height: 1.2 !important;
  }

  #showGrid > .database-card .card-episode-row {
    min-height: 14px !important;
    margin: 0 !important;
  }

  #showGrid > .database-card .next-episode {
    font-size: 10px !important;
  }

  #showGrid > .database-card .progress-row {
    margin: 4px 0 0 !important;
  }

  html body > .mobile-bottom-shell,
  html body > .mobile-bottom-shell > .mobile-bottom-nav,
  html body > .mobile-bottom-shell > .mobile-bottom-nav.is-scroll-hidden,
  html body.mobile-database-tab > .mobile-bottom-shell > .mobile-bottom-nav {
    height: var(--share-mobile-nav-height) !important;
    min-height: var(--share-mobile-nav-height) !important;
    background: var(--share-page) !important;
  }

  html body > .mobile-bottom-shell > .mobile-bottom-nav,
  html body > .mobile-bottom-shell > .mobile-bottom-nav.is-scroll-hidden,
  html body.mobile-database-tab > .mobile-bottom-shell > .mobile-bottom-nav {
    padding: 2px 22px !important;
    gap: 10px !important;
  }

  .mobile-bottom-tab {
    height: 44px !important;
    min-height: 44px !important;
  }

  .mobile-tab-indicator {
    width: 62px !important;
    height: 36px !important;
  }

  #profileDialog.mobile-tab-page .insights-scroll {
    padding: calc(var(--share-mobile-header-height) + 8px) 12px calc(var(--share-mobile-nav-height) + 12px) !important;
    display: flex !important;
    flex-direction: column !important;
    background: var(--share-page) !important;
  }

  #profileDialog.mobile-tab-page .profile-summary {
    order: 1;
  }

  #profileDialog.mobile-tab-page .profile-overview {
    order: 2;
  }

  #profileDialog.mobile-tab-page .mobile-profile-hub {
    order: 3;
  }

  #profileDialog.mobile-tab-page .profile-data-summary {
    display: none !important;
  }

  #profileDialog.mobile-tab-page .profile-activity-section {
    order: 4;
  }

  .profile-summary,
  .profile-overview,
  .mobile-profile-hub,
  .profile-activity-section {
    margin: 0 0 10px !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: var(--share-group) !important;
    box-shadow: none !important;
  }

  .profile-summary {
    min-height: 68px !important;
    padding: 8px 12px !important;
    grid-template-columns: 48px minmax(0, 1fr) 36px !important;
  }

  .profile-summary > img {
    width: 48px !important;
    height: 48px !important;
  }

  .profile-overview {
    padding: 8px 4px !important;
  }

  .profile-overview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .profile-overview-grid > div {
    min-height: 62px !important;
    padding: 8px 5px !important;
    border: 0 !important;
  }

  .profile-overview-grid > div:nth-child(even) {
    border-left: 1px solid var(--share-card-line) !important;
  }

  .profile-overview-grid > div:nth-child(n + 3) {
    border-top: 1px solid var(--share-card-line) !important;
  }

  .profile-overview-grid strong {
    font-size: 19px !important;
  }

  .mobile-profile-hub {
    overflow: visible !important;
    background: transparent !important;
  }

  .mobile-profile-account,
  .mobile-profile-actions {
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: var(--share-group) !important;
  }

  .mobile-profile-account {
    width: 100% !important;
    min-height: 58px !important;
    margin: 0 0 10px !important;
    padding: 9px 14px !important;
  }

  .mobile-profile-actions {
    padding: 0 14px !important;
  }

  .mobile-profile-actions > button {
    min-height: 54px !important;
    padding: 8px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: inset 0 -1px var(--share-card-line) !important;
  }

  .mobile-profile-actions > button:last-child {
    box-shadow: none !important;
  }

  .profile-activity-section {
    padding: 14px !important;
  }

  .profile-activity-frame {
    padding: 8px 0 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

html[data-mode="light"] {
  --surface: #fff !important;
  --surface-container-low: #fff !important;
  --surface-container: #fff !important;
  --surface-container-high: #f4f4f4 !important;
  --surface-container-highest: #ededed !important;
  --on-surface: #151515 !important;
  --on-surface-variant: #777 !important;
  --outline-variant: #e6e6e6 !important;
}

html[data-mode="dark"] {
  --surface: #000 !important;
  --surface-container-low: #000 !important;
  --surface-container: #000 !important;
  --surface-container-high: #202020 !important;
  --surface-container-highest: #292929 !important;
  --on-surface: #f3f3f3 !important;
  --on-surface-variant: #a3a3a3 !important;
  --outline-variant: #292929 !important;
}

html[data-mode="dark"] {
  --share-bg: #000;
  --share-surface: #000;
  --share-text: #f3f3f3;
  --share-muted: #a3a3a3;
  --share-faint: #707070;
  --share-line: #292929;
  --share-selected: #20252a;
  --share-selected-text: #9dc9e9;
  --share-logo: #ee725e;
}

html,
body,
main,
.library,
.hero,
.site-footer,
.insights-dialog,
.insights-dialog .insights-scroll,
.profile-dialog,
.profile-dialog .insights-scroll {
  background: var(--share-bg) !important;
  background-image: none !important;
  color: var(--share-text) !important;
}

html,
body {
  min-height: 100%;
}

body {
  font-family: Inter, "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif !important;
}

body::before,
body::after,
.theme-backdrop {
  display: none !important;
  content: none !important;
}

button,
input {
  color: inherit;
}

.topbar {
  position: sticky !important;
  top: 0;
  z-index: 80;
  height: var(--share-header-height) !important;
  padding: 0 max(28px, calc((100vw - 1180px) / 2)) !important;
  display: grid !important;
  grid-template-columns: minmax(150px, 1fr) auto minmax(150px, 1fr);
  align-items: center;
  border: 0 !important;
  border-bottom: 1px solid var(--share-line) !important;
  background: var(--share-bg) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  transition: transform 220ms cubic-bezier(.2, 0, 0, 1);
}

.brand {
  justify-self: start;
  font-family: Inter, sans-serif !important;
  font-size: 23px !important;
  font-weight: 800 !important;
  letter-spacing: -.055em !important;
}

.brand .logo-word,
.brand .logo-dot {
  color: var(--share-logo) !important;
}

.desktop-primary-nav {
  display: flex;
  align-self: stretch;
  align-items: stretch;
  gap: 34px;
}

.desktop-primary-nav button {
  position: relative;
  border: 0;
  padding: 0 2px;
  background: transparent;
  color: var(--share-muted);
  font-weight: 600;
}

.desktop-primary-nav button::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 2px;
  background: transparent;
}

.desktop-primary-nav button.active {
  color: var(--share-text);
}

.desktop-primary-nav button.active::after {
  background: var(--share-text);
}

.top-actions {
  justify-self: end;
  gap: 8px !important;
}

.top-actions > #exportButton,
.top-actions > #importButton,
.top-actions > #mobileMenuButton {
  display: none !important;
}

#addButton {
  min-width: 42px;
  height: 42px;
  padding: 0 15px !important;
  border: 1px solid var(--share-line) !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: var(--share-text) !important;
  box-shadow: none !important;
}

#addButton:hover {
  background: var(--share-selected) !important;
}

.hero {
  width: min(1180px, 100%);
  margin: 0 auto !important;
  padding: 44px 28px 22px !important;
}

.share-kicker {
  margin: 0 0 7px;
  color: var(--share-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .13em;
}

.hero h1 {
  margin: 0 !important;
  font-family: "Noto Serif SC", "Songti SC", serif !important;
  font-size: 42px !important;
  font-weight: 600 !important;
  letter-spacing: -.04em !important;
  line-height: 1.2 !important;
}

.hero .stats,
.hero .more-data-button {
  display: none !important;
}

.library {
  width: min(1180px, 100%);
  min-height: 60vh;
  margin: 0 auto !important;
  padding: 0 28px 72px !important;
}

.mobile-workspace-heading {
  display: none;
}

.controls {
  display: none !important;
}

.view-database .controls {
  margin: 0 0 24px !important;
  padding: 0 0 12px !important;
  display: flex !important;
  justify-content: flex-end !important;
  border: 0 !important;
  border-bottom: 1px solid var(--share-line) !important;
  background: transparent !important;
}

.view-database .controls .tabs,
.view-database .controls #cardViewToggle,
.view-database .controls #searchScope,
.view-database .controls #mobileSearchClose {
  display: none !important;
}

.view-database .controls .search {
  width: min(320px, 100%);
  height: 40px;
  padding: 0 12px;
  border: 1px solid var(--share-line);
  border-radius: 0;
  background: transparent;
  color: var(--share-muted);
}

.view-database .controls .search input {
  width: 100%;
  font-size: 14px;
}

.show-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 28px 18px !important;
  overflow: visible !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 !important;
  scroll-snap-type: none !important;
}

.view-database .show-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 24px 16px !important;
}

#showGrid > .show-card,
#showGrid > .show-card:hover,
#showGrid > .show-card:focus-within,
#showGrid > .show-card:active {
  position: relative !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 0 17px !important;
  display: block !important;
  overflow: visible !important;
  border: 0 !important;
  border-bottom: 1px solid var(--share-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline-offset: 3px !important;
  transform: none !important;
  transition: outline-color 150ms ease, background-color 150ms ease !important;
}

#showGrid > .show-card:hover,
#showGrid > .show-card:focus-visible {
  outline: 1px solid var(--share-text) !important;
}

#showGrid > .show-card .poster-frame {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 2 / 3 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--share-selected) !important;
}

#showGrid > .show-card .poster,
#showGrid > .show-card:hover .poster {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transform: none !important;
  filter: none !important;
}

#showGrid > .show-card .card-content {
  min-width: 0;
  padding: 12px 1px 0 !important;
  display: flex !important;
  flex-direction: column;
  background: transparent !important;
}

.card-context {
  margin-bottom: 5px;
  color: var(--share-faint);
  font-size: 11px;
  font-weight: 500;
}

.card-top {
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
}

.show-card h3 {
  min-width: 0;
  margin: 0 !important;
  overflow: hidden;
  color: var(--share-text) !important;
  font-family: Inter, "Noto Sans SC", sans-serif !important;
  font-size: 16px !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.show-card .badge {
  margin-left: auto;
  color: var(--share-muted) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
}

.card-episode-row {
  min-width: 0;
  margin-top: 9px;
  display: flex !important;
  align-items: center !important;
  gap: 8px;
}

.show-card .next-episode {
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--share-text) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.show-card .episode-name {
  margin-top: 3px !important;
  color: var(--share-muted) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
}

.card-quick-watch {
  flex: 0 0 32px !important;
  width: 32px !important;
  height: 32px !important;
  margin-left: auto !important;
  border: 1px solid var(--share-line) !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--share-text) !important;
  box-shadow: none !important;
}

.card-quick-watch:hover {
  border-color: var(--share-text) !important;
  background: var(--share-selected) !important;
}

.progress-row {
  margin-top: 12px !important;
  gap: 8px !important;
  color: var(--share-muted) !important;
  font-size: 10px !important;
}

.progress-track {
  height: 2px !important;
  border-radius: 0 !important;
  background: var(--share-line) !important;
}

.progress-fill {
  border-radius: 0 !important;
  background: var(--share-text) !important;
}

.no-results {
  padding: 80px 20px !important;
  color: var(--share-muted) !important;
}

.site-footer {
  border-top: 1px solid var(--share-line) !important;
  color: var(--share-muted) !important;
}

.mobile-workspace-dock,
.mobile-database-actions {
  display: none !important;
}

.profile-dialog section + section,
.mobile-profile-actions > button,
.mobile-profile-account,
.pwa-install-button {
  border-color: var(--share-line) !important;
}

.share-appearance-section > p {
  margin: -4px 0 16px;
  color: var(--share-muted);
  font-size: 13px;
}

.share-mode-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid var(--share-line);
}

.share-mode-options button {
  min-height: 78px;
  padding: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 0;
  background: transparent;
  text-align: left;
}

.share-mode-options button + button {
  border-left: 1px solid var(--share-line);
}

.share-mode-options button[aria-pressed="true"] {
  background: var(--share-selected);
}

.share-mode-options i {
  width: 30px;
  height: 30px;
  border: 1px solid #999;
  border-radius: 50%;
  background: #fff;
}

.share-mode-options button[data-mode="dark"] i {
  background: #000;
}

.share-mode-options span {
  display: grid;
  gap: 3px;
}

.share-mode-options small {
  color: var(--share-muted);
}

.legacy-personalization,
.legacy-profile-highlights {
  display: none !important;
}

dialog,
.dialog-head,
.insights-head,
.personalize-head,
.account-head,
.mobile-menu-head {
  background: var(--share-surface) !important;
  color: var(--share-text) !important;
}

dialog {
  border: 1px solid var(--share-line) !important;
  box-shadow: 0 18px 70px rgb(0 0 0 / 22%) !important;
}

dialog::backdrop {
  background: rgb(0 0 0 / 48%) !important;
  backdrop-filter: none !important;
}

.icon-button {
  background: transparent !important;
  color: var(--share-text) !important;
}

.profile-dialog {
  width: min(980px, calc(100% - 32px)) !important;
}

.profile-dialog .insights-head {
  border-bottom: 1px solid var(--share-line) !important;
}

.profile-summary {
  padding: 24px 0 !important;
  grid-template-columns: 76px minmax(0, 1fr) auto !important;
  gap: 18px !important;
}

.profile-summary > img {
  width: 76px !important;
  height: 76px !important;
  border-radius: 50% !important;
}

.profile-summary strong {
  font-size: 24px !important;
}

.profile-summary button {
  border: 0 !important;
  background: transparent !important;
  color: var(--share-muted) !important;
}

.profile-stats {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 0 !important;
  border-top: 1px solid var(--share-line);
  border-bottom: 1px solid var(--share-line);
}

.profile-stat {
  min-height: 106px !important;
  padding: 18px 12px !important;
  display: grid !important;
  place-content: center !important;
  gap: 6px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  text-align: center;
}

.profile-stat + .profile-stat {
  border-left: 1px solid var(--share-line) !important;
}

.profile-stat strong {
  font-size: 22px !important;
}

.profile-stat span {
  color: var(--share-muted) !important;
  font-size: 11px !important;
}

.profile-activity-frame,
.profile-activity-years button,
.profile-activity-years button[aria-selected="true"] {
  border-radius: 0 !important;
  box-shadow: none !important;
}

.profile-activity-frame {
  border: 1px solid var(--share-line) !important;
  background: transparent !important;
}

.mobile-profile-hub,
.mobile-profile-actions,
.mobile-profile-account,
.mobile-profile-actions > button {
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.mobile-profile-actions > button,
.mobile-profile-account {
  border: 0 !important;
  border-bottom: 1px solid var(--share-line) !important;
}

.mobile-profile-actions > button > .material-symbols-rounded:first-child,
.mobile-profile-account > .material-symbols-rounded:first-child {
  width: 32px !important;
  height: 32px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--share-muted) !important;
}

@media (max-width: 1020px) and (min-width: 720px) {
  .show-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .view-database .show-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  .profile-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .profile-stat:nth-child(4) {
    border-left: 0 !important;
  }
}

@media (max-width: 719px) {
  html[data-mode="light"][data-background] body {
    background: #fff !important;
  }

  html[data-mode="dark"][data-background] body {
    background: #000 !important;
  }

  :root {
    --share-mobile-header-height: calc(80px + env(safe-area-inset-top));
    --share-mobile-nav-height: calc(60px + env(safe-area-inset-bottom));
  }

  html,
  body {
    width: 100%;
    overflow-x: clip !important;
    overflow-y: visible !important;
    overscroll-behavior-y: none;
  }

  body {
    padding: 0 !important;
  }

  .topbar,
  .hero,
  .site-footer {
    display: none !important;
  }

  main {
    width: 100%;
    min-height: 100dvh;
  }

  .library {
    width: 100% !important;
    min-height: 100dvh;
    margin: 0 !important;
    padding: 0 0 calc(var(--share-mobile-nav-height) + 12px) !important;
    overflow: visible !important;
  }

  .mobile-workspace-heading {
    position: sticky !important;
    top: 0 !important;
    z-index: 72 !important;
    height: var(--share-mobile-header-height) !important;
    min-height: var(--share-mobile-header-height) !important;
    margin: 0 !important;
    padding: calc(9px + env(safe-area-inset-top)) 16px 10px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    align-items: end !important;
    gap: 12px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    border-radius: 0 !important;
    background: var(--share-bg) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    transition: transform 230ms cubic-bezier(.2, 0, 0, 1) !important;
  }

  .mobile-workspace-title {
    min-width: 0;
  }

  .mobile-workspace-title p {
    margin: 0 0 2px !important;
    color: var(--share-logo) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .1em !important;
    line-height: 1 !important;
  }

  .mobile-workspace-title h2 {
    margin: 0 !important;
    color: var(--share-text) !important;
    font-family: "Noto Serif SC", "Songti SC", serif !important;
    font-size: 27px !important;
    font-weight: 600 !important;
    letter-spacing: -.045em !important;
    line-height: 1.15 !important;
  }

  .mobile-workspace-meta {
    padding-bottom: 5px;
    color: var(--share-muted);
    font-size: 11px;
    white-space: nowrap;
  }

  .mobile-workspace-actions {
    padding-bottom: 0;
    display: none !important;
    align-items: center;
    gap: 2px;
  }

  .view-database .mobile-workspace-meta {
    display: none;
  }

  .view-database .mobile-workspace-actions {
    display: flex !important;
  }

  .mobile-workspace-actions button {
    width: 42px;
    height: 42px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: var(--share-text);
  }

  .mobile-workspace-actions .material-symbols-rounded {
    font-size: 26px;
  }

  .controls,
  .view-database .controls {
    display: none !important;
  }

  .view-database.database-search-open .controls,
  .view-database .database-search-open .controls,
  body.view-database.database-search-open .controls {
    position: sticky !important;
    top: 0 !important;
    z-index: 73 !important;
    height: 58px !important;
    margin: 0 !important;
    padding: 8px 16px !important;
    display: block !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    background: var(--share-bg) !important;
  }

  body.view-database.database-search-open .controls .search {
    width: 100% !important;
    height: 42px !important;
    padding: 0 2px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-text) !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  body.view-database.database-search-open .controls {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }

  html body.view-database.database-search-open .controls #mobileSearchClose.mobile-search-close {
    position: static !important;
    width: 34px !important;
    height: 42px !important;
    flex: 0 0 34px !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--share-text) !important;
    pointer-events: auto !important;
  }

  html body.view-database.database-search-open .controls #mobileSearchClose.mobile-search-close .material-symbols-rounded {
    color: var(--share-text) !important;
    opacity: 1 !important;
  }

  body.view-database.database-search-open .mobile-workspace-heading {
    display: none !important;
  }

  .show-grid,
  .view-home .show-grid {
    width: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    overflow: visible !important;
    transform: none !important;
  }

  #showGrid > .timeline-card,
  #showGrid > .timeline-card:hover,
  #showGrid > .timeline-card:focus-within,
  #showGrid > .timeline-card:active {
    min-height: 146px !important;
    padding: 16px !important;
    display: grid !important;
    grid-template-columns: 78px minmax(0, 1fr) !important;
    gap: 15px !important;
    border-bottom: 1px solid var(--share-line) !important;
  }

  #showGrid > .timeline-card .poster-frame {
    width: 78px !important;
    height: 112px !important;
    aspect-ratio: auto !important;
    align-self: center !important;
    border-radius: 3px !important;
  }

  #showGrid > .timeline-card .card-content {
    min-height: 112px;
    padding: 0 !important;
    justify-content: center;
  }

  #showGrid > .timeline-card .card-context {
    margin: 0 0 8px;
    color: var(--share-faint);
    font-size: 10px;
  }

  #showGrid > .timeline-card h3 {
    font-size: 17px !important;
  }

  #showGrid > .timeline-card .card-episode-row {
    margin-top: 12px !important;
  }

  #showGrid > .timeline-card .next-episode {
    font-size: 13px !important;
  }

  #showGrid > .timeline-card .episode-name {
    max-width: 48vw;
    font-size: 12px !important;
  }

  #showGrid > .timeline-card .progress-row {
    margin-top: 13px !important;
  }

  .view-database .show-grid {
    padding: 14px 14px 18px !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-content: start !important;
    gap: 20px 10px !important;
  }

  #showGrid > .database-card,
  #showGrid > .database-card:hover,
  #showGrid > .database-card:focus-within,
  #showGrid > .database-card:active {
    padding: 0 !important;
    border-bottom: 0 !important;
  }

  #showGrid > .database-card .poster-frame {
    border-radius: 7px !important;
  }

  #showGrid > .database-card .card-content {
    padding: 8px 0 0 !important;
  }

  #showGrid > .database-card .card-context,
  #showGrid > .database-card .badge,
  #showGrid > .database-card .episode-name,
  #showGrid > .database-card .card-quick-watch {
    display: none !important;
  }

  #showGrid > .database-card h3 {
    font-size: 12px !important;
    line-height: 1.35 !important;
  }

  #showGrid > .database-card .card-episode-row {
    margin-top: 5px !important;
  }

  #showGrid > .database-card .next-episode {
    color: var(--share-muted) !important;
    font-size: 10px !important;
  }

  #showGrid > .database-card .progress-row {
    margin-top: 7px !important;
  }

  #showGrid > .database-card .progress-row > span {
    display: none;
  }

  .mobile-bottom-shell {
    position: fixed !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 90 !important;
    width: 100% !important;
    height: var(--share-mobile-nav-height) !important;
    min-height: var(--share-mobile-nav-height) !important;
    margin: 0 !important;
    padding: 0 0 env(safe-area-inset-bottom) !important;
    display: block !important;
    border: 0 !important;
    border-top: 1px solid var(--share-line) !important;
    border-radius: 0 !important;
    background: var(--share-bg) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    transition: transform 230ms cubic-bezier(.2, 0, 0, 1) !important;
  }

  .mobile-bottom-nav {
    width: 100% !important;
    height: 60px !important;
    min-height: 60px !important;
    margin: 0 !important;
    padding: 6px 20px !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .mobile-bottom-tab {
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--share-muted) !important;
  }

  .mobile-tab-indicator {
    width: 62px !important;
    height: 36px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 999px !important;
    background: transparent !important;
    transition: background-color 180ms ease, color 180ms ease !important;
  }

  .mobile-bottom-tab.active .mobile-tab-indicator {
    background: var(--share-selected) !important;
    color: var(--share-selected-text) !important;
  }

  .mobile-bottom-tab .app-solid-icon {
    width: 23px !important;
    height: 23px !important;
    fill: currentColor !important;
  }

  body.mobile-chrome-hidden .mobile-workspace-heading,
  body.mobile-chrome-hidden #profileDialog.mobile-tab-page .insights-head {
    transform: translateY(-105%) !important;
  }

  body.mobile-chrome-hidden .mobile-bottom-shell {
    transform: translateY(105%) !important;
  }

  body.mobile-chrome-hidden .library {
    padding-bottom: 12px !important;
  }

  .toast {
    bottom: calc(var(--share-mobile-nav-height) + 12px) !important;
    z-index: 200 !important;
  }

  body.mobile-chrome-hidden .toast {
    bottom: 14px !important;
  }

  #profileDialog.mobile-tab-page {
    position: fixed !important;
    inset: 0 !important;
    z-index: 70 !important;
    width: 100% !important;
    height: 100dvh !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--share-bg) !important;
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .insights-head {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    z-index: 3 !important;
    height: var(--share-mobile-header-height) !important;
    margin: 0 !important;
    padding: calc(10px + env(safe-area-inset-top)) 16px 10px !important;
    display: flex !important;
    align-items: flex-end !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    background: var(--share-bg) !important;
    transition: transform 230ms cubic-bezier(.2, 0, 0, 1) !important;
  }

  #profileDialog.mobile-tab-page .insights-head p {
    margin: 0 0 2px !important;
    color: var(--share-logo) !important;
    font-size: 10px !important;
    letter-spacing: .1em !important;
  }

  #profileDialog.mobile-tab-page .insights-head h2 {
    margin: 0 !important;
    font-family: "Noto Serif SC", "Songti SC", serif !important;
    font-size: 27px !important;
    font-weight: 600 !important;
    letter-spacing: -.045em !important;
  }

  #profileDialog.mobile-tab-page #closeProfile {
    display: none !important;
  }

  #profileDialog.mobile-tab-page .insights-scroll {
    grid-row: 1 / -1;
    height: 100% !important;
    max-height: none !important;
    padding: var(--share-mobile-header-height) 16px calc(var(--share-mobile-nav-height) + 20px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }

  .profile-summary {
    min-height: 96px !important;
    padding: 14px 0 !important;
    grid-template-columns: 60px minmax(0, 1fr) auto !important;
    gap: 14px !important;
    border-bottom: 1px solid var(--share-line) !important;
  }

  .profile-summary > img {
    width: 60px !important;
    height: 60px !important;
  }

  .profile-summary strong {
    font-size: 20px !important;
  }

  .profile-summary button span:last-child {
    display: none !important;
  }

  .profile-summary button .material-symbols-rounded {
    font-size: 24px !important;
  }

  .mobile-profile-hub {
    margin: 0 !important;
  }

  .mobile-profile-account,
  .mobile-profile-actions > button {
    min-height: 64px !important;
    padding: 10px 0 !important;
    grid-template-columns: 38px minmax(0, 1fr) 24px !important;
    gap: 10px !important;
  }

  .mobile-profile-actions b,
  .mobile-profile-account b {
    font-size: 15px !important;
  }

  .mobile-profile-actions small,
  .mobile-profile-account small {
    color: var(--share-muted) !important;
    font-size: 11px !important;
  }

  .profile-data-summary {
    padding: 24px 0 !important;
  }

  .profile-data-summary h3,
  .profile-activity-heading h3 {
    font-size: 15px !important;
  }

  .profile-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .profile-stat {
    min-height: 88px !important;
    padding: 12px 6px !important;
  }

  .profile-stat:nth-child(4) {
    border-left: 0 !important;
  }

  .profile-stat:nth-child(n + 4) {
    border-top: 1px solid var(--share-line) !important;
  }

  .profile-stat strong {
    font-size: 18px !important;
  }

  .profile-activity-section {
    padding: 24px 0 12px !important;
  }

  .profile-activity-frame {
    width: 100% !important;
    padding: 10px !important;
    overflow: hidden !important;
  }

  .profile-activity-scroll {
    width: 100% !important;
    overflow-x: auto !important;
  }

  .activity-cell {
    width: 12px !important;
    height: 12px !important;
    border-radius: 1px !important;
  }

  .personalize-dialog {
    background: var(--share-bg) !important;
    color: var(--share-text) !important;
  }

  .share-mode-options {
    grid-template-columns: 1fr;
  }

  .share-mode-options button + button {
    border-top: 1px solid var(--share-line);
    border-left: 0;
  }

  .empty-state {
    margin-top: 16vh !important;
    border-radius: 0 !important;
    background: transparent !important;
  }
}

/* Final mobile reset: older release sheets used fixed offsets and warm surfaces. */
@media (max-width: 719px) {
  html body,
  html body main,
  html body .library,
  html body #profileDialog.mobile-tab-page,
  html body #profileDialog.mobile-tab-page .insights-scroll {
    background-color: var(--share-bg) !important;
  }

  html body.view-profile main .mobile-workspace-heading {
    display: none !important;
  }

  html body.view-home:not(.mobile-profile-tab) main > section.library:not([hidden]),
  html body.view-database:not(.mobile-profile-tab) main > section.library:not([hidden]),
  html body:not(.mobile-profile-tab):not(.mobile-menu-open) main > section.library:not([hidden]) {
    position: relative !important;
    inset: auto 0 auto 0 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 100dvh !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 0 calc(var(--share-mobile-nav-height) + 12px) !important;
    display: block !important;
    overflow: visible !important;
  }

  html body .mobile-workspace-heading {
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    padding-right: 14px !important;
    padding-left: 14px !important;
    display: block !important;
    background: var(--share-bg) !important;
  }

  html body.view-home:not(.mobile-profile-tab) main .library .mobile-workspace-heading,
  html body.view-database:not(.mobile-profile-tab) main .library .mobile-workspace-heading {
    position: sticky !important;
    inset: 0 0 auto !important;
    height: var(--share-mobile-header-height) !important;
    min-height: var(--share-mobile-header-height) !important;
  }

  html body.mobile-chrome-hidden.view-home:not(.mobile-profile-tab) main .library .mobile-workspace-heading,
  html body.mobile-chrome-hidden.view-database:not(.mobile-profile-tab) main .library .mobile-workspace-heading {
    height: var(--share-mobile-header-height) !important;
    min-height: var(--share-mobile-header-height) !important;
    transform: translateY(-105%) !important;
  }

  html body .mobile-workspace-title,
  html body.mobile-database-tab .mobile-workspace-heading > .mobile-workspace-title {
    position: static !important;
    width: auto !important;
    height: auto !important;
    transform: none !important;
  }

  html body .mobile-workspace-title > p {
    position: absolute !important;
    bottom: 17px !important;
    left: 14px !important;
    margin: 0 !important;
  }

  html body .mobile-workspace-title > h2,
  html body.mobile-database-tab .mobile-workspace-heading h2 {
    position: absolute !important;
    right: auto !important;
    bottom: 10px !important;
    left: 50% !important;
    width: auto !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
    white-space: nowrap !important;
  }

  html body .mobile-workspace-meta {
    display: none !important;
  }

  html body:not(.view-database) .mobile-workspace-actions {
    display: none !important;
  }

  html body.view-database .mobile-workspace-actions {
    position: absolute !important;
    right: 8px !important;
    bottom: 8px !important;
    left: auto !important;
    z-index: 3 !important;
    width: auto !important;
    height: 44px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    transform: none !important;
  }

  html body.view-database .mobile-workspace-actions > button {
    position: static !important;
    inset: auto !important;
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    color: var(--share-text) !important;
    background: transparent !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  html body.view-database .mobile-workspace-actions > button > .material-symbols-rounded {
    color: var(--share-text) !important;
    opacity: 1 !important;
  }

  html body.view-database:not(.mobile-profile-tab) main #showGrid.show-grid {
    padding: 14px 14px calc(var(--share-mobile-nav-height) + 18px) !important;
  }

  html body.view-database.database-search-open:not(.mobile-profile-tab) main #showGrid.show-grid {
    padding-top: 14px !important;
  }

  html body.view-database main #showGrid.show-grid::before,
  html body.view-database main #showGrid.show-grid::after {
    content: none !important;
    display: none !important;
  }

  html body.view-database main #showGrid.show-grid > .database-card {
    grid-column: auto !important;
    grid-row: auto !important;
  }

  html body > .mobile-bottom-shell {
    position: fixed !important;
    inset: auto 0 0 !important;
    z-index: 1200 !important;
    width: 100% !important;
    height: var(--share-mobile-nav-height) !important;
    min-height: var(--share-mobile-nav-height) !important;
    padding: 0 0 env(safe-area-inset-bottom) !important;
    background: var(--share-bg) !important;
  }

  html body:not(.mobile-database-tab) > .mobile-bottom-shell > .mobile-database-actions[hidden],
  html body:not(.view-database) > .mobile-bottom-shell > .mobile-database-actions[hidden],
  html body > .mobile-bottom-shell > .mobile-database-actions[hidden] {
    display: none !important;
  }

  html body > .mobile-bottom-shell > .mobile-bottom-nav,
  html body > .mobile-bottom-shell > .mobile-bottom-nav.is-scroll-hidden,
  html body.mobile-database-tab > .mobile-bottom-shell > .mobile-bottom-nav {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    height: 60px !important;
    min-height: 60px !important;
    margin: 0 !important;
    padding: 6px 20px !important;
    display: grid !important;
    transform: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: transparent !important;
  }

  html body > .mobile-bottom-shell .mobile-bottom-tab {
    position: static !important;
    inset: auto !important;
    transform: none !important;
  }

  html body.mobile-chrome-hidden > .mobile-bottom-shell {
    transform: translateY(105%) !important;
  }

  html body #profileDialog.mobile-tab-page .profile-sign-in-gate,
  html body #profileDialog.mobile-tab-page .mobile-profile-hub,
  html body #profileDialog.mobile-tab-page .mobile-profile-actions,
  html body #profileDialog.mobile-tab-page .mobile-profile-account {
    border-color: var(--share-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body #profileDialog.mobile-tab-page .profile-sign-in-gate {
    margin: 0 !important;
    padding: 22px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
  }

  html body #profileDialog.mobile-tab-page .profile-sign-in-gate .primary-button {
    min-height: 42px !important;
    border: 1px solid var(--share-line) !important;
    border-radius: 3px !important;
    background: transparent !important;
    color: var(--share-text) !important;
  }

  html body > #profileDialog.mobile-tab-page {
    z-index: 1100 !important;
  }

  html body > #profileDialog.mobile-tab-page .profile-sign-in-gate > .material-symbols-rounded {
    color: var(--share-muted) !important;
  }

  html body > #profileDialog.mobile-tab-page .profile-sign-in-gate > .primary-button {
    border-color: var(--share-line) !important;
    color: var(--share-text) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-workspace-heading,
  .mobile-bottom-shell,
  #profileDialog.mobile-tab-page .insights-head {
    transition: none !important;
  }
}

/* v0.14.1 — final Share/Refract visual pass. */
.hero h1,
.profile-dialog .insights-head h2 {
  font-family: Inter, "Noto Sans SC", "PingFang SC", sans-serif !important;
  font-weight: 650 !important;
  letter-spacing: -.035em !important;
}

.profile-overview {
  padding: 10px 0 24px;
  border-bottom: 1px solid var(--share-line);
}

.profile-overview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.profile-overview-grid > div {
  min-width: 0;
  padding: 12px 18px;
  display: grid;
  justify-items: center;
  gap: 5px;
  text-align: center;
}

.profile-overview-grid > div + div {
  border-left: 1px solid var(--share-line);
}

.profile-overview-grid strong {
  max-width: 100%;
  overflow: hidden;
  color: var(--share-text);
  font-size: clamp(20px, 2.2vw, 30px);
  font-weight: 650;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-overview-grid span {
  color: var(--share-muted);
  font-size: 12px;
}

.mobile-profile-hub {
  margin: 24px 0 0 !important;
  overflow: hidden;
  border: 1px solid var(--share-line) !important;
}

.mobile-profile-actions > button:last-child {
  border-bottom: 0 !important;
}

.profile-data-summary {
  padding: 30px 0 0;
}

.profile-data-summary h3,
.profile-activity-heading h3 {
  font-size: 16px;
  font-weight: 650;
}

.profile-stats {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.profile-stat strong {
  font-size: 20px !important;
}

.share-mode-options {
  max-width: 420px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  border: 0;
}

.share-mode-options button,
.share-mode-options button + button {
  min-height: 0;
  padding: 8px;
  display: grid;
  justify-items: center;
  gap: 10px;
  border: 0;
  background: transparent !important;
  text-align: center;
}

.share-mode-options i {
  width: 96px;
  height: 96px;
  border: 5px solid var(--share-line);
  box-shadow: inset 0 0 0 1px rgb(0 0 0 / 10%);
}

.share-mode-options button[aria-pressed="true"] i {
  border-color: var(--share-logo);
  box-shadow: 0 0 0 3px var(--share-bg), 0 0 0 5px var(--share-logo);
}

.share-mode-options span {
  justify-items: center;
}

.share-mode-options b {
  font-size: 15px;
}

@media (max-width: 719px) {
  :root {
    --share-mobile-header-height: calc(82px + env(safe-area-inset-top));
  }

  html body .mobile-workspace-title > p,
  #profileDialog.mobile-tab-page .insights-head p {
    display: none !important;
  }

  html body .mobile-workspace-title > h2,
  html body.mobile-database-tab .mobile-workspace-heading h2,
  #profileDialog.mobile-tab-page .insights-head h2 {
    bottom: 13px !important;
    font-family: Inter, "Noto Sans SC", "PingFang SC", sans-serif !important;
    font-size: 24px !important;
    font-weight: 650 !important;
    letter-spacing: -.035em !important;
    line-height: 1.1 !important;
  }

  #profileDialog.mobile-tab-page .insights-head {
    justify-content: center !important;
    align-items: flex-end !important;
    padding-bottom: 14px !important;
  }

  html body.view-database .mobile-workspace-actions {
    right: 10px !important;
    bottom: 9px !important;
    gap: 2px !important;
  }

  html body.view-database .mobile-workspace-actions > button {
    width: 44px !important;
    height: 44px !important;
  }

  html body.view-database .mobile-workspace-actions > button > .material-symbols-rounded {
    font-size: 28px !important;
  }

  #showGrid > .timeline-card,
  #showGrid > .timeline-card:hover,
  #showGrid > .timeline-card:focus-within,
  #showGrid > .timeline-card:active {
    min-height: 150px !important;
    padding: 16px 18px !important;
    grid-template-columns: 80px minmax(0, 1fr) !important;
    gap: 16px !important;
  }

  #showGrid > .timeline-card .poster-frame {
    width: 80px !important;
    height: 116px !important;
  }

  #showGrid > .timeline-card .card-content {
    min-height: 116px !important;
  }

  #showGrid > .timeline-card h3 {
    font-size: 18px !important;
  }

  #showGrid > .timeline-card .card-context {
    margin-bottom: 7px !important;
  }

  #showGrid > .timeline-card .card-episode-row {
    margin-top: 10px !important;
  }

  #showGrid > .timeline-card .card-quick-watch {
    width: 36px !important;
    height: 36px !important;
    flex-basis: 36px !important;
  }

  .mobile-bottom-nav,
  html body > .mobile-bottom-shell > .mobile-bottom-nav,
  html body > .mobile-bottom-shell > .mobile-bottom-nav.is-scroll-hidden,
  html body.mobile-database-tab > .mobile-bottom-shell > .mobile-bottom-nav {
    padding: 6px 14px !important;
    gap: 10px !important;
  }

  .mobile-tab-indicator {
    width: 76px !important;
    height: 42px !important;
  }

  .mobile-bottom-tab .app-solid-icon {
    width: 27px !important;
    height: 27px !important;
  }

  .profile-summary {
    min-height: 82px !important;
    padding: 11px 0 !important;
    grid-template-columns: 56px minmax(0, 1fr) 42px !important;
    gap: 12px !important;
  }

  .profile-summary > img {
    width: 56px !important;
    height: 56px !important;
  }

  .profile-summary strong {
    font-size: 19px !important;
  }

  .profile-overview {
    padding: 13px 0 18px !important;
  }

  .profile-overview-grid > div {
    padding: 8px 5px;
  }

  .profile-overview-grid strong {
    font-size: 21px;
  }

  .profile-overview-grid span {
    font-size: 11px;
  }

  .mobile-profile-hub {
    margin: 20px 0 0 !important;
  }

  .mobile-profile-account,
  .mobile-profile-actions > button {
    min-height: 58px !important;
    padding: 9px 12px !important;
    grid-template-columns: 32px minmax(0, 1fr) 20px !important;
    gap: 12px !important;
  }

  .mobile-profile-actions small {
    display: none !important;
  }

  .mobile-profile-actions > button > .material-symbols-rounded:first-child,
  .mobile-profile-account > .material-symbols-rounded:first-child {
    width: 28px !important;
    height: 28px !important;
    font-size: 25px !important;
  }

  .profile-data-summary {
    padding: 26px 0 0 !important;
  }

  .profile-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .profile-stat,
  .profile-stat:nth-child(4) {
    min-height: 82px !important;
    border-top: 0 !important;
    border-left: 0 !important;
  }

  .profile-stat:nth-child(even) {
    border-left: 1px solid var(--share-line) !important;
  }

  .profile-stat:nth-child(n + 3) {
    border-top: 1px solid var(--share-line) !important;
  }

  .share-mode-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }

  .share-mode-options button + button {
    border: 0;
  }

  .share-mode-options i {
    width: 88px;
    height: 88px;
  }
}

/* v0.14.2 — restore utilities and tighten the Share-style visual hierarchy. */
:root {
  --share-page: #f6f6f6;
  --share-card: #fff;
  --share-card-line: #e2e2e2;
}

html[data-mode="dark"] {
  --share-page: #000;
  --share-card: #111;
  --share-card-line: #292929;
}

body,
main,
.library,
.hero,
.site-footer {
  background: var(--share-page) !important;
}

.topbar {
  background: var(--share-card) !important;
}

html body .topbar .top-actions > #personalizeButton,
html body .topbar .top-actions > #historyButton,
html body .topbar .top-actions > #updatesButton,
html body .topbar .top-actions > #accountButton {
  min-height: 34px;
  padding: 0 7px !important;
  display: inline-flex !important;
  align-items: center;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: var(--share-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

html body .topbar .top-actions > #personalizeButton:hover,
html body .topbar .top-actions > #historyButton:hover,
html body .topbar .top-actions > #updatesButton:hover,
html body .topbar .top-actions > #accountButton:hover {
  background: var(--share-selected) !important;
  color: var(--share-text) !important;
}

.view-database .controls .search {
  border-radius: 999px !important;
  background: var(--share-card) !important;
}

.profile-dialog section + section {
  border-top: 0 !important;
}

.profile-overview,
.profile-data-summary,
.profile-activity-section {
  margin-top: 16px !important;
  padding: 20px !important;
  border: 1px solid var(--share-card-line) !important;
  border-radius: 12px !important;
  background: var(--share-card) !important;
}

.profile-overview {
  border-bottom: 1px solid var(--share-card-line) !important;
}

.profile-overview-grid > div,
.profile-stat {
  border: 0 !important;
}

.profile-overview-grid > div + div,
.profile-stat + .profile-stat,
.profile-stat:nth-child(even),
.profile-stat:nth-child(n + 3) {
  border-left: 1px solid var(--share-card-line) !important;
  border-top: 0 !important;
}

.profile-stats {
  margin-top: 12px;
  border: 0 !important;
  border-radius: 10px;
  background: var(--share-page);
}

.profile-activity-frame {
  padding: 12px 0 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.profile-activity-scroll,
.profile-activity-calendar,
.profile-activity-grid,
.profile-activity-months {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

@media (min-width: 720px) {
  #showGrid > .show-card,
  #showGrid > .show-card:hover,
  #showGrid > .show-card:focus-within,
  #showGrid > .show-card:active {
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid var(--share-card-line) !important;
    border-radius: 11px !important;
    background: var(--share-card) !important;
  }

  #showGrid > .show-card:hover,
  #showGrid > .show-card:focus-visible {
    outline: 2px solid var(--share-text) !important;
    outline-offset: 2px !important;
  }

  #showGrid > .show-card .poster-frame,
  #showGrid > .show-card .poster {
    display: block !important;
    border-radius: 10px 10px 0 0 !important;
    background: transparent !important;
  }

  #showGrid > .show-card .card-content {
    min-height: 132px;
    padding: 12px 12px 14px !important;
    background: var(--share-card) !important;
  }

  .profile-dialog .insights-scroll {
    background: var(--share-page) !important;
  }
}

@media (max-width: 1080px) and (min-width: 720px) {
  html body .topbar .top-actions > #personalizeButton,
  html body .topbar .top-actions > #historyButton,
  html body .topbar .top-actions > #updatesButton {
    display: none !important;
  }
}

@media (max-width: 719px) {
  :root {
    --share-mobile-header-height: calc(56px + env(safe-area-inset-top));
    --share-mobile-nav-height: calc(52px + env(safe-area-inset-bottom));
  }

  html body,
  html body main,
  html body .library,
  html body #profileDialog.mobile-tab-page,
  html body #profileDialog.mobile-tab-page .insights-scroll {
    background: var(--share-page) !important;
  }

  html body .mobile-workspace-heading,
  html body.view-home main .library .mobile-workspace-heading,
  html body.view-database main .library .mobile-workspace-heading,
  #profileDialog.mobile-tab-page .insights-head {
    height: var(--share-mobile-header-height) !important;
    min-height: var(--share-mobile-header-height) !important;
    padding: env(safe-area-inset-top) 10px 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    background: var(--share-card) !important;
  }

  html body .mobile-workspace-title > h2,
  html body.mobile-database-tab .mobile-workspace-heading h2,
  #profileDialog.mobile-tab-page .insights-head h2 {
    bottom: 12px !important;
    font-size: 22px !important;
    line-height: 1 !important;
  }

  #profileDialog.mobile-tab-page .insights-head {
    justify-content: center !important;
    align-items: flex-end !important;
    padding-bottom: 12px !important;
  }

  html body.view-database .mobile-workspace-actions {
    right: 6px !important;
    bottom: 6px !important;
    height: 42px !important;
  }

  html body.view-database .mobile-workspace-actions > button {
    width: 40px !important;
    height: 40px !important;
  }

  html body.view-database .mobile-workspace-actions > button > .material-symbols-rounded {
    font-size: 27px !important;
    font-variation-settings: "wght" 350, "opsz" 24 !important;
  }

  #showGrid > .timeline-card,
  #showGrid > .timeline-card:hover,
  #showGrid > .timeline-card:focus-within,
  #showGrid > .timeline-card:active {
    min-height: 136px !important;
    padding: 12px 14px !important;
    grid-template-columns: 76px minmax(0, 1fr) !important;
    gap: 14px !important;
    background: var(--share-card) !important;
  }

  #showGrid > .timeline-card .poster-frame,
  #showGrid > .timeline-card .poster {
    width: 76px !important;
    height: 112px !important;
    display: block !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
  }

  #showGrid > .timeline-card .card-content {
    min-height: 112px !important;
    background: transparent !important;
  }

  .view-database .show-grid,
  html body.view-database:not(.mobile-profile-tab) main #showGrid.show-grid {
    padding: 12px 12px calc(var(--share-mobile-nav-height) + 12px) !important;
    gap: 18px 10px !important;
    background: var(--share-page) !important;
  }

  #showGrid > .database-card,
  #showGrid > .database-card:hover,
  #showGrid > .database-card:focus-within,
  #showGrid > .database-card:active {
    display: grid !important;
    grid-template-rows: auto 86px !important;
    align-content: start !important;
    overflow: hidden !important;
    border: 1px solid var(--share-card-line) !important;
    border-radius: 9px !important;
    background: var(--share-card) !important;
  }

  #showGrid > .database-card .poster-frame,
  #showGrid > .database-card .poster {
    display: block !important;
    border: 0 !important;
    border-radius: 8px 8px 0 0 !important;
    background: transparent !important;
  }

  #showGrid > .database-card .card-content {
    height: 86px !important;
    padding: 7px 8px 8px !important;
    display: grid !important;
    grid-template-rows: minmax(32px, auto) 16px 1fr !important;
    align-content: start !important;
    background: var(--share-card) !important;
  }

  #showGrid > .database-card .card-top {
    min-height: 32px;
    align-items: start !important;
  }

  #showGrid > .database-card h3 {
    display: -webkit-box !important;
    overflow: hidden !important;
    white-space: normal !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  #showGrid > .database-card .card-episode-row {
    min-height: 16px;
    margin: 0 !important;
  }

  #showGrid > .database-card .progress-row {
    align-self: end;
    margin: 6px 0 0 !important;
  }

  html body > .mobile-bottom-shell,
  html body > .mobile-bottom-shell > .mobile-bottom-nav,
  html body > .mobile-bottom-shell > .mobile-bottom-nav.is-scroll-hidden,
  html body.mobile-database-tab > .mobile-bottom-shell > .mobile-bottom-nav {
    height: var(--share-mobile-nav-height) !important;
    min-height: var(--share-mobile-nav-height) !important;
  }

  html body > .mobile-bottom-shell > .mobile-bottom-nav,
  html body > .mobile-bottom-shell > .mobile-bottom-nav.is-scroll-hidden,
  html body.mobile-database-tab > .mobile-bottom-shell > .mobile-bottom-nav {
    padding: 3px 18px !important;
    gap: 14px !important;
  }

  .mobile-bottom-tab {
    height: 46px !important;
    min-height: 46px !important;
  }

  .mobile-tab-indicator {
    width: 66px !important;
    height: 36px !important;
  }

  .mobile-bottom-tab .app-solid-icon {
    width: 24px !important;
    height: 24px !important;
  }

  #profileDialog.mobile-tab-page .insights-scroll {
    padding: calc(var(--share-mobile-header-height) + 10px) 12px calc(var(--share-mobile-nav-height) + 14px) !important;
    background: var(--share-page) !important;
  }

  .profile-summary,
  .profile-overview,
  .mobile-profile-hub,
  .profile-data-summary,
  .profile-activity-section {
    margin: 0 0 12px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: var(--share-card) !important;
  }

  .profile-summary {
    min-height: 74px !important;
    padding: 9px 12px !important;
    grid-template-columns: 52px minmax(0, 1fr) 38px !important;
  }

  .profile-summary > img {
    width: 52px !important;
    height: 52px !important;
  }

  .profile-overview {
    padding: 8px 5px !important;
  }

  .mobile-profile-hub {
    overflow: hidden !important;
  }

  .mobile-profile-account,
  .mobile-profile-actions > button {
    min-height: 54px !important;
    padding: 8px 12px !important;
    border-bottom: 1px solid var(--share-line) !important;
  }

  .mobile-profile-actions > button:last-child {
    border-bottom: 0 !important;
  }

  .profile-data-summary,
  .profile-activity-section {
    padding: 16px !important;
  }

  .profile-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    background: var(--share-page) !important;
  }

  .profile-stat,
  .profile-stat:nth-child(even),
  .profile-stat:nth-child(n + 3) {
    border: 0 !important;
  }

  .profile-stat:nth-child(even) {
    border-left: 1px solid var(--share-line) !important;
  }

  .profile-stat:nth-child(n + 3) {
    border-top: 1px solid var(--share-line) !important;
  }

  .profile-activity-frame {
    padding: 8px 0 0 !important;
    border: 0 !important;
  }
}

/* v0.14.3 cascade guard: keep the final layout above all legacy release rules. */
:root {
  --share-page: #fff;
  --share-card: #fff;
  --share-card-line: #e7e7e7;
  --share-group: #f5f5f5;
}

html[data-mode="dark"] {
  --share-page: #000;
  --share-card: #000;
  --share-card-line: #262626;
  --share-group: #151515;
}

html,
body,
main,
.library,
.hero,
.site-footer,
.profile-dialog,
.profile-dialog .insights-scroll {
  background: var(--share-page) !important;
}

.card-quick-watch {
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  flex: 0 0 40px !important;
  aspect-ratio: 1 !important;
  box-sizing: border-box !important;
  border: 2px solid var(--share-faint) !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 719px) {
  :root {
    --share-mobile-header-height: calc(50px + env(safe-area-inset-top));
    --share-mobile-nav-height: calc(50px + env(safe-area-inset-bottom));
  }

  html body .mobile-workspace-heading,
  html body.view-home main .library .mobile-workspace-heading,
  html body.view-database main .library .mobile-workspace-heading,
  #profileDialog.mobile-tab-page .insights-head {
    height: var(--share-mobile-header-height) !important;
    min-height: var(--share-mobile-header-height) !important;
    padding: env(safe-area-inset-top) 8px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    background: var(--share-page) !important;
  }

  html body .mobile-workspace-title > p {
    display: none !important;
  }

  html body .mobile-workspace-title > h2,
  html body.mobile-database-tab .mobile-workspace-heading h2,
  #profileDialog.mobile-tab-page .insights-head h2 {
    bottom: 12px !important;
    color: var(--share-text) !important;
    font-family: Inter, "Noto Sans SC", "PingFang SC", sans-serif !important;
    font-size: 21px !important;
    font-weight: 650 !important;
    line-height: 1 !important;
  }

  html body.view-database .mobile-workspace-actions {
    right: 4px !important;
    bottom: 4px !important;
    height: 42px !important;
  }

  html body.view-database .mobile-workspace-actions > button {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
  }

  html body.view-home:not(.mobile-profile-tab) main > .library,
  html body.view-database:not(.mobile-profile-tab) main > .library {
    min-height: 100dvh !important;
    padding: 0 0 var(--share-mobile-nav-height) !important;
    background: var(--share-page) !important;
  }

  #showGrid > .timeline-card,
  #showGrid > .timeline-card:hover,
  #showGrid > .timeline-card:focus-within,
  #showGrid > .timeline-card:active {
    min-height: 124px !important;
    padding: 9px 12px !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    gap: 11px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    border-radius: 0 !important;
    background: var(--share-page) !important;
  }

  #showGrid > .timeline-card .poster-frame,
  #showGrid > .timeline-card .poster {
    width: 72px !important;
    height: 106px !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
  }

  #showGrid > .timeline-card .card-content {
    min-height: 106px !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    background: transparent !important;
  }

  #showGrid > .timeline-card .card-context {
    margin: 0 0 3px !important;
  }

  #showGrid > .timeline-card .card-episode-row {
    margin: 5px 0 0 !important;
  }

  #showGrid > .timeline-card .progress-row {
    margin: 7px 0 0 !important;
  }

  #showGrid > .timeline-card .card-quick-watch {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    flex-basis: 34px !important;
  }

  html body.view-database:not(.mobile-profile-tab) main #showGrid.show-grid,
  .view-database .show-grid {
    padding: 8px 10px calc(var(--share-mobile-nav-height) + 8px) !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-content: start !important;
    gap: 14px 8px !important;
    background: var(--share-page) !important;
  }

  #showGrid > .database-card,
  #showGrid > .database-card:hover,
  #showGrid > .database-card:focus-within,
  #showGrid > .database-card:active {
    grid-template-rows: auto 66px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  #showGrid > .database-card .poster-frame,
  #showGrid > .database-card .poster {
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
  }

  #showGrid > .database-card .card-content {
    height: 66px !important;
    padding: 6px 1px 0 !important;
    grid-template-rows: minmax(28px, auto) 14px 1fr !important;
    background: transparent !important;
  }

  #showGrid > .database-card .card-top {
    min-height: 28px !important;
  }

  #showGrid > .database-card .card-episode-row {
    min-height: 14px !important;
    margin: 0 !important;
  }

  #showGrid > .database-card .progress-row {
    margin: 4px 0 0 !important;
  }

  html body > .mobile-bottom-shell,
  html body > .mobile-bottom-shell > .mobile-bottom-nav,
  html body > .mobile-bottom-shell > .mobile-bottom-nav.is-scroll-hidden,
  html body.mobile-database-tab > .mobile-bottom-shell > .mobile-bottom-nav {
    height: var(--share-mobile-nav-height) !important;
    min-height: var(--share-mobile-nav-height) !important;
    background: var(--share-page) !important;
  }

  html body > .mobile-bottom-shell > .mobile-bottom-nav,
  html body > .mobile-bottom-shell > .mobile-bottom-nav.is-scroll-hidden,
  html body.mobile-database-tab > .mobile-bottom-shell > .mobile-bottom-nav {
    padding: 2px 22px !important;
    gap: 10px !important;
  }

  #profileDialog.mobile-tab-page .insights-scroll {
    padding: calc(var(--share-mobile-header-height) + 8px) 12px calc(var(--share-mobile-nav-height) + 12px) !important;
    display: flex !important;
    flex-direction: column !important;
    background: var(--share-page) !important;
  }

  #profileDialog.mobile-tab-page .profile-summary { order: 1; }
  #profileDialog.mobile-tab-page .profile-overview { order: 2; }
  #profileDialog.mobile-tab-page .mobile-profile-hub { order: 3; }
  #profileDialog.mobile-tab-page .profile-data-summary { display: none !important; }
  #profileDialog.mobile-tab-page .profile-activity-section { order: 4; }

  .profile-summary,
  .profile-overview,
  .profile-activity-section {
    margin: 0 0 10px !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: var(--share-group) !important;
  }

  .profile-overview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .profile-overview-grid > div {
    min-height: 62px !important;
    padding: 8px 5px !important;
    border: 0 !important;
  }

  .profile-overview-grid > div:nth-child(even) {
    border-left: 1px solid var(--share-card-line) !important;
  }

  .profile-overview-grid > div:nth-child(n + 3) {
    border-top: 1px solid var(--share-card-line) !important;
  }

  .mobile-profile-hub {
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
  }

  .mobile-profile-account,
  .mobile-profile-actions {
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: var(--share-group) !important;
  }

  .mobile-profile-account {
    width: 100% !important;
    margin: 0 0 10px !important;
    padding: 9px 14px !important;
  }

  .mobile-profile-actions {
    padding: 0 14px !important;
  }

  .mobile-profile-actions > button {
    min-height: 54px !important;
    padding: 8px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: inset 0 -1px var(--share-card-line) !important;
  }

  .mobile-profile-actions > button:last-child {
    box-shadow: none !important;
  }

  .profile-activity-section,
  .profile-activity-frame {
    border: 0 !important;
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-hub {
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-account,
  #profileDialog.mobile-tab-page .mobile-profile-actions {
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: var(--share-group) !important;
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-account {
    width: 100% !important;
    margin: 0 0 10px !important;
    padding: 9px 14px !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions {
    padding: 0 14px !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions > button {
    width: 100% !important;
    min-height: 54px !important;
    padding: 8px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: inset 0 -1px var(--share-card-line) !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions > button:last-child {
    box-shadow: none !important;
  }
}
/* ========================================================================== */
/* v0.14.4 — Share restraint + Refract information hierarchy                 */
/* This final cascade is intentionally self-contained. It also normalizes     */
/* legacy secondary views that pre-date the three-tab redesign.               */
/* ========================================================================== */

:root {
  --share-bg: #ffffff;
  --share-page: #ffffff;
  --share-surface: #ffffff;
  --share-card: #f7f8f9;
  --share-group: #f1f2f4;
  --share-text: #17181a;
  --share-muted: #6f747b;
  --share-faint: #9ca1a8;
  --share-line: #e4e6e8;
  --share-card-line: #e0e3e6;
  --share-selected: #e8eff3;
  --share-selected-text: #285f85;
  --share-accent: #e45e4b;
}

html[data-mode="dark"] {
  color-scheme: dark;
  --share-bg: #24272c;
  --share-page: #24272c;
  --share-surface: #2a2e34;
  --share-card: #31363e;
  --share-group: #2c3036;
  --share-text: #f2f3f5;
  --share-muted: #b0b5bd;
  --share-faint: #858c95;
  --share-line: #414750;
  --share-card-line: #454b54;
  --share-selected: #394650;
  --share-selected-text: #a4cee9;
}

html,
body,
main,
.hero,
.library,
.site-footer {
  color: var(--share-text) !important;
  background: var(--share-page) !important;
}

html[data-mode="dark"] body::before,
html[data-mode="dark"] body::after {
  display: none !important;
}

.muted,
.card-context,
.episode-name,
.card-remaining,
.profile-stat-label,
.profile-activity-summary,
.profile-activity-legend,
.mobile-profile-actions small {
  color: var(--share-muted) !important;
}

/* The old wallpaper/color choices remain migratable in data, but the visible
   appearance UI is now deliberately limited to light/dark plus the headline. */
.personalize-dialog section:has(.theme-options),
.personalize-dialog section.background-section {
  display: none !important;
}

/* Secondary surfaces now use the same restrained visual system. */
#showDialog,
#historyDialog,
#profileDialog,
#droppedDialog,
#profileEditDialog,
#updatesDialog,
#searchDialog,
#personalizeDialog,
#accountDialog,
#pwaInstallDialog,
#mobileMenuDialog {
  color: var(--share-text) !important;
  border-color: var(--share-line) !important;
  border-radius: 18px !important;
  background: var(--share-page) !important;
  box-shadow: 0 18px 64px rgb(0 0 0 / 18%) !important;
}

.dialog-fixed,
.dialog-head,
.insights-head,
.personalize-head,
.account-head,
.pwa-install-dialog-head,
.mobile-menu-head,
.season-tabs {
  color: var(--share-text) !important;
  border-color: var(--share-line) !important;
  background: var(--share-surface) !important;
  box-shadow: none !important;
}

.dialog-body,
.insights-body,
.personalize-body,
.account-body,
.pwa-install-dialog-body,
.mobile-menu-body,
.episode-list,
.history-list,
.updates-list,
.search-results {
  color: var(--share-text) !important;
  background: var(--share-page) !important;
}

.episode,
.history-entry,
.update-entry,
.search-result-item,
.account-card,
.account-section,
.personalize-dialog section,
.profile-edit-fields,
.dropped-show-card {
  color: var(--share-text) !important;
  border-color: var(--share-line) !important;
  background: var(--share-surface) !important;
  box-shadow: none !important;
}

.season-tabs button,
.view-toggle button,
.filter-tabs button {
  border-color: var(--share-line) !important;
  background: var(--share-group) !important;
  color: var(--share-muted) !important;
  box-shadow: none !important;
}

.season-tabs button.active,
.view-toggle button.active,
.filter-tabs button.active {
  color: var(--share-selected-text) !important;
  border-color: color-mix(in srgb, var(--share-selected-text) 38%, var(--share-line)) !important;
  background: var(--share-selected) !important;
}

.remote-search,
.headline-editor,
.login-form label,
.register-form label,
.profile-edit-fields label,
.search-dialog .search-field {
  border-color: var(--share-line) !important;
  background: var(--share-group) !important;
  box-shadow: none !important;
}

.remote-search {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 6px !important;
  align-items: center !important;
  padding: 5px 5px 5px 16px !important;
  border: 1px solid var(--share-line) !important;
  border-radius: 999px !important;
  outline: 0 !important;
}

.remote-search:focus-within {
  border-color: color-mix(in srgb, var(--share-accent) 58%, var(--share-line)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--share-accent) 12%, transparent) !important;
}

.remote-search input,
.headline-editor input,
.login-form input,
.register-form input,
.profile-edit-fields input,
.search-dialog input {
  color: var(--share-text) !important;
  border-color: var(--share-line) !important;
  border-radius: 14px !important;
  background: var(--share-group) !important;
  box-shadow: none !important;
}

.remote-search input {
  min-width: 0 !important;
  border: 0 !important;
  background: transparent !important;
  outline: 0 !important;
}

.remote-search .primary-button,
.search-dialog .primary-button {
  border-radius: 999px !important;
}

.episode {
  border-width: 0 0 1px !important;
  border-radius: 0 !important;
}

.episode.selected {
  border-radius: 14px !important;
  background: var(--share-selected) !important;
}

.episode .episode-check,
.card-quick-watch {
  aspect-ratio: 1 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}

/* Calendar cells must remain real squares at every zoom level. */
.profile-activity-frame,
.profile-activity-calendar {
  box-shadow: none !important;
}

.profile-activity-calendar {
  width: max-content !important;
  min-width: calc(var(--activity-weeks, 1) * 13px) !important;
}

.profile-activity-grid {
  grid-template-rows: repeat(7, 10px) !important;
  grid-auto-columns: 10px !important;
  gap: 3px !important;
}

.activity-cell,
.profile-activity-legend i {
  width: 10px !important;
  height: 10px !important;
  min-width: 10px !important;
  min-height: 10px !important;
  aspect-ratio: 1 / 1 !important;
  border: 0 !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}

@media (min-width: 720px) {
  .topbar {
    padding-inline: max(28px, calc((100vw - 1160px) / 2)) !important;
  }

  .hero,
  .library {
    width: min(1160px, calc(100% - 56px)) !important;
    max-width: 1160px !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
  }

  .desktop-primary-nav button,
  .top-actions > button,
  .top-actions > .menu-wrap > button {
    min-height: 40px !important;
    font-size: 13px !important;
    font-weight: 550 !important;
    line-height: 1 !important;
  }

  .brand {
    font-size: 22px !important;
  }

  .hero h1 {
    max-width: 720px !important;
    font-family: "Noto Serif SC", "Songti SC", SimSun, serif !important;
    font-size: clamp(38px, 4vw, 58px) !important;
    font-weight: 600 !important;
    letter-spacing: -.035em !important;
  }

  .show-card {
    border: 1px solid var(--share-card-line) !important;
    background: var(--share-card) !important;
  }

  .show-card:hover {
    outline: 2px solid color-mix(in srgb, var(--share-selected-text) 65%, transparent) !important;
    outline-offset: 2px !important;
    transform: none !important;
  }

  .show-card:hover .poster,
  .show-card:hover .poster img {
    transform: none !important;
  }

  #profileDialog.desktop-profile-page {
    position: fixed !important;
    inset: var(--topbar-height, 64px) 0 0 !important;
    width: 100vw !important;
    max-width: none !important;
    height: calc(100dvh - var(--topbar-height, 64px)) !important;
    max-height: none !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  #profileDialog.desktop-profile-page .insights-body {
    width: min(1160px, calc(100% - 56px)) !important;
    margin-inline: auto !important;
  }
}

@media (max-width: 719px) {
  html:not(.app-ready),
  html:not(.app-ready) body {
    background: var(--share-page) !important;
  }

  html:not(.app-ready)::before {
    display: none !important;
    content: none !important;
  }

  html:not(.app-ready)::after {
    content: "OnlyShows." !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483647 !important;
    display: grid !important;
    place-items: center !important;
    color: var(--share-accent) !important;
    background: var(--share-page) !important;
    font: 800 30px/1 Inter, "Segoe UI", sans-serif !important;
    letter-spacing: -.05em !important;
  }

  .hero {
    display: none !important;
  }

  .library {
    padding-top: 0 !important;
  }

  .mobile-view-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 48 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: 100% !important;
    min-height: calc(54px + env(safe-area-inset-top)) !important;
    height: calc(54px + env(safe-area-inset-top)) !important;
    padding: env(safe-area-inset-top) 14px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    color: var(--share-text) !important;
    background: var(--share-surface) !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .mobile-view-header h2,
  .mobile-view-header .mobile-view-title {
    position: static !important;
    inset: auto !important;
    align-self: center !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--share-text) !important;
    font-family: Inter, "Noto Sans SC", "Microsoft YaHei", sans-serif !important;
    font-size: 21px !important;
    font-weight: 520 !important;
    line-height: 1.15 !important;
    letter-spacing: -.025em !important;
    transform: none !important;
  }

  .mobile-view-header .mobile-view-meta,
  .mobile-view-header .library-count {
    display: none !important;
  }

  .mobile-view-header .mobile-view-actions,
  .mobile-view-header .library-actions {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    align-items: center !important;
    align-self: center !important;
    gap: 4px !important;
    margin: 0 !important;
    transform: none !important;
  }

  .mobile-view-header .mobile-view-actions button,
  .mobile-view-header .library-actions button {
    display: grid !important;
    place-items: center !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    color: var(--share-text) !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .mobile-view-header .material-symbols-rounded {
    font-size: 28px !important;
    font-weight: 400 !important;
  }

  .show-grid {
    align-content: start !important;
    background: var(--share-page) !important;
  }

  .show-grid:not(.view-database) {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 8px 0 calc(var(--mobile-nav-height, 58px) + env(safe-area-inset-bottom) + 10px) !important;
  }

  .show-grid:not(.view-database) .show-card {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 82px minmax(0, 1fr) !important;
    grid-template-rows: 1fr !important;
    width: auto !important;
    min-height: 142px !important;
    margin: 0 10px !important;
    padding: 10px 12px 10px 10px !important;
    border: 1px solid var(--share-card-line) !important;
    border-radius: 15px !important;
    background: var(--share-card) !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  .show-grid:not(.view-database) .poster {
    grid-column: 1 !important;
    width: 82px !important;
    height: 122px !important;
    min-height: 122px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 11px !important;
    overflow: hidden !important;
    background: var(--share-group) !important;
  }

  .show-grid:not(.view-database) .poster img {
    width: 100% !important;
    height: 100% !important;
    border-radius: inherit !important;
    object-fit: cover !important;
  }

  .show-grid:not(.view-database) .card-content {
    position: relative !important;
    grid-column: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    height: 122px !important;
    padding: 1px 0 0 14px !important;
  }

  .show-grid:not(.view-database) .card-context {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    z-index: 2 !important;
    display: block !important;
    max-width: 84px !important;
    margin: 0 !important;
    color: var(--share-faint) !important;
    font-size: 10px !important;
    font-weight: 450 !important;
    line-height: 1.2 !important;
    text-align: right !important;
    white-space: nowrap !important;
  }

  .show-grid:not(.view-database) .card-context > span:first-child {
    display: none !important;
  }

  .show-grid:not(.view-database) .card-air-date {
    display: block !important;
    color: inherit !important;
  }

  .show-grid:not(.view-database) .card-top {
    min-width: 0 !important;
    padding-right: 86px !important;
  }

  .show-grid:not(.view-database) .card-top h3 {
    margin: 0 !important;
    color: var(--share-text) !important;
    font-size: 18px !important;
    font-weight: 650 !important;
    line-height: 1.28 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .show-grid:not(.view-database) .card-episode-row {
    position: static !important;
    display: block !important;
    min-width: 0 !important;
    margin-top: 6px !important;
  }

  .show-grid:not(.view-database) .next-episode {
    color: var(--share-selected-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
  }

  .show-grid:not(.view-database) .episode-name {
    margin-top: 4px !important;
    color: var(--share-muted) !important;
    font-size: 13px !important;
    font-weight: 420 !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .show-grid:not(.view-database) .progress-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 9px !important;
    padding-right: 44px !important;
  }

  .show-grid:not(.view-database) .progress-track {
    height: 4px !important;
  }

  .show-grid:not(.view-database) .progress-row > span {
    color: var(--share-muted) !important;
    font-size: 11px !important;
    font-weight: 500 !important;
  }

  .show-grid:not(.view-database) .card-remaining {
    margin-top: 5px !important;
    padding-right: 42px !important;
    color: var(--share-muted) !important;
    font-size: 11px !important;
    font-weight: 430 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .show-grid:not(.view-database) .card-quick-watch {
    position: absolute !important;
    right: 0 !important;
    bottom: 1px !important;
    display: grid !important;
    place-items: center !important;
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    margin: 0 !important;
    border: 2px solid var(--share-card-line) !important;
    border-radius: 50% !important;
    color: var(--share-text) !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .show-grid:not(.view-database) .card-quick-watch:hover,
  .show-grid:not(.view-database) .card-quick-watch:active {
    transform: none !important;
  }

  .show-grid.view-database {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-content: start !important;
    gap: 16px 9px !important;
    padding: 10px 10px calc(var(--mobile-nav-height, 58px) + env(safe-area-inset-bottom) + 10px) !important;
  }

  .show-grid.view-database .show-card {
    display: grid !important;
    grid-template-rows: auto 62px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .show-grid.view-database .poster {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 2 / 3 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 11px !important;
    overflow: hidden !important;
    background: var(--share-group) !important;
  }

  .show-grid.view-database .poster img {
    width: 100% !important;
    height: 100% !important;
    border-radius: inherit !important;
    object-fit: cover !important;
  }

  .show-grid.view-database .card-content {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    height: 62px !important;
    padding: 6px 1px 0 !important;
  }

  .show-grid.view-database .card-context,
  .show-grid.view-database .episode-name,
  .show-grid.view-database .card-air-date,
  .show-grid.view-database .card-remaining,
  .show-grid.view-database .card-quick-watch {
    display: none !important;
  }

  .show-grid.view-database .card-top,
  .show-grid.view-database .card-episode-row,
  .show-grid.view-database .next-episode,
  .show-grid.view-database .progress-row {
    margin: 0 !important;
    padding: 0 !important;
  }

  .show-grid.view-database .card-top h3 {
    margin: 0 !important;
    color: var(--share-text) !important;
    font-size: 13px !important;
    font-weight: 620 !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .show-grid.view-database .next-episode {
    margin-top: 4px !important;
    color: var(--share-muted) !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
  }

  .show-grid.view-database .progress-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 4px !important;
    margin-top: 5px !important;
  }

  .show-grid.view-database .progress-track {
    height: 3px !important;
  }

  .show-grid.view-database .progress-row > span {
    color: var(--share-muted) !important;
    font-size: 9px !important;
  }

  .mobile-library-controls {
    color: var(--share-text) !important;
    border-color: var(--share-line) !important;
    background: var(--share-surface) !important;
    box-shadow: none !important;
  }

  .mobile-library-controls .remote-search {
    border-radius: 999px !important;
    background: var(--share-group) !important;
  }

  #profileDialog.mobile-tab-page .insights-head {
    min-height: calc(54px + env(safe-area-inset-top)) !important;
    height: calc(54px + env(safe-area-inset-top)) !important;
    padding: env(safe-area-inset-top) 14px 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
  }

  #profileDialog.mobile-tab-page .insights-head h2 {
    font-family: Inter, "Noto Sans SC", "Microsoft YaHei", sans-serif !important;
    font-size: 21px !important;
    font-weight: 520 !important;
    letter-spacing: -.025em !important;
  }

  #profileDialog.mobile-tab-page .insights-body {
    padding: 12px 14px calc(var(--mobile-nav-height, 58px) + env(safe-area-inset-bottom) + 20px) !important;
  }

  #profileDialog.mobile-tab-page .profile-overview-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1px !important;
    overflow: hidden !important;
    border: 1px solid var(--share-line) !important;
    border-radius: 15px !important;
    background: var(--share-line) !important;
  }

  #profileDialog.mobile-tab-page .profile-overview-grid > div {
    min-height: 78px !important;
    padding: 12px !important;
    border: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    background: var(--share-surface) !important;
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .profile-overview-grid strong {
    font-size: 22px !important;
    font-weight: 580 !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-hub {
    border: 0 !important;
    background: transparent !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-account,
  #profileDialog.mobile-tab-page .mobile-profile-actions {
    border: 1px solid var(--share-line) !important;
    border-radius: 15px !important;
    background: var(--share-surface) !important;
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions {
    padding: 0 14px !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions > button {
    min-height: 58px !important;
    padding: 10px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: var(--share-text) !important;
    background: transparent !important;
    box-shadow: inset 0 -1px var(--share-line) !important;
    font-size: 17px !important;
    font-weight: 420 !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions > button:last-child {
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions > button > .material-symbols-rounded:last-child {
    display: none !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions > button > .material-symbols-rounded:first-child {
    color: var(--share-muted) !important;
    font-size: 25px !important;
    font-weight: 350 !important;
  }

  #profileDialog.mobile-tab-page .mobile-profile-actions b {
    font-size: 17px !important;
    font-weight: 430 !important;
  }

  #profileDialog.mobile-tab-page .profile-activity-section,
  #profileDialog.mobile-tab-page .profile-activity-frame {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #profileDialog.mobile-tab-page .profile-activity-grid {
    grid-template-rows: repeat(7, 11px) !important;
    grid-auto-columns: 11px !important;
    gap: 3px !important;
  }

  #profileDialog.mobile-tab-page .activity-cell {
    width: 11px !important;
    height: 11px !important;
    min-width: 11px !important;
    min-height: 11px !important;
  }

  #showDialog,
  #historyDialog,
  #droppedDialog,
  #profileEditDialog,
  #updatesDialog,
  #searchDialog,
  #personalizeDialog,
  #accountDialog,
  #pwaInstallDialog,
  #mobileMenuDialog {
    inset: 0 !important;
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: none !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--share-page) !important;
    box-shadow: none !important;
  }

  #showDialog .dialog-fixed,
  #historyDialog .insights-head,
  #droppedDialog .insights-head,
  #profileEditDialog .insights-head,
  #updatesDialog .insights-head,
  #searchDialog .dialog-head,
  #personalizeDialog .personalize-head,
  #accountDialog .account-head,
  #pwaInstallDialog .pwa-install-dialog-head,
  #mobileMenuDialog .mobile-menu-head {
    min-height: calc(54px + env(safe-area-inset-top)) !important;
    padding: env(safe-area-inset-top) 14px 0 !important;
    border-bottom: 1px solid var(--share-line) !important;
    background: var(--share-surface) !important;
  }

  #showDialog .dialog-fixed h2,
  #historyDialog .insights-head h2,
  #droppedDialog .insights-head h2,
  #profileEditDialog .insights-head h2,
  #updatesDialog .insights-head h2,
  #searchDialog .dialog-head h2,
  #personalizeDialog .personalize-head h2,
  #accountDialog .account-head h2,
  #pwaInstallDialog .pwa-install-dialog-head h2,
  #mobileMenuDialog .mobile-menu-head h2 {
    font-family: Inter, "Noto Sans SC", "Microsoft YaHei", sans-serif !important;
    font-size: 21px !important;
    font-weight: 520 !important;
    letter-spacing: -.025em !important;
  }
}