:root {
  color-scheme: dark;
  font-family: Inter, system-ui, sans-serif;
  background: #10111a;
  color: #f7f2fb;
  --surface: #171824;
  --surface-raised: #1e2030;
  --surface-soft: #242536;
  --line: #38394e;
  --muted: #b8b4c7;
  --accent: #f4bd91;
  --accent-light: #ffe0b9;
  --pink: #e994b4;
  --blue: #91c9e9;
  --green: #9bd1b6;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(ellipse at 84% -5%, #57304470, transparent 38rem),
    radial-gradient(ellipse at 5% 34rem, #25264850, transparent 34rem),
    #10111a;
}
[hidden] { display: none !important; }
a { color: var(--accent-light); text-underline-offset: .2em; }
a:hover { color: #fff2da; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid #ffe1a8; outline-offset: 3px; }
button { color: inherit; }
.skip-link { position: absolute; top: 1rem; left: 1rem; z-index: 40; padding: .7rem; background: #10111a; transform: translateY(-200%); }
.skip-link:focus { transform: none; }
main, .site-header { width: min(calc(100% - 2.5rem), 92rem); margin-inline: auto; }
main { padding-bottom: 4rem; }
.site-header {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: .8rem 1.5rem; padding-block: 1.1rem;
}
.site-header nav, .section-nav, .controls { display: flex; flex-wrap: wrap; gap: .4rem; }
.site-header a, .section-nav a { padding: .48rem .7rem; text-decoration: none; }
.site-header .archive-brand { font-weight: 800; color: #fff; padding-inline: 0; letter-spacing: -.025em; }
.site-header [aria-current], .site-header nav a:hover { background: #ffffff0b; color: #fff; }
.season-hero {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(15rem, .46fr); align-items: end; gap: 2rem;
  padding: clamp(1.4rem, 4vw, 3.75rem); border: 1px solid #755064;
  background: linear-gradient(118deg, #201b2b 0%, #34243a 58%, #4a293b 100%);
  box-shadow: 0 24px 70px #07081055;
}
.season-intro { max-width: 58rem; }
.eyebrow { margin: 0 0 .55rem; color: var(--accent); font-size: .76rem; font-weight: 760; letter-spacing: .16em; text-transform: uppercase; }
h1, h2, h3, h4 { margin: 0; line-height: 1.18; }
h1 { font-size: clamp(2.8rem, 7vw, 6.4rem); letter-spacing: -.075em; }
h2 { font-size: clamp(1.65rem, 3.7vw, 2.65rem); letter-spacing: -.045em; }
h3 { font-size: 1.08rem; }
p { margin-block: .65rem; line-height: 1.55; }
.season-intro > p:not(.eyebrow) { max-width: 42rem; color: #d4ccdb; font-size: clamp(1rem, 1.5vw, 1.15rem); }
.season-summary {
  max-width: 46rem; margin-top: 1.3rem; padding: .72rem .9rem; border-left: 2px solid var(--accent);
  background: #100f1980; color: #e4dce9 !important; font-size: .82rem !important;
}
.season-hero-note { display: grid; gap: .6rem; padding: 1rem 0 0 1.2rem; border-left: 1px solid #ffffff38; color: #ede3ee; font-size: .92rem; }
.season-hero-note-label { color: var(--accent-light); font-size: .73rem; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; }
.season-hero-note-time { color: var(--muted); font-size: .78rem; }
.muted { color: var(--muted); }
.section-nav {
  position: sticky; top: 0; z-index: 20; flex-wrap: nowrap; gap: .15rem; margin: .85rem -.5rem 2.4rem;
  overflow-x: auto; padding: .55rem; border: 1px solid #ffffff1a; background: #11121beF;
  box-shadow: 0 10px 28px #08091166; backdrop-filter: blur(16px); scrollbar-width: none;
}
.section-nav a { flex: 0 0 auto; white-space: nowrap; color: #d0cbd8; font-size: .83rem; }
.section-nav::-webkit-scrollbar { display: none; }
.section-nav a:hover, .section-nav a:focus-visible { background: #ffffff0c; color: #fff; }
main > section { margin-block: 2.8rem; scroll-margin-top: 5rem; }
.editorial-section:not(#current-season) { padding-top: 2.4rem; border-top: 1px solid #ffffff20; }
.editorial-section > .eyebrow { margin-bottom: .45rem; }
.editorial-section > h2 { margin-bottom: 1rem; }
.section-title { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem 1.5rem; margin-bottom: 1rem; }
.section-title .eyebrow { margin-bottom: .35rem; }
.section-title .muted { margin-bottom: 0; font-size: .86rem; }
.calendar-view-control { display: grid; justify-items: end; gap: .35rem; }
.control-label { color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.controls { align-items: center; }
.controls button {
  min-height: 2.55rem; border: 1px solid var(--line); padding: .5rem .8rem;
  background: var(--surface); color: #d7d1df; font: inherit; font-size: .84rem; cursor: pointer;
}
.controls button:hover { background: var(--surface-soft); color: #fff; }
.segmented-control { gap: 0; padding: .24rem; border: 1px solid #ffffff26; background: #11121b; }
.segmented-control button { min-height: 2.2rem; border-color: transparent; background: transparent; }
.segmented-control button[aria-pressed="true"] { border-color: #e5b996; background: #3a2b34; color: #ffe4c8; font-weight: 750; }
#calendar-filter { margin-block: .65rem; }
#calendar-filter button[aria-pressed="true"] { border-color: var(--accent); background: #3b2d38; color: var(--accent-light); }
#calendar-status { min-height: 1.4rem; margin: .25rem 0 .75rem; font-size: .79rem; }
#calendar-status:empty { display: none; }
.season-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .68rem; }
.season-day {
  min-width: 0; padding: .78rem; border: 1px solid #3b3b50; border-top: 2px solid #89617e;
  background: linear-gradient(180deg, #1b1b29, #171823 6rem);
}
.season-day h3 { min-height: 2.45rem; padding-bottom: .62rem; border-bottom: 1px solid #ffffff1a; color: #f4d5c9; font-size: .85rem; }
.season-day + .season-day { scroll-margin-top: 5rem; }
.poster-list { display: grid; gap: .55rem; margin-top: .6rem; }
.detail-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 31rem), 1fr)); gap: .9rem; margin-top: 1rem; }
.season-stack { display: grid; gap: .7rem; }
.poster-card, .season-info, .watch-panel { min-width: 0; border: 1px solid var(--line); background: var(--surface); overflow-wrap: anywhere; }
.season-info, .watch-panel { padding: 1rem; }
.poster-card { background: #1d1d2c; }
.poster-card button {
  display: grid; align-content: start; gap: .38rem; width: 100%; height: 100%; padding: .45rem;
  border: 0; background: transparent; font: inherit; text-align: left; cursor: pointer;
}
.poster-card button:hover, .poster-card button[aria-expanded="true"] { background: #ffffff0b; }
.poster-image { display: grid; place-content: center; aspect-ratio: 2 / 3; width: 100%; object-fit: cover; background: #342a3b; color: #e8d7e7; text-align: center; font-size: .75rem; }
.poster-title { display: -webkit-box; overflow: hidden; font-weight: 730; line-height: 1.25; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.poster-meta { color: var(--muted); font-size: .77rem; line-height: 1.35; }
.state, .lifecycle-label { color: var(--accent); font-size: .71rem; font-weight: 780; letter-spacing: .09em; text-transform: uppercase; }
#poster-detail {
  position: fixed; z-index: 30; width: min(22rem, calc(100vw - 1.5rem)); max-height: min(75vh, 26rem);
  overflow: auto; overflow-wrap: anywhere; padding: 1rem; border: 1px solid #997389;
  background: #211d2b; box-shadow: 0 14px 42px #05050bd9;
}
#poster-detail p { font-size: .88rem; }
#poster-detail h3 { font-size: 1.08rem; }
.watch-panel { margin-top: 1.1rem; border-left: 2px solid var(--green); }
.watch-panel h3 { margin-bottom: .55rem; }
.watch-panel p { margin-block: .35rem; }
.detail-card { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); align-items: start; gap: 1rem; padding: .85rem; }
.detail-poster, .radar-poster { display: block; min-width: 0; overflow: hidden; background: #30263b; }
.detail-poster { aspect-ratio: 2 / 3; }
.detail-poster img, .radar-poster img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cover-fallback { display: grid; place-items: center; width: 100%; height: 100%; min-height: 5rem; padding: .5rem; background: linear-gradient(145deg,#30263b,#222535); color: #d2bfd2; text-align: center; font-size: .73rem; }
.detail-card-body { min-width: 0; }
.card-kicker { margin: 0 0 .35rem; color: var(--muted); font-size: .68rem; font-weight: 750; letter-spacing: .13em; text-transform: uppercase; }
.detail-card-title { margin-bottom: .5rem; font-size: clamp(1.04rem, 1.3vw, 1.25rem); letter-spacing: -.02em; }
.detail-card-title a { color: #fff; text-decoration: none; }
.detail-card-title a:hover { color: var(--accent-light); text-decoration: underline; }
.relation-line { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .55rem; margin-block: .5rem; color: #d7cedd; font-size: .82rem; }
.relation-kind { color: var(--pink); font-size: .68rem; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.season-metrics { display: flex; flex-wrap: wrap; gap: .45rem; margin-block: .75rem; }
.season-metric { min-width: 5.6rem; display: grid; gap: .14rem; padding: .42rem .58rem; border-left: 2px solid #77546d; background: #ffffff07; }
.season-metric-label { color: var(--muted); font-size: .61rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.season-metric strong, .season-metric a { color: #fff0df; font-size: .86rem; font-weight: 760; text-decoration: none; }
.season-metric a:hover { text-decoration: underline; }
.memory { margin-top: .65rem; padding-top: .5rem; border-top: 1px solid #ffffff1b; }
.memory p { margin-bottom: .2rem; font-size: .85rem; }
summary { color: var(--accent-light); cursor: pointer; }
.recommendation-card { border-left: 2px solid #b77c91; }
.match-score { margin: .55rem 0; color: var(--accent-light); font-size: .88rem; font-weight: 760; }
.recommendation-tags { display: flex; flex-wrap: wrap; gap: .35rem; margin-block: .6rem; }
.recommendation-tag { max-width: 100%; padding: .25rem .45rem; border-left: 2px solid #9b768e; background: #2a2634; color: #e1d6e3; font-size: .7rem; line-height: 1.3; overflow-wrap: anywhere; }
.recommendation-summary { display: -webkit-box; overflow: hidden; margin-block: .65rem; color: #d8d2df; font-size: .86rem; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.recommendation-evidence { margin-top: .7rem; padding-top: .65rem; border-top: 1px solid #ffffff1d; }
.recommendation-evidence > h4 { margin-top: .7rem; color: #e6dce9; font-size: .78rem; }
.recommendation-evidence > p { margin-block: .3rem; font-size: .82rem; }
.recommendation-evidence[open] > summary { margin-bottom: .55rem; }
.evidence-grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .3rem .75rem; margin: .55rem 0; padding: .65rem; background: #ffffff08; font-size: .78rem; }
.evidence-grid dt { color: var(--muted); }
.evidence-grid dd { margin: 0; color: #f1d7c5; font-weight: 700; }
.evidence-notes { margin: .45rem 0; padding-left: 1.1rem; color: #d7d0dd; font-size: .8rem; }
.evidence-notes li + li { margin-top: .3rem; }
.radar-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-top: 1rem; }
.radar-state { padding: 1rem; border-top: 2px solid var(--pink); }
.radar-state:nth-child(2) { border-top-color: var(--blue); }
.radar-state:nth-child(3) { border-top-color: var(--accent); }
.radar-state:nth-child(4) { border-top-color: #aaa0c3; }
.radar-state-heading { display: flex; align-items: start; justify-content: space-between; gap: .5rem; padding-bottom: .7rem; border-bottom: 1px solid #ffffff1b; }
.radar-state-heading h3 { font-size: .9rem; letter-spacing: .045em; }
.radar-state-heading p { margin: .35rem 0 0; font-size: .76rem; }
.radar-count, .group-count { flex: 0 0 auto; color: var(--muted); font-size: .7rem; font-weight: 720; }
.radar-cards { display: grid; gap: .55rem; margin-top: .65rem; }
.radar-card { display: grid; grid-template-columns: 3.8rem minmax(0, 1fr); gap: .65rem; min-width: 0; padding: .55rem; border: 1px solid #ffffff16; background: #ffffff05; }
.radar-poster { aspect-ratio: 2 / 3; }
.radar-card-title { font-size: .82rem; line-height: 1.35; }
.radar-card-title a { color: #fff; text-decoration: none; }
.radar-card-title a:hover { color: var(--accent-light); text-decoration: underline; }
.radar-card-body p { margin: .35rem 0 0; font-size: .75rem; }
.radar-date { color: var(--muted); }
.radar-empty-state { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; margin-top: .9rem; padding: 1.1rem 1.2rem; border-left: 2px solid var(--accent); background: linear-gradient(100deg,#302330,#1b1b27); }
.radar-empty-state h3 { font-size: 1.1rem; }
.radar-empty-state p { margin-bottom: .15rem; }
.radar-empty-state > a { flex: 0 0 auto; padding: .55rem .7rem; border: 1px solid #927183; text-decoration: none; }
.upcoming-groups { display: grid; gap: 1.65rem; margin-top: 1rem; }
.upcoming-group { padding-top: 1rem; border-top: 1px solid #ffffff1c; }
.upcoming-group-heading { display: flex; align-items: end; justify-content: space-between; gap: .8rem; }
.upcoming-group-heading .card-kicker { margin-bottom: .35rem; }
.upcoming-group-heading .muted { margin: .4rem 0 0; font-size: .82rem; }
.upcoming-group-heading h3 { font-size: 1.18rem; }
.upcoming-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: .7rem; margin-top: .75rem; }
.upcoming-card { grid-template-columns: 5.6rem minmax(0, 1fr); }
.upcoming-card .detail-card-title { font-size: .96rem; }
.upcoming-card .detail-poster { max-width: 5.6rem; }
.upcoming-card .lifecycle-label { color: var(--green); }
.upcoming-card[data-highlight="true"] { border-color: var(--accent); }
.upcoming-card p { font-size: .82rem; }
.deep-link-highlight, [id^="anime-"]:target { outline: 2px solid #f4bd91; outline-offset: 2px; box-shadow: 0 0 0 5px #f4bd9120, 0 12px 36px #f4bd9124; }
.editorial-section > div > .muted { max-width: 66rem; }
@media (max-width: 1199px) {
  .season-week { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .radar-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .season-hero { grid-template-columns: minmax(0, 1fr) minmax(12rem, .45fr); }
  .season-week { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
  main, .site-header { width: min(calc(100% - 1.2rem), 92rem); }
  .season-hero { grid-template-columns: minmax(0, 1fr); gap: 1rem; padding: 1.25rem; }
  .season-hero-note { grid-template-columns: 1fr; gap: .35rem; padding: .75rem 0 0; border-top: 1px solid #ffffff2b; border-left: 0; font-size: .82rem; }
  .section-nav { top: 0; margin-inline: -.15rem; }
  .section-nav a { padding: .48rem .55rem; font-size: .77rem; }
  main > section { margin-block: 2.1rem; scroll-margin-top: 4.5rem; }
  .editorial-section:not(#current-season) { padding-top: 1.8rem; }
  .section-title { align-items: start; }
  .calendar-view-control { justify-items: start; width: 100%; }
  .segmented-control { width: 100%; }
  .segmented-control button { flex: 1 1 auto; padding-inline: .45rem; font-size: .77rem; }
  .controls { flex-wrap: nowrap; overflow-x: auto; max-width: 100%; }
  #calendar-filter button { flex: 0 0 auto; }
  .season-week { display: flex; gap: .65rem; overflow-x: auto; padding: .15rem .15rem .8rem; scroll-snap-type: x mandatory; overscroll-behavior-inline: contain; }
  .season-day { flex: 0 0 calc(100% - 1.8rem); max-width: 22rem; scroll-snap-align: start; }
  .poster-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-list { grid-template-columns: minmax(0, 1fr); }
  .detail-card { grid-template-columns: 6.7rem minmax(0, 1fr); gap: .75rem; padding: .7rem; }
  .season-metrics { gap: .35rem; }
  .season-metric { min-width: 5rem; }
  .radar-grid { grid-template-columns: minmax(0, 1fr); }
  .upcoming-cards { grid-template-columns: minmax(0, 1fr); }
  .radar-empty-state { align-items: start; flex-direction: column; }
  .radar-empty-state > a { align-self: start; }
}
@media (max-width: 390px) {
  main, .site-header { width: calc(100% - .9rem); }
  .season-day { flex-basis: calc(100% - 1rem); }
  .detail-card { grid-template-columns: 5.8rem minmax(0, 1fr); gap: .6rem; }
  .upcoming-card { grid-template-columns: 5.2rem minmax(0, 1fr); }
  .upcoming-card .detail-poster { max-width: 5.2rem; }
  .detail-card-title { font-size: 1rem; }
  .season-metric { min-width: 4.7rem; padding: .38rem .45rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}


/* Compact, fixed-size poster rows in BOTH Today and Full Season.
   Previously a 100%-width 2:3 image filled an entire full-width grid row. */
.season-stack .season-day { min-width: 0; }
.season-stack .poster-list {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 24rem), 1fr));
  align-items: start;
  gap: .78rem;
}
.season-stack .poster-card { min-width: 0; align-self: start; }
.season-stack .poster-card button {
  display: grid;
  grid-template-columns: 6.25rem minmax(0, 1fr);
  grid-auto-rows: min-content;
  column-gap: .75rem;
  row-gap: .3rem;
  align-content: start;
  align-items: start;
  min-height: 10.4rem;
  height: auto;
  padding: .65rem;
}
.season-stack .poster-card .poster-image {
  grid-column: 1;
  grid-row: 1 / span 5;
  width: 100%;
  max-width: 6.25rem;
  height: 9.375rem;
  max-height: 9.375rem;
  aspect-ratio: 2 / 3;
  object-fit: cover;
  border-radius: .35rem;
}
.season-stack .poster-card .poster-title,
.season-stack .poster-card .poster-meta,
.season-stack .poster-card .state,
.season-stack .poster-card .airing-cue {
  grid-column: 2;
  min-width: 0;
  justify-self: start;
}
.season-stack .poster-card .poster-title { -webkit-line-clamp: 3; font-size: .9rem; }
.season-stack .poster-card .poster-meta { font-size: .75rem; }
.airing-cue {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  margin-top: .14rem;
  padding: .27rem .48rem;
  border-radius: 999px;
  border: 1px solid #716272;
  background: #342b3e;
  color: #e6d4e4;
  font-size: .69rem;
  font-weight: 800;
  line-height: 1.3;
}
.poster-card.airing-now {
  border-color: #f6a1bb;
  box-shadow: 0 0 0 1px #f6a1bb55, 0 8px 24px #ed6d9e24;
}
.poster-card.airing-now .airing-cue {
  border-color: #f49bbb;
  background: #66324a;
  color: #ffe0ec;
}
.poster-card.airing-soon {
  border-color: #eabf87;
  box-shadow: 0 0 0 1px #eabf8744;
}
.poster-card.airing-soon .airing-cue {
  border-color: #eabf87;
  background: #57412c;
  color: #ffe9bd;
}
@media (max-width: 650px) {
  .season-stack .poster-list { grid-template-columns: minmax(0, 1fr); }
  .season-stack .poster-card button {
    grid-template-columns: 5.1rem minmax(0, 1fr);
    min-height: 8.6rem;
    column-gap: .6rem;
  }
  .season-stack .poster-card .poster-image {
    max-width: 5.1rem;
    height: 7.65rem;
    max-height: 7.65rem;
  }
}
