/* Generated by scripts/system/build_css.php. Edit public/assets/styles/*.css, then run php scripts/run.php css:build. */

/* source: 00-foundation-home.css */
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Poppins:wght@100..900&display=swap");

:root {
    --bg: #f4f4ef;
    --surface: #ffffff;
    --text: #171717;
    --muted: #64645c;
    --border: #deded4;
    --green: #116b49;
    --green-dark: #0a4d35;
    --blue: #1c4f8f;
    --yellow: #ffd83d;
    --red: #a33b32;
    --font-body: "Open Sans", Arial, Helvetica, sans-serif;
    --font-heading: "Poppins", "Open Sans", Arial, Helvetica, sans-serif;
    --font-size-body: 16px;
    --site-section-title-size: 30px;
    --shadow: 0 14px 34px rgba(24, 33, 29, 0.08);
    --glass-bg: rgba(0, 0, 0, 0.54);
    --glass-blur: blur(18px) saturate(140%);
    --site-shell-max: 1180px;
    --site-shell-gutter: 32px;
    --site-shell-width: min(var(--site-shell-max), calc(100% - var(--site-shell-gutter)));
    --hub-main-image-ratio: 460 / 215;
    --site-header-height: 72px;
    --channel-bar-height: 38px;
}

/* Home v2: hub-aligned editorial layout */
.home-v2 {
    min-height: 100vh;
    margin-top: calc((var(--site-header-height) + var(--channel-bar-height)) * -1);
    background:
        radial-gradient(circle at 50% -160px, rgba(255, 216, 61, 0.12), transparent 360px),
        linear-gradient(180deg, #050706 0, #07110e 430px, #f2f2ec 430px, #f2f2ec 100%);
    color: #161b18;
    overflow-x: hidden;
}

.home-v2-shell {
    width: var(--site-shell-width);
    margin: 0 auto;
}

.home-v2-hero {
    --home-hero-safe-top: clamp(28px, 2.6vw, 46px);
    position: relative;
    isolation: isolate;
    min-height: calc(620px + var(--site-header-height) + var(--channel-bar-height) + var(--home-hero-safe-top));
    margin: 0;
    padding: calc(var(--site-header-height) + var(--channel-bar-height) + var(--home-hero-safe-top)) 0 28px;
    overflow: hidden;
    background: #050706;
    color: #fff;
}

.home-v2-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background-color: #050706;
    background-image: var(--home-bg);
    background-position: center;
    background-size: cover;
    filter: none;
    opacity: 0.72;
    transform: none;
}

.home-v2-hero__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(circle at 78% 14%, rgba(255, 216, 61, 0.08), transparent 30%),
        linear-gradient(90deg, rgba(0, 0, 0, 0.82), rgba(0, 0, 0, 0.46) 48%, rgba(0, 0, 0, 0.74)),
        linear-gradient(180deg, rgba(0, 0, 0, 0.24), rgba(0, 0, 0, 0.12) 48%, rgba(0, 0, 0, 0.86));
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.home-v2-hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 20%);
    grid-template-rows: auto auto;
    column-gap: clamp(28px, 5vw, 78px);
    align-content: end;
    min-height: 620px;
    padding-top: 0;
}

.home-v2-strap {
    width: fit-content;
    max-width: 100%;
    margin: 0 0 18px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 15px;
    font-weight: 600;
}

.home-v2-hero__meta-panel {
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    justify-self: end;
    width: 100%;
    min-width: 280px;
    max-width: 320px;
    margin: 0;
    color: rgba(255, 255, 255, 0.74);
}

.home-v2-hero__meta-panel p {
    margin: 0 0 14px;
    font-size: var(--font-size-body);
    font-weight: 500;
    line-height: 1.45;
}

.home-v2-metrics {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    margin: 0;
}

.home-v2-metrics div {
    min-width: 0;
    padding: 11px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.17);
}

.home-v2-metrics div:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, 0.17);
}

.home-v2-metrics dt {
    margin: 0;
    color: #fff;
    font-size: 23px;
    font-weight: 780;
    line-height: 1;
}

.home-v2-metrics dd {
    margin: 5px 0 0;
    color: rgba(255, 255, 255, 0.62);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    text-transform: uppercase;
}

.home-v2-discover-trails {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.home-v2-discover-trails a {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.86);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
}

.home-v2-discover-trails a:hover {
    border-color: rgba(255, 216, 61, 0.54);
    color: #fff;
}

.home-v2-hero__lead {
    display: block;
    grid-column: 1;
    grid-row: 1;
    max-width: 780px;
    color: #fff;
    text-decoration: none;
}

.home-v2-hero__lead span,
.home-v2-section__head span,
.home-v2-news-card p span,
.home-v2-hub-lane__cover span {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    color: var(--yellow);
    font-size: 15px;
    font-weight: 780;
    line-height: 1.1;
    text-transform: uppercase;
}

.home-v2-section__head > span {
    color: var(--green-dark);
}

.home-v2-section--dark .home-v2-section__head > span,
.home-v2-section--platforms .home-v2-section__head > span {
    color: #7edcaf;
}

.home-v2-hero__lead h1 {
    margin: 12px 0 14px;
    color: #fff;
    font-size: clamp(32px, 3.9vw, 62px);
    line-height: 1.02;
    letter-spacing: 0;
    text-shadow: 0 4px 28px rgba(0, 0, 0, 0.62);
}

.home-v2-hero__lead p {
    max-width: 680px;
    margin: 0;
    color: rgba(255, 255, 255, 0.86);
    font-size: var(--font-size-body);
    font-weight: 500;
    line-height: 1.5;
}

.home-v2-recommend {
    grid-column: 1 / -1;
    grid-row: 2;
    margin-top: 46px;
}

.home-v2-recommend h2 {
    margin: 0 0 16px;
    color: #fff;
    font-size: clamp(23px, 2.7vw, 38px);
    line-height: 1.05;
}

.home-v2-reel {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.home-v2-rec-card,
.home-v2-news-card,
.home-v2-platform-card,
.home-v2-hub-lane,
.home-v2-hub-lane__cover {
    overflow: hidden;
    border-radius: 8px;
    text-decoration: none;
}

.home-v2-rec-card {
    position: relative;
    isolation: isolate;
    display: grid;
    min-height: 284px;
    background: #0b0f0d;
    color: #fff;
    box-shadow: 0 22px 54px rgba(0, 0, 0, 0.28);
}

.home-v2-rec-card::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(180deg, rgba(2, 5, 4, 0.08), rgba(2, 5, 4, 0.42) 44%, rgba(2, 5, 4, 0.88)),
        linear-gradient(90deg, rgba(2, 5, 4, 0.44), rgba(2, 5, 4, 0.08));
    pointer-events: none;
}

.home-v2-rec-card figure,
.home-v2-news-card figure {
    margin: 0;
    background: #101411;
}

.home-v2-rec-card figure {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.home-v2-rec-card img,
.home-v2-news-card img,
.home-v2-hub-lane__cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-v2-rec-card div {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 12px;
    align-content: end;
    align-self: end;
    min-height: 100%;
    padding: 18px;
}

.home-v2-rec-card span {
    color: var(--yellow);
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    font-size: 15px;
    font-weight: 780;
    line-height: 1.1;
    text-transform: uppercase;
}

.home-v2-rec-card strong {
    display: -webkit-box;
    overflow: hidden;
    color: #fff;
    font-size: 23px;
    line-height: 1.24;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.home-v2-rec-card small {
    color: rgba(255, 255, 255, 0.74);
    font-size: 15px;
    font-weight: 500;
}

.home-v2-stack {
    display: grid;
    gap: 26px;
    padding: 34px 0 72px;
}

.home-v2-section {
    padding: 22px;
    border: 1px solid rgba(12, 21, 17, 0.08);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 46px rgba(9, 15, 12, 0.08);
}

.home-v2-section--dark,
.home-v2-section--platforms {
    border-color: rgba(255, 255, 255, 0.08);
    background:
        radial-gradient(circle at 16% 0%, rgba(24, 116, 78, 0.32), transparent 36%),
        linear-gradient(135deg, rgba(8, 11, 12, 0.98), rgba(10, 21, 26, 0.96));
    color: #fff;
}

.home-v2-section__head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(12, 21, 17, 0.14);
}

.home-v2-section--dark .home-v2-section__head,
.home-v2-section--platforms .home-v2-section__head {
    border-bottom-color: rgba(255, 255, 255, 0.14);
}

.home-v2-section__head h2 {
    margin: 0;
    color: inherit;
    font-size: clamp(21px, 2.55vw, 34px);
    line-height: 1.05;
}

.home-v2-tabs {
    display: inline-grid;
    grid-auto-flow: column;
    gap: 4px;
    margin-bottom: 16px;
    padding: 4px;
    border: 1px solid rgba(12, 21, 17, 0.1);
    border-radius: 8px;
    background: #f2f2ec;
}

.home-v2-tabs button {
    min-width: 96px;
    min-height: 38px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #536057;
    font: inherit;
    font-size: 15px;
    font-weight: 760;
    cursor: pointer;
}

.home-v2-tabs button.is-active {
    background: var(--green-dark);
    color: #fff;
}

.home-v2-popular-list {
    display: none;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}

.home-v2-popular-list.is-active {
    display: grid;
}

.home-v2-popular-card {
    display: grid;
    grid-template-rows: 132px auto;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(12, 21, 17, 0.1);
    border-radius: 8px;
    background: #f8f8f4;
    color: #151915;
    text-decoration: none;
}

.home-v2-popular-card figure {
    position: relative;
    margin: 0;
    background: #101411;
}

.home-v2-popular-card figure img,
.home-v2-update-card figure img,
.home-v2-compact-card figure img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-v2-popular-card__rank {
    position: absolute;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    margin: 10px;
    border-radius: 50%;
    background: var(--green-dark);
    color: #fff;
    font-size: 15px;
    font-weight: 800;
}

.home-v2-popular-card div,
.home-v2-update-card div,
.home-v2-compact-card div {
    display: grid;
    gap: 7px;
    align-content: start;
    min-width: 0;
    padding: 12px;
}

.home-v2-popular-card strong,
.home-v2-update-card strong,
.home-v2-compact-card strong {
    display: -webkit-box;
    overflow: hidden;
    color: #151915;
    font-size: 17px;
    line-height: 1.2;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.home-v2-popular-card small,
.home-v2-update-card small,
.home-v2-compact-card small {
    color: #657066;
    font-size: 13px;
    font-weight: 560;
    line-height: 1.35;
}

.home-v2-continue-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.home-v2-continue-card {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 12px;
    min-height: 86px;
    padding: 8px;
    overflow: hidden;
    border: 1px solid rgba(12, 21, 17, 0.1);
    border-radius: 8px;
    background: #f8f8f4;
    color: #151915;
    text-decoration: none;
}

.home-v2-continue-card figure {
    margin: 0;
    overflow: hidden;
    border-radius: 6px;
    background: #111713;
}

.home-v2-continue-card img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-v2-continue-card strong {
    display: -webkit-box;
    overflow: hidden;
    font-size: 16px;
    line-height: 1.2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.home-v2-continue-card span {
    color: var(--green-dark);
    font-size: 12px;
    font-weight: 760;
    text-transform: uppercase;
}

.home-v2-news-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.home-v2-news-card {
    display: grid;
    grid-template-rows: 172px minmax(172px, auto);
    border: 1px solid rgba(12, 21, 17, 0.1);
    background: #f8f8f4;
    color: #151915;
}

.home-v2-news-card--lead {
    grid-column: span 2;
    grid-row: span 2;
    grid-template-rows: 352px minmax(190px, auto);
}

.home-v2-news-card div {
    display: grid;
    gap: 10px;
    align-content: start;
    padding: 16px;
}

.home-v2-news-card p {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0;
    color: #667068;
    font-size: 15px;
    font-weight: 500;
}

.home-v2-news-card p span {
    color: var(--green-dark);
}

.home-v2-news-card h3 {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    color: #151915;
    font-size: 22px;
    line-height: 1.22;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.home-v2-news-card--lead h3 {
    font-size: 32px;
    line-height: 1.14;
}

.home-v2-news-card small {
    display: -webkit-box;
    overflow: hidden;
    color: #4f5a52;
    font-size: 17px;
    line-height: 1.48;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.home-v2-more-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    align-items: center;
    gap: 14px;
    min-height: 100%;
    padding: 18px;
    overflow: hidden;
    border-radius: 8px;
    text-decoration: none;
    transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.home-v2-more-card:hover {
    transform: translateY(-2px);
}

.home-v2-more-card span {
    font-size: 20px;
    font-weight: 750;
    line-height: 1.15;
}

.home-v2-more-card i {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
}

.home-v2-more-card--news {
    border: 1px solid rgba(12, 21, 17, 0.12);
    background: #f8f8f4;
    color: #151915;
}

.home-v2-more-card--news i {
    background: var(--green-dark);
    color: #fff;
}

.home-v2-section--hubs {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.home-v2-hub-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.home-v2-hub-grid--related .hub-teaser-card--home-v2 {
    grid-template-columns: minmax(104px, 38%) minmax(0, 1fr) 42px;
    min-height: 118px;
    padding: 8px 9px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    background: rgba(8, 13, 12, 0.94);
}

.home-v2-hub-grid--related .hub-teaser-card--home-v2::before {
    background-image: var(--teaser-bg);
    background-position: center;
    background-size: cover;
    filter: blur(9px) saturate(140%) brightness(1.26);
    transform: scale(1.12);
    opacity: 0.96;
}

.home-v2-hub-grid--related .hub-teaser-card--home-v2::after {
    background:
        linear-gradient(90deg, rgba(3, 5, 4, 0.7), rgba(3, 5, 4, 0.78) 54%, rgba(2, 3, 3, 0.9));
    backdrop-filter: blur(5px) saturate(128%);
    -webkit-backdrop-filter: blur(5px) saturate(128%);
    box-shadow: inset 0 0 0 999px rgba(0, 0, 0, 0.18);
}

.home-v2-hub-grid--related .hub-teaser-card--home-v2 .hub-teaser-card__visual {
    width: 100%;
    aspect-ratio: var(--hub-main-image-ratio);
    background: transparent;
    border-radius: 6px;
}

.home-v2-hub-grid--related .hub-teaser-card--home-v2 .hub-teaser-card__visual img {
    object-fit: cover;
    border-radius: 6px;
    background: transparent;
}

.home-v2-hub-grid--related .hub-teaser-card--home-v2 .hub-teaser-card__title {
    display: -webkit-box;
    overflow: hidden;
    font-size: 16px;
    line-height: 1.12;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.home-v2-hub-grid--related .hub-teaser-card--home-v2 .hub-teaser-card__score {
    width: 42px;
    height: 42px;
    font-size: 16px;
}

.home-v2-hub-grid--related .hub-teaser-card--home-v2 .hub-teaser-card__score::before {
    inset: 5px;
}

.home-v2 .hub-teaser-card--home-v2 .hub-teaser-card__rank {
    display: none;
}

.home-v2-more-card--hubs {
    min-height: 118px;
    border: 1px solid rgba(12, 21, 17, 0.12);
    background: rgba(8, 13, 12, 0.94);
    color: #fff;
}

.home-v2-more-card--hubs i {
    background: rgba(255, 255, 255, 0.12);
    color: var(--yellow);
}

.home-v2-update-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.home-v2-update-card {
    display: grid;
    grid-template-rows: auto auto;
    min-height: 100%;
    overflow: hidden;
    border: 1px solid rgba(12, 21, 17, 0.1);
    border-radius: 8px;
    background: #fff;
    color: #151915;
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(9, 15, 12, 0.06);
}

.home-v2-update-card figure {
    margin: 0;
    aspect-ratio: var(--hub-main-image-ratio);
    background: #101411;
}

.home-v2-update-card span {
    width: fit-content;
    max-width: 100%;
    color: var(--green-dark);
    font-size: 13px;
    font-weight: 780;
    line-height: 1.1;
    text-transform: uppercase;
}

.home-v2-section--split {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.home-v2-compact-lane .home-v2-section__head {
    margin-bottom: 12px;
}

.home-v2-compact-list {
    display: grid;
    gap: 10px;
}

.home-v2-compact-card {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    min-height: 78px;
    overflow: hidden;
    border: 1px solid rgba(12, 21, 17, 0.1);
    border-radius: 8px;
    background: #f8f8f4;
    color: #151915;
    text-decoration: none;
}

.home-v2-compact-card figure {
    margin: 0;
    aspect-ratio: var(--hub-main-image-ratio);
    background: #101411;
}

.home-v2-franchise-row {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}

.home-v2-franchise-row a {
    display: grid;
    align-content: start;
    gap: 0;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(12, 21, 17, 0.1);
    border-radius: 8px;
    background: #f8f8f4;
    color: #151915;
    text-decoration: none;
}

.home-v2-franchise-row figure {
    width: 100%;
    margin: 0;
    overflow: hidden;
    aspect-ratio: 1;
    background: #171b18;
}

.home-v2-franchise-row img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 180ms ease;
}

.home-v2-franchise-row a:hover img {
    transform: scale(1.025);
}

.home-v2-franchise-row a > div {
    display: grid;
    gap: 6px;
    min-width: 0;
    padding: 13px 14px 15px;
}

.home-v2-franchise-row strong {
    font-size: 18px;
    line-height: 1.15;
}

.home-v2-franchise-row span {
    color: #657066;
    font-size: 14px;
    font-weight: 650;
}

.home-v2-community-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(260px, 0.7fr);
    gap: 18px;
}

.home-v2-topic-list,
.home-v2-community-hubs {
    display: grid;
    gap: 10px;
}

.home-v2-topic-list a,
.home-v2-community-hubs a {
    display: grid;
    gap: 5px;
    padding: 13px 14px;
    border: 1px solid rgba(12, 21, 17, 0.1);
    border-radius: 8px;
    background: #f8f8f4;
    color: #151915;
    text-decoration: none;
}

.home-v2-topic-list strong {
    font-size: 18px;
    line-height: 1.2;
}

.home-v2-topic-list span,
.home-v2-community-hubs span {
    color: #5f6a61;
    font-size: 14px;
    font-weight: 640;
}

.home-v2-community-hubs strong {
    color: #151915;
    font-size: 17px;
    line-height: 1.2;
}

.home-v2-platform-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}

.home-v2-platform-card {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 5px 12px;
    min-height: 118px;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background:
        radial-gradient(circle at 0 0, rgba(126, 230, 178, 0.13), transparent 48%),
        rgba(255, 255, 255, 0.06);
    color: #fff;
    transition: border-color 0.18s ease, background 0.18s ease;
}

.home-v2-platform-card:hover {
    border-color: rgba(255, 216, 61, 0.48);
    background:
        radial-gradient(circle at 0 0, rgba(126, 230, 178, 0.2), transparent 50%),
        rgba(255, 255, 255, 0.1);
}

.home-v2-platform-card i {
    grid-row: span 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    align-self: start;
    justify-self: center;
    margin-top: 0;
    color: var(--yellow);
    font-size: 30px;
    line-height: 1;
}

.home-v2-platform-card strong {
    color: #fff;
    font-size: 22px;
    line-height: 1.1;
}

.home-v2-platform-card span {
    color: rgba(255, 255, 255, 0.75);
    font-size: 16px;
    font-weight: 500;
}

.home-v2-hub-lanes {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.home-v2-hub-lane {
    display: grid;
    grid-template-rows: auto auto;
    border: 1px solid rgba(12, 21, 17, 0.08);
    background: #f7f7f2;
}

.home-v2-hub-lane__cover {
    position: relative;
    display: flex;
    aspect-ratio: var(--hub-main-image-ratio);
    flex-direction: column;
    justify-content: flex-end;
    min-width: 0;
    padding: 18px;
    background-image: var(--home-bg);
    background-position: center;
    background-size: cover;
    color: #fff;
}

.home-v2-hub-lane__cover::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.88), rgba(0, 0, 0, 0.18));
}

.home-v2-hub-lane__cover img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-v2-hub-lane__cover span,
.home-v2-hub-lane__cover strong {
    position: relative;
    z-index: 1;
}

.home-v2-hub-lane__cover strong {
    margin-top: 8px;
    color: #fff;
    font-size: 24px;
    line-height: 1.15;
}

.home-v2-hub-lane__links {
    display: grid;
    gap: 0;
    padding: 14px 16px 18px;
}

.home-v2-hub-lane__links a {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(12, 21, 17, 0.1);
    color: #151915;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.25;
    text-decoration: none;
}

.home-v2-hub-lane__links a:last-child {
    border-bottom: 0;
}

.home-v2-hub-lane__links span {
    color: var(--green);
    font-size: 0;
    font-weight: 700;
}

.home-v2-hub-lane__links span::before {
    content: "→";
    font-size: 17px;
}

@media (max-width: 680px) {
    .home-v2-news-grid,
    .home-v2-hub-grid,
    .home-v2-reel,
    .home-v2-popular-list,
    .home-v2-update-grid,
    .home-v2-continue-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-v2-news-card--lead {
        grid-column: span 2;
    }

    .home-v2-platform-grid,
    .home-v2-hub-lanes,
    .home-v2-franchise-row {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .home-v2-shell {
        width: var(--site-shell-width);
    }

    .home-v2-hero {
        --home-hero-safe-top: 24px;
        min-height: calc(610px + var(--site-header-height) + var(--channel-bar-height) + var(--home-hero-safe-top));
        padding-top: calc(var(--site-header-height) + var(--channel-bar-height) + var(--home-hero-safe-top));
    }

    .home-v2-hero__inner {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        min-height: 610px;
        min-width: 0;
    }

    .home-v2-hero__inner {
        padding-top: 28px;
    }

    .home-v2-strap,
    .home-v2-hero__lead,
    .home-v2-hero__meta-panel {
        align-self: stretch;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        margin-bottom: 12px;
        box-sizing: border-box;
    }

    .home-v2-hero__lead {
        padding-right: 18px;
    }

    .home-v2-hero__lead h1,
    .home-v2-hero__lead p {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .home-v2-news-grid,
    .home-v2-hub-grid,
    .home-v2-reel,
    .home-v2-popular-list,
    .home-v2-update-grid,
    .home-v2-continue-list,
    .home-v2-section--split,
    .home-v2-community-grid,
    .home-v2-platform-grid,
    .home-v2-franchise-row,
    .home-v2-hub-lanes,
    .home-v2-rec-card,
    .home-v2-news-card,
    .home-v2-update-card,
    .home-v2-compact-card,
    .home-v2-platform-card,
    .home-v2-hub-lane {
        min-width: 0;
    }

    .home-v2-hero__meta-panel p {
        max-width: 360px;
        margin-bottom: 12px;
    }

    .home-v2-metrics {
        max-width: 360px;
    }

    .home-v2-hero__lead h1 {
        font-size: 31px;
        line-height: 1.08;
    }

    .home-v2-hero__lead p {
        display: -webkit-box;
        overflow: hidden;
        font-size: var(--font-size-body);
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }

    .home-v2-recommend {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin-top: 42px;
        overflow: hidden;
    }

    .home-v2-recommend h2 {
        margin-bottom: 14px;
        font-size: 23px;
    }

    .home-v2-reel {
        display: flex;
        gap: 14px;
        margin: 0 -14px;
        padding: 0 14px 12px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
    }

    .home-v2-rec-card {
        min-width: 276px;
        grid-template-rows: 155px minmax(172px, auto);
        scroll-snap-align: start;
    }

    .home-v2-rec-card strong {
        font-size: 21px;
    }

    .home-v2-stack {
        gap: 18px;
        padding-top: 22px;
    }

    .home-v2-section {
        padding: 16px;
    }

    .home-v2-section__head {
        display: grid;
        gap: 7px;
    }

    .home-v2-section__head h2 {
        font-size: 30px;
    }

    .home-v2-news-grid,
    .home-v2-hub-grid,
    .home-v2-reel,
    .home-v2-popular-list,
    .home-v2-update-grid,
    .home-v2-continue-list,
    .home-v2-section--split,
    .home-v2-community-grid,
    .home-v2-platform-grid,
    .home-v2-franchise-row,
    .home-v2-hub-lanes {
        grid-template-columns: 1fr;
    }

    .home-v2-franchise-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-v2-tabs {
        width: 100%;
        grid-auto-flow: column;
    }

    .home-v2-tabs button {
        min-width: 0;
    }

    .home-v2-news-card,
    .home-v2-news-card--lead {
        grid-column: auto;
        grid-row: auto;
        grid-template-rows: 196px auto;
    }

    .home-v2-news-card--lead h3 {
        font-size: 25px;
    }

    .home-v2-platform-card {
        min-height: 94px;
    }

    .home-v2-hub-lane {
        grid-template-rows: auto auto;
    }
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    color: var(--text);
    background: var(--bg);
    font-family: var(--font-body);
    font-size: var(--font-size-body);
    line-height: 1.55;
    overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-heading);
}

a {
    color: inherit;
}

img,
iframe {
    max-width: 100%;
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px clamp(16px, 4vw, 42px);
    background: rgba(255, 255, 255, 0.94);
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(8px);
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    min-height: 72px;
    color: #fff;
    background: transparent;
    border-bottom: 0;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) inset, 0 18px 48px rgba(0, 0, 0, 0.42);
    isolation: isolate;
    overflow: visible;
}

.site-header::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    opacity: 1;
    pointer-events: none;
    z-index: 0;
}

.site-header__inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 42px 56px auto minmax(320px, 690px) auto;
    gap: clamp(10px, 1.5vw, 22px);
    align-items: center;
    width: var(--site-shell-width);
    min-height: 72px;
    margin: 0 auto;
    padding: 0;
    min-width: 0;
}

.top-search {
    display: grid;
    grid-template-columns: 104px 1px minmax(140px, 1fr) 48px;
    gap: 0;
    width: min(690px, 100%);
    min-height: 52px;
    justify-self: stretch;
    border: 0;
    border-radius: 16px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.16);
    box-shadow: 0 16px 44px rgba(2, 12, 35, 0.18);
    min-width: 0;
}

.top-search--review-disabled {
    grid-template-columns: 1fr;
    place-items: center;
    padding: 0 18px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 14px;
    font-weight: 800;
    text-align: center;
}

.top-search select,
.top-search input,
.top-search button {
    min-height: 48px;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: 16px;
}

.top-search select {
    width: 100%;
    padding: 0 26px 0 18px;
    color: rgba(255, 255, 255, 0.9);
    font-weight: 800;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='rgba(255%2C255%2C255%2C0.6)'/%3E%3C/svg%3E") no-repeat right 10px center;
}

.top-search select option {
    color: #111;
    background: #fff;
    font-weight: 700;
}

.top-search-divider {
    align-self: center;
    width: 1px;
    height: 30px;
    background: rgba(255, 255, 255, 0.22);
}

.top-search input {
    width: 100%;
    min-width: 0;
    padding: 0 12px;
    color: #fff;
    font-style: italic;
    font-weight: 700;
    outline: 0;
}

.top-search input::placeholder {
    color: rgba(255, 255, 255, 0.54);
    opacity: 1;
}

.top-search button {
    display: grid;
    place-items: center;
    padding: 0;
    border-radius: 0;
    cursor: pointer;
    color: rgba(255, 255, 255, 0.9);
}

.top-search button:hover {
    background: transparent;
    color: #fff;
}

.top-search button i {
    font-size: 18px;
}

.brand {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0;
    min-width: 0;
    color: #fff;
    text-decoration: none;
    min-width: 0;
}

.brand::before {
    content: "";
    position: absolute;
    inset: -18px -34px -18px -18px;
    display: none;
}

.brand-logo {
    display: block;
    width: 50px;
    height: 50px;
    flex: 0 0 auto;
    border-radius: 0;
    box-shadow: none;
    object-fit: contain;
}

.menu-toggle {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #fff;
    cursor: pointer;
}

.menu-toggle i {
    font-size: 24px;
}

.header-primary-nav {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 4px;
}

.header-primary-nav a,
.header-nav-trigger {
    display: inline-flex;
    align-items: center;
    height: 38px;
    padding: 0 10px;
    border: 0;
    background: transparent;
    color: rgba(255,255,255,0.86);
    font: inherit;
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}

.header-primary-nav a:hover,
.header-nav-trigger:hover,
.header-nav-trigger[aria-expanded="true"] {
    color: #fff;
    background: rgba(255,255,255,0.1);
}

.header-nav-trigger .arrow {
    margin-left: 4px;
    font-size: 15px;
    opacity: 0.64;
}

.menu-toggle:hover,
.nav-links__header button:hover {
    background: rgba(255, 255, 255, 0.14);
}

.lang-switch-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    justify-self: end;
    width: auto;
    min-width: 80px;
    min-height: 50px;
    padding: 0 16px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28), 0 0 0 1px rgba(255, 255, 255, 0.08) inset;
}

.lang-switch-btn i {
    font-size: 15px;
}

.lang-switch-btn:hover {
    background: rgba(255, 255, 255, 0.24);
}

.lang-switch-btn--disabled {
    border: 1px solid rgba(255, 255, 255, 0.14);
}

.language-coming-soon {
    position: fixed;
    top: 82px;
    right: max(16px, calc((100vw - var(--site-shell-width)) / 2));
    z-index: 1200;
    padding: 10px 14px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    background: rgba(5, 12, 25, 0.96);
    color: #fff;
    font-size: 15px;
    font-weight: 900;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.34);
}

.language-coming-soon[hidden] {
    display: none;
}

.portal-header.is-menu-open {
    z-index: 1000;
}

.menu-scrim {
    position: fixed;
    inset: 0;
    z-index: 59;
    background: rgba(3, 10, 25, 0.62);
    opacity: 0;
    pointer-events: none;
    transition: opacity 160ms ease;
}

.portal-header.is-menu-open .menu-scrim {
    opacity: 1;
    pointer-events: auto;
}

.nav-links {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 60;
    display: flex;
    width: min(370px, calc(100vw - 28px));
    flex-direction: column;
    gap: 6px;
    padding: 24px;
    overflow-y: auto;
    background: rgba(0, 0, 0, 0.9);
    box-shadow: 28px 0 60px rgba(0, 0, 0, 0.56);
    backdrop-filter: blur(26px) saturate(150%);
    -webkit-backdrop-filter: blur(26px) saturate(150%);
    transform: translateX(-105%);
    transition: transform 180ms ease;
}

.portal-header.is-menu-open .nav-links {
    transform: translateX(0);
}

.nav-links__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 0 16px;
    margin-bottom: 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.13);
    color: #fff;
    font-size: 20px;
}

.nav-links__header button {
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 20px;
    cursor: pointer;
}

.btn-link,
.text-link {
    color: var(--green-dark);
    font-weight: 700;
    text-decoration: none;
}

.nav-links a {
    display: flex;
    min-height: 44px;
    align-items: center;
    padding: 9px 12px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 16px;
    font-weight: 800;
    text-decoration: none;
}

.site-category-icon {
    width: 1.2em;
    flex: 0 0 1.2em;
    line-height: 1;
    text-align: center;
}

/* Font Awesome 7 vectors for icons whose shapes changed after the local 6.5 font. */
.site-fa7-icon {
    display: inline-block;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: var(--site-fa7-icon-url) center / contain no-repeat;
    mask: var(--site-fa7-icon-url) center / contain no-repeat;
    vertical-align: -0.125em;
}

.site-fa7-icon::before {
    content: none !important;
}

.site-fa7-icon--film {
    --site-fa7-icon-url: url("/assets/icons/fontawesome-film-solid-v7.svg");
}

.site-fa7-icon--dice {
    --site-fa7-icon-url: url("/assets/icons/fontawesome-dice-solid-v7.svg");
}

.site-open-icon {
    display: inline-block;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: var(--site-open-icon-url) center / contain no-repeat;
    mask: var(--site-open-icon-url) center / contain no-repeat;
    vertical-align: -0.125em;
}

.site-open-icon::before {
    content: none !important;
}

.site-open-icon--game-controller {
    --site-open-icon-url: url("/assets/icons/material-sports-esports-filled.svg?v=2");
}

.nav-links a .site-category-icon {
    margin-right: 10px;
    color: var(--yellow);
}

.nav-links a:hover {
    border-color: rgba(255, 216, 61, 0.34);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.menu-open {
    overflow: hidden;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.breadcrumbs,
.content-band,
.article-layout,
.container {
    width: var(--site-shell-width);
    margin: 0 auto;
}

.work-hero h1,
.article-body h1 {
    margin: 0 0 12px;
    font-size: clamp(42px, 7vw, 86px);
    line-height: 0.96;
    letter-spacing: 0;
}

.work-hero__text > p {
    max-width: 760px;
    color: var(--muted);
    font-size: var(--font-size-body);
}

.search-panel {
    display: grid;
    gap: 10px;
    margin: 18px 0;
}

.search-panel {
    grid-template-columns: minmax(240px, 1fr) minmax(190px, 240px) auto auto;
    align-items: center;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.search-panel--faceted {
    grid-template-columns: minmax(240px, 1fr) minmax(190px, 240px) auto auto;
}

.search-facets {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}

.search-facets label {
    display: grid;
    gap: 5px;
}

.search-facets span {
    color: var(--muted);
    font-size: 15px;
    font-weight: 850;
}

.search-clear {
    grid-column: 1 / -1;
    color: var(--green-dark);
    font-size: 15px;
    font-weight: 850;
}

.search-empty-note {
    grid-column: 1 / -1;
    padding: 14px;
    border: 1px dashed var(--border);
    border-radius: 8px;
    background: #fff;
}

.search-results-section {
    display: grid;
    gap: 14px;
    margin-top: 28px;
}

.search-results-section .section-heading > p:not(.eyebrow) {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: var(--font-size-body);
}

[data-search-load-item][hidden] {
    display: none !important;
}

.search-load-actions {
    display: flex;
    justify-content: center;
    padding-top: 4px;
}

.search-load-button {
    appearance: none;
    display: inline-flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: fit-content;
    max-width: 100%;
    min-height: 50px;
    padding: 8px 16px 7px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: transparent;
    color: var(--ink);
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.1;
}

.search-load-button:hover,
.search-load-button:focus-visible {
    border-color: var(--green);
    background: transparent;
    color: var(--green);
}

.search-load-button > i {
    font-size: 10px;
    transition: transform 180ms ease;
}

.search-load-button:hover > i,
.search-load-button:focus-visible > i {
    transform: translateY(2px);
}

.search-load-button[hidden],
.search-load-actions[hidden] {
    display: none !important;
}

.search-page {
    padding-bottom: 72px;
}

.search-results-section .text-link {
    display: inline-flex;
    margin-top: 8px;
}

.eyebrow {
    margin: 0 0 8px;
    color: var(--green-dark);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.button-link,
button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 9px 14px;
    border: 0;
    border-radius: 8px;
    background: var(--green);
    color: #fff;
    font: inherit;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.button-link:hover,
button:hover {
    background: var(--green-dark);
}

button.danger {
    background: var(--red);
}

.metric-strip {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.metric-strip.compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.metric-strip.compact div {
    padding: 10px 12px;
    border-top: 4px solid var(--green);
}

.metric-strip.compact dt {
    font-size: 24px;
}

.metric-strip div,
.category-tile,
.work-card,
.news-item,
.side-panel,
.info-panel,
.discussion-panel,
.media-frame,
.image-gallery figure,
.card,
.stat-card,
.auth-card {
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.metric-strip div {
    padding: 16px;
}

.metric-strip dt {
    margin: 0;
    color: var(--green-dark);
    font-size: 34px;
    font-weight: 800;
}

.metric-strip dd {
    margin: 0;
    color: var(--muted);
}

.content-band {
    padding: 26px 0;
}

.breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    padding: 18px 0 0;
    color: var(--muted);
    font-size: 15px;
}

.breadcrumbs a {
    color: var(--green-dark);
    font-weight: 800;
    text-decoration: none;
}

.breadcrumbs span:last-child {
    color: var(--text);
    font-weight: 700;
}

.section-heading {
    margin-bottom: 14px;
}

.section-heading h1,
.section-heading h2 {
    margin: 0;
    font-size: 30px;
    line-height: 1.1;
    letter-spacing: 0;
}

.compact-heading {
    margin-top: 24px;
}

.category-grid,
.work-grid,
.post-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}

.section-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 22px;
}

.section-pills a {
    border: 1px solid var(--border);
    border-radius: 999px;
    color: var(--muted);
    font-size: 15px;
    padding: 7px 12px;
    text-decoration: none;
}

.section-pills a.active,
.section-pills a:hover {
    background: var(--text);
    border-color: var(--text);
    color: var(--surface);
}

.category-tile {
    min-height: 110px;
    padding: 16px;
    color: var(--text);
    text-decoration: none;
}

.category-tile strong,
.category-tile span {
    display: block;
}

.category-tile strong {
    margin-bottom: 24px;
    font-size: 19px;
}

.category-tile span {
    color: var(--muted);
}

.company-hero {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 24px;
    align-items: center;
}

.company-hero__logo {
    display: grid;
    place-items: center;
    width: 180px;
    aspect-ratio: 1;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
}

.company-hero__logo[data-logo-surface="dark"] {
    border-color: rgba(255, 255, 255, 0.2);
    background: #101416;
}

.company-hero__logo img {
    display: block;
    width: auto;
    height: auto;
    max-width: 82%;
    max-height: 82%;
    object-fit: contain;
    object-position: center center;
}

.company-hero__logo span {
    color: #111;
    font-size: 64px;
    font-weight: 800;
}

@media (max-width: 680px) {
    .company-hero {
        grid-template-columns: 1fr;
    }

    .company-hero__logo {
        width: 128px;
    }
}

.split-layout,
.article-layout,
.two-col {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(300px, 0.7fr);
    gap: 20px;
    align-items: start;
}

.news-list,
.compact-list,
.stack,
.form {
    display: grid;
    gap: 12px;
}

.editorial-lead {
    padding-top: 8px;
}

.lead-story {
    display: grid;
    grid-template-columns: minmax(300px, 0.9fr) minmax(0, 1.1fr);
    gap: 18px;
    align-items: stretch;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.lead-story {
    border-top: 5px solid var(--yellow);
}

.lead-story img {
    width: 100%;
    height: 100%;
    min-height: 260px;
    object-fit: cover;
}

.lead-story > div {
    display: grid;
    align-content: center;
    padding: 20px;
}

.lead-story h2 {
    margin: 10px 0;
    font-size: clamp(30px, 4vw, 52px);
    line-height: 1;
    letter-spacing: 0;
}

.lead-story h2 a {
    text-decoration: none;
}

.news-item,
.work-card,
.side-panel,
.info-panel,
.discussion-panel,
.card,
.auth-card {
    padding: 16px;
}

.media-thumb {
    display: grid;
    place-items: center;
    overflow: hidden;
    min-height: 150px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: linear-gradient(135deg, #222, #545454);
    color: var(--yellow);
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
    text-align: center;
}

.media-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.media-thumb.large {
    min-height: 260px;
    border: 0;
    border-radius: 0;
}

.media-thumb.small {
    min-height: 96px;
    align-self: stretch;
}

.media-thumb > .news-visual-fallback,
.article-cover > .news-visual-fallback,
.cover-placeholder > .news-visual-fallback {
    place-self: stretch;
}

.news-visual-fallback {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 7px;
    width: 100%;
    height: 100%;
    min-height: inherit;
    padding: 16px;
    overflow: hidden;
    color: #fff;
    text-align: left;
    background: linear-gradient(135deg, #111820, #355a48 52%, #091014);
}

.news-visual-fallback::before,
.news-visual-fallback::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.news-visual-fallback::before {
    background:
        radial-gradient(circle at 18% 16%, rgba(255, 218, 57, .32), transparent 30%),
        radial-gradient(circle at 88% 18%, rgba(0, 158, 122, .34), transparent 32%),
        linear-gradient(115deg, rgba(255,255,255,.08), transparent 40%);
    opacity: .9;
}

.news-visual-fallback::after {
    background: linear-gradient(0deg, rgba(0,0,0,.78), rgba(0,0,0,.16) 68%, rgba(0,0,0,.3));
}

.news-visual-fallback > span,
.news-visual-fallback > strong {
    position: relative;
    z-index: 1;
}

.news-visual-fallback > span {
    width: fit-content;
    max-width: 100%;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(0,0,0,.46);
    color: #fff;
    font-size: 15px;
    font-weight: 900;
    line-height: 1.1;
    text-transform: uppercase;
}

.news-visual-fallback > strong {
    color: #fff;
    font-size: clamp(18px, 2.4vw, 28px);
    font-weight: 900;
    line-height: 1.12;
    text-shadow: 0 2px 14px rgba(0,0,0,.42);
}

.news-visual-fallback--games { background: linear-gradient(135deg, #10131f, #16425a 48%, #0d0e13); }
.news-visual-fallback--culture { background: linear-gradient(135deg, #171016, #684133 54%, #0d1112); }
.news-visual-fallback--tech { background: linear-gradient(135deg, #08151a, #145a58 50%, #061014); }
.news-visual-fallback--sports { background: linear-gradient(135deg, #11170f, #41661f 54%, #0c100b); }
.news-visual-fallback--money { background: linear-gradient(135deg, #10140f, #3a5b31 52%, #0b100b); }
.news-visual-fallback--news { background: linear-gradient(135deg, #141414, #4b4c55 54%, #101015); }
.news-visual-fallback--wellbeing { background: linear-gradient(135deg, #121513, #42755f 52%, #0d1110); }

.news-visual-fallback--thumb,
.news-visual-fallback--micro {
    padding: 8px;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.news-visual-fallback--thumb > span,
.news-visual-fallback--micro > span {
    padding: 0;
    background: transparent;
    font-size: 15px;
    line-height: 1.12;
}

.news-visual-fallback--thumb > strong,
.news-visual-fallback--micro > strong {
    display: none;
}

.news-visual-fallback--list,
.news-visual-fallback--hub {
    min-height: 106px;
    padding: 12px;
}

.news-visual-fallback--list > strong,
.news-visual-fallback--hub > strong {
    font-size: 17px;
}

.news-visual-fallback--article {
    min-height: 330px;
}

.article-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: calc(320px + var(--site-header-height) + var(--channel-bar-height));
    margin: calc((var(--site-header-height) + var(--channel-bar-height)) * -1) 0 0;
    padding: calc(var(--site-header-height) + var(--channel-bar-height) + clamp(38px, 5vw, 72px)) 0 clamp(28px, 4vw, 54px);
    color: #fff;
    background: #050607;
}

.article-hero::before,
.article-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.article-hero::before {
    z-index: -2;
    background-image: var(--article-hero-bg);
    background-position: center;
    background-size: cover;
    filter: blur(2px) saturate(108%);
    transform: scale(1.025);
    opacity: 0.68;
}

.article-hero::after {
    z-index: -1;
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.86), rgba(0, 0, 0, 0.60) 54%, rgba(0, 0, 0, 0.78));
    backdrop-filter: blur(4px) saturate(118%);
    -webkit-backdrop-filter: blur(4px) saturate(118%);
}

.article-hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
    column-gap: clamp(24px, 4vw, 56px);
    row-gap: 0;
    align-items: center;
    width: var(--site-shell-width);
    margin: 0 auto;
}

.article-hero__topline {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-width: 0;
    margin-bottom: clamp(12px, 2vw, 22px);
}

.article-hero__copy {
    min-width: 0;
}

.article-hero__breadcrumbs {
    width: auto;
    margin: 0;
    color: rgba(255, 255, 255, 0.72);
    visibility: hidden;
}

.article-hero__breadcrumbs a,
.article-hero__breadcrumbs span {
    color: rgba(255, 255, 255, 0.82);
}

.article-hero__meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
    margin: 0 0 14px;
}

.article-hero__meta span {
    display: inline-flex;
    min-height: 32px;
    align-items: center;
    padding: 5px 12px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.38);
    color: rgba(255, 255, 255, 0.9);
    font-size: 15px;
    font-weight: 800;
}

.article-hero h1 {
    max-width: 850px;
    margin: 0;
    color: #fff;
    font-size: clamp(34px, 4.8vw, 62px);
    line-height: 0.98;
    letter-spacing: 0;
    overflow-wrap: anywhere;
}

.article-hero__copy > p {
    display: -webkit-box;
    max-width: 760px;
    margin: 18px 0 0;
    overflow: hidden;
    color: rgba(255, 255, 255, 0.84);
    font-size: var(--font-size-body);
    line-height: 1.45;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.article-hero__hubs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.article-hero__hubs a {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    padding: 6px 12px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
}

.article-hero__hubs a:hover {
    border-color: rgba(255, 216, 61, 0.48);
    background: rgba(255, 216, 61, 0.15);
}

.article-hero__media {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
    margin: 0;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.42);
    box-shadow: 0 22px 52px rgba(0, 0, 0, 0.35);
}

.article-hero__media img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.article-hero__media figcaption {
    padding: 9px 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(5, 8, 7, 0.78);
    color: rgba(255, 255, 255, 0.74);
    font-size: 15px;
    line-height: 1.35;
}

.article-card {
    padding-top: 22px;
}

.media-list-item {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.work-card .media-thumb {
    margin: -16px -16px 12px;
    aspect-ratio: var(--hub-main-image-ratio);
    min-height: 0;
    border-width: 0 0 1px;
    border-radius: 8px 8px 0 0;
}

.work-card .media-thumb img {
    aspect-ratio: auto;
}

.work-card .media-thumb > span {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
}

.compact-list img {
    display: block;
    width: 100%;
    margin-bottom: 8px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 6px;
}

.article-cover {
    margin: 18px 0 24px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
}

.article-cover img {
    display: block;
    width: 100%;
    max-height: 620px;
    object-fit: contain;
    background: #f0f0ea;
}

.cover-placeholder {
    display: grid;
    min-height: 260px;
    padding: 0;
    place-items: center;
    background: linear-gradient(135deg, #222, #555);
    color: var(--yellow);
    font-size: 18px;
    font-weight: 900;
    overflow: hidden;
}

.article-side {
    position: sticky;
    top: calc(var(--site-header-height) + var(--channel-bar-height) + 8px);
}

.linked-hub-list {
    display: grid;
    gap: 10px;
}

.linked-hub-list a {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    color: var(--text);
    text-decoration: none;
}

.linked-hub-list img {
    width: 96px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 6px;
}

.linked-hub-list strong,
.linked-hub-list small {
    display: block;
}

.linked-hub-list small {
    color: var(--muted);
}

.article-next-block {
    margin: 28px 0 8px;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg);
}

.article-reading-queue {
    margin: 30px 0 10px;
    padding: 20px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-left: 5px solid #ed0015;
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 247, 243, 0.98)),
        var(--surface);
}

.article-reading-queue__head {
    max-width: 680px;
    margin-bottom: 14px;
}

.article-reading-queue__head h2 {
    margin: 0;
    font-size: 25px;
    line-height: 1.18;
}

.article-reading-queue__head p:not(.eyebrow) {
    margin: 8px 0 0;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.45;
}

.article-reading-steps {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.article-reading-steps li {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 12px 0;
    border-top: 1px solid var(--border);
}

.article-reading-steps li:first-child {
    border-top: 0;
}

.article-reading-steps__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin-top: 2px;
    border-radius: 50%;
    background: #111;
    color: #fff;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
}

.article-reading-steps .is-current .article-reading-steps__mark {
    background: var(--green-dark);
}

.article-reading-steps__body {
    min-width: 0;
    color: var(--text);
    text-decoration: none;
}

.article-reading-steps__body small,
.article-reading-steps__body em {
    display: block;
    color: var(--muted);
    font-size: 15px;
    font-style: normal;
    line-height: 1.35;
}

.article-reading-steps__body strong {
    display: block;
    margin: 2px 0;
    font-size: 18px;
    line-height: 1.28;
    overflow-wrap: anywhere;
}

.article-reading-steps a.article-reading-steps__body:hover strong {
    color: var(--green-dark);
}

.article-next-block__head {
    margin-bottom: 14px;
}

.article-next-block__head h2 {
    margin: 0;
    font-size: 24px;
    line-height: 1.2;
}

.article-next-grid {
    display: grid;
    grid-template-columns: minmax(220px, 0.72fr) minmax(0, 1fr);
    gap: 16px;
    align-items: stretch;
}

.article-hub-card {
    display: grid;
    align-content: start;
    gap: 8px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    color: var(--text);
    text-decoration: none;
}

.article-hub-card img {
    display: block;
    width: 100%;
    aspect-ratio: var(--hub-main-image-ratio);
    object-fit: cover;
}

.article-hub-card span,
.article-hub-card strong,
.article-hub-card small {
    margin-inline: 12px;
}

.article-hub-card span {
    margin-top: 4px;
    color: var(--green-dark);
    font-size: 15px;
    font-weight: 800;
}

.article-hub-card strong {
    font-size: 18px;
    line-height: 1.25;
}

.article-hub-card small {
    margin-bottom: 12px;
    color: var(--muted);
    font-size: 15px;
}

.article-related-list {
    display: grid;
    align-content: start;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    padding: 14px 16px;
}

.article-related-list h3 {
    margin: 0 0 8px;
    font-size: 18px;
}

.article-related-list a {
    display: grid;
    gap: 3px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
    color: var(--text);
    text-decoration: none;
}

.article-related-list a:last-child {
    border-bottom: 0;
}

.article-related-list a:hover strong {
    color: var(--green-dark);
}

.article-related-list strong {
    font-size: 16px;
    line-height: 1.3;
}

.article-related-list span {
    color: var(--muted);
    font-size: 15px;
}

.wide-list {
    max-width: 860px;
}

.news-item h2,
.news-item h3,
.work-card h2,
.topic h3 {
    margin: 6px 0 8px;
    line-height: 1.18;
    letter-spacing: 0;
}

.news-item p,
.work-card p,
.side-panel p,
.topic p {
    color: var(--muted);
}

.item-meta,
.tag-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}

.item-meta > span,
.tag-row span,
.pill {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #eef2ed;
    color: var(--muted);
    font-size: 15px;
    font-weight: 700;
}

.item-meta .badge,
.badge {
    background: #fff4cf;
    color: #765400;
    border: 1px solid #e6c45c;
}

.item-meta .badge--anime,
.badge--anime {
    background: #dff4ff;
    color: #075985;
    border: 1px solid #7dd3fc;
}

.compact-list a {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
    text-decoration: none;
}

.compact-list a:last-child {
    border-bottom: 0;
}

.compact-list strong,
.compact-list span {
    display: block;
}

.compact-list__thumb {
    width: 78px;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 5px;
    background: var(--border);
}

.compact-list__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    object-fit: cover;
}

.compact-list__copy {
    min-width: 0;
}

.compact-list__copy strong {
    overflow-wrap: anywhere;
}

.compact-list span {
    color: var(--muted);
    font-size: 15px;
}

.compact-list .news-visual-fallback {
    display: flex;
}

.compact-list .news-visual-fallback > span {
    color: #fff;
}

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

.work-card {
    min-height: 240px;
}

.work-card h2 a,
.news-item h2 a,
.news-item h3 a {
    text-decoration: none;
}

.work-hero {
    position: relative;
    z-index: 0;
    isolation: isolate;
    min-height: calc(390px + var(--site-header-height) + var(--channel-bar-height));
    margin: calc((var(--site-header-height) + var(--channel-bar-height)) * -1) 0 30px;
    overflow: hidden;
    color: #fff;
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.66) 42%, rgba(0, 0, 0, 0.28) 100%),
        #111;
}

.work-hero.has-hero-background {
    background: #111;
}

.work-hero.has-hero-background::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: var(--work-hero-bg);
    background-position: var(--work-hero-bg-x, 50%) var(--work-hero-bg-y, 50%);
    background-repeat: no-repeat;
    background-size: cover;
}

.work-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: radial-gradient(circle at 12% 100%, rgba(255, 216, 61, 0.14), transparent 30%);
    pointer-events: none;
}

.work-hero.has-hero-background::before {
    z-index: 1;
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.72) 38%, rgba(0, 0, 0, 0.28) 74%, rgba(0, 0, 0, 0.52) 100%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.22), rgba(0, 0, 0, 0.78)),
        radial-gradient(circle at 12% 100%, rgba(255, 216, 61, 0.14), transparent 30%);
}

.work-hero__inner {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    width: var(--site-shell-width);
    min-height: calc(390px + var(--site-header-height) + var(--channel-bar-height));
    margin: 0 auto;
    padding: calc(var(--site-header-height) + var(--channel-bar-height) + 18px) 0 32px;
    min-width: 0;
}

.work-hero .breadcrumbs {
    width: auto;
    margin: 0 0 18px;
    color: rgba(255, 255, 255, 0.78);
    visibility: hidden;
}

.work-hero .breadcrumbs a {
    color: rgba(255, 255, 255, 0.9);
}

.work-hero .breadcrumbs span {
    color: rgba(255, 255, 255, 0.76);
}

.work-hero .breadcrumbs span:last-child {
    color: rgba(255, 255, 255, 0.82);
}

.work-hero__content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 340px);
    gap: 24px;
    align-items: end;
    min-height: 230px;
    margin-top: auto;
    min-width: 0;
}

.work-hero__main {
    display: grid;
    grid-template-columns: minmax(220px, 270px) minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
    grid-template-areas:
        "cover heading"
        "summary summary";
    gap: 18px 24px;
    align-self: end;
    align-items: start;
    min-width: 0;
}

.work-hero__cover {
    grid-area: cover;
    width: 100%;
    aspect-ratio: var(--hub-main-image-ratio);
    height: auto;
    margin: 0;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(0, 0, 0, 0.35);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.34);
}

.work-hero__cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.work-hero__cover--event-logo img {
    object-fit: contain;
}

.work-hero__heading,
.work-hero__summary,
.work-hero__text {
    display: flex;
    flex-direction: column;
    padding: 0;
    min-width: 0;
}

.work-hero__heading {
    grid-area: heading;
    justify-content: center;
    min-height: calc((270px - 2px) / 2.1395);
    padding: 10px 0;
}

.work-hero__summary {
    grid-area: summary;
    justify-content: space-between;
    gap: 22px;
}

.work-hero__heading h1,
.work-hero__text h1 {
    max-width: 640px;
    margin: 12px 0 0;
    font-size: clamp(32px, 4vw, 46px);
    line-height: 1;
    text-shadow: 0 3px 20px rgba(0, 0, 0, 0.4);
    overflow-wrap: anywhere;
}

.work-hero__summary > p,
.work-hero__text > p,
.work-hero .lead {
    width: 100%;
    max-width: none;
    margin: 0;
    font-size: var(--font-size-body);
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.86);
    overflow-wrap: anywhere;
}

.work-hero__summary > p {
    min-height: 4.5em;
}

.work-hero .tag-row span,
.work-hero .item-meta > span {
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(0, 0, 0, 0.42);
    color: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.work-hero .item-meta > span {
    min-height: 34px;
    padding: 7px 13px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    font-weight: 800;
    transition: background 0.14s, border-color 0.14s, transform 0.14s;
}

.work-hero .item-meta > span:hover {
    border-color: rgba(255, 216, 61, 0.62);
    background: rgba(255, 216, 61, 0.18);
    transform: translateY(-1px);
}

.work-hero .item-meta > .badge {
    background: rgba(255, 216, 61, 0.92);
    color: #161616;
    border-color: rgba(255, 216, 61, 0.92);
}

.work-hero .item-meta > .badge:hover {
    background: rgba(255, 216, 61, 1);
    color: #161616;
}

.work-hero .item-meta > .badge--anime {
    background: #dff4ff;
    color: #075985;
    border-color: #7dd3fc;
}

.work-hero .item-meta > .badge--anime:hover {
    background: #bfecff;
    color: #075985;
    border-color: #38bdf8;
}

.work-hero-nav {
    display: flex;
    flex-wrap: nowrap;
    gap: 0;
    width: 100%;
    max-width: 100%;
    margin-top: 0;
    overflow: visible;
    border: 0;
    border-radius: 999px;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.work-hero-nav a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 0;
    min-width: 0;
    min-height: 38px;
    padding: 8px 10px;
    border: 0;
    border-right: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.9);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.16;
    text-decoration: none;
    text-align: center;
    transition: background 0.14s, border-color 0.14s, transform 0.14s;
}

.work-hero-nav a:last-child {
    border-right: 0;
}

.work-hero-nav a:hover {
    color: #fff;
    background: transparent;
    transform: none;
}

.lead {
    color: var(--muted);
    font-size: 20px;
}

.info-panel dl {
    margin: 0;
}

.work-hero .info-panel {
    align-self: end;
    padding: 14px 18px 18px;
    border-color: rgba(255, 255, 255, 0.14);
    background: var(--glass-bg);
    color: #fff;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.34);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    min-width: 0;
}

.info-panel__capsule {
    margin: -14px -18px 16px;
    overflow: hidden;
    border-radius: 10px 10px 0 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(0, 0, 0, 0.35);
}

.info-panel__capsule picture,
.info-panel__capsule img {
    display: block;
}

.info-panel__capsule img {
    width: 100%;
    aspect-ratio: var(--hub-main-image-ratio);
    object-fit: cover;
}

.work-hero .info-panel h2,
.work-hero .info-panel h3 {
    margin-top: 0;
}

.info-panel dl > div {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
}

.info-panel dl > div:last-child {
    border-bottom: 0;
}

.info-panel dt {
    color: var(--muted);
    font-weight: 700;
}

.work-hero .info-panel dt,
.work-hero .small-note {
    color: rgba(255, 255, 255, 0.62);
}

.work-hero .info-panel dl > div {
    grid-template-columns: minmax(136px, 40%) minmax(0, 1fr);
    border-bottom-color: rgba(255, 255, 255, 0.28);
}

.work-hero .info-panel > dl:not(.hero-facts),
.work-hero .buy-box {
    display: none;
}

.work-hero .hero-facts > div {
    grid-template-columns: minmax(130px, 46%) minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 10px 0;
}

.work-hero .hero-facts > div:first-child {
    padding-top: 0;
}

.work-hero .hero-facts > div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.work-hero .hero-facts dt {
    min-width: 0;
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.42;
    overflow-wrap: anywhere;
}

.work-hero .hero-facts dd {
    min-width: 0;
    margin: 0;
    color: rgba(255, 255, 255, 0.9);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.42;
    overflow-wrap: anywhere;
    overflow: visible;
}

.hub-genre-value::first-letter {
    text-transform: uppercase;
}

.info-panel dd {
    position: relative;
    margin: 0;
    min-width: 0;
    overflow-wrap: anywhere;
}

.info-row--expandable dd {
    min-width: 0;
    padding-right: 34px;
}

.info-row--expandable:not(.is-expanded) .info-row__value {
    display: block;
    overflow: hidden;
    max-height: 1.55em;
    white-space: nowrap;
}

.info-row--expandable:not(.is-expanded) dd::after {
    content: "";
    position: absolute;
    top: 0;
    right: 24px;
    width: 52px;
    height: 1.7em;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.54) 68%);
}

.info-row__expand {
    position: absolute;
    top: -1px;
    right: 0;
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: rgba(255, 255, 255, 0.88);
    font: inherit;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
}

.info-row.is-expanded dd {
    padding-right: 0;
}

.info-row.is-expanded .info-row__value {
    white-space: normal;
}

.info-row.is-expanded .info-row__expand {
    position: static;
    display: inline-grid;
    margin-left: 8px;
    vertical-align: middle;
}

.small-note {
    color: var(--muted);
    font-size: 15px;
}

.buy-box {
    display: grid;
    gap: 8px;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
}

.work-hero .buy-box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    border-top-color: rgba(255, 255, 255, 0.16);
}

.work-hero .buy-box h3 {
    flex: 0 0 100%;
}

.buy-box h3 {
    margin: 0;
    font-size: 17px;
}

.buy-button {
    display: grid;
    gap: 2px;
    padding: 10px 12px;
    border: 1px solid #b9cfc4;
    border-radius: 8px;
    background: #eef8f2;
    color: var(--green-dark);
    text-decoration: none;
}

.buy-button:hover {
    border-color: var(--green);
    background: #e2f3ea;
}

.buy-button span {
    color: var(--muted);
    font-size: 15px;
}

.store-button {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border: 0;
    background: transparent;
    color: #fff;
    opacity: 0.48;
    text-decoration: none;
    transition: opacity 160ms ease, transform 160ms ease;
}

.store-button:hover {
    opacity: 1;
    transform: translateY(-1px);
}

.store-button svg,
.store-button__icon {
    width: 34px;
    height: 34px;
    font-size: 34px;
    line-height: 1;
    fill: currentColor;
}

.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;
}

.article-body {
    max-width: 820px;
    font-size: var(--font-size-body);
}

.article-body p,
.article-body li,
.article-body blockquote {
    font-size: var(--font-size-body);
}

.hub-wiki {
    max-width: 900px;
}

.article-body h2 {
    margin-top: 28px;
    font-size: 24px;
}

.article-body h3 {
    margin: 22px 0 8px;
    font-size: 20px;
    line-height: 1.3;
}

.article-body h4 {
    margin: 18px 0 8px;
    font-size: 17px;
    line-height: 1.35;
}

.article-body p {
    color: #2d3933;
}

.article-body ul,
.article-body ol {
    margin: 0 0 16px 20px;
    padding: 0;
}

.article-body li {
    margin: 7px 0;
}

.article-body a {
    color: var(--green-dark);
    font-weight: 700;
}

.article-body figure {
    margin: 22px 0;
    overflow: hidden;
    border-radius: 8px;
}

.article-body figure.wiki-inline-media {
    float: left;
    clear: left;
    width: 25%;
    min-width: 190px;
    max-width: 230px;
    margin: 6px 22px 14px 0;
}

.article-body figure.wiki-inline-media--right {
    float: right;
    clear: right;
    margin: 6px 0 14px 22px;
}

.article-body h2,
.article-body h3,
.article-body h4 {
    clear: both;
}

.article-body img {
    display: block;
    width: 100%;
    max-height: 620px;
    border-radius: 8px;
    object-fit: contain;
    background: #f3f5f1;
}

.article-body figcaption {
    margin-top: 8px;
    color: var(--muted);
    font-size: 15px;
}

.article-body figure.wiki-inline-media img {
    aspect-ratio: 16 / 9;
    max-height: none;
    border-radius: 8px;
    object-fit: cover;
    background: #111814;
}

.article-body figure.wiki-inline-media iframe {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    border: 0;
    border-radius: 8px;
    background: #111814;
}

.article-body figure.wiki-inline-media figcaption {
    line-height: 1.35;
    display: block;
    overflow: visible;
}

.article-body figure.wiki-inline-media + p {
    margin-top: 0;
}

.article-body blockquote {
    --quote-edge-gap: 20px;
    --quote-icon-width: 56px;
    position: relative;
    isolation: isolate;
    clear: both;
    margin: clamp(7px, 1vw, 11px) 0;
    padding: clamp(7px, 0.75vw, 9px) clamp(24px, 4vw, 42px) clamp(6px, 0.7vw, 8px) calc(var(--quote-edge-gap) + var(--quote-icon-width) + var(--quote-edge-gap));
    overflow: hidden;
    border: 0;
    background: transparent;
    color: #2d3933;
    font-size: clamp(13px, 1.3vw, 16px);
    font-style: italic;
    font-weight: 500;
    line-height: 1.46;
    text-wrap: pretty;
    box-shadow: none;
}

.article-body blockquote::before {
    content: "\201C";
    position: absolute;
    top: 7px;
    left: var(--quote-edge-gap);
    z-index: -1;
    width: var(--quote-icon-width);
    color: #d9dedb;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(64px, 8vw, 88px);
    font-weight: 900;
    line-height: 1;
    text-shadow: 0 5px 18px rgba(108, 89, 0, 0.12);
}

.article-body blockquote :where(p, li) {
    color: inherit;
    font-size: inherit;
    line-height: inherit;
}

.article-body blockquote > :first-child {
    margin-top: 0;
}

.article-body blockquote > :last-child {
    margin-bottom: 0;
}

.article-body blockquote :where(cite, footer) {
    display: block;
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
    color: #526159;
    font: inherit;
}

.article-body blockquote :where(cite, footer)::before {
    color: var(--green);
    content: "\2014\00a0";
}

@media (max-width: 620px) {
    .article-body blockquote {
        --quote-edge-gap: 13px;
        --quote-icon-width: 32px;
        margin: 6px 0;
        padding: 6px 18px 6px calc(var(--quote-edge-gap) + var(--quote-icon-width) + var(--quote-edge-gap));
        font-size: 13px;
        line-height: 1.5;
    }

    .article-body blockquote::before {
        top: 10px;
        left: var(--quote-edge-gap);
        font-size: 56px;
    }

}

.article-body table {
    width: 100%;
    margin: 18px 0;
    border-collapse: collapse;
    font-size: 15px;
}

.article-body th,
.article-body td {
    padding: 9px 10px;
    border: 1px solid var(--border);
    text-align: left;
    vertical-align: top;
}

.article-body table.wiki-character-table td {
    padding: 7px 10px;
    line-height: 1.36;
    vertical-align: middle;
}

.article-body table.wiki-character-table td:first-child {
    width: clamp(72px, 8vw, 92px);
    padding: 4px 5px;
    vertical-align: middle;
    text-align: center;
}

.article-body table.wiki-character-table td:first-child + td {
    padding-top: 7px;
    padding-bottom: 7px;
}

.article-body table.wiki-character-table img {
    display: block;
    width: auto;
    height: auto;
    max-width: min(78px, 100%);
    max-height: 104px;
    object-fit: contain;
    margin: 0 auto;
    background: transparent;
}

.article-body table.wiki-character-table--job-art td:first-child {
    width: clamp(128px, 22vw, 210px);
}

.article-body table.wiki-character-table--job-art img {
    width: 100%;
    max-width: min(190px, 100%);
    max-height: 132px;
    aspect-ratio: 4 / 3;
    object-fit: contain;
    object-position: 72% center;
    background: transparent;
}

.article-body table.wiki-character-table .wiki-image-lightbox {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    line-height: 0;
    cursor: zoom-in;
}

.article-body figure.wiki-inline-media .wiki-image-lightbox {
    display: block;
    cursor: zoom-in;
}

.article-body table.wiki-character-table strong {
    display: block;
    margin: 0;
    line-height: 1.18;
}

.article-body table.wiki-character-table strong + br {
    display: none;
}

.article-body table.wiki-visual-table td {
    vertical-align: middle;
}

.article-body table.wiki-visual-table td:first-child {
    width: clamp(170px, 31%, 235px);
    padding: 7px;
}

.article-body table.wiki-visual-table img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 6px;
}

@media (min-width: 681px) {
    .article-body table.wiki-visual-table td:first-child {
        width: 154px;
    }

    .article-body table.wiki-visual-table img {
        max-width: 140px;
    }
}

.article-body table.wiki-visual-table .wiki-image-lightbox {
    display: block;
    line-height: 0;
    cursor: zoom-in;
}

.article-body table.wiki-visual-table td:first-child strong {
    display: block;
    margin-top: 7px;
    line-height: 1.25;
}

.youtube-embed {
    width: 100%;
    overflow: hidden;
    border-radius: 8px;
}

.youtube-embed iframe,
.youtube-lite__iframe {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
}

.youtube-lite {
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    aspect-ratio: 16 / 9;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(0,0,0,0.12), rgba(0,0,0,0.42)),
        var(--youtube-thumb, linear-gradient(135deg, #191919, #343434));
    background-size: cover;
    background-position: center;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
}

.youtube-lite__shade {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at center, rgba(0,0,0,0.04), rgba(0,0,0,0.54));
    transition: background 140ms;
}

.youtube-lite:hover .youtube-lite__shade {
    background: radial-gradient(circle at center, rgba(0,0,0,0), rgba(0,0,0,0.46));
}

.youtube-lite__play {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 76px;
    height: 52px;
    border-radius: 14px;
    background: #ff0000;
    color: #fff;
    font-size: 24px;
    line-height: 1;
    filter: drop-shadow(0 8px 18px rgba(0,0,0,0.45));
}

.youtube-lite__play i {
    transform: translateX(2px);
}

.youtube-lite__title {
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 12px;
    z-index: 1;
    color: rgba(255,255,255,0.94);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
    text-align: left;
    text-shadow: 0 1px 6px rgba(0,0,0,0.5);
}

.video-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.media-subheading {
    margin: 28px 0 14px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
}

.media-subheading--first {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.media-subheading h3 {
    margin: 0;
    font-size: 28px;
    line-height: 1.1;
}

.media-frame {
    margin: 0;
    overflow: hidden;
}

.media-frame iframe {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
}

.media-frame > figcaption,
.image-gallery > figure > figcaption,
.youtube-embed > figcaption,
.article-body figure:has(> .youtube-lite) > figcaption {
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0 12px 10px;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.media-frame > figcaption,
.image-gallery > figure > figcaption {
    padding-top: 8px;
}

.image-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.image-gallery.columns-1 { grid-template-columns: 1fr; }
.image-gallery.columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.image-gallery.columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.image-gallery.columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.image-gallery figure {
    margin: 0;
    overflow: hidden;
}

.image-gallery img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.article-body .image-gallery {
    box-sizing: border-box;
    width: 100%;
    margin: 22px auto 26px;
}

.article-body .image-gallery > figure {
    display: flex;
    flex-direction: column;
}

.article-body .image-gallery.columns-2,
.article-body .wiki-image-gallery.columns-2 {
    display: grid;
    box-sizing: border-box;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    width: 100%;
    margin: 22px auto 26px;
    padding-inline: 12px;
}

.article-body .image-gallery.columns-2 figure,
.article-body .wiki-image-gallery.columns-2 figure {
    display: flex;
    flex-direction: column;
}

.article-body .image-gallery.columns-2 img,
.article-body .wiki-image-gallery.columns-2 img {
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 390px;
    margin: 0 auto;
    aspect-ratio: auto;
    object-fit: contain;
}

.article-body .image-gallery > figure.image-gallery__item--portrait-row > .media-lightbox-link {
    display: block;
    overflow: hidden;
    aspect-ratio: 1 / 1;
}

.article-body .image-gallery > figure.image-gallery__item--portrait-row img {
    width: 100%;
    height: 100%;
    max-height: none;
    aspect-ratio: auto;
    object-fit: cover;
}

@media (max-width: 380px) {
    .article-body .image-gallery.columns-2,
    .article-body .wiki-image-gallery.columns-2 {
        width: 100%;
        gap: 8px;
        padding-inline: 8px;
    }

    .media-frame > figcaption,
    .image-gallery > figure > figcaption,
    .youtube-embed > figcaption,
    .article-body figure:has(> .youtube-lite) > figcaption {
        padding: 0 8px 8px;
        font-size: 13px;
    }

    .media-frame > figcaption,
    .image-gallery > figure > figcaption {
        padding-top: 8px;
    }
}

.media-lightbox-link {
    position: relative;
    display: block;
    color: inherit;
    text-decoration: none;
}

.media-lightbox-hidden {
    display: none !important;
}

.media-lightbox-link::after {
    content: "\f00e";
    position: absolute;
    top: 10px;
    right: 10px;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: rgba(0,0,0,0.58);
    color: #fff;
    font-family: "Font Awesome 6 Free";
    font-size: 14px;
    font-weight: 900;
    opacity: 0;
    transform: translateY(-3px);
    transition: opacity 160ms ease, transform 160ms ease, background 160ms ease;
    pointer-events: none;
}

.media-lightbox-link:hover::after {
    opacity: 1;
}

.media-lightbox-link:hover::after {
    transform: translateY(0);
    background: rgba(0,0,0,0.72);
}

.article-body img {
    cursor: zoom-in;
}

.article-body a img,
.article-body [data-fancybox] img {
    cursor: inherit;
}

.community-form,
.reply-form {
    display: grid;
    gap: 8px;
}

.community-form {
    margin: 14px 0 12px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: #fbfcfa;
}

.community-form h3 {
    margin: 0 0 4px;
    font-size: 18px;
}

.community-form button,
.reply-form button {
    justify-self: start;
}

.reply-form {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}

.community-honeypot {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.topic {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 12px;
    padding: 14px 0;
    border-bottom: 1px solid var(--border);
}

.topic:last-child {
    border-bottom: 0;
}

.vote-box {
    display: grid;
    justify-items: center;
    gap: 4px;
}

.vote-box button {
    width: 34px;
    min-height: 30px;
    padding: 0;
}

.reply {
    margin-top: 8px;
    padding: 8px 10px;
    border-left: 3px solid var(--border);
    background: #f8faf7;
}

.reply p {
    margin: 4px 0 0;
}

.topic-strip {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}

.topic-card {
    min-height: 130px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    color: var(--text);
    text-decoration: none;
    box-shadow: var(--shadow);
}

.topic-card strong,
.topic-card span {
    display: block;
}

.topic-card span {
    margin-top: 12px;
    color: var(--muted);
    font-size: 15px;
}

.auth-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
}

input,
textarea,
select {
    width: 100%;
    min-height: 40px;
    padding: 9px 11px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: #fff;
    color: var(--text);
    font: inherit;
}

.check-row {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--muted);
    white-space: nowrap;
}

.check-row input {
    width: auto;
    min-height: auto;
}

label {
    color: var(--text);
    font-weight: 700;
}

.muted {
    color: var(--muted);
}

.alert {
    padding: 10px 12px;
    border-radius: 8px;
}

.alert.error {
    border: 1px solid #efb4ac;
    background: #fff0ee;
    color: var(--red);
}

.alert.success {
    border: 1px solid #b9ddc3;
    background: #ecf8ef;
    color: var(--green-dark);
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.stat-card p {
    margin: 0;
    color: var(--blue);
    font-size: 28px;
    font-weight: 800;
}

.filters,
.action-buttons,
.hero-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.table-wrap {
    overflow-x: auto;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: #fff;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    padding: 10px;
    border-bottom: 1px solid var(--border);
    text-align: left;
    vertical-align: top;
}

.text-danger {
    color: var(--red);
    font-weight: 700;
}

.pagination {
    display: flex;
    justify-content: center;
    gap: 14px;
    padding: 16px 0;
}

@media (min-width: 681px) and (max-width: 1180px) {
    :root {
        --site-header-height: 72px;
        --site-shell-gutter: 20px;
    }

    .site-header__inner {
        grid-template-columns: 42px 50px minmax(150px, auto) minmax(260px, 1fr) auto;
        gap: 10px;
    }

    .brand-logo {
        width: 46px;
        height: 46px;
    }

    .header-primary-nav {
        gap: 0;
    }

    .header-primary-nav a,
    .header-nav-trigger {
        height: 34px;
        padding: 0 6px;
        font-size: 13px;
    }

    .top-search {
        grid-template-columns: 86px 1px minmax(120px, 1fr) 42px;
        min-height: 46px;
        border-radius: 14px;
    }

    .top-search select,
    .top-search input,
    .top-search button {
        min-height: 44px;
        font-size: 14px;
    }

    .top-search select {
        padding-left: 12px;
        padding-right: 22px;
    }

    .lang-switch-btn {
        min-width: 66px;
        min-height: 46px;
        padding: 0 11px;
        font-size: 14px;
    }

    .home-v2-hero {
        min-height: calc(560px + var(--site-header-height) + var(--channel-bar-height) + var(--home-hero-safe-top));
    }

    .home-v2-hero__inner {
        grid-template-columns: minmax(0, 1fr) minmax(190px, 24%);
        column-gap: clamp(20px, 3vw, 42px);
        min-height: 560px;
    }

    .home-v2-hero__meta-panel {
        min-width: 0;
        max-width: 280px;
    }

    .home-v2-hero__meta-panel p,
    .home-v2-hero__lead p {
        font-size: var(--font-size-body);
    }

    .home-v2-news-grid,
    .home-v2-hub-grid,
    .home-v2-update-grid,
    .home-v2-platform-grid,
    .home-v2-franchise-row {
        gap: 12px;
    }

    .home-v2-news-card {
        grid-template-rows: 140px minmax(145px, auto);
    }

    .home-v2-news-card--lead {
        grid-template-rows: 292px minmax(160px, auto);
    }

    .home-v2-news-card div {
        padding: 12px;
    }

    .home-v2-news-card h3 {
        font-size: 18px;
    }

    .home-v2-news-card--lead h3 {
        font-size: 26px;
    }

    .home-v2-news-card small,
    .home-v2-news-card p {
        font-size: 14px;
    }

    .home-v2-platform-card {
        grid-template-columns: 32px minmax(0, 1fr);
        gap: 5px 9px;
        min-height: 98px;
        padding: 12px;
    }

    .home-v2-platform-card i {
        width: 32px;
        height: 32px;
        font-size: 24px;
    }

    .home-v2-platform-card strong {
        font-size: 17px;
    }

    .home-v2-platform-card span,
    .home-v2-franchise-row span {
        font-size: 13px;
    }

    .home-v2-franchise-row a {
        min-height: 0;
        padding: 0;
    }

    .home-v2-franchise-row strong {
        font-size: 16px;
    }

    .home-v2-hub-grid--related .hub-teaser-card--home-v2 {
        grid-template-columns: minmax(82px, 36%) minmax(0, 1fr) 36px;
        min-height: 98px;
        padding: 7px;
    }

    .home-v2-hub-grid--related .hub-teaser-card--home-v2 .hub-teaser-card__title {
        font-size: 14px;
    }

    .home-v2-hub-grid--related .hub-teaser-card--home-v2 .hub-teaser-card__score {
        width: 36px;
        height: 36px;
        font-size: 14px;
    }
}

@media (max-width: 680px) {
    :root {
        --site-header-height: 124px;
    }

    .site-header__inner {
        grid-template-columns: 42px 56px minmax(0, 1fr) auto;
        gap: 12px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .brand {
        grid-column: 2;
    }

    .header-primary-nav {
        display: none;
    }

    .lang-switch-btn {
        display: inline-flex !important;
        grid-column: 4;
        grid-row: 1;
        position: static;
        justify-self: end;
    }

    .language-coming-soon {
        top: 66px;
        right: max(16px, calc((100vw - var(--site-shell-width)) / 2));
    }

    .top-search {
        grid-column: 1 / -1;
        grid-row: 2;
        justify-self: stretch;
        width: 100%;
    }
    .lead-story,
    .split-layout,
    .article-layout,
    .two-col,
    .article-hero__inner {
        grid-template-columns: 1fr;
    }

    .article-next-grid {
        grid-template-columns: 1fr;
    }

    .work-hero__content {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .work-hero__main {
        grid-template-columns: minmax(180px, 240px) minmax(0, 1fr);
    }

    .work-hero .info-panel {
        grid-column: 1 / -1;
    }

    .category-grid,
    .work-grid,
    .video-grid,
    .image-gallery.columns-3,
    .image-gallery.columns-4,
    .image-gallery,
    .topic-strip,
    .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    :root {
        --site-header-height: 124px;
    }

    .topbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .site-header__inner {
        grid-template-columns: 40px 52px minmax(0, 1fr) auto;
        min-height: 70px;
    }

    .brand-logo {
        width: 44px;
        height: 44px;
    }

    .brand strong {
        font-size: 19px;
    }

    .brand small {
        display: none;
    }

    .lang-switch-btn {
        min-width: 64px;
        min-height: 42px;
        padding: 0 10px;
        font-size: 15px;
    }

    .top-search {
        grid-template-columns: 88px 1px minmax(0, 1fr) 42px;
        min-height: 46px;
        border-radius: 14px;
    }

    .top-search select,
    .top-search input,
    .top-search button {
        min-height: 42px;
        font-size: 15px;
    }

    .top-search select {
        padding-left: 12px;
        padding-right: 20px;
    }

    .work-hero__inner {
        width: var(--site-shell-width);
        min-height: 0;
        padding: calc(var(--site-header-height) + var(--channel-bar-height) + 16px) 0 24px;
    }

    .work-hero__content {
        grid-template-columns: minmax(0, 1fr);
        min-height: 0;
    }

    .work-hero__heading,
    .work-hero__summary,
    .work-hero__main,
    .work-hero__summary > p,
    .work-hero .tag-row,
    .work-hero-nav,
    .work-hero .info-panel {
        width: 100%;
        max-width: 100%;
    }

    .work-hero__summary > p {
        font-size: var(--font-size-body);
        line-height: 1.5;
        min-height: 0;
    }

    .work-hero__main {
        grid-template-columns: 1fr;
        grid-template-areas:
            "cover"
            "heading"
            "summary";
        gap: 16px;
    }

    .work-hero__cover {
        width: 100%;
        max-width: 100%;
        height: auto;
    }
    .work-hero h1,
    .article-body h1 {
        font-size: 34px;
        line-height: 1.04;
    }

    .category-grid,
    .work-grid,
    .video-grid,
    .image-gallery.columns-3,
    .image-gallery.columns-4,
    .image-gallery,
    .topic-strip,
    .metric-strip,
    .metric-strip.compact,
    .stats-grid,
    .search-panel {
        grid-template-columns: 1fr;
    }

    .media-list-item,
    .linked-hub-list a {
        grid-template-columns: 1fr;
    }

    .info-panel dl > div {
        grid-template-columns: 1fr;
    }

    .work-hero .info-panel dl > div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .work-hero .info-panel {
        width: 100%;
    }

    .article-layout {
        width: calc(100vw - 28px) !important;
        max-width: calc(100vw - 28px) !important;
        min-width: 0;
        margin-left: auto;
        margin-right: auto;
        padding: 0;
        overflow: hidden;
        grid-template-columns: minmax(0, 1fr);
    }

    .article-hero {
        min-height: calc(260px + var(--site-header-height) + var(--channel-bar-height));
        padding: calc(var(--site-header-height) + var(--channel-bar-height) + 28px) 0 22px;
    }

    .article-hero__inner {
        width: calc(100vw - 28px);
        gap: 18px;
    }

    .article-hero__topline {
        display: grid;
        gap: 10px;
        margin-bottom: 0;
    }

    .article-hero__meta {
        justify-content: flex-start;
    }

    .article-hero h1 {
        font-size: 34px;
        line-height: 1.04;
    }

    .article-hero__copy > p {
        font-size: var(--font-size-body);
    }

    .article-layout > .card,
    .article-layout .article-side,
    .article-body,
    .article-cover,
    .article-reading-queue,
    .article-next-block {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .article-layout > .card {
        padding: 14px;
        overflow: hidden;
    }

    .article-layout > .card h1 {
        font-size: 30px;
        line-height: 1.12;
        overflow-wrap: anywhere;
    }

    .article-layout .lead {
        font-size: var(--font-size-body);
        line-height: 1.45;
        overflow-wrap: anywhere;
    }

    .article-body p,
    .article-body li,
    .article-body a,
    .article-reading-steps__body strong {
        overflow-wrap: anywhere;
    }

    .article-cover img,
    .article-body img,
    .article-body iframe {
        max-width: 100%;
        height: auto;
    }

    .article-body figure.wiki-inline-media {
        float: none;
        width: 100%;
        max-width: none;
        margin: 16px 0;
    }

    .article-body table.wiki-character-table td {
        padding: 6px 8px;
    }

    .article-body table.wiki-character-table td:first-child {
        width: 66px;
        padding: 3px 4px;
    }

    .article-body table.wiki-character-table img {
        max-width: 58px;
        max-height: 82px;
    }

    .article-body table.wiki-character-table .wiki-character-lightbox {
        min-width: 0;
    }

    .article-body table.wiki-visual-table th:first-child,
    .article-body table.wiki-visual-table td:first-child {
        width: 42%;
    }

    .article-body table.wiki-visual-table th,
    .article-body table.wiki-visual-table td {
        padding: 6px;
        font-size: 13px;
    }

    .article-reading-queue {
        padding: 16px;
    }

    .article-reading-steps li {
        grid-template-columns: 30px minmax(0, 1fr);
    }

    .article-reading-steps__body strong {
        font-size: 16px;
        line-height: 1.28;
    }
}

@media (max-width: 520px) {
    .site-header__inner {
        grid-template-columns: 40px 48px minmax(0, 1fr) 62px;
        gap: 8px;
    }

    .lang-switch-btn {
        min-width: 62px;
        padding: 0 9px;
    }

    .top-search {
        grid-template-columns: 78px 1px minmax(0, 1fr) 42px;
    }

    .top-search select {
        padding-left: 10px;
        padding-right: 18px;
    }

    .article-layout {
        width: var(--site-shell-width) !important;
        max-width: var(--site-shell-width) !important;
        margin-left: auto;
        margin-right: auto;
    }
}

/* source: 05-home-retention.css */
/* Home 2: compact, image-led editorial discovery. */
.retention-home {
    --rh-ink: #17201c;
    --rh-muted: #68716b;
    --rh-paper: var(--bg);
    --rh-card: #ffffff;
    --rh-line: rgba(23, 32, 28, 0.15);
    --rh-accent: #0b6147;
    --rh-font-label: 15px;
    --rh-font-meta: 14px;
    --rh-font-compact-title: 17px;
    --rh-font-card-title: 20px;
    --rh-font-section-title: var(--site-section-title-size);
    min-height: 100vh;
    margin-top: calc((var(--site-header-height) + var(--channel-bar-height)) * -1);
    overflow: hidden;
    background: var(--rh-paper);
    color: var(--rh-ink);
}

.retention-home *,
.retention-home *::before,
.retention-home *::after { box-sizing: border-box; }

.rh-shell {
    width: var(--site-shell-width);
    margin-inline: auto;
}

.rh-feature {
    position: relative;
    isolation: isolate;
    padding: calc(var(--site-header-height) + var(--channel-bar-height) + 14px) 0 18px;
    overflow: hidden;
    background: #000;
    color: #fff;
}

.rh-feature-backdrop {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
    filter: saturate(0.78) brightness(0.9);
    transform: none;
    pointer-events: none;
}

.rh-feature::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(
            to bottom,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.03) 78.4%,
            rgba(244, 244, 239, 0.1) 80.8%,
            rgba(244, 244, 239, 0.22) 83.2%,
            rgba(244, 244, 239, 0.35) 85.6%,
            rgba(244, 244, 239, 0.5) 88%,
            rgba(244, 244, 239, 0.65) 90.4%,
            rgba(244, 244, 239, 0.78) 92.8%,
            rgba(244, 244, 239, 0.9) 95.2%,
            rgba(244, 244, 239, 0.97) 97.6%,
            var(--bg) 100%
        ),
        linear-gradient(90deg, rgba(0, 0, 0, 0.7392) 0%, rgba(0, 0, 0, 0.5712) 38%, rgba(0, 0, 0, 0.252) 74%, rgba(0, 0, 0, 0.4704) 100%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.168), rgba(0, 0, 0, 0.6048));
}

.rh-feature-top {
    display: grid;
    grid-template-columns: minmax(0, 1.9fr) minmax(319px, 0.77fr);
    gap: 32px;
    align-items: center;
    min-height: 330px;
}

.rh-feature-top--single { grid-template-columns: 1fr; }

.rh-feature-lead {
    display: flex;
    align-items: flex-end;
    align-self: stretch;
    width: 100%;
    min-width: 0;
    padding-bottom: 10px;
    color: #fff;
    text-decoration: none;
}

.rh-feature-copy {
    width: 100%;
    max-width: none;
    padding: 40px 0 24px;
}

.rh-feature-copy::before {
    content: none;
}

.rh-feature-kicker {
    display: block;
    margin-bottom: 10px;
    color: rgba(255, 255, 255, 0.74);
    font-size: var(--rh-font-label);
    font-weight: 850;
    line-height: 1.1;
    text-transform: uppercase;
}

.rh-feature-copy h1 {
    width: 100%;
    max-width: none;
    margin: 0;
    color: #fff;
    font-size: 46px;
    font-weight: 720;
    line-height: 1.04;
    letter-spacing: 0;
    text-wrap: wrap;
    text-shadow: none;
}

.rh-feature-copy p {
    width: 100%;
    max-width: none;
    margin: 12px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: var(--font-size-body);
    font-weight: 400;
    line-height: 1.42;
    text-shadow: none;
}

.rh-feature-side-news {
    display: grid;
    grid-auto-rows: max-content;
    align-content: center;
    align-self: stretch;
    min-width: 0;
    padding-left: 24px;
    border-left: 1px solid rgba(255, 255, 255, 0.24);
}

.rh-feature-side-news > a {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 124px;
    gap: 16px;
    align-items: center;
    min-width: 0;
    padding: 21px 0;
    color: #fff;
    text-decoration: none;
}

.rh-feature-side-news > a + a {
    border-top: 1px solid rgba(255, 255, 255, 0.22);
}

.rh-feature-side-news > a > span { min-width: 0; }

.rh-feature-side-news strong {
    display: block;
    overflow: visible;
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.22;
}

.rh-feature-side-news figure {
    width: 124px;
    aspect-ratio: 16 / 9;
    margin: 0;
    overflow: hidden;
    border-radius: 7px;
    background: #17231f;
}

.rh-feature-kicker,
.rh-feature-copy h1,
.rh-feature-copy p,
.rh-feature-side-news strong {
    filter:
        drop-shadow(0 0 4.32px rgba(0, 0, 0, 0.588))
        drop-shadow(0 0 12.96px rgba(0, 0, 0, 0.456))
        drop-shadow(0 0 21.6px rgba(0, 0, 0, 0.3));
}

.rh-feature-side-news img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 220ms ease;
}

.rh-feature-side-news a:hover img { transform: scale(1.035); }
.rh-feature-side-news a:hover strong { text-decoration: underline; text-underline-offset: 3px; }

.rh-category-stack {
    margin-top: 22px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.84);
}

.rh-category-carousel {
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    align-items: center;
    margin-top: 0;
    min-height: 58px;
    overflow: hidden;
    background: transparent;
}

.rh-category-carousel__viewport {
    position: relative;
    min-width: 0;
    overflow: hidden;
    contain: paint;
    background: transparent;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.rh-category-carousel__track {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: stretch;
    width: max-content;
    transform: translate3d(0, 0, 0);
    transition: none;
    will-change: transform;
    backface-visibility: hidden;
}

.rh-category-carousel__item {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    min-height: 58px;
    padding: 0 25px;
    justify-content: center;
    color: #fff;
    font-size: 16px;
    font-weight: 650;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
    transition: opacity 180ms ease;
    opacity: 0.72;
}

.rh-category-carousel__label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 4px 7px 5px;
    background: transparent;
    color: #fff;
    line-height: 1;
}

.rh-category-carousel__label i {
    display: inline-grid;
    width: 22px;
    height: 22px;
    place-items: center;
    color: #8fd8ba;
    font-size: 18px;
    line-height: 1;
}

.rh-category-carousel__item.is-current,
.rh-category-carousel__item:not(.is-current) { opacity: 0.72; }
.rh-category-carousel__item:hover,
.rh-category-carousel__item:focus-visible { opacity: 1; }

.rh-category-carousel__arrow {
    position: relative;
    z-index: 2;
    display: grid;
    width: 44px;
    height: 58px;
    padding: 0;
    border: 0;
    place-items: center;
    background: #000;
    color: #8fd8ba;
    font-size: 27px;
    font-weight: 900;
    cursor: pointer;
}

.rh-category-carousel__arrow i {
    -webkit-text-stroke: 1.8px currentColor;
}

.rh-category-carousel__arrow--prev,
.rh-category-carousel__arrow--next { border-radius: 0; }

.rh-category-carousel__arrow:hover { background: #fff; color: #b8efd8; }
.rh-category-carousel__arrow:disabled { color: rgba(143, 216, 186, 0.34); cursor: default; }

.rh-upcoming-events-rail {
    display: grid;
    grid-template-columns: minmax(170px, 0.8fr) repeat(3, minmax(0, 1fr));
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    background: transparent;
}

.rh-upcoming-events-rail__heading,
.rh-upcoming-events-rail__item {
    display: flex;
    min-width: 0;
    min-height: 68px;
    align-items: center;
    padding: 11px 20px;
    color: #fff;
    text-decoration: none;
}

.rh-upcoming-events-rail__heading {
    gap: 9px;
    font-size: 16px;
    font-weight: 700;
}

.rh-upcoming-events-rail__heading i {
    color: #8fd8ba;
    font-size: 18px;
}

.rh-upcoming-events-rail__item {
    flex-direction: column;
    gap: 4px;
    align-items: flex-start;
    justify-content: center;
    border-left: 1px solid rgba(255, 255, 255, 0.1);
}

.rh-upcoming-events-rail__item time {
    color: #8fd8ba;
    font-size: 11px;
    font-weight: 850;
    line-height: 1.25;
    text-transform: uppercase;
}

.rh-upcoming-events-rail__item strong {
    overflow: hidden;
    max-width: 100%;
    color: rgba(255, 255, 255, 0.84);
    font-size: 14px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rh-upcoming-events-rail__heading:hover,
.rh-upcoming-events-rail__heading:focus-visible,
.rh-upcoming-events-rail__item:hover,
.rh-upcoming-events-rail__item:focus-visible {
    background: rgba(255, 255, 255, 0.08);
}

.rh-upcoming-events-rail__item:hover strong,
.rh-upcoming-events-rail__item:focus-visible strong {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.rh-flow { padding: 30px 0 60px; }

.rh-section + .rh-section,
.rh-recent + .rh-section,
.rh-section + .rh-recent { margin-top: 36px; }

.rh-heading { margin: 0 0 16px; }

.rh-heading > span,
.rh-heading > div > span {
    display: block;
    margin-bottom: 4px;
    color: var(--rh-accent);
    font-size: var(--rh-font-label);
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.rh-heading h2 {
    margin: 0;
    color: var(--rh-ink);
    font-size: var(--rh-font-section-title);
    line-height: 1.05;
    letter-spacing: 0;
}

.rh-heading--inline {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
}

.rh-heading--inline button {
    padding: 5px 0;
    border: 0;
    background: transparent;
    color: #c3cbc6;
    font: inherit;
    font-size: var(--rh-font-meta);
    font-weight: 800;
    cursor: pointer;
}

.rh-newsroom {
    padding-top: 0;
}

.rh-newsroom-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
    padding-bottom: 0;
    border-bottom: 0;
}

.rh-newsroom-heading p {
    max-width: 700px;
    margin: 8px 0 0;
    color: var(--rh-muted);
    font-size: 15px;
    line-height: 1.45;
}

.rh-newsroom-heading > div > span {
    margin-bottom: 3px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.035em;
}

.rh-newsroom-heading h2 {
    font-size: 28px;
    font-weight: 700;
}

.rh-article-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin: 0 0 22px;
    padding: 0;
}

.rh-article-filters a {
    position: relative;
    display: inline-flex;
    min-width: 52px;
    height: 52px;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: var(--rh-muted);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: max-width 220ms ease, border-color 160ms ease, background 160ms ease, color 160ms ease;
}

.rh-article-filters a > i {
    color: currentColor;
    font-size: 22px;
    opacity: 0.74;
    transition: opacity 160ms ease;
}

.rh-article-filters a > span {
    white-space: nowrap;
}

.rh-article-filters .rh-article-filter--all {
    gap: 9px;
    padding: 0 14px;
    background: transparent;
    color: var(--rh-ink);
}

.rh-article-filters .rh-article-filter--all > i { color: var(--rh-accent); }

.rh-article-filters .rh-article-filter--section {
    justify-content: flex-start;
    max-width: 52px;
    padding: 0;
    overflow: hidden;
    color: var(--rh-ink);
}

.rh-article-filters .rh-article-filter--section > i {
    display: grid;
    width: 50px;
    flex: 0 0 50px;
    place-items: center;
}

.rh-article-filters .rh-article-filter--section > span {
    padding-right: 15px;
    opacity: 0;
    transform: translateX(-5px);
    transition: opacity 150ms ease, transform 180ms ease;
}

.rh-article-filters .rh-article-filter--section:hover,
.rh-article-filters .rh-article-filter--section:focus-visible {
    max-width: 190px;
    background: transparent;
    color: var(--rh-accent);
}

.rh-article-filters .rh-article-filter--section:hover > span,
.rh-article-filters .rh-article-filter--section:focus-visible > span {
    opacity: 1;
    transform: translateX(0);
}

.rh-article-filters .rh-article-filter--all:hover {
    background: transparent;
    color: var(--rh-accent);
}

.rh-article-filters a:focus-visible {
    outline: 2px solid rgba(11, 97, 71, 0.24);
    outline-offset: 1px;
}

.rh-article-filters a:hover > i,
.rh-article-filters a:focus-visible > i,
.rh-article-filters a.is-active > i { opacity: 1; }

.rh-article-filters a.is-active {
    color: var(--rh-accent);
    font-weight: 800;
}

.rh-article-filters .rh-article-filter--all.is-active {
    background: transparent;
    color: var(--rh-accent);
}

.rh-article-filters .rh-article-filter--section.is-active { color: var(--rh-accent); }

.rh-article-filters a::after {
    position: absolute;
    bottom: 3px;
    left: 50%;
    width: 4px;
    height: 4px;
    border-radius: 999px;
    background: var(--rh-accent);
    content: "";
    opacity: 0;
    transform: translateX(-50%);
    transition: opacity 140ms ease;
}

.rh-article-filters .rh-article-filter--section::after {
    left: 25px;
}

.rh-article-filters a:hover::after,
.rh-article-filters a:focus-visible::after,
.rh-article-filters a.is-active::after {
    opacity: 0.72;
}

.rh-newsroom-entity-layout .entity-article-card__image .news-visual-fallback {
    width: 100%;
    height: 100%;
    border-radius: inherit;
}

.rh-article-card__meta {
    display: flex !important;
    gap: 8px;
    margin: 0 0 7px !important;
    color: var(--rh-accent) !important;
    font-size: 12px !important;
    font-weight: 800;
    line-height: 1.2 !important;
    text-transform: uppercase;
    -webkit-line-clamp: unset !important;
}

.rh-article-card__meta time {
    padding-left: 8px;
    border-left: 1px solid var(--rh-line);
    color: var(--rh-muted);
}

.rh-article-pagination {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 12px;
    align-items: center;
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--rh-line);
}

.rh-article-pagination a {
    display: inline-flex;
    gap: 8px;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 9px 14px;
    border: 1px solid var(--rh-line);
    border-radius: 9px;
    color: var(--rh-ink);
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
}

.rh-article-pagination a:last-child { justify-self: end; }
.rh-article-pagination .is-previous { grid-column: 1; }
.rh-article-pagination strong { grid-column: 2; }
.rh-article-pagination .is-next { grid-column: 3; }
.rh-article-pagination a:hover,
.rh-article-pagination a:focus-visible { border-color: var(--rh-accent); color: var(--rh-accent); }
.rh-article-pagination strong { color: var(--rh-muted); font-size: 12px; text-align: center; }

.rh-newsroom-archive {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: fit-content;
    min-height: 48px;
    margin-top: 24px;
    padding: 11px 18px 11px 20px;
    border: 1px solid rgba(0, 92, 67, 0.18);
    border-radius: 10px;
    background: linear-gradient(135deg, var(--rh-accent), #084f3b);
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(0, 92, 67, 0.16);
    transition: box-shadow 180ms ease, transform 180ms ease;
}

.rh-newsroom-archive:hover {
    box-shadow: 0 14px 30px rgba(0, 92, 67, 0.24);
    transform: translateY(-2px);
}

.rh-newsroom-archive i {
    color: #ffd500;
    transition: transform 180ms ease;
}

.rh-newsroom-archive:hover i { transform: translateX(3px); }

.rh-newsroom-entity-layout {
    font-family: "Open Sans", Arial, sans-serif;
}

.rh-newsroom-entity-layout .entity-article-card,
.rh-newsroom-entity-layout .entity-hub-card {
    font-family: inherit;
}

.rh-newsroom-entity-layout .entity-article-card {
    grid-template-columns: 260px minmax(0, 1fr);
}

.rh-newsroom-entity-layout .entity-article-card__image {
    width: 260px;
    height: 150px;
}

.rh-newsroom-entity-layout .entity-article-card:nth-child(4n + 1) {
    grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.1fr);
    gap: 24px;
    padding-bottom: 24px;
}

.rh-newsroom-entity-layout .entity-article-card:nth-child(4n + 1) .entity-article-card__image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}

@media (max-width: 760px) {
    .rh-newsroom-entity-layout .entity-article-card:nth-child(4n + 1) {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .rh-newsroom-entity-layout .entity-article-card,
    .rh-newsroom-entity-layout .entity-article-card:nth-child(4n + 1) {
        grid-template-columns: 112px minmax(0, 1fr);
        gap: 14px;
    }

    .rh-newsroom-entity-layout .entity-article-card__image,
    .rh-newsroom-entity-layout .entity-article-card:nth-child(4n + 1) .entity-article-card__image {
        width: 112px;
        height: 72px;
        aspect-ratio: auto;
    }
}

@media (max-width: 480px) {
    .rh-latest .entity-article-card__description { display: inline; }
    .rh-article-pagination { grid-template-columns: 1fr 1fr; }
    .rh-article-pagination strong { grid-column: 1 / -1; grid-row: 1; }
    .rh-article-pagination .is-previous { grid-column: 1; grid-row: 2; }
    .rh-article-pagination .is-next { grid-column: 2; grid-row: 2; justify-self: stretch; }
    .rh-article-pagination a { width: auto; }
}

.rh-newsroom-discovery {
    display: grid;
    gap: 18px;
}

.rh-sidebar-editorial {
    overflow: hidden;
    border: 1px solid var(--rh-line);
    border-radius: 10px;
    background: var(--rh-card);
    box-shadow: 0 12px 28px rgba(7, 18, 14, 0.08);
}

.rh-sidebar-editorial__heading {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 14px;
    border-bottom: 1px solid var(--rh-line);
    color: var(--rh-ink);
    text-decoration: none;
}

.rh-sidebar-editorial__heading > span {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
}

.rh-sidebar-editorial__heading .site-category-icon,
.rh-sidebar-editorial__heading > span > i {
    color: var(--rh-accent);
    font-size: 15px;
}

.rh-newsroom-discovery .rh-sidebar-editorial__heading strong {
    color: var(--rh-ink);
    font-size: 17px;
    font-weight: 850;
    line-height: 1.15;
    text-shadow: none;
}

.rh-sidebar-editorial__heading > i:last-child {
    flex: 0 0 auto;
    color: var(--rh-muted);
    font-size: 12px;
}

.rh-sidebar-editorial__heading:hover,
.rh-sidebar-editorial__heading:focus-visible {
    background: #f2f7f3;
}

.rh-sidebar-events {
    display: grid;
    padding: 3px 14px 7px;
}

.rh-sidebar-events > a {
    display: grid;
    gap: 3px;
    padding: 10px 0;
    border-bottom: 1px solid var(--rh-line);
    color: var(--rh-ink);
    text-decoration: none;
}

.rh-sidebar-events > a:last-child { border-bottom: 0; }

.rh-sidebar-events time {
    color: var(--rh-accent);
    font-size: 14px;
    font-weight: 850;
    line-height: 1.25;
    text-transform: uppercase;
}

.rh-newsroom-discovery .rh-sidebar-events strong {
    color: var(--rh-ink);
    font-size: 14px;
    line-height: 1.25;
    text-shadow: none;
}

.rh-sidebar-stories {
    display: grid;
    padding: 3px 14px 7px;
}

.rh-sidebar-stories > a {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-height: 68px;
    padding: 9px 0;
    border-bottom: 1px solid var(--rh-line);
    color: var(--rh-ink);
    text-decoration: none;
}

.rh-sidebar-stories > a:last-child { border-bottom: 0; }

.rh-sidebar-stories figure {
    position: relative;
    width: 82px;
    aspect-ratio: 16 / 10;
    margin: 0;
    overflow: hidden;
    border-radius: 6px;
    background: #dce1dd;
}

.rh-newsroom-discovery .rh-sidebar-stories img {
    position: static;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 220ms ease;
}

.rh-newsroom-discovery .rh-sidebar-stories strong {
    display: -webkit-box;
    overflow: hidden;
    color: var(--rh-ink);
    font-size: 14px;
    line-height: 1.28;
    text-shadow: none;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.rh-sidebar-events > a:hover strong,
.rh-sidebar-events > a:focus-visible strong,
.rh-sidebar-stories > a:hover strong,
.rh-sidebar-stories > a:focus-visible strong {
    color: var(--rh-accent);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.rh-sidebar-stories > a:hover img,
.rh-sidebar-stories > a:focus-visible img {
    transform: scale(1.035);
}

.rh-sidebar-editorial__empty {
    display: block !important;
    grid-template-columns: minmax(0, 1fr) !important;
    min-height: 0 !important;
    color: var(--rh-muted) !important;
    font-size: 13px;
    font-weight: 700;
}

.rh-newsroom-discovery > a {
    position: relative;
    isolation: isolate;
    display: grid;
    min-height: 224px;
    overflow: hidden;
    border-radius: 10px;
    background: #111b18;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(7, 18, 14, 0.13);
}

.rh-newsroom-discovery > a::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(180deg, transparent 0%, transparent 40%, rgba(4, 10, 8, 0.58) 64%, rgba(4, 10, 8, 0.98) 100%);
    content: "";
}

.rh-newsroom-discovery img {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 320ms ease, filter 220ms ease;
}

.rh-newsroom-discovery .rh-sidebar-company-card .article-side-franchise-card__media img {
    position: static;
    z-index: auto;
    inset: auto;
    filter: none;
}

.rh-newsroom-discovery .rh-sidebar-company-card .article-side-franchise-card__copy strong {
    text-shadow: none;
}

.rh-newsroom-discovery .rh-sidebar-company-card .article-side-franchise-card__copy small {
    letter-spacing: normal;
    text-transform: none;
}

.rh-newsroom-discovery .rh-sidebar-company-card:hover .article-side-franchise-card__media img,
.rh-newsroom-discovery .rh-sidebar-company-card:focus-visible .article-side-franchise-card__media img {
    filter: none;
    transform: none;
}

.rh-newsroom-discovery > a:first-of-type img { object-position: center 40%; }

.rh-newsroom-discovery > a > span {
    position: relative;
    z-index: 2;
    align-self: end;
    display: grid;
    gap: 4px;
    padding: 26px 20px 18px;
}

.rh-newsroom-discovery small {
    color: #ffd500;
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.rh-newsroom-discovery strong {
    font-size: 24px;
    line-height: 1.08;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.7);
}

.rh-newsroom-discovery__latest {
    display: -webkit-box;
    max-width: 100%;
    margin-top: 5px;
    overflow: hidden;
    color: rgba(255, 255, 255, 0.88);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.32;
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.78);
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.rh-newsroom-discovery__latest > i {
    margin-right: 6px;
    color: #8fd8ba;
}

.rh-newsroom-discovery > a:hover img {
    filter: saturate(1.08);
    transform: scale(1.035);
}

.rh-reader-guide,
.rh-sidebar-roundup,
.rh-sidebar-collections {
    overflow: hidden;
    border: 1px solid var(--rh-line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(7, 18, 14, 0.06);
}

.rh-reader-guide {
    padding: 20px;
    background:
        radial-gradient(circle at 100% 0%, rgba(11, 107, 71, 0.09), transparent 38%),
        #f4f6f2;
}

.rh-reader-guide__header,
.rh-sidebar-section-heading {
    display: grid;
    gap: 4px;
}

.rh-reader-guide__header > span,
.rh-sidebar-section-heading > span {
    color: var(--rh-accent);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.045em;
    line-height: 1.2;
    text-transform: uppercase;
}

.rh-reader-guide__header h2,
.rh-sidebar-section-heading h2 {
    margin: 0;
    color: var(--rh-ink);
    font-size: 26px;
    font-weight: 850;
    letter-spacing: -0.025em;
    line-height: 1.05;
}

.rh-reader-guide__header p {
    margin: 4px 0 0;
    color: var(--rh-muted);
    font-size: 14px;
    line-height: 1.45;
}

.rh-reader-guide__search {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) 38px;
    gap: 9px;
    align-items: center;
    min-height: 50px;
    margin-top: 16px;
    padding: 5px 6px 5px 15px;
    border: 1px solid rgba(13, 82, 58, 0.22);
    border-radius: 999px;
    background: #fff;
    transition: border-color 180ms ease, box-shadow 180ms ease;
}

.rh-reader-guide > .rh-reader-guide__search:first-child {
    margin-top: 0;
}

.rh-reader-guide__search:focus-within {
    border-color: var(--rh-accent);
    box-shadow: 0 0 0 3px rgba(11, 107, 71, 0.1);
}

.rh-reader-guide__search > i {
    color: var(--rh-accent);
    font-size: 14px;
}

.rh-reader-guide__search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--rh-ink);
    font: inherit;
    font-size: 13px;
    font-weight: 700;
}

.rh-reader-guide__search input::placeholder {
    color: #7b827e;
    opacity: 1;
}

.rh-reader-guide__search button {
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: var(--rh-accent);
    color: #fff;
    cursor: pointer;
    transition: background 180ms ease, transform 180ms ease;
}

.rh-reader-guide__search button:hover,
.rh-reader-guide__search button:focus-visible {
    background: #084d35;
    transform: translateX(2px);
}

.rh-reader-guide__paths {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.rh-reader-path {
    --rh-reader-path-color: #0b6b47;
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(17, 17, 17, 0.11);
    border-top: 3px solid var(--rh-reader-path-color);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.92);
}

.rh-reader-path--genre { --rh-reader-path-color: #9e8900; }
.rh-reader-path--feature { --rh-reader-path-color: #0b6b47; }
.rh-reader-path--origin { --rh-reader-path-color: #14788c; }
.rh-reader-path--release { --rh-reader-path-color: #2f6f9d; }

.rh-reader-path__heading {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
    align-items: start;
    color: var(--rh-ink);
    text-decoration: none;
}

.rh-reader-path__heading > i:first-child {
    margin-top: 2px;
    color: var(--rh-reader-path-color);
    font-size: 15px;
}

.rh-reader-path__heading > i:last-child {
    margin-top: 4px;
    color: var(--rh-reader-path-color);
    font-size: 10px;
    transition: transform 180ms ease;
}

.rh-reader-path__heading:hover > i:last-child,
.rh-reader-path__heading:focus-visible > i:last-child {
    transform: translateX(3px);
}

.rh-newsroom-discovery .rh-reader-path__heading strong {
    display: block;
    color: var(--rh-ink);
    font-size: 15px;
    font-weight: 850;
    line-height: 1.15;
    text-shadow: none;
}

.rh-newsroom-discovery .rh-reader-path__heading small {
    display: block;
    margin-top: 3px;
    color: var(--rh-muted);
    font-size: 10px;
    font-weight: 650;
    letter-spacing: 0;
    line-height: 1.25;
    text-transform: none;
}

.rh-reader-path nav {
    display: flex;
    gap: 5px;
    margin-top: 10px;
    flex-wrap: wrap;
}

.rh-reader-path nav a {
    padding: 4px 7px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--rh-reader-path-color) 8%, #fff);
    color: #4c5550;
    font-size: 10px;
    font-weight: 750;
    line-height: 1.2;
    text-decoration: none;
}

.rh-reader-path nav a:hover,
.rh-reader-path nav a:focus-visible {
    background: var(--rh-reader-path-color);
    color: #fff;
}

.rh-sidebar-roundup,
.rh-sidebar-collections {
    padding: 18px;
}

.rh-sidebar-section-heading {
    padding-bottom: 14px;
    border-bottom: 1px solid var(--rh-line);
}

.rh-sidebar-section-heading h2 {
    font-size: 23px;
}

.rh-sidebar-popular__lead {
    position: relative;
    display: grid;
    overflow: hidden;
    border-radius: 10px;
    background: #111b18;
    color: #fff;
    text-decoration: none;
    isolation: isolate;
}

.rh-sidebar-popular__lead figure {
    position: static;
    aspect-ratio: 200 / 81;
    margin: 0;
    overflow: visible;
    background: #111b18;
}

.rh-newsroom-discovery .rh-sidebar-popular__lead img {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 260ms ease, filter 180ms ease;
}

.rh-sidebar-popular__lead > span {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 5px;
    margin-top: -88px;
    padding: 100px 14px 15px;
    background: linear-gradient(
        to bottom,
        rgba(17, 27, 24, 0) 0,
        rgba(17, 27, 24, 0.08) 20px,
        rgba(17, 27, 24, 0.22) 42px,
        rgba(17, 27, 24, 0.46) 68px,
        rgba(17, 27, 24, 0.7) 100px,
        rgba(17, 27, 24, 0.9) 120px,
        rgba(17, 27, 24, 0.98) 150px,
        #111b18 100%
    );
}

.rh-newsroom-discovery .rh-sidebar-popular__lead small,
.rh-newsroom-discovery .rh-sidebar-popular__list small {
    color: #8fd8ba;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.045em;
    line-height: 1.2;
    text-transform: uppercase;
}

.rh-newsroom-discovery .rh-sidebar-popular__lead strong {
    display: block;
    overflow: visible;
    color: #fff;
    font-size: 19px;
    font-weight: 850;
    line-height: 1.18;
    text-shadow: none;
}

.rh-sidebar-popular__lead:hover img,
.rh-sidebar-popular__lead:focus-visible img {
    filter: saturate(1.08);
    transform: scale(1.035);
}

.rh-sidebar-popular__list {
    display: grid;
    margin-top: 5px;
}

.rh-sidebar-popular__list > a {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 3px 12px;
    padding: 12px 2px;
    border-bottom: 1px solid var(--rh-line);
    color: var(--rh-ink);
    text-decoration: none;
}

.rh-sidebar-popular__list > a:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.rh-sidebar-popular__list > a small {
    grid-column: 1;
}

.rh-newsroom-discovery .rh-sidebar-popular__list strong {
    grid-column: 1;
    color: var(--rh-ink);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
    text-shadow: none;
}

.rh-sidebar-popular__list > a > i {
    grid-column: 2;
    grid-row: 1 / 3;
    align-self: center;
    color: var(--rh-accent);
    font-size: 11px;
    transition: transform 180ms ease;
}

.rh-sidebar-popular__list > a:hover strong,
.rh-sidebar-popular__list > a:focus-visible strong {
    color: var(--rh-accent);
    text-decoration: underline;
    text-decoration-color: rgba(11, 107, 71, 0.3);
    text-underline-offset: 2px;
}

.rh-sidebar-popular__list > a:hover > i,
.rh-sidebar-popular__list > a:focus-visible > i {
    transform: translateX(3px);
}

.rh-sidebar-popular {
    display: grid;
    gap: 12px;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.rh-sidebar-flow {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.rh-sidebar-popular__lead[data-news-section="economy"] small { color: #efd86c; }
.rh-sidebar-popular__lead[data-news-section="sports"] small { color: #82df9d; }
.rh-sidebar-popular__lead[data-news-section="innovation"] small { color: #78dced; }
.rh-sidebar-popular__lead[data-news-section="society"] small { color: #ff9b91; }
.rh-sidebar-popular__list > a[data-news-section="economy"] small { color: #756000; }
.rh-sidebar-popular__list > a[data-news-section="sports"] small { color: #08783e; }
.rh-sidebar-popular__list > a[data-news-section="innovation"] small { color: #087184; }
.rh-sidebar-popular__list > a[data-news-section="society"] small { color: #b33b34; }

.rh-sidebar-shortcuts {
    display: grid;
    gap: 12px;
}

.rh-sidebar-shortcut {
    --rh-shortcut-accent: #0b6b47;
    --rh-shortcut-tint: rgba(11, 107, 71, 0.08);
    position: relative;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    align-content: end;
    align-items: start;
    min-height: 124px;
    overflow: hidden;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--rh-shortcut-accent) 42%, rgba(255, 255, 255, 0.32));
    border-radius: 11px;
    background: #111916;
    color: #fff;
    text-decoration: none;
    isolation: isolate;
    transition: border-color 180ms ease, transform 180ms ease;
}

.rh-sidebar-shortcut::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(0, 0, 0, 0.7392) 0%,
            rgba(0, 0, 0, 0.5712) 38%,
            rgba(0, 0, 0, 0.252) 74%,
            rgba(0, 0, 0, 0.4704) 100%
        ),
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.168),
            rgba(0, 0, 0, 0.6048)
        );
    content: "";
    pointer-events: none;
}

.rh-sidebar-shortcut__image {
    object-position: center;
    filter: saturate(0.78) brightness(0.9);
}

.rh-sidebar-shortcut__icon {
    position: relative;
    z-index: 2;
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 0;
    background: transparent;
    color: #fff;
    font-size: 26px;
}

.rh-sidebar-shortcut > span {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 0 6px;
}

.rh-newsroom-discovery .rh-sidebar-shortcut strong {
    order: 2;
    display: block;
    margin-top: 5px;
    color: #fff;
    font-size: 23px;
    font-weight: 850;
    line-height: 1.05;
    text-shadow: none;
}

.rh-newsroom-discovery .rh-sidebar-shortcut small {
    order: 1;
    display: block;
    margin: 0;
    overflow: visible;
    color: var(--brand-yellow, #f5df2e);
    font-size: 14px;
    font-weight: 650;
    letter-spacing: 0;
    line-height: 1.08;
    text-overflow: clip;
    text-transform: none;
    white-space: normal;
}

.rh-sidebar-shortcut__icon,
.rh-newsroom-discovery .rh-sidebar-shortcut strong,
.rh-newsroom-discovery .rh-sidebar-shortcut small {
    filter:
        drop-shadow(0 0 4.32px rgba(0, 0, 0, 0.588))
        drop-shadow(0 0 12.96px rgba(0, 0, 0, 0.456))
        drop-shadow(0 0 21.6px rgba(0, 0, 0, 0.3));
}

.rh-sidebar-shortcut__arrow {
    position: relative;
    z-index: 2;
    align-self: center;
    margin-top: 0;
    color: #fff;
    font-size: 10px;
    transition: transform 180ms ease;
}

.rh-sidebar-shortcut:hover,
.rh-sidebar-shortcut:focus-visible {
    border-color: var(--rh-shortcut-accent);
    transform: translateY(-1px);
}

.rh-sidebar-shortcut:hover .rh-sidebar-shortcut__image,
.rh-sidebar-shortcut:focus-visible .rh-sidebar-shortcut__image {
    filter: saturate(0.9) brightness(0.94);
    transform: scale(1.035);
}

.rh-sidebar-shortcut:hover .rh-sidebar-shortcut__arrow,
.rh-sidebar-shortcut:focus-visible .rh-sidebar-shortcut__arrow {
    transform: translateX(3px);
}

.rh-sidebar-shortcut--brazil { --rh-shortcut-accent: #0b7551; --rh-shortcut-tint: rgba(11, 117, 81, 0.1); }
.rh-sidebar-shortcut--mmorpg { --rh-shortcut-accent: #806a00; --rh-shortcut-tint: rgba(245, 210, 35, 0.15); }
.rh-sidebar-shortcut--free { --rh-shortcut-accent: #087184; --rh-shortcut-tint: rgba(120, 220, 237, 0.15); }
.rh-sidebar-shortcut--release { --rh-shortcut-accent: #9d5b09; --rh-shortcut-tint: rgba(226, 147, 44, 0.13); }
.rh-sidebar-shortcut--open-world { --rh-shortcut-accent: #08783e; --rh-shortcut-tint: rgba(130, 223, 157, 0.14); }
.rh-sidebar-shortcut--japan { --rh-shortcut-accent: #b33b34; --rh-shortcut-tint: rgba(255, 155, 145, 0.14); }
.rh-sidebar-shortcut--action { --rh-shortcut-accent: #9c5c00; --rh-shortcut-tint: rgba(255, 194, 71, 0.14); }
.rh-sidebar-shortcut--rpg { --rh-shortcut-accent: #6548b4; --rh-shortcut-tint: rgba(126, 94, 205, 0.12); }

.rh-sidebar-manga {
    min-width: 0;
}

.rh-newsroom-discovery .rh-sidebar-manga .genre-manga-promo {
    position: static;
    top: auto;
    width: 100%;
}

.rh-sidebar-roundup__list {
    display: grid;
}

.rh-sidebar-roundup__item {
    display: grid;
    gap: 8px;
    padding: 13px 0;
    border-bottom: 1px solid var(--rh-line);
}

.rh-sidebar-roundup__item:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.rh-sidebar-roundup__section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: var(--rh-accent);
    font-size: 12px;
    font-weight: 850;
    text-decoration: none;
}

.rh-sidebar-roundup__section > span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.rh-sidebar-roundup__section > i:last-child {
    font-size: 10px;
    transition: transform 180ms ease;
}

.rh-sidebar-roundup__section:hover > i:last-child,
.rh-sidebar-roundup__section:focus-visible > i:last-child {
    transform: translateX(3px);
}

.rh-sidebar-roundup__story {
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr);
    gap: 11px;
    align-items: center;
    color: var(--rh-ink);
    text-decoration: none;
}

.rh-sidebar-roundup__story figure {
    width: 86px;
    aspect-ratio: 16 / 10;
    margin: 0;
    overflow: hidden;
    border-radius: 7px;
    background: #dce1dd;
}

.rh-newsroom-discovery .rh-sidebar-roundup__story img {
    position: static;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 220ms ease;
}

.rh-newsroom-discovery .rh-sidebar-roundup__story strong {
    display: -webkit-box;
    overflow: hidden;
    color: var(--rh-ink);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
    text-shadow: none;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.rh-sidebar-roundup__story:hover strong,
.rh-sidebar-roundup__story:focus-visible strong {
    color: var(--rh-accent);
    text-decoration: underline;
    text-decoration-color: rgba(11, 107, 71, 0.3);
    text-underline-offset: 2px;
}

.rh-sidebar-roundup__story:hover img,
.rh-sidebar-roundup__story:focus-visible img {
    transform: scale(1.04);
}

.rh-sidebar-collections__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 14px;
}

.rh-sidebar-collections__grid > a {
    position: relative;
    isolation: isolate;
    display: grid;
    min-width: 0;
    min-height: 118px;
    overflow: hidden;
    border-radius: 9px;
    background: #111b18;
    color: #fff;
    text-decoration: none;
}

.rh-sidebar-collections__grid > a:first-child {
    grid-column: 1 / -1;
    min-height: 152px;
}

.rh-sidebar-collections__grid > a::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(180deg, rgba(4, 10, 8, 0.05) 15%, rgba(4, 10, 8, 0.9) 100%);
    content: "";
}

.rh-newsroom-discovery .rh-sidebar-collections__grid img {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 260ms ease, filter 180ms ease;
}

.rh-sidebar-collections__grid > a > span {
    position: relative;
    z-index: 2;
    align-self: end;
    display: grid;
    gap: 2px;
    padding: 28px 11px 10px;
}

.rh-newsroom-discovery .rh-sidebar-collections__grid small {
    overflow: hidden;
    color: #f5df2e;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.rh-newsroom-discovery .rh-sidebar-collections__grid strong {
    display: -webkit-box;
    overflow: hidden;
    color: #fff;
    font-size: 15px;
    font-weight: 850;
    line-height: 1.12;
    text-shadow: 0 2px 7px rgba(0, 0, 0, 0.75);
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.rh-sidebar-collections__grid > a:hover img,
.rh-sidebar-collections__grid > a:focus-visible img {
    filter: saturate(1.08);
    transform: scale(1.045);
}

@media (max-width: 1120px) and (min-width: 981px) {
    .rh-reader-guide__paths {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .rh-reader-guide,
    .rh-sidebar-roundup,
    .rh-sidebar-collections {
        padding: 15px;
    }

    .rh-reader-guide__paths {
        grid-template-columns: 1fr;
    }
}

.rh-hub-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.rh-hub-grid > a {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--rh-line);
    border-radius: 8px;
    background: var(--rh-card);
    color: var(--rh-ink);
    text-decoration: none;
}

.rh-hub-grid figure {
    aspect-ratio: 920 / 430;
    margin: 0;
    overflow: hidden;
    background: #dce1dd;
}

.rh-hub-grid img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 260ms ease;
}

.rh-hub-grid a:hover img { transform: scale(1.025); }
.rh-hub-grid > a > div { padding: 13px 14px 14px; }

.rh-hub-grid small {
    color: var(--rh-accent);
    font-size: var(--rh-font-label);
    font-weight: 900;
    text-transform: uppercase;
}

.rh-hub-grid h3 {
    display: block;
    margin: 5px 0 8px;
    color: var(--rh-ink);
    font-size: 20px;
    line-height: 1.08;
    letter-spacing: 0;
    overflow-wrap: anywhere;
}

.rh-hub-grid div > span { display: block; color: var(--rh-muted); font-size: var(--rh-font-label); font-weight: 650; line-height: 1.3; }

.rh-catalog-explorer {
    padding: clamp(16px, 2.4vw, 24px);
    border: 1px solid var(--rh-line);
    border-radius: 10px;
    background: #eef1ed;
}

.rh-catalog-explorer > .rh-heading {
    gap: 18px;
    align-items: end;
    margin-bottom: 16px;
}

.rh-catalog-explorer > .rh-heading > a {
    display: inline-flex;
    gap: 8px;
    min-height: 38px;
    align-items: center;
    padding: 0 13px;
    border: 1px solid rgba(13, 82, 58, 0.2);
    border-radius: 999px;
    background: #fff;
    color: var(--rh-accent);
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
}

.rh-catalog-explorer > .rh-heading > a:hover,
.rh-catalog-explorer > .rh-heading > a:focus-visible {
    border-color: var(--rh-accent);
    background: var(--rh-accent);
    color: #fff;
}

.rh-catalog-explorer__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.rh-catalog-explorer__group {
    --rh-taxonomy-color: #0b6b47;
    display: grid;
    align-content: start;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(17, 17, 17, 0.13);
    border-top: 4px solid var(--rh-taxonomy-color);
    border-radius: 9px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(16, 24, 20, 0.035);
}

.rh-catalog-explorer__group--genre { --rh-taxonomy-color: #b59d00; }
.rh-catalog-explorer__group--feature { --rh-taxonomy-color: #0b6b47; }
.rh-catalog-explorer__group--origin { --rh-taxonomy-color: #14788c; }
.rh-catalog-explorer__group--release { --rh-taxonomy-color: #2f6f9d; }

.rh-catalog-explorer__heading {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    padding: 14px 15px 8px;
    color: var(--rh-ink);
    text-decoration: none;
}

.rh-catalog-explorer__heading > span {
    display: inline-flex;
    gap: 9px;
    align-items: center;
    min-width: 0;
}

.rh-catalog-explorer__heading i {
    color: var(--rh-taxonomy-color);
}

.rh-catalog-explorer__heading strong {
    font-size: 20px;
    line-height: 1.1;
}

.rh-catalog-explorer__group > p {
    margin: 0;
    padding: 0 15px 12px;
    color: var(--rh-muted);
    font-size: 13px;
    line-height: 1.35;
}

.rh-catalog-explorer__group nav {
    display: grid;
    border-top: 1px solid var(--rh-line);
}

.rh-catalog-explorer__group nav a {
    display: flex;
    gap: 10px;
    min-width: 0;
    min-height: 46px;
    align-items: center;
    justify-content: space-between;
    padding: 8px 15px;
    border-bottom: 1px solid var(--rh-line);
    color: var(--rh-ink);
    text-decoration: none;
}

.rh-catalog-explorer__group nav a:last-child {
    border-bottom: 0;
}

.rh-catalog-explorer__group nav a:hover,
.rh-catalog-explorer__group nav a:focus-visible {
    background: color-mix(in srgb, var(--rh-taxonomy-color) 7%, #fff);
}

.rh-catalog-explorer__group nav strong {
    min-width: 0;
    font-size: 14px;
    line-height: 1.2;
}

.rh-catalog-explorer__group nav span {
    flex: 0 0 auto;
    color: var(--rh-muted);
    font-size: 11px;
    font-weight: 750;
    white-space: nowrap;
}

.rh-catalog-explorer--sidebar {
    padding: 16px;
}

.rh-catalog-explorer--sidebar > .rh-heading {
    display: grid;
    align-items: start;
    margin-bottom: 14px;
}

.rh-catalog-explorer--sidebar > .rh-heading h2 {
    font-size: 25px;
    line-height: 1.08;
}

.rh-catalog-explorer--sidebar > .rh-heading > a {
    justify-self: stretch;
    justify-content: center;
}

.rh-catalog-explorer--sidebar .rh-catalog-explorer__grid {
    grid-template-columns: 1fr;
    gap: 10px;
}

.rh-catalog-explorer--sidebar .rh-catalog-explorer__heading strong {
    font-size: 17px;
}

.rh-catalog-explorer--sidebar .rh-catalog-explorer__group nav a {
    min-height: 42px;
    padding-block: 7px;
}

@media (max-width: 980px) {
    .rh-catalog-explorer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .rh-catalog-explorer--sidebar .rh-catalog-explorer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .rh-catalog-explorer > .rh-heading {
        display: grid;
        align-items: start;
    }

    .rh-catalog-explorer > .rh-heading > a {
        justify-self: start;
    }

    .rh-catalog-explorer__grid {
        grid-template-columns: 1fr;
    }

    .rh-catalog-explorer--sidebar .rh-catalog-explorer__grid {
        grid-template-columns: 1fr;
    }
}

.rh-recent,
.rh-franchises {
    padding: 18px;
    border-radius: 8px;
    background: #17231f;
    color: #fff;
}

.rh-recent .rh-heading,
.rh-franchises .rh-heading { margin-bottom: 12px; }

.rh-recent .rh-heading h2,
.rh-franchises .rh-heading h2 { color: #fff; font-size: var(--rh-font-section-title); }

.rh-recent .rh-heading span,
.rh-franchises .rh-heading span { color: #8fd8ba; }

.rh-recent-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
}

.rh-recent-grid > a {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-width: 0;
    min-height: 67px;
    padding: 8px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
    text-decoration: none;
}

.rh-recent-grid figure {
    width: 96px;
    aspect-ratio: 920 / 430;
    margin: 0;
    overflow: hidden;
    border-radius: 4px;
}

.rh-recent-grid figure.is-image-fallback {
    background: linear-gradient(135deg, rgba(143, 216, 186, 0.18), rgba(255, 255, 255, 0.04));
}

.rh-recent-grid img { width: 100%; height: 100%; object-fit: cover; }
.rh-recent-grid > a > div { min-width: 0; }
.rh-recent-grid span { display: block; margin-bottom: 3px; color: #8fd8ba; font-size: var(--rh-font-meta); font-weight: 850; text-transform: uppercase; }
.rh-recent-grid strong {
    display: -webkit-box;
    overflow: hidden;
    font-size: 16px;
    line-height: 1.2;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.rh-recent-grid small { display: none; }

.rh-franchise-strip {
    display: grid;
    grid-auto-columns: 102px;
    grid-auto-flow: column;
    gap: 10px;
    padding: 1px 0 12px;
    overflow-x: scroll;
    scroll-snap-type: x proximity;
    scrollbar-gutter: stable;
    scrollbar-color: rgba(255, 255, 255, 0.48) transparent;
    scrollbar-width: auto;
    scroll-behavior: smooth;
}

.rh-franchise-strip::-webkit-scrollbar { height: 12px; }
.rh-franchise-strip::-webkit-scrollbar-track { background: transparent; }
.rh-franchise-strip::-webkit-scrollbar-thumb { border-radius: 6px; background: rgba(255, 255, 255, 0.48); }
.rh-franchise-strip::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.68); }

.rh-franchise-strip > a {
    min-width: 0;
    scroll-snap-align: start;
    color: var(--rh-ink);
    text-align: center;
    text-decoration: none;
}

.rh-franchises .rh-franchise-strip > a { color: #fff; }

.rh-franchise-strip figure {
    aspect-ratio: 1;
    margin: 0;
    overflow: hidden;
    border-radius: 8px;
    background: #dce1dd;
}

.rh-franchise-strip img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    transition: transform 220ms ease;
}

.rh-franchise-strip a:hover img { transform: scale(1.035); }
.rh-franchise-strip > a > div { padding: 7px 1px 0; }
.rh-franchise-strip strong { display: block; font-size: 16px; line-height: 1.15; overflow-wrap: anywhere; }
.rh-franchise-strip small { display: block; margin-top: 3px; color: var(--rh-muted); font-size: var(--rh-font-meta); line-height: 1.2; }
.rh-franchises .rh-franchise-strip small { color: rgba(255, 255, 255, 0.68); }

.rh-dossier-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
}

.rh-dossiers {
    padding: 4px 4px 6px;
}

.rh-dossiers .rh-heading {
    margin-bottom: 20px;
}

.rh-dossier {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--rh-line);
    border-radius: 8px;
    background: var(--rh-card);
}

.rh-dossier-hub {
    position: relative;
    display: block;
    aspect-ratio: 920 / 430;
    overflow: hidden;
    background: #dce1dd;
    color: #fff;
    text-decoration: none;
}

.rh-dossier-hub figure {
    position: absolute;
    inset: 0;
    margin: 0;
}

.rh-dossier-hub img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 240ms ease;
}

.rh-dossier-hub:hover img { transform: scale(1.025); }

.rh-dossier-news { border-top: 1px solid var(--rh-line); }

.rh-dossier-news > a {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 9px;
    min-width: 0;
    padding: 14px 15px;
    border-bottom: 1px solid var(--rh-line);
    color: var(--rh-ink);
    text-decoration: none;
}

.rh-dossier-news > a:last-child { border-bottom: 0; }
.rh-dossier-news span { color: var(--rh-accent); font-size: 15px; font-weight: 800; line-height: 1.2; }
.rh-dossier-news strong { display: block; font-size: calc(var(--rh-font-compact-title) - 1px); font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }

.rh-two-lanes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 26px;
}

.rh-lane { min-width: 0; }
.rh-lane .rh-heading h2 { font-size: 28px; }

.rh-lane > div:last-child {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 14px;
}

.rh-lane > div:last-child > a {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-width: 0;
    min-height: 68px;
    padding: 8px 0;
    border-bottom: 1px solid var(--rh-line);
    color: var(--rh-ink);
    text-decoration: none;
}

.rh-lane figure {
    width: 96px;
    aspect-ratio: 920 / 430;
    margin: 0;
    overflow: hidden;
    border-radius: 5px;
    background: #dce1dd;
}

.rh-lane img { width: 100%; height: 100%; object-fit: cover; }
.rh-lane a > div { min-width: 0; }
.rh-lane strong { display: block; font-size: var(--rh-font-compact-title); line-height: 1.18; overflow-wrap: anywhere; }
.rh-lane small { display: block; margin-top: 4px; color: var(--rh-muted); font-size: var(--rh-font-meta); line-height: 1.2; }

.rh-dossier-news a:hover strong,
.rh-lane a:hover strong {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.retention-home a:focus-visible,
.retention-home button:focus-visible {
    outline: 3px solid #35b78b;
    outline-offset: 3px;
}

@media (min-width: 901px) {
    .rh-feature::after {
        background-image:
            radial-gradient(
                ellipse 138% 100% at 52% 0%,
                rgba(244, 244, 239, 0) 0%,
                rgba(244, 244, 239, 0) 76%,
                rgba(244, 244, 239, 0.08) 81%,
                rgba(244, 244, 239, 0.22) 86%,
                rgba(244, 244, 239, 0.46) 90%,
                rgba(244, 244, 239, 0.72) 94%,
                rgba(244, 244, 239, 0.9) 97.5%,
                var(--bg) 100%
            ),
            linear-gradient(
                90deg,
                rgba(0, 0, 0, 0.7392) 0%,
                rgba(0, 0, 0, 0.5712) 38%,
                rgba(0, 0, 0, 0.252) 74%,
                rgba(0, 0, 0, 0.4704) 100%
            ),
            linear-gradient(
                180deg,
                rgba(0, 0, 0, 0.168),
                rgba(0, 0, 0, 0.6048)
            );
        background-position: top left;
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }
}

@media (max-width: 1040px) {
    .rh-shell { width: var(--site-shell-width); }
    .rh-feature-top { grid-template-columns: minmax(0, 1.7fr) minmax(297px, 0.77fr); gap: 20px; min-height: 308px; }
    .rh-feature-copy { padding-right: 0; }
    .rh-feature-copy h1 { font-size: 38px; }
    .rh-feature-copy p { font-size: var(--font-size-body); }
    .rh-feature-side-news { padding-left: 18px; }
    .rh-feature-side-news > a { grid-template-columns: minmax(0, 1fr) 104px; gap: 12px; padding: 18px 0; }
    .rh-feature-side-news figure { width: 104px; }
    .rh-feature-side-news strong { font-size: 15px; }
    .rh-recent-grid > a { grid-template-columns: 78px minmax(0, 1fr); }
    .rh-recent-grid figure { width: 78px; }
    .rh-franchise-strip { grid-auto-columns: 96px; }
    .rh-hub-grid h3 { font-size: 19px; }
    .rh-lane > div:last-child { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .rh-shell { width: var(--site-shell-width); }
    .rh-feature { padding-top: calc(var(--site-header-height) + var(--channel-bar-height) + 10px); padding-bottom: 14px; }
    .rh-feature-top { grid-template-columns: 1fr; min-height: 0; }
    .rh-feature-lead { min-height: 253px; padding-bottom: 0; }
    .rh-feature-copy { padding: 38px 2px 18px; }
    .rh-feature-copy h1 { max-width: none; font-size: 31px; }
    .rh-feature-copy p { font-size: var(--font-size-body); }
    .rh-feature-side-news { padding: 0; border-left: 0; }
    .rh-feature-side-news > a { grid-template-columns: minmax(0, 1fr) 132px; }
    .rh-feature-side-news figure { width: 132px; }
    .rh-feature-side-news strong { font-size: 17px; }
    .rh-category-stack { margin-top: 16px; }
    .rh-category-carousel { margin-top: 0; min-height: 54px; }
    .rh-category-carousel__item { min-height: 54px; padding-inline: 20px; font-size: 15px; }
    .rh-category-carousel__arrow { height: 54px; }
    .rh-upcoming-events-rail { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .rh-upcoming-events-rail__heading {
        grid-column: 1 / -1;
        min-height: 48px;
        justify-content: center;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    .rh-upcoming-events-rail__item { padding-inline: 14px; }
    .rh-flow { padding-top: 25px; padding-bottom: 48px; }
    .rh-section + .rh-section,
    .rh-recent + .rh-section,
    .rh-section + .rh-recent { margin-top: 30px; }
    .rh-heading h2 { font-size: 28px; }
    .rh-newsroom-heading { margin-bottom: 16px; }
    .rh-newsroom-discovery { padding: 24px 0 0; }
    .rh-newsroom-discovery > a { min-height: 210px; }
    .rh-recent-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rh-hub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rh-dossier-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rh-two-lanes { grid-template-columns: 1fr; gap: 30px; }
    .rh-lane > div:last-child { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 480px) {
    .rh-feature-lead { min-height: 226px; }
    .rh-feature-copy { padding-top: 30px; }
    .rh-feature-copy h1 { font-size: 28px; }
    .rh-feature-side-news > a { grid-template-columns: minmax(0, 1fr) 104px; }
    .rh-feature-side-news figure { width: 104px; }
    .rh-feature-side-news strong { font-size: 15px; }
    .rh-category-carousel { grid-template-columns: 40px minmax(0, 1fr) 40px; }
    .rh-category-carousel__arrow { width: 40px; }
    .rh-upcoming-events-rail { grid-template-columns: 1fr; }
    .rh-upcoming-events-rail__heading { grid-column: auto; }
    .rh-upcoming-events-rail__item {
        min-height: 58px;
        border-left: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    .rh-upcoming-events-rail__item:last-child { border-bottom: 0; }
    .rh-newsroom-heading { align-items: flex-start; flex-direction: column; }
    .rh-newsroom-archive { width: 100%; }
    .rh-newsroom-discovery > a { min-height: 190px; }
    .rh-recent-grid { grid-template-columns: 1fr; }
    .rh-franchise-strip { margin-right: -10px; padding-right: 10px; }
    .rh-hub-grid { grid-template-columns: 1fr; }
    .rh-dossier-list { grid-template-columns: 1fr; }
    .rh-lane > div:last-child { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .retention-home *,
    .retention-home *::before,
    .retention-home *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* source: 06-site-footer.css */
.site-footer {
    position: relative;
    z-index: 1;
    color: #fff;
    background: #050706;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-family: var(--font-body);
}

.site-footer__upper {
    background: #000;
}

.site-footer__inner {
    width: var(--site-shell-width);
    max-width: var(--site-shell-max);
    margin: 0 auto;
}

.site-footer__primary {
    display: grid;
    grid-template-columns: minmax(0, 40fr) minmax(0, 50fr) minmax(110px, 10fr);
    gap: clamp(18px, 2vw, 24px);
    align-items: center;
    padding: calc(clamp(14px, calc(4vw - 20px), 31px) + 20px) 0;
}

.site-footer__steam {
    --steam-widget-scale: 1;

    position: relative;
    justify-self: end;
    width: 100%;
    max-width: 646px;
    height: 190px;
    min-width: 0;
    overflow: hidden;
    background: #000;
    border-radius: 4px;
}

.site-footer__steam-stage {
    position: absolute;
    top: 0;
    left: 0;
    width: 646px;
    height: 190px;
    overflow: hidden;
    border-radius: 4px;
    clip-path: inset(0 0 3px 0 round 4px);
    transform: scale(var(--steam-widget-scale));
    transform-origin: top left;
}

.site-footer__steam-stage::before {
    position: absolute;
    z-index: 3;
    top: 4px;
    right: 0;
    width: 1px;
    height: 159px;
    background: rgba(255, 255, 255, 0.22);
    content: "";
    pointer-events: none;
}

.site-footer__steam-stage::after {
    position: absolute;
    z-index: 2;
    inset: 0;
    background:
        radial-gradient(circle at right top, transparent 0 4px, #000 4.25px)
            left 163px / 4px 4px no-repeat,
        radial-gradient(circle at left top, transparent 0 4px, #000 4.25px)
            right 163px / 4px 4px no-repeat,
        linear-gradient(#000 0 0) left bottom / 210px 23px no-repeat,
        linear-gradient(#000 0 0) right bottom / 10px 23px no-repeat,
        linear-gradient(#000 0 0) left bottom / 100% 3px no-repeat;
    content: "";
    pointer-events: none;
}

.site-footer__steam iframe {
    display: block;
    width: 646px;
    height: 190px;
    border: 0;
    border-radius: 4px;
    background: #000;
    color-scheme: dark;
}

.site-footer__identity {
    display: flex;
    gap: 14px;
    flex-direction: column;
    align-items: stretch;
    min-width: 0;
}

.site-footer__identity-main {
    display: flex;
    width: max-content;
    max-width: 100%;
    min-width: 0;
    gap: 20px;
    align-self: center;
    align-items: center;
}

.site-footer__logo {
    display: block;
    flex: 0 0 auto;
    width: 96px;
    height: 96px;
    margin: 0;
    object-fit: contain;
}

.site-footer__logo-link {
    display: block;
    flex: 0 0 auto;
    text-decoration: none;
}

.site-footer__logo-link:focus-visible {
    outline: 2px solid var(--brand-yellow, #f5df2e);
    outline-offset: 4px;
}

.site-footer__identity-content {
    display: grid;
    width: max-content;
    max-width: 100%;
    gap: 8px;
    align-items: center;
    justify-items: center;
    align-self: center;
    min-width: 0;
    padding: 0;
    transform: translateY(4px);
}

.site-footer__useful {
    display: flex;
    flex: 0 1 auto;
    flex-wrap: nowrap;
    gap: 15px;
    align-items: center;
}

.site-footer__useful-item {
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.8rem;
    font-weight: 400;
    line-height: 1.4;
    text-decoration: none;
    transition: color 160ms ease;
}

.site-footer__useful-item:hover,
.site-footer__useful-item:focus-visible {
    color: #fff;
}

.site-footer__useful-item:focus-visible {
    outline: 2px solid var(--brand-yellow, #f5df2e);
    outline-offset: 4px;
}

.site-footer__social {
    display: flex;
    width: max-content;
    max-width: 100%;
    flex: 0 1 auto;
    gap: 14px;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
}

.site-footer__social-label {
    flex: 0 0 auto;
    color: rgba(255, 255, 255, 0.62);
    font-size: 0.72rem;
    font-weight: 400;
    line-height: 1.2;
}

.site-footer__social-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.site-footer__social-item {
    display: inline-flex;
    width: 18px;
    height: 32px;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.84);
    background: transparent;
    border: 0;
    border-radius: 0;
    font-size: 0.9rem;
    text-decoration: none;
    transition: color 160ms ease, transform 160ms ease;
}

.site-footer__social-item:hover,
.site-footer__social-item:focus-visible {
    color: #fff;
    transform: translateY(-2px);
}

.site-footer__social-item:focus-visible {
    outline: 2px solid var(--brand-yellow, #f5df2e);
    outline-offset: 2px;
}

.site-footer__to-top {
    display: inline-flex;
    width: 100%;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 9px;
    align-items: center;
    justify-self: stretch;
    color: #fff;
    font-size: 0.76rem;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: 0.04em;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.site-footer__to-top i {
    display: block;
    width: 100%;
    color: var(--brand-yellow, #f5df2e);
    font-size: 26.25px;
    -webkit-text-stroke: 0.75px currentColor;
    paint-order: stroke fill;
    text-align: center;
    transform: translateY(0);
    transition: transform 520ms cubic-bezier(0.45, 0, 0.55, 1);
    will-change: transform;
}

.site-footer__to-top span {
    display: block;
    width: 100%;
    text-align: center;
}

.site-footer__to-top:hover i,
.site-footer__to-top:focus-visible i {
    transform: translateY(-3px);
}

.site-footer__to-top:focus-visible {
    outline: 2px solid var(--brand-yellow, #f5df2e);
    outline-offset: 5px;
}

.site-footer__bottom {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: calc(clamp(14px, calc(4vw - 20px), 31px) + 10px) 100px;
    background: #111;
    box-shadow: 0 0 0 100vmax #111;
    clip-path: inset(0 -100vmax);
}

.site-footer__credit {
    display: block;
    margin: 0;
    padding: 0;
    color: #cfcfe0;
    font-family: "Open Sans", var(--font-body);
    font-size: 13px;
    font-weight: 300;
    line-height: 1.7;
    text-align: left;
}

.site-footer__credit-company {
    color: #fff;
    font-weight: 400;
    text-decoration: none;
}

.site-footer__credit-company:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.site-footer__credit-company:focus-visible {
    outline: 2px solid var(--brand-yellow, #f5df2e);
    outline-offset: 2px;
}

.site-footer__credit-group {
    display: grid;
    width: 100%;
    min-width: 0;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 27.5px;
    align-items: center;
}

.site-footer__credit-logo-link,
.site-footer__credit-logo-crop {
    display: block;
    width: 180px;
    height: 72px;
}

.site-footer__credit-logo-link {
    flex: 0 0 auto;
    overflow: hidden;
}

.site-footer__credit-logo-crop {
    position: relative;
    overflow: hidden;
}

.site-footer__credit-logo {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 180px;
    max-width: none;
    height: 180px;
    mix-blend-mode: screen;
    transform: translateY(-57px);
}

.site-footer__credit-logo-link:focus-visible {
    outline: 2px solid var(--brand-yellow, #f5df2e);
    outline-offset: 3px;
}

@media (max-width: 900px) {
    .site-footer__primary {
        grid-template-columns: minmax(0, 1fr) minmax(110px, 10%);
        gap: 24px 18px;
    }

    .site-footer__identity {
        grid-column: 1 / -1;
    }

    .site-footer__steam {
        grid-column: 1;
        justify-self: start;
        width: 100%;
        max-width: 646px;
    }

    .site-footer__to-top {
        grid-column: 2;
    }
}

@media (max-width: 600px) {
    .site-footer__primary {
        padding: 29px 0;
    }

    .site-footer__bottom {
        padding: 19px 100px;
    }

    .site-footer__steam {
        max-width: 100%;
    }

    .site-footer__logo {
        width: 80px;
        height: 80px;
    }

    .site-footer__identity {
        gap: 12px;
    }

    .site-footer__identity-main {
        gap: 20px;
    }

    .site-footer__useful {
        gap: 15px;
    }

    .site-footer__social {
        display: flex;
    }

    .site-footer__social-list {
        margin-top: 0;
    }

    .site-footer__credit {
        text-align: center;
    }

    .site-footer__credit-group {
        grid-template-columns: 1fr;
        justify-items: center;
    }
}

@media (max-width: 420px) {
    .site-footer__identity {
        gap: 20px;
    }

    .site-footer__identity-main {
        width: 100%;
        gap: 10px;
        align-items: flex-start;
    }

    .site-footer__identity-content {
        width: auto;
        max-width: none;
        flex: 1 1 auto;
    }

    .site-footer__logo {
        width: 60px;
        height: 60px;
    }

    .site-footer__useful {
        flex: 1 1 100%;
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 10px 15px;
    }

    .site-footer__useful-item {
        display: inline-flex;
        min-height: 44px;
        align-items: center;
        font-size: 0.8rem;
    }

    .site-footer__social-list {
        flex: 1 1 auto;
        justify-content: center;
        gap: 4px;
    }

    .site-footer__social {
        width: 100%;
        max-width: none;
        align-items: flex-start;
    }

    .site-footer__social-item {
        width: 44px;
        height: 44px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-footer__to-top i {
        transition: none;
    }
}

/* source: 10-article-components.css */
/* ── Reading progress bar ── */
.reading-progress {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 200;
    height: 3px;
    width: 0;
    background: var(--green);
    transition: width 80ms linear;
    pointer-events: none;
}

/* ── Article share buttons ── */
.article-share {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
    font-size: 15px;
    color: var(--muted);
    font-weight: 700;
}

/* ── Article TOC ── */
.toc {
    margin-bottom: 18px;
    padding: 14px 16px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    box-shadow: var(--shadow);
    font-size: 15px;
}
.toc:empty { display: none; }
.toc-label {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--muted);
}
.toc-list {
    margin: 0;
    padding: 0 0 0 16px;
    line-height: 1.65;
}
.toc-list li { margin: 2px 0; }
.toc-list a { color: var(--green-dark); font-weight: 700; text-decoration: none; }
.toc-list a:hover { text-decoration: underline; }
.toc-h3 { padding-left: 10px; }

/* ── Nav sidebar section labels ── */
.nav-section {
    display: block;
    padding: 12px 12px 4px;
    font-size: 15px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: rgba(255,255,255,0.42);
    pointer-events: none;
}

/* ── Channel bar (desktop mega-menu) ── */
.channel-bar {
    position: sticky;
    top: var(--site-header-height);
    z-index: 40;
    margin-top: 0;
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border-top: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}
.channel-bar__inner {
    position: relative;
    display: flex;
    align-items: stretch;
    width: 100%;
}
.channel-nav {
    display: flex;
    align-items: stretch;
    flex: 0 0 0;
    width: 0;
    overflow: visible;
}
.channel-item {
    position: static;
}
.channel-item > a,
.channel-trigger {
    display: flex;
    align-items: center;
    padding: 0 16px;
    height: 38px;
    color: rgba(255,255,255,0.86);
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    background: transparent;
    border: 0;
    cursor: pointer;
    white-space: nowrap;
    gap: 4px;
    transition: background 120ms, color 120ms;
}

.channel-nav > .channel-item > .channel-trigger,
.channel-nav > .channel-item > a {
    display: none;
}
.channel-item > a:hover,
.channel-trigger:hover,
.channel-item.open > .channel-trigger {
    background: rgba(255,255,255,0.1);
    color: #fff;
}
.channel-trigger .arrow { font-size: 15px; opacity: 0.6; }
.channel-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: var(--drop-left, 0);
    z-index: 100;
    min-width: 180px;
    max-width: min(360px, calc(100vw - 24px));
    padding: 6px 0;
    background: #fff;
    border: 1px solid rgba(0,0,0,0.12);
    border-radius: 0 0 8px 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.34);
}
.channel-item.open .channel-dropdown { display: block; }
.channel-dropdown a {
    display: grid;
    align-items: center;
    gap: 1px;
    padding: 9px 16px;
    color: #101010;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    transition: background 100ms;
}

.channel-dropdown a small {
    color: #5b5b55;
    font-size: 15px;
    font-weight: 600;
}

.channel-dropdown__label {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
}

.channel-dropdown__label .site-category-icon {
    color: var(--green);
}

.channel-dropdown__label + small {
    margin-left: calc(1.2em + 8px);
}

.channel-dropdown a:hover {
    background: #f2f2ec;
    color: #000;
}
@media (max-width: 680px) {
    :root { --channel-bar-height: 0px; }
    .channel-bar { display: none; }
}
@media (min-width: 681px) {
    .lang-switch-btn { display: inline-flex; }
}

/* ── Channel ticker (scrolling trending terms) ── */
.channel-ticker {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    position: relative;
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 20%, #000 80%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0, #000 20%, #000 80%, transparent 100%);
}
.channel-ticker::before,
.channel-ticker::after {
    content: '';
    position: absolute;
    top: 0; bottom: 0;
    width: 20%;
    min-width: 96px;
    max-width: 360px;
    z-index: 2;
    pointer-events: none;
    background: transparent;
}
.channel-ticker::before {
    left: 0;
}
.channel-ticker::after {
    right: 0;
}
.channel-ticker__track {
    display: flex;
    align-items: stretch;
    width: max-content;
    animation: ticker-run 110s linear infinite;
}
.channel-ticker__track:hover { animation-play-state: paused; }
.channel-ticker__item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 14px;
    height: 38px;
    color: rgba(255,255,255,0.72);
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    border-right: 1px solid rgba(255,255,255,0.08);
    white-space: nowrap;
    transition: color 120ms;
}
.channel-ticker__item:hover { color: #fff; }
.channel-ticker__item--franchise {
    gap: 9px;
    padding-inline: 10px 15px;
    border-right-color: rgba(255,255,255,0.22);
}
.channel-ticker__item--franchise img {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border: 1px solid rgba(255,255,255,0.22);
    border-radius: 9px;
    background: rgba(255,255,255,0.08);
    object-fit: cover;
    object-position: center top;
}
.channel-ticker__copy {
    display: inline-flex;
    align-items: baseline;
    gap: 9px;
    min-width: 0;
}
.channel-ticker__item--franchise small {
    color: rgba(255,255,255,0.42);
    font-size: 10px;
    font-weight: 750;
}
.channel-ticker__title {
    max-width: none;
    overflow: visible;
    text-overflow: clip;
}
.channel-ticker__latest-post {
    max-width: none;
    padding-left: 10px;
    border-left: 1px solid rgba(255,255,255,0.16);
    overflow: visible;
    color: rgba(255,255,255,0.78);
    font-size: inherit;
    font-weight: 400;
    text-overflow: clip;
    white-space: nowrap;
}
.channel-ticker__item:hover .channel-ticker__latest-post { color: #fff; }
@keyframes ticker-run {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
.channel-lang {
    display: inline-flex;
    align-items: center;
    padding: 0 16px;
    height: 38px;
    color: rgba(255,255,255,0.72);
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
    letter-spacing: .06em;
    text-transform: uppercase;
    border-left: 1px solid rgba(255,255,255,0.16);
    flex-shrink: 0;
    transition: color 120ms, background 120ms;
}
.channel-lang:hover {
    color: #fff;
    background: rgba(255,255,255,0.1);
}

/* ── Gallery expand button ── */
.gallery-extra { display: none; }
.gallery-extra.is-visible { display: contents; }
.gallery-more-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 12px;
    margin-top: 10px;
    border: 2px dashed var(--border);
    border-radius: 8px;
    background: transparent;
    color: var(--green-dark);
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: background 120ms, border-color 120ms;
}
.gallery-more-btn:hover {
    background: var(--bg);
    border-color: var(--green);
}
.gallery-more-btn--grid {
    min-height: 150px;
    margin-top: 0;
}

.video-grid .gallery-more-btn--grid,
.hub-edition-grid .gallery-more-btn--grid,
.hub-news-list .gallery-more-btn--grid {
    min-height: 72px;
    grid-column: 1 / -1;
}

.hub-news-list .gallery-more-btn--grid {
    width: calc(100% - 32px);
    margin: 16px;
}

@supports (content-visibility: auto) {
    .hub-main > .content-band,
    .article-next-block,
    .article-comments-block {
        content-visibility: auto;
        contain-intrinsic-size: 1px 680px;
    }

    .hub-main > .content-band:first-child {
        contain-intrinsic-size: 1px 420px;
    }
}

/* ── Hub tabs (work.php) ── */
.hub-tabs {
    position: sticky;
    top: calc(var(--site-header-height) + var(--channel-bar-height));
    z-index: 30;
    display: none;
    gap: 0;
    border-bottom: 2px solid var(--border);
    background: var(--surface);
    width: 100%;
    overflow-x: auto;
    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
    padding-left: max(16px, calc((100vw - var(--site-shell-max)) / 2));
    padding-right: max(16px, calc((100vw - var(--site-shell-max)) / 2));
}
.hub-tab {
    display: flex;
    align-items: center;
    padding: 12px 20px;
    border: 0;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    background: transparent;
    color: var(--muted);
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: color 120ms, border-color 120ms;
}
.hub-tab:hover { color: var(--text); }
.hub-tab.is-active {
    color: var(--green-dark);
    border-bottom-color: var(--green);
}

/* ── Gauge widget ── */
.gauge-widget {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,0.16);
}

.hero-rating-panel {
    display: grid;
    grid-template-columns: 60px minmax(0, 1fr);
    gap: 10px 12px;
}

.hero-rating-copy {
    align-self: center;
}

.hero-rating-form {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.hero-rating-stars {
    flex: 1 1 auto;
    min-width: 0;
}

.hero-rating-stars label {
    font-size: 20px;
}

.hero-rating-submit {
    flex: 0 0 auto;
    min-height: 34px;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 800;
}
.gauge-circle {
    position: relative;
    width: 60px;
    height: 60px;
    flex: 0 0 60px;
}
.gauge-circle svg {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}
.gauge-circle__bg {
    fill: none;
    stroke: rgba(255,255,255,0.18);
    stroke-width: 3;
}
.gauge-circle__fill {
    fill: none;
    stroke: #ffd83d;
    stroke-width: 3;
    stroke-linecap: round;
    transition: stroke-dasharray 500ms ease;
}
.gauge-circle.great .gauge-circle__fill { stroke: #22c55e; }
.gauge-circle.good  .gauge-circle__fill { stroke: #84cc16; }
.gauge-circle.mixed .gauge-circle__fill { stroke: #f59e0b; }
.gauge-circle.bad   .gauge-circle__fill { stroke: #ef4444; }
.gauge-circle__score {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 900;
    color: #fff;
}

/* ── Star rating ── */
.user-vote-form { margin-top: 14px; }
.rating-stars {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: 2px;
}
.rating-stars input { display: none; }
.rating-stars label {
    width: auto;
    min-height: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    font-size: 22px;
    cursor: pointer;
    color: rgba(255,255,255,0.28);
    transition: color 100ms;
}
.rating-stars label:hover,
.rating-stars label:hover ~ label,
.rating-stars input:checked ~ label { color: #ffd83d; }

/* ── Comment thread (GitHub-style) ── */
.comments-section .section-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 6px 12px;
}
.comments-section .section-heading .eyebrow {
    grid-column: 1 / -1;
    margin-bottom: 0;
}
.comments-section .section-heading h2 {
    grid-column: 1;
}
.comment-sort {
    display: flex;
    gap: 6px;
    font-size: 15px;
    grid-column: 2;
    grid-row: 2;
    align-self: center;
}
.comment-sort a {
    padding: 4px 10px;
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--muted);
    text-decoration: none;
    font-weight: 700;
}
.comment-sort a.active,
.comment-sort a:hover {
    background: var(--text);
    border-color: var(--text);
    color: var(--surface);
}
@media (max-width: 680px) {
    .comments-section .section-heading {
        grid-template-columns: 1fr;
    }
    .comment-sort {
        grid-column: 1;
        grid-row: auto;
    }
}
.comment-thread { display: grid; gap: 0; }
.comment {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 10px;
    padding: 14px 0;
    border-bottom: 1px solid var(--border);
}
.comment:last-child { border-bottom: 0; }
.comment__avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--green);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    flex-shrink: 0;
}
.comment__body {}
.comment__header {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 4px;
}
.comment__author { font-weight: 800; font-size: 15px; }
.comment__time { font-size: 15px; color: var(--muted); }
.comment__text { font-size: var(--font-size-body); line-height: 1.55; }
.comment__actions {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
}
.vote-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    min-height: 28px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--surface);
    color: var(--muted);
    font-size: 15px;
    cursor: pointer;
}
.vote-btn:hover { background: var(--bg); color: var(--text); }
.vote-score { font-size: 15px; font-weight: 700; min-width: 20px; text-align: center; }
.reply-toggle {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: transparent;
    color: var(--muted);
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    min-height: 28px;
}
.reply-toggle:hover { background: var(--bg); color: var(--text); }
.comment__replies { display: none; margin-top: 12px; }
.comment__replies.is-open { display: block; }
.comment-form { padding: 16px; }
.comment-form input,
.comment-form textarea { margin-bottom: 8px; }

/* ── Sidebar card in article ── */
.sidebar-latest { margin-top: 14px; }

/* source: 12-institutional-pages.css */
.institutional-page {
    background: var(--bg);
}

.article-hero--reader.institutional-hero {
    padding-bottom: 100px;
}

.institutional-hero::before {
    background:
        radial-gradient(circle at 12% 30%, rgba(245, 223, 46, 0.15), transparent 32%),
        linear-gradient(135deg, #07100d, #17231d 62%, #090d0b);
    filter: none;
}

.institutional-hero .article-hero__inner {
    grid-template-columns: minmax(0, 900px);
    justify-content: center;
}

.institutional-hero .institutional-hero__copy {
    max-width: 900px;
    min-height: 250px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-bottom: clamp(44px, 7vw, 76px);
}

.institutional-hero__eyebrow {
    margin: 0 0 12px;
    color: var(--brand-yellow, #f5df2e);
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.institutional-hero .article-hero__copy > .article-hero__summary--below-title {
    display: block;
    max-width: 760px;
    overflow: visible;
    -webkit-line-clamp: initial;
}

.institutional-layout {
    margin-bottom: clamp(46px, 7vw, 84px);
}

.institutional-card {
    border-top: 1px solid rgba(12, 21, 17, 0.08);
    border-radius: 8px;
}

.institutional-updated {
    max-width: 800px;
    margin: 0 auto 28px;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(10, 77, 53, 0.13);
    color: #59635e;
    font-size: 0.82rem;
    line-height: 1.5;
}

.institutional-updated i {
    margin-right: 7px;
    color: var(--green-dark);
}

.institutional-body > p:first-child {
    margin-top: 0;
    font-size: 1.08em;
}

.institutional-body code {
    padding: 0.12em 0.34em;
    border-radius: 4px;
    background: #eef1ec;
    color: #173b2d;
    font-size: 0.9em;
}

.institutional-related {
    display: flex;
    max-width: 800px;
    flex-wrap: wrap;
    gap: 10px 18px;
    margin: 38px auto 0;
    padding-top: 22px;
    border-top: 1px solid rgba(10, 77, 53, 0.13);
}

.institutional-related a {
    color: var(--green-dark);
    font-size: 0.85rem;
    font-weight: 800;
    text-decoration: none;
}

.institutional-related a:hover,
.institutional-related a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 3px;
}

@media (max-width: 680px) {
    .institutional-hero .institutional-hero__copy {
        min-height: 280px;
        padding-bottom: 50px;
    }

    .institutional-card {
        border-radius: 0 0 8px 8px;
    }
}

/* source: 20-hub.css */
/* ── Hub page refinements ── */

/* Keep the hero and "now in this hub" layouts independent inside one backdrop. */
.hub-panel-preview-header,
.hub-panel-preview-header .site-header__inner {
    min-height: var(--site-header-height);
}

.hub-panel-preview-header .site-header__inner {
    display: flex;
    justify-content: center;
}

.hub-panel-preview-header__message {
    width: 100%;
    margin: 0;
    color: #fff;
    font-size: clamp(16px, 1.7vw, 21px);
    font-weight: 900;
    line-height: 1.2;
    text-align: center;
    text-wrap: balance;
}

.hub-panel-preview-channel .channel-bar__inner {
    min-height: var(--channel-bar-height);
}

.hub-hero-stage {
    position: relative;
    z-index: 0;
    margin-top: calc((var(--site-header-height) + var(--channel-bar-height)) * -1);
}

.hub-hero-stage > .work-hero {
    margin-top: 0;
}

.hub-hero-stage.has-hero-background {
    isolation: isolate;
    margin-bottom: 18px;
    overflow: hidden;
    background: var(--bg);
}

.hub-hero-stage.has-hero-background > .work-hero {
    background: transparent;
}

.hub-hero-stage.has-hero-background > .work-hero::before,
.hub-hero-stage.has-hero-background > .work-hero::after {
    content: none;
}

.hub-hero-stage.has-hero-background::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    height: 100%;
    background-image: var(--work-hero-bg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter: blur(20px);
    transform: none;
    opacity: 1;
    pointer-events: none;
}

.hub-hero-stage.has-hero-background::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    height: 100%;
    background-color: transparent;
    background-image:
        linear-gradient(
            to bottom,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.03) 78.4%,
            rgba(244, 244, 239, 0.1) 80.8%,
            rgba(244, 244, 239, 0.22) 83.2%,
            rgba(244, 244, 239, 0.35) 85.6%,
            rgba(244, 244, 239, 0.5) 88%,
            rgba(244, 244, 239, 0.65) 90.4%,
            rgba(244, 244, 239, 0.78) 92.8%,
            rgba(244, 244, 239, 0.9) 95.2%,
            rgba(244, 244, 239, 0.97) 97.6%,
            var(--bg) 100%
        ),
        linear-gradient(
            90deg,
            rgba(0, 0, 0, 0.92) 0%,
            rgba(0, 0, 0, 0.72) 38%,
            rgba(0, 0, 0, 0.28) 74%,
            rgba(0, 0, 0, 0.52) 100%
        ),
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.22),
            rgba(0, 0, 0, 0.78)
        ),
        radial-gradient(
            circle at 12% 100%,
            rgba(255, 216, 61, 0.14),
            transparent 30%
        );
    background-position: top left;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border: 0;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    pointer-events: none;
}

@media (min-width: 901px) {
    .hub-hero-stage.has-hero-background::after {
        background-position: center calc(50% + 64px);
    }

    .hub-hero-stage.has-hero-background::before {
        background-image:
            radial-gradient(
                ellipse 138% 100% at 52% 0%,
                rgba(244, 244, 239, 0) 0%,
                rgba(244, 244, 239, 0) 76%,
                rgba(244, 244, 239, 0.08) 81%,
                rgba(244, 244, 239, 0.22) 86%,
                rgba(244, 244, 239, 0.46) 90%,
                rgba(244, 244, 239, 0.72) 94%,
                rgba(244, 244, 239, 0.9) 97.5%,
                var(--bg) 100%
            ),
            linear-gradient(
                90deg,
                rgba(0, 0, 0, 0.92) 0%,
                rgba(0, 0, 0, 0.72) 38%,
                rgba(0, 0, 0, 0.28) 74%,
                rgba(0, 0, 0, 0.52) 100%
            ),
            linear-gradient(
                180deg,
                rgba(0, 0, 0, 0.22),
                rgba(0, 0, 0, 0.78)
            ),
            radial-gradient(
                circle at 12% 100%,
                rgba(255, 216, 61, 0.14),
                transparent 30%
            );
    }
}

.hub-now-strip {
    width: var(--site-shell-width);
    margin: -8px auto 18px;
}

.hub-hero-stage.has-hero-background .hub-now-strip {
    margin-bottom: 0;
}

.hub-now-strip__inner {
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.hub-now-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.hub-now-article-list {
    display: grid;
    gap: 0;
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
    background: var(--bg);
}

.hub-now-article {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 32px;
    gap: 12px;
    align-items: center;
    min-height: 64px;
    padding: 10px 14px;
    color: var(--text);
    text-decoration: none;
    border-bottom: 1px solid var(--border);
}

.hub-now-article:last-child {
    border-bottom: 0;
}

.hub-now-article:hover {
    background: #fff;
}

.hub-now-article__icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 999px;
    background: rgba(17, 107, 73, 0.1);
    color: var(--green-dark);
}

.hub-now-article__body {
    display: grid;
    gap: 2px;
    min-width: 0;
    overflow: hidden;
}

.hub-now-article strong {
    display: block;
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-size: 16px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hub-now-article small {
    display: block;
    min-width: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hub-now-article__go {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    justify-self: end;
    color: var(--green-dark);
    font-size: 18px;
    font-weight: 900;
    text-align: right;
}

.hub-now-card {
    display: grid;
    gap: 7px;
    min-height: 136px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg);
    color: var(--text);
    text-decoration: none;
}

.hub-now-card:hover {
    border-color: var(--green);
    background: #fff;
}

.hub-now-card span {
    color: var(--green-dark);
    font-size: 15px;
    font-weight: 800;
}

.hub-now-card strong {
    font-size: 17px;
    line-height: 1.25;
}

.hub-now-card small {
    align-self: end;
    color: var(--muted);
    font-size: 15px;
}

.hub-timeline {
    padding-top: 20px;
}

.hub-timeline-list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.hub-timeline-list li {
    --timeline-dot: 15px;
    --timeline-x: 7.5px;
    position: relative;
    padding: 0 0 20px 30px;
}

.hub-timeline-list li:not(:last-child)::after {
    content: "";
    position: absolute;
    left: var(--timeline-x);
    top: calc(4px + var(--timeline-dot) - 2px);
    bottom: calc(-1 * (4px + var(--timeline-dot) - 2px));
    width: 3px;
    border-radius: 999px;
    background: var(--border);
    transform: translateX(-50%);
}

.hub-timeline-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 4px;
    width: var(--timeline-dot);
    height: var(--timeline-dot);
    box-sizing: border-box;
    border: 3px solid var(--surface);
    border-radius: 50%;
    background: var(--green);
    box-shadow: 0 0 0 1px var(--border);
    z-index: 1;
}

.hub-timeline-list li:last-child {
    padding-bottom: 0;
}

.hub-timeline-list span {
    display: block;
    margin-bottom: 3px;
    color: var(--green-dark);
    font-size: 15px;
    font-weight: 800;
}

.hub-timeline-list strong,
.hub-timeline-list strong a {
    color: var(--text);
    font-size: 18px;
    line-height: 1.25;
    text-decoration: none;
}

.hub-timeline-list strong a:hover {
    color: var(--green-dark);
}

.hub-timeline-list p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: var(--font-size-body);
    line-height: 1.55;
}

/* News item image in hub (card image spanning top of card) */
.news-item__img {
    display: block;
    width: calc(100% + 32px);
    margin: -16px -16px 12px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 8px 8px 0 0;
}

.hub-news-list {
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
}

.hub-news-item {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    padding: 14px;
    border: 0;
    border-bottom: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
}

.hub-news-item:last-child {
    border-bottom: 0;
}

.hub-news-item__media {
    display: block;
    min-width: 0;
    overflow: hidden;
    border-radius: 6px;
    background: var(--border);
    text-decoration: none;
    aspect-ratio: 16 / 9;
}

.hub-news-item .news-item__img {
    width: 100%;
    height: 100%;
    margin: 0;
    aspect-ratio: 16 / 9;
    min-height: 106px;
    border-radius: 0;
}

.hub-news-item__body {
    min-width: 0;
}

.hub-news-item__footer {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    margin: 8px 0 0;
}

.hub-news-item__meta {
    margin: 0;
    color: var(--green-dark);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.3;
}

.hub-news-item__read {
    flex: 0 0 auto;
    white-space: nowrap;
}

.hub-news-item h3 {
    margin: 0 0 7px;
    font-size: 20px;
    line-height: 1.18;
}

.hub-news-item p:not(.hub-news-item__meta) {
    margin: 0 0 8px;
    font-size: var(--font-size-body);
    line-height: 1.45;
}

/* Scroll offset for sticky header+channel-bar+hub-tabs */
#tab-wiki,
#tab-agora,
#tab-noticias,
#tab-articles,
#tab-galeria,
#tab-media,
#tab-itens,
#tab-items,
#tab-comunidade,
#tab-community {
    scroll-margin-top: calc(var(--site-header-height) + var(--channel-bar-height) + 18px);
}

/* Section heading accent in hub content */
.content-band .section-heading {
    padding-bottom: 12px;
    border-bottom: 2px solid var(--border);
    margin-bottom: 20px;
}
.content-band .section-heading .eyebrow {
    margin-bottom: 4px;
}

/* ── Hub page 2-column layout ── */
.hub-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 32px;
    align-items: start;
    width: var(--site-shell-width);
    margin: 0 auto;
    padding-bottom: 40px;
}

.hub-main {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.hub-timeline { order: 10; }
.hub-wiki { order: 20; }
.hub-news-section { order: 30; }
#tab-galeria,
#tab-media { order: 40; }
.hub-editions { order: 50; }
.comments-section { order: 60; }

/* Inside hub-layout, content-band sections are full-width of hub-main, not auto-centered */
.hub-layout .content-band {
    width: auto;
    margin: 0;
}

/* Visual separator between consecutive hub sections */
.hub-main .content-band + .content-band {
    border-top: 1px solid var(--border);
}

/* Sidebar */
.hub-side {
    align-self: start;
    position: sticky;
    top: var(--hub-side-sticky-top, calc(var(--site-header-height) + var(--channel-bar-height) + 18px));
    display: flex;
    flex-direction: column;
    gap: 14px;
    max-height: none;
    overflow: visible;
    padding-right: 2px;
    scrollbar-width: thin;
}

.hub-side-widget {
    position: relative;
    overflow: hidden;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: var(--shadow);
    padding: 16px;
}

.hub-side-widget--info {
    isolation: isolate;
    color: #fff;
    background: #050607;
    border-color: rgba(255, 255, 255, 0.12);
}

.hub-side-widget--info::before,
.hub-side-widget--info::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.hub-side-widget--info::before {
    z-index: -2;
    background-image: var(--hub-info-bg);
    background-position: center;
    background-size: cover;
    filter: blur(18px) saturate(140%);
    transform: scale(1.12);
    opacity: 0.5;
}

.hub-side-widget--info::after {
    z-index: -1;
    background: rgba(0, 0, 0, 0.68);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
}

.hub-side-widget--info h3,
.hub-side-widget--info .hub-info-list dt {
    color: rgba(255, 255, 255, 0.68);
}

.hub-side-widget--info .hub-info-list dd {
    color: rgba(255, 255, 255, 0.95);
}

.hub-side-widget--info .hub-info-list div {
    border-bottom-color: rgba(255, 255, 255, 0.18);
}

.hub-info-title {
    margin: 0 0 6px;
    color: rgba(255, 255, 255, 0.96);
    font-size: 18px;
    font-weight: 900;
    line-height: 1.2;
}

.hub-related-title {
    color: var(--text);
    margin-bottom: 14px;
}

.hub-side-widget h3 {
    font-size: 15px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin: 0 0 12px;
}

/* Tag cloud in sidebar */
.hub-tag-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.hub-tag-cloud a {
    display: inline-block;
    padding: 3px 10px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 20px;
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
    text-decoration: none;
    transition: background 0.12s, color 0.12s, border-color 0.12s;
}

.hub-tag-cloud a:hover {
    background: var(--green);
    border-color: var(--green);
    color: #fff;
}

.hub-info-list {
    display: grid;
    gap: 0;
    margin: 0;
}

.hub-info-list div {
    display: grid;
    grid-template-columns: minmax(130px, 46%) minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
}

.hub-info-list div:first-child {
    padding-top: 0;
}

.hub-info-list div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.hub-info-list dt {
    min-width: 0;
    margin: 0;
    color: var(--muted);
    font-size: 15px;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.hub-info-list dd {
    min-width: 0;
    margin: 0;
    color: var(--text);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.42;
    overflow-wrap: anywhere;
    overflow: visible;
}

.hub-info-details {
    min-width: 0;
}

.hub-info-details summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: start;
    cursor: pointer;
    list-style: none;
}

.hub-info-details summary::-webkit-details-marker {
    display: none;
}

.hub-info-details summary::after {
    content: "+";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    color: rgba(255, 255, 255, 0.88);
    font-weight: 800;
    line-height: 1;
}

.hub-info-details[open] summary::after {
    content: "-";
}

.hub-info-details__summary {
    position: relative;
    display: block;
    min-width: 0;
    padding-right: 18px;
    overflow: hidden;
    max-height: calc(1.42em * 2);
}

.hub-info-details:not([open]) .hub-info-details__summary::after {
    content: none;
}

.hub-info-details[open] .hub-info-details__summary {
    max-height: none;
    overflow: visible;
}

.hub-info-stores {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.hub-info-store {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    gap: 8px;
    color: rgba(255, 255, 255, 0.88);
    text-decoration: none;
    opacity: 0.72;
    transition: color 0.14s, opacity 0.14s;
}

.hub-info-store:hover {
    color: #fff;
    opacity: 1;
}

.hub-info-store .store-button__icon {
    width: 20px;
    min-width: 20px;
    height: 20px;
    font-size: 20px;
    line-height: 1;
}

.hub-info-store span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.hub-side-widget--info .hub-info-list a:not(.platform-chip):not(.hub-info-store) {
    color: rgba(255, 255, 255, 0.88);
    text-decoration-line: underline;
    text-decoration-color: rgba(255, 255, 255, 0.25);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    opacity: 0.82;
    transition: color 0.14s, opacity 0.14s, text-decoration-color 0.14s;
}

.hub-side-widget--info .hub-info-list a:not(.platform-chip):not(.hub-info-store):hover,
.hub-side-widget--info .hub-info-list a:not(.platform-chip):not(.hub-info-store):focus-visible {
    color: #fff;
    text-decoration-color: currentColor;
    opacity: 1;
}

.hub-side-widget--info .hub-info-list .hub-info-store {
    opacity: 0.72;
}

.hub-side-widget--info .hub-info-list .hub-info-store span {
    color: rgba(255, 255, 255, 0.88);
    text-decoration-line: underline;
    text-decoration-color: rgba(255, 255, 255, 0.25);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: color 0.14s, text-decoration-color 0.14s;
}

.hub-side-widget--info .hub-info-list .hub-info-store:hover span,
.hub-side-widget--info .hub-info-list .hub-info-store:focus-visible span {
    color: #fff;
    text-decoration-color: currentColor;
}

.hub-side-widget--info .hub-info-list .hub-info-store:hover,
.hub-side-widget--info .hub-info-list .hub-info-store:focus-visible {
    opacity: 1;
}

.platform-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-items: center;
}

.platform-chip {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 28px;
    padding: 4px 8px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.9);
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

a.platform-chip:hover {
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.28);
    color: #fff;
}

.platform-chip i {
    width: 17px;
    text-align: center;
    font-size: 17px;
}

i.platform-icon--nintendo-switch {
    display: inline-block;
    width: 1em;
    min-width: 1em;
    height: 1em;
    line-height: 1;
    opacity: 1;
    vertical-align: -0.125em;
    /* The mask paints with the color supplied by each context, like font icons do. */
    background: currentColor;
    -webkit-mask: url("/assets/icons/nintendo-switch-logo.svg") center / contain no-repeat;
    mask: url("/assets/icons/nintendo-switch-logo.svg") center / contain no-repeat;
}

.home-platform-card i.platform-icon--nintendo-switch,
.home-v2-platform-card i.platform-icon--nintendo-switch {
    display: block;
    width: 40px;
    min-width: 40px;
    height: 40px;
    align-self: start;
    justify-self: center;
    margin-top: 0;
    color: var(--yellow);
    background: var(--yellow);
    -webkit-mask-size: 29px 29px;
    mask-size: 29px 29px;
    line-height: 1;
    vertical-align: 0;
}

.platform-hero__mark i.platform-icon--nintendo-switch,
.platform-brand-card i.platform-icon--nintendo-switch {
    color: inherit;
    background: currentColor;
}

.hub-edition-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.hub-edition-card {
    display: grid;
    gap: 8px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.hub-edition-link {
    color: var(--green-dark);
    font-weight: 850;
    text-decoration: none;
}

.hub-edition-link:hover {
    color: var(--green);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.hub-event-schedule {
    display: grid;
    gap: 16px;
}

.hub-event-edition {
    display: grid;
    grid-template-columns: minmax(84px, 0.28fr) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    padding: 16px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--surface);
}

.hub-event-edition--primary {
    border-color: color-mix(in srgb, var(--green) 42%, var(--border));
    background: linear-gradient(135deg, color-mix(in srgb, var(--green) 9%, var(--surface)), var(--surface));
}

.hub-event-edition__date {
    display: grid;
    gap: 5px;
}

.hub-event-edition__date span,
.hub-event-edition small {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.hub-event-edition__date strong {
    color: var(--green-dark);
    font-size: 1.35rem;
}

.hub-event-edition__body {
    display: grid;
    gap: 7px;
}

.hub-event-edition__body h3,
.hub-event-edition__body p {
    margin: 0;
}

.hub-event-edition__body a {
    width: fit-content;
    color: var(--green-dark);
    font-weight: 800;
}

.hub-event-edition-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.hub-event-edition-list .hub-event-edition {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 6px 12px;
}

.hub-event-edition-list .hub-event-edition small {
    grid-column: 2;
}

.hub-event-history {
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: 9px;
}

.hub-event-history summary {
    cursor: pointer;
    font-weight: 800;
}

.hub-event-history ol {
    display: grid;
    gap: 8px;
    margin: 12px 0 0;
    padding-left: 22px;
}

.hub-event-history li {
    padding-left: 4px;
}

.hub-event-history li strong {
    display: inline-block;
    min-width: 56px;
}

.hub-local-review-notice {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 0.65rem;
    margin: 0;
    padding: 0.72rem clamp(1rem, 3vw, 2rem);
    color: #f7f5ed;
    background: #694f0c;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    font-size: 0.88rem;
    line-height: 1.45;
}

.hub-local-review-notice strong {
    flex: 0 0 auto;
    color: #fff3bf;
}

@media (max-width: 720px) {
    .hub-event-edition,
    .hub-event-edition-list {
        grid-template-columns: 1fr;
    }

    .hub-event-edition-list .hub-event-edition small {
        grid-column: 1;
    }

    .hub-local-review-notice {
        display: block;
    }

    .hub-local-review-notice strong {
        display: block;
        margin-bottom: 0.2rem;
    }
}

/* source: 30-platform-taxonomy.css */
/* ── Platform brand pages ── */
.platform-page {
    width: var(--site-shell-width);
    margin: 0 auto;
    padding: 36px 0 72px;
}

.platform-hero {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 28px;
    align-items: center;
    margin-bottom: 28px;
    padding: 32px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    background:
        radial-gradient(circle at 16% 0%, rgba(24, 116, 78, 0.32), transparent 36%),
        linear-gradient(135deg, rgba(8, 11, 12, 0.98), rgba(10, 21, 26, 0.96));
    color: #fff;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.24);
}

.platform-hero--index {
    display: block;
}

.platform-hero--franchise-detail {
    position: relative;
    grid-template-columns: 148px minmax(0, 1fr);
    padding-right: 164px;
}

.platform-hero h1 {
    margin: 0 0 10px;
    font-size: clamp(42px, 5vw, 78px);
    line-height: 0.95;
    letter-spacing: 0;
}

.platform-hero > p:not(.eyebrow),
.platform-hero__copy > p:not(.eyebrow) {
    max-width: 820px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: var(--font-size-body);
    line-height: 1.6;
}

.platform-hero .eyebrow {
    margin-bottom: 8px;
    color: #7ee6b2;
}

.platform-hero__mark {
    display: grid;
    place-items: center;
    width: 116px;
    aspect-ratio: 1;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.08);
}

.platform-hero__mark i {
    font-size: 58px;
}

.platform-hero__portrait {
    width: 148px;
    aspect-ratio: 1;
    object-fit: cover;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.2);
}

.platform-hero__back {
    position: absolute;
    top: 22px;
    right: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
}

.platform-hero__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.platform-hero__stats span {
    padding: 8px 13px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.32);
    font-size: 15px;
    font-weight: 800;
}

.company-page .platform-hero {
    margin-bottom: 0;
}

.platform-hero--company-detail {
    grid-template-columns: 180px minmax(0, 1fr);
}

.platform-hero--company-detail .company-hero__logo {
    width: 180px;
    border-color: rgba(255, 255, 255, 0.18);
    border-radius: 24px;
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.22);
}

.platform-hero--company-detail .company-hero__logo[data-logo-surface="dark"] {
    border-color: rgba(255, 255, 255, 0.2);
}

.platform-hero--company-detail .company-hero__logo[data-company-slug="frontiers-group-entertainment"],
.company-directory__card[data-company-slug="frontiers-group-entertainment"] > span {
    background: #000;
}

.platform-hero--company-detail .company-hero__logo[data-logo-surface="dark"] span {
    color: #fff;
}

.company-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    margin: 6px 0 2px;
}

.company-hero__meta span,
.company-hero__meta a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
}

.company-hero__meta a {
    color: #a9edca;
    text-underline-offset: 3px;
}

.company-lead__fallback {
    display: block;
    min-height: 210px;
    border-radius: 10px;
    background:
        radial-gradient(circle at 18% 16%, rgba(255, 218, 57, 0.26), transparent 30%),
        radial-gradient(circle at 88% 18%, rgba(0, 158, 122, 0.34), transparent 32%),
        linear-gradient(135deg, #111820, #355a48 52%, #091014);
}

.company-lead--solo {
    grid-template-columns: minmax(0, 1fr);
}

.company-empty-section,
.company-hub-section {
    min-width: 0;
}

.company-hub-section .work-card__meta-note {
    margin-top: auto;
}

.company-directory__head {
    display: grid;
    gap: 8px;
    max-width: 780px;
    margin-bottom: 32px;
}

.company-directory__head h1 {
    margin: 0;
    font-size: clamp(38px, 6vw, 68px);
    line-height: 1;
}

.company-directory__head > p:last-of-type {
    margin: 0;
    color: var(--muted);
    font-size: var(--font-size-body);
    line-height: 1.55;
}

.company-directory__head > strong {
    color: var(--green-dark);
    font-size: 14px;
}

.company-directory__grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
}

.company-directory__card {
    display: grid;
    grid-template-rows: 140px auto;
    gap: 12px;
    min-width: 0;
    padding: 16px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    color: var(--ink);
    text-align: left;
    text-decoration: none;
    box-shadow: 0 8px 22px rgba(16, 24, 20, 0.04);
}

.company-directory__card > span {
    display: grid;
    min-width: 0;
    overflow: hidden;
    place-items: center;
    border-radius: 9px;
    background: #f3f5f2;
}

.company-directory__card[data-logo-surface="dark"] > span { background: #101416; }

.company-directory__card img {
    display: block;
    width: auto;
    height: auto;
    max-width: 84%;
    max-height: 84%;
    object-fit: contain;
}

.author-directory__card > .author-directory__portrait {
    background:
        radial-gradient(circle at 76% 18%, rgba(126, 230, 178, 0.34), transparent 34%),
        linear-gradient(135deg, #e8eee9, #f6f2df);
}

.author-directory__card > .author-directory__portrait img {
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
}

.author-directory__portrait b {
    color: #0c5c40;
    font-size: clamp(34px, 4vw, 54px);
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 1;
}

.platform-hero .eyebrow a,
.author-profile-hero__copy .eyebrow a {
    color: inherit;
    text-decoration-color: rgba(255, 255, 255, 0.34);
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
}

.platform-hero .eyebrow a:hover,
.platform-hero .eyebrow a:focus-visible,
.author-profile-hero__copy .eyebrow a:hover,
.author-profile-hero__copy .eyebrow a:focus-visible {
    color: #fff;
    text-decoration-color: currentColor;
}

.company-directory__card strong {
    font-size: 16px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.company-directory__card-copy {
    display: grid;
    gap: 8px;
    align-content: start;
    min-width: 0;
}

.company-directory__card-copy p {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.4;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.company-directory__card-copy small {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
    color: #59615d;
    font-size: 12px;
    font-weight: 750;
    line-height: 1.35;
}

.company-directory__card-copy small b {
    color: var(--green-dark);
}

.company-directory__card-copy small b + span::before {
    margin-right: 8px;
    color: #929894;
    content: "·";
}

.company-directory__card:hover,
.company-directory__card:focus-visible {
    border-color: rgba(0, 92, 67, 0.38);
    box-shadow: 0 12px 28px rgba(16, 24, 20, 0.1);
    transform: translateY(-2px);
}

.entity-content-layout {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(280px, 3fr);
    gap: 34px;
    align-items: start;
}

.entity-article-column,
.entity-hub-column {
    min-width: 0;
}

.entity-article-list,
.entity-hub-list {
    display: grid;
}

.entity-article-card {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 22px;
    min-width: 0;
    padding: 22px 0;
    border-bottom: 1px solid var(--border);
}

.entity-article-card:first-child { padding-top: 0; }
.entity-article-list > .entity-article-card:last-child { border-bottom: 0; }

.entity-article-card__image {
    display: block;
    width: 260px;
    height: 150px;
    overflow: hidden;
    border-radius: 9px;
    background: #edf1ed;
}

.entity-article-card__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.entity-article-card__copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.entity-article-card h3 {
    margin: 0 0 8px;
    font-size: 24px;
    line-height: 1.18;
}

.entity-article-card h3 a {
    color: var(--ink);
    text-decoration: none;
}

.entity-article-card time {
    display: inline;
    margin: 0;
    color: inherit;
    font-size: inherit;
    font-weight: 700;
}

.entity-article-card p {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: var(--font-size-body);
    line-height: 1.48;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.entity-hub-column {
    padding-left: 24px;
    border-left: 1px solid var(--border);
}

.entity-hub-card {
    display: grid;
    gap: 12px;
    min-width: 0;
    padding: 14px 0;
    border-bottom: 1px solid var(--border);
    color: var(--ink);
    text-decoration: none;
}

.entity-hub-card:first-child { padding-top: 0; }
.entity-hub-card.has-image { grid-template-columns: 108px minmax(0, 1fr); }

.entity-hub-card img {
    display: block;
    width: 108px;
    height: 64px;
    object-fit: cover;
    border-radius: 7px;
    background: #edf1ed;
}

.entity-hub-card > span { min-width: 0; }

.entity-hub-card strong {
    display: block;
    font-size: 16px;
    line-height: 1.22;
}

.entity-hub-card small {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.3;
}

.entity-article-card:hover h3 a,
.entity-hub-card:hover strong { text-decoration: underline; text-underline-offset: 3px; }

.platform-brand-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.platform-brand-card {
    display: grid;
    gap: 12px;
    min-height: 250px;
    padding: 22px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    color: var(--ink);
    text-decoration: none;
    box-shadow: var(--shadow);
}

.platform-brand-card i {
    font-size: 42px;
    color: #0b6b47;
}

.platform-brand-card__portrait {
    width: 92px;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 18px;
    background: #eef2ec;
    box-shadow: inset 0 0 0 1px rgba(11, 107, 71, 0.08);
}

.platform-brand-card strong {
    font-size: 24px;
    line-height: 1.1;
}

.platform-brand-card span {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.45;
}

.platform-brand-card em {
    align-self: end;
    color: #0b6b47;
    font-size: 15px;
    font-style: normal;
    font-weight: 900;
}

.platform-brand-card__examples {
    display: -webkit-box;
    overflow: hidden;
    color: #59615d;
    font-size: 13px;
    line-height: 1.4;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.platform-brand-card__examples b {
    color: #29332e;
}

.platform-brand-card__foot {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    align-items: center;
    align-self: end;
}

.platform-brand-card__foot small {
    color: #68716b;
    font-size: 13px;
    font-weight: 750;
}

.platform-brand-card__foot small::before {
    margin-right: 10px;
    color: #9ba09d;
    content: "·";
}

.platform-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 28px;
    align-items: start;
}

.platform-main,
.platform-rail {
    display: grid;
    gap: 26px;
}

.platform-rail {
    position: sticky;
    top: 104px;
}

.platform-section {
    padding: 24px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    box-shadow: var(--shadow);
}

.platform-section--compact h2 {
    margin: 0 0 16px;
    font-size: 24px;
    line-height: 1.15;
}

.platform-news-list {
    display: grid;
    gap: 16px;
}

.platform-news-card {
    display: grid;
    grid-template-columns: minmax(190px, 260px) minmax(0, 1fr);
    gap: 18px;
    align-items: stretch;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border);
    min-width: 0;
}

.platform-news-card:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.platform-news-card__image,
.platform-work-card__image {
    display: block;
    overflow: hidden;
    border-radius: 10px;
    background: #111;
    color: #fff;
    text-decoration: none;
}

.platform-news-card__image {
    aspect-ratio: 16 / 9;
    width: 100%;
    max-width: 260px;
    min-width: 0;
}

.platform-work-card__image {
    aspect-ratio: var(--hub-main-image-ratio);
}

.platform-news-card__image img,
.platform-work-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.platform-news-card > div,
.platform-work-card > div {
    min-width: 0;
}

.platform-news-card__image span,
.platform-work-card__image span {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    padding: 16px;
    font-size: 15px;
    font-weight: 900;
    text-align: center;
}

.platform-news-card h3,
.platform-work-card h3 {
    margin: 4px 0 8px;
    font-size: 24px;
    line-height: 1.12;
}

.platform-news-card h3 a,
.platform-work-card h3 a {
    color: inherit;
    text-decoration: none;
}

.platform-news-card p:not(.item-meta),
.platform-work-card p:not(.item-meta) {
    margin: 0;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.5;
}

.platform-work-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.platform-work-card {
    display: grid;
    gap: 12px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--surface);
}

.platform-work-card__foot {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.platform-work-card__foot span,
.platform-subplatforms span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 30px;
    padding: 5px 10px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: #fff;
    color: var(--muted);
    font-size: 15px;
    font-weight: 800;
}

.platform-subplatforms {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.platform-subplatforms span {
    justify-content: space-between;
    min-width: 150px;
}

.platform-subplatforms b {
    color: var(--ink);
}

.platform-subplatforms em {
    color: #0b6b47;
    font-style: normal;
}

.platform-topic-list {
    display: grid;
    gap: 10px;
}

.platform-topic-list a {
    display: grid;
    gap: 4px;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
    color: inherit;
    text-decoration: none;
}

.platform-topic-list a:last-child {
    border-bottom: 0;
}

.platform-topic-list strong {
    font-size: 17px;
    line-height: 1.25;
}

.platform-topic-list span {
    color: var(--muted);
    font-size: 15px;
}

@media (max-width: 980px) {
    .platform-layout {
        grid-template-columns: 1fr;
    }

    .platform-rail {
        position: static;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }

    .platform-brand-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .platform-layout,
    .platform-brand-grid,
    .platform-work-grid {
        grid-template-columns: 1fr;
    }

    .platform-rail {
        position: static;
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1080px) {
    .company-directory__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .entity-content-layout { grid-template-columns: minmax(0, 2fr) minmax(240px, 1fr); gap: 24px; }
    .entity-article-card { grid-template-columns: 220px minmax(0, 1fr); gap: 18px; }
    .entity-article-card__image { width: 220px; height: 127px; }
}

@media (max-width: 820px) {
    .company-directory__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .entity-content-layout { grid-template-columns: 1fr; }
    .entity-hub-column { padding: 24px 0 0; border-top: 1px solid var(--border); border-left: 0; }
    .entity-hub-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; }
}

@media (max-width: 680px) {
    .platform-page {
        width: var(--site-shell-width);
        padding-top: 20px;
    }

    .platform-hero,
    .platform-news-card {
        grid-template-columns: 1fr;
    }

    .platform-hero {
        padding: 22px;
    }

    .platform-hero--franchise-detail {
        padding-right: 22px;
    }

    .platform-hero--company-detail .company-hero__logo {
        width: 112px;
        border-radius: 18px;
    }

    .platform-hero__back {
        position: static;
        justify-self: start;
        margin-bottom: 4px;
    }

    .platform-hero__portrait {
        width: 96px;
        border-radius: 18px;
    }

    .platform-hero__mark {
        width: 84px;
        border-radius: 18px;
    }

    .platform-hero__mark i {
        font-size: 42px;
    }

    .platform-news-card__image {
        aspect-ratio: 16 / 9;
        max-width: none;
    }

    .platform-work-card__image {
        aspect-ratio: var(--hub-main-image-ratio);
        max-width: none;
    }
}

.hub-edition-card p {
    margin: 0;
    color: var(--muted);
    font-size: 15px;
}

.hub-edition-card > p {
    font-size: var(--font-size-body);
}

.hub-edition-card h3 {
    margin: 2px 0 0;
    font-size: 18px;
    line-height: 1.2;
}

.hub-company-links {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
}

.hub-company-links a {
    color: rgba(255, 255, 255, 0.88);
    text-decoration: none;
    opacity: 0.82;
    transition: color 0.14s, opacity 0.14s;
}

.hub-company-links a:hover {
    color: #fff;
    opacity: 1;
}

.hub-taxonomy-links a {
    color: rgba(255, 255, 255, 0.9);
    text-decoration-color: rgba(255, 255, 255, 0.36);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: color 0.14s, text-decoration-color 0.14s;
}

.hub-taxonomy-links a:hover,
.hub-taxonomy-links a:focus-visible {
    color: #fff;
    text-decoration-color: currentColor;
}

.hub-taxonomy-links--hero a {
    color: inherit;
    text-decoration: none;
}

.hub-related-list {
    display: grid;
    gap: 10px;
}

.hub-related-list a {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    color: var(--text);
    text-decoration: none;
    overflow: visible;
}

.hub-related-list img {
    display: block;
    width: 72px;
    flex: 0 0 72px;
    aspect-ratio: var(--hub-main-image-ratio);
    object-fit: cover;
    border-radius: 6px;
    background: var(--border);
}

.hub-related-list strong,
.hub-related-list small {
    display: block;
}

.hub-related-list strong {
    font-size: 18px;
    line-height: 1.25;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
}

.hub-related-list small {
    display: none;
}

.hub-related-list a:hover strong {
    color: var(--green-dark);
}

.hub-teaser-card {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr) 58px;
    gap: 12px;
    align-items: center;
    min-height: 98px;
    padding: 10px 12px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 4px;
    background: rgba(7, 9, 9, 0.9);
    color: #fff;
    text-decoration: none;
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.2);
}

.hub-teaser-card::before,
.hub-teaser-card::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.hub-teaser-card::before {
    z-index: 0;
    background-image: var(--teaser-bg, linear-gradient(135deg, #0a1510, #17211c));
    background-position: center;
    background-size: cover;
    filter: blur(7px) saturate(1.28) brightness(1.18);
    transform: scale(1.08);
    opacity: 0.96;
}

.hub-teaser-card::after {
    z-index: 1;
    background:
        linear-gradient(90deg, rgba(3, 5, 4, 0.68), rgba(3, 5, 4, 0.78) 58%, rgba(2, 3, 3, 0.9));
    backdrop-filter: blur(3px) saturate(118%);
    -webkit-backdrop-filter: blur(3px) saturate(118%);
    box-shadow: inset 0 0 0 999px rgba(0, 0, 0, 0.18);
}

.hub-teaser-card__visual {
    position: relative;
    z-index: 2;
    display: block;
    width: 112px;
    aspect-ratio: var(--hub-main-image-ratio);
    overflow: hidden;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.12);
}

.hub-teaser-card__visual img,
.hub-teaser-card__fallback {
    display: block;
    width: 100%;
    height: 100%;
}

.hub-teaser-card__visual img {
    object-fit: cover;
}

.hub-teaser-card__fallback {
    display: grid;
    place-items: center;
    color: rgba(255, 255, 255, 0.86);
    font-size: 20px;
    font-weight: 950;
}

.hub-teaser-card__copy {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 7px;
    min-width: 0;
}

.hub-teaser-card__title {
    color: #fff;
    font-size: 17px;
    font-weight: 900;
    line-height: 1.13;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.7);
}

.hub-teaser-card__meta {
    color: rgba(255, 255, 255, 0.78);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.18;
    text-transform: uppercase;
}

.hub-teaser-card__score {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: conic-gradient(var(--score-color, var(--green)) var(--score-pct), rgba(255, 255, 255, 0.2) 0);
    color: #fff;
    font-size: 19px;
    font-weight: 950;
}

.hub-teaser-card__score::before {
    content: "";
    position: absolute;
    inset: 6px;
    border-radius: 50%;
    background: rgba(4, 5, 5, 0.9);
}

.hub-teaser-card__score span {
    position: relative;
    z-index: 1;
}

.hub-teaser-card__rank {
    position: absolute;
    top: 6px;
    right: 9px;
    color: rgba(255, 255, 255, 0.28);
    font-size: 24px;
    font-weight: 950;
    line-height: 1;
}

.hub-related-list {
    gap: 12px;
}

.hub-side-related {
    display: grid;
    gap: 12px;
    width: 100%;
}

.hub-side-related .hub-related-title {
    margin: 0;
    color: var(--text);
}

.hub-related-list .hub-teaser-card {
    grid-template-columns: minmax(124px, 38%) minmax(0, 1fr) 44px;
    box-sizing: border-box;
    align-items: center;
    width: 100%;
    min-height: 82px;
    padding: 8px 9px;
    overflow: hidden;
    border-radius: 8px;
    background: #111514;
    color: #fff;
}

.hub-related-list .hub-teaser-card::before {
    background-image: var(--teaser-bg);
    background-position: center;
    background-size: cover;
    filter: blur(8px) saturate(140%) brightness(1.26);
    transform: scale(1.12);
    opacity: 0.98;
}

.hub-related-list .hub-teaser-card::after {
    background:
        linear-gradient(90deg, rgba(3, 5, 4, 0.72), rgba(3, 5, 4, 0.8) 54%, rgba(2, 3, 3, 0.92));
    backdrop-filter: blur(4px) saturate(128%);
    -webkit-backdrop-filter: blur(4px) saturate(128%);
    box-shadow: inset 0 0 0 999px rgba(0, 0, 0, 0.2);
}

.hub-related-list .hub-teaser-card__visual {
    width: 100%;
    aspect-ratio: var(--hub-main-image-ratio);
    background: transparent;
    border-radius: 6px;
}

.hub-related-list .hub-teaser-card__visual img {
    object-fit: cover;
    border-radius: 6px;
    background: transparent;
}

.hub-related-list .hub-teaser-card__title {
    font-size: 16px;
    line-height: 1.12;
}

.hub-related-list .hub-teaser-card__score {
    width: 42px;
    height: 42px;
    font-size: 16px;
}

.hub-related-list .hub-teaser-card__score::before {
    inset: 5px;
}

.hub-related-list .hub-teaser-card:hover .hub-teaser-card__title,
.home-hot-hubs .hub-teaser-card:hover .hub-teaser-card__title,
.fami-hub-grid .hub-teaser-card:hover .hub-teaser-card__title {
    color: #fff;
}

/* Compact stats in sidebar */
.hub-side-stats {
    display: flex;
    gap: 8px;
    margin: 0;
    flex-wrap: wrap;
}

.hub-side-stats div {
    flex: 1 1 60px;
    text-align: center;
    padding: 8px 6px;
    background: var(--bg);
    border-radius: 6px;
}

.hub-side-stats dt {
    font-size: 22px;
    font-weight: 800;
    color: var(--green-dark);
    margin: 0;
}

.hub-side-stats dd {
    font-size: 15px;
    color: var(--muted);
    margin: 0;
}

/* Store links in sidebar */
.hub-store-links {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.hub-store-btn {
    display: flex;
    align-items: center;
    width: 100%;
    height: auto;
    background: var(--green) !important;
    color: #fff !important;
    opacity: 1 !important;
    border-radius: 6px;
    padding: 9px 14px;
    gap: 10px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    justify-content: flex-start;
    transition: background 0.14s;
}

.hub-store-btn:hover {
    background: var(--green-dark) !important;
    transform: none;
    opacity: 1 !important;
}

.hub-store-btn .store-button__icon {
    width: 20px;
    height: 20px;
    font-size: 20px;
}

/* Score display in sidebar */
.hub-score-display {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.hub-score-num {
    font-size: 36px;
    font-weight: 900;
    color: var(--green-dark);
    line-height: 1;
}

.hub-score-meta {
    font-size: 15px;
    color: var(--muted);
}

/* Vote form in sidebar (light background) */
.hub-vote-form { margin-top: 4px; }
.hub-vote-label {
    font-size: 15px;
    font-weight: 600;
    color: var(--muted);
    margin: 0 0 6px;
}
.hub-rating-stars label {
    font-size: 18px;
    color: var(--border);
}
.hub-rating-stars label:hover,
.hub-rating-stars label:hover ~ label,
.hub-rating-stars input:checked ~ label { color: var(--yellow); }

/* Empty wiki state */
.hub-empty-state {
    color: var(--muted);
    font-style: italic;
    padding: 4px 0 8px;
}

.hub-empty-state--news {
    padding-left: 16px;
}

/* Mobile: stack sidebar below main */
@media (max-width: 680px) {
    .hub-layout {
        grid-template-columns: 1fr;
    }

    .hub-now-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hub-edition-grid {
        grid-template-columns: 1fr;
    }

    .hub-side {
        position: static;
        flex-direction: row;
        flex-wrap: wrap;
        max-height: none;
        overflow: visible;
        padding-right: 0;
    }

    .hub-side-widget {
        flex: 1 1 220px;
    }
}

@media (max-width: 560px) {
    .work-hero__heading,
    .work-hero__summary,
    .work-hero__main,
    .work-hero__summary > p,
    .work-hero-nav,
    .work-hero .info-panel {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    .work-hero-nav {
        display: grid;
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: minmax(0, 1fr);
        gap: 0;
        overflow: hidden;
        border-radius: 0;
    }

    .work-hero-nav a {
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        justify-content: center;
        min-width: 0;
        padding-left: 10px;
        padding-right: 10px;
        text-align: center;
        line-height: 1.2;
        white-space: normal;
    }

    .work-hero-nav a:last-child {
        border-bottom: 0;
    }

    .work-hero-nav a:not(:last-child) {
        border-right: 1px solid rgba(255, 255, 255, 0.2);
    }

    .work-hero-nav a {
        border-bottom: 0;
    }

    .work-hero .hero-facts > div {
        grid-template-columns: minmax(96px, 34%) minmax(0, 1fr);
    }

    .hub-now-grid {
        grid-template-columns: 1fr;
    }

    .hub-news-item {
        grid-template-columns: 1fr;
    }

    .hub-news-item .news-item__img {
        min-height: 0;
    }
}

/* One H1 scale for every public taxonomy surface. This is the scale that
   originated on the Genres directory: 42px minimum, 74px maximum. */
:root {
    --taxonomy-page-title-size: clamp(42px, 6vw, 74px);
    --taxonomy-section-title-size: var(--site-section-title-size);
}

.collection-page {
    display: grid;
    gap: 26px;
}

.collection-page__head {
    max-width: 920px;
}

.collection-page__head > p:last-child {
    color: var(--muted);
    font-size: var(--font-size-body);
    line-height: 1.5;
    margin: 8px 0 0;
}

.collection-page__pills {
    margin-bottom: 0;
}

.collection-popular {
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    padding: 16px;
    box-shadow: 0 10px 28px rgba(16, 24, 20, 0.05);
}

.collection-popular .section-heading {
    margin-bottom: 10px;
}

.collection-popular__panel {
    display: none;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.collection-popular__panel.is-active {
    display: grid;
}

.collection-popular__panel a {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 12px;
    border: 1px solid rgba(9, 88, 62, 0.12);
    border-radius: 10px;
    background: linear-gradient(180deg, #ffffff 0%, #f7faf7 100%);
    text-decoration: none;
    color: var(--ink);
    min-height: 98px;
}

.collection-popular__panel a:hover {
    border-color: rgba(9, 88, 62, 0.34);
    transform: translateY(-1px);
}

.collection-popular__panel span {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: var(--green);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
}

.collection-popular__panel strong {
    font-size: 15px;
    line-height: 1.28;
}

.collection-news-list {
    display: grid;
    gap: 16px;
}

.collection-pagination {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--border);
}

.collection-pagination a {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: fit-content;
    max-width: 100%;
    min-height: 42px;
    padding: 9px 14px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: transparent;
    color: var(--ink);
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
}

.collection-pagination a:hover,
.collection-pagination a:focus-visible {
    border-color: var(--green);
    color: var(--green);
}

.collection-pagination .is-previous {
    grid-column: 1;
    justify-self: start;
}

.collection-pagination__status {
    grid-column: 2;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-align: center;
    white-space: nowrap;
}

.collection-pagination .is-next {
    grid-column: 3;
    justify-self: end;
}

.collection-pagination__spacer {
    display: block;
    min-width: 1px;
    min-height: 1px;
}

.taxonomy-directory,
.taxonomy-collection {
    display: grid;
    gap: 22px;
    padding-bottom: 72px;
}

.taxonomy-directory__hero,
.taxonomy-collection__hero {
    display: grid;
    gap: 8px;
    box-sizing: border-box;
    margin-top: 36px;
    padding: 32px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 14px;
    background:
        radial-gradient(circle at 16% 0%, rgba(24, 116, 78, 0.32), transparent 36%),
        linear-gradient(135deg, rgba(8, 11, 12, 0.98), rgba(10, 21, 26, 0.96));
    color: #fff;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.2);
}

.taxonomy-directory__hero h1,
.taxonomy-collection__hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 58px);
    line-height: 1;
}

.taxonomy-directory__hero > p:last-of-type,
.taxonomy-collection__hero > p:last-of-type {
    max-width: 760px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: var(--font-size-body);
    line-height: 1.5;
}

.taxonomy-directory__hero .eyebrow,
.taxonomy-collection__hero .eyebrow {
    color: #7ee6b2;
}

.taxonomy-directory--genre {
    --taxonomy-directory-accent: #f5df2e;
}

.taxonomy-directory--feature {
    --taxonomy-directory-accent: #7ee6b2;
}

.taxonomy-directory--origin {
    --taxonomy-directory-accent: #7ee6b2;
}

.taxonomy-directory--release {
    --taxonomy-directory-accent: #8fc8ff;
}

.taxonomy-directory--franchise {
    --taxonomy-directory-accent: #f5df2e;
}

.taxonomy-directory--company {
    --taxonomy-directory-accent: #7ee6b2;
}

.taxonomy-directory--author {
    --taxonomy-directory-accent: #7ee6b2;
}

.taxonomy-directory--genre .taxonomy-directory__hero--discovery {
    background:
        radial-gradient(circle at 86% 12%, rgba(245, 223, 46, 0.2), transparent 34%),
        linear-gradient(135deg, rgba(7, 8, 9, 0.99), rgba(20, 20, 17, 0.97));
}

.taxonomy-directory--feature .taxonomy-directory__hero--discovery {
    background:
        radial-gradient(circle at 86% 12%, rgba(126, 230, 178, 0.22), transparent 34%),
        linear-gradient(135deg, rgba(7, 8, 9, 0.99), rgba(12, 24, 20, 0.97));
}

.taxonomy-directory--origin .taxonomy-directory__hero--discovery {
    background:
        radial-gradient(circle at 86% 12%, rgba(126, 230, 178, 0.22), transparent 34%),
        linear-gradient(135deg, rgba(7, 8, 9, 0.99), rgba(12, 24, 20, 0.97));
}

.taxonomy-directory--release .taxonomy-directory__hero--discovery {
    background:
        radial-gradient(circle at 86% 12%, rgba(143, 200, 255, 0.22), transparent 34%),
        linear-gradient(135deg, rgba(7, 8, 9, 0.99), rgba(10, 18, 27, 0.97));
}

.taxonomy-directory--franchise .taxonomy-directory__hero--discovery {
    background:
        radial-gradient(circle at 86% 12%, rgba(245, 223, 46, 0.2), transparent 34%),
        linear-gradient(135deg, rgba(7, 8, 9, 0.99), rgba(24, 18, 29, 0.97));
}

.taxonomy-directory--company .taxonomy-directory__hero--discovery {
    background:
        radial-gradient(circle at 86% 12%, rgba(126, 230, 178, 0.22), transparent 34%),
        linear-gradient(135deg, rgba(7, 8, 9, 0.99), rgba(12, 24, 20, 0.97));
}

.taxonomy-directory--author .taxonomy-directory__hero--discovery {
    background:
        radial-gradient(circle at 86% 12%, rgba(126, 230, 178, 0.22), transparent 34%),
        linear-gradient(135deg, rgba(7, 8, 9, 0.99), rgba(12, 24, 20, 0.97));
}

.taxonomy-directory__hero--discovery {
    grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.55fr);
    gap: clamp(24px, 4vw, 64px);
    align-items: end;
    padding: clamp(28px, 5vw, 58px);
}

.taxonomy-directory__hero-copy {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.taxonomy-directory__hero-copy .eyebrow {
    margin: 0;
    color: var(--taxonomy-directory-accent);
}

.taxonomy-directory__hero-copy .taxonomy-page-title {
    margin: 0;
    font-size: clamp(42px, 6vw, 74px);
    line-height: 0.96;
}

.taxonomy-directory__hero-copy .taxonomy-page-title i {
    color: var(--taxonomy-directory-accent);
    font-size: 0.62em;
}

.taxonomy-directory__hero-copy > p:last-of-type {
    max-width: 720px;
    margin: 2px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: clamp(16px, 1.6vw, 19px);
    line-height: 1.55;
}

.taxonomy-directory__switcher {
    display: grid;
    gap: 9px;
    justify-items: start;
    margin-top: 8px;
}

.taxonomy-directory__switcher-intro {
    margin: 0;
    color: rgba(255, 255, 255, 0.5);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.taxonomy-directory__switcher-links {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.taxonomy-directory__switcher a {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    gap: 8px;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.07);
    color: rgba(255, 255, 255, 0.76);
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
}

.taxonomy-directory__switcher a:hover,
.taxonomy-directory__switcher a:focus-visible,
.taxonomy-directory__switcher a.is-current {
    border-color: var(--taxonomy-directory-accent);
    background: var(--taxonomy-directory-accent);
    color: #090909;
}

.taxonomy-directory__category-picker {
    display: grid;
    justify-items: start;
    margin-top: 2px;
}

.taxonomy-directory__category-picker summary {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    gap: 8px;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: transparent;
    color: rgba(255, 255, 255, 0.76);
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    list-style: none;
}

.taxonomy-directory__category-picker summary::-webkit-details-marker {
    display: none;
}

.taxonomy-directory__category-picker summary:hover,
.taxonomy-directory__category-picker summary:focus-visible,
.taxonomy-directory__category-picker[open] summary {
    border-color: var(--taxonomy-directory-accent);
    color: #fff;
}

.taxonomy-directory__category-picker-arrow {
    margin-left: 4px;
    font-size: 11px;
    transition: transform 160ms ease;
}

.taxonomy-directory__category-picker[open] .taxonomy-directory__category-picker-arrow {
    transform: rotate(180deg);
}

.taxonomy-directory__category-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 8px;
}

.taxonomy-directory__category-options a {
    min-height: 38px;
    justify-content: flex-start;
    padding: 0 12px;
    background: transparent;
}

.taxonomy-directory__summary {
    display: grid;
    gap: 12px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.34);
    backdrop-filter: blur(10px);
}

.taxonomy-directory__summary > p {
    margin: 0;
    color: rgba(255, 255, 255, 0.58);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.taxonomy-directory__summary .platform-hero__stats {
    display: grid;
    gap: 8px;
    margin: 0;
}

.taxonomy-directory__summary .platform-hero__stats span {
    display: block;
    padding: 11px 12px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.07);
    color: rgba(255, 255, 255, 0.76);
    font-size: 13px;
    font-weight: 700;
}

.taxonomy-directory__summary .platform-hero__stats strong {
    margin-right: 5px;
    color: #fff;
    font-size: 20px;
}

.taxonomy-directory__featured,
.taxonomy-directory__browse {
    display: grid;
    gap: 20px;
}

.taxonomy-directory__browse {
    padding: clamp(22px, 3vw, 34px);
    border: 1px solid rgba(17, 17, 17, 0.12);
    border-radius: 18px;
    background: #f4f4ef;
    box-shadow: 0 14px 34px rgba(17, 17, 17, 0.04);
}

.taxonomy-directory__section-heading {
    align-items: end;
    margin: 0;
}

.taxonomy-directory__section-heading > p {
    max-width: 620px;
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.taxonomy-directory-featured-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.taxonomy-directory-featured-grid > a {
    position: relative;
    isolation: isolate;
    display: grid;
    min-height: 286px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 14px;
    background: #080a09;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 16px 34px rgba(7, 15, 11, 0.14);
}

.taxonomy-directory-featured-grid figure {
    position: absolute;
    z-index: -1;
    inset: 0;
    margin: 0;
    background: #101311;
}

.taxonomy-directory-featured-grid figure::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.08) 15%, rgba(0, 0, 0, 0.92) 88%);
    content: "";
}

.taxonomy-directory-featured-grid img,
.taxonomy-directory-featured-grid figure > span {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 220ms ease, opacity 220ms ease;
}

.taxonomy-directory-featured-grid > a:hover img,
.taxonomy-directory-featured-grid > a:focus-visible img {
    opacity: 0.9;
    transform: scale(1.035);
}

.taxonomy-directory-featured-grid > a > div {
    display: grid;
    gap: 6px;
    align-self: end;
    padding: 18px;
}

.taxonomy-directory-featured-grid p,
.taxonomy-directory-featured-grid h3,
.taxonomy-directory-featured-grid span,
.taxonomy-directory-featured-grid em {
    margin: 0;
}

.taxonomy-directory-featured-grid p {
    color: var(--taxonomy-directory-accent);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.taxonomy-directory-featured-grid h3 {
    color: #fff;
    font-size: clamp(21px, 2.2vw, 27px);
    line-height: 1.05;
}

.taxonomy-directory-featured-grid span {
    color: rgba(255, 255, 255, 0.76);
    font-size: 13px;
    font-weight: 750;
}

.taxonomy-directory-featured-grid em {
    overflow: hidden;
    color: rgba(255, 255, 255, 0.55);
    font-size: 12px;
    font-style: normal;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.taxonomy-directory--discovery .taxonomy-directory-grid a {
    position: relative;
    overflow: hidden;
    border-top: 1px solid #d8dad7;
    border-left: 1px solid #d8dad7;
}

.taxonomy-directory-card__arrow {
    position: absolute;
    right: 14px;
    top: 50%;
    color: var(--green-dark);
    font-size: 17px;
    font-weight: 900;
    opacity: 0.88;
    transform: translateY(-50%);
    transition: color 180ms ease, transform 180ms ease;
}

.taxonomy-directory-grid a:hover .taxonomy-directory-card__arrow,
.taxonomy-directory-grid a:focus-visible .taxonomy-directory-card__arrow {
    color: #084f36;
    transform: translate(3px, -50%);
}

.taxonomy-collection__hero .eyebrow a {
    color: inherit;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.taxonomy-directory-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.taxonomy-directory-grid__letter {
    display: flex;
    grid-column: 1 / -1;
    gap: 12px;
    align-items: center;
    min-height: 32px;
    margin-top: 16px;
    color: #151816;
    font-size: 15px;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.taxonomy-directory-grid__letter:first-child {
    margin-top: 0;
}

.taxonomy-directory-grid__letter::after {
    height: 1px;
    flex: 1;
    background: rgba(17, 17, 17, 0.14);
    content: "";
}

.taxonomy-directory-grid a {
    display: grid;
    gap: 8px;
    align-content: center;
    min-height: 94px;
    padding: 16px 48px 16px 18px;
    border: 1px solid #d8dad7;
    border-radius: 12px;
    background: #fff;
    color: var(--ink);
    text-decoration: none;
    box-shadow: 0 7px 18px rgba(16, 24, 20, 0.04);
    transition: border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

.taxonomy-directory-grid a:hover,
.taxonomy-directory-grid a:focus-visible {
    border-color: rgba(11, 107, 71, 0.48);
    background: #f7faf8;
    transform: translateY(-2px);
    box-shadow: 0 13px 30px rgba(16, 24, 20, 0.08);
}

.taxonomy-directory-grid strong {
    color: #151816;
    font-size: 20px;
    line-height: 1.25;
    text-wrap: balance;
}

.taxonomy-directory-grid span {
    color: var(--muted);
    font-size: 14px;
    font-weight: 700;
}

.taxonomy-directory-grid a[hidden] {
    display: none;
}

.taxonomy-directory-card__counts {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    align-items: center;
}

.taxonomy-directory-card__counts b {
    padding: 0;
    background: transparent;
    color: #59615d;
    font-size: 14px;
    font-weight: 700;
}

.taxonomy-directory-card__counts b + b::before {
    margin-right: 5px;
    color: #8a8f8c;
    content: "·";
}

.taxonomy-directory__controls {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(180px, 240px) auto;
    gap: 12px;
    align-items: end;
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(16, 24, 20, 0.05);
}

.taxonomy-directory__controls label {
    display: grid;
    gap: 6px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.taxonomy-directory__controls input,
.taxonomy-directory__controls select {
    width: 100%;
    min-height: 44px;
    box-sizing: border-box;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: #fff;
    color: var(--ink);
    font: inherit;
}

.taxonomy-directory__controls > strong {
    align-self: center;
    color: var(--green-dark);
    font-size: 14px;
    white-space: nowrap;
}

.taxonomy-directory__controls--search-only {
    grid-template-columns: minmax(240px, 1fr) auto;
}

.taxonomy-directory__empty {
    padding: 28px;
    border: 1px dashed var(--border);
    border-radius: 12px;
    text-align: center;
}

.taxonomy-jump-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 8px;
}

.taxonomy-jump-links a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
}

.taxonomy-jump-links strong {
    display: grid;
    place-items: center;
    min-width: 26px;
    height: 26px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.32);
}

.taxonomy-collection > .content-band:not(.taxonomy-collection__hero) {
    box-sizing: border-box;
    padding: 24px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(16, 24, 20, 0.05);
}

@media (max-width: 960px) {
    .taxonomy-directory-featured-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .taxonomy-directory-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .taxonomy-collection .category-news-grid {
        grid-template-columns: 1fr;
    }

    .taxonomy-collection .category-work-grid--featured,
    .collection-page .category-work-grid--featured {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .taxonomy-directory__hero--discovery {
        grid-template-columns: 1fr;
    }

    .taxonomy-directory__summary .platform-hero__stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .taxonomy-directory__summary .platform-hero__stats span {
        display: grid;
        align-content: start;
    }

    .taxonomy-directory__controls {
        grid-template-columns: 1fr 1fr;
    }

    .taxonomy-directory__controls > strong {
        grid-column: 1 / -1;
    }
}

@media (max-width: 680px) {
    .taxonomy-directory__summary .platform-hero__stats {
        grid-template-columns: 1fr;
    }

    .taxonomy-directory-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 420px) {
    .taxonomy-directory__hero,
    .taxonomy-collection__hero,
    .taxonomy-collection > .content-band:not(.taxonomy-collection__hero) {
        padding: 20px;
    }

    .taxonomy-directory__hero,
    .taxonomy-collection__hero {
        margin-top: 20px;
    }

    .taxonomy-directory__controls {
        grid-template-columns: 1fr;
    }

    .taxonomy-directory__controls > strong {
        grid-column: auto;
        white-space: normal;
    }

    .taxonomy-directory-featured-grid {
        grid-template-columns: 1fr;
    }

    .taxonomy-directory-featured-grid > a {
        min-height: 250px;
    }

    .taxonomy-directory-grid {
        grid-template-columns: 1fr;
    }
}

.work-card__meta-note {
    display: block;
    margin-top: auto;
    color: #0b6b47;
    font-size: 13px;
    font-style: normal;
    font-weight: 800;
}

.category-lead {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.75fr);
    gap: 18px;
    align-items: stretch;
}

.category-lead__story {
    display: grid;
    grid-template-columns: minmax(220px, 38%) minmax(0, 1fr);
    gap: 18px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fff;
    color: var(--ink);
    text-decoration: none;
    box-shadow: 0 14px 34px rgba(16, 24, 20, 0.06);
}

.taxonomy-page-title {
    display: flex;
    align-items: center;
    gap: 0.38em;
}

.taxonomy-page-title .site-category-icon {
    color: var(--green-dark);
    font-size: 0.78em;
}

.category-lead__story img {
    width: 100%;
    height: 100%;
    min-height: 210px;
    object-fit: cover;
    border-radius: 10px;
}

.category-lead__story span,
.category-lead__list span {
    color: var(--green);
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
}

.category-lead__story h2 {
    font-size: clamp(26px, 3vw, 40px);
    line-height: 1.02;
    margin: 8px 0;
}

.category-lead__story p {
    color: var(--muted);
    font-size: var(--font-size-body);
    line-height: 1.45;
}

.category-lead__list {
    display: grid;
    gap: 10px;
}

.category-lead__list a {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    color: var(--ink);
    text-decoration: none;
}

.category-lead__list strong {
    font-size: 18px;
    line-height: 1.25;
}

.category-stat-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.category-stat-row span {
    display: grid;
    gap: 2px;
    padding: 14px 16px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    color: var(--muted);
    font-size: 14px;
    font-weight: 700;
}

.category-stat-row strong {
    color: var(--ink);
    font-size: 26px;
    line-height: 1;
}

.category-news-section,
.category-hub-strip,
.category-split-lanes {
    display: grid;
    gap: 14px;
}

.category-news-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.category-news-card {
    display: grid;
    grid-template-columns: 168px minmax(0, 1fr);
    gap: 14px;
    align-items: stretch;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(16, 24, 20, 0.04);
}

.category-news-card__image {
    display: block;
    min-height: 118px;
    overflow: hidden;
    border-radius: 9px;
    background: #eef2ec;
}

.category-news-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.category-news-card h3 {
    margin: 5px 0 6px;
    font-size: 20px;
    line-height: 1.15;
}

.category-news-card h3 a {
    color: var(--ink);
    text-decoration: none;
}

.category-news-card p:not(.item-meta) {
    margin: 0;
    color: var(--muted);
    font-size: var(--font-size-body);
    line-height: 1.42;
}

.search-unified-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.search-result-card {
    display: grid;
    grid-template-columns: 168px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(16, 24, 20, 0.04);
}

.search-result-card__visual {
    display: grid;
    width: 100%;
    overflow: hidden;
    place-items: center;
    border-radius: 9px;
    background: #e9efe9;
    color: var(--green-dark);
    text-decoration: none;
}

.search-result-card__visual--hub {
    aspect-ratio: 920 / 430;
}

.search-result-card__visual--article,
.search-result-card__visual--genre,
.search-result-card__visual--platform {
    aspect-ratio: 16 / 9;
}

.search-result-card__visual--franchise,
.search-result-card__visual--company {
    aspect-ratio: 1;
}

.search-result-card__visual--company[data-logo-surface="dark"] {
    background: #101416;
}

.search-result-card__visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.search-result-card__visual--company img {
    width: auto;
    height: auto;
    max-width: 82%;
    max-height: 82%;
    object-fit: contain;
    object-position: center center;
}

.search-result-card__visual i {
    font-size: 34px;
}

.search-result-card__copy {
    min-width: 0;
}

.search-result-card h3 {
    margin: 6px 0 7px;
    font-size: 21px;
    line-height: 1.16;
    letter-spacing: 0;
}

.search-result-card h3 a {
    color: var(--ink);
    text-decoration: none;
}

.search-result-card h3 a:hover,
.search-result-card h3 a:focus-visible {
    color: var(--green-dark);
}

.search-result-card__copy > p:not(.item-meta) {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: var(--font-size-body);
    line-height: 1.42;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.search-result-card--franchise,
.search-result-card--company,
.search-result-card--genre,
.search-result-card--platform {
    border-color: rgba(0, 92, 67, 0.22);
}

.category-work-grid--featured {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.category-split-lanes {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.category-split-lanes > div {
    padding: 16px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(16, 24, 20, 0.04);
}

.category-mini-list {
    display: grid;
    gap: 10px;
}

.category-mini-list a {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    min-height: 72px;
    color: var(--ink);
    text-decoration: none;
}

.category-mini-list img {
    width: 92px;
    aspect-ratio: var(--hub-main-image-ratio);
    object-fit: cover;
    border-radius: 8px;
    background: #eef2ec;
}

.category-mini-list span {
    display: grid;
    gap: 3px;
}

.category-mini-list strong {
    font-size: 16px;
    line-height: 1.18;
}

.category-mini-list small {
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.section-heading--compact {
    margin-bottom: 12px;
}

@media (max-width: 680px) {
    .category-lead {
        grid-template-columns: 1fr;
    }

    .category-news-grid,
    .search-unified-grid,
    .category-split-lanes {
        grid-template-columns: 1fr;
    }

    .category-work-grid--featured {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .collection-popular__panel {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .category-stat-row {
        grid-template-columns: 1fr;
    }

    .category-lead__story {
        grid-template-columns: 1fr;
    }

    .category-lead__story img {
        min-height: 180px;
    }

    .collection-popular {
        padding: 12px;
    }

    .collection-popular__panel {
        grid-template-columns: 1fr;
    }

    .category-news-card,
    .category-work-grid--featured,
    .taxonomy-collection .category-work-grid--featured,
    .collection-page .category-work-grid--featured {
        grid-template-columns: 1fr;
    }

    .search-result-card {
        grid-template-columns: 144px minmax(0, 1fr);
    }

    .category-news-card__image {
        min-height: 170px;
    }

    .company-directory__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .company-directory__card { grid-template-rows: 110px auto; padding: 12px; }
    .entity-article-card { grid-template-columns: 132px minmax(0, 1fr); gap: 14px; }
    .entity-article-card__image { width: 132px; height: 88px; }
    .entity-article-card h3 { font-size: 18px; }
    .entity-article-card p { -webkit-line-clamp: 2; }
    .entity-hub-list { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .search-result-card {
        grid-template-columns: 1fr;
    }

    .search-result-card__visual--franchise,
    .search-result-card__visual--company {
        width: min(180px, 100%);
    }

    .company-directory__grid { gap: 10px; }
    .company-directory__card { grid-template-rows: 92px auto; }
    .entity-article-card { grid-template-columns: 112px minmax(0, 1fr); }
    .entity-article-card__image { width: 112px; height: 72px; }
    .entity-article-card__description { display: none; }
}

/* Events landing: calendar, durable guides, coverage archive and cross-channel discovery. */
.category-landing--events {
    gap: clamp(34px, 5vw, 64px);
    padding-bottom: 70px;
}

.events-page-hero {
    position: relative;
    display: grid;
    gap: 22px;
    overflow: hidden;
    padding: clamp(24px, 4vw, 44px);
    border: 1px solid rgba(0, 92, 67, 0.2);
    border-radius: 20px;
    background:
        radial-gradient(circle at 100% 0, rgba(255, 216, 61, 0.28), transparent 30%),
        linear-gradient(135deg, #eef7f1 0%, #fffdf4 100%);
}

.events-page-hero__copy,
.events-stat-row,
.events-jump-nav {
    position: relative;
    z-index: 1;
}

.events-page-hero__copy {
    max-width: 830px;
}

.events-page-hero__copy h1 {
    margin: 4px 0 12px;
    font-size: clamp(40px, 6vw, 72px);
    line-height: 0.98;
}

.events-page-hero__copy > p:last-child {
    max-width: 760px;
    margin: 0;
    color: var(--muted);
    font-size: clamp(17px, 2vw, 20px);
    line-height: 1.5;
}

.events-stat-row a {
    display: grid;
    gap: 3px;
    min-width: 0;
    padding: 15px 17px;
    border: 1px solid rgba(0, 92, 67, 0.18);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.86);
    color: var(--muted);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: border-color 160ms ease, transform 160ms ease;
}

.events-stat-row a:hover,
.events-stat-row a:focus-visible {
    border-color: var(--green);
    transform: translateY(-2px);
}

.events-stat-row strong {
    color: var(--ink);
    font-size: 28px;
    line-height: 1;
}

.events-jump-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.events-jump-nav a {
    padding: 9px 13px;
    border: 1px solid rgba(0, 92, 67, 0.2);
    border-radius: 999px;
    background: #fff;
    color: var(--green-dark);
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
}

.events-jump-nav a:hover,
.events-jump-nav a:focus-visible {
    border-color: var(--green-dark);
    background: var(--green-dark);
    color: #fff;
}

.events-guide-stack,
.events-guide-section,
.events-coverage-section {
    display: grid;
    gap: 18px;
    scroll-margin-top: calc(var(--site-header-height) + var(--channel-bar-height) + 20px);
}

.events-guide-stack {
    gap: clamp(38px, 5vw, 58px);
}

.events-section-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.55fr);
    gap: 24px;
    align-items: end;
    margin: 0;
}

.events-section-heading h2 {
    margin: 4px 0 0;
    font-size: clamp(28px, 4vw, 43px);
    line-height: 1.04;
}

.events-section-heading > p {
    margin: 0;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.5;
}

.events-guide-grid {
    display: grid;
    gap: 16px;
}

.events-guide-grid--upcoming {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.events-guide-grid--archive {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.event-guide-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(16, 24, 20, 0.05);
}

.event-guide-card > a {
    display: flex;
    height: 100%;
    flex-direction: column;
    color: var(--ink);
    text-decoration: none;
}

.event-guide-card__visual {
    position: relative;
    display: grid;
    aspect-ratio: 16 / 9;
    margin: 0;
    overflow: hidden;
    place-items: center;
    background: #e9efe9;
}

.event-guide-card__visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 220ms ease;
}

.event-guide-card__fallback {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: var(--green-dark);
    font-size: 42px;
}

.event-guide-card__status {
    position: absolute;
    top: 11px;
    left: 11px;
    padding: 6px 9px;
    border-radius: 999px;
    background: var(--yellow);
    color: #17201c;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.event-guide-card__status--archive {
    background: rgba(18, 27, 23, 0.9);
    color: #fff;
}

.event-guide-card__copy {
    display: flex;
    height: 100%;
    min-width: 0;
    flex-direction: column;
    padding: 16px;
}

.event-guide-card__type {
    margin: 0 0 6px;
    color: var(--green);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-transform: uppercase;
}

.event-guide-card h3 {
    margin: 0 0 10px;
    font-size: 23px;
    line-height: 1.08;
}

.event-guide-card__date,
.event-guide-card__venue {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin: 0 0 7px;
    color: var(--ink);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.35;
}

.event-guide-card__date i,
.event-guide-card__venue i {
    width: 14px;
    margin-top: 2px;
    color: var(--green);
    text-align: center;
}

.event-guide-card__note,
.event-guide-card__summary {
    display: -webkit-box;
    margin: 3px 0 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.event-guide-card__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0 0 9px;
}

.event-guide-card__facts span {
    padding: 5px 8px;
    border-radius: 999px;
    background: #eef4ef;
    color: #3f5148;
    font-size: 12px;
    font-weight: 800;
}

.event-guide-card__action {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    margin-top: auto;
    padding-top: 14px;
    color: var(--green-dark);
    font-size: 13px;
    font-weight: 900;
}

.event-guide-card > a:hover img,
.event-guide-card > a:focus-visible img {
    transform: scale(1.035);
}

.event-guide-card > a:hover h3,
.event-guide-card > a:focus-visible h3 {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.events-coverage-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.events-coverage-card {
    display: grid;
    grid-template-columns: 168px minmax(0, 1fr);
    gap: 14px;
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(16, 24, 20, 0.04);
}

.events-coverage-card--lead {
    grid-column: 1 / -1;
    grid-template-columns: minmax(300px, 0.9fr) minmax(0, 1.1fr);
    align-items: stretch;
    padding: 15px;
}

.events-coverage-card__image {
    display: block;
    min-height: 116px;
    overflow: hidden;
    border-radius: 9px;
    background: #e9efe9;
}

.events-coverage-card--lead .events-coverage-card__image {
    min-height: 250px;
}

.events-coverage-card__image img,
.events-coverage-card__image > span {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.events-coverage-card__copy {
    min-width: 0;
}

.events-coverage-card .item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 12px;
    margin: 0;
}

.events-coverage-card h3 {
    margin: 6px 0 7px;
    font-size: 21px;
    line-height: 1.14;
}

.events-coverage-card--lead h3 {
    margin-top: 10px;
    font-size: clamp(27px, 4vw, 40px);
    line-height: 1.04;
}

.events-coverage-card h3 a {
    color: var(--ink);
    text-decoration: none;
}

.events-coverage-card h3 a:hover,
.events-coverage-card h3 a:focus-visible {
    color: var(--green-dark);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.events-coverage-card__copy > p:not(.item-meta) {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.events-coverage-card--lead .events-coverage-card__copy {
    align-self: center;
    padding: clamp(8px, 2vw, 24px);
}

.events-pagination {
    align-items: center;
}

@media (max-width: 980px) {
    .events-guide-grid--upcoming,
    .events-guide-grid--archive {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .events-coverage-card--lead {
        grid-template-columns: minmax(240px, 0.85fr) minmax(0, 1.15fr);
    }
}

@media (max-width: 760px) {
    .events-section-heading {
        grid-template-columns: 1fr;
        gap: 8px;
        align-items: start;
    }

    .events-coverage-grid {
        grid-template-columns: 1fr;
    }

    .events-coverage-card--lead {
        grid-column: auto;
        grid-template-columns: 1fr;
    }

    .events-coverage-card--lead .events-coverage-card__image {
        aspect-ratio: 16 / 9;
        min-height: 0;
    }
}

@media (max-width: 640px) {
    .category-landing--events {
        gap: 42px;
        overflow: hidden;
        padding-bottom: 52px;
    }

    .events-page-hero {
        gap: 18px;
        padding: 20px 16px;
        border-radius: 16px;
    }

    .events-page-hero__copy h1 {
        font-size: clamp(38px, 14vw, 54px);
    }

    .events-page-hero__copy > p:last-child {
        font-size: 16px;
    }

    .events-stat-row {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 7px;
    }

    .events-stat-row a {
        padding: 11px 8px;
        font-size: 11px;
        line-height: 1.25;
    }

    .events-stat-row strong {
        font-size: 23px;
    }

    .events-jump-nav {
        flex-wrap: nowrap;
        margin-inline: -16px;
        padding-inline: 16px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .events-jump-nav::-webkit-scrollbar {
        display: none;
    }

    .events-jump-nav a {
        flex: 0 0 auto;
    }

    .events-guide-grid {
        display: flex;
        gap: 12px;
        margin-inline: -16px;
        padding: 2px 16px 10px;
        overflow-x: auto;
        scroll-padding-inline: 16px;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

    .events-guide-grid::-webkit-scrollbar {
        display: none;
    }

    .event-guide-card {
        flex: 0 0 min(82vw, 330px);
        scroll-snap-align: start;
    }

    .events-coverage-card {
        grid-template-columns: 112px minmax(0, 1fr);
        gap: 11px;
        padding: 10px;
    }

    .events-coverage-card--lead {
        grid-template-columns: 1fr;
        padding: 12px;
    }

    .events-coverage-card__image {
        width: 112px;
        min-height: 82px;
    }

    .events-coverage-card--lead .events-coverage-card__image {
        width: 100%;
    }

    .events-coverage-card h3 {
        margin-top: 5px;
        font-size: 17px;
    }

    .events-coverage-card--lead h3 {
        font-size: 26px;
    }

    .events-coverage-card:not(.events-coverage-card--lead) .events-coverage-card__copy > p:not(.item-meta) {
        display: none;
    }

    .events-coverage-card:not(.events-coverage-card--lead) .item-meta span {
        display: none;
    }

    .events-coverage-card--lead .events-coverage-card__copy {
        padding: 5px 2px 3px;
    }

}

/* Rich internal-taxonomy layout shared by genres, features, and origins.
   Side support is added only when the term has enough catalog material. */
.taxonomy-collection--mmorpg {
    --mmorpg-ink: #111;
    --mmorpg-soft: #f3f3ef;
    --mmorpg-line: rgba(17, 17, 17, 0.14);
    --taxonomy-item-accent: #f5df2e;
    --taxonomy-item-accent-dark: #665700;
    gap: 28px;
}

.taxonomy-collection--mmorpg > .content-band:not(.taxonomy-collection__hero) {
    padding: clamp(24px, 4vw, 44px);
    border-color: var(--mmorpg-line);
    border-radius: 20px;
    box-shadow: 0 18px 44px rgba(17, 17, 17, 0.06);
}

.mmorpg-hero {
    position: relative;
    isolation: isolate;
    grid-template-columns: 1fr;
    align-items: center;
    min-height: 0;
    overflow: hidden;
    padding: clamp(28px, 4vw, 44px);
    border-color: rgba(255, 216, 61, 0.28);
    border-radius: 22px;
    background:
        radial-gradient(circle at 10% 8%, rgba(255, 216, 61, 0.2), transparent 30%),
        linear-gradient(135deg, #070707 0%, #111 55%, #1d1d1a 100%);
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.26);
}

.mmorpg-hero__copy {
    display: grid;
    gap: 15px;
    min-width: 0;
    max-width: 960px;
}

.mmorpg-hero__heading {
    display: flex;
    gap: 4px;
    align-items: flex-start;
    min-width: 0;
}

.mmorpg-hero__copy .eyebrow {
    margin: 0;
    color: var(--yellow);
    line-height: 1;
    letter-spacing: 0.12em;
    white-space: nowrap;
}

.mmorpg-hero__copy .eyebrow span {
    margin-inline: 6px;
    color: rgba(255, 255, 255, 0.4);
}

.mmorpg-hero h1 {
    max-width: 720px;
    margin-bottom: -0.13em;
    font-size: clamp(52px, 7vw, 82px);
    letter-spacing: -0.075em;
    transform: translateY(-0.13em);
}

.mmorpg-hero__lead {
    max-width: 820px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: clamp(17px, 1.7vw, 20px);
    line-height: 1.58;
}

.mmorpg-section-heading {
    display: grid;
    grid-template-columns: minmax(240px, 0.78fr) minmax(0, 1.22fr);
    gap: clamp(24px, 5vw, 72px);
    align-items: end;
    margin-bottom: 28px;
}

.mmorpg-section-heading .eyebrow {
    margin: 0 0 4px;
    color: #6e5c00;
    font-size: 15px;
    font-weight: 900;
    letter-spacing: 0;
}

.mmorpg-section-heading h2 {
    margin: 0;
    color: var(--mmorpg-ink);
    font-size: 30px;
    line-height: 1.05;
    letter-spacing: 0;
}

.mmorpg-section-heading > p {
    max-width: 700px;
    margin: 0;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.62;
}

.mmorpg-pillars {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px;
}

.mmorpg-pillars article {
    min-width: 0;
    padding: 22px;
    border: 1px solid var(--mmorpg-line);
    border-radius: 15px;
    background: var(--mmorpg-soft);
}

.mmorpg-pillars i {
    display: grid;
    width: 44px;
    height: 44px;
    margin-bottom: 34px;
    place-items: center;
    border-radius: 50%;
    background: var(--yellow);
    color: #111;
    font-size: 18px;
}

.mmorpg-pillars h3 {
    margin: 0 0 8px;
    font-size: 21px;
    line-height: 1.16;
}

.mmorpg-pillars p {
    margin: 0;
    color: var(--muted);
    line-height: 1.5;
}

.mmorpg-definition {
    display: grid;
    grid-template-columns: minmax(160px, 0.3fr) minmax(0, 1fr);
    gap: 28px;
    align-items: center;
    margin-top: 14px;
    padding: 24px;
    border-radius: 15px;
    background: #111;
    color: #fff;
}

.mmorpg-definition > span {
    color: var(--yellow);
    font-size: clamp(25px, 3vw, 34px);
    font-weight: 900;
    letter-spacing: -0.04em;
}

.mmorpg-definition h3 {
    margin: 0 0 7px;
    font-size: 21px;
}

.mmorpg-definition p {
    margin: 0;
    color: rgba(255, 255, 255, 0.72);
    line-height: 1.54;
}

.mmorpg-catalog__controls {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(180px, 230px) auto;
    gap: 12px;
    align-items: end;
    margin-bottom: 18px;
    padding: 15px;
    border: 1px solid var(--mmorpg-line);
    border-radius: 14px;
    background: #fff;
}

.mmorpg-catalog__controls label {
    display: grid;
    gap: 6px;
    color: #4e4e48;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.mmorpg-catalog__input {
    position: relative;
    display: block;
}

.mmorpg-catalog__input i {
    position: absolute;
    top: 50%;
    left: 14px;
    color: #6f6f68;
    transform: translateY(-50%);
    pointer-events: none;
}

.mmorpg-catalog__controls input,
.mmorpg-catalog__controls select {
    width: 100%;
    min-height: 46px;
    box-sizing: border-box;
    border: 1px solid rgba(17, 17, 17, 0.18);
    border-radius: 9px;
    background: #fff;
    color: #111;
    font: inherit;
}

.mmorpg-catalog__controls input {
    padding: 0 13px 0 40px;
}

.mmorpg-catalog__controls select {
    padding: 0 12px;
}

.mmorpg-catalog__controls > strong {
    align-self: center;
    color: #111;
    font-size: 13px;
    white-space: nowrap;
}

.mmorpg-work-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.mmorpg-work-card {
    display: grid;
    grid-template-rows: auto 1fr;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--mmorpg-line);
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(17, 17, 17, 0.045);
    transition: border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.mmorpg-work-card[hidden] {
    display: none;
}

.mmorpg-work-card:hover,
.mmorpg-work-card:focus-within {
    border-color: rgba(17, 17, 17, 0.38);
    transform: translateY(-3px);
    box-shadow: 0 18px 34px rgba(17, 17, 17, 0.09);
}

.mmorpg-work-card__image {
    display: block;
    aspect-ratio: 920 / 430;
    overflow: hidden;
    background: #e8e8e2;
}

.mmorpg-work-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.24s ease;
}

.mmorpg-work-card:hover .mmorpg-work-card__image img,
.mmorpg-work-card:focus-within .mmorpg-work-card__image img {
    transform: scale(1.025);
}

.mmorpg-work-card__copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 16px;
}

.mmorpg-work-card h3 {
    margin: 0 0 8px;
    font-size: 22px;
    line-height: 1.12;
}

.mmorpg-work-card h3 a {
    color: #111;
    text-decoration: none;
}

.mmorpg-work-card__copy > p:not(.item-meta) {
    display: -webkit-box;
    margin: 0 0 18px;
    overflow: hidden;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.48;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.mmorpg-work-card__platforms {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: auto;
}

.mmorpg-work-card__platforms span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 26px;
    padding: 0 8px;
    border-radius: 999px;
    background: #ededE8;
    color: #333;
    font-size: 11px;
    font-weight: 800;
}

.mmorpg-work-card__platforms i {
    width: 13px;
    color: #111;
    font-size: 12px;
    text-align: center;
}

.mmorpg-work-card__platforms .mmorpg-work-card__year {
    background: #111;
    color: #fff;
}

.mmorpg-catalog__empty {
    margin: 0;
    padding: 30px;
    border: 1px dashed rgba(17, 17, 17, 0.24);
    border-radius: 14px;
    color: var(--muted);
    text-align: center;
}

.mmorpg-news-layout {
    grid-template-columns: minmax(0, 1.65fr) minmax(310px, 0.75fr);
    gap: 24px;
}

.mmorpg-news-layout.genre-news-layout--without-sidebar {
    grid-template-columns: minmax(0, 1fr);
}

.mmorpg-news-layout .entity-article-column {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.mmorpg-news-layout .entity-hub-column {
    box-sizing: border-box;
    padding: clamp(20px, 3vw, 30px);
    border: 1px solid rgba(17, 17, 17, 0.12);
    border-left: 1px solid rgba(17, 17, 17, 0.12);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(16, 24, 20, 0.045);
}

.mmorpg-news-layout .genre-guide-sidebar {
    display: flex;
    align-self: stretch;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.genre-guide-panel {
    box-sizing: border-box;
    min-width: 0;
    padding: clamp(20px, 3vw, 30px);
    border: 1px solid rgba(17, 17, 17, 0.12);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(16, 24, 20, 0.045);
}

.mmorpg-news-layout .entity-article-column > .section-heading,
.mmorpg-news-layout .entity-hub-column > .section-heading,
.genre-guide-panel > .section-heading {
    align-items: end;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(17, 17, 17, 0.12);
}

.mmorpg-news-layout .entity-article-card {
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 18px;
    padding: 18px 0;
}

.mmorpg-news-layout .entity-article-card__image {
    width: 260px;
    height: 150px;
}

.mmorpg-news-layout .entity-article-card__image .news-visual-fallback {
    display: block;
    width: 100%;
    height: 100%;
}

.mmorpg-news-layout .entity-article-card:nth-child(4n + 1) {
    grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.1fr);
    gap: 24px;
    padding-bottom: 24px;
}

.mmorpg-news-layout .entity-article-card:nth-child(4n + 1) .entity-article-card__image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}

.mmorpg-guide__intro {
    margin: 0 0 18px;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.55;
}

.mmorpg-news-layout .mmorpg-pillars {
    grid-template-columns: 1fr;
}

.mmorpg-news-layout .mmorpg-pillars article {
    padding: 18px;
}

.mmorpg-news-layout .mmorpg-pillars i {
    margin-bottom: 16px;
}

.mmorpg-news-layout .mmorpg-definition {
    grid-template-columns: 1fr;
    gap: 13px;
    margin-top: 14px;
    padding: 20px;
}

.genre-guide-facts {
    display: grid;
    gap: 12px;
}

.genre-guide-facts article {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 13px;
    align-items: start;
    padding: 17px;
    border: 1px solid var(--mmorpg-line);
    border-radius: 14px;
    background: var(--mmorpg-soft);
}

.genre-guide-facts i {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 50%;
    background: var(--yellow);
    color: #111;
}

.genre-guide-facts h3,
.genre-guide-examples h3 {
    margin: 0 0 6px;
    font-size: 18px;
    line-height: 1.2;
}

.genre-guide-facts p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.5;
}

.genre-guide-examples {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--mmorpg-line);
}

.genre-guide-examples ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.genre-guide-examples a {
    color: #555851;
    font-weight: 750;
    text-decoration: underline;
    text-decoration-color: rgba(17, 17, 17, 0.25);
    text-underline-offset: 3px;
}

.genre-guide-examples a:hover,
.genre-guide-examples a:focus-visible {
    color: #111;
    text-decoration-color: #111;
}

.genre-manga-promo {
    position: sticky;
    top: calc(var(--site-header-height) + var(--channel-bar-height) + 18px);
    display: block;
    align-self: stretch;
    min-width: 0;
    overflow: hidden;
    border-radius: 16px;
    background: #000;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 17px 50px rgba(0, 0, 0, 0.45);
    transform: translateZ(0);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.genre-manga-promo:hover,
.genre-manga-promo:focus-visible {
    color: #fff;
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.55);
    transform: scale(1.03);
}

.genre-manga-promo__cover {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 748 / 896;
    overflow: hidden;
}

.genre-manga-promo__cover img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.genre-manga-promo__cover > span {
    position: absolute;
    inset: auto 0 0;
    height: 18%;
    background: linear-gradient(to top, #000 0%, rgba(0, 0, 0, 0.72) 42%, transparent 100%);
    pointer-events: none;
}

.genre-manga-promo > strong {
    position: relative;
    z-index: 1;
    display: block;
    margin-top: -1px;
    padding: 14px 14px 16px;
    background: #000;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.1;
    text-align: center;
}

.mmorpg-work-card h3 a:hover,
.mmorpg-work-card h3 a:focus-visible {
    text-decoration: underline;
    text-decoration-color: #9b7f00;
    text-underline-offset: 3px;
}

@media (max-width: 980px) {
    .mmorpg-work-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mmorpg-news-layout {
        grid-template-columns: 1fr;
    }

    .genre-guide-sidebar {
        align-self: auto;
    }

    .genre-manga-promo {
        position: static;
        width: min(100%, 430px);
        margin-inline: auto;
    }
}

@media (max-width: 760px) {
    .mmorpg-section-heading {
        grid-template-columns: 1fr;
        gap: 15px;
        align-items: start;
    }

    .mmorpg-pillars {
        grid-template-columns: 1fr;
    }

    .mmorpg-pillars article {
        display: grid;
        grid-template-columns: 44px minmax(0, 1fr);
        column-gap: 14px;
        align-items: start;
    }

    .mmorpg-pillars i {
        grid-row: span 2;
        margin-bottom: 0;
    }

    .mmorpg-definition {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .mmorpg-catalog__controls {
        grid-template-columns: 1fr 180px;
    }

    .mmorpg-catalog__controls > strong {
        grid-column: 1 / -1;
    }

    .mmorpg-news-layout .entity-article-card:nth-child(4n + 1) {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .taxonomy-collection--mmorpg {
        gap: 18px;
    }

    .taxonomy-collection--mmorpg > .content-band:not(.taxonomy-collection__hero),
    .mmorpg-hero {
        padding: 21px;
        border-radius: 16px;
    }

    .mmorpg-hero {
        min-height: 0;
        margin-top: 20px;
    }

    .mmorpg-hero h1 {
        font-size: clamp(48px, 17vw, 66px);
    }

    .mmorpg-hero__heading {
        flex-wrap: wrap;
    }

    .mmorpg-hero__heading .eyebrow {
        flex-basis: 100%;
    }

    .mmorpg-section-heading h2 {
        font-size: 30px;
    }

    .mmorpg-catalog__controls,
    .mmorpg-work-grid {
        grid-template-columns: 1fr;
    }

    .mmorpg-catalog__controls > strong {
        grid-column: auto;
        white-space: normal;
    }
}

@media (max-width: 560px) {
    .mmorpg-news-layout .entity-article-card,
    .mmorpg-news-layout .entity-article-card:nth-child(4n + 1) {
        grid-template-columns: 112px minmax(0, 1fr);
        gap: 14px;
    }

    .mmorpg-news-layout .entity-article-card__image,
    .mmorpg-news-layout .entity-article-card:nth-child(4n + 1) .entity-article-card__image {
        width: 112px;
        height: 72px;
        aspect-ratio: auto;
    }

    .mmorpg-news-layout .entity-article-card__description {
        display: none;
    }
}

/* These sections stay on the canonical content-band shell. Only their visual
   panel is removed; width, max-width and centering remain site-wide defaults. */
.taxonomy-collection--mmorpg > .content-band.mmorpg-news,
.taxonomy-collection--mmorpg > .content-band.mmorpg-catalog {
    min-width: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* Top information surfaces continue behind the portal bars, matching the
   article/hub structure while retaining each page family's own palette. */
.platform-page,
.category-landing,
.news-collection-page,
.search-page {
    --top-surface-transition-depth: clamp(72px, 7vw, 110px);
    --top-surface-transition-shift: clamp(32px, 4vw, 56px);
    padding-top: 0;
}

.taxonomy-directory,
.company-directory {
    --top-surface-transition-depth: clamp(36px, 3.5vw, 55px);
    --top-surface-transition-shift: calc(clamp(28px, 3vw, 44px) + 40px);
}

.taxonomy-collection {
    --top-surface-transition-depth: clamp(36px, 3.5vw, 55px);
    --top-surface-transition-shift: calc(clamp(28px, 3vw, 44px) + 40px);
}

.category-landing__hero,
.collection-page__hero,
.search-page__hero {
    display: grid;
    gap: 22px;
    background:
        radial-gradient(circle at 88% 4%, rgba(17, 107, 73, 0.11), transparent 34%),
        linear-gradient(135deg, var(--bg), #fff);
}

.search-page__hero {
    gap: 12px;
}

.search-page {
    --top-surface-transition-depth: clamp(42px, 4vw, 64px);
    --top-surface-transition-shift: clamp(20px, 2.5vw, 30px);
    padding-bottom: clamp(72px, 6vw, 90px);
}

.search-page__hero .section-heading,
.search-page__hero .search-panel,
.collection-page__hero .section-heading {
    margin-top: 0;
    margin-bottom: 0;
}

.search-panel .search-submit-button {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 9px 13px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 7px;
    background: #202622;
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
}

.search-panel .search-submit-button > i {
    font-size: 14px;
    transition: transform 180ms ease;
}

.search-panel .search-submit-button:hover,
.search-panel .search-submit-button:focus-visible {
    border-color: rgba(255, 255, 255, 0.32);
    background: var(--green-dark);
    color: #fff;
}

.search-panel .search-submit-button:hover > i,
.search-panel .search-submit-button:focus-visible > i {
    transform: translateX(3px);
}

/* These heroes use viewport-based inner gutters. Keep the surface itself at
   viewport width because some parent pages are also a centered content-band;
   width: 100% there would apply the shell constraint twice. */
.platform-page > .platform-hero:first-child,
.taxonomy-directory > .taxonomy-directory__hero:first-child,
.taxonomy-collection > .taxonomy-collection__hero:first-child,
.category-landing > .category-landing__hero:first-child,
.category-landing--events > .events-page-hero:first-child,
.category-landing--showcase > .category-showcase-hero:first-child,
.company-directory > .company-directory__head:first-child,
.news-collection-page > .collection-page__hero:first-child,
.search-page > .search-page__hero:first-child {
    position: relative;
    left: 50%;
    box-sizing: border-box;
    width: 100vw;
    max-width: none;
    margin-top: calc((var(--site-header-height) + var(--channel-bar-height)) * -1);
    margin-right: 0;
    margin-bottom: calc(28px - var(--top-surface-transition-shift));
    margin-left: -50vw;
    padding-top: calc(var(--site-header-height) + var(--channel-bar-height) + clamp(32px, 5vw, 64px));
    padding-right: max(calc((100vw - var(--site-shell-max)) / 2), calc(var(--site-shell-gutter) / 2));
    padding-bottom: calc(clamp(28px, 4vw, 50px) + var(--top-surface-transition-depth) + var(--top-surface-transition-shift));
    padding-left: max(calc((100vw - var(--site-shell-max)) / 2), calc(var(--site-shell-gutter) / 2));
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.platform-page > .platform-hero--franchise-detail:first-child {
    padding-right: max(calc((100vw - var(--site-shell-max)) / 2 + 164px), calc(var(--site-shell-gutter) / 2 + 164px));
}

.taxonomy-directory > .taxonomy-directory__hero--discovery:first-child,
.taxonomy-collection--mmorpg > .mmorpg-hero:first-child {
    padding-top: calc(var(--site-header-height) + var(--channel-bar-height) + clamp(38px, 6vw, 76px));
    padding-bottom: calc(clamp(18px, 2.5vw, 32px) + var(--top-surface-transition-depth) + var(--top-surface-transition-shift));
}

.taxonomy-directory > .taxonomy-directory__hero:first-child {
    margin-bottom: calc(16px - var(--top-surface-transition-shift));
}

.search-page > .search-page__hero:first-child {
    margin-bottom: 0;
    padding-bottom: clamp(30px, 3vw, 42px);
}

.search-page > .search-page__hero:first-child + .search-results-section {
    margin-top: 18px;
}

.company-directory > .company-directory__head:first-child {
    gap: 10px;
    background:
        radial-gradient(circle at 12% 0%, rgba(24, 116, 78, 0.13), transparent 32%),
        linear-gradient(135deg, var(--bg), #fff);
}

.category-landing--events > .events-page-hero:first-child {
    margin-bottom: calc(0px - var(--top-surface-transition-shift));
}

@media (max-width: 680px) {
    .platform-page > .platform-hero--franchise-detail:first-child {
        padding-right: calc(var(--site-shell-gutter) / 2);
    }
}

.platform-page > .platform-hero:first-child,
.taxonomy-directory > .taxonomy-directory__hero:first-child,
.taxonomy-collection > .taxonomy-collection__hero:first-child,
.category-landing > .category-landing__hero:first-child,
.category-landing--events > .events-page-hero:first-child,
.company-directory > .company-directory__head:first-child,
.news-collection-page > .collection-page__hero:first-child,
.search-page > .search-page__hero:first-child {
    isolation: isolate;
    overflow: hidden;
    z-index: 0;
}

.platform-page > .platform-hero:first-child ~ *,
.taxonomy-directory > .taxonomy-directory__hero:first-child ~ *,
.taxonomy-collection > .taxonomy-collection__hero:first-child ~ *,
.category-landing > .category-landing__hero:first-child ~ *,
.category-landing--events > .events-page-hero:first-child ~ *,
.category-landing--showcase > .category-showcase-hero:first-child ~ *,
.company-directory > .company-directory__head:first-child ~ *,
.news-collection-page > .collection-page__hero:first-child ~ *,
.search-page > .search-page__hero:first-child ~ * {
    position: relative;
    z-index: 1;
}

.platform-page > .platform-hero:first-child::before,
.taxonomy-directory > .taxonomy-directory__hero:first-child::before,
.taxonomy-collection > .taxonomy-collection__hero:first-child::before,
.category-landing > .category-landing__hero:first-child::before,
.category-landing--events > .events-page-hero:first-child::before,
.company-directory > .company-directory__head:first-child::before,
.news-collection-page > .collection-page__hero:first-child::before,
.search-page > .search-page__hero:first-child::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: linear-gradient(
        to bottom,
        rgba(244, 244, 239, 0) 0%,
        rgba(244, 244, 239, 0) 76%,
        rgba(244, 244, 239, 0.08) 81%,
        rgba(244, 244, 239, 0.22) 86%,
        rgba(244, 244, 239, 0.46) 90%,
        rgba(244, 244, 239, 0.72) 94%,
        rgba(244, 244, 239, 0.9) 97.5%,
        var(--bg) 100%
    );
    pointer-events: none;
}

.platform-page > .platform-hero:first-child > *,
.taxonomy-directory > .taxonomy-directory__hero:first-child > *,
.taxonomy-collection > .taxonomy-collection__hero:first-child > *,
.category-landing > .category-landing__hero:first-child > *,
.category-landing--events > .events-page-hero:first-child > *,
.company-directory > .company-directory__head:first-child > *,
.news-collection-page > .collection-page__hero:first-child > *,
.search-page > .search-page__hero:first-child > * {
    z-index: 1;
}

.platform-page > .platform-hero--index:first-child > * {
    position: relative;
}

@media (min-width: 901px) {
    .platform-page > .platform-hero:first-child::before,
    .taxonomy-directory > .taxonomy-directory__hero:first-child::before,
    .taxonomy-collection > .taxonomy-collection__hero:first-child::before,
    .category-landing > .category-landing__hero:first-child::before,
    .category-landing--events > .events-page-hero:first-child::before,
    .company-directory > .company-directory__head:first-child::before,
    .news-collection-page > .collection-page__hero:first-child::before,
    .search-page > .search-page__hero:first-child::before {
        background: radial-gradient(
            ellipse 138% 100% at 52% 0%,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.08) 81%,
            rgba(244, 244, 239, 0.22) 86%,
            rgba(244, 244, 239, 0.46) 90%,
            rgba(244, 244, 239, 0.72) 94%,
            rgba(244, 244, 239, 0.9) 97.5%,
            var(--bg) 100%
        );
    }
}

/* Company profiles: editorial context first, catalog second and institutional
   details at the end of the page. */
.company-page--organized {
    gap: clamp(28px, 4vw, 52px);
}

.company-page--organized > .platform-hero--company-detail:first-child {
    grid-template-columns: 180px minmax(0, 1fr);
    gap: clamp(26px, 4vw, 52px);
    min-height: clamp(430px, 46vw, 610px);
    align-content: center;
    background: #08100d;
}

.company-page--organized > .platform-hero--company-has-background:first-child::after {
    position: absolute;
    z-index: 0;
    inset: -28px;
    background-image: var(--company-hero-bg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    content: "";
    filter: blur(20px);
    opacity: 0.76;
    pointer-events: none;
    transform: scale(1.04);
}

.company-page--organized > .platform-hero--company-detail:first-child::before {
    z-index: 1;
    background:
        radial-gradient(
            ellipse 138% 100% at 52% 0%,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.08) 81%,
            rgba(244, 244, 239, 0.22) 86%,
            rgba(244, 244, 239, 0.46) 90%,
            rgba(244, 244, 239, 0.72) 94%,
            rgba(244, 244, 239, 0.9) 97.5%,
            var(--bg) 100%
        ),
        linear-gradient(90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 42%, rgba(0, 0, 0, 0.38) 76%, rgba(0, 0, 0, 0.64) 100%),
        linear-gradient(180deg, rgba(0, 70, 48, 0.12), rgba(0, 0, 0, 0.8));
}

.company-page--organized > .platform-hero--company-detail:first-child > :not(.platform-hero__back) {
    position: relative;
    z-index: 2;
}

.company-page--organized .platform-hero__back {
    z-index: 3;
}

.company-page--organized .platform-hero__copy {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.company-page--organized .platform-hero__copy .eyebrow,
.company-page--organized .platform-hero__copy h1 {
    margin: 0;
}

.company-page--organized .platform-hero__copy h1 {
    max-width: 960px;
    font-size: clamp(54px, 7vw, 96px);
    text-wrap: balance;
}

.company-page--organized .company-hero__stats {
    margin-top: 4px;
}

.company-hero__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 4px;
}

.company-hero__nav a {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    padding: 0 14px;
    border: 1px solid rgba(126, 230, 178, 0.38);
    border-radius: 999px;
    background: rgba(5, 10, 9, 0.56);
    color: #fff;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
    backdrop-filter: blur(10px);
}

.company-hero__nav a:hover,
.company-hero__nav a:focus-visible {
    border-color: #7ee6b2;
    background: #7ee6b2;
    color: #0a1410;
}

.company-page--organized > .company-lead,
.company-page--organized > .category-news-section,
.company-page--organized > .company-hub-section,
.company-page--organized > .company-information {
    min-width: 0;
}

.company-page--organized > .category-news-section,
.company-page--organized > .company-hub-section,
.company-page--organized > .company-information {
    box-sizing: border-box;
    padding: clamp(20px, 3vw, 32px);
    border: 1px solid rgba(17, 17, 17, 0.12);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(16, 24, 20, 0.045);
}

.company-page--organized > .category-news-section .section-heading,
.company-page--organized > .company-hub-section .section-heading {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(17, 17, 17, 0.12);
}

.company-page--organized > .category-news-section .section-heading h2,
.company-page--organized > .company-hub-section .section-heading h2,
.company-information__heading h2 {
    font-size: clamp(32px, 4vw, 50px);
    line-height: 1;
    text-wrap: balance;
}

.company-page--organized .category-lead__story {
    min-height: 330px;
    border-radius: 15px;
}

.company-page--organized .category-lead__list {
    border-radius: 15px;
}

.company-page--organized .category-news-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.company-page--organized .category-work-grid--featured {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.company-page--organized .work-card {
    border-color: rgba(17, 17, 17, 0.13);
    box-shadow: 0 9px 24px rgba(16, 24, 20, 0.04);
}

.company-information__heading {
    align-items: end;
    margin-bottom: 18px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(17, 17, 17, 0.12);
}

.company-information__heading > div {
    display: grid;
    gap: 4px;
}

.company-information__heading .eyebrow,
.company-information__heading h2 {
    margin: 0;
}

.company-information__heading > a {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    color: var(--green-dark);
    font-weight: 850;
    text-decoration: none;
}

.company-information__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.company-information__item {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 13px;
    min-width: 0;
    align-items: center;
    min-height: 88px;
    padding: 14px 16px;
    border: 1px solid rgba(17, 17, 17, 0.13);
    border-radius: 13px;
    background: #f5f6f2;
    color: var(--ink);
    text-decoration: none;
}

.company-information__item > i {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 12px;
    background: #e4eee8;
    color: var(--green-dark);
    font-size: 19px;
}

.company-information__item > span {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.company-information__item small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.company-information__item strong {
    font-size: 19px;
    line-height: 1.18;
}

.company-information__item em {
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    font-style: normal;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.company-information__item--official:hover,
.company-information__item--official:focus-visible {
    border-color: rgba(0, 92, 67, 0.42);
    background: #edf6f0;
    transform: translateY(-2px);
}

@media (max-width: 900px) {
    .company-page--organized > .platform-hero--company-detail:first-child {
        grid-template-columns: 142px minmax(0, 1fr);
    }

    .platform-hero--company-detail .company-hero__logo {
        width: 142px;
    }

    .company-page--organized .category-work-grid--featured {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .company-page--organized > .platform-hero--company-detail:first-child {
        grid-template-columns: 1fr;
        align-content: end;
        min-height: 620px;
    }

    .platform-hero--company-detail .company-hero__logo {
        width: 118px;
    }

    .company-page--organized .category-news-grid,
    .company-page--organized .category-work-grid--featured,
    .company-information__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    .company-page--organized .category-news-grid,
    .company-page--organized .category-work-grid--featured,
    .company-information__grid {
        grid-template-columns: 1fr;
    }

    .company-information__heading {
        display: grid;
        gap: 10px;
    }
}

/* Internal taxonomy pages share one catalog-first system. MMORPG keeps its
   dedicated experience above and is intentionally excluded from these rules. */
.taxonomy-collection--standard {
    --taxonomy-item-accent: #7ee6b2;
    --taxonomy-item-accent-dark: #07593f;
    gap: clamp(30px, 4vw, 54px);
}

.taxonomy-collection--standard-genre {
    --taxonomy-item-accent: #f5df2e;
    --taxonomy-item-accent-dark: #665700;
}

.taxonomy-collection--standard-feature {
    --taxonomy-item-accent: #7ee6b2;
    --taxonomy-item-accent-dark: #07593f;
}

.taxonomy-collection--standard-origin {
    --taxonomy-item-accent: #79d7ea;
    --taxonomy-item-accent-dark: #075467;
}

.taxonomy-collection--standard-release {
    --taxonomy-item-accent: #8fc8ff;
    --taxonomy-item-accent-dark: #164f7d;
}

.taxonomy-collection--standard > .taxonomy-standard-hero:first-child {
    grid-template-columns: minmax(0, 1.35fr) minmax(270px, 0.48fr);
    gap: 24px clamp(34px, 6vw, 90px);
    align-items: end;
    min-height: clamp(430px, 48vw, 650px);
    background:
        radial-gradient(circle at 82% 18%, color-mix(in srgb, var(--taxonomy-item-accent) 24%, transparent), transparent 32%),
        linear-gradient(135deg, #080a09, #101918);
}

.taxonomy-collection--standard > .taxonomy-standard-hero--has-background:first-child::after {
    position: absolute;
    z-index: 0;
    inset: -28px;
    background-image: var(--taxonomy-item-bg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    content: "";
    filter: blur(20px);
    opacity: 0.72;
    pointer-events: none;
    transform: scale(1.04);
}

.taxonomy-collection--standard > .taxonomy-standard-hero:first-child::before {
    z-index: 1;
    background:
        radial-gradient(
            ellipse 138% 100% at 52% 0%,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.08) 81%,
            rgba(244, 244, 239, 0.22) 86%,
            rgba(244, 244, 239, 0.46) 90%,
            rgba(244, 244, 239, 0.72) 94%,
            rgba(244, 244, 239, 0.9) 97.5%,
            var(--bg) 100%
        ),
        linear-gradient(90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.68) 42%, rgba(0, 0, 0, 0.35) 76%, rgba(0, 0, 0, 0.58) 100%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.18), rgba(0, 0, 0, 0.72));
}

.taxonomy-collection--standard > .taxonomy-standard-hero:first-child > * {
    position: relative;
    z-index: 2;
}

.taxonomy-standard-hero__copy {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.taxonomy-standard-hero__copy .eyebrow,
.taxonomy-standard-hero__copy h1,
.taxonomy-standard-hero__copy > p:last-child {
    margin: 0;
}

.taxonomy-standard-hero__copy .eyebrow a {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--taxonomy-item-accent);
    text-decoration-color: color-mix(in srgb, var(--taxonomy-item-accent) 58%, transparent);
    text-underline-offset: 4px;
}

.taxonomy-standard-hero__copy h1 {
    max-width: 1050px;
    font-size: clamp(52px, 8vw, 104px);
    line-height: 0.9;
    text-wrap: balance;
}

.taxonomy-standard-hero__copy > p:last-child {
    max-width: 820px;
    color: rgba(255, 255, 255, 0.8);
    font-size: clamp(17px, 1.6vw, 21px);
    line-height: 1.48;
}

.taxonomy-standard-hero__summary {
    display: grid;
    gap: 11px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 16px;
    background: rgba(5, 8, 7, 0.54);
    backdrop-filter: blur(12px);
}

.taxonomy-standard-hero__summary > p {
    margin: 0;
    color: var(--taxonomy-item-accent);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.taxonomy-standard-hero__summary > div {
    display: grid;
    gap: 8px;
}

.taxonomy-standard-hero__summary span {
    display: flex;
    gap: 7px;
    align-items: baseline;
    padding: 11px 12px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.07);
    color: rgba(255, 255, 255, 0.7);
    font-size: 13px;
    font-weight: 750;
}

.taxonomy-standard-hero__summary strong {
    color: #fff;
    font-size: 23px;
}

.taxonomy-collection--standard > .taxonomy-standard-hero--directory-style:first-child {
    grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.55fr);
    gap: clamp(24px, 4vw, 64px);
    min-height: 0;
    padding-top: calc(var(--site-header-height) + var(--channel-bar-height) + clamp(38px, 6vw, 76px));
    padding-bottom: calc(clamp(18px, 2.5vw, 32px) + var(--top-surface-transition-depth) + var(--top-surface-transition-shift));
}

.taxonomy-standard-hero--directory-style .taxonomy-standard-hero__copy {
    gap: 12px;
}

.taxonomy-standard-hero--directory-style .taxonomy-standard-hero__copy .taxonomy-page-title {
    max-width: none;
    font-size: clamp(42px, 6vw, 74px);
    line-height: 0.96;
}

.taxonomy-standard-hero--directory-style .taxonomy-page-title i {
    color: var(--taxonomy-item-accent);
    font-size: 0.62em;
}

.taxonomy-standard-hero--directory-style .taxonomy-standard-hero__copy > p:last-child {
    max-width: 720px;
    margin-top: 2px;
    color: rgba(255, 255, 255, 0.78);
    font-size: clamp(16px, 1.6vw, 19px);
    line-height: 1.55;
}

.taxonomy-standard-hero--directory-style .taxonomy-standard-hero__summary {
    gap: 12px;
    padding: 18px;
    border-color: rgba(255, 255, 255, 0.14);
    background: rgba(0, 0, 0, 0.34);
    backdrop-filter: blur(10px);
}

.taxonomy-standard-hero--directory-style .taxonomy-standard-hero__summary > p {
    color: rgba(255, 255, 255, 0.58);
    font-size: 12px;
    letter-spacing: 0.06em;
}

.taxonomy-standard-hero--directory-style .taxonomy-standard-hero__summary > .platform-hero__stats {
    display: grid;
    gap: 8px;
}

.taxonomy-standard-hero--directory-style .taxonomy-standard-hero__summary span {
    display: block;
    padding: 11px 12px;
    color: rgba(255, 255, 255, 0.76);
    font-size: 13px;
    font-weight: 700;
}

.taxonomy-standard-hero--directory-style .taxonomy-standard-hero__summary strong {
    margin-right: 5px;
    font-size: 20px;
}

.taxonomy-standard-hero--directory-style .taxonomy-standard-hero__nav a {
    background: rgba(255, 255, 255, 0.07);
    color: rgba(255, 255, 255, 0.76);
    backdrop-filter: none;
}

.taxonomy-standard-hero__nav {
    display: flex;
    grid-column: 1 / -1;
    flex-wrap: wrap;
    gap: 9px;
}

.taxonomy-standard-hero__nav a {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    padding: 0 16px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.32);
    color: #fff;
    font-size: 14px;
    font-weight: 850;
    text-decoration: none;
    backdrop-filter: blur(8px);
}

.taxonomy-standard-hero__nav a:hover,
.taxonomy-standard-hero__nav a:focus-visible {
    border-color: var(--taxonomy-item-accent);
    background: var(--taxonomy-item-accent);
    color: #080808;
}

.taxonomy-collection--standard > .taxonomy-standard-section,
.taxonomy-collection--standard > .taxonomy-standard-explorer {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.taxonomy-standard-heading {
    align-items: end;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(17, 17, 17, 0.13);
}

.taxonomy-standard-heading > div {
    display: grid;
    gap: 5px;
}

.taxonomy-standard-heading .eyebrow,
.taxonomy-standard-heading h2,
.taxonomy-standard-heading > p {
    margin: 0;
}

.taxonomy-standard-heading .eyebrow {
    color: var(--taxonomy-item-accent-dark);
}

.taxonomy-standard-heading h2 {
    font-size: clamp(34px, 4vw, 54px);
    line-height: 0.98;
    text-wrap: balance;
}

.taxonomy-standard-heading > p {
    max-width: 470px;
    color: var(--muted);
    line-height: 1.5;
}

.taxonomy-standard-news-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.taxonomy-standard-news-card {
    display: grid;
    grid-template-columns: minmax(150px, 0.72fr) minmax(0, 1fr);
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(17, 17, 17, 0.13);
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(16, 24, 20, 0.055);
}

.taxonomy-standard-news-card--lead {
    grid-column: 1 / -1;
    grid-template-columns: minmax(330px, 1.4fr) minmax(0, 1fr);
    min-height: 340px;
}

.taxonomy-standard-news-card__image {
    display: block;
    min-height: 190px;
    overflow: hidden;
    background: #e8ece8;
}

.taxonomy-standard-news-card--lead .taxonomy-standard-news-card__image {
    min-height: 340px;
}

.taxonomy-standard-news-card__image img,
.taxonomy-standard-news-card__image > span {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 220ms ease, opacity 220ms ease;
}

.taxonomy-standard-news-card:hover .taxonomy-standard-news-card__image img {
    opacity: 0.94;
    transform: scale(1.025);
}

.taxonomy-standard-news-card__copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    padding: clamp(18px, 2.5vw, 30px);
}

.taxonomy-standard-news-card__copy .item-meta {
    margin: 0 0 10px;
}

.taxonomy-standard-news-card__copy h3 {
    margin: 0 0 10px;
    font-size: clamp(22px, 2.25vw, 32px);
    line-height: 1.08;
}

.taxonomy-standard-news-card--lead .taxonomy-standard-news-card__copy h3 {
    font-size: clamp(30px, 3.4vw, 48px);
}

.taxonomy-standard-news-card__copy h3 a {
    color: var(--ink);
    text-decoration: none;
}

.taxonomy-standard-news-card__copy > p:last-child {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: var(--muted);
    line-height: 1.48;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.taxonomy-standard-work-grid .work-card {
    border-color: rgba(17, 17, 17, 0.14);
    box-shadow: 0 10px 26px rgba(16, 24, 20, 0.045);
}

.taxonomy-standard-work-grid .work-card h3 {
    margin: 0;
    font-size: 21px;
    line-height: 1.12;
}

.taxonomy-standard-work-grid .work-card h3 a {
    color: var(--ink);
    text-decoration: none;
}

.taxonomy-standard-empty {
    margin: 0;
    padding: 24px;
    border: 1px dashed rgba(17, 17, 17, 0.2);
    border-radius: 14px;
    color: var(--muted);
}

.taxonomy-standard-explorer__index {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    color: var(--taxonomy-item-accent-dark);
    font-weight: 850;
    text-decoration: none;
}

.taxonomy-standard-related {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.taxonomy-standard-related > a {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    min-height: 88px;
    padding: 15px 16px;
    border: 1px solid rgba(17, 17, 17, 0.14);
    border-radius: 13px;
    background: #fff;
    color: var(--ink);
    text-decoration: none;
}

.taxonomy-standard-related > a:hover,
.taxonomy-standard-related > a:focus-visible {
    border-color: var(--taxonomy-item-accent-dark);
    box-shadow: 0 10px 24px rgba(16, 24, 20, 0.06);
    transform: translateY(-2px);
}

.taxonomy-standard-related span {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.taxonomy-standard-related strong {
    font-size: 17px;
    line-height: 1.16;
}

.taxonomy-standard-related small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.taxonomy-standard-related > a > i {
    color: var(--taxonomy-item-accent-dark);
}

.taxonomy-standard-families {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(17, 17, 17, 0.1);
}

.taxonomy-standard-families a {
    display: flex;
    gap: 10px;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 0 14px;
    border: 1px solid rgba(17, 17, 17, 0.15);
    border-radius: 999px;
    background: #f3f3ee;
    color: #333835;
    font-weight: 850;
    text-decoration: none;
}

.taxonomy-standard-families a:hover,
.taxonomy-standard-families a:focus-visible,
.taxonomy-standard-families a.is-current {
    border-color: var(--taxonomy-item-accent);
    background: var(--taxonomy-item-accent);
    color: #080808;
}

@media (max-width: 980px) {
    .taxonomy-collection--standard > .taxonomy-standard-hero:first-child {
        grid-template-columns: minmax(0, 1fr) 240px;
    }

    .taxonomy-standard-news-card:not(.taxonomy-standard-news-card--lead) {
        grid-template-columns: 1fr;
    }

    .taxonomy-standard-news-card:not(.taxonomy-standard-news-card--lead) .taxonomy-standard-news-card__image {
        aspect-ratio: 16 / 9;
        min-height: 0;
    }

    .taxonomy-standard-related,
    .taxonomy-standard-families {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .taxonomy-collection--standard > .taxonomy-standard-hero:first-child {
        grid-template-columns: 1fr;
        min-height: 520px;
    }

    .taxonomy-collection--standard > .taxonomy-standard-hero--directory-style:first-child {
        min-height: 0;
    }

    .taxonomy-standard-hero__summary {
        max-width: none;
    }

    .taxonomy-standard-hero__summary > div {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .taxonomy-standard-news-grid,
    .taxonomy-standard-news-card--lead {
        grid-template-columns: 1fr;
    }

    .taxonomy-standard-news-card--lead {
        min-height: 0;
    }

    .taxonomy-standard-news-card--lead .taxonomy-standard-news-card__image {
        aspect-ratio: 16 / 9;
        min-height: 0;
    }
}

@media (max-width: 520px) {
    .taxonomy-directory__category-options {
        grid-template-columns: 1fr;
    }

    .taxonomy-standard-hero__copy h1 {
        font-size: clamp(44px, 15vw, 68px);
    }

    .taxonomy-standard-heading {
        display: grid;
        gap: 10px;
    }

    .taxonomy-standard-related,
    .taxonomy-standard-families {
        grid-template-columns: 1fr;
    }

    .taxonomy-standard-families a {
        justify-content: flex-start;
    }
}

.category-landing--events {
    --top-surface-transition-depth: clamp(18px, 2vw, 28px);
    --top-surface-transition-shift: calc(clamp(24px, 3vw, 38px) + 40px);
    gap: clamp(22px, 3vw, 32px);
}

/* Editorial category landings: Games and Movies & Series. */
.category-landing--showcase {
    --top-surface-transition-depth: clamp(18px, 2vw, 28px);
    --top-surface-transition-shift: calc(clamp(28px, 3.5vw, 46px) + 40px);
    gap: clamp(34px, 5vw, 64px);
    padding-bottom: 70px;
}

.category-landing--showcase > .category-showcase-hero:first-child {
    position: relative;
    left: 50%;
    isolation: isolate;
    box-sizing: border-box;
    width: 100vw;
    max-width: none;
    margin-top: calc((var(--site-header-height) + var(--channel-bar-height)) * -1);
    margin-right: 0;
    margin-bottom: calc(0px - var(--top-surface-transition-shift));
    margin-left: -50vw;
    padding-top: calc(var(--site-header-height) + var(--channel-bar-height) + clamp(38px, 6vw, 76px));
    padding-right: max(calc((100vw - var(--site-shell-max)) / 2), calc(var(--site-shell-gutter) / 2));
    padding-bottom: calc(clamp(36px, 5vw, 64px) + var(--top-surface-transition-depth) + var(--top-surface-transition-shift));
    padding-left: max(calc((100vw - var(--site-shell-max)) / 2), calc(var(--site-shell-gutter) / 2));
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: #0b0b0b;
    box-shadow: none;
}

.category-showcase-hero--has-background::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: var(--category-showcase-bg);
    background-position: center calc(50% + 64px);
    background-repeat: no-repeat;
    background-size: cover;
    filter: blur(20px);
    opacity: 1;
    transform: scale(1.035);
    pointer-events: none;
}

.category-landing--showcase > .category-showcase-hero:first-child::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background-image:
        radial-gradient(
            ellipse 138% 100% at 52% 0%,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.08) 81%,
            rgba(244, 244, 239, 0.22) 86%,
            rgba(244, 244, 239, 0.46) 90%,
            rgba(244, 244, 239, 0.72) 94%,
            rgba(244, 244, 239, 0.9) 97.5%,
            var(--bg) 100%
        ),
        linear-gradient(90deg, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.72) 38%, rgba(0, 0, 0, 0.3) 74%, rgba(0, 0, 0, 0.58) 100%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.8));
    pointer-events: none;
}

.category-showcase-hero > * {
    position: relative;
    z-index: 2;
}

.category-showcase-hero .events-page-hero__copy h1,
.category-showcase-hero .events-page-hero__copy > p:last-child {
    color: #fff;
}

.category-showcase-hero .events-page-hero__copy > p:last-child {
    color: rgba(255, 255, 255, 0.78);
}

.category-showcase-hero .eyebrow {
    color: #7ce1bc;
}

.category-landing--showcase-games .category-showcase-hero .taxonomy-page-title .site-category-icon,
.category-landing--showcase-games .showcase-platforms .platform-brand-card i {
    color: #70ddb5;
}

.category-showcase-hero .events-stat-row a,
.category-showcase-hero .events-jump-nav a {
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(10, 15, 13, 0.68);
    color: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(10px);
}

.category-showcase-hero .events-stat-row strong,
.category-showcase-hero .events-jump-nav a {
    color: #fff;
}

.category-showcase-hero .events-stat-row a:hover,
.category-showcase-hero .events-stat-row a:focus-visible,
.category-showcase-hero .events-jump-nav a:hover,
.category-showcase-hero .events-jump-nav a:focus-visible {
    border-color: var(--yellow);
    background: var(--yellow);
    color: #17201c;
}

.showcase-section,
.showcase-platforms {
    display: grid;
    gap: 18px;
    scroll-margin-top: calc(var(--site-header-height) + var(--channel-bar-height) + 20px);
}

.category-landing:not(.category-landing--events) .work-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1080px) {
    .category-landing:not(.category-landing--events) .work-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.showcase-platforms {
    padding: clamp(22px, 3vw, 34px);
    border: 1px solid rgba(0, 92, 67, 0.17);
    border-radius: 18px;
    background: linear-gradient(135deg, #edf6f0, #fffdf4);
}

.showcase-platforms .platform-brand-grid {
    margin-top: 0;
}

.showcase-platforms .platform-brand-card:hover,
.showcase-platforms .platform-brand-card:focus-visible {
    border-color: #70ddb5;
}

/* Platform families now live inside Games and keep their own visual identity. */
.platform-page--brand {
    --platform-brand-accent: #79dfbd;
    --platform-brand-ink: #087153;
    --platform-brand-rgb: 42, 164, 122;
    --taxonomy-item-accent: var(--platform-brand-accent);
    --taxonomy-item-accent-dark: var(--platform-brand-ink);
}

.platform-page--brand[data-platform-brand="windows-pc"] {
    --platform-brand-accent: #4db1ff;
    --platform-brand-ink: #0067b8;
    --platform-brand-rgb: 0, 120, 212;
}

.platform-page--brand[data-platform-brand="playstation"] {
    --platform-brand-accent: #72b3ff;
    --platform-brand-ink: #005eb8;
    --platform-brand-rgb: 0, 112, 204;
}

.platform-page--brand[data-platform-brand="xbox"] {
    --platform-brand-accent: #76d36b;
    --platform-brand-ink: #107c10;
    --platform-brand-rgb: 16, 124, 16;
}

.platform-page--brand[data-platform-brand="nintendo"] {
    --platform-brand-accent: #ff777f;
    --platform-brand-ink: #d90012;
    --platform-brand-rgb: 230, 0, 18;
}

.platform-page--brand[data-platform-brand="general"] {
    --platform-brand-accent: #a59aff;
    --platform-brand-ink: #5846c7;
    --platform-brand-rgb: 88, 70, 199;
}

.platform-page--brand[data-platform-brand="smartphones"] {
    --platform-brand-accent: #65dbc0;
    --platform-brand-ink: #087f6a;
    --platform-brand-rgb: 8, 127, 106;
}

.platform-page--brand > .platform-hero--brand:first-child {
    isolation: isolate;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 18%, rgba(var(--platform-brand-rgb), 0.38), transparent 34%),
        #090d0c;
}

.platform-page--brand > .platform-hero--has-background:first-child::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: var(--platform-hero-bg);
    background-position: center calc(50% + 64px);
    background-repeat: no-repeat;
    background-size: cover;
    filter: blur(20px);
    opacity: 1;
    transform: scale(1.035);
    pointer-events: none;
}

.platform-page--brand > .platform-hero--brand:first-child::before {
    z-index: 1;
    background-image:
        radial-gradient(
            ellipse 138% 100% at 52% 0%,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.08) 81%,
            rgba(244, 244, 239, 0.22) 86%,
            rgba(244, 244, 239, 0.46) 90%,
            rgba(244, 244, 239, 0.72) 94%,
            rgba(244, 244, 239, 0.9) 97.5%,
            var(--bg) 100%
        ),
        linear-gradient(90deg, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.72) 40%, rgba(0, 0, 0, 0.32) 74%, rgba(0, 0, 0, 0.62) 100%),
        linear-gradient(180deg, rgba(var(--platform-brand-rgb), 0.12), rgba(0, 0, 0, 0.84));
}

.platform-page--brand > .platform-hero--brand:first-child > * {
    position: relative;
    z-index: 2;
}

.platform-hero--brand .platform-hero__mark {
    border-color: rgba(var(--platform-brand-rgb), 0.62);
    background: rgba(5, 10, 9, 0.58);
    color: var(--platform-brand-accent);
    box-shadow: 0 18px 44px rgba(var(--platform-brand-rgb), 0.22);
    backdrop-filter: blur(12px);
}

.platform-hero__breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    align-items: center;
    color: var(--platform-brand-accent) !important;
}

.platform-hero__breadcrumb a {
    color: inherit;
    text-underline-offset: 4px;
}

.platform-hero__breadcrumb span {
    color: rgba(255, 255, 255, 0.42);
}

.platform-hero--brand .platform-hero__stats span {
    border-color: rgba(var(--platform-brand-rgb), 0.48);
    background: rgba(5, 10, 9, 0.58);
    backdrop-filter: blur(10px);
}

.platform-hero__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 16px;
}

.platform-hero__nav a {
    padding: 8px 12px;
    border: 1px solid rgba(var(--platform-brand-rgb), 0.52);
    border-radius: 999px;
    background: rgba(5, 10, 9, 0.62);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    backdrop-filter: blur(10px);
}

.platform-hero__nav a:hover,
.platform-hero__nav a:focus-visible {
    border-color: var(--platform-brand-accent);
    background: var(--platform-brand-accent);
    color: #101614;
}

.platform-page--brand .platform-section {
    border-top: 3px solid rgba(var(--platform-brand-rgb), 0.72);
}

.platform-page--brand .platform-section .eyebrow,
.platform-page--brand .platform-work-card__foot,
.platform-page--brand .platform-subplatforms em {
    color: var(--platform-brand-ink);
}

.platform-page--brand .platform-news-card h3 a:hover,
.platform-page--brand .platform-news-card h3 a:focus-visible,
.platform-page--brand .platform-work-card h3 a:hover,
.platform-page--brand .platform-work-card h3 a:focus-visible {
    color: var(--platform-brand-ink);
}

.platform-page--brand .platform-news-card__image,
.platform-page--brand .platform-work-card__image {
    box-shadow: inset 0 0 0 1px rgba(var(--platform-brand-rgb), 0.18);
}

.platform-page--brand .platform-subplatforms span {
    border-color: rgba(var(--platform-brand-rgb), 0.22);
    background: rgba(var(--platform-brand-rgb), 0.07);
}

.platform-standard-variant-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.platform-standard-variant-grid > div {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 11px;
    align-items: center;
    min-height: 82px;
    padding: 14px 15px;
    border: 1px solid rgba(var(--platform-brand-rgb), 0.22);
    border-radius: 13px;
    background: color-mix(in srgb, var(--platform-brand-accent) 7%, #fff);
}

.platform-standard-variant-grid > div > i {
    color: var(--platform-brand-ink);
    font-size: 20px;
}

.platform-standard-variant-grid > div > span {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.platform-standard-variant-grid strong {
    color: var(--ink);
    font-size: 16px;
    line-height: 1.15;
}

.platform-standard-variant-grid small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
}

.platform-standard-community .platform-topic-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.platform-standard-community .platform-topic-list a {
    border-radius: 13px;
    background: #fff;
}

.platform-standard-families {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

@media (max-width: 980px) {
    .platform-standard-variant-grid,
    .platform-standard-families {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .platform-standard-variant-grid,
    .platform-standard-community .platform-topic-list,
    .platform-standard-families {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .platform-page--brand > .platform-hero--has-background:first-child::after {
        background-position: center;
    }

    .platform-hero__nav {
        flex-wrap: nowrap;
        padding-bottom: 4px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .platform-hero__nav::-webkit-scrollbar {
        display: none;
    }

    .platform-hero__nav a {
        flex: 0 0 auto;
    }
}

.showcase-lanes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.showcase-lanes > .showcase-section {
    align-content: start;
    padding: clamp(20px, 3vw, 28px);
    border: 1px solid var(--border);
    border-radius: 16px;
    background: #fff;
}

.showcase-lanes .category-mini-list a {
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 66px;
    padding: 12px 2px;
}

.showcase-lanes .category-mini-list a > i {
    align-self: center;
    color: var(--green);
    font-size: 15px;
}

@media (max-width: 760px) {
    .showcase-lanes {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .category-landing--showcase {
        gap: 42px;
        overflow: hidden;
        padding-bottom: 52px;
    }

    .category-landing--showcase > .category-showcase-hero:first-child {
        gap: 18px;
        padding-right: 16px;
        padding-left: 16px;
    }

    .category-showcase-hero--has-background::after {
        background-position: center;
    }

    .showcase-platforms {
        padding: 20px 16px;
    }

    .category-landing:not(.category-landing--events) .work-grid {
        grid-template-columns: 1fr;
    }
}

/* Unified discovery between every public editorial category. */
.category-explorer {
    display: grid;
    gap: 18px;
    margin-top: 0;
    padding-top: 0;
    scroll-margin-top: calc(var(--site-header-height) + var(--channel-bar-height) + 20px);
}

.category-explorer__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.category-explorer__card {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 12px;
    min-width: 0;
    min-height: 116px;
    align-items: start;
    padding: 17px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fff;
    color: var(--ink);
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(16, 24, 20, 0.04);
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.category-explorer__icon {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    background: #e9f7f0;
    color: #2eaf82;
}

.category-explorer__icon > .site-category-icon {
    color: inherit;
    font-size: 17px;
}

.category-explorer__card > i:last-child {
    align-self: center;
    color: #2eaf82;
    font-size: 14px;
}

.category-explorer__card span {
    min-width: 0;
}

.category-explorer__card strong,
.category-explorer__card small {
    display: block;
}

.category-explorer__card strong {
    font-size: 17px;
    line-height: 1.15;
}

.category-explorer__card small {
    margin-top: 7px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.35;
}

.category-explorer__card:hover,
.category-explorer__card:focus-visible {
    border-color: #70ddb5;
    box-shadow: 0 14px 30px rgba(16, 24, 20, 0.09);
    transform: translateY(-2px);
}

.category-explorer__card.is-current {
    border-color: rgba(26, 139, 99, 0.38);
    background: #eff9f4;
}

.category-explorer__card--all {
    background: #111715;
    color: #fff;
}

.category-explorer__card--all small {
    color: rgba(255, 255, 255, 0.66);
}

.showcase-tabletop {
    padding: clamp(22px, 3vw, 34px);
    border: 1px solid rgba(118, 89, 38, 0.18);
    border-radius: 18px;
    background: linear-gradient(135deg, #f7f1e6, #fffdf8);
}

.showcase-tabletop__more {
    margin-top: 24px;
}

.showcase-tabletop__more summary {
    width: fit-content;
    cursor: pointer;
    list-style: none;
    color: #3f3220;
    font-weight: 800;
    text-decoration: underline;
    text-decoration-color: rgba(118, 89, 38, 0.32);
    text-underline-offset: 4px;
}

.showcase-tabletop__more summary::-webkit-details-marker {
    display: none;
}

.showcase-tabletop__more .work-grid {
    margin-top: 24px;
}

.showcase-tabletop__less-label,
.showcase-tabletop__more[open] .showcase-tabletop__more-label {
    display: none;
}

.showcase-tabletop__more[open] .showcase-tabletop__less-label {
    display: inline;
}

/* Section pages use the same blurred top surface, with an accent suited to each desk. */
.news-collection-page--section {
    --news-section-accent: #78dfbd;
    --news-section-ink: #087153;
    --news-section-rgb: 42, 164, 122;
}

.news-collection-page--section[data-news-section="innovation"] {
    --news-section-accent: #78dced;
    --news-section-ink: #087184;
    --news-section-rgb: 24, 137, 154;
}

.news-collection-page--section[data-news-section="economy"] {
    --news-section-accent: #efd86c;
    --news-section-ink: #756000;
    --news-section-rgb: 170, 139, 16;
}

.news-collection-page--section[data-news-section="sports"] {
    --news-section-accent: #82df9d;
    --news-section-ink: #08783e;
    --news-section-rgb: 20, 133, 65;
}

.news-collection-page--section[data-news-section="society"] {
    --news-section-accent: #ff9b91;
    --news-section-ink: #b33b34;
    --news-section-rgb: 190, 68, 58;
}

.news-collection-page--section > .collection-page__hero--news:first-child {
    isolation: isolate;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 18%, rgba(var(--news-section-rgb), 0.38), transparent 34%),
        #090d0c;
}

.news-collection-page--section > .collection-page__hero--has-background:first-child::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: var(--news-section-bg);
    background-position: center calc(50% + 64px);
    background-repeat: no-repeat;
    background-size: cover;
    filter: blur(20px);
    opacity: 1;
    transform: scale(1.035);
    pointer-events: none;
}

.news-collection-page--section > .collection-page__hero--news:first-child::before {
    z-index: 1;
    background-image:
        radial-gradient(
            ellipse 138% 100% at 52% 0%,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.08) 81%,
            rgba(244, 244, 239, 0.22) 86%,
            rgba(244, 244, 239, 0.46) 90%,
            rgba(244, 244, 239, 0.72) 94%,
            rgba(244, 244, 239, 0.9) 97.5%,
            var(--bg) 100%
        ),
        linear-gradient(90deg, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.72) 40%, rgba(0, 0, 0, 0.3) 74%, rgba(0, 0, 0, 0.62) 100%),
        linear-gradient(180deg, rgba(var(--news-section-rgb), 0.12), rgba(0, 0, 0, 0.84));
}

.news-collection-page--section > .collection-page__hero--news:first-child > * {
    position: relative;
    z-index: 2;
}

.news-collection-page--section .collection-page__head h1,
.news-collection-page--section .collection-page__head > p:last-child {
    color: #fff;
}

.news-collection-page--section .collection-page__head,
.news-collection-page--section .collection-page__pills {
    border-top: 0;
    border-bottom: 0;
    box-shadow: none;
}

.news-collection-page--section .collection-page__head::before,
.news-collection-page--section .collection-page__head::after,
.news-collection-page--section .collection-page__pills::before,
.news-collection-page--section .collection-page__pills::after {
    content: none;
}

.news-collection-page--section .collection-page__head .eyebrow,
.news-collection-page--section .taxonomy-page-title .site-category-icon {
    color: var(--news-section-accent);
}

.news-collection-page--section .collection-page__head > p:last-child {
    max-width: 790px;
    color: rgba(255, 255, 255, 0.78);
    font-size: clamp(16px, 1.7vw, 19px);
}

.news-collection-page--section .collection-page__pills a {
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(5, 10, 9, 0.58);
    color: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(9px);
}

.news-collection-page--section .collection-page__pills a.active,
.news-collection-page--section .collection-page__pills a:hover,
.news-collection-page--section .collection-page__pills a:focus-visible {
    border-color: var(--news-section-accent);
    background: var(--news-section-accent);
    color: #101614;
}

.news-collection-page--section .collection-news-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: none;
}

.news-collection-page--section .collection-news-list .news-item {
    grid-template-columns: 160px minmax(0, 1fr);
    min-width: 0;
    border-radius: 13px;
}

.news-collection-page--section .collection-news-list .news-item:first-child {
    grid-column: 1 / -1;
    grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
    align-items: stretch;
    padding: 15px;
}

.news-collection-page--section .collection-news-list .news-item:first-child .media-thumb {
    min-height: 280px;
}

.news-collection-page--section .collection-news-list .news-item:first-child > div {
    align-self: center;
    padding: clamp(8px, 2vw, 24px);
}

.news-collection-page--section .collection-news-list .news-item:first-child h2 {
    font-size: clamp(27px, 4vw, 40px);
    line-height: 1.04;
}

.news-collection-page--section .collection-news-list .news-item h2 a:hover,
.news-collection-page--section .collection-news-list .news-item h2 a:focus-visible,
.news-collection-page--section .collection-news-list .text-link {
    color: var(--news-section-ink);
}

@media (max-width: 980px) {
    .category-explorer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .news-collection-page--section .collection-news-list .news-item:not(:first-child) {
        grid-template-columns: 130px minmax(0, 1fr);
    }
}

@media (max-width: 760px) {
    .news-collection-page--section .collection-news-list {
        grid-template-columns: 1fr;
    }

    .news-collection-page--section .collection-news-list .news-item:first-child {
        grid-column: auto;
        grid-template-columns: 1fr;
    }

    .news-collection-page--section .collection-news-list .news-item:first-child .media-thumb {
        aspect-ratio: 16 / 9;
        min-height: 0;
    }
}

@media (max-width: 640px) {
    .category-explorer__grid {
        grid-template-columns: 1fr;
    }

    .category-explorer__card {
        min-height: 0;
    }

    .news-collection-page--section > .collection-page__hero--has-background:first-child::after {
        background-position: center;
    }

    .news-collection-page--section .collection-news-list .news-item:not(:first-child) {
        grid-template-columns: 1fr;
    }
}

.taxonomy-directory > .taxonomy-directory__hero--has-background:first-child,
.taxonomy-collection--mmorpg > .mmorpg-hero--has-background:first-child {
    background: #0b0b0b;
}

.taxonomy-directory > .taxonomy-directory__hero--has-background:first-child::after,
.taxonomy-collection--mmorpg > .mmorpg-hero--has-background:first-child::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: var(--taxonomy-hero-bg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter: blur(20px);
    opacity: 1;
    pointer-events: none;
}

.taxonomy-directory > .taxonomy-directory__hero--has-background:first-child::before,
.taxonomy-collection--mmorpg > .mmorpg-hero--has-background:first-child::before {
    z-index: 1;
    background-color: transparent;
    background-image:
        linear-gradient(
            to bottom,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.08) 81%,
            rgba(244, 244, 239, 0.22) 86%,
            rgba(244, 244, 239, 0.46) 90%,
            rgba(244, 244, 239, 0.72) 94%,
            rgba(244, 244, 239, 0.9) 97.5%,
            var(--bg) 100%
        ),
        linear-gradient(
            90deg,
            rgba(0, 0, 0, 0.92) 0%,
            rgba(0, 0, 0, 0.72) 38%,
            rgba(0, 0, 0, 0.28) 74%,
            rgba(0, 0, 0, 0.52) 100%
        ),
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.22),
            rgba(0, 0, 0, 0.78)
        ),
        radial-gradient(
            circle at 12% 100%,
            rgba(255, 216, 61, 0.14),
            transparent 30%
        );
}

.taxonomy-directory > .taxonomy-directory__hero--has-background:first-child > *,
.taxonomy-collection--mmorpg > .mmorpg-hero--has-background:first-child > * {
    position: relative;
    z-index: 2;
}

@media (min-width: 901px) {
    .taxonomy-directory > .taxonomy-directory__hero--has-background:first-child::after,
    .taxonomy-collection--mmorpg > .mmorpg-hero--has-background:first-child::after {
        background-position: center calc(50% + 64px);
    }

    .taxonomy-directory > .taxonomy-directory__hero--has-background:first-child::before,
    .taxonomy-collection--mmorpg > .mmorpg-hero--has-background:first-child::before {
        background-image:
            radial-gradient(
                ellipse 138% 100% at 52% 0%,
                rgba(244, 244, 239, 0) 0%,
                rgba(244, 244, 239, 0) 76%,
                rgba(244, 244, 239, 0.08) 81%,
                rgba(244, 244, 239, 0.22) 86%,
                rgba(244, 244, 239, 0.46) 90%,
                rgba(244, 244, 239, 0.72) 94%,
                rgba(244, 244, 239, 0.9) 97.5%,
                var(--bg) 100%
            ),
            linear-gradient(
                90deg,
                rgba(0, 0, 0, 0.92) 0%,
                rgba(0, 0, 0, 0.72) 38%,
                rgba(0, 0, 0, 0.28) 74%,
                rgba(0, 0, 0, 0.52) 100%
            ),
            linear-gradient(
                180deg,
                rgba(0, 0, 0, 0.22),
                rgba(0, 0, 0, 0.78)
            ),
            radial-gradient(
                circle at 12% 100%,
                rgba(255, 216, 61, 0.14),
                transparent 30%
            );
    }
}

/* Franchise profiles: contextual backdrop, clear internal navigation and
   catalog cards that expose useful metadata without adding editorial filler. */
.franchise-page--organized {
    --top-surface-transition-depth: clamp(36px, 4vw, 56px);
    --top-surface-transition-shift: clamp(28px, 3.5vw, 46px);
    gap: clamp(18px, 2vw, 26px);
}

.franchise-page--organized > .platform-hero--franchise-detail:first-child {
    grid-template-columns: 170px minmax(0, 1fr);
    gap: clamp(26px, 4vw, 52px);
    min-height: clamp(400px, 42vw, 540px);
    align-content: center;
    margin-bottom: calc(0px - var(--top-surface-transition-shift));
    background: #0b0b0a;
}

.franchise-page--organized > .platform-hero--franchise-has-background:first-child::after {
    position: absolute;
    z-index: 0;
    inset: -28px;
    background-image: var(--franchise-hero-bg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    content: "";
    filter: blur(18px);
    opacity: 0.74;
    pointer-events: none;
    transform: scale(1.04);
}

.franchise-page--organized > .platform-hero--franchise-detail:first-child::before {
    z-index: 1;
    background:
        radial-gradient(
            ellipse 138% 100% at 52% 0%,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.08) 81%,
            rgba(244, 244, 239, 0.22) 86%,
            rgba(244, 244, 239, 0.46) 90%,
            rgba(244, 244, 239, 0.72) 94%,
            rgba(244, 244, 239, 0.9) 97.5%,
            var(--bg) 100%
        ),
        linear-gradient(90deg, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.7) 43%, rgba(0, 0, 0, 0.36) 76%, rgba(0, 0, 0, 0.62) 100%),
        linear-gradient(180deg, rgba(69, 48, 0, 0.08), rgba(0, 0, 0, 0.82));
}

.franchise-page--organized > .platform-hero--franchise-detail:first-child > :not(.platform-hero__back) {
    position: relative;
    z-index: 2;
}

.franchise-page--organized .platform-hero__portrait,
.franchise-page--organized .platform-hero__mark {
    width: 170px;
    border-color: rgba(255, 255, 255, 0.22);
    border-radius: 26px;
    box-shadow: 0 20px 46px rgba(0, 0, 0, 0.34);
}

.franchise-page--organized .platform-hero__copy {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.franchise-page--organized .platform-hero__copy .eyebrow,
.franchise-page--organized .platform-hero__copy h1,
.franchise-page--organized .platform-hero__copy > p {
    margin: 0;
}

.franchise-page--organized .platform-hero__copy .eyebrow {
    color: #f5df2e;
}

.franchise-page--organized .platform-hero__copy > p:not(.eyebrow, .franchise-hero__meta) {
    max-width: 850px;
    color: rgba(255, 255, 255, 0.82);
    font-size: clamp(16px, 1.55vw, 20px);
    line-height: 1.5;
}

.franchise-page--organized .platform-hero__back {
    z-index: 3;
    border-color: rgba(245, 223, 46, 0.42);
    background: rgba(5, 5, 4, 0.58);
    backdrop-filter: blur(10px);
}

.franchise-page--organized .platform-hero__back:hover,
.franchise-page--organized .platform-hero__back:focus-visible {
    border-color: #f5df2e;
    background: #f5df2e;
    color: #111;
}

.franchise-hero__meta {
    display: flex;
    gap: 8px;
    color: rgba(255, 255, 255, 0.72) !important;
    font-size: 14px !important;
    font-weight: 800;
}

.franchise-hero__stats {
    margin-top: 4px;
}

.franchise-hero__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 4px;
}

.franchise-hero__nav a {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    padding: 0 14px;
    border: 1px solid rgba(245, 223, 46, 0.38);
    border-radius: 999px;
    background: rgba(5, 5, 4, 0.56);
    color: #fff;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
    backdrop-filter: blur(10px);
}

.franchise-hero__nav a:hover,
.franchise-hero__nav a:focus-visible {
    border-color: #f5df2e;
    background: #f5df2e;
    color: #111;
}

.franchise-page--organized .entity-content-layout,
.company-page--organized .entity-content-layout {
    grid-template-columns: minmax(0, 1.65fr) minmax(310px, 0.75fr);
    gap: 24px;
}

.franchise-page--organized .entity-article-column,
.franchise-page--organized .entity-hub-column,
.company-page--organized .entity-article-column,
.company-page--organized .entity-hub-column {
    box-sizing: border-box;
    padding: clamp(20px, 3vw, 30px);
    border: 1px solid rgba(17, 17, 17, 0.12);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(16, 24, 20, 0.045);
    scroll-margin-top: calc(var(--site-header-height) + var(--channel-bar-height) + 20px);
}

.franchise-page--organized .entity-article-column,
.company-page--organized .entity-article-column {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.franchise-page--organized .entity-hub-column,
.company-page--organized .entity-hub-column {
    padding-left: clamp(20px, 3vw, 30px);
    border-left: 1px solid rgba(17, 17, 17, 0.12);
}

.franchise-page--organized .entity-article-column > .section-heading,
.franchise-page--organized .entity-hub-column > .section-heading,
.company-page--organized .entity-article-column > .section-heading,
.company-page--organized .entity-hub-column > .section-heading {
    align-items: end;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(17, 17, 17, 0.12);
}

.franchise-page--organized .section-heading h2,
.company-page--organized .entity-content-layout .section-heading h2 {
    line-height: 1.02;
    text-wrap: balance;
}

.entity-section-count {
    color: var(--green-dark);
    font-size: 13px;
    white-space: nowrap;
}

.franchise-page--organized .entity-article-card,
.company-page--organized .entity-article-card {
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 18px;
    padding: 18px 0;
}

.franchise-page--organized .entity-article-card__image,
.company-page--organized .entity-article-card__image {
    width: 260px;
    height: 150px;
}

.franchise-page--organized .entity-article-card__image .news-visual-fallback,
.company-page--organized .entity-article-card__image .news-visual-fallback {
    display: block;
    width: 100%;
    height: 100%;
}

.franchise-page--organized .entity-article-card:nth-child(4n + 1),
.company-page--organized .entity-article-card:nth-child(4n + 1) {
    grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.1fr);
    gap: 24px;
    padding-bottom: 24px;
}

.franchise-page--organized .entity-article-card:nth-child(4n + 1) .entity-article-card__image,
.company-page--organized .entity-article-card:nth-child(4n + 1) .entity-article-card__image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}

.franchise-page--organized .entity-hub-list,
.company-page--organized .entity-hub-list {
    gap: 0;
}

.franchise-page--organized .entity-hub-card,
.franchise-page--organized .entity-hub-card:first-child,
.company-page--organized .entity-hub-card,
.company-page--organized .entity-hub-card:first-child {
    padding: 14px 0;
    border: 0;
    border-bottom: 1px solid rgba(17, 17, 17, 0.11);
    border-radius: 0;
    background: transparent;
}

.franchise-page--organized .entity-hub-card:first-child,
.company-page--organized .entity-hub-card:first-child {
    padding-top: 0;
}

.franchise-page--organized .entity-hub-card.has-image,
.company-page--organized .entity-hub-card.has-image {
    grid-template-columns: 146px minmax(0, 1fr);
    gap: 15px;
}

.franchise-page--organized .entity-hub-card img,
.company-page--organized .entity-hub-card img {
    width: 146px;
    height: auto;
    aspect-ratio: 920 / 430;
    object-fit: contain;
    background: transparent;
}

.franchise-page--organized .entity-hub-card:hover,
.franchise-page--organized .entity-hub-card:focus-visible,
.company-page--organized .entity-hub-card:hover,
.company-page--organized .entity-hub-card:focus-visible {
    border-color: rgba(11, 107, 71, 0.32);
    background: transparent;
}

@media (max-width: 980px) {
    .franchise-page--organized .entity-content-layout,
    .company-page--organized .entity-content-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .franchise-page--organized > .platform-hero--franchise-detail:first-child {
        grid-template-columns: 1fr;
        align-content: end;
        min-height: 640px;
    }

    .franchise-page--organized .platform-hero__portrait,
    .franchise-page--organized .platform-hero__mark {
        width: 118px;
    }

    .franchise-page--organized .entity-article-card:nth-child(4n + 1),
    .company-page--organized .entity-article-card:nth-child(4n + 1) {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .franchise-page--organized .entity-article-card,
    .franchise-page--organized .entity-article-card:nth-child(4n + 1),
    .company-page--organized .entity-article-card,
    .company-page--organized .entity-article-card:nth-child(4n + 1) {
        grid-template-columns: 112px minmax(0, 1fr);
        gap: 14px;
    }

    .franchise-page--organized .entity-article-card__image,
    .franchise-page--organized .entity-article-card:nth-child(4n + 1) .entity-article-card__image,
    .company-page--organized .entity-article-card__image,
    .company-page--organized .entity-article-card:nth-child(4n + 1) .entity-article-card__image {
        width: 112px;
        height: 72px;
        aspect-ratio: auto;
    }

    .franchise-page--organized .entity-article-card__description,
    .company-page--organized .entity-article-card__description {
        display: none;
    }
}

/* Related-genre explorer uses one compact panel contract on every genre page,
   including the MMORPG experience. */
.taxonomy-collection--standard-genre > .content-band.taxonomy-standard-explorer,
.taxonomy-collection--mmorpg > .content-band.mmorpg-explorer {
    box-sizing: border-box;
    padding: 24px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(16, 24, 20, 0.05);
}

/* Internal platform pages deliberately share the complete rich-taxonomy
   contract used by genres. Keep every grid track shrinkable so neither the
   article list nor the platform picker can widen the canonical site shell. */
.platform-page--genre-system,
.platform-page--genre-system > .content-band,
.platform-page--genre-system .platform-news-layout,
.platform-page--genre-system .entity-article-column,
.platform-page--genre-system .platform-choice-sidebar,
.platform-page--genre-system .mmorpg-work-grid,
.platform-page--genre-system .mmorpg-work-card {
    min-width: 0;
    max-width: 100%;
}

.platform-choice-panel {
    min-width: 0;
}

.platform-choice-list {
    display: grid;
    gap: 9px;
}

.platform-choice-list__item {
    --platform-choice-accent: #087f6a;
    --platform-choice-rgb: 8, 127, 106;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 12px;
    gap: 12px;
    align-items: center;
    min-width: 0;
    padding: 13px;
    border: 1px solid rgba(var(--platform-choice-rgb), 0.22);
    border-radius: 13px;
    background: rgba(var(--platform-choice-rgb), 0.055);
    color: #252823;
    text-decoration: none;
    transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.platform-choice-list__item > i:first-child {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 50%;
    background: rgba(var(--platform-choice-rgb), 0.12);
    color: var(--platform-choice-accent);
    font-size: 17px;
}

.platform-choice-list__item > i:last-child {
    color: var(--platform-choice-accent);
    font-size: 12px;
}

.platform-choice-list__item span {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.platform-choice-list__item strong,
.platform-choice-list__item small {
    min-width: 0;
    overflow-wrap: anywhere;
}

.platform-choice-list__item strong {
    font-size: 16px;
    line-height: 1.15;
}

.platform-choice-list__item small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 750;
    line-height: 1.3;
}

.platform-choice-list__item:hover,
.platform-choice-list__item:focus-visible {
    border-color: rgba(var(--platform-choice-rgb), 0.6);
    background: rgba(var(--platform-choice-rgb), 0.06);
    color: #111;
    transform: translateY(-1px);
}

.platform-choice-list__item.is-current {
    border-color: var(--platform-choice-accent);
    background: var(--platform-choice-accent);
    color: #fff;
}

.platform-choice-list__item.is-current > i:first-child {
    background: rgba(255, 255, 255, 0.9);
    color: var(--platform-choice-accent);
}

.platform-choice-list__item.is-current small,
.platform-choice-list__item.is-current > i:last-child {
    color: rgba(255, 255, 255, 0.82);
}

.platform-choice-list__item[data-platform-choice="windows-pc"] {
    --platform-choice-accent: #c69d00;
    --platform-choice-rgb: 245, 216, 61;
}

.platform-choice-list__item[data-platform-choice="playstation"] {
    --platform-choice-accent: #0070cc;
    --platform-choice-rgb: 0, 112, 204;
}

.platform-choice-list__item[data-platform-choice="xbox"] {
    --platform-choice-accent: #107c10;
    --platform-choice-rgb: 16, 124, 16;
}

.platform-choice-list__item[data-platform-choice="nintendo"] {
    --platform-choice-accent: #e60012;
    --platform-choice-rgb: 230, 0, 18;
}

.platform-choice-list__item[data-platform-choice="general"] {
    --platform-choice-accent: #5846c7;
    --platform-choice-rgb: 88, 70, 199;
}

.platform-choice-list__item[data-platform-choice="smartphones"] {
    --platform-choice-accent: #087f6a;
    --platform-choice-rgb: 8, 127, 106;
}

.platform-choice-list__item > i.platform-icon--nintendo-switch:first-child {
    display: grid;
    background: rgba(var(--platform-choice-rgb), 0.12);
    color: var(--platform-choice-accent);
    -webkit-mask: none;
    mask: none;
}

.platform-choice-list__item > i.platform-icon--nintendo-switch:first-child::before {
    width: 21px;
    height: 21px;
    background: currentColor;
    content: "";
    -webkit-mask: url("/assets/icons/nintendo-switch-logo.svg") center / contain no-repeat;
    mask: url("/assets/icons/nintendo-switch-logo.svg") center / contain no-repeat;
}

.platform-choice-list__item[data-platform-choice="windows-pc"].is-current {
    background: #f5d83d;
    color: #111;
}

.platform-choice-list__item[data-platform-choice="windows-pc"].is-current small,
.platform-choice-list__item[data-platform-choice="windows-pc"].is-current > i:last-child {
    color: rgba(17, 17, 17, 0.72);
}

.platform-page--genre-system .taxonomy-standard-explorer .taxonomy-standard-related {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.platform-choice-variants {
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--mmorpg-line);
    scroll-margin-top: calc(var(--site-header-height) + var(--channel-bar-height) + 20px);
}

.platform-choice-variants h3 {
    margin: 0 0 10px;
    font-size: 16px;
    line-height: 1.2;
}

.platform-choice-variants > div {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.platform-choice-variants span {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    min-width: 0;
    padding: 7px 9px;
    border-radius: 999px;
    background: #eff1ed;
    color: #454841;
    font-size: 12px;
    font-weight: 750;
    line-height: 1.2;
}

.platform-choice-variants small {
    color: var(--green-dark);
    font-size: 10px;
    font-weight: 900;
}

@media (max-width: 980px) {
    .platform-page--genre-system .platform-news-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .platform-page--genre-system .platform-choice-sidebar {
        width: 100%;
    }

    .platform-choice-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .platform-page--genre-system .taxonomy-standard-explorer .taxonomy-standard-related {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .platform-choice-list {
        grid-template-columns: minmax(0, 1fr);
    }

    .platform-page--genre-system .taxonomy-standard-explorer .taxonomy-standard-related {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Final typography contract: keep this after every page-specific block so
   legacy franchise, company, event and taxonomy scales cannot override it. */
.taxonomy-directory .taxonomy-directory__hero h1,
.taxonomy-collection--standard .taxonomy-standard-hero__copy h1,
.taxonomy-collection--standard .taxonomy-standard-hero--directory-style .taxonomy-standard-hero__copy h1,
.taxonomy-collection--mmorpg .mmorpg-hero h1,
.category-landing .events-page-hero__copy h1,
.news-collection-page .collection-page__hero h1,
.platform-page .platform-hero h1 {
    font-size: var(--taxonomy-page-title-size);
}

.taxonomy-directory .section-heading h2,
.taxonomy-collection .section-heading h2,
.taxonomy-collection.franchise-page--organized .section-heading h2,
.taxonomy-collection .taxonomy-standard-heading h2,
.taxonomy-collection .mmorpg-section-heading h2,
.category-landing .section-heading h2,
.category-landing .events-section-heading h2,
.news-collection-page--section .section-heading h2,
.news-collection-page--section .events-section-heading h2,
.platform-page .section-heading h2,
.platform-page .platform-section > h2,
.author-profile-page .section-heading h2,
.company-page--organized > .category-news-section .section-heading h2,
.company-page--organized > .company-hub-section .section-heading h2,
.company-page--organized .company-information__heading h2 {
    font-size: var(--taxonomy-section-title-size) !important;
}

@media (max-width: 560px) {
    .collection-pagination {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 10px;
    }

    .collection-pagination__status {
        grid-column: 1 / -1;
        grid-row: 1;
    }

    .collection-pagination .is-previous {
        grid-column: 1;
        grid-row: 2;
        justify-self: stretch;
    }

    .collection-pagination .is-next {
        grid-column: 2;
        grid-row: 2;
        justify-self: stretch;
    }

    .collection-pagination a {
        width: auto;
    }
}

/* source: 40-article-reader-home.css */
/* ── Article reader + hub-style homepage refinement ── */
.article-hero--reader {
    --article-reader-dark-height: 420px;
    --article-reader-backdrop-height: calc(var(--site-header-height) + var(--channel-bar-height) + var(--article-reader-dark-height));
    --article-reader-blur-guard: 90px;
    min-height: 0;
    padding: calc(var(--site-header-height) + var(--channel-bar-height) + 25px) 0 0;
    background: var(--bg);
}

.article-hero--reader::before,
.article-hero--reader::after {
    inset: 0 0 auto;
}

.article-hero--reader::before {
    height: var(--article-reader-backdrop-height);
    filter: blur(20px);
    transform: none;
    opacity: 1;
}

.article-hero--reader::after {
    /*
     * The reader hero is pulled behind the site bars by the base negative
     * margin, so this overlay starts at the top of the header (y = 0).
     */
    height: calc(var(--article-reader-backdrop-height) + var(--article-reader-blur-guard));
    background-color: transparent;
    background-image:
        linear-gradient(
            to bottom,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.03) 78.4%,
            rgba(244, 244, 239, 0.1) 80.8%,
            rgba(244, 244, 239, 0.22) 83.2%,
            rgba(244, 244, 239, 0.35) 85.6%,
            rgba(244, 244, 239, 0.5) 88%,
            rgba(244, 244, 239, 0.65) 90.4%,
            rgba(244, 244, 239, 0.78) 92.8%,
            rgba(244, 244, 239, 0.9) 95.2%,
            rgba(244, 244, 239, 0.97) 97.6%,
            var(--bg) 100%
        ),
        linear-gradient(
            90deg,
            rgba(0, 0, 0, 0.92) 0%,
            rgba(0, 0, 0, 0.72) 38%,
            rgba(0, 0, 0, 0.28) 74%,
            rgba(0, 0, 0, 0.52) 100%
        ),
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.22),
            rgba(0, 0, 0, 0.78)
        ),
        radial-gradient(
            circle at 12% 100%,
            rgba(255, 216, 61, 0.14),
            transparent 30%
        ),
        linear-gradient(
            to bottom,
            transparent 0,
            transparent calc(var(--article-reader-backdrop-height) - 2px),
            var(--bg) calc(var(--article-reader-backdrop-height) + 2px),
            var(--bg) 100%
        );
    background-position: top left;
    background-repeat: no-repeat;
    background-size:
        100% calc(var(--article-reader-backdrop-height) + 2px),
        100% calc(var(--article-reader-backdrop-height) + 2px),
        100% calc(var(--article-reader-backdrop-height) + 2px),
        100% calc(var(--article-reader-backdrop-height) + 2px),
        100% 100%;
    border: 0;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

@media (max-width: 1023px) {
    .article-hero--reader {
        --article-reader-dark-height: 520px;
    }
}

@media (max-width: 567px) {
    .article-hero--reader {
        --article-reader-dark-height: 560px;
    }
}

@media (max-width: 680px) {
    .article-hero--reader {
        padding-top: calc(var(--site-header-height) + var(--channel-bar-height) + 45px);
    }
}

.article-hero--reader .article-hero__inner {
    grid-template-columns: minmax(0, 900px) minmax(220px, 250px);
    column-gap: 30px;
    align-items: start;
    width: var(--site-shell-width);
}

.article-hero--reader .article-hero__topline,
.article-hero--reader .article-hero__copy,
.article-hero--reader .article-hero__media {
    grid-column: 1;
}

.article-hero--reader .article-hero__topline {
    display: none;
    margin-bottom: 0;
}

.article-hero--reader h1 {
    width: 100%;
    max-width: none;
    font-size: clamp(27px, calc(4.8vw - 15px), 47px);
    line-height: calc(0.98em + 3px);
}

.article-hero--reader .article-hero__copy {
    --article-hero-copy-padding-block: clamp(24px, 3vw, 36px);
    --article-hero-copy-padding-inline: clamp(24px, 3vw, 36px);
    position: relative;
    z-index: 1;
    grid-column: 1 / -1;
    width: 100%;
    max-width: none;
    padding: var(--article-hero-copy-padding-block) var(--article-hero-copy-padding-inline);
    border-radius: 8px 8px 0 0;
    background: transparent;
}

.article-hero--reader .article-hero__meta {
    display: none;
}

.article-hero--reader .article-hero__copy > .article-hero__summary--below-title {
    display: -webkit-box;
    width: 100%;
    max-width: none;
    margin: 14px 0 0;
    overflow: hidden;
    color: #ccc;
    font-size: 19px;
    font-style: italic;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.article-hero--reader .article-hero__media {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    max-width: 900px;
    aspect-ratio: 16 / 9;
    align-self: auto;
    margin: 0;
    overflow: hidden;
    border: 0;
    border-radius: 8px 8px 0 0;
    box-shadow: none;
}

.article-hero--reader .article-hero__media::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    box-shadow: none;
    background:
        linear-gradient(
            to bottom,
            rgba(255, 255, 255, 0) 0%,
            rgba(255, 255, 255, 0) 80%,
            rgba(255, 255, 255, 0.03) 82%,
            rgba(255, 255, 255, 0.1) 84%,
            rgba(255, 255, 255, 0.22) 86%,
            rgba(255, 255, 255, 0.35) 88%,
            rgba(255, 255, 255, 0.5) 90%,
            rgba(255, 255, 255, 0.65) 92%,
            rgba(255, 255, 255, 0.78) 94%,
            rgba(255, 255, 255, 0.9) 96%,
            rgba(255, 255, 255, 0.97) 98%,
            #fff 100%
        );
}

.article-hero--reader .article-hero__media img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
    aspect-ratio: auto;
    object-fit: cover;
}

.article-hero--reader .article-hero__media .news-visual-fallback {
    width: 100%;
    height: 100%;
    min-height: 0;
}

.article-hero__media-meta {
    position: absolute;
    top: auto;
    right: 14px;
    bottom: 18px;
    left: 14px;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    pointer-events: none;
}

.article-hero__media-meta > span,
.article-hero__media-meta > a {
    display: inline-flex;
    min-height: 32px;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: rgba(255, 255, 255, 0.9);
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    pointer-events: auto;
}

.article-hero__media-meta > a:hover,
.article-hero__media-meta > a:focus-visible {
    background: transparent;
    color: #fff;
    opacity: 0.78;
}

.article-hero__media-meta i {
    color: rgba(255, 255, 255, 0.7);
    font-size: 12px;
}

.article-hero__media-meta small {
    color: rgba(255, 255, 255, 0.62);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.article-hero__media-date {
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 4px;
}

.article-hero__media-date small {
    font-size: 12px;
    letter-spacing: 0;
    text-transform: none;
}

.article-hero__media-meta time {
    color: #fff;
    white-space: nowrap;
}

.article-hero--reader .article-hero__media > figcaption {
    display: none !important;
}

.article-hero--reader .article-hero__media > .article-hero__context {
    position: absolute;
    z-index: 3;
    top: 10%;
    right: var(--article-reader-content-inset);
    left: var(--article-reader-content-inset);
    width: auto;
    max-width: none;
    margin: 0;
    transform: translateY(-50%);
}

body:not(.article-test--epicplay) .article-hero--reader .article-hero__media > .article-hero__context {
    right: auto;
    width: fit-content;
    max-width: calc(100% - 245px - var(--article-reader-content-inset) - var(--article-reader-content-inset));
    isolation: isolate;
}

body:not(.article-test--epicplay) .article-hero--reader .article-hero__media > .article-hero__context > .article-hero__back,
body:not(.article-test--epicplay) .article-hero--reader .article-hero__media > .article-hero__context > .article-hero__category,
body:not(.article-test--epicplay) .article-hero--reader .article-hero__media > .article-share--hero {
    filter:
        drop-shadow(0 0 4.32px rgba(0, 0, 0, 0.98))
        drop-shadow(0 0 12.96px rgba(0, 0, 0, 0.76))
        drop-shadow(0 0 21.6px rgba(0, 0, 0, 0.5));
}

body:not(.article-test--epicplay) .article-hero--reader .article-hero__media > .article-share--hero {
    position: absolute;
    top: 10%;
    right: var(--article-reader-content-inset);
    z-index: 3;
    display: flex;
    min-height: 45px;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #fff;
    cursor: pointer;
    font-family: inherit;
    font-size: var(--font-size-body);
    font-weight: 700;
    line-height: 1.2;
    text-shadow: none;
    transform: translateY(-50%);
    white-space: nowrap;
    isolation: isolate;
}

body:not(.article-test--epicplay) .article-hero--reader .article-hero__media > .article-share--hero:hover {
    opacity: 0.88;
}

body:not(.article-test--epicplay) .article-hero--reader .article-hero__media > .article-share--hero:focus-visible {
    border-radius: 4px;
    outline: 2px solid #fff;
    outline-offset: 6px;
}

body:not(.article-test--epicplay) .article-hero--reader .article-share__hero-icon {
    display: grid;
    width: 25px;
    height: 36px;
    flex: 0 0 25px;
    place-items: center;
    color: #fff;
    font-size: 19px;
}

body:not(.article-test--epicplay) .article-hero--reader .article-share__hero-icon svg {
    width: 23px;
    height: 23px;
    overflow: visible;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
}

body:not(.article-test--epicplay) .article-hero--reader .article-share__hero-icon circle {
    fill: currentColor;
    stroke: none;
}

.article-share-modal[hidden] {
    display: none !important;
}

.article-share-modal {
    position: fixed;
    inset: 0;
    z-index: 2147482000;
    display: grid;
    place-items: center;
    padding: 20px 12px;
    color: #fff;
}

.article-share-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.76);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.article-share-modal__dialog {
    position: relative;
    width: min(calc(100vw - 24px), 370px);
    max-height: calc(100dvh - 40px);
    padding: 22px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 14px;
    background:
        radial-gradient(420px 190px at 8% -12%, rgba(31, 136, 102, 0.24), transparent 62%),
        rgba(10, 20, 16, 0.98);
    box-shadow: 0 30px 100px rgba(0, 0, 0, 0.72);
}

.article-share-modal__dialog:focus {
    outline: 2px solid rgba(255, 216, 61, 0.82);
    outline-offset: 3px;
}

.article-share-modal__header {
    display: flex;
    min-height: 38px;
    align-items: center;
    padding-right: 46px;
    margin-bottom: 16px;
}

.article-share-modal__header h2 {
    margin: 0;
    color: #fff;
    font-size: 22px;
    line-height: 1.15;
}

.article-share-modal__close {
    position: absolute;
    top: 14px;
    right: 14px;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    cursor: pointer;
    font: 300 29px/1 Arial, sans-serif;
    transition: background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.article-share-modal__close:hover,
.article-share-modal__close:focus-visible {
    border-color: rgba(255, 216, 61, 0.88);
    background: rgba(255, 216, 61, 0.15);
    outline: none;
    transform: scale(1.04);
}

.article-share-modal__list {
    display: grid;
    gap: 10px;
}

.article-share-modal__link {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    min-height: 54px;
    align-items: center;
    gap: 12px;
    padding: 7px 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.055);
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.article-share-modal__link:hover,
.article-share-modal__link:focus-visible {
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    outline: none;
    transform: translateY(-2px);
}

.article-share-modal__network-icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 10px;
    color: #fff;
    font-size: 19px;
}

.article-share-modal__link--whatsapp .article-share-modal__network-icon {
    background: #25d366;
}

.article-share-modal__link--x .article-share-modal__network-icon {
    background: #050505;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2);
}

.article-share-modal__link--facebook .article-share-modal__network-icon {
    background: #1877f2;
}

body.article-share-modal-open {
    overflow: hidden !important;
}

@media (prefers-reduced-motion: no-preference) {
    .article-share-modal:not([hidden]) .article-share-modal__dialog {
        animation: article-share-modal-enter 180ms ease-out;
    }

    @keyframes article-share-modal-enter {
        from {
            opacity: 0;
            transform: translateY(10px) scale(0.992);
        }
        to {
            opacity: 1;
            transform: translateY(0) scale(1);
        }
    }
}

.article-hero__context {
    display: flex;
    width: auto;
    align-items: center;
    gap: 0;
    min-width: 0;
    margin: 0;
}

.article-hero__back {
    display: grid;
    width: auto;
    flex: 0 0 auto;
    place-items: center;
    gap: 3px;
    color: #fff;
    text-decoration: none;
}

.article-hero__back i {
    font-size: 23px;
}

.article-hero__back small {
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}

.article-hero__hub {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 14px;
    min-width: 0;
    margin: 0;
    padding: 0;
    color: #fff;
    text-decoration: none;
}

body:not(.article-test--epicplay) .article-hero__hub--context {
    width: auto;
}

.article-hero__category {
    min-height: 45px;
}

.article-hero__category-label {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 7px;
}

.article-hero__category-label .site-category-icon {
    flex: 0 0 auto;
    color: #fff;
    font-size: 18px;
    text-shadow: none;
}

body:not(.article-test--epicplay) .article-hero__category strong {
    font-size: var(--font-size-body);
    line-height: 1.2;
    text-shadow: none;
}

.article-hero__hub-visual {
    display: flex;
    width: auto;
    height: 45px;
    flex: 0 0 auto;
    overflow: hidden;
    border-radius: 10px;
    background: #000;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.32);
}

body:not(.article-test--epicplay) .article-hero__hub-visual {
    box-shadow: none;
}

.article-hero__hub-visual > img,
.article-hero__hub-placeholder {
    display: block;
    width: 96px;
    max-width: none;
    height: 45px;
    flex: 0 0 96px;
    aspect-ratio: 460 / 215;
    object-fit: contain;
}

.article-hero__hub-placeholder {
    background: #151515;
}

.article-hero__hub strong {
    overflow: hidden;
    color: #fff;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.1;
    text-overflow: ellipsis;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
    white-space: nowrap;
}

.article-hero__context > .article-hero__back:hover,
.article-hero__context > .article-hero__back:focus-visible,
.article-hero__hub:hover,
.article-hero__hub:focus-visible {
    color: #fff;
    opacity: 0.82;
}

.article-layout--reader {
    width: var(--site-shell-width);
    grid-template-columns: minmax(0, 900px) minmax(220px, 250px);
    gap: 30px;
    justify-content: space-between;
    align-items: start;
    margin-top: 0;
    margin-bottom: clamp(32px, 4vw, 56px);
}

.article-reader-card {
    position: relative;
    z-index: 1;
    min-width: 0;
    container-type: inline-size;
    padding: clamp(24px, 3vw, 36px);
    border: 1px solid rgba(12, 21, 17, 0.08);
    border-top: 0;
    border-radius: 0 0 8px 8px;
    background:
        linear-gradient(180deg, #fff, rgba(250, 251, 247, 0.98)),
        #fff;
    box-shadow: none;
}

.article-hero--reader .article-hero__copy,
.article-hero--reader .article-hero__media,
.article-reader-card {
    --article-reader-content-inset: max(clamp(24px, 3vw, 36px), calc((100% - 800px) / 2));
}

.article-mini-rail {
    position: sticky;
    top: calc(var(--site-header-height) + var(--channel-bar-height) + 18px);
    display: grid;
    gap: 8px;
}

.article-toc-rail {
    align-self: start;
}

.article-mini-rail a {
    display: flex;
    align-items: center;
    min-height: 38px;
    padding: 8px 10px;
    border-left: 4px solid transparent;
    background: #fff;
    color: #17211c;
    font-size: 15px;
    font-weight: 900;
    line-height: 1.1;
    text-decoration: none;
    box-shadow: 0 8px 26px rgba(9, 15, 12, 0.06);
}

.article-mini-rail a:hover {
    border-left-color: var(--green);
    color: var(--green-dark);
}

.article-reading-rail {
    gap: 8px;
    margin-top: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.article-side .article-reading-rail {
    position: static;
    top: auto;
}

.article-reading-rail p {
    margin: 0;
    padding: 0 0 6px;
    color: var(--green-dark);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.25;
}

.article-reading-rail ol {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    border-top: 1px solid rgba(12, 21, 17, 0.1);
    border-bottom: 1px solid rgba(12, 21, 17, 0.1);
    list-style: none;
}

.article-reading-rail li {
    margin: 0;
}

.article-reading-rail li + li {
    border-top: 1px solid rgba(12, 21, 17, 0.08);
}

.article-reading-rail a {
    min-height: 0;
    padding: 11px 0;
    border-left: 0;
    background: transparent;
    box-shadow: none;
    color: #465149;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-reading-rail li:last-child a {
    padding-bottom: 0;
}

.article-reading-rail .is-active a {
    margin: 0;
    padding: 10px 0;
    border-radius: 0;
    background: transparent;
    color: #111713;
    font-weight: 700;
}

.article-reading-rail a:hover {
    background: transparent;
    color: var(--green-dark);
}

.article-layout--reader .article-side {
    position: sticky;
    top: var(--article-side-sticky-top, calc(var(--site-header-height) + var(--channel-bar-height) + 18px));
    align-self: start;
    display: grid;
    gap: 14px;
    max-height: none;
    overflow: visible;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.article-layout--reader .toc {
    margin-bottom: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.article-layout--reader .toc-label {
    color: #111713;
    font-size: 17px;
    font-weight: 900;
}

.article-layout--reader .toc-list {
    padding-left: 0;
    list-style: none;
}

.article-layout--reader .toc-list a {
    color: #4d5751;
    font-size: 15px;
    font-weight: 600;
    box-shadow: none;
    background: transparent;
    border-left: 2px solid rgba(10, 77, 53, 0.16);
}

.article-layout--reader .toc-list a:hover {
    border-left-color: var(--green);
}

.article-brief {
    display: none;
    gap: 12px;
    max-width: 760px;
    margin: 0 auto 28px;
    padding: 18px;
    border: 1px solid rgba(10, 77, 53, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(90deg, rgba(10, 77, 53, 0.08), rgba(255, 216, 61, 0.08)),
        #f8f8f3;
}

.article-brief div {
    display: grid;
    grid-template-columns: 168px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(10, 77, 53, 0.12);
}

.article-brief div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.article-brief span {
    color: var(--green-dark);
    font-size: 15px;
    font-weight: 950;
    line-height: 1.15;
    text-transform: uppercase;
}

.article-brief p {
    margin: 0;
    color: #24312b;
    font-size: 16px;
    line-height: 1.48;
}

.article-brief__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.article-brief__chips a {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 10px;
    border-radius: 999px;
    background: #07100d;
    color: #fff;
    font-size: 15px;
    font-weight: 850;
    text-decoration: none;
}

.article-brief__chips a:hover {
    background: var(--green);
}

.article-opening {
    --article-opening-line-height: 26px;
    max-width: 800px;
    margin: 0 auto;
}

.article-opening::after {
    content: "";
    display: block;
    clear: both;
}

.article-opening__avatar {
    float: left;
    display: grid;
    width: 54px;
    height: 54px;
    margin: 0 14px 0 0;
    overflow: hidden;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: #dfe7e1;
    color: var(--green-dark);
    font-size: 21px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    shape-outside: circle(50%);
}

.article-opening__avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.article-opening__avatar--fallback {
    background: linear-gradient(145deg, #e7eee9, #cbdad0);
}

.article-opening__meta {
    min-height: var(--article-opening-line-height);
    margin: 0 0 6px;
    color: #2d3933;
    font-size: var(--font-size-body);
    font-style: italic;
    line-height: var(--article-opening-line-height);
    white-space: nowrap;
}

.article-opening__by {
    font-style: inherit;
}

.article-opening__by a {
    color: inherit;
    border-bottom: 2px solid #00faff;
    text-decoration: none;
}

.article-opening__by a:hover,
.article-opening__by a:focus-visible {
    color: inherit;
    text-decoration: none;
}

.article-opening__date {
    font-style: inherit;
    font-weight: inherit;
}

.article-opening__date strong {
    font-weight: 700;
}

.article-opening .article-body {
    max-width: none;
    margin: 0;
}

.article-opening .article-body > p:first-child {
    margin-top: 11px;
}

.article-reader-card .article-body {
    max-width: 800px;
    margin: 0 auto;
}

.article-reader-card .article-body :where(p, li, blockquote, cite, td, th, figcaption) a:not(.media-lightbox-link):not(.wiki-image-lightbox):not(.youtube-lite):not([data-fancybox]),
.article-stream-item .article-body :where(p, li, blockquote, cite, td, th, figcaption) a:not(.media-lightbox-link):not(.wiki-image-lightbox):not(.youtube-lite):not([data-fancybox]) {
    color: inherit;
    font-weight: inherit;
    border-bottom: 2px solid #00faff;
    text-decoration: none;
}

.article-reader-card .article-body :where(h2, h3, h4),
.article-stream-item .article-body :where(h2, h3, h4) {
    font-weight: 700;
}

.article-reader-card .article-body :where(h2, h3, h4) :where(strong, b),
.article-stream-item .article-body :where(h2, h3, h4) :where(strong, b) {
    font-weight: inherit;
}

.article-reader-card .article-reading-queue,
.article-reader-card .article-next-block,
.article-reader-card .article-attribution-block,
.article-reader-card .article-share,
.article-reader-card .article-comments-block,
.article-reader-card .article-up-next {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.article-inline-related {
    margin: 30px 0;
}

.article-inline-related a {
    display: grid;
    grid-template-areas:
        "label label"
        "image copy";
    grid-template-columns: 170px minmax(0, 1fr);
    gap: 9px 16px;
    align-items: center;
    min-height: 0;
    padding: 14px 0;
    border-top: 1px solid rgba(10, 77, 53, 0.16);
    border-bottom: 1px solid rgba(10, 77, 53, 0.16);
    border-radius: 0;
    background: transparent;
    color: #151915;
    text-decoration: none;
    box-shadow: none;
}

.article-inline-related__label {
    grid-area: label;
    padding: 0;
    background: transparent;
    color: var(--green);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.1;
    text-transform: uppercase;
}

.article-inline-related__image {
    grid-area: image;
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 6px;
}

.article-inline-related__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.article-inline-related__copy {
    grid-area: copy;
    display: grid;
    gap: 6px;
}

.article-inline-related__copy strong {
    color: #151915;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.2;
}

.article-inline-related__copy small {
    display: none;
    color: #4f5a52;
    font-size: 16px;
    line-height: 1.35;
}

.article-related-hub {
    --article-related-hub-bg: none;
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
    align-items: stretch;
    max-width: 920px;
    margin: 36px auto 34px;
    padding: 24px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    background-color: #07110d;
    color: #fff;
    box-shadow: 0 20px 46px rgba(7, 14, 10, 0.22);
}

.article-related-hub::before,
.article-related-hub::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.article-related-hub::before {
    inset: -18px;
    z-index: 0;
    background-image: var(--article-related-hub-bg);
    background-position: center;
    background-size: cover;
    filter: blur(10px) saturate(140%) brightness(1.16);
    opacity: 0.98;
    transform: scale(1.10);
}

.article-related-hub::after {
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(90deg, rgba(3, 5, 4, 0.68), rgba(3, 5, 4, 0.82) 54%, rgba(2, 3, 3, 0.94));
    backdrop-filter: blur(4px) saturate(128%);
    -webkit-backdrop-filter: blur(4px) saturate(128%);
    box-shadow: inset 0 0 0 999px rgba(0, 0, 0, 0.18);
}

.article-related-hub > * {
    position: relative;
    z-index: 2;
}

.article-related-hub--has-side,
.article-related-hub--has-timeline {
    grid-template-columns: minmax(0, 1.35fr) minmax(230px, 0.78fr);
}

.article-related-hub__media {
    display: block;
    width: min(100%, 380px);
    aspect-ratio: var(--hub-main-image-ratio);
    margin: 0 auto 18px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    background: #111713;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.34);
}

.article-related-hub__media img,
.article-related-hub__media .news-visual-fallback {
    width: 100%;
    height: 100%;
    min-height: 0;
}

.article-related-hub__media img {
    display: block;
    object-fit: cover;
}

.article-related-hub__main {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    padding: 0;
    text-align: center;
}

.article-related-hub__main .eyebrow,
.article-related-hub__timeline .eyebrow {
    margin-bottom: 7px;
    color: var(--green);
}

.article-related-hub__main h2 {
    margin: 0 0 9px;
    font-size: clamp(25px, 3vw, 36px);
    line-height: 1.04;
}

.article-related-hub__main h2 a {
    color: #fff;
    text-decoration: none;
}

.article-related-hub__main > p {
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 16px;
    line-height: 1.48;
}

.article-related-hub__facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
    margin: 14px 0 0;
    text-align: left;
}

.article-related-hub__facts div {
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(6px);
}

.article-related-hub__facts dt {
    margin: 0 0 2px;
    color: rgba(255, 255, 255, 0.62);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.article-related-hub__facts dd {
    margin: 0;
    color: #fff;
    font-size: 15px;
    font-weight: 780;
    line-height: 1.25;
}

.article-related-hub__button {
    display: inline-flex;
    align-self: flex-end;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    margin-top: 16px;
    margin-left: auto;
    padding: 0 14px;
    border-radius: 999px;
    background: var(--green);
    color: #fff;
    font-size: 15px;
    font-weight: 850;
    text-decoration: none;
}

.article-related-hub__button:hover {
    background: var(--green-dark);
    color: #fff;
}

.article-related-hub__side {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    padding: 6px 0 6px 22px;
    border-left: 1px solid rgba(255, 255, 255, 0.18);
}

.article-related-hub__side .article-related-hub__button {
    margin-top: auto;
}

.article-related-hub__timeline {
    min-width: 0;
    width: 100%;
    padding: 0;
}

.article-related-hub__timeline h3 {
    margin: 0 0 10px;
    color: #fff;
    font-size: 18px;
    line-height: 1.18;
}

.article-related-hub__timeline ol {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.article-related-hub__timeline a {
    display: grid;
    gap: 4px;
    color: #fff;
    text-decoration: none;
}

.article-related-hub__timeline a:hover span {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.article-related-hub__timeline time {
    color: rgba(255, 255, 255, 0.62);
    font-size: 13px;
    font-weight: 750;
}

.article-related-hub__timeline span {
    display: -webkit-box;
    color: #fff;
    font-size: 15px;
    font-weight: 760;
    line-height: 1.22;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-attribution-block {
    margin-top: 34px;
    padding-top: 18px;
    border-top: 1px solid var(--border);
}

.article-attribution-block > .eyebrow {
    margin-bottom: 8px;
}

.article-attribution-links {
    margin: 0;
    color: #334139;
    font-size: 16px;
    line-height: 1.65;
}

.article-attribution-links span {
    color: #1f2b25;
    font-weight: 850;
}

.article-attribution-links a {
    color: inherit;
    font-weight: 600;
    border-bottom: 2px solid #00faff;
    text-decoration: none;
}

.article-layout--reader--single {
    grid-template-columns: minmax(0, 900px);
    justify-content: center;
}

.article-side--references {
    gap: 14px;
}

.article-side-franchises {
    display: grid;
    gap: 10px;
}

.article-side-franchise-card {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    min-height: 88px;
    align-items: stretch;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 10px;
    background: #050607;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 14px 30px rgba(5, 10, 8, 0.2);
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.article-side-franchise-card::before,
.article-side-franchise-card::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.article-side-franchise-card::before {
    z-index: -2;
    background-image: var(--article-franchise-bg);
    background-position: center;
    background-size: cover;
    filter: blur(18px) saturate(140%);
    transform: scale(1.12);
    opacity: 0.5;
}

.article-side-franchise-card::after {
    z-index: -1;
    background: rgba(0, 0, 0, 0.68);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
}

.article-side-franchise-card__media {
    display: block;
    min-width: 0;
    height: 100%;
    min-height: 88px;
    align-self: stretch;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.28);
    box-shadow: 10px 0 24px rgba(0, 0, 0, 0.24);
}

.article-side-franchise-card__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    transition: transform 180ms ease;
}

.article-side-franchise-card--company .article-side-franchise-card__media {
    display: grid;
    place-items: center;
    width: 88px;
    height: 88px;
    min-height: 88px;
    align-self: center;
    overflow: hidden;
    background: #fff;
}

.article-side-franchise-card--company[data-logo-surface="dark"] .article-side-franchise-card__media {
    background: #101416;
}

.article-side-franchise-card--company .article-side-franchise-card__media img {
    width: auto;
    height: auto;
    max-width: 82%;
    max-height: 82%;
    object-fit: contain;
    object-position: center center;
}

.article-side-franchise-card__media > i {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: rgba(255, 255, 255, 0.84);
    font-size: 30px;
}

.article-side-franchise-card--platform .article-side-franchise-card__copy strong {
    overflow-wrap: normal;
    white-space: nowrap;
}

.article-side-franchise-card__copy {
    display: grid;
    min-width: 0;
    align-content: center;
    gap: 5px;
    padding: 13px 12px;
}

.article-side-franchise-card__copy strong {
    color: #fff;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 800;
    line-height: 1.14;
    overflow-wrap: anywhere;
}

.article-side-franchise-card__copy small {
    color: rgba(255, 255, 255, 0.7);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.2;
}

.article-side-franchise-card:hover,
.article-side-franchise-card:focus-visible {
    border-color: rgba(255, 255, 255, 0.34);
    color: #fff;
    transform: translateY(-2px) scale(1.01);
    box-shadow: 0 19px 38px rgba(5, 10, 8, 0.28);
}

.article-side-franchise-card:hover .article-side-franchise-card__media img,
.article-side-franchise-card:focus-visible .article-side-franchise-card__media img {
    transform: scale(1.025);
}

.article-side-franchise-card--company:hover .article-side-franchise-card__media img,
.article-side-franchise-card--company:focus-visible .article-side-franchise-card__media img {
    transform: none;
}

.article-side-franchise-card:focus-visible {
    outline: 2px solid var(--yellow);
    outline-offset: 3px;
}

.article-side-attribution {
    padding: 16px;
    border: 1px solid rgba(12, 21, 17, 0.1);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 12px 28px rgba(9, 15, 12, 0.06);
}

.article-side-attribution h2 {
    margin: 0 0 10px;
    color: var(--green-dark);
    font-size: 18px;
    line-height: 1.2;
}

.article-side-attribution dl {
    display: grid;
    gap: 0;
    margin: 0;
}

.article-side-attribution dl > div {
    min-width: 0;
    padding: 9px 0;
    border-bottom: 1px solid rgba(12, 21, 17, 0.09);
}

.article-side-attribution dl > div:first-child {
    padding-top: 0;
}

.article-side-attribution dl > div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.article-side-attribution dt {
    margin: 0 0 3px;
    color: #526158;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
}

.article-side-attribution dd {
    min-width: 0;
    margin: 0;
    color: #27332d;
    font-size: 14px;
    line-height: 1.48;
    overflow-wrap: anywhere;
}

.article-side-attribution a {
    border-bottom: 2px solid #00faff;
    color: inherit;
    font-weight: 600;
    text-decoration: none;
}

.article-side-attribution a:hover,
.article-side-attribution a:focus-visible {
    color: var(--green-dark);
}

.article-side-attribution a[data-kind="category"] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.article-side-attribution a[data-kind="category"] .site-category-icon {
    color: var(--green-dark);
}

.article-side-attribution a[data-kind="platform"] {
    white-space: nowrap;
}

.article-hub-sheet {
    width: 100%;
    padding: 0 16px 16px;
    border-radius: 10px;
    box-shadow: 0 18px 40px rgba(5, 10, 8, 0.2);
}

.article-hub-sheet__identity {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    align-items: stretch;
    margin: 0 -16px 14px;
    color: #fff;
    text-decoration: none;
}

.article-hub-sheet__image {
    display: block;
    width: 100%;
    aspect-ratio: var(--hub-main-image-ratio);
    overflow: hidden;
    border: 0;
    border-radius: 10px 10px 0 0;
    background: rgba(0, 0, 0, 0.28);
}

.article-hub-sheet__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.article-hub-sheet__name {
    display: grid;
    min-width: 0;
    gap: 0;
    padding: 13px 16px 0;
}

.article-hub-sheet__name strong {
    color: #fff;
    font-family: var(--font-heading);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.12;
    overflow-wrap: anywhere;
}

.article-hub-sheet__identity:hover .article-hub-sheet__name strong,
.article-hub-sheet__identity:focus-visible .article-hub-sheet__name strong {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.article-hub-sheet .hub-info-list > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 3px;
    padding: 9px 0;
}

.article-hub-sheet .hub-info-list dt {
    font-size: 12px;
    font-weight: 750;
    line-height: 1.2;
    text-transform: uppercase;
}

.article-hub-sheet .hub-info-list dd {
    font-size: 14px;
    line-height: 1.38;
}

.article-hub-sheet .hub-info-details__summary {
    padding-right: 14px;
}

.article-hub-sheet .hub-info-list .hub-info-store {
    gap: 7px;
    font-size: 14px;
    opacity: 0.86;
}

.article-hub-sheet .hub-info-store .store-button__icon {
    width: 18px;
    min-width: 18px;
    height: 18px;
    font-size: 18px;
}

.article-hub-sheet__button {
    display: flex;
    min-height: 40px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 14px;
    padding: 9px 11px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
}

.article-hub-sheet__button:hover,
.article-hub-sheet__button:focus-visible {
    border-color: rgba(255, 255, 255, 0.32);
    background: var(--green-dark);
    color: #fff;
}

.article-hub-sheet__additional {
    margin-top: 10px;
    padding-top: 9px;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    overflow-wrap: anywhere;
}

.article-hub-sheet__additional strong {
    display: block;
    margin-bottom: 3px;
    color: rgba(255, 255, 255, 0.68);
    font-size: 12px;
    font-weight: 750;
    line-height: 1.2;
    text-transform: uppercase;
}

.article-hub-sheet__additional > span {
    display: block;
    color: rgba(255, 255, 255, 0.95);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.38;
}

.article-hub-sheet__additional:not(.article-hub-sheet__additional--platforms) a {
    color: rgba(255, 255, 255, 0.88);
    font-weight: inherit;
    text-decoration-line: underline;
    text-decoration-color: rgba(255, 255, 255, 0.25);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    opacity: 0.82;
    transition: color 0.14s, opacity 0.14s, text-decoration-color 0.14s;
}

.article-hub-sheet__additional:not(.article-hub-sheet__additional--platforms) a:hover,
.article-hub-sheet__additional:not(.article-hub-sheet__additional--platforms) a:focus-visible {
    color: #fff;
    text-decoration-color: currentColor;
    opacity: 1;
}

.article-hub-sheet__additional--platforms > .platform-chip-list {
    display: flex;
    gap: 7px;
}

.article-hub-sheet__additional--platforms {
    margin-top: 13px;
    padding-top: 12px;
}

.article-hub-sheet__additional--platforms > strong {
    margin-bottom: 7px;
}

.article-hub-sheet__additional--platforms a.platform-chip {
    font-weight: 700;
    text-decoration: none;
}

.article-hub-sheet__additional--platforms a.platform-chip:hover,
.article-hub-sheet__additional--platforms a.platform-chip:focus-visible {
    text-decoration: none;
}

.article-popular-side {
    display: grid;
    gap: 12px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.article-popular-side h2 {
    margin: 0;
    color: var(--green-dark);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
}

.article-popular-tabs {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(68px, 1fr));
    gap: 4px;
    overflow: hidden;
    padding: 4px;
    border: 0;
    border-radius: 8px;
    background: #eef2ec;
}

.article-popular-tabs button {
    appearance: none;
    min-height: 36px;
    padding: 0 8px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #5a665e;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
}

.article-popular-tabs button.is-active {
    box-shadow: none;
    background: #0a4d35;
    color: #fff;
    font-weight: 700;
}

.article-popular-tabs button:hover {
    color: #111713;
}

.article-popular-list {
    display: grid;
    gap: 0;
    overflow: hidden;
    border-top: 1px solid rgba(12, 21, 17, 0.1);
    border-bottom: 1px solid rgba(12, 21, 17, 0.1);
    border-radius: 0;
    background: transparent;
}

.article-popular-card {
    position: relative;
    display: grid;
    grid-template-columns: 30px 100px minmax(0, 1fr);
    grid-template-areas: "rank thumb title";
    gap: 12px;
    align-items: center;
    min-height: 82px;
    padding: 14px 0;
    border: 0;
    border-bottom: 1px solid rgba(12, 21, 17, 0.08);
    border-radius: 0;
    background: transparent;
    color: #17211c;
    text-decoration: none;
    box-shadow: none;
}

.article-popular-card:last-child {
    border-bottom: 0;
}

.article-popular-card__rank {
    grid-area: rank;
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #0a4d35;
    color: #fff;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
}

.article-popular-card strong {
    grid-area: title;
    color: #17211c;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.28;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-popular-card__thumb {
    grid-area: thumb;
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 7px;
    background: #e8ebe6;
}

.article-popular-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.article-continuation {
    --rh-ink: #17201c;
    --rh-accent: #0b6147;
    --rh-font-label: 15px;
    --rh-font-section-title: 30px;
    margin: 34px 0 10px;
    padding-top: 0;
    border-top: 0;
}

@media (max-width: 480px) {
    .article-continuation .entity-article-card__description { display: inline; }
}

.article-popular-card:hover strong {
    color: var(--green-dark);
}

.article-popular-card:hover {
    background: transparent;
    box-shadow: none;
}

.article-popular-card:not(:has(.article-popular-card__thumb)) {
    grid-template-columns: 30px minmax(0, 1fr);
    grid-template-areas: "rank title";
}

.article-up-next {
    margin-top: 34px;
}

.article-up-next a {
    position: relative;
    display: grid;
    min-height: 220px;
    align-content: end;
    overflow: hidden;
    padding: 26px;
    border-radius: 8px;
    background:
        linear-gradient(90deg, rgba(3, 6, 5, 0.86), rgba(3, 6, 5, 0.36)),
        var(--up-next-bg, linear-gradient(135deg, #0b1712, #17211c));
    background-size: cover;
    background-position: center;
    color: #fff;
    text-decoration: none;
}

.article-up-next span {
    color: var(--yellow);
    font-size: 15px;
    font-weight: 950;
    text-transform: uppercase;
}

.article-up-next strong {
    max-width: 620px;
    color: #fff;
    font-size: clamp(28px, 4vw, 45px);
    line-height: 1.02;
}

.article-stream {
    max-width: 760px;
    margin: 34px auto 0;
}

.article-stream__sentinel {
    min-height: 54px;
    display: grid;
    place-items: center;
    color: var(--muted);
    font-size: 15px;
}

.article-stream__loader,
.article-stream__done,
.article-stream__error {
    padding: 12px 0;
    color: var(--muted);
    font-size: 15px;
    text-align: center;
}

.article-stream-item {
    margin: 42px 0 0;
    padding-top: 34px;
    border-top: 1px solid var(--border);
}

.article-stream-hero {
    position: relative;
    isolation: isolate;
    display: grid;
    align-content: end;
    min-height: 340px;
    overflow: hidden;
    padding: 28px;
    border-radius: 8px;
    background: #050607;
    color: #fff;
}

.article-stream-hero::before,
.article-stream-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.article-stream-hero::before {
    z-index: -2;
    background-image: var(--stream-hero-bg);
    background-position: center;
    background-size: cover;
    filter: blur(2px) saturate(108%);
    transform: scale(1.02);
    opacity: 0.72;
}

.article-stream-hero::after {
    z-index: -1;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.86), rgba(0, 0, 0, 0.48) 58%, rgba(0, 0, 0, 0.72));
}

.article-stream-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 12px;
}

.article-stream-hero__meta span {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 5px 11px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.34);
    color: rgba(255, 255, 255, 0.9);
    font-size: 14px;
    font-weight: 760;
}

.article-stream-hero h2 {
    max-width: 680px;
    margin: 0 0 12px;
    color: #fff;
    font-size: clamp(30px, 4vw, 52px);
    line-height: 1.02;
}

.article-stream-hero p {
    max-width: 650px;
    margin: 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: var(--font-size-body);
    line-height: 1.5;
}

.article-stream-body {
    padding-top: 26px;
}

.article-stream-open {
    display: inline-flex;
    margin-top: 22px;
    color: var(--green-dark);
    font-size: 16px;
    font-weight: 800;
}

.article-hub-minis .article-next-grid {
    grid-template-columns: minmax(0, 1fr);
}

.article-hub-card--mini {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    grid-template-areas:
        "img meta"
        "img title"
        "img desc"
        "img chips"
        "img stats"
        "img line"
        "img cta";
    gap: 5px 14px;
    padding: 12px;
    border: 1px solid rgba(12, 21, 17, 0.12);
    border-radius: 8px;
    background:
        linear-gradient(90deg, rgba(5, 8, 7, 0.92), rgba(5, 8, 7, 0.76)),
        #08100d;
    color: #fff;
}

.article-hub-card--mini img {
    grid-area: img;
    width: 100%;
    height: auto;
    aspect-ratio: var(--hub-main-image-ratio);
    object-fit: cover;
    border-radius: 6px;
}

.article-hub-card--mini > .article-hub-card__meta {
    grid-area: meta;
    color: var(--yellow);
    font-size: 15px;
    font-weight: 900;
}

.article-hub-card--mini > strong {
    grid-area: title;
    color: #fff;
    font-size: 21px;
    line-height: 1.15;
}

.article-hub-card--mini > small {
    grid-area: desc;
    color: rgba(255, 255, 255, 0.75);
    font-size: 15px;
    line-height: 1.38;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-hub-card__chips {
    grid-area: chips;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.article-hub-card__chips em,
.article-hub-card__stats span {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.86);
    font-size: 15px;
    font-style: normal;
    font-weight: 800;
}

.article-hub-card__stats {
    grid-area: stats;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.article-hub-card__line {
    grid-area: line;
    display: grid;
    gap: 3px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 15px;
    line-height: 1.32;
}

.article-hub-card__line span {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-hub-card__cta {
    grid-area: cta;
    justify-self: start;
    margin-top: 4px;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--yellow);
    color: #111713;
    font-size: 15px;
    font-weight: 950;
}

.article-comments-block {
    margin-top: 32px;
    padding-top: 28px;
    border-top: 1px solid var(--border);
}

.article-comments-head {
    margin-bottom: 18px;
}

.article-comments-head h2 span {
    color: var(--muted);
    font-size: 15px;
    font-weight: 500;
}

.article-comment-sort {
    margin-left: auto;
}

.article-comment-form {
    display: grid;
    gap: 10px;
    margin-bottom: 18px;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: #fff;
}

.article-comment-form input,
.article-comment-form textarea {
    margin: 0;
    font-size: 16px;
}

.article-comment-form--reply {
    margin: 12px 0 0;
    padding: 12px;
    background: rgba(255, 255, 255, 0.72);
}

.article-comment-thread {
    gap: 0;
}

.article-comment {
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 14px;
    padding: 20px 0;
}

.article-comment .comment__avatar {
    width: 52px;
    height: 52px;
    background: linear-gradient(135deg, #0a4d35, #0f7a53);
    font-size: 18px;
}

.article-comment .comment__author {
    color: #252b28;
    font-size: 18px;
}

.comment__level {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 7px;
    border-radius: 4px;
    background: #e8ece8;
    color: #6a716c;
    font-size: 15px;
    font-weight: 900;
}

.article-comment .comment__text {
    color: #343d38;
    font-size: var(--font-size-body);
    line-height: 1.68;
}

.article-comment .comment__actions {
    gap: 12px;
    color: #8a918c;
    font-size: 15px;
}

.article-comment .comment__actions form {
    display: inline;
}

.article-comment .comment-report-form {
    display: inline-flex;
}

.article-comment .comment__actions button,
.article-comment .comment__actions span {
    color: #8a918c;
    font-size: 15px;
    font-weight: 700;
}

.article-comment .comment__actions form button {
    border: 0;
    background: transparent;
    cursor: pointer;
}

.article-comment .comment__actions button:hover,
.article-comment .comment__actions span:hover {
    color: var(--green-dark);
}

.article-comment.is-featured {
    margin: 0 -14px;
    padding: 20px 14px;
    border-radius: 8px;
    background: #f7f8f3;
}

.comment__featured-label {
    display: inline-flex;
    width: fit-content;
    margin-bottom: 6px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #ff6a2a;
    color: #fff;
    font-size: 15px;
    font-weight: 900;
}

.article-comment-replies {
    display: none;
    margin-top: 14px;
    padding: 16px 18px;
    border-radius: 8px;
    background: #f2f3f2;
}

.article-comment-replies.is-open {
    display: block;
}

.article-comment--reply {
    grid-template-columns: 40px minmax(0, 1fr);
    padding: 12px 0;
    border-bottom: 0;
}

.article-comment--reply .comment__avatar {
    width: 40px;
    height: 40px;
    background: #dce5df;
    color: var(--green-dark);
    font-size: 16px;
}

.article-comments-empty {
    padding: 14px 0;
}

.author-profile-page {
    display: grid;
    gap: 42px;
    padding-top: 42px;
    padding-bottom: 64px;
}

.author-profile-hero {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 38px;
    align-items: center;
    overflow: hidden;
    padding: 38px 44px;
    border-radius: 18px;
    background: #0b0b0b;
    box-shadow: 0 22px 52px rgba(9, 36, 26, 0.16);
}

.author-profile-hero--has-background::after {
    content: "";
    position: absolute;
    inset: -28px;
    z-index: 0;
    background-image: var(--author-profile-bg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter: blur(20px);
    opacity: 0.82;
    pointer-events: none;
    transform: scale(1.04);
}

.author-profile-hero__avatar {
    display: grid;
    place-items: center;
    width: 190px;
    height: 190px;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 18px;
    background: #dbe7df;
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);
}

.author-profile-hero__avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.author-profile-hero__avatar > b {
    color: #0c5c40;
    font-size: 58px;
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 1;
}

.author-profile-hero__copy {
    max-width: 780px;
}

.author-profile-hero__copy .eyebrow {
    margin-bottom: 7px;
    color: #86dfbd;
}

.author-profile-hero__copy h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(38px, 5vw, 64px);
    line-height: 0.98;
}

.author-profile-hero__copy > strong {
    display: block;
    margin-top: 12px;
    color: #f6d45d;
    font-size: 18px;
    line-height: 1.3;
}

.author-profile-hero__copy > p:not(.eyebrow) {
    max-width: 750px;
    margin: 18px 0 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 17px;
    line-height: 1.66;
}

.author-profile-hero__copy > span {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    margin-top: 20px;
    padding: 6px 12px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.09);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
}

.author-profile-articles {
    display: grid;
    gap: 22px;
}

.author-profile-articles__grid,
.taxonomy-article-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 26px 22px;
}

.author-profile-card,
.taxonomy-article-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(12, 21, 17, 0.1);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 10px 26px rgba(16, 24, 20, 0.055);
}

.author-profile-card__media,
.taxonomy-article-card__media {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #e8eee9;
}

.author-profile-card__media img,
.author-profile-card__media .news-visual-fallback,
.taxonomy-article-card__media img,
.taxonomy-article-card__media .news-visual-fallback {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 180ms ease;
}

.author-profile-card:hover .author-profile-card__media img,
.taxonomy-article-card:hover .taxonomy-article-card__media img {
    transform: scale(1.025);
}

.author-profile-card > div,
.taxonomy-article-card > div {
    display: grid;
    gap: 9px;
    padding: 17px 18px 20px;
}

.author-profile-card p,
.taxonomy-article-card p {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 10px;
    align-items: center;
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    font-weight: 750;
    line-height: 1.2;
    text-transform: uppercase;
}

.author-profile-card p span,
.taxonomy-article-card p span {
    color: var(--green-dark);
    font-weight: 900;
}

.author-profile-card h3,
.taxonomy-article-card h3 {
    margin: 0;
    font-size: 21px;
    line-height: 1.14;
}

.author-profile-card h3 a,
.taxonomy-article-card h3 a {
    color: var(--text);
    text-decoration: none;
}

.author-profile-card h3 a:hover,
.author-profile-card h3 a:focus-visible,
.taxonomy-article-card h3 a:hover,
.taxonomy-article-card h3 a:focus-visible {
    color: var(--green-dark);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.author-profile-card small,
.taxonomy-article-card small {
    display: -webkit-box;
    color: #58645d;
    font-size: 14px;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

@media (max-width: 1100px) {
    .article-hero--reader .article-hero__inner {
        grid-template-columns: minmax(0, 1fr) 240px;
        gap: 24px;
    }

    .article-layout--reader {
        grid-template-columns: minmax(0, 1fr) 240px;
        gap: 24px;
    }

    .author-profile-articles__grid,
    .taxonomy-article-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .article-hero--reader .article-hero__inner {
        grid-template-columns: 1fr;
    }

    .article-hero--reader .article-hero__copy,
    .article-hero--reader .article-hero__media,
    .article-layout--reader > .article-reader-card {
        --article-reader-content-inset: 14px;
    }

    .article-hero--reader .article-hero__copy {
        --article-hero-copy-padding-block: 14px;
        padding: var(--article-hero-copy-padding-block);
    }

    .article-hero--reader .article-hero__media {
        order: initial;
        aspect-ratio: 16 / 9;
        align-self: auto;
    }

    .article-hero--reader .article-hero__media img {
        width: 100%;
        height: 100%;
        min-height: 0;
        object-fit: cover;
    }

    .article-hero__context {
        gap: 0;
        margin-bottom: 14px;
    }

    body:not(.article-test--epicplay) .article-hero--reader .article-hero__media > .article-hero__context {
        max-width: calc(100% - 126px - var(--article-reader-content-inset) - var(--article-reader-content-inset));
    }

    body:not(.article-test--epicplay) .article-hero--reader .article-hero__media > .article-share--hero {
        gap: 6px;
    }

    .article-hero__back {
        width: auto;
        flex-basis: auto;
    }

    .article-hero__hub {
        gap: 9px;
    }

    .article-hero__hub-visual {
        width: auto;
        height: 45px;
        flex-basis: auto;
    }

    .article-hero__hub-visual > img,
    .article-hero__hub-placeholder {
        height: 45px;
    }

    .article-hero__hub-visual > img,
    .article-hero__hub-placeholder {
        width: 96px;
        flex-basis: 96px;
    }

    .article-hero__hub strong {
        max-width: calc(100vw - 185px);
        font-size: 20px;
    }

    .article-hero__media-meta {
        top: auto;
        right: 10px;
        bottom: 10px;
        left: 10px;
        gap: 6px;
    }

    .article-hero__media-meta > span,
    .article-hero__media-meta > a {
        min-height: 28px;
        padding: 4px 9px;
        font-size: 13px;
    }

    .article-related-hub,
    .article-related-hub--has-side,
    .article-related-hub--has-timeline {
        grid-template-columns: 1fr;
    }

    .article-related-hub__side {
        grid-column: 1 / -1;
        padding: 16px 0 0;
        border-top: 1px solid rgba(255, 255, 255, 0.18);
        border-left: 0;
    }

    .article-related-hub__timeline ol {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .author-profile-page {
        padding-top: 28px;
    }

    .author-profile-hero {
        grid-template-columns: 140px minmax(0, 1fr);
        gap: 26px;
        padding: 30px;
    }

    .author-profile-hero__avatar {
        width: 140px;
        height: 140px;
    }
}

@media (max-width: 680px) {
    .article-layout--reader {
        grid-template-columns: 1fr;
    }

    .article-layout--reader .article-side {
        position: static;
        top: auto;
    }
}

@media (max-width: 680px) {
    .article-related-hub,
    .article-related-hub--has-side,
    .article-related-hub--has-timeline {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .article-related-hub__media,
    .article-related-hub__media img,
    .article-related-hub__media .news-visual-fallback {
        min-height: 0;
        aspect-ratio: var(--hub-main-image-ratio);
    }

    .article-related-hub__facts {
        grid-template-columns: 1fr;
    }

    .article-related-hub__button {
        margin-top: 16px;
    }

    .article-related-hub__timeline ol {
        grid-template-columns: 1fr;
    }

    .article-popular-card {
        grid-template-columns: 30px 100px minmax(0, 1fr);
        min-height: 82px;
        gap: 10px;
    }

    .article-popular-card strong {
        font-size: 15px;
    }

}

@media (max-width: 520px) {
    .author-profile-page {
        gap: 32px;
        padding-bottom: 44px;
    }

    .author-profile-hero {
        grid-template-columns: 1fr;
        justify-items: center;
        padding: 28px 22px 30px;
        text-align: center;
    }

    .author-profile-hero__avatar {
        width: 132px;
        height: 132px;
    }

    .author-profile-hero__copy > p:not(.eyebrow) {
        font-size: 16px;
        text-align: left;
    }

    .author-profile-articles__grid,
    .taxonomy-article-grid {
        grid-template-columns: 1fr;
    }

    .article-opening__meta {
        white-space: normal;
    }

    .article-popular-tabs button {
        min-height: 34px;
        font-size: 14px;
    }

    .article-popular-card {
        grid-template-columns: 28px 88px minmax(0, 1fr);
        min-height: 76px;
        padding: 12px 0;
    }

    .article-popular-card__rank {
        width: 26px;
        height: 26px;
        font-size: 13px;
    }

}

@media (max-width: 900px) {
    body:not(.article-test--epicplay) .article-layout--reader {
        grid-template-columns: minmax(0, 1fr);
    }

    body:not(.article-test--epicplay) .article-layout--reader .article-side--references {
        position: static;
        top: auto;
        grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
        align-items: start;
        width: 100%;
    }

    body:not(.article-test--epicplay) .article-layout--reader .article-side-franchises {
        grid-column: 1 / -1;
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    }

    body:not(.article-test--epicplay) .article-layout--reader .article-side--references > .frontiers-manga-promo {
        grid-column: 1 / -1;
        justify-self: center;
    }
}

@media (max-width: 680px) {
    body:not(.article-test--epicplay) .article-layout--reader .article-side--references {
        grid-template-columns: minmax(0, 1fr);
    }

    body:not(.article-test--epicplay) .article-layout--reader .article-side-franchises {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (prefers-reduced-motion: reduce) {
    .article-side-franchise-card,
    .article-side-franchise-card__media img {
        transition: none;
    }

    .article-side-franchise-card:hover,
    .article-side-franchise-card:focus-visible,
    .article-side-franchise-card:hover .article-side-franchise-card__media img,
    .article-side-franchise-card:focus-visible .article-side-franchise-card__media img {
        transform: none;
    }
}

@media (min-width: 901px) {
    body:not(.article-test--epicplay) .article-hero--reader::before,
    body:not(.article-test--epicplay) .article-hero--reader::after {
        height: 100%;
    }

    body:not(.article-test--epicplay) .article-hero--reader::before {
        background-position: center calc(50% + 64px);
        background-repeat: no-repeat;
    }

    body:not(.article-test--epicplay) .article-hero--reader::after {
        background-image:
            radial-gradient(
                ellipse 138% 100% at 52% 0%,
                rgba(244, 244, 239, 0) 0%,
                rgba(244, 244, 239, 0) 76%,
                rgba(244, 244, 239, 0.08) 81%,
                rgba(244, 244, 239, 0.22) 86%,
                rgba(244, 244, 239, 0.46) 90%,
                rgba(244, 244, 239, 0.72) 94%,
                rgba(244, 244, 239, 0.9) 97.5%,
                var(--bg) 100%
            ),
            linear-gradient(
                90deg,
                rgba(0, 0, 0, 0.92) 0%,
                rgba(0, 0, 0, 0.72) 38%,
                rgba(0, 0, 0, 0.28) 74%,
                rgba(0, 0, 0, 0.52) 100%
            ),
            linear-gradient(
                180deg,
                rgba(0, 0, 0, 0.22),
                rgba(0, 0, 0, 0.78)
            ),
            radial-gradient(
                circle at 12% 100%,
                rgba(255, 216, 61, 0.14),
                transparent 30%
            );
        background-position: top left;
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }

    body:not(.article-test--epicplay) .article-layout--reader--with-references {
        margin-top: calc(0px - var(--article-featured-height, 0px));
    }

    body:not(.article-test--epicplay) .article-layout--reader--with-references > .article-reader-card {
        margin-top: var(--article-featured-height, 0px);
    }
}

/* The author identity surface starts behind the shared portal bars and grows
   naturally with the profile copy, while keeping its existing visual theme. */
.author-profile-page {
    --top-surface-transition-depth: clamp(72px, 7vw, 110px);
    padding-top: 0;
}

.author-profile-page > .author-profile-hero:first-child {
    position: relative;
    left: 50%;
    box-sizing: border-box;
    width: 100vw;
    max-width: none;
    margin-top: calc((var(--site-header-height) + var(--channel-bar-height)) * -1);
    margin-right: 0;
    margin-bottom: 0;
    margin-left: -50vw;
    padding-top: calc(var(--site-header-height) + var(--channel-bar-height) + clamp(34px, 5vw, 68px));
    padding-right: max(calc((100vw - var(--site-shell-max)) / 2), calc(var(--site-shell-gutter) / 2));
    padding-bottom: calc(clamp(34px, 5vw, 58px) + var(--top-surface-transition-depth));
    padding-left: max(calc((100vw - var(--site-shell-max)) / 2), calc(var(--site-shell-gutter) / 2));
    border-radius: 0;
    box-shadow: none;
}

.author-profile-page > .author-profile-hero:first-child::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    z-index: 1;
    background:
        linear-gradient(
            to bottom,
            rgba(244, 244, 239, 0) 0%,
            rgba(244, 244, 239, 0) 76%,
            rgba(244, 244, 239, 0.08) 81%,
            rgba(244, 244, 239, 0.22) 86%,
            rgba(244, 244, 239, 0.46) 90%,
            rgba(244, 244, 239, 0.72) 94%,
            rgba(244, 244, 239, 0.9) 97.5%,
            var(--bg) 100%
        ),
        linear-gradient(90deg, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.72) 38%, rgba(0, 0, 0, 0.28) 74%, rgba(0, 0, 0, 0.52) 100%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.22), rgba(0, 0, 0, 0.78));
    pointer-events: none;
}

.author-profile-page > .author-profile-hero:first-child > * {
    position: relative;
    z-index: 2;
}

@media (min-width: 901px) {
    .author-profile-page > .author-profile-hero--has-background:first-child::after {
        background-position: center calc(50% + 64px);
    }

    .author-profile-page > .author-profile-hero:first-child::before {
        background:
            radial-gradient(
                ellipse 138% 100% at 52% 0%,
                rgba(244, 244, 239, 0) 0%,
                rgba(244, 244, 239, 0) 76%,
                rgba(244, 244, 239, 0.08) 81%,
                rgba(244, 244, 239, 0.22) 86%,
                rgba(244, 244, 239, 0.46) 90%,
                rgba(244, 244, 239, 0.72) 94%,
                rgba(244, 244, 239, 0.9) 97.5%,
                var(--bg) 100%
            ),
            linear-gradient(90deg, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.72) 38%, rgba(0, 0, 0, 0.28) 74%, rgba(0, 0, 0, 0.52) 100%),
            linear-gradient(180deg, rgba(0, 0, 0, 0.22), rgba(0, 0, 0, 0.78));
    }
}

/* source: 90-admin-overlays.css */
/* Admin */
.admin-shell,
.admin-login-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at 18% 0, rgba(0, 122, 86, 0.18), transparent 34rem),
        linear-gradient(180deg, #07100d 0, #101714 250px, #f3f4ef 250px, #f3f4ef 100%);
    color: #151a17;
}

.admin-topbar {
    position: sticky;
    top: 0;
    z-index: 90;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(5, 8, 7, 0.9);
    color: #fff;
    backdrop-filter: blur(18px);
}

.admin-topbar__inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    width: var(--site-shell-width);
    max-width: none;
    margin: 0 auto;
    padding: 12px 0;
}

.admin-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    text-decoration: none;
}

.admin-brand img {
    width: 42px;
    height: 42px;
    object-fit: contain;
}

.admin-brand strong,
.admin-brand small {
    display: block;
    line-height: 1.1;
}

.admin-brand strong {
    font-size: 17px;
    font-weight: 950;
}

.admin-brand small {
    color: rgba(255, 255, 255, 0.64);
    font-size: 15px;
    font-weight: 700;
}

.admin-primary-nav {
    display: flex;
    justify-content: center;
    gap: 6px;
    min-width: 0;
    overflow-x: auto;
    padding: 2px;
    scrollbar-width: thin;
}

.admin-primary-nav a {
    flex: 0 0 auto;
    padding: 9px 13px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.admin-primary-nav a.is-active,
.admin-primary-nav a:hover {
    border-color: rgba(255, 217, 67, 0.45);
    background: #ffd943;
    color: #151a17;
}

.admin-logout-form {
    margin: 0;
}

.admin-user a,
.admin-logout-form button {
    flex: 0 0 auto;
    padding: 10px 12px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: rgba(255, 255, 255, 0.76);
    cursor: pointer;
    font-family: inherit;
    font-size: 15px;
    font-weight: 850;
    text-decoration: none;
}

.admin-user a:hover,
.admin-logout-form button:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

.admin-user {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    justify-self: end;
    min-width: 0;
}

.admin-user span {
    max-width: 230px;
    overflow: hidden;
    color: rgba(255, 255, 255, 0.78);
    font-size: 15px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-container {
    width: var(--site-shell-width);
    margin: 0 auto;
    padding: 26px 0 56px;
}

.admin-hero {
    display: grid;
    gap: 8px;
    margin-bottom: 18px;
    padding: 24px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    background:
        linear-gradient(135deg, rgba(7, 16, 13, 0.96), rgba(19, 34, 28, 0.92)),
        radial-gradient(circle at 80% 20%, rgba(0, 122, 86, 0.28), transparent 26rem);
    color: #fff;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.18);
}

.admin-hero p {
    margin: 0;
    color: #ffd943;
    font-size: 15px;
    font-weight: 950;
    letter-spacing: 0;
    text-transform: uppercase;
}

.admin-hero h1 {
    margin: 0;
    font-size: clamp(28px, 4vw, 46px);
    line-height: 1;
}

.admin-hero span {
    color: rgba(255, 255, 255, 0.76);
    font-size: 17px;
    font-weight: 650;
}

.admin-grid {
    display: grid;
    gap: 16px;
}

.admin-grid--two {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.42fr);
    align-items: start;
}

.admin-grid--review {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.36fr);
    align-items: start;
}

.admin-card {
    min-width: 0;
    padding: 18px;
    border: 1px solid #d8ddd5;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(14, 20, 16, 0.08);
}

.admin-card + .admin-card {
    margin-top: 14px;
}

.admin-card h2,
.admin-card h3 {
    margin: 0 0 12px;
    color: #141816;
    line-height: 1.1;
}

.admin-card h2 {
    font-size: 24px;
}

.admin-card h3 {
    font-size: 19px;
}

.admin-muted,
.admin-card .muted {
    color: #657069;
    font-size: 15px;
    line-height: 1.45;
}

.admin-stat-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.admin-stat {
    padding: 16px;
    border: 1px solid rgba(13, 24, 18, 0.1);
    border-radius: 10px;
    background:
        linear-gradient(135deg, #ffffff, #f5f6f1);
}

.admin-stat strong {
    display: block;
    color: #09100d;
    font-size: 31px;
    line-height: 1;
}

.admin-stat span {
    display: block;
    margin-top: 8px;
    color: #536059;
    font-size: 15px;
    font-weight: 800;
}

.admin-stat-grid .stat-card {
    padding: 16px;
    border: 1px solid rgba(13, 24, 18, 0.1);
    border-radius: 10px;
    background: #fff;
    box-shadow: none;
}

.admin-stat-grid .stat-card h3 {
    margin: 0 0 8px;
    color: #536059;
    font-size: 15px;
}

.admin-stat-grid .stat-card p {
    margin: 0;
    color: #09100d;
    font-size: 31px;
    line-height: 1;
}

.admin-tabs {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.admin-tabs a {
    padding: 9px 13px;
    border: 1px solid #d8ddd5;
    border-radius: 999px;
    background: #fff;
    color: #1b211d;
    font-size: 15px;
    font-weight: 850;
    text-decoration: none;
}

.admin-tabs a.is-active,
.admin-tabs a:hover {
    border-color: #101815;
    background: #101815;
    color: #fff;
}

.admin-table-wrap {
    overflow-x: auto;
    border: 1px solid #d8ddd5;
    border-radius: 10px;
    background: #fff;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
}

.admin-table th,
.admin-table td {
    padding: 13px 12px;
    border-bottom: 1px solid #e3e6df;
    text-align: left;
    vertical-align: top;
}

.admin-table th {
    color: #59645d;
    font-size: 15px;
    font-weight: 950;
    text-transform: uppercase;
}

.admin-table tr:last-child td {
    border-bottom: 0;
}

.admin-title-cell {
    display: grid;
    gap: 5px;
}

.admin-title-cell strong {
    color: #121713;
    font-size: 18px;
    line-height: 1.2;
}

.admin-title-cell span,
.admin-source-list a {
    color: #626d66;
    font-size: 15px;
}

.admin-view-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.admin-view-metrics div {
    min-width: 0;
    padding: 11px 12px;
    border: 1px solid #d8e1d9;
    border-radius: 8px;
    background: #f8faf6;
}

.admin-view-metrics dt {
    color: #607066;
    font-size: 12px;
    font-weight: 850;
    line-height: 1.2;
    text-transform: uppercase;
}

.admin-view-metrics dd {
    margin: 5px 0 0;
    color: #0b5b40;
    font-size: 24px;
    font-weight: 950;
    line-height: 1;
}

.admin-view-metrics-note {
    margin: 10px 0 0;
}

.admin-view-count strong {
    color: #0b5b40;
    font-size: 18px;
}

.queue-title {
    color: #121713;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.2;
}

.queue-meta {
    margin-top: 5px;
    color: #626d66;
    font-size: 15px;
    line-height: 1.35;
}

.admin-cover {
    width: 148px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 8px;
    background: #e6e9e2;
}

.admin-cover--large {
    width: 100%;
    aspect-ratio: 16 / 9;
}

.admin-badge,
.admin-score {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 950;
}

.admin-badge {
    background: #eef1eb;
    color: #354039;
}

.admin-score {
    min-width: 46px;
    background: #e8f8ee;
    color: #0a6d49;
}

.admin-score.is-ok {
    background: #fff7d6;
    color: #8c6500;
}

.admin-score.is-risk {
    background: #fff0ee;
    color: #b73727;
}

.admin-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}

.admin-shell button,
.admin-button,
.admin-link-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 9px 14px;
    border: 0;
    border-radius: 999px;
    background: #0b7c55;
    color: #fff;
    font: inherit;
    font-size: 15px;
    font-weight: 950;
    text-decoration: none;
    cursor: pointer;
}

.admin-link-button {
    background: #101815;
}

.admin-button--secondary,
.admin-shell button.secondary {
    background: #eef1eb;
    color: #202721;
}

.admin-button--danger,
.admin-shell button.danger {
    background: #b73727;
    color: #fff;
}

.admin-form {
    display: grid;
    gap: 12px;
}

.admin-form input,
.admin-form textarea,
.admin-form select {
    width: 100%;
    min-height: 44px;
    border: 1px solid #cfd5cc;
    border-radius: 8px;
    background: #fff;
    font-size: 16px;
}

.admin-form textarea {
    min-height: 120px;
    line-height: 1.55;
}

.admin-form textarea.admin-body-editor {
    min-height: 540px;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 15px;
}

.admin-form label {
    color: #303932;
    font-size: 15px;
    font-weight: 900;
}

.admin-shell .filters {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid #d8ddd5;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 12px 28px rgba(14, 20, 16, 0.06);
}

.admin-shell .filters label {
    color: #4f5a53;
    font-size: 13px;
    font-weight: 950;
}

.admin-shell .filters select,
.admin-shell .filters input {
    min-width: 210px;
    min-height: 42px;
    border: 1px solid #cfd5cc;
    border-radius: 8px;
    background: #fff;
    font-size: 15px;
}

.admin-shell .filters select[name="work_id"],
.admin-shell .filters select[name="article_key"] {
    flex: 1 1 420px;
}

.admin-autocomplete-picker input[type="search"] {
    flex: 1 1 420px;
}

.admin-editor-form {
    gap: 14px;
}

.admin-editor-toolbar {
    position: sticky;
    top: 74px;
    z-index: 80;
    margin-bottom: 2px;
    padding: 10px 12px;
    border: 1px solid rgba(216, 221, 213, 0.92);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 18px 40px rgba(14, 20, 16, 0.1);
    backdrop-filter: blur(14px);
}

.admin-editor-toolbar .admin-muted {
    margin-left: auto;
}

.admin-editor-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(350px, 420px);
    gap: 16px;
    align-items: start;
}

.admin-editor-main,
.admin-editor-side,
.admin-editor-sticky {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.admin-editor-sticky {
    position: sticky;
    top: 142px;
}

.admin-editor-card {
    border-radius: 8px;
}

.admin-editor-side .admin-card {
    box-shadow: 0 12px 28px rgba(14, 20, 16, 0.06);
}

.admin-editor-side .admin-card h2 {
    font-size: 20px;
}

.admin-editor-card label:not(.check-row),
.admin-editor-row-card label:not(.check-row) {
    display: block;
    margin-top: 10px;
}

.admin-editor-card .hub-editor-grid label,
.admin-editor-row-card .hub-editor-grid label,
.admin-editor-delete-check {
    margin-top: 0;
}

.hub-editor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    min-width: 0;
}

.hub-editor-grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-editor-side .hub-editor-grid,
.article-editor-layout .admin-editor-side .hub-editor-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-editor-span-2 {
    grid-column: 1 / -1;
}

.admin-form textarea.admin-body-editor {
    min-height: 600px;
}

.admin-editor-side textarea {
    min-height: 96px;
}

.admin-editor-side textarea[name="infobox_lines"] {
    min-height: 190px;
}

.admin-editor-side textarea[name="platform_lines"],
.admin-editor-side textarea[name="developer_lines"],
.admin-editor-side textarea[name="publisher_lines"] {
    min-height: 140px;
}

.admin-editor-row-list {
    display: grid;
    gap: 12px;
}

.admin-media-workbench {
    display: grid;
    gap: 14px;
    margin: 12px 0 16px;
}

.admin-media-inspector {
    display: grid;
    grid-template-columns: minmax(240px, 0.62fr) minmax(0, 1fr);
    gap: 14px;
    padding: 14px;
    border: 1px solid #cfd9d1;
    border-radius: 8px;
    background: #f8faf5;
}

.admin-media-inspector__aside {
    min-width: 0;
}

.admin-media-inspector__preview {
    display: grid;
    width: 100%;
    aspect-ratio: 16 / 10;
    margin-bottom: 12px;
    border: 1px solid #d8ddd5;
    border-radius: 8px;
    background: #eef1eb;
    color: #5d6961;
    overflow: hidden;
    place-items: center;
}

.admin-media-inspector__preview img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #f7f8f3;
}

.admin-media-inspector__preview span {
    padding: 10px;
    font-size: 13px;
    font-weight: 950;
    text-align: center;
}

.admin-media-inspector__preview.is-empty {
    border-style: dashed;
}

.admin-media-inspector__eyebrow {
    display: block;
    margin-bottom: 5px;
    color: #667169;
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
}

.admin-media-inspector strong {
    display: block;
    color: #151a17;
    font-size: 20px;
    line-height: 1.2;
}

.admin-media-inspector small {
    display: block;
    margin-top: 5px;
    color: #667169;
    font-size: 13px;
    font-weight: 750;
}

.admin-media-add-button {
    margin-top: 12px;
}

.admin-media-inspector__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.admin-media-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
    gap: 12px;
}

.admin-media-tile {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #d7ded4;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 6px 16px rgba(14, 20, 16, 0.05);
    cursor: grab;
}

.admin-media-tile.is-selected {
    border-color: #0b7c55;
    box-shadow: 0 0 0 2px rgba(11, 124, 85, 0.14), 0 8px 18px rgba(14, 20, 16, 0.07);
}

.admin-media-tile.is-dragging {
    opacity: 0.55;
    cursor: grabbing;
}

.admin-media-tile.is-marked-delete {
    opacity: 0.48;
    border-style: dashed;
}

.admin-media-tile.is-empty .admin-media-tile__preview {
    border-style: dashed;
}

.admin-shell .admin-media-tile__preview {
    position: relative;
    display: grid;
    width: auto;
    aspect-ratio: 16 / 9;
    margin: 10px 10px 0;
    min-height: 0;
    padding: 0;
    border: 1px solid #e0e6dc;
    border-radius: 6px;
    background: #f3f5f1;
    color: #4f5a53;
    place-items: center;
    overflow: hidden;
}

.admin-shell .admin-media-tile__preview img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 0;
    background: #f3f5f1;
    object-fit: contain;
}

.admin-shell .admin-media-tile__preview span {
    padding: 8px;
    font-size: 13px;
    font-weight: 950;
    text-align: center;
}

.admin-media-tile__body {
    display: grid;
    gap: 7px;
    padding: 10px;
}

.admin-media-tile__body strong {
    overflow: hidden;
    min-height: 32px;
    color: #1d241f;
    font-size: 13px;
    line-height: 1.25;
    text-overflow: ellipsis;
}

.admin-media-kind-select {
    min-height: 34px;
    font-size: 14px;
}

.admin-shell .admin-media-add-tile,
.admin-shell .admin-add-inline-card {
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 8px;
    min-height: 0;
    padding: 14px;
    border: 1px dashed #b8c5bb;
    border-radius: 6px;
    background: #fbfcf8;
    color: #0b6a49;
    box-shadow: inset 0 0 0 1px rgba(11, 124, 85, 0.04);
    cursor: pointer;
}

.admin-shell .admin-media-add-tile {
    aspect-ratio: 1 / 1.16;
}

.admin-shell .admin-add-inline-card {
    grid-template-columns: auto 1fr;
    align-items: center;
    justify-items: start;
    min-height: 56px;
    text-align: left;
}

.admin-shell .admin-media-add-tile:hover,
.admin-shell .admin-add-inline-card:hover {
    border-color: #0b7c55;
    background: #f2f8f4;
}

.admin-shell .admin-media-add-tile span,
.admin-shell .admin-add-inline-card span {
    display: grid;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    background: #0b7c55;
    color: #fff;
    font-size: 24px;
    font-weight: 950;
    line-height: 1;
    place-items: center;
}

.admin-shell .admin-media-add-tile strong,
.admin-shell .admin-add-inline-card strong {
    color: #153428;
    font-size: 13px;
    text-align: center;
}

.admin-shell .admin-add-inline-card strong {
    text-align: left;
}

.admin-media-hidden-rows {
    display: none;
}

.admin-link-row-card.is-hidden-new {
    display: none;
}

.admin-media-row-card {
    scroll-margin-top: 160px;
}

.admin-editor-row-card {
    min-width: 0;
    margin: 0;
    padding: 14px;
    border: 1px solid #dfe4dc;
    border-radius: 8px;
    background: #fafbf7;
}

.admin-editor-row-card legend {
    padding: 0 7px;
    color: #4f5a53;
    font-size: 13px;
    font-weight: 950;
    text-transform: uppercase;
}

.admin-editor-details {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #e3e7df;
}

.admin-editor-details summary {
    cursor: pointer;
    color: #0b6a49;
    font-size: 14px;
    font-weight: 950;
}

.admin-editor-details .hub-editor-grid {
    margin-top: 10px;
}

.check-row {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid #d8ddd5;
    border-radius: 8px;
    background: #f7f8f3;
    color: #303932;
    font-weight: 900;
}

.check-row input[type="checkbox"] {
    width: 18px;
    min-height: 18px;
    margin: 0;
}

.admin-editor-delete-check {
    align-self: end;
}

.admin-alert {
    margin-bottom: 14px;
    padding: 12px 14px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 800;
}

.admin-alert.error {
    border: 1px solid #efb4ac;
    background: #fff0ee;
    color: #a42f22;
}

.admin-alert.success {
    border: 1px solid #b9ddc3;
    background: #ecf8ef;
    color: #0b6a49;
}

.admin-empty {
    padding: 18px;
    border: 1px dashed #cad1c7;
    border-radius: 10px;
    background: #f7f8f3;
    color: #59645d;
    font-weight: 750;
}

.admin-sidebar {
    position: sticky;
    top: 88px;
}

.admin-source-list,
.admin-hub-list {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.admin-source-list a,
.admin-hub-list a {
    color: #0b6a49;
    font-weight: 800;
}

.admin-inline-form {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: 8px;
}

.admin-inline-form button {
    min-height: 32px;
    padding: 6px 10px;
    font-size: 13px;
}

.admin-version {
    display: grid;
    gap: 7px;
    padding: 12px;
    border: 1px solid #d8ddd5;
    border-radius: 8px;
    background: #f8f9f4;
}

.admin-version.is-selected {
    border-color: #0b7c55;
    box-shadow: 0 0 0 2px rgba(11, 124, 85, 0.12);
}

.admin-review-actions {
    display: grid;
    gap: 10px;
}

.admin-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.admin-route-card {
    color: #151a17;
    text-decoration: none;
    transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.admin-route-card:hover {
    border-color: #0b7c55;
    box-shadow: 0 22px 54px rgba(14, 20, 16, 0.14);
    transform: translateY(-1px);
}

.admin-route-card > p {
    margin: 0 0 7px;
    color: #0b6a49;
    font-size: 13px;
    font-weight: 950;
    text-transform: uppercase;
}

.admin-route-card > h2 {
    margin-bottom: 8px;
}

.admin-route-card > span {
    color: #59645d;
    line-height: 1.5;
}

.admin-preview-explainer {
    margin-bottom: 18px;
}

.admin-preview-explainer h2,
.admin-preview-explainer p {
    margin-top: 0;
}

.admin-preview-explainer p:last-child {
    margin-bottom: 0;
    color: #4f5a53;
    line-height: 1.55;
}

.admin-hub-preview-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.admin-hub-preview-card {
    display: grid;
    align-content: start;
    gap: 16px;
    margin: 0;
}

.admin-hub-preview-card__head {
    display: grid;
    gap: 12px;
}

.admin-hub-preview-card__head h2,
.admin-hub-preview-card__head p,
.admin-hub-preview-card .admin-alert,
.admin-hub-preview-card .admin-muted {
    margin: 0;
}

.admin-hub-preview-card .admin-badge {
    justify-self: start;
}

.admin-hub-preview-card .admin-badge.is-approved {
    background: #e8f8ee;
    color: #0a6d49;
}

.admin-hub-preview-card .admin-badge.is-pending {
    background: #fff7d6;
    color: #815e00;
}

.admin-hub-preview-card .admin-badge.is-queued,
.admin-hub-preview-card .admin-badge.is-running {
    background: #e8f1ff;
    color: #195c9e;
}

.admin-hub-preview-card .admin-badge.is-passed {
    background: #e8f8ee;
    color: #0a6d49;
}

.admin-hub-preview-card .admin-badge.is-failed,
.admin-hub-preview-card .admin-badge.is-blocked {
    background: #fff0ed;
    color: #a33327;
}

.admin-review-notice {
    display: grid;
    gap: 7px;
    padding: 13px 14px;
    border: 1px solid #dcae3f;
    border-left-width: 5px;
    border-radius: 10px;
    background: #fff8df;
    color: #5d4500;
    line-height: 1.5;
}

.admin-review-notice strong {
    color: #493600;
    font-size: 15px;
}

.admin-review-notice p {
    margin: 0;
}

.admin-review-notice span {
    font-size: 13px;
    font-weight: 900;
}

.admin-hub-preview-evidence {
    display: grid;
    gap: 8px;
    margin: 0;
}

.admin-hub-preview-evidence div {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);
    gap: 10px;
}

.admin-hub-preview-evidence dt {
    color: #657069;
    font-size: 13px;
    font-weight: 900;
}

.admin-hub-preview-evidence dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.admin-publication-state {
    display: grid;
    gap: 5px;
    padding: 12px 13px;
    border: 1px solid #d8ddd5;
    border-left-width: 5px;
    border-radius: 9px;
    background: #f8faf6;
}

.admin-publication-state strong,
.admin-publication-state p {
    margin: 0;
}

.admin-publication-state p {
    color: #536058;
    font-size: 13px;
    line-height: 1.45;
}

.admin-publication-state.is-ready,
.admin-publication-state.is-passed {
    border-left-color: #0b7c55;
}

.admin-publication-state.is-queued,
.admin-publication-state.is-running {
    border-left-color: #3979b8;
    background: #f2f7ff;
}

.admin-publication-state.is-failed,
.admin-publication-state.is-blocked {
    border-left-color: #ba3e31;
    background: #fff5f2;
}

.admin-hub-preview-card .admin-actions {
    align-self: end;
}

.admin-hub-preview-card .admin-actions form {
    display: contents;
}

.admin-release-status {
    display: grid;
    grid-template-columns: minmax(220px, .55fr) minmax(0, 1fr);
    gap: 18px 26px;
    align-items: start;
}

.admin-release-status h2,
.admin-release-status p {
    margin-top: 0;
}

.admin-release-status > p {
    grid-column: 1 / -1;
    margin-bottom: 0;
}

.admin-release-status dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.admin-release-status dl div {
    min-width: 0;
    padding: 12px;
    border: 1px solid #d8ddd5;
    border-radius: 8px;
    background: #f8faf6;
}

.admin-release-status dt {
    color: #657069;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.admin-release-status dd {
    margin: 6px 0 0;
    font-weight: 950;
}

.admin-release-status dd.is-ready { color: #0b6a49; }
.admin-release-status dd.is-paused { color: #8c6500; }
.admin-release-status dd.is-risk { color: #b73727; }

.admin-stat-card {
    display: grid;
    gap: 5px;
    padding: 18px;
    border: 1px solid #d8ddd5;
    border-radius: 10px;
    background: #fff;
}

.admin-stat-card strong {
    font-size: 34px;
    line-height: 1;
}

.admin-stat-card span {
    color: #59645d;
    font-weight: 750;
}

.admin-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.admin-login-page {
    display: grid;
    place-items: center;
    padding: 24px;
}

.admin-login-card {
    width: min(440px, 100%);
    padding: 28px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.26);
}

.admin-login-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.admin-login-brand img {
    width: 54px;
    height: 54px;
    object-fit: contain;
}

.admin-login-brand h1 {
    margin: 0;
    font-size: 27px;
    line-height: 1;
}

.admin-login-brand p {
    margin: 4px 0 0;
    color: #626d66;
    font-size: 15px;
    font-weight: 800;
}

@media (max-width: 1180px) {
    .admin-grid--two,
    .admin-grid--review,
    .admin-editor-layout {
        grid-template-columns: 1fr;
    }

    .admin-primary-nav {
        justify-content: flex-start;
    }

    .admin-user {
        justify-content: flex-start;
        justify-self: start;
    }

    .admin-sidebar,
    .admin-editor-sticky {
        position: static;
    }

    .admin-editor-toolbar {
        top: 110px;
    }

    .admin-stat-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .admin-release-status {
        grid-template-columns: 1fr;
    }

    .admin-release-status > p {
        grid-column: auto;
    }
}

@media (max-width: 720px) {
    .admin-container {
        width: var(--site-shell-width);
        padding-top: 16px;
    }

    .admin-topbar__inner {
        grid-template-columns: auto auto;
        padding: 10px 0;
    }

    .admin-primary-nav {
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100%;
        -ms-overflow-style: none;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .admin-primary-nav::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    .admin-user {
        grid-column: 2;
        grid-row: 1;
        justify-self: end;
    }

    .admin-shell .filters {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-shell .filters label,
    .admin-shell .filters select,
    .admin-shell .filters input,
    .admin-shell .filters button,
    .admin-shell .filters .admin-button {
        width: 100%;
    }

    .admin-autocomplete-picker input[type="search"] {
        flex: 0 0 auto;
        min-width: 0;
    }

    .admin-media-workbench {
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

    .admin-media-inspector {
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

    .admin-media-inspector__grid {
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

    .admin-media-workbench > *,
    .admin-media-inspector > *,
    .admin-media-inspector__grid > * {
        min-width: 0;
        max-width: 100%;
    }

    .admin-media-inspector strong,
    .admin-media-inspector small {
        overflow-wrap: anywhere;
    }

    .admin-brand span,
    .admin-user span {
        display: none;
    }

    .admin-editor-toolbar {
        position: static;
    }

    .hub-editor-grid,
    .hub-editor-grid--three,
    .admin-editor-side .hub-editor-grid,
    .article-editor-layout .admin-editor-side .hub-editor-grid {
        grid-template-columns: 1fr;
    }

    .admin-editor-span-2 {
        grid-column: auto;
    }

    .admin-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-dashboard-grid,
    .admin-hub-preview-grid,
    .admin-release-status dl {
        grid-template-columns: 1fr;
    }

    .admin-card,
    .admin-hero {
        padding: 14px;
    }

    .admin-table th,
    .admin-table td {
        padding: 10px 9px;
    }
}

.fancybox-bg {
    background: #000 !important;
}

.fancybox-is-open .fancybox-bg {
    opacity: .85 !important;
}

.fancybox-slide--image {
    padding: 72px 86px !important;
}

.fancybox-slide--image .fancybox-content {
    margin: 0 auto;
}

.fancybox-character-media .fancybox-slide--image {
    padding: 44px 56px !important;
}

.fancybox-character-media .fancybox-slide--image .fancybox-content {
    margin: 0 auto;
}

.fancybox-character-media .fancybox-image {
    object-fit: contain;
}

.fancybox-caption,
.fancybox-toolbar,
.fancybox-infobar {
    background: transparent !important;
}

.fancybox-caption {
    display: none !important;
}

.fancybox-toolbar .fancybox-button:not(.fancybox-button--close),
.fancybox-button--play,
.fancybox-button--thumbs,
.fancybox-button--zoom,
.fancybox-button--fs,
.fancybox-button--share,
.fancybox-button--slideShow,
.fancybox-button--download {
    display: none !important;
}

.fancybox-button--close,
.fancybox-button--download {
    position: fixed !important;
    top: 18px !important;
    width: 56px !important;
    height: 56px !important;
    border-radius: 50% !important;
    background: transparent !important;
    color: #fff !important;
    padding: 0 !important;
    opacity: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.fancybox-button--close {
    right: 24px !important;
}

.fancybox-button--download {
    top: 20px !important;
    right: 86px !important;
}

.fancybox-button--download svg {
    width: 32px !important;
    height: 32px !important;
}

.fancybox-button--download svg path {
    stroke: currentColor;
    stroke-width: 1.55;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.fancybox-button--close span {
    color: #fff;
    font-size: 38px;
    font-family: Arial, sans-serif;
    font-weight: 600;
    line-height: 1;
}

.fancybox-navigation .fancybox-button {
    width: 56px !important;
    height: 56px !important;
    background: transparent !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

.fancybox-button--arrow_left {
    left: var(--fancybox-nav-left, 24px) !important;
    padding: 0 !important;
}

.fancybox-button--arrow_right {
    right: calc(var(--fancybox-nav-right, 24px) - 10px) !important;
    padding: 0 !important;
}

.fancybox-navigation .fancybox-button div {
    padding: 0 !important;
}

.fancybox-navigation .fancybox-button svg {
    width: 44px !important;
    height: 44px !important;
}

.fancybox-infobar,
.fancybox-infobar span {
    font-size: 30px !important;
    line-height: 1 !important;
}

.fancybox-infobar {
    left: 24px !important;
    top: 24px !important;
}

.video-overlay {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 40px 20px 20px;
    background: rgba(0,0,0,.85);
    z-index: 9999;
}

.video-overlay.is-open {
    display: flex;
}

.video-overlay-content {
    width: min(1210px, 95vw);
    aspect-ratio: 16 / 9;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 20px 80px rgba(0,0,0,.6);
    background: #000;
}

.video-overlay-content iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

.video-overlay-close {
    position: absolute;
    top: 10px;
    right: 20px;
    left: auto;
    width: 56px;
    height: 56px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #fff;
    font-size: 44px;
    line-height: 1;
    cursor: pointer;
}

@media (max-width: 980px) {
    .fancybox-slide--image {
        padding: 62px 56px !important;
    }

    .fancybox-character-media .fancybox-slide--image {
        padding: 42px 44px !important;
    }
}

@media (max-width: 640px) {
    .fancybox-slide--image {
        padding: 58px 34px !important;
    }

    .fancybox-character-media .fancybox-slide--image {
        padding: 52px 22px 24px !important;
    }

    .fancybox-button--close,
    .fancybox-button--download {
        top: 12px !important;
        width: 48px !important;
        height: 48px !important;
    }

    .fancybox-button--close {
        right: 12px !important;
    }

    .fancybox-button--download {
        top: 13px !important;
        right: 66px !important;
    }

    .fancybox-button--arrow_left {
        left: var(--fancybox-nav-left, 10px) !important;
    }

    .fancybox-button--arrow_right {
        right: calc(var(--fancybox-nav-right, 10px) - 10px) !important;
    }

    .fancybox-button--close span {
        font-size: 31px;
    }

    .fancybox-button--download svg {
        width: 31px !important;
        height: 31px !important;
    }

    .fancybox-navigation .fancybox-button {
        width: 48px !important;
        height: 48px !important;
    }

    .fancybox-navigation .fancybox-button svg {
        width: 36px !important;
        height: 36px !important;
    }

    .fancybox-infobar,
    .fancybox-infobar span {
        font-size: 22px !important;
    }

    .fancybox-infobar {
        left: 12px !important;
        top: 14px !important;
    }

    .video-overlay {
        padding: 52px 10px 12px;
    }

    .video-overlay-close {
        top: 4px;
        right: 8px;
        width: 48px;
        height: 48px;
        font-size: 34px;
    }
}

/* source: 95-visual-content-editor.css */
/* Visual content editor
 *
 * The published hub remains the visual source of truth. Everything in this
 * file is editor-only chrome and is deliberately scoped to the editor body.
 */
body.visual-content-editor {
    --visual-editor-accent: #087758;
    --visual-editor-accent-strong: #045f46;
    --visual-editor-danger: #c52632;
    --visual-editor-danger-soft: #fff0f1;
    --visual-editor-focus: #1f74db;
    --visual-editor-ink: #17201c;
    --visual-editor-muted: #66716b;
    --visual-editor-panel: #fff;
    --visual-editor-line: rgba(18, 34, 26, 0.2);
    --visual-editor-shadow: 0 20px 60px rgba(8, 18, 13, 0.22);
}

body.visual-content-editor [hidden] {
    display: none !important;
}

body.visual-content-editor [data-visual-toolbar] {
    position: sticky;
    top: 0;
    z-index: 1300;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    min-height: 54px;
    padding: 9px 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0 0 12px 12px;
    background: rgba(12, 20, 16, 0.96);
    color: #fff;
    box-shadow: 0 10px 30px rgba(3, 8, 5, 0.2);
    backdrop-filter: blur(15px);
}

body.visual-content-editor .visual-editor-toolbar__identity {
    display: grid;
    gap: 2px;
    min-width: min(280px, 100%);
}

body.visual-content-editor .visual-editor-toolbar__identity span {
    color: rgba(255, 255, 255, 0.7);
    font-size: 12px;
    font-weight: 650;
}

body.visual-content-editor .visual-editor-toolbar__format,
body.visual-content-editor [data-visual-toolbar] form {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0;
}

body.visual-content-editor [data-visual-toolbar] form {
    margin-inline-start: auto;
}

body.visual-content-editor .visual-editor-exit {
    color: rgba(255, 255, 255, 0.8);
    font-size: 13px;
    font-weight: 800;
}

body.visual-content-editor [data-visual-toolbar] button,
body.visual-content-editor [data-visual-save],
body.visual-content-editor [data-visual-add],
body.visual-content-editor [data-visual-add-media],
body.visual-content-editor [data-visual-token-add],
body.visual-content-editor [data-modal-save],
body.visual-content-editor [data-modal-close],
body.visual-content-editor [data-visual-modal-close],
body.visual-content-editor [data-modal-delete] {
    min-height: 36px;
    padding: 8px 12px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.1);
    color: inherit;
    cursor: pointer;
    font: 800 14px/1 inherit;
}

body.visual-content-editor [data-visual-toolbar] button:hover,
body.visual-content-editor [data-visual-toolbar] button:focus-visible {
    border-color: rgba(255, 255, 255, 0.45);
    background: rgba(255, 255, 255, 0.18);
}

body.visual-content-editor [data-visual-toolbar] button[aria-pressed="true"] {
    border-color: #fff;
    background: #fff;
    color: var(--visual-editor-ink);
}

body.visual-content-editor [data-visual-save] {
    border-color: transparent;
    background: #ffd943;
    color: #171710;
}

body.visual-content-editor [data-visual-save]:hover,
body.visual-content-editor [data-visual-save]:focus-visible {
    background: #ffe46c;
}

body.visual-content-editor [data-visual-status] {
    min-width: 8ch;
    color: rgba(255, 255, 255, 0.72);
    font-size: 13px;
    font-weight: 750;
}

body.visual-content-editor [data-visual-status][data-state="dirty"] {
    color: #ffd943;
}

body.visual-content-editor [data-visual-status][data-state="error"] {
    color: #ff9ca4;
}

body.visual-content-editor [data-visual-field] {
    outline: 2px dashed transparent;
    outline-offset: 5px;
    transition: outline-color 150ms ease, box-shadow 150ms ease;
}

body.visual-content-editor [data-visual-field]:hover {
    outline-color: rgba(8, 119, 88, 0.5);
}

body.visual-content-editor [data-visual-field]:focus {
    outline-color: var(--visual-editor-focus);
    box-shadow: 0 0 0 5px rgba(31, 116, 219, 0.12);
}

body.visual-content-editor [data-visual-field][contenteditable="true"] {
    cursor: text;
}

/* The public article hero intentionally clamps its summary. Editing must
 * expose the entire value so the caret can reach every line. */
body.visual-content-editor .article-hero--reader [data-visual-field="summary"][contenteditable="true"],
body.visual-content-editor .article-hero--reader [data-visual-field="summary"][contenteditable="true"]:focus {
    display: block;
    max-height: none;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    -webkit-box-orient: initial;
    -webkit-line-clamp: unset;
    line-clamp: unset;
}

body.visual-content-editor [data-visual-field][contenteditable="true"]:empty::before {
    color: var(--visual-editor-muted);
    content: attr(data-placeholder);
    font-style: italic;
    pointer-events: none;
}

body.visual-content-editor [data-token-group],
body.visual-content-editor [data-visual-token-group] {
    position: relative;
}

body.visual-content-editor [data-token-list],
body.visual-content-editor [data-visual-token-list] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

body.visual-content-editor .visual-token {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    max-width: 100%;
    min-height: 34px;
    padding: 6px 7px 6px 11px;
    border: 1px solid rgba(8, 119, 88, 0.34);
    border-radius: 999px;
    background: rgba(8, 119, 88, 0.1);
    color: var(--visual-editor-ink);
    cursor: pointer;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
}

body.visual-content-editor .visual-token:hover,
body.visual-content-editor .visual-token:focus-visible {
    border-color: var(--visual-editor-accent);
    box-shadow: 0 0 0 3px rgba(8, 119, 88, 0.12);
    outline: 0;
}

body.visual-content-editor .visual-token.is-new,
body.visual-content-editor .visual-token[data-status="new"] {
    border-color: var(--visual-editor-danger);
    background: var(--visual-editor-danger-soft);
    color: #851721;
}

/* The public information card is nearly black. Give editor tokens their own
 * opaque surfaces instead of inheriting the light-page translucent chip. */
body.visual-content-editor .hub-side-widget--info.visual-editor-info .visual-token:not(.is-new):not([data-status="new"]) {
    border-color: #7ccdb4;
    background: #e6f7f1;
    color: #103b30;
}

body.visual-content-editor .hub-side-widget--info.visual-editor-info .visual-token:not(.is-new):not([data-status="new"]):hover,
body.visual-content-editor .hub-side-widget--info.visual-editor-info .visual-token:not(.is-new):not([data-status="new"]):focus-visible {
    border-color: #b7f1df;
    background: #fff;
    color: #092a22;
}

body.visual-content-editor .hub-side-widget--info.visual-editor-info .visual-token.is-new,
body.visual-content-editor .hub-side-widget--info.visual-editor-info .visual-token[data-status="new"] {
    border-color: #ff7d89;
    background: #ffe8ea;
    color: #76111b;
}

body.visual-content-editor [data-token-remove],
body.visual-content-editor [data-visual-remove],
body.visual-content-editor [data-visual-card-remove],
body.visual-content-editor [data-visual-media-remove] {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 25px;
    height: 25px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(19, 26, 22, 0.12);
    color: currentColor;
    cursor: pointer;
    font: 900 18px/1 Arial, sans-serif;
}

body.visual-content-editor [data-token-remove]:hover,
body.visual-content-editor [data-token-remove]:focus-visible,
body.visual-content-editor [data-visual-remove]:hover,
body.visual-content-editor [data-visual-remove]:focus-visible,
body.visual-content-editor [data-visual-card-remove]:hover,
body.visual-content-editor [data-visual-card-remove]:focus-visible,
body.visual-content-editor [data-visual-media-remove]:hover,
body.visual-content-editor [data-visual-media-remove]:focus-visible {
    background: var(--visual-editor-danger);
    color: #fff;
    outline: 2px solid #fff;
    outline-offset: 1px;
}

body.visual-content-editor [data-token-input],
body.visual-content-editor [data-visual-token-input] {
    min-width: min(220px, 100%);
    min-height: 36px;
    padding: 7px 11px;
    border: 1px dashed rgba(8, 119, 88, 0.58);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.88);
    color: var(--visual-editor-ink);
    font: 700 14px/1.2 inherit;
}

body.visual-content-editor [data-token-input]:focus,
body.visual-content-editor [data-visual-token-input]:focus {
    border-style: solid;
    border-color: var(--visual-editor-focus);
    box-shadow: 0 0 0 3px rgba(31, 116, 219, 0.14);
    outline: 0;
}

body.visual-content-editor .visual-editor-token-entry {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
}

body.visual-content-editor .visual-editor-token-entry [data-visual-token-input] {
    min-width: 0;
    width: 100%;
}

body.visual-content-editor [data-visual-card],
body.visual-content-editor [data-visual-media] {
    position: relative;
    cursor: pointer;
    outline: 2px dashed transparent;
    outline-offset: 3px;
}

body.visual-content-editor [data-visual-card]:hover,
body.visual-content-editor [data-visual-card]:focus-visible,
body.visual-content-editor [data-visual-media]:hover,
body.visual-content-editor [data-visual-media]:focus-visible {
    outline-color: rgba(8, 119, 88, 0.72);
}

body.visual-content-editor [data-visual-card] > [data-visual-remove],
body.visual-content-editor [data-visual-card] > [data-visual-card-remove],
body.visual-content-editor [data-visual-media] > [data-visual-remove],
body.visual-content-editor [data-visual-media] > [data-visual-media-remove] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 6;
    background: rgba(255, 255, 255, 0.94);
    color: var(--visual-editor-danger);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.22);
}

body.visual-content-editor [data-visual-add],
body.visual-content-editor [data-visual-add-media],
body.visual-content-editor [data-visual-token-add] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-width: 42px;
    border-color: rgba(8, 119, 88, 0.48);
    background: rgba(8, 119, 88, 0.08);
    color: var(--visual-editor-accent-strong);
}

body.visual-content-editor [data-visual-add]:hover,
body.visual-content-editor [data-visual-add]:focus-visible,
body.visual-content-editor [data-visual-add-media]:hover,
body.visual-content-editor [data-visual-add-media]:focus-visible,
body.visual-content-editor [data-visual-token-add]:hover,
body.visual-content-editor [data-visual-token-add]:focus-visible {
    border-color: var(--visual-editor-accent);
    background: rgba(8, 119, 88, 0.16);
}

body.visual-content-editor [data-visual-add][aria-disabled="true"],
body.visual-content-editor [data-visual-add-media][aria-disabled="true"] {
    cursor: not-allowed;
    opacity: 0.48;
}

body.visual-content-editor .visual-editor-card,
body.visual-content-editor .visual-editor-media {
    display: grid;
    min-height: 86px;
    place-items: center;
    padding: 18px 46px 18px 18px;
    border: 1px dashed rgba(8, 119, 88, 0.54);
    border-radius: 10px;
    background: rgba(8, 119, 88, 0.06);
    color: var(--visual-editor-ink);
    font-weight: 800;
}

body.visual-content-editor .visual-editor-media-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
    gap: 16px;
}

body.visual-content-editor .visual-editor-media-group {
    margin-top: 24px;
    padding: 18px;
    border: 1px solid var(--visual-editor-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.86);
}

body.visual-content-editor .visual-editor-media-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
    gap: 12px;
    margin-bottom: 12px;
}

body.visual-content-editor .visual-editor-media img {
    display: block;
    width: 100%;
    max-height: 220px;
    border-radius: 7px;
    object-fit: cover;
}

body.visual-content-editor .visual-editor-media figcaption {
    max-width: 100%;
    overflow-wrap: anywhere;
}

body.visual-content-editor .visual-editor-media-card {
    overflow: hidden;
    margin: 0;
    border: 1px solid var(--visual-editor-line);
    border-radius: 10px;
    background: #f2f5f3;
}

body.visual-content-editor .visual-editor-media-card img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

body.visual-content-editor .visual-editor-media-card figcaption {
    padding: 12px 14px;
    color: var(--visual-editor-ink);
    font-size: 14px;
    font-weight: 800;
}

body.visual-content-editor .visual-editor-media-card.is-video::after {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 5px 8px;
    border-radius: 999px;
    background: rgba(8, 13, 10, 0.82);
    color: #fff;
    content: "Vídeo";
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.visual-content-editor .visual-editor-flash {
    position: relative;
    z-index: 70;
    width: min(760px, calc(100% - 32px));
    margin: 12px auto;
    padding: 11px 14px;
    border: 1px solid rgba(8, 119, 88, 0.3);
    border-radius: 9px;
    background: #edf8f3;
    color: var(--visual-editor-accent-strong);
    font-size: 14px;
    font-weight: 800;
}

body.visual-content-editor .visual-editor-flash--error {
    border-color: rgba(197, 38, 50, 0.3);
    background: var(--visual-editor-danger-soft);
    color: var(--visual-editor-danger);
}

body.visual-content-editor .visual-editor-taxonomy-note {
    margin-top: 14px;
    color: var(--visual-editor-muted);
    font-size: 12px;
    line-height: 1.45;
}

body.visual-content-editor [data-visual-modal] {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: grid;
    overflow-y: auto;
    place-items: center;
    padding: 24px;
    border: 0;
    background: rgba(3, 8, 6, 0.72);
    color: var(--visual-editor-ink);
    backdrop-filter: blur(7px);
}

body.visual-content-editor .visual-editor-modal__backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

body.visual-content-editor [data-visual-modal-panel],
body.visual-content-editor .visual-modal__dialog,
body.visual-content-editor .visual-editor-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(680px, 100%);
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    padding: 24px;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 14px;
    background: var(--visual-editor-panel);
    box-shadow: var(--visual-editor-shadow);
}

body.visual-content-editor .visual-editor-modal__dialog > header,
body.visual-content-editor .visual-editor-modal__dialog > footer {
    display: flex;
    align-items: center;
    gap: 9px;
}

body.visual-content-editor .visual-editor-modal__dialog > header {
    justify-content: space-between;
    margin-bottom: 18px;
}

body.visual-content-editor .visual-editor-modal__dialog > header small {
    color: var(--visual-editor-accent-strong);
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.visual-content-editor .visual-editor-modal__dialog > footer {
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-top: 20px;
}

body.visual-content-editor .visual-editor-modal__x {
    flex: 0 0 auto;
    width: 38px;
    min-height: 38px;
    padding: 0;
    font-size: 22px;
}

body.visual-content-editor [data-visual-modal] h2,
body.visual-content-editor [data-visual-modal] h3 {
    margin-block: 0 18px;
    color: var(--visual-editor-ink);
}

body.visual-content-editor [data-visual-modal] label,
body.visual-content-editor [data-modal-field-wrap] {
    display: grid;
    gap: 6px;
    margin-block: 0 14px;
    color: var(--visual-editor-ink);
    font-size: 14px;
    font-weight: 800;
}

body.visual-content-editor [data-visual-modal] input,
body.visual-content-editor [data-visual-modal] textarea,
body.visual-content-editor [data-visual-modal] select,
body.visual-content-editor [data-modal-field][contenteditable="true"] {
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;
    border: 1px solid var(--visual-editor-line);
    border-radius: 8px;
    background: #fff;
    color: var(--visual-editor-ink);
    font: 600 15px/1.45 inherit;
}

body.visual-content-editor [data-visual-modal] input[type="checkbox"] {
    width: 20px;
    min-height: 20px;
    padding: 0;
}

body.visual-content-editor [data-visual-modal] textarea {
    min-height: 120px;
    resize: vertical;
}

body.visual-content-editor [data-visual-modal] input:focus,
body.visual-content-editor [data-visual-modal] textarea:focus,
body.visual-content-editor [data-visual-modal] select:focus,
body.visual-content-editor [data-modal-field][contenteditable="true"]:focus {
    border-color: var(--visual-editor-focus);
    box-shadow: 0 0 0 3px rgba(31, 116, 219, 0.14);
    outline: 0;
}

body.visual-content-editor [data-visual-modal-actions] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 9px;
    margin-top: 20px;
}

body.visual-content-editor [data-modal-save],
body.visual-content-editor [data-modal-close],
body.visual-content-editor [data-visual-modal-close],
body.visual-content-editor [data-modal-delete] {
    border-color: var(--visual-editor-line);
    background: #eef1ef;
    color: var(--visual-editor-ink);
}

body.visual-content-editor [data-modal-save] {
    border-color: var(--visual-editor-accent);
    background: var(--visual-editor-accent);
    color: #fff;
}

body.visual-content-editor [data-modal-delete] {
    margin-inline-end: auto;
    border-color: rgba(197, 38, 50, 0.3);
    background: var(--visual-editor-danger-soft);
    color: var(--visual-editor-danger);
}

body.visual-content-editor.is-visual-modal-open {
    overflow: hidden;
}

@media (max-width: 700px) {
    body.visual-content-editor [data-visual-toolbar] {
        top: 0;
        border-radius: 0;
    }

    body.visual-content-editor [data-visual-status] {
        order: 3;
        width: 100%;
    }

    body.visual-content-editor [data-visual-modal] {
        align-items: end;
        padding: 0;
    }

    body.visual-content-editor [data-visual-modal-panel],
    body.visual-content-editor .visual-modal__dialog,
    body.visual-content-editor .visual-editor-modal__dialog {
        width: 100%;
        max-height: 92vh;
        border-radius: 14px 14px 0 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.visual-content-editor [data-visual-field] {
        transition: none;
    }
}