.rankings-page{padding-top:25px}.rankings-shell{width:min(1110px,100%);margin:0 auto}.rank-nav{display:flex;align-items:center;justify-content:space-between;margin:0 4px 22px}.back-link{color:#b6b3c1;text-decoration:none;font-size:.85rem}.back-link:hover{color:var(--lime)}.rank-hero{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;min-height:390px;padding:clamp(36px,6vw,68px);border:1px solid #2c4057;border-radius:28px;background:radial-gradient(ellipse at 82% 33%,rgba(36,112,200,.19),transparent 35%),linear-gradient(120deg,#172033,#121a27 72%);box-shadow:0 30px 80px rgba(0,0,0,.2)}.rank-hero-copy{position:relative;z-index:1;max-width:650px}.rank-hero h1{margin:0;font:600 clamp(3.5rem,8vw,6.4rem)/.89 var(--display);letter-spacing:-.085em}.rank-hero h1 span{color:var(--violet)}.rank-deck{max-width:560px;margin:22px 0 0;color:#acbec8;font-size:1.08rem;line-height:1.65}.rank-hero-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}.rank-button{min-height:42px;display:inline-flex;align-items:center;gap:12px;padding:0 14px;border:1px solid #484553;border-radius:11px;text-decoration:none;font-size:.8rem;font-weight:700;transition:transform .18s,border-color .18s,background .18s}.rank-button:hover{transform:translateY(-2px);border-color:#74a9c2}.rank-button-primary{border-color:var(--lime);background:var(--lime);color:#19191e}.rank-button-primary:hover{background:#78e3f8}.rank-button-outline{background:rgba(255,255,255,.035);color:#e7e4ec}.rank-hero-stamp{position:absolute;right:7%;top:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;width:260px;height:260px;transform:translateY(-55%) rotate(8deg);border:1px solid rgba(84,198,235,.42);border-radius:50%;background:radial-gradient(circle at 45% 44%,rgba(29,97,179,.14),transparent 66%),rgba(11,26,64,.38);color:#dff6ff;box-shadow:inset 0 0 40px rgba(38,131,201,.09)}.rank-hero-stamp strong{font:700 4.25rem/.95 var(--display);letter-spacing:-.1em}.rank-hero-stamp strong span{color:var(--lime)}.stamp-top,.stamp-bottom{font-size:.55rem;font-weight:700;letter-spacing:.16em}.stamp-bottom{margin-top:8px;color:#98adba}.rank-hero-stamp i{position:absolute;right:31px;top:38px;color:var(--lime);font-size:1.6rem;font-style:normal}.rank-hero-footer{position:absolute;right:clamp(28px,6vw,68px);bottom:19px;left:clamp(28px,6vw,68px);display:flex;justify-content:space-between;gap:12px;padding-top:13px;border-top:1px solid rgba(187,225,240,.13);color:#817e8e;font-size:.57rem;font-weight:700;letter-spacing:.12em}.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);margin:16px 0;border:1px solid var(--line);border-radius:18px;background:#121b2a}.stat-strip article{display:flex;flex-direction:column;gap:4px;padding:19px 22px;border-right:1px solid var(--line)}.stat-strip article:last-child{border:0}.stat-strip strong{font:600 1.6rem var(--display);letter-spacing:-.04em}.stat-unit{color:var(--violet);font-size:1rem}.stat-strip article span:last-child{color:#a5a2b0;font-size:.73rem}.page-jump{position:sticky;z-index:5;top:8px;display:flex;gap:5px;overflow-x:auto;padding:8px;margin:19px 0 53px;border:1px solid #383744;border-radius:13px;background:rgba(13,21,32,.9);backdrop-filter:blur(14px);scrollbar-width:none}.page-jump::-webkit-scrollbar{display:none}.page-jump a{flex:none;padding:8px 12px;border-radius:8px;color:#aec5cf;text-decoration:none;font-size:.76rem;font-weight:600;white-space:nowrap}.page-jump a:hover{background:#172b43;color:#fff}.content-section{padding-top:10px;margin-bottom:66px;scroll-margin-top:92px}.content-section .section-heading{margin:0 4px 21px}.content-section .section-heading .eyebrow{color:#a7a3b5}.content-section .section-heading h2{font-size:clamp(1.8rem,4vw,2.45rem)}.recommendation-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.recommendation-card{padding:23px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(150deg,#182131,#121a27 72%)}.rec-index{font-size:.61rem;font-weight:700;letter-spacing:.14em;color:var(--teal)}.rec-violet .rec-index{color:#71dbf3}.rec-gold .rec-index{color:#76c9ef}.recommendation-card h3{margin:12px 0 8px;font:600 1.42rem var(--display);letter-spacing:-.045em}.recommendation-card>p{margin:0;color:#aaa7b5;font-size:.87rem;line-height:1.62}.recommendation-card ul{display:grid;gap:12px;margin:19px 0 0;padding:0;list-style:none}.recommendation-card li{display:flex;flex-direction:column;gap:3px;padding-left:13px;border-left:2px solid rgba(69,201,237,.28)}.recommendation-card li strong{font-size:.86rem}.recommendation-card li span{color:#9e9ba9;font-size:.78rem;line-height:1.5}.rec-violet li{border-color:rgba(69,201,237,.36)}.rec-callout{margin-top:25px;padding:18px;border-left:2px solid var(--teal);border-radius:0 12px 12px 0;background:rgba(69,201,237,.07);color:#d9f6ff;font:500 1.04rem var(--display)}.arc-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}.arc-chips span{padding:6px 9px;border:1px solid #294f70;border-radius:8px;background:rgba(255,255,255,.025);color:#b8e6f5;font-size:.69rem}.recommendation-card .rec-footnote{margin-top:15px;font-size:.73rem}.rating-section{padding-top:5px}.ratings-tools{display:flex;align-items:center;flex-wrap:wrap;gap:9px;padding:14px;border:1px solid var(--line);border-radius:15px;background:#121b2a}.search-field{display:flex;flex:1 1 290px;align-items:center;gap:10px;min-height:42px;padding:0 12px;border:1px solid #393845;border-radius:10px;background:#0d141f;color:#aba8b8}.search-field>span{font-size:1.35rem}.search-field input{width:100%;border:0;outline:0;background:transparent;color:var(--ink);font:400 .82rem var(--body)}.search-field input::placeholder{color:#858291}.select-field select{min-height:42px;max-width:190px;padding:0 27px 0 11px;border:1px solid #393845;border-radius:10px;background:#0d141f;color:#d4e9ef;font:500 .76rem var(--body)}.check-filter{display:flex;align-items:center;gap:6px;padding:0 5px;color:#b7cbd4;font-size:.75rem;white-space:nowrap}.check-filter input{accent-color:#45c9ed}.rating-summary{display:flex;justify-content:space-between;gap:16px;margin:13px 2px;color:#918e9e;font-size:.72rem}.rating-summary p{margin:0}.rating-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.rating-card{min-width:0;padding:14px 15px;border:1px solid #33323f;border-radius:13px;background:linear-gradient(145deg,#151f2e,#121a27)}.rating-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.rating-title{margin:0;font:600 .92rem/1.4 var(--display);overflow-wrap:anywhere}.rating-score{display:flex;flex:none;align-items:center;gap:6px;color:var(--lime);font:700 .82rem var(--display);white-space:nowrap}.rating-score small{color:#8d8a99;font:500 .65rem var(--body)}.rating-note{margin:8px 0 0;color:#aaa7b4;font-size:.79rem;line-height:1.58;overflow-wrap:anywhere}.rating-badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.badge{display:inline-flex;align-items:center;min-height:20px;padding:2px 7px;border:1px solid #41404b;border-radius:999px;color:#b8b4c1;font-size:.57rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase}.badge-rewatch{border-color:#236f96;background:rgba(69,201,237,.07);color:#78d9ef}.badge-ironic{border-color:#286991;background:rgba(47,145,202,.08);color:#7dcaee}.badge-stream{border-color:#1f639d;background:rgba(69,201,237,.07);color:#72d9f1}.badge-era{color:#a6a2af}.no-results{padding:25px;text-align:center;color:#aeabb8;border:1px dashed #454351;border-radius:12px}.milestone-panel{padding:23px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,#182131,#121a27)}.progress-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.progress-heading strong{font:600 1.45rem var(--display)}.progress-heading strong span{color:#898696;font-size:.9rem}.progress-heading p{margin:5px 0 0;color:#aaa7b5;font-size:.78rem}.progress-tag{padding:6px 9px;border:1px solid #246f9b;border-radius:999px;background:rgba(69,201,237,.07);color:var(--lime);font-size:.59rem;font-weight:700;letter-spacing:.09em}.progress-track{height:9px;overflow:hidden;margin:19px 0 21px;border-radius:999px;background:#32313c}.progress-track span{display:block;width:87.2%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#48bde6,#45c9ed);box-shadow:0 0 15px rgba(69,201,237,.23)}.milestone-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.milestone-item{padding:10px;border:1px solid #33323f;border-radius:10px;background:rgba(255,255,255,.018)}.milestone-item strong{display:block;font:600 .84rem var(--display)}.milestone-item span{display:block;margin-top:4px;color:#b5b1bf;font-size:.69rem;line-height:1.5}.milestone-item em{display:block;margin-top:5px;color:#58c9ea;font-size:.64rem;font-style:normal}.data-note{margin:17px 0 0;color:#928f9d;font-size:.7rem}.awards-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.award-card{padding:17px;border:1px solid var(--line);border-radius:15px;background:#141e2d}.award-card h3{margin:0 0 12px;font:600 1.05rem var(--display)}.award-card dl{display:grid;gap:9px;margin:0}.award-card dl div{display:grid;gap:3px}.award-card dt{color:#8f8b9b;font-size:.6rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.award-card dd{margin:0;color:#dceff5;font-size:.78rem;line-height:1.45}.award-card.overall{border-color:#205fa8;background:linear-gradient(145deg,rgba(69,201,237,.13),#141e2d 72%)}.lost-media-panel{padding:23px;border:1px solid #274c68;border-radius:17px;background:linear-gradient(145deg,rgba(24,84,135,.11),#131c28 70%)}.lost-intro{margin:0 0 17px;color:#aaa7b3;font-size:.82rem;line-height:1.6}.lost-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 23px;margin:0;padding:0;list-style:none}.lost-list li{position:relative;padding-left:15px;color:#cde7ef;font-size:.77rem;line-height:1.55}.lost-list li::before{position:absolute;left:0;top:.53em;width:5px;height:5px;border-radius:50%;background:#3a9ed2;content:""}.resource-layout{display:grid;grid-template-columns:1fr 1fr;gap:13px}.resource-card{padding:21px;border:1px solid var(--line);border-radius:17px;background:#151f2e}.resource-icon{display:grid;place-items:center;width:34px;height:34px;border:1px solid #245b8d;border-radius:10px;background:rgba(69,201,237,.08);color:var(--violet);font-size:1rem}.resource-card h3{margin:13px 0 6px;font:600 1.16rem var(--display)}.resource-card>p{margin:0;color:#a7a4b1;font-size:.8rem;line-height:1.55}.resource-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.resource-links a{padding:8px 10px;border:1px solid #42404c;border-radius:9px;color:#e1f3f9;text-decoration:none;font-size:.69rem;font-weight:600}.resource-links a:hover{border-color:#47b9df;color:#86e2f6}.year-links{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}.year-links a{color:#9f9baa;font-size:.69rem}.runtime-card dl{display:grid;gap:0;margin:14px 0 0}.runtime-card dl div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid #34333f;font-size:.73rem}.runtime-card dt{color:#9996a4}.runtime-card dd{margin:0;color:#dceff5;text-align:right}.year-heading{margin:31px 3px 12px;font:600 1.1rem var(--display)}.year-stats-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px}.year-stats{width:100%;border-collapse:collapse;background:#141e2d;text-align:left}.year-stats th,.year-stats td{padding:11px 14px;border-bottom:1px solid #33323d;font-size:.75rem;white-space:nowrap}.year-stats th{color:#9995a4;font-size:.63rem;letter-spacing:.08em;text-transform:uppercase}.year-stats td{color:#d4e9ef}.year-stats tr:last-child td{border:0}.unlisted-card{display:grid;grid-template-columns:minmax(180px,.7fr) 1.3fr;gap:20px;margin-top:16px;padding:21px;border:1px solid #383744;border-radius:16px;background:#141e2d}.unlisted-card .eyebrow{margin-bottom:7px;color:#a7a3b5;font-size:.6rem}.unlisted-card h3{margin:0;font:600 1.1rem var(--display)}.unlisted-list{display:grid;gap:8px}.unlisted-link{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:10px 11px;border:1px solid #383744;border-radius:10px;color:#e4f5fa;text-decoration:none}.unlisted-link:hover{border-color:#2b84bd}.unlisted-link strong{font-size:.73rem}.unlisted-link span{color:#a6a2b0;font-size:.68rem}.unlisted-link b{grid-column:2;grid-row:1/3;align-self:center;color:var(--lime);font:700 .78rem var(--display)}.rating-guide{margin-top:17px;border:1px solid var(--line);border-radius:15px;background:#131c2a}.rating-guide summary{padding:16px 18px;color:#dceff5;font-size:.83rem;font-weight:700;cursor:pointer}.guide-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:0 16px 14px}.guide-grid p{display:flex;flex-direction:column;gap:5px;margin:0;padding:10px;border:1px solid #34333e;border-radius:9px}.guide-grid strong{color:var(--lime);font:600 .83rem var(--display)}.guide-grid span{color:#a9a6b3;font-size:.68rem;line-height:1.45}.rewatch-note{margin:0;padding:0 17px 17px;color:#a7a3b0;font-size:.72rem}.rewatch-note .badge{margin-right:6px}.rank-footer{display:flex;align-items:center;gap:20px;padding:21px 4px 8px;border-top:1px solid #2d2c37;color:#8f8c9b;font-size:.73rem}.rank-footer .wordmark{font-size:.82rem}.rank-footer .wordmark-mark{width:27px;height:27px}.rank-footer>a:last-child{margin-left:auto;color:#aaa7b5;text-decoration:none}.rank-footer>a:last-child:hover{color:var(--lime)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:800px){.rank-hero-stamp{right:-28px;transform:translateY(-55%) scale(.8) rotate(8deg);opacity:.53}.rank-hero-copy{max-width:600px}.stat-strip article{padding:16px}.stat-strip strong{font-size:1.35rem}.milestone-list{grid-template-columns:repeat(2,minmax(0,1fr))}.awards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.rating-list{grid-template-columns:1fr}.guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ratings-tools .select-field select{max-width:none}.ratings-tools .select-field{flex:1 1 135px}.unlisted-card{grid-template-columns:1fr}}
@media(max-width:560px){.rankings-page{padding:17px 14px}.rank-nav{margin-bottom:15px}.rank-nav .wordmark{font-size:.82rem}.back-link{font-size:.76rem}.rank-hero{min-height:420px;padding:31px 22px 74px;border-radius:22px}.rank-hero h1{font-size:clamp(3.5rem,15vw,5.2rem)}.rank-deck{max-width:440px;font-size:.97rem}.rank-hero-stamp{right:-110px;top:65%;transform:translateY(-50%) scale(.66) rotate(8deg);opacity:.27}.rank-hero-footer{left:22px;right:22px;bottom:16px;font-size:.49rem}.rank-hero-footer span:last-child{display:none}.rank-hero-links{max-width:330px}.rank-button{font-size:.72rem;padding:0 10px}.stat-strip{grid-template-columns:repeat(2,1fr)}.stat-strip article:nth-child(2){border-right:0}.stat-strip article:nth-child(-n+2){border-bottom:1px solid var(--line)}.stat-strip article{padding:13px 15px}.stat-strip article span:last-child{font-size:.66rem}.page-jump{margin:14px 0 39px;top:4px}.content-section{margin-bottom:48px}.recommendation-grid{grid-template-columns:1fr}.recommendation-card{padding:19px}.rating-summary{flex-direction:column;gap:5px}.ratings-tools{gap:8px;padding:10px}.search-field{flex-basis:100%}.ratings-tools .select-field{flex:1 1 42%}.ratings-tools .select-field select{width:100%;font-size:.72rem}.check-filter{font-size:.7rem}.milestone-panel{padding:17px}.milestone-list{grid-template-columns:1fr 1fr}.milestone-item{padding:8px}.milestone-item strong{font-size:.76rem}.milestone-item span{font-size:.64rem}.awards-grid{grid-template-columns:1fr 1fr}.award-card{padding:13px}.award-card dd{font-size:.72rem}.lost-media-panel{padding:17px}.lost-list{grid-template-columns:1fr;gap:9px}.resource-layout{grid-template-columns:1fr}.unlisted-card{padding:16px}.guide-grid{grid-template-columns:1fr 1fr}.rank-footer{flex-wrap:wrap;gap:10px}.rank-footer>span{width:100%;order:3}.rank-footer>a:last-child{margin-left:auto}}
@media(prefers-reduced-motion:reduce){.rankings-page *{scroll-behavior:auto!important;transition:none!important}}
.unrated-section{margin-top:14px;border:1px solid #3a3944;border-radius:14px;background:#131c2a}.unrated-section summary{padding:15px 17px;color:#d8edf3;font-size:.79rem;font-weight:700;cursor:pointer}.unrated-section>p{margin:0;padding:0 17px 13px;color:#a5a2af;font-size:.73rem;line-height:1.5}.unrated-list{display:flex;flex-wrap:wrap;gap:6px;padding:0 17px 17px}.unrated-list span{padding:6px 8px;border:1px solid #3a3944;border-radius:7px;color:#c6c2cd;font-size:.67rem}
.channel-timeline{display:grid;grid-template-columns:.72fr 2.28fr;gap:25px;margin:21px 0 45px;padding:22px;border:1px solid #34333f;border-radius:17px;background:linear-gradient(120deg,rgba(69,201,237,.045),#131c2a 50%,rgba(69,201,237,.05))}.timeline-heading .eyebrow{margin:2px 0 8px;color:#aaa6b6;font-size:.59rem}.timeline-heading h2{margin:0;font:600 1.23rem/1.25 var(--display);letter-spacing:-.035em}.timeline-events{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.timeline-events article{padding-left:10px;border-left:1px solid #315878}.timeline-events strong{color:var(--lime);font:600 .76rem var(--display)}.timeline-events p{margin:6px 0 0;color:#aaa7b5;font-size:.68rem;line-height:1.52}
@media(max-width:800px){.channel-timeline{grid-template-columns:1fr;gap:17px}.timeline-events{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.channel-timeline{padding:17px;margin-bottom:35px}.timeline-events{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 8px}.timeline-events p{font-size:.65rem}}

/* FWOB palette, sampled from the channel mark: cyan, royal blue, and deep navy. */
.rankings-page {
  --violet: var(--page-accent-bright);
  --lime: var(--page-accent-bright);
  --teal: var(--page-accent);
  --panel: #121b2a;
  --panel-raised: #17243a;
  --line: #263b55;
  --muted: #91a8b5;
  padding-bottom: 92px;
  background:
    radial-gradient(circle at 82% 7%, rgba(36, 112, 200, 0.18), transparent 32rem),
    radial-gradient(circle at 8% 38%, rgba(69, 201, 237, 0.08), transparent 27rem),
    linear-gradient(180deg, #101827 0%, #0d131e 44rem, #0f141c 100%);
}

.rankings-page .status-dot {
  background: #45c9ed;
  box-shadow: 0 0 14px rgba(69, 201, 237, 0.48);
}

/* Flatter shapes keep the interface quiet and let the content carry the page. */
.rank-hero { border-radius: 14px; }
.rank-button,
.page-jump,
.search-field,
.select-field select,
.milestone-item,
.resource-links a,
.unlisted-link { border-radius: 6px; }
.stat-strip,
.recommendation-card,
.ratings-tools,
.rating-card,
.milestone-panel,
.award-card,
.lost-media-panel,
.resource-card,
.year-stats-wrap,
.unlisted-card,
.rating-guide,
.unrated-section,
.channel-timeline { border-radius: 8px; }
.resource-icon { border-radius: 6px; }

html[data-theme="light"] .rankings-page {
  --ink: #17212b;
  --muted: #526879;
  --line: #bfd1df;
  color: var(--ink);
  background:
    radial-gradient(circle at 82% 7%, rgba(36, 112, 200, 0.13), transparent 32rem),
    radial-gradient(circle at 8% 38%, rgba(69, 201, 237, 0.11), transparent 27rem),
    linear-gradient(180deg, #edf5fa 0%, #e6edf2 44rem, #edf0f2 100%);
}

html[data-theme="light"] .back-link { color: #496274; }
html[data-theme="light"] .back-link:hover { color: #0c67a9; }

html[data-theme="light"] .rank-hero {
  border-color: #aac5d8;
  background:
    radial-gradient(ellipse at 82% 33%, rgba(69, 201, 237, 0.2), transparent 35%),
    linear-gradient(120deg, #f8fbfd, #e3f0f7 72%);
  box-shadow: 0 20px 60px rgba(20, 68, 106, 0.1);
}

html[data-theme="light"] .rank-hero h1 span { color: #137cb9; }
html[data-theme="light"] .rank-deck { color: #465c6c; }
html[data-theme="light"] .rank-button-primary { border-color: #176da9; color: #fff; background: #176da9; }
html[data-theme="light"] .rank-button-primary:hover { background: #0d5d98; }
html[data-theme="light"] .rank-button-outline { border-color: #98b5c9; color: #29485e; background: rgba(255, 255, 255, 0.52); }
html[data-theme="light"] .rank-hero-stamp { border-color: rgba(25, 126, 185, 0.42); color: #153e69; background: radial-gradient(circle at 45% 44%, rgba(69, 201, 237, 0.2), transparent 66%), rgba(238, 248, 252, 0.65); }
html[data-theme="light"] .stamp-bottom { color: #517186; }
html[data-theme="light"] .rank-hero-footer { border-color: rgba(29, 89, 130, 0.17); color: #667f90; }

html[data-theme="light"] .stat-strip,
html[data-theme="light"] .recommendation-card,
html[data-theme="light"] .ratings-tools,
html[data-theme="light"] .rating-card,
html[data-theme="light"] .milestone-panel,
html[data-theme="light"] .award-card,
html[data-theme="light"] .lost-media-panel,
html[data-theme="light"] .resource-card,
html[data-theme="light"] .year-stats,
html[data-theme="light"] .unlisted-card,
html[data-theme="light"] .rating-guide,
html[data-theme="light"] .unrated-section,
html[data-theme="light"] .channel-timeline {
  border-color: #bfd1df;
  background: #f7fafc;
}

html[data-theme="light"] .page-jump {
  border-color: #b7cad8;
  background: rgba(240, 246, 250, 0.92);
}

html[data-theme="light"] .page-jump a { color: #435e72; }
html[data-theme="light"] .page-jump a:hover { color: #123c5c; background: #dbeaf3; }
html[data-theme="light"] .search-field,
html[data-theme="light"] .select-field select { border-color: #b8cbd9; color: #243b4c; background: #fff; }
html[data-theme="light"] .search-field input { color: #17212b; }
html[data-theme="light"] .search-field input::placeholder { color: #758996; }
html[data-theme="light"] .check-filter { color: #40596a; }

html[data-theme="light"] .recommendation-card > p,
html[data-theme="light"] .recommendation-card li span,
html[data-theme="light"] .rating-note,
html[data-theme="light"] .rating-summary,
html[data-theme="light"] .progress-heading p,
html[data-theme="light"] .milestone-item span,
html[data-theme="light"] .lost-intro,
html[data-theme="light"] .resource-card > p,
html[data-theme="light"] .runtime-card dt,
html[data-theme="light"] .timeline-events p,
html[data-theme="light"] .unrated-section > p,
html[data-theme="light"] .guide-grid span,
html[data-theme="light"] .rewatch-note { color: #526879; }

html[data-theme="light"] .milestone-item,
html[data-theme="light"] .guide-grid p,
html[data-theme="light"] .unlisted-link,
html[data-theme="light"] .unrated-list span { border-color: #cad9e3; background: rgba(255, 255, 255, 0.55); }
html[data-theme="light"] .rating-score,
html[data-theme="light"] .rec-index,
html[data-theme="light"] .timeline-events strong,
html[data-theme="light"] .guide-grid strong { color: #087cad; }
html[data-theme="light"] .progress-track { background: #cfdee8; }
html[data-theme="light"] .progress-track span { background: linear-gradient(90deg, #2470c8, #45c9ed); }
html[data-theme="light"] .award-card.overall { border-color: #79afd2; background: linear-gradient(145deg, rgba(69, 201, 237, 0.14), #f7fafc 72%); }
html[data-theme="light"] .year-stats th,
html[data-theme="light"] .year-stats td { border-color: #d0dde6; color: #425b6d; }
html[data-theme="light"] .year-stats th { color: #607888; }
html[data-theme="light"] .runtime-card dd,
html[data-theme="light"] .award-card dd,
html[data-theme="light"] .lost-list li,
html[data-theme="light"] .unlisted-link { color: #263d4e; }
html[data-theme="light"] .rank-footer { border-color: #c4d3de; color: #5c7180; }
html[data-theme="light"] .rank-footer > a:last-child { color: #466276; }

@media (max-width: 560px) {
  .rankings-page { padding-bottom: 138px; }
}

/* Hero logo, recommendations, list view, and milestone timeline. */
.rank-hero { min-height: 440px; }
.rank-hero-logo {
  position: absolute;
  top: 50%;
  right: 7%;
  width: min(260px, 26vw);
  aspect-ratio: 1;
  border: 1px solid rgba(69, 201, 237, 0.46);
  border-radius: 50%;
  box-shadow: 0 18px 45px rgba(10, 39, 101, 0.35);
  object-fit: cover;
  transform: translateY(-50%) rotate(8deg);
}
.rank-hero-footer { display: none; }
.giraffe-card { display: flex; flex-direction: column; }
.video-embed { position: relative; overflow: hidden; width: 100%; aspect-ratio: 16 / 9; margin-top: 18px; border: 1px solid rgba(69, 201, 237, 0.35); border-radius: 8px; background: #0d131e; }
.video-embed iframe { position: absolute; width: 100%; height: 100%; border: 0; inset: 0; }

.ratings-tools { display: block; }
.ranking-controls { margin-top: 10px; border-top: 1px solid #303e4f; }
.ranking-controls summary { padding: 12px 2px 2px; color: #b9ddea; font-size: 0.78rem; font-weight: 700; cursor: pointer; }
.ranking-filters { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; padding-top: 10px; }
.ranking-controls:not([open]) .ranking-filters { display: none; }
.ranking-table-wrap { overflow-x: auto; border: 1px solid #30455b; border-radius: 8px; background: #121b2a; }
.ranking-table { width: 100%; min-width: 850px; border-collapse: collapse; text-align: left; }
.ranking-table tbody.rating-list { display: table-row-group; }
.ranking-table th, .ranking-table td { padding: 13px 15px; border-bottom: 1px solid #2b3d50; vertical-align: top; }
.ranking-table thead th { position: sticky; top: 0; z-index: 2; color: #9cc9d8; background: #152131; font-size: 0.64rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.ranking-table tbody tr { transition: background 160ms ease; }
.ranking-table tbody tr:hover { background: rgba(69, 201, 237, 0.06); }
.ranking-table tbody tr:last-child > * { border-bottom: 0; }
.rating-score { display: inline-flex; align-items: baseline; justify-content: center; min-width: 48px; padding: 6px 7px; border: 1px solid rgba(69, 201, 237, 0.28); border-radius: 7px; background: rgba(69, 201, 237, 0.07); font-size: 0.9rem; }
.rating-score small { margin-left: 3px; font-size: 0.56rem; }
.rating-title { width: 20%; min-width: 180px; font: 600 0.88rem/1.4 var(--display); }
.ranking-table .rating-note { width: 44%; min-width: 340px; max-width: none; margin: 0; color: #aaa7b4; font-size: 0.78rem; line-height: 1.55; }
.ranking-table .badge-era { white-space: nowrap; }
.table-muted { color: #71828f; }

.milestone-timeline { position: relative; height: 106px; margin: 30px 10px 12px; }
.milestone-rail { position: absolute; top: 50%; right: 0; left: 0; height: 4px; border-radius: 999px; background: linear-gradient(90deg, #2470c8, #45c9ed); box-shadow: 0 0 15px rgba(69, 201, 237, 0.22); transform: translateY(-50%); }
.milestone-point { position: absolute; top: 50%; left: var(--point); z-index: 1; width: 12px; height: 12px; padding: 0; border: 2px solid #c7f4ff; border-radius: 50%; background: #2470c8; box-shadow: 0 0 0 3px #172434, 0 0 12px rgba(69, 201, 237, 0.72); cursor: help; transform: translate(-50%, -50%); }
.milestone-point.unreached { border-color: #6d8493; background: #263847; box-shadow: 0 0 0 3px #172434; }
.milestone-point:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.milestone-point span { position: absolute; z-index: 2; bottom: calc(100% + 14px); left: 50%; width: min(240px, 70vw); padding: 9px 10px; border: 1px solid #3a7091; border-radius: 7px; background: #0d1825; color: #ddf5fb; font: 500 0.72rem/1.45 var(--body); text-align: left; pointer-events: none; opacity: 0; transform: translate(-50%, 4px); transition: opacity 120ms ease, transform 120ms ease; }
.milestone-point[style*="--row:1"] span { top: calc(100% + 14px); bottom: auto; }
.milestone-point:hover span, .milestone-point:focus span { opacity: 1; transform: translate(-50%, 0); }

html[data-theme="light"] .rank-hero-logo { border-color: rgba(22, 109, 169, 0.48); box-shadow: 0 18px 45px rgba(25, 91, 135, 0.2); }
html[data-theme="light"] .ranking-controls { border-color: #c8d9e4; }
html[data-theme="light"] .ranking-controls summary { color: #29566e; }
html[data-theme="light"] .ranking-table-wrap { border-color: #bfd1df; background: #f7fafc; }
html[data-theme="light"] .ranking-table thead th { color: #526f80; background: #e7f0f5; }
html[data-theme="light"] .ranking-table th, html[data-theme="light"] .ranking-table td { border-color: #d4e1e8; }
html[data-theme="light"] .ranking-table tbody tr:hover { background: #eaf5f9; }
html[data-theme="light"] .rating-score { border-color: #9bc8de; background: #e8f5fa; }
html[data-theme="light"] .milestone-point { border-color: #e5f7fc; box-shadow: 0 0 0 3px #edf4f7, 0 0 12px rgba(31, 136, 183, 0.42); }
html[data-theme="light"] .milestone-point.unreached { border-color: #98aeb9; background: #d8e2e7; box-shadow: 0 0 0 3px #edf4f7; }
html[data-theme="light"] .milestone-point span { border-color: #9fc4d6; background: #f8fcfe; color: #17394d; }

@media (max-width: 800px) {
  .rank-hero-logo { right: -28px; width: 230px; opacity: 0.65; }
}
@media (max-width: 560px) {
  .rank-hero { min-height: 450px; }
  .rank-hero-logo { top: 66%; right: -106px; width: 220px; opacity: 0.3; }
  .ranking-table-wrap { margin-right: -2px; margin-left: -2px; }
  .milestone-timeline { height: 118px; margin-right: 5px; margin-left: 5px; }
  .milestone-point { width: 10px; height: 10px; }
  .milestone-point span { width: min(220px, 78vw); font-size: 0.67rem; }
}