@font-face {
    font-family:Mont;
    src:url('../fonts/Montserrat-Regular.woff2')
}

@font-face {
    font-family:Mont;
    src:url('../fonts/Montserrat-Bold.woff2');
    font-weight:700
}

@font-face {
    font-family:Roboto;
    src:url('../fonts/Roboto-Regular.woff2')
}

* {
    box-sizing:border-box
}

html {
    scroll-behavior:smooth
}

body {
    margin:0;
    background:#0b0a09;
    color:#e9e5dc;
    font-family:Roboto,Arial,sans-serif;
    line-height:1.6;
    overflow-x:hidden
}

body:before {
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    opacity:.07;
    z-index:20;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E")
}

.shell {
    width:min(1180px,calc(100% - 48px));
    margin:auto
}

a {
    color:inherit;
    text-decoration:none
}

img {
    display:block;
    width:100%;
    object-fit:cover
}

.status-strip {
    height:32px;
    border-bottom:1px solid #ffffff0d;
    background:#070706;
    color:#979188;
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:1.5px
}

.status-inner {
    height:100%;
    display:flex;
    align-items:center;
    justify-content:space-between
}

.status-live {
    display:flex;
    align-items:center;
    gap:8px;
    color:#bbb5aa
}

.status-live i {
    width:6px;
    height:6px;
    border-radius:50%;
    background:#c99338;
    box-shadow:0 0 9px #c99338
}

.status-stats {
    display:flex;
    gap:24px
}

.status-stats strong {
    color:#d5a44f;
    margin-left:4px
}

.status-stats a {
    color:#ddd6ca
}

.site-header {
    position:absolute;
    z-index:10;
    left:0;
    right:0;
    top:0
}

.site-header.scrolled .nav {
    background:#0a0908e8
}

.nav {
    height:86px;
    display:flex;
    align-items:center;
    border-bottom:1px solid #ffffff18;
    transition:.3s
}

.brand {
    display:flex;
    align-items:center;
    gap:11px;
    font-family:Mont,sans-serif;
    font-weight:700;
    line-height:.9;
    letter-spacing:1.7px
}

.brand b {
    color:#d59d41
}

.brand small {
    display:block;
    margin-top:7px;
    color:#777169;
    font:7px Mont,sans-serif;
    letter-spacing:3px;
    text-transform:uppercase
}

.brand-mark {
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border:1px solid #bd8837;
    color:#d29a3e;
    clip-path:polygon(50% 0,95% 25%,95% 75%,50% 100%,5% 75%,5% 25%)
}

.nav-links {
    display:flex;
    align-self:stretch;
    align-items:center;
    gap:32px;
    margin-left:auto
}

.nav-links a {
    position:relative;
    color:#b6b0a7;
    font:700 10px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1.2px
}

.nav-links a:after {
    content:"";
    position:absolute;
    left:0;
    right:100%;
    bottom:-17px;
    height:2px;
    background:#d09a43;
    transition:.25s
}

.nav-links a:hover,.nav-links .active {
    color:#fff
}

.nav-links a:hover:after,.nav-links .active:after {
    right:0
}

.nav-actions {
    display:flex;
    align-items:center;
    gap:18px;
    margin-left:32px
}

.text-link {
    font:700 10px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1px
}

.button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:24px;
    min-height:52px;
    padding:0 24px;
    background:#c98e32;
    color:#100e0b;
    border:1px solid #d7a24d;
    font:700 10px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1.4px;
    box-shadow:inset 0 0 0 1px #ffffff17;
    transition:.25s
}

.button:hover {
    background:#e0aa52;
    transform:translateY(-2px)
}

.button-small {
    min-height:38px;
    padding:0 17px
}

.menu-toggle {
    display:none;
    background:transparent;
    border:0;
    padding:8px
}

.menu-toggle span {
    display:block;
    width:24px;
    height:1px;
    background:#ddd;
    margin:6px
}

.hero {
    position:relative;
    min-height:820px;
    display:grid;
    align-items:center;
    padding:145px 0 70px;
    border-bottom:1px solid #a2702e66
}

.hero-backdrop {
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,#080807 5%,#080807e8 34%,#0808074f 67%,#080807d9 100%),linear-gradient(0deg,#0b0a09 0%,transparent 35%),url('../img/site/hero.jpg') center/cover
}

.hero-backdrop:after {
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 70% 44%,transparent 0 20%,#0005 75%)
}

.hero-grid {
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1fr) 330px;
    align-items:center;
    gap:90px
}

.hero-copy {
    max-width:720px
}

.eyebrow {
    margin:0 0 20px;
    color:#a79f93;
    font:700 10px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:3px
}

.eyebrow span,.world .eyebrow,.ranking .eyebrow {
    color:#d39b43
}

.hero h1,.section h2,.world h2,.ranking h2,.join h2 {
    margin:0;
    font:700 clamp(42px,6.3vw,82px)/.95 Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:-3px
}

.hero h1 em {
    color:#d19a43;
    font-style:normal
}

.lead {
    max-width:570px;
    margin:28px 0 32px;
    color:#c2bdb4;
    font-size:16px;
    line-height:1.8
}

.hero-actions {
    display:flex;
    gap:12px
}

.button-ghost {
    color:#eae6de;
    background:#14121099;
    border-color:#ffffff30
}

.play {
    display:grid;
    place-items:center;
    width:25px;
    height:25px;
    border:1px solid #777;
    border-radius:50%;
    font-size:8px
}

.hero-proof {
    display:flex;
    align-items:center;
    gap:16px;
    margin-top:46px
}

.avatars {
    display:flex
}

.avatars img {
    width:34px;
    height:34px;
    border-radius:50%;
    border:2px solid #12100e;
    margin-left:-8px
}

.avatars img:first-child {
    margin:0
}

.hero-proof p {
    margin:0;
    color:#bbb4a9;
    font-size:11px;
    line-height:1.5
}

.hero-proof strong {
    color:#fff
}

.hero-proof span {
    color:#817b72
}

.city-dossier {
    background:#0c0b09e8;
    border:1px solid #ffffff1a;
    box-shadow:0 22px 70px #000b;
    backdrop-filter:blur(7px)
}

.dossier-head {
    height:46px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 20px;
    border-bottom:1px solid #ffffff12;
    color:#827b72;
    font:700 9px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1.7px
}

.dossier-head b {
    color:#c8923c
}

.dossier-body {
    padding:33px 27px 28px;
    background:linear-gradient(#0c0b09dd,#0c0b09),url('../img/site/news-alley.jpg') center/cover
}

.case-label,.tag {
    display:inline-block;
    color:#d9a34c;
    font:700 8px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1.5px;
    border-left:2px solid #c38b36;
    padding-left:8px
}

.dossier-body h2 {
    font:700 25px/1.12 Mont,sans-serif;
    text-transform:uppercase;
    margin:14px 0
}

.dossier-body p {
    color:#948e84;
    font-size:12px
}

.event-meta {
    display:flex;
    gap:20px;
    margin-top:24px;
    color:#bbb4aa;
    font-size:10px;
    text-transform:uppercase
}

.city-dossier>a {
    height:49px;
    padding:0 27px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#d9a34c;
    font:700 9px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1.4px
}

.scroll-cue {
    position:absolute;
    bottom:25px;
    left:50%;
    transform:translateX(-50%);
    color:#6f6961;
    font:700 8px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:2px
}

.scroll-cue span {
    display:inline-block;
    width:35px;
    height:1px;
    margin:0 12px 3px;
    background:#846027
}

.ticker {
    background:#12100e;
    border-bottom:1px solid #ffffff0d
}

.ticker-inner {
    height:55px;
    display:flex;
    align-items:center;
    gap:30px;
    white-space:nowrap;
    overflow:hidden
}

.ticker b {
    height:100%;
    display:flex;
    align-items:center;
    padding-right:30px;
    border-right:1px solid #ffffff12;
    color:#d8a047;
    font:700 9px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1.5px
}

.ticker p {
    margin:0;
    color:#8f887e;
    font-size:11px
}

.ticker p span {
    color:#bd8735;
    margin-right:11px
}

.ticker a {
    margin-left:auto;
    color:#b8b2a8;
    font:700 9px Mont,sans-serif;
    text-transform:uppercase
}

.section {
    padding:110px 0
}

.section-heading {
    display:flex;
    align-items:end;
    justify-content:space-between;
    margin-bottom:44px
}

.section-heading .eyebrow {
    margin-bottom:10px
}

.section h2,.world h2,.ranking h2 {
    font-size:clamp(34px,4vw,54px);
    letter-spacing:-2px
}

.underlink {
    color:#c69a55;
    font:700 9px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1.4px;
    border-bottom:1px solid #6b4e25;
    padding-bottom:8px
}

.news-grid {
    display:grid;
    grid-template-columns:1.18fr 1fr;
    gap:20px
}

.news-card {
    position:relative;
    min-height:490px;
    overflow:hidden;
    border:1px solid #ffffff12
}

.news-card>img {
    position:absolute;
    height:100%;
    filter:saturate(.7)
}

.news-overlay {
    position:absolute;
    inset:0;
    padding:45% 34px 30px;
    display:flex;
    flex-direction:column;
    justify-content:end;
    background:linear-gradient(0deg,#090807 10%,#090807dc 50%,transparent 85%)
}

.date {
    color:#6f6961;
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:1px
}

.news-overlay h3,.news-row h3 {
    font:700 24px/1.18 Mont,sans-serif;
    text-transform:uppercase;
    margin:4px 0 12px
}

.news-overlay>p:not(.date) {
    color:#9f998f;
    font-size:12px
}

.news-overlay a,.news-row a {
    margin-top:8px;
    color:#d3a153;
    font:700 9px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1px
}

.news-list {
    display:grid;
    gap:20px
}

.news-row {
    display:grid;
    grid-template-columns:40% 1fr;
    min-height:235px;
    border:1px solid #ffffff12;
    background:#100f0d
}

.news-row img {
    height:100%
}

.news-row>div {
    padding:27px
}

.news-row h3 {
    font-size:17px
}

.news-row p:not(.date) {
    color:#8e887f;
    font-size:11px;
    margin:7px 0
}

.news-row .tag {
    float:left;
    margin:3px 15px 5px 0
}

.world {
    padding:120px 0;
    background:linear-gradient(90deg,#0d0c0a 30%,#0d0c0ad9),url('../img/site/world-bg.jpg') center/cover;
    border-block:1px solid #ffffff0e
}

.world-grid {
    display:grid;
    grid-template-columns:.72fr 1.28fr;
    gap:80px;
    align-items:center
}

.world-copy>p:not(.eyebrow) {
    max-width:370px;
    color:#969086;
    font-size:13px;
    margin:27px 0
}

.button-outline {
    background:transparent;
    color:#d8a34c;
    border-color:#7d5a27
}

.feature-grid {
    display:grid;
    grid-template-columns:1fr 1fr
}

.feature-card {
    position:relative;
    min-height:250px;
    padding:35px;
    border:1px solid #ffffff0f;
    background:#0c0b0ae8
}

.feature-card:nth-child(2n) {
    background:#12100ee8
}

.feature-no {
    position:absolute;
    right:22px;
    top:18px;
    color:#49443d;
    font:700 10px Mont
}

.feature-icon {
    color:#d09a43;
    font-size:27px
}

.feature-card h3 {
    margin:28px 0 8px;
    font:700 14px Mont,sans-serif;
    text-transform:uppercase
}

.feature-card p {
    margin:0;
    color:#827c72;
    font-size:11px
}

.heading-copy {
    width:360px;
    color:#847e75;
    font-size:12px
}

.gallery-grid {
    display:grid;
    grid-template-columns:1.35fr 1fr;
    grid-template-rows:235px 235px;
    gap:14px
}

.gallery-grid figure {
    position:relative;
    margin:0;
    overflow:hidden
}

.gallery-grid figure:after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,#090807d9,transparent 55%)
}

.gallery-grid img {
    height:100%;
    transition:.5s
}

.gallery-grid figure:hover img {
    transform:scale(1.035)
}

.gallery-main {
    grid-row:1/3
}

.gallery-grid figcaption {
    position:absolute;
    z-index:1;
    left:24px;
    right:24px;
    bottom:20px;
    display:flex;
    align-items:center;
    gap:14px
}

.gallery-grid figcaption>span {
    color:#d49c41;
    font:700 9px Mont
}

.gallery-grid figcaption b {
    display:block;
    font:700 11px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1px
}

.gallery-grid figcaption small {
    color:#8f887f;
    font-size:9px
}

.ranking {
    padding:105px 0;
    background:#100e0c;
    border-block:1px solid #ffffff0e
}

.ranking-grid {
    display:grid;
    grid-template-columns:.75fr 1.25fr;
    gap:90px;
    align-items:center
}

.ranking-copy p:not(.eyebrow) {
    max-width:340px;
    color:#8e887e;
    font-size:12px;
    margin:25px 0
}

.leaderboard {
    list-style:none;
    margin:0;
    padding:0;
    border-top:1px solid #ffffff12
}

.leaderboard li {
    display:grid;
    grid-template-columns:40px 52px 1fr auto;
    gap:18px;
    align-items:center;
    padding:19px 15px;
    border-bottom:1px solid #ffffff12
}

.leaderboard img {
    width:52px;
    height:52px;
    border-radius:50%;
    filter:sepia(.2)
}

.rank {
    color:#685f54;
    font:700 11px Mont
}

.leaderboard b {
    display:block;
    font:700 12px Mont;
    text-transform:uppercase
}

.leaderboard small {
    color:#746e65;
    font:9px Mont;
    text-transform:uppercase;
    letter-spacing:.5px
}

.leaderboard>li>strong {
    color:#d6a04a;
    font:700 14px Mont;
    text-align:right
}

.leaderboard strong small {
    display:block
}

.join {
    position:relative;
    min-height:520px;
    display:grid;
    place-items:center;
    text-align:center
}

.join-bg {
    position:absolute;
    inset:0;
    background:linear-gradient(#090807ad,#090807e8),url('../img/site/join-bg.jpg') center 42%/cover
}

.join-inner {
    position:relative;
    padding:80px 0
}

.join h2 {
    font-size:clamp(40px,5vw,64px)
}

.join p {
    color:#9c958b;
    font-size:13px
}

.join .button {
    margin:18px 0
}

.join small {
    display:block;
    color:#6f6960;
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:1px
}

footer {
    background:#070706;
    border-top:1px solid #ffffff10
}

.footer-top {
    display:flex;
    justify-content:space-between;
    padding:65px 0
}

.footer-links {
    display:grid;
    grid-template-columns:repeat(3,130px);
    gap:30px
}

.footer-links b,.footer-links a {
    display:block
}

.footer-links b {
    margin-bottom:13px;
    font:700 10px Mont;
    text-transform:uppercase;
    color:#d4a04a
}

.footer-links a {
    color:#817b72;
    font-size:10px;
    margin:7px 0
}

.footer-bottom {
    display:flex;
    justify-content:space-between;
    padding:18px 0;
    border-top:1px solid #ffffff0d;
    color:#514d47;
    font-size:8px;
    text-transform:uppercase;
    letter-spacing:1px
}

.reveal {
    opacity:0;
    transform:translateY(18px);
    transition:opacity .65s ease,transform .65s ease
}

.reveal.visible {
    opacity:1;
    transform:none
}

@media(max-width:980px) {
    .nav-links {
        position:absolute;
        display:none;
        top:118px;
        left:24px;
        right:24px;
        margin:0;
        padding:20px;
        align-items:flex-start;
        flex-direction:column;
        background:#0b0a09;
        border:1px solid #ffffff17
    }

    .nav-links.open {
        display:flex
    }

    .nav-links a:after {
        display:none
    }

    .menu-toggle {
        display:block;
        margin-left:auto
    }

    .nav-actions {
        margin-left:10px
    }

    .hero-grid {
        grid-template-columns:1fr;
        gap:45px
    }

    .city-dossier {
        max-width:440px
    }

    .hero {
        padding-top:185px
    }

    .news-grid,.world-grid,.ranking-grid {
        grid-template-columns:1fr
    }

    .world-copy,.ranking-copy {
        max-width:600px
    }

    .ranking-grid {
        gap:45px
    }

}

@media(max-width:700px) {
    .shell {
        width:min(100% - 30px,1180px)
    }

    .status-stats span {
        display:none
    }

    .nav {
        height:74px
    }

    .nav-actions .text-link {
        display:none
    }

    .button-small {
        display:none
    }

    .nav-links {
        top:106px
    }

    .hero {
        min-height:auto;
        padding:160px 0 75px
    }

    .hero h1 {
        font-size:46px
    }

    .hero-actions {
        align-items:stretch;
        flex-direction:column
    }

    .city-dossier {
        display:none
    }

    .scroll-cue {
        display:none
    }

    .ticker-inner p:nth-of-type(2) {
        display:none
    }

    .section {
        padding:75px 0
    }

    .section-heading {
        align-items:flex-start;
        gap:20px
    }

    .section-heading .underlink {
        display:none
    }

    .news-grid {
        grid-template-columns:1fr
    }

    .news-card {
        min-height:430px
    }

    .news-row {
        grid-template-columns:1fr;
        min-height:0
    }

    .news-row img {
        height:190px
    }

    .world {
        padding:80px 0
    }

    .world-grid {
        gap:45px
    }

    .feature-grid {
        grid-template-columns:1fr
    }

    .gallery-grid {
        display:flex;
        overflow:auto;
        scroll-snap-type:x mandatory
    }

    .gallery-grid figure {
        flex:0 0 86%;
        height:360px;
        scroll-snap-align:start
    }

    .heading-copy {
        display:none
    }

    .ranking {
        padding:75px 0
    }

    .leaderboard li {
        grid-template-columns:27px 45px 1fr
    }

    .leaderboard img {
        width:45px;
        height:45px
    }

    .leaderboard>li>strong {
        display:none
    }

    .join {
        min-height:470px
    }

    .footer-top {
        display:block
    }

    .footer-links {
        grid-template-columns:repeat(3,1fr);
        margin-top:45px
    }

    .footer-bottom {
        gap:20px
    }

    .brand {
        font-size:13px
    }

}

@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto
    }

    .reveal {
        opacity:1;
        transform:none;
        transition:none
    }

    * {
        animation:none!important;
        transition:none!important
    }

}

/* Readability and multi-page layout */ body {
    font-size:16px;
    line-height:1.75
}

.nav-links a,.text-link,.button,.ticker a,.underlink {
    font-size:12px
}

.status-strip {
    font-size:12px
}

.lead {
    font-size:19px;
    line-height:1.75
}

.eyebrow {
    font-size:12px
}

.dossier-body p,.world-copy>p:not(.eyebrow),.ranking-copy p:not(.eyebrow),.heading-copy {
    font-size:15px
}

.feature-card p,.news-row p:not(.date),.news-overlay>p:not(.date) {
    font-size:14px
}

.ticker p {
    font-size:14px
}

.hero {
    min-height:760px
}

.module-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px
}

.module-card {
    overflow:hidden;
    border:1px solid #ffffff16;
    background:#11100e
}

.module-card img {
    height:190px;
    filter:saturate(.75)
}

.module-card div {
    padding:25px
}

.module-card h3 {
    margin:0 0 10px;
    font:700 17px Mont,sans-serif;
    text-transform:uppercase
}

.module-card p {
    margin:0;
    color:#aaa399;
    font-size:15px
}

.content-split {
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:70px
}

.content-image {
    min-height:410px;
    border:1px solid #ffffff18
}

.link-card-grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:16px
}

.link-card-grid a {
    position:relative;
    padding:28px;
    border:1px solid #ffffff17;
    background:#100f0d
}

.link-card-grid b,.link-card-grid span {
    display:block
}

.link-card-grid b {
    font:700 17px Mont,sans-serif;
    text-transform:uppercase
}

.link-card-grid span {
    margin-top:8px;
    color:#a39d94;
    font-size:15px
}

.link-card-grid i {
    position:absolute;
    right:24px;
    top:24px;
    color:#d09a43;
    font-style:normal
}

.page-hero {
    position:relative;
    padding:190px 0 75px;
    background:linear-gradient(90deg,#090807f2,#09080799),url('../img/site/join-bg.jpg') center/cover;
    border-bottom:1px solid #6f4d24
}

.breadcrumbs {
    margin:0 0 20px;
    color:#aaa399;
    font-size:14px
}

.breadcrumbs a {
    color:#d2a04e
}

.page-hero h1 {
    margin:0;
    font:700 clamp(38px,5vw,64px)/1 Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:-2px
}

.page-hero p:last-child {
    max-width:720px;
    margin:22px 0 0;
    color:#cbc5bb;
    font-size:18px
}

.page-content {
    padding:75px 0 110px
}

.reading-column {
    max-width:840px
}

.reading-column h2 {
    margin:48px 0 14px;
    font:700 28px Mont,sans-serif;
    text-transform:uppercase
}

.reading-column p,.reading-column li {
    color:#c1bbb1;
    font-size:17px
}

.reading-column strong {
    color:#fff
}

.wide-cover {
    height:390px;
    margin-bottom:40px;
    border:1px solid #ffffff18
}

.version-list {
    display:grid;
    gap:16px
}

.version-entry {
    border:1px solid #ffffff17;
    background:#11100e
}

.version-entry button {
    width:100%;
    padding:22px 24px;
    display:flex;
    justify-content:space-between;
    color:#eee8de;
    background:transparent;
    border:0;
    text-align:left;
    font:700 16px Mont,sans-serif;
    cursor:pointer
}

.version-entry button span {
    color:#d19a43
}

.version-details {
    display:none;
    padding:0 24px 24px;
    color:#bdb6ac;
    font-size:16px
}

.version-entry.open .version-details {
    display:block
}

.version-entry.open button i {
    transform:rotate(180deg)
}

.version-entry i {
    font-style:normal;
    transition:.2s
}

.gallery-page {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px
}

.gallery-page figure {
    margin:0;
    overflow:hidden;
    border:1px solid #ffffff17;
    background:#11100e
}

.gallery-page img {
    height:260px;
    transition:transform .25s
}

.gallery-page figure:hover img {
    transform:scale(1.02)
}

.notice-panel {
    padding:28px;
    border-left:3px solid #d09a43;
    background:#13110f
}

.notice-panel h2 {
    margin-top:0;
    font:700 24px Mont;
    text-transform:uppercase
}

.event-empty {
    padding:70px 30px;
    text-align:center;
    border:1px solid #ffffff17;
    background:#100f0d
}

.event-empty h2 {
    font:700 25px Mont;
    text-transform:uppercase
}

.event-empty p {
    max-width:600px;
    margin:12px auto;
    color:#aaa399;
    font-size:16px
}

.staff-table {
    width:100%;
    margin-top:35px;
    border-collapse:collapse
}

.staff-table th,.staff-table td {
    padding:18px;
    border-bottom:1px solid #ffffff17;
    text-align:left;
    font-size:16px
}

.staff-table th {
    color:#d3a04b;
    font:700 12px Mont;
    text-transform:uppercase
}

.auth-page {
    min-height:100vh;
    display:grid;
    grid-template-columns:1.1fr .9fr;
    background:#090807
}

.auth-visual {
    position:relative;
    background:linear-gradient(#09080755,#090807b8),url('../img/site/hero.jpg') center/cover
}

.auth-visual .brand {
    position:absolute;
    top:40px;
    left:45px
}

.auth-quote {
    position:absolute;
    left:45px;
    right:45px;
    bottom:50px
}

.auth-quote h1 {
    max-width:600px;
    margin:0;
    font:700 clamp(36px,4vw,58px)/1 Mont;
    text-transform:uppercase
}

.auth-panel {
    display:grid;
    place-items:center;
    padding:60px
}

.auth-box {
    width:min(100%,460px)
}

.auth-box h1 {
    font:700 34px Mont;
    text-transform:uppercase
}

.auth-box>p {
    color:#aaa399;
    font-size:16px
}

.field {
    margin:20px 0
}

.field label {
    display:block;
    margin-bottom:8px;
    color:#d7d0c5;
    font-size:15px
}

.field input {
    width:100%;
    height:54px;
    padding:0 16px;
    color:#fff;
    background:#12110f;
    border:1px solid #ffffff20;
    font:16px Roboto
}

.field input:focus {
    outline:2px solid #b98131;
    outline-offset:2px
}

.check-row {
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin:18px 0;
    color:#b6afa5;
    font-size:14px
}

.check-row input {
    margin-top:6px
}

.auth-submit {
    width:100%
}

.auth-links {
    margin-top:25px;
    color:#a9a298;
    font-size:15px
}

.auth-links a {
    color:#d3a04b
}

.helper {
    color:#817b72;
    font-size:14px
}

@media(max-width:900px) {
    .module-grid {
        grid-template-columns:repeat(2,1fr)
    }

    .content-split {
        grid-template-columns:1fr
    }

    .gallery-page {
        grid-template-columns:repeat(2,1fr)
    }

    .auth-page {
        grid-template-columns:1fr
    }

    .auth-visual {
        min-height:340px
    }

    .auth-panel {
        padding:50px 24px
    }

}

@media(max-width:620px) {
    body {
        font-size:16px
    }

    .lead {
        font-size:17px
    }

    .module-grid,.link-card-grid,.gallery-page {
        grid-template-columns:1fr
    }

    .module-card img,.gallery-page img {
        height:210px
    }

    .page-hero {
        padding:155px 0 55px
    }

    .page-hero p:last-child {
        font-size:16px
    }

    .reading-column p,.reading-column li {
        font-size:16px
    }

    .auth-visual {
        min-height:280px
    }

    .auth-visual .brand {
        top:25px;
        left:24px
    }

    .auth-quote {
        left:24px;
        bottom:30px
    }

    .auth-panel {
        padding:40px 20px
    }

    .footer-links {
        gap:15px
    }

}

/* Poster-style homepage â€” structurally inspired, visually NetGengszter noir */ .poster-site {
    background:#100907;
    color:#ead9c2;
    font-family:Roboto,Arial,sans-serif
}

.poster-site:before {
    opacity:.045
}

.poster-header {
    position:absolute;
    z-index:30;
    top:0;
    left:0;
    right:0;
    height:48px;
    padding:0 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:#130907e8;
    border-bottom:1px solid #b4762d66
}

.poster-wordmark {
    color:#e5a33b;
    font:700 14px Mont,sans-serif;
    letter-spacing:.4px
}

.poster-wordmark b {
    color:#f0bd58
}

.poster-header nav {
    height:100%;
    display:flex;
    align-items:center
}

.poster-logout-form {
    margin:0;
    padding:0
}

.poster-nav-link {
    appearance:none;
    width:100%;
    margin:0;
    border:0;
    border-radius:0;
    background:transparent;
    text-align:left;
    cursor:pointer
}

.poster-header nav a,.poster-header nav .poster-nav-link {
    height:100%;
    display:flex;
    align-items:center;
    padding:0 14px;
    color:#d89a39;
    font:700 11px Mont,sans-serif;
    text-transform:uppercase
}

.poster-header nav a:hover,.poster-header nav .poster-nav-link:hover {
    background:#7f371f;
    color:#ffd170
}

.poster-menu-button {
    display:none;
    color:#e4a341;
    background:transparent;
    border:1px solid #9a632d;
    padding:7px 10px;
    font:700 11px Mont;
    text-transform:uppercase
}

.poster-hero {
    position:relative;
    height:min(76vw,780px);
    min-height:600px;
    display:grid;
    place-items:center;
    background:url('../img/site/hero.jpg') center 42%/cover;
    border-bottom:1px solid #9a6028
}

.poster-hero-shade {
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,#10070655 0%,#10070608 35%,#100706cc 100%),linear-gradient(90deg,#10070688 0%,transparent 42%,#10070644 100%)
}

.poster-logo-lockup {
    position:relative;
    text-align:center;
    text-shadow:0 3px 25px #000
}

.poster-monogram,.poster-seal {
    display:grid;
    place-items:center;
    margin:0 auto 18px;
    width:70px;
    height:70px;
    color:#e4a23d;
    border:2px solid #c78031;
    clip-path:polygon(50% 0,94% 24%,94% 74%,50% 100%,6% 74%,6% 24%);
    font:700 20px Mont,sans-serif
}

.poster-logo-lockup h1 {
    margin:0;
    color:#ead7bb;
    font:700 clamp(46px,8vw,104px)/.9 Mont,sans-serif;
    letter-spacing:-5px
}

.poster-logo-lockup h1 b {
    color:#d89334
}

.poster-logo-lockup p {
    margin:24px 0 0;
    color:#d8c1a3;
    font:700 13px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:5px
}

.poster-scroll {
    position:absolute;
    bottom:22px;
    left:50%;
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    transform:translateX(-50%);
    color:#e6a23d;
    border:1px solid #a1682d;
    border-radius:50%;
    font-size:20px
}

.poster-section {
    padding:86px 24px;
    text-align:center
}

.poster-narrow {
    width:min(720px,100%);
    margin:auto
}

.poster-wide {
    width:min(1040px,100%);
    margin:auto
}

.poster-kicker {
    margin:0 0 16px;
    color:#cb812d;
    font:700 12px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:3px
}

.poster-section h2 {
    margin:0;
    color:#e5c49b;
    font:700 clamp(34px,5vw,58px)/1.05 Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:-2px
}

.poster-intro,.poster-story-cta p {
    max-width:680px;
    margin:25px auto;
    color:#c2aa8e;
    font-size:18px;
    line-height:1.8
}

.poster-start {
    background:#190b08
}

.poster-actions {
    display:flex;
    justify-content:center;
    gap:18px;
    margin:38px 0 20px
}

.poster-ribbon {
    position:relative;
    min-width:220px;
    padding:13px 28px;
    display:inline-flex;
    justify-content:center;
    align-items:center;
    color:#e6a23b;
    background:#642614;
    font:700 13px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1.5px;
    clip-path:polygon(4% 0,96% 0,100% 50%,96% 100%,4% 100%,0 50%)
}

.poster-ribbon:hover {
    color:#160906;
    background:#d88d31
}

.poster-ribbon-bright {
    color:#1a0b07;
    background:#dfa13a
}

.poster-note {
    color:#8b6550;
    font-size:14px
}

.poster-preview {
    padding-top:35px;
    background:#190b08
}

.poster-screen {
    position:relative;
    display:block;
    padding:8px;
    background:#3a1b12;
    border:1px solid #8a4c25;
    box-shadow:0 20px 55px #0008
}

.poster-screen img {
    height:auto;
    max-height:610px;
    object-fit:cover
}

.poster-screen span {
    position:absolute;
    left:50%;
    bottom:28px;
    transform:translateX(-50%);
    padding:10px 18px;
    color:#f0c17b;
    background:#140b08df;
    font:700 11px Mont;
    text-transform:uppercase;
    letter-spacing:1px
}

.poster-link-grid {
    margin:46px auto 0;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px 50px;
    max-width:760px
}

.poster-link-grid .poster-ribbon {
    width:100%
}

.poster-systems {
    background:#120806
}

.poster-image-pair {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:28px;
    margin:42px 0
}

.poster-image-pair a {
    padding:6px;
    background:#35160e;
    border:1px solid #71401f
}

.poster-image-pair img {
    aspect-ratio:16/10;
    object-fit:cover
}

.poster-system-list {
    max-width:850px;
    margin:32px auto 0;
    padding:0;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0;
    list-style:none;
    border-top:1px solid #6c381b
}

.poster-system-list li {
    padding:15px 20px;
    color:#c4a78a;
    border-bottom:1px solid #6c381b;
    font-size:16px
}

.poster-system-list li:nth-child(odd) {
    border-right:1px solid #6c381b
}

.poster-story-cta {
    background:linear-gradient(#170906e8,#170906f5),url('../img/site/join-bg.jpg') center/cover
}

.poster-story-cta .poster-seal {
    width:62px;
    height:62px
}

.poster-story-cta .poster-ribbon {
    margin-top:14px
}

.poster-footer {
    padding:55px 24px 36px;
    text-align:center;
    background:#0d0504;
    border-top:1px solid #5a2d16
}

.poster-footer-links {
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px 30px;
    margin-bottom:45px
}

.poster-footer-links a {
    color:#bd762a;
    font:700 11px Mont;
    text-transform:uppercase
}

.poster-footer .poster-seal {
    width:48px;
    height:48px;
    font-size:13px;
    margin-bottom:20px
}

.poster-footer p {
    color:#6f4431;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:1px
}

@media(max-width:760px) {
    .poster-header {
        height:54px
    }

    .poster-menu-button {
        display:block
    }

    .poster-header nav {
        position:absolute;
        display:none;
        top:54px;
        left:0;
        right:0;
        height:auto;
        align-items:stretch;
        flex-direction:column;
        background:#130907f5;
        border-bottom:1px solid #7b421e
    }

    .poster-header nav.open {
        display:flex
    }

    .poster-header nav a,.poster-header nav .poster-nav-link {
        padding:14px 20px
    }

    .poster-hero {
        height:680px;
        min-height:0
    }

    .poster-logo-lockup h1 {
        font-size:48px;
        letter-spacing:-3px
    }

    .poster-logo-lockup p {
        font-size:11px;
        letter-spacing:3px
    }

    .poster-actions {
        flex-direction:column;
        align-items:center
    }

    .poster-ribbon {
        width:min(100%,360px)
    }

    .poster-link-grid {
        grid-template-columns:1fr;
        gap:14px
    }

    .poster-image-pair,.poster-system-list {
        grid-template-columns:1fr
    }

    .poster-system-list li:nth-child(odd) {
        border-right:0
    }

    .poster-section {
        padding:65px 18px
    }

    .poster-intro,.poster-story-cta p {
        font-size:16px
    }

    .poster-screen span {
        bottom:15px;
        white-space:nowrap
    }

}

/* Shared poster navigation and inner pages */ .poster-nav-group {
    position:relative;
    height:100%
}

.poster-nav-group>button {
    height:100%;
    padding:0 14px;
    color:#d89a39;
    background:transparent;
    border:0;
    font:700 11px Mont,sans-serif;
    text-transform:uppercase;
    cursor:pointer
}

.poster-nav-group>button span {
    margin-left:4px;
    font-size:9px
}

.poster-nav-group:hover>button,.poster-nav-group:focus-within>button,.poster-nav-group.open>button {
    color:#ffd170;
    background:#7f371f
}

.poster-submenu {
    position:absolute;
    display:none;
    top:100%;
    left:0;
    min-width:190px;
    padding:0px 0;
    background:#180a07f7;
    border:1px solid #81451f;
    box-shadow:0 18px 35px #0009
}

.poster-nav-group:hover .poster-submenu,.poster-nav-group:focus-within .poster-submenu,.poster-nav-group.open .poster-submenu {
    display:block
}

.poster-header nav .poster-submenu a,.poster-header nav .poster-submenu .poster-nav-link {
    height:auto;
    padding:12px 16px;
    color:#c98b38;
    border-bottom:1px solid #ffffff0c;
    white-space:nowrap
}

.poster-header nav .poster-submenu a:last-child,.poster-header nav .poster-submenu .poster-nav-link:last-child {
    border-bottom:0
}

.poster-header nav .poster-submenu a:hover,.poster-header nav .poster-submenu .poster-nav-link:hover {
    color:#ffd078;
    background:#572010
}

.poster-submenu-right {
    left:auto;
    right:0
}

.inner-poster .page-hero {
    padding:155px 24px 72px;
    background:linear-gradient(90deg,#120706f5,#12070690),url('../img/site/join-bg.jpg') center 40%/cover;
    border-bottom:1px solid #84481f;
    text-align:center
}

.inner-poster .page-hero .shell {
    width:min(880px,100%)
}

.inner-poster .breadcrumbs {
    color:#9c6b4a;
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:1.5px
}

.inner-poster .breadcrumbs a {
    color:#d48d35
}

.inner-poster .page-hero h1 {
    color:#e4c39a;
    font-size:clamp(42px,6vw,68px);
    letter-spacing:-2px
}

.inner-poster .page-hero p:last-child {
    margin:20px auto 0;
    color:#c6ab8e;
    font-size:17px
}

.inner-poster .page-content {
    padding:76px 24px 105px;
    background:#120806
}

.inner-poster .page-content.shell {
    width:100%;
    max-width:none
}

.inner-poster .page-content>* {
    width:min(1040px,100%);
    margin-left:auto;
    margin-right:auto
}

.inner-poster .reading-column {
    max-width:820px
}

.inner-poster .wide-cover {
    height:auto;
    max-height:460px;
    padding:6px;
    object-fit:cover;
    background:#35160e;
    border:1px solid #75401f
}

.inner-poster .reading-column h2 {
    color:#d99a43;
    font-size:27px
}

.inner-poster .reading-column p {
    color:#c5ac91;
    font-size:17px;
    line-height:1.9
}

.inner-poster .reading-column>.button {
    margin-top:18px;
    color:#150806;
    background:#d89537;
    border:0;
    clip-path:polygon(4% 0,96% 0,100% 50%,96% 100%,4% 100%,0 50%)
}

.inner-poster .version-list {
    max-width:850px
}

.inner-poster .version-entry {
    background:#1a0c08;
    border:1px solid #6b3519
}

.inner-poster .version-entry button {
    color:#e0c09a
}

.inner-poster .version-entry button span {
    color:#db963c
}

.inner-poster .version-details {
    color:#b99e82
}

.inner-poster .gallery-page {
    max-width:1100px;
    gap:18px
}

.inner-poster .gallery-page figure {
    padding:5px;
    background:#35160e;
    border:1px solid #75401f
}

.inner-poster .gallery-page img {
    height:260px
}

.inner-poster .event-empty {
    max-width:820px;
    background:#190b08;
    border:1px solid #6d371a
}

.inner-poster .event-empty h2 {
    color:#dda04a
}

.inner-poster .event-empty p {
    color:#bda386
}

.inner-poster .notice-panel {
    background:#1b0d09;
    border-left-color:#d68e35
}

.inner-poster .notice-panel h2 {
    color:#dc9941
}

.inner-poster .staff-table th {
    color:#d99a43
}

.inner-poster .staff-table th,.inner-poster .staff-table td {
    border-color:#613119
}

.compact-footer {
    padding-top:45px
}

.compact-footer .poster-footer-links {
    margin-bottom:35px
}

.auth-page {
    background:#120806
}

.auth-panel {
    background:#120806
}

.auth-box h1 {
    color:#e0bd91
}

.auth-box>p,.auth-links {
    color:#b89f84
}

.field input {
    background:#1a0c08;
    border-color:#6c371c
}

.field label {
    color:#d7bc9b
}

.auth-submit {
    background:#d89537;
    border-color:#e0aa53;
    clip-path:polygon(3% 0,97% 0,100% 50%,97% 100%,3% 100%,0 50%)
}

@media(max-width:760px) {
    .poster-nav-group {
        height:auto
    }

    .poster-nav-group>button {
        width:100%;
        height:auto;
        padding:14px 20px;
        text-align:left
    }

    .poster-submenu,.poster-submenu-right {
        position:static;
        display:none;
        min-width:0;
        margin:0;
        border-width:1px 0;
        box-shadow:none
    }

    .poster-nav-group:hover .poster-submenu {
        display:none
    }

    .poster-nav-group.open .poster-submenu {
        display:block
    }

    .poster-header nav .poster-submenu a,.poster-header nav .poster-submenu .poster-nav-link {
        padding-left:38px
    }

    .inner-poster .page-hero {
        padding:125px 18px 55px
    }

    .inner-poster .page-content {
        padding:55px 16px 75px
    }

    .inner-poster .gallery-page img {
        height:220px
    }

}

/* V2 â€” generated monochrome header, wider content, deliberate mobile layout */ .poster-header {
    height:58px;
    padding:0 clamp(20px,3vw,52px);
    background:#0c0908f2;
    border-color:#5d5146;
    box-shadow:0 8px 30px #0008
}

.poster-wordmark {
    color:#c8b8a5;
    font-size:15px;
    letter-spacing:1px
}

.poster-wordmark b {
    color:#eee3d6
}

.poster-header nav a,.poster-header nav .poster-nav-link,.poster-nav-group>button {
    padding-inline:18px;
    color:#a99b8d;
    font-size:12px;
    letter-spacing:.35px
}

.poster-header nav>a:hover,.poster-nav-group:hover>button,.poster-nav-group:focus-within>button,.poster-nav-group.open>button {
    color:#f0e5d8;
    background:#26201c
}

.poster-submenu {
    background:#100d0bf9;
    border-color:#554a40
}

.poster-header nav .poster-submenu a,.poster-header nav .poster-submenu .poster-nav-link {
    color:#b7a99a;
    background:transparent
}

.poster-header nav .poster-submenu a:hover,.poster-header nav .poster-submenu .poster-nav-link:hover {
    color:#f3e9dd;
    background:#27211d
}

.poster-hero {
    height:clamp(620px,57vw,880px);
    background-image:url('../img/site/noir-header-v2.png');
    background-position:center;
    background-size:cover;
    border-color:#695848
}

.poster-hero-shade {
    background:linear-gradient(180deg,#08060545 0%,transparent 44%,#100a07c7 100%)
}

.poster-logo-lockup {
    margin-left:10%;
    padding:25px 40px;
    background:#0b080676;
    border:1px solid #c6aa8b38;
    backdrop-filter:blur(2px)
}

.poster-monogram,.poster-seal {
    color:#c7ab8c;
    border-color:#a4896e
}

.poster-logo-lockup h1 {
    color:#e7ddcf;
    font-size:clamp(50px,7vw,100px)
}

.poster-logo-lockup h1 b {
    color:#bda184
}

.poster-logo-lockup p {
    color:#c3b4a3
}

.poster-scroll {
    color:#c5ad91;
    border-color:#8a7662
}

.poster-section {
    padding:clamp(72px,7vw,120px) clamp(20px,4vw,64px)
}

.poster-wide {
    width:min(1440px,100%)
}

.poster-narrow {
    width:min(900px,100%)
}

.poster-section h2 {
    color:#e0d2c1
}

.poster-kicker {
    color:#a99177
}

.poster-ribbon {
    color:#c7b39d;
    background:#33241d
}

.poster-ribbon:hover {
    color:#f2e7db;
    background:#574234
}

.poster-ribbon-bright {
    color:#17110d;
    background:#b89a78
}

.poster-start,.poster-preview {
    background:#170f0b
}

.poster-systems {
    background:#100b09
}

.poster-screen {
    padding:10px;
    background:#2b211b;
    border-color:#685849
}

.poster-screen-main img {
    width:100%;
    max-height:none;
    aspect-ratio:16/8.2;
    object-fit:cover;
    object-position:top center
}

.poster-screen span {
    color:#ddd0c1;
    background:#0e0a08e8
}

.poster-link-grid {
    max-width:980px;
    gap:22px 70px
}

.poster-image-pair {
    gap:34px
}

.poster-image-pair a {
    padding:8px;
    background:#2b211b;
    border-color:#675747
}

.poster-system-list {
    max-width:1180px;
    grid-template-columns:repeat(3,1fr);
    border-color:#51443a
}

.poster-system-list li {
    min-height:72px;
    display:grid;
    place-items:center;
    color:#baa995;
    border-color:#51443a
}

.poster-system-list li:nth-child(odd) {
    border-right:0
}

.poster-system-list li:not(:nth-child(3n)) {
    border-right:1px solid #51443a
}

.poster-story-cta {
    background:linear-gradient(#100b09e9,#100b09f6),url('../img/site/noir-header-v2.png') center/cover
}

.inner-poster .page-hero {
    min-height:390px;
    padding:160px clamp(24px,5vw,80px) 78px;
    background:linear-gradient(90deg,#0c0908ed,#0c090878),url('../img/site/noir-header-v2.png') center 44%/cover;
    border-color:#5e5044
}

.inner-poster .page-hero .shell {
    width:min(1280px,100%);
    text-align:left
}

.inner-poster .breadcrumbs {
    color:#968777
}

.inner-poster .breadcrumbs a {
    color:#c1ab92
}

.inner-poster .page-hero h1 {
    color:#e4d9cc;
    font-size:clamp(48px,6vw,78px)
}

.inner-poster .page-hero p:last-child {
    max-width:850px;
    margin:22px 0 0;
    color:#c3b5a5;
    font-size:19px
}

.inner-poster .page-content {
    padding:clamp(70px,7vw,115px) clamp(24px,5vw,80px);
    background:#100b09
}

.inner-poster .page-content>* {
    width:min(1440px,100%)
}

.inner-poster .reading-column {
    max-width:1180px
}

.inner-poster .reading-column p {
    max-width:1050px;
    font-size:18px
}

.inner-poster .reading-column h2 {
    max-width:1050px;
    color:#c3a17e;
    font-size:32px
}

.inner-poster .wide-cover {
    width:100%;
    max-height:620px
}

.inner-poster .version-list {
    max-width:1240px
}

.inner-poster .version-entry button {
    padding:27px 30px;
    font-size:18px
}

.inner-poster .version-details {
    padding:0 30px 30px;
    font-size:17px
}

.inner-poster .gallery-page {
    max-width:1440px;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px
}

.inner-poster .gallery-page figure {
    padding:7px;
    background:#28201b;
    border-color:#5f5145
}

.inner-poster .gallery-page img {
    height:auto;
    aspect-ratio:16/10;
    object-fit:cover
}

.inner-poster .event-empty {
    max-width:1180px;
    padding:90px 50px;
    background:#15100d;
    border-color:#5e5044
}

.inner-poster .event-empty p {
    max-width:760px;
    font-size:18px
}

.inner-poster .notice-panel {
    max-width:1050px;
    padding:36px;
    background:#17120f;
    border-color:#aa8c6c
}

.inner-poster .staff-table {
    max-width:1050px
}

.inner-poster .staff-table th,.inner-poster .staff-table td {
    padding:22px;
    font-size:17px;
    border-color:#51443a
}

.compact-footer {
    padding-inline:clamp(24px,5vw,80px)
}

@media(max-width:980px) {
    .poster-header {
        height:58px
    }

    .poster-menu-button {
        display:block;
        color:#c8b8a5;
        border-color:#605348
    }

    .poster-header nav {
        position:absolute;
        display:none;
        top:58px;
        left:0;
        right:0;
        height:auto;
        align-items:stretch;
        flex-direction:column;
        background:#0d0a09fa;
        border-bottom:1px solid #574b41
    }

    .poster-header nav.open {
        display:flex
    }

    .poster-header nav>a {
        height:auto;
        padding:15px 24px
    }

    .poster-nav-group {
        height:auto
    }

    .poster-nav-group>button {
        width:100%;
        height:auto;
        padding:15px 24px;
        text-align:left
    }

    .poster-submenu,.poster-submenu-right {
        position:static;
        display:none;
        min-width:0;
        margin:0;
        border-width:1px 0;
        box-shadow:none
    }

    .poster-nav-group:hover .poster-submenu {
        display:none
    }

    .poster-nav-group.open .poster-submenu {
        display:block
    }

    .poster-header nav .poster-submenu a,.poster-header nav .poster-submenu .poster-nav-link {
        height:auto;
        padding:13px 42px
    }

    .poster-logo-lockup {
        margin-left:16%;
    }

    .poster-system-list {
        grid-template-columns:1fr 1fr
    }

    .poster-system-list li:not(:nth-child(3n)) {
        border-right:0
    }

    .poster-system-list li:nth-child(odd) {
        border-right:1px solid #51443a
    }

    .inner-poster .gallery-page {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }

}

@media(max-width:640px) {
    .poster-header {
        padding:0 16px
    }

    .poster-wordmark {
        font-size:13px
    }

    .poster-hero {
        height:620px;
        background-position:42% center
    }

    .poster-logo-lockup {
        width:calc(100% - 32px);
        margin:130px 16px 0;
        padding:24px 14px
    }

    .poster-monogram {
        width:54px;
        height:54px;
        font-size:15px
    }

    .poster-logo-lockup h1 {
        font-size:42px;
        letter-spacing:-2px
    }

    .poster-logo-lockup p {
        font-size:10px;
        letter-spacing:2.3px
    }

    .poster-section {
        padding:62px 16px
    }

    .poster-section h2 {
        font-size:34px;
        letter-spacing:-1px
    }

    .poster-screen {
        margin-inline:-8px;
        padding:5px
    }

    .poster-screen-main img {
        aspect-ratio:4/3;
        object-position:20% top
    }

    .poster-screen span {
        display:none
    }

    .poster-link-grid {
        margin-top:34px
    }

    .poster-image-pair {
        grid-template-columns:1fr;
        gap:18px
    }

    .poster-image-pair img {
        aspect-ratio:4/3
    }

    .poster-system-list {
        grid-template-columns:1fr
    }

    .poster-system-list li,.poster-system-list li:nth-child(odd) {
        min-height:0;
        padding:18px 12px;
        border-right:0
    }

    .inner-poster .page-hero {
        min-height:330px;
        padding:125px 18px 50px;
        background-position:36% center
    }

    .inner-poster .page-hero .shell {
        text-align:left
    }

    .inner-poster .page-hero h1 {
        font-size:42px
    }

    .inner-poster .page-hero p:last-child {
        font-size:16px
    }

    .inner-poster .page-content {
        padding:52px 16px 72px
    }

    .inner-poster .reading-column p {
        font-size:16px;
        line-height:1.8
    }

    .inner-poster .reading-column h2 {
        font-size:25px
    }

    .inner-poster .wide-cover {
        margin-bottom:28px;
        padding:4px
    }

    .inner-poster .gallery-page {
        grid-template-columns:1fr;
        gap:14px
    }

    .inner-poster .gallery-page figure {
        padding:4px
    }

    .inner-poster .gallery-page img {
        aspect-ratio:4/3
    }

    .inner-poster .event-empty {
        padding:52px 20px
    }

    .inner-poster .staff-table,.inner-poster .staff-table tbody,.inner-poster .staff-table tr,.inner-poster .staff-table td {
        display:block;
        width:100%
    }

    .inner-poster .staff-table thead {
        display:none
    }

    .auth-page {
        display:block
    }

    .auth-visual {
        min-height:260px
    }

    .auth-quote h1 {
        font-size:32px
    }

    .auth-panel {
        padding:42px 18px
    }

    .auth-box h1 {
        font-size:30px
    }

}

/* V3 â€” game palette and continuous hero-to-content composition */ .poster-site {
    background:#071015;
    color:#dde2df
}

.poster-header {
    background:#050b0ff2;
    border-color:#263944
}

.poster-wordmark {
    color:#98a9ae
}

.poster-wordmark b {
    color:#d7a45b
}

.poster-header nav a,.poster-header nav .poster-nav-link,.poster-nav-group>button {
    color:#9aabb0
}

.poster-header nav>a:hover,.poster-nav-group:hover>button,.poster-nav-group:focus-within>button,.poster-nav-group.open>button {
    color:#f2eee6;
    background:#14232b
}

.poster-submenu {
    background:#071116fa;
    border-color:#2d414b
}

.poster-header nav .poster-submenu a,.poster-header nav .poster-submenu .poster-nav-link {
    color:#a4b2b5
}

.poster-header nav .poster-submenu a:hover,.poster-header nav .poster-submenu .poster-nav-link:hover {
    color:#f1e9dc;
    background:#152832
}

.poster-hero {
    isolation:isolate;
    background-image:url('../img/site/noir-header-v3.png');
    border-bottom:0
}

.poster-hero:after {
    content:"";
    position:absolute;
    z-index:1;
    left:0;
    right:0;
    bottom:-2px;
    height:240px;
    pointer-events:none;
    background:linear-gradient(180deg,transparent 0%,#07101536 32%,#071015 100%)
}

.poster-hero-shade {
    z-index:0;
    background:linear-gradient(180deg,#03090d33 0%,transparent 42%,#07101538 74%,#071015 100%)
}

.poster-logo-lockup {
    z-index:2;
    background:#0610168a;
    border-color:#6d84904f
}

.poster-logo-lockup h1 {
    color:#e7e9e5
}

.poster-logo-lockup h1 b {
    color:#d5a257
}

.poster-logo-lockup p {
    color:#aebbc0
}

.poster-monogram,.poster-seal {
    color:#d3a158;
    border-color:#b48443
}

.poster-scroll {
    z-index:3;
    color:#d6a45d;
    border-color:#9d7440
}

.poster-section {
    position:relative
}

.poster-start {
    z-index:2;
    margin-top:-74px;
    padding-top:150px;
    background:radial-gradient(circle at 50% -25%,#18313d 0,transparent 48%),#071015
}

.poster-preview {
    background:linear-gradient(180deg,#071015,#0a151a)
}

.poster-systems {
    background:linear-gradient(180deg,#0a151a,#071015)
}

.poster-section h2 {
    color:#e0e4e1
}

.poster-kicker {
    color:#d0a05c
}

.poster-intro,.poster-story-cta p {
    color:#aebabe
}

.poster-note {
    color:#71858d
}

.poster-ribbon {
    color:#d7ddd9;
    background:#162933
}

.poster-ribbon:hover {
    color:#081015;
    background:#d6a45b
}

.poster-ribbon-bright {
    color:#071015;
    background:#d6a45b
}

.poster-screen {
    background:#0e1e26;
    border-color:#35505d;
    box-shadow:0 22px 60px #0009
}

.poster-screen span {
    color:#eee7db;
    background:#071015e8
}

.poster-image-pair a {
    background:#0e1e26;
    border-color:#35505d
}

.poster-system-list {
    border-color:#29404b
}

.poster-system-list li {
    color:#aebbc0;
    border-color:#29404b
}

.poster-system-list li:not(:nth-child(3n)),.poster-system-list li:nth-child(odd) {
    border-color:#29404b
}

.poster-story-cta {
    background:linear-gradient(#061015d9,#061015f5),url('../img/site/noir-header-v3.png') center 58%/cover
}

.poster-footer {
    background:#040a0e;
    border-color:#243640
}

.poster-footer-links a {
    color:#a7b3b6
}

.poster-footer p {
    color:#526771
}

.inner-poster .page-hero {
    background:linear-gradient(90deg,#061015e8,#06101566),url('../img/site/noir-header-v3.png') center 45%/cover;
    border-color:#2e4652
}

.inner-poster .breadcrumbs {
    color:#7f949d
}

.inner-poster .breadcrumbs a {
    color:#d0a15e
}

.inner-poster .page-hero h1 {
    color:#e5e8e4
}

.inner-poster .page-hero p:last-child {
    color:#aebbc0
}

.inner-poster .page-content {
    background:linear-gradient(180deg,#0a161c,#071015)
}

.inner-poster .reading-column p {
    color:#b8c2c3
}

.inner-poster .reading-column h2 {
    color:#d1a15d
}

.inner-poster .wide-cover,.inner-poster .gallery-page figure {
    background:#0e1e26;
    border-color:#35505d
}

.inner-poster .version-entry,.inner-poster .event-empty,.inner-poster .notice-panel {
    background:#0b1a21;
    border-color:#314a57
}

.inner-poster .version-entry button {
    color:#dfe4e1
}

.inner-poster .version-entry button span,.inner-poster .event-empty h2,.inner-poster .notice-panel h2,.inner-poster .staff-table th {
    color:#d2a15c
}

.inner-poster .version-details,.inner-poster .event-empty p {
    color:#adbbbe
}

.inner-poster .staff-table th,.inner-poster .staff-table td {
    border-color:#29404b
}

.auth-page,.auth-panel {
    background:#071015
}

.auth-visual {
    background:linear-gradient(#06101544,#061015bd),url('../img/site/noir-header-v3.png') center/cover
}

.auth-box h1 {
    color:#e2e6e2
}

.auth-box>p,.auth-links {
    color:#aab8bc
}

.field input {
    background:#0b1a21;
    border-color:#314a57
}

.field label {
    color:#c4ced0
}

.auth-submit {
    background:#d4a258;
    border-color:#e1b46f
}

@media(max-width:980px) {
    .poster-system-list li:nth-child(odd) {
        border-color:#29404b
    }

    .poster-menu-button {
        color:#bdc7c8;
        border-color:#3b515b
    }

    .poster-header nav {
        background:#050d12fa;
        border-color:#2b414b
    }

}

@media(max-width:640px) {
    .poster-hero {
        background-position:39% center
    }

    .poster-hero:after {
        height:180px
    }

    .poster-start {
        margin-top:-58px;
        padding-top:112px
    }

    .poster-logo-lockup {
        background:#061016a3
    }

    .poster-screen {
        box-shadow:0 14px 40px #0008
    }

    .inner-poster .page-hero {
        background-position:34% center
    }

}

/* V4 â€” exact palette sampled from the current game UI */ .poster-site {
    background:#120e09;
    color:#f5ead7
}

.poster-header {
    background:#120e09f4;
    border-color:#4b3516
}

.poster-wordmark {
    color:#d7c3a2
}

.poster-wordmark b {
    color:#f0bc55
}

.poster-header nav a,.poster-header nav .poster-nav-link,.poster-nav-group>button {
    color:#d7c6a2
}

.poster-header nav>a:hover,.poster-nav-group:hover>button,.poster-nav-group:focus-within>button,.poster-nav-group.open>button {
    color:#f7f1e7;
    background:#2e2214
}

.poster-submenu {
    background:#120e09fa;
    border-color:#4b3516
}

.poster-header nav .poster-submenu a,.poster-header nav .poster-submenu .poster-nav-link {
    color:#d7c3a2
}

.poster-header nav .poster-submenu a:hover,.poster-header nav .poster-submenu .poster-nav-link:hover {
    color:#fff;
    background:#2e2214
}

.poster-hero {
    background-image:url('../img/site/noir-header-game-palette.png')
}

.poster-hero:after {
    background:linear-gradient(180deg,transparent 0%,#120e0930 30%,#120e09 100%)
}

.poster-hero-shade {
    background:linear-gradient(180deg,#120e0938 0%,transparent 42%,#120e0940 74%,#120e09 100%)
}

.poster-logo-lockup {
    background:#120e0991;
    border-color:#f0bc5540
}

.poster-logo-lockup h1 {
    color:#f5ead7
}

.poster-logo-lockup h1 b {
    color:#f0bc55
}

.poster-logo-lockup p {
    color:#d7c3a2
}

.poster-monogram,.poster-seal {
    color:#f0bc55;
    border-color:#d7ad5f
}

.poster-scroll {
    color:#f0bc55;
    border-color:#4b3516
}

.poster-start {
    background:radial-gradient(circle at 50% -30%,#3c2c18 0,transparent 48%),#120e09
}

.poster-preview {
    background:linear-gradient(180deg,#120e09,#1b130b)
}

.poster-systems {
    background:linear-gradient(180deg,#1b130b,#120e09)
}

.poster-section h2 {
    color:#f5ead7
}

.poster-kicker {
    color:#f0bc55
}

.poster-intro,.poster-story-cta p {
    color:#d7c3a2
}

.poster-note {
    color:#bdb2a2
}

.poster-ribbon {
    color:#f5ead7;
    background:#2e2214
}

.poster-ribbon:hover {
    color:#120e09;
    background:#f0bc55
}

.poster-ribbon-bright {
    color:#120e09;
    background:#f0bc55
}

.poster-screen,.poster-image-pair a {
    background:#1b130b;
    border-color:#4b3516
}

.poster-system-list {
    border-color:#4b3516
}

.poster-system-list li,.poster-system-list li:not(:nth-child(3n)),.poster-system-list li:nth-child(odd) {
    color:#d7c3a2;
    border-color:#4b3516
}

.poster-story-cta {
    background:linear-gradient(#120e09df,#120e09f5),url('../img/site/noir-header-game-palette.png') center 58%/cover
}

.poster-footer {
    background:#0b0805;
    border-color:#4b3516
}

.poster-footer-links a {
    color:#d7ad5f
}

.poster-footer p {
    color:#806947
}

.inner-poster .page-hero {
    background:linear-gradient(90deg,#120e09e8,#120e0960),url('../img/site/noir-header-game-palette.png') center 45%/cover;
    border-color:#4b3516
}

.inner-poster .breadcrumbs {
    color:#bdb2a2
}

.inner-poster .breadcrumbs a {
    color:#f0bc55
}

.inner-poster .page-hero h1 {
    color:#f5ead7
}

.inner-poster .page-hero p:last-child {
    color:#d7c3a2
}

.inner-poster .page-content {
    background:linear-gradient(180deg,#1b130b,#120e09)
}

.inner-poster .reading-column p {
    color:#d8d0bf
}

.inner-poster .reading-column h2 {
    color:#f0bc55
}

.inner-poster .wide-cover,.inner-poster .gallery-page figure {
    background:#1b130b;
    border-color:#4b3516
}

.inner-poster .version-entry,.inner-poster .event-empty,.inner-poster .notice-panel {
    background:#1b130b;
    border-color:#4b3516
}

.inner-poster .version-entry button {
    color:#f5ead7
}

.inner-poster .version-entry button span,.inner-poster .event-empty h2,.inner-poster .notice-panel h2,.inner-poster .staff-table th {
    color:#f0bc55
}

.inner-poster .version-details,.inner-poster .event-empty p {
    color:#d7c3a2
}

.inner-poster .staff-table th,.inner-poster .staff-table td {
    border-color:#4b3516
}

.auth-page,.auth-panel {
    background:#120e09
}

.auth-visual {
    background:linear-gradient(#120e0940,#120e09b8),url('../img/site/noir-header-game-palette.png') center/cover
}

.auth-box h1 {
    color:#f5ead7
}

.auth-box>p,.auth-links {
    color:#d7c3a2
}

.field input {
    background:#1b130b;
    border-color:#4b3516
}

.field label {
    color:#f5ead7
}

.auth-submit {
    background:#f0bc55;
    border-color:#d7ad5f
}

@media(max-width:980px) {
    .poster-menu-button {
        color:#f5ead7;
        border-color:#4b3516
    }

    .poster-header nav {
        background:#120e09fa;
        border-color:#4b3516
    }

}

@media(max-width:640px) {
    .poster-logo-lockup {
        background:#120e09a8
    }

}

/* Wordmark only: decorative NG badges intentionally removed */ .poster-logo-lockup {
    padding-block:38px
}

.poster-story-cta .poster-narrow {
    padding-block:12px
}

.poster-footer-links,.compact-footer .poster-footer-links {
    margin-bottom:24px
}

.auth-visual .brand {
    gap:0
}

.auth-visual .brand>span:last-child {
    font-size:18px
}

@media(max-width:640px) {
    .poster-logo-lockup {
        padding-block:30px
    }

}

/* One shared horizontal grid for navigation, headers and page content */ :root {
    --layout-max:1440px;
    --layout-gutter:32px;
    --layout-side:max(var(--layout-gutter),calc((100vw - var(--layout-max))/2))
}

.poster-header {
    padding-left:var(--layout-side);
    padding-right:var(--layout-side)
}

.poster-wide,.poster-narrow {
    width:min(var(--layout-max),calc(100% - (var(--layout-gutter) * 2)))
}

.poster-narrow {
    max-width:var(--layout-max)
}

.inner-poster .page-hero {
    padding-left:var(--layout-side);
    padding-right:var(--layout-side)
}

.inner-poster .page-hero .shell {
    width:100%;
    max-width:var(--layout-max);
    margin-left:auto;
    margin-right:auto
}

.inner-poster .page-content {
    padding-left:var(--layout-side);
    padding-right:var(--layout-side)
}

.inner-poster .page-content>*,.inner-poster .reading-column,.inner-poster .version-list,.inner-poster .gallery-page,.inner-poster .event-empty {
    width:100%;
    max-width:var(--layout-max);
    margin-left:auto;
    margin-right:auto
}

.inner-poster .reading-column p,.inner-poster .reading-column h2,.inner-poster .notice-panel,.inner-poster .staff-table {
    max-width:1080px
}

.inner-poster .wide-cover {
    width:100%;
    max-width:none
}

.compact-footer {
    padding-left:var(--layout-side);
    padding-right:var(--layout-side)
}

@media(max-width:1504px) {
    :root {
        --layout-gutter:32px;
        --layout-side:var(--layout-gutter)
    }

}

@media(max-width:640px) {
    :root {
        --layout-gutter:16px;
        --layout-side:16px
    }

    .poster-header,.inner-poster .page-hero,.inner-poster .page-content,.compact-footer {
        padding-left:var(--layout-side);
        padding-right:var(--layout-side)
    }

    .poster-wide,.poster-narrow {
        width:100%
    }

}

/* Unified authentication controls */ .auth-box {
    width:min(100%,620px)
}

.field {
    margin:24px 0
}

.field label {
    margin-bottom:10px;
    color:#f5ead7;
    font-size:16px;
    font-weight:700
}

.field input {
    height:58px;
    padding:0 18px;
    color:#f5ead7;
    background:#1b130b;
    border:1px solid #4b3516;
    border-radius:0;
    font-size:17px;
    box-shadow:inset 0 1px 0 #ffffff08;
    transition:border-color .18s,background .18s,box-shadow .18s
}

.field input:hover {
    border-color:#715226;
    background:#21170d
}

.field input:focus {
    outline:0;
    border-color:#f0bc55;
    background:#21170d;
    box-shadow:0 0 0 3px #f0bc5524
}

.auth-submit {
    width:100%;
    min-height:58px;
    padding:0 20px;
    color:#f5ead7;
    background:#2e2214;
    border:1px solid #d7ad5f;
    clip-path:none;
    box-shadow:none;
    font-size:13px;
    letter-spacing:1.8px;
    transition:color .18s,background .18s,border-color .18s,transform .18s
}

.auth-submit:hover,.auth-submit:focus-visible {
    color:#120e09;
    background:#f0bc55;
    border-color:#f0bc55;
    transform:none
}

.check-row {
    align-items:center;
    gap:12px;
    margin:22px 0;
    color:#d7c3a2;
    font-size:15px
}

.check-row input {
    width:18px;
    height:18px;
    margin:0;
    accent-color:#f0bc55
}

.auth-links {
    margin-top:30px
}

.auth-links p {
    margin:14px 0
}

.auth-links a {
    color:#d7ad5f;
    text-decoration-color:transparent;
    text-underline-offset:4px;
    transition:color .18s,text-decoration-color .18s
}

.auth-links a:hover {
    color:#f5ead7;
    text-decoration-color:#d7ad5f
}

@media(max-width:640px) {
    .field input,.auth-submit {
        height:54px;
        min-height:54px
    }

    .auth-box {
        max-width:none
    }

    .auth-links {
        margin-top:25px
    }

}

/* Dossier direction â€” asymmetric city archive */ .dossier-site {
    background:#120e09
}

.case-hero {
    position:relative;
    min-height:860px;
    overflow:hidden;
    background:#0b0805
}

.case-hero-image {
    position:absolute;
    inset:0;
    background:url('../img/site/noir-header-game-palette.png') center/cover
}

.case-hero-image:after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,#0b0805d9 0%,#0b08054d 50%,#0b080583 100%),linear-gradient(0deg,#120e09 0%,transparent 38%)
}

.case-hero-grid {
    position:relative;
    z-index:1;
    width:min(1440px,calc(100% - 64px));
    min-height:820px;
    margin:auto;
    padding-top:150px;
    display:grid;
    grid-template-columns:120px minmax(0,1fr) 260px;
    gap:48px;
    align-items:center
}

.case-index {
    height:470px;
    display:flex;
    align-items:center;
    flex-direction:column;
    color:#9e7b48;
    border-right:1px solid #725224
}

.case-index span {
    font:700 12px Mont;
    letter-spacing:3px
}

.case-index b {
    margin-top:12px;
    color:#f0bc55;
    font:700 26px Mont
}

.case-index i {
    width:1px;
    flex:1;
    margin:20px 0;
    background:#725224
}

.case-index small {
    writing-mode:vertical-rl;
    transform:rotate(180deg);
    font:700 10px Mont;
    text-transform:uppercase;
    letter-spacing:2px
}

.case-title {
    max-width:850px
}

.case-title>p,.case-label {
    margin:0 0 22px;
    color:#d7ad5f;
    font:700 11px Mont;
    text-transform:uppercase;
    letter-spacing:2.4px
}

.case-title h1 {
    margin:0;
    color:#f5ead7;
    font:700 clamp(56px,6.5vw,100px)/.9 Mont;
    text-transform:uppercase;
    letter-spacing:-5px
}

.case-title h1 em {
    color:#f0bc55;
    font-style:normal
}

.case-title-actions {
    display:flex;
    gap:12px;
    margin-top:42px
}

.case-title-actions a,.case-end a {
    min-width:210px;
    padding:15px 22px;
    color:#f5ead7;
    background:#1b130b;
    border:1px solid #4b3516;
    font:700 12px Mont;
    text-transform:uppercase;
    letter-spacing:1px;
    text-align:center
}

.case-title-actions a:first-child,.case-end a {
    color:#120e09;
    background:#f0bc55;
    border-color:#f0bc55
}

.case-stamp {
    align-self:end;
    margin-bottom:150px;
    padding:24px 12px;
    border-block:1px solid #725224
}

.case-stamp span,.case-stamp b,.case-stamp small {
    display:block
}

.case-stamp span {
    color:#f0bc55;
    font:700 10px Mont;
    text-transform:uppercase;
    letter-spacing:2px
}

.case-stamp b {
    margin:6px 0;
    color:#f5ead7;
    font:700 15px Mont;
    text-transform:uppercase
}

.case-stamp small {
    color:#9f927e;
    font-size:12px
}

.case-hero-foot {
    position:absolute;
    z-index:2;
    bottom:38px;
    left:50%;
    width:min(1100px,calc(100% - 48px));
    transform:translateX(-50%);
    display:flex;
    align-items:center;
    color:#968467;
    font:700 10px Mont;
    text-transform:uppercase;
    letter-spacing:2px
}

.case-hero-foot i {
    height:1px;
    flex:1;
    margin:0 20px;
    background:#5e4420
}

.case-layout {
    width:min(1440px,calc(100% - 64px));
    margin:auto;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:48px
}

.case-section-no {
    padding-top:7px;
    border-right:1px solid #4b3516
}

.case-section-no span,.case-section-no b {
    display:block
}

.case-section-no span {
    color:#8d795e;
    font:700 9px Mont;
    text-transform:uppercase;
    letter-spacing:2px
}

.case-section-no b {
    margin-top:8px;
    color:#f0bc55;
    font:700 26px Mont
}

.case-intro {
    padding:120px 0;
    background:radial-gradient(circle at 66% 30%,#2b1e0f 0,transparent 30%),#120e09
}

.case-intro .case-layout {
    grid-template-columns:120px minmax(0,1.2fr) minmax(300px,.65fr)
}

.case-intro-copy {
    max-width:780px
}

.case-intro-copy h2,.case-heading-row h2,.case-network-title h2,.case-end h2 {
    margin:0;
    color:#f5ead7;
    font:700 clamp(38px,4.5vw,64px)/1 Mont;
    text-transform:uppercase;
    letter-spacing:-2px
}

.case-intro-copy>p:last-child {
    max-width:680px;
    color:#c9bca7;
    font-size:17px
}

.case-access {
    padding:27px;
    background:#1b130b;
    border-top:3px solid #f0bc55;
    box-shadow:18px 18px 0 #0b0805
}

.case-access>span {
    display:block;
    margin-bottom:20px;
    color:#9e8c72;
    font:700 10px Mont;
    text-transform:uppercase;
    letter-spacing:2px
}

.case-access>a {
    display:flex;
    justify-content:space-between;
    padding:14px 0;
    color:#f5ead7;
    border-bottom:1px solid #4b3516;
    font:700 12px Mont;
    text-transform:uppercase
}

.case-access>a.primary {
    color:#f0bc55
}

.case-access small {
    display:block;
    margin-top:22px;
    color:#998b76;
    font-size:12px
}

.case-city,.case-visuals {
    padding:120px 0;
    background:#1b130b
}

.case-heading-row {
    grid-template-columns:120px 1fr auto;
    align-items:end;
    margin-bottom:55px
}

.case-text-link {
    color:#d7ad5f;
    font:700 11px Mont;
    text-transform:uppercase;
    letter-spacing:1px;
    border-bottom:1px solid #725224;
    padding-bottom:6px
}

.case-feature-rail {
    width:min(1600px,calc(100% - 64px));
    margin-left:auto;
    display:grid;
    grid-template-columns:1.35fr 1fr 1fr;
    gap:18px
}

.case-feature {
    position:relative;
    min-height:590px;
    overflow:hidden;
    background:#120e09
}

.case-feature img {
    position:absolute;
    height:100%;
    filter:saturate(.75);
    transition:.6s
}

.case-feature:hover img {
    transform:scale(1.035)
}

.case-feature:after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,#120e09 5%,#120e09d8 34%,transparent 68%)
}

.case-feature>div {
    position:absolute;
    z-index:1;
    left:30px;
    right:30px;
    bottom:30px
}

.case-feature span {
    color:#f0bc55;
    font:700 9px Mont;
    text-transform:uppercase;
    letter-spacing:2px
}

.case-feature h3 {
    margin:8px 0;
    color:#f5ead7;
    font:700 23px Mont;
    text-transform:uppercase
}

.case-feature p {
    max-width:440px;
    margin:0;
    color:#c4b69f;
    font-size:14px
}

.case-network {
    padding:130px 0;
    background:#120e09
}

.case-network .case-layout {
    grid-template-columns:120px minmax(280px,.8fr) minmax(0,1.2fr);
    align-items:start
}

.case-network-list {
    border-top:1px solid #4b3516
}

.case-network-list a {
    display:grid;
    grid-template-columns:48px 1fr 30px;
    gap:16px;
    align-items:center;
    padding:22px 0;
    border-bottom:1px solid #4b3516
}

.case-network-list>a>b {
    color:#f0bc55;
    font:700 12px Mont
}

.case-network-list span strong,.case-network-list span small {
    display:block
}

.case-network-list strong {
    color:#f5ead7;
    font:700 15px Mont;
    text-transform:uppercase
}

.case-network-list small {
    margin-top:5px;
    color:#9f927e;
    font-size:13px
}

.case-network-list i {
    color:#d7ad5f;
    font-style:normal
}

.case-mosaic {
    width:min(1440px,calc(100% - 64px));
    margin:auto;
    display:grid;
    grid-template-columns:1.2fr .8fr;
    grid-template-rows:330px 330px;
    gap:18px
}

.case-mosaic a {
    overflow:hidden
}

.case-mosaic .wide {
    grid-row:1/3
}

.case-mosaic img {
    height:100%;
    transition:.5s
}

.case-mosaic a:hover img {
    transform:scale(1.03)
}

.case-end {
    min-height:520px;
    display:grid;
    place-items:center;
    padding:80px 24px;
    text-align:center;
    background:linear-gradient(#120e09bc,#120e09f0),url('../img/site/noir-header-game-palette.png') center/cover
}

.case-end>div {
    max-width:850px
}

.case-end>div>span {
    color:#f0bc55;
    font:700 11px Mont;
    text-transform:uppercase;
    letter-spacing:2px
}

.case-end p {
    color:#c5b79f;
    font-size:17px
}

.case-end a {
    display:inline-flex;
    justify-content:space-between;
    gap:35px;
    margin-top:18px
}

.case-footer {
    padding:40px max(32px,calc((100vw - 1440px)/2));
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    background:#0b0805;
    border-top:1px solid #4b3516
}

.case-footer>div {
    display:flex;
    gap:24px
}

.case-footer>div a {
    color:#9f927e;
    font:700 10px Mont;
    text-transform:uppercase
}

.case-footer p {
    justify-self:end;
    color:#6f604d;
    font-size:11px;
    text-transform:uppercase
}

@media(max-width:1050px) {
    .case-hero-grid {
        grid-template-columns:80px 1fr
    }

    .case-stamp {
        display:none
    }

    .case-intro .case-layout,.case-network .case-layout {
        grid-template-columns:80px 1fr
    }

    .case-access,.case-network-list {
        grid-column:2
    }

    .case-feature-rail {
        width:calc(100% - 48px);
        margin:auto;
        grid-template-columns:1fr 1fr
    }

    .case-feature.large {
        grid-column:1/3
    }

    .case-feature {
        min-height:500px
    }

    .case-heading-row {
        grid-template-columns:80px 1fr
    }

    .case-heading-row .case-text-link {
        grid-column:2;
        margin-top:20px;
        justify-self:start
    }

    .case-footer {
        grid-template-columns:1fr auto
    }

    .case-footer>div {
        display:none
    }

}

@media(max-width:680px) {
    .case-hero {
        min-height:720px
    }

    .case-hero-grid {
        width:calc(100% - 32px);
        min-height:680px;
        padding-top:130px;
        display:block
    }

    .case-index {
        display:none
    }

    .case-title h1 {
        font-size:47px;
        letter-spacing:-3px
    }

    .case-title-actions {
        align-items:stretch;
        flex-direction:column
    }

    .case-title-actions a {
        width:100%
    }

    .case-hero-foot {
        display:none
    }

    .case-layout,.case-intro .case-layout,.case-network .case-layout {
        width:calc(100% - 32px);
        display:block
    }

    .case-section-no {
        display:flex;
        align-items:center;
        gap:10px;
        margin-bottom:30px;
        padding:0 0 12px;
        border-right:0;
        border-bottom:1px solid #4b3516
    }

    .case-section-no b {
        margin:0
    }

    .case-intro,.case-city,.case-network,.case-visuals {
        padding:74px 0
    }

    .case-intro-copy h2,.case-heading-row h2,.case-network-title h2,.case-end h2 {
        font-size:35px
    }

    .case-access {
        margin-top:40px;
        box-shadow:10px 10px 0 #0b0805
    }

    .case-heading-row {
        margin-bottom:34px
    }

    .case-heading-row .case-text-link {
        display:inline-block;
        margin-top:18px
    }

    .case-feature-rail {
        width:calc(100% - 32px);
        display:flex;
        overflow:auto;
        scroll-snap-type:x mandatory
    }

    .case-feature,.case-feature.large {
        flex:0 0 88%;
        min-height:470px;
        scroll-snap-align:start
    }

    .case-feature>div {
        left:22px;
        right:22px;
        bottom:22px
    }

    .case-network-list {
        margin-top:38px
    }

    .case-mosaic {
        width:calc(100% - 32px);
        display:flex;
        overflow:auto;
        scroll-snap-type:x mandatory
    }

    .case-mosaic a,.case-mosaic .wide {
        flex:0 0 88%;
        height:380px;
        scroll-snap-align:start
    }

    .case-footer {
        padding:35px 16px;
        display:block;
        text-align:center
    }

    .case-footer p {
        margin-top:14px
    }

    .case-footer .poster-wordmark {
        justify-content:center
    }

}

/* Living game header: embers, smoke, glow and restrained parallax */ .case-hero {
    --hero-x:0px;
    --hero-y:0px;
    background:#0b0805
}

.case-hero-image {
    inset:-14px;
    transform:translate3d(var(--hero-x),var(--hero-y),0) scale(1.025);
    transition:transform .9s cubic-bezier(.2,.8,.2,1);
    will-change:transform
}

.case-hero-smoke {
    position:absolute;
    z-index:1;
    inset:-20% -10% 0;
    pointer-events:none;
    opacity:.3;
    mix-blend-mode:screen;
    background:radial-gradient(ellipse at 18% 82%,#6a341b55 0,transparent 28%),radial-gradient(ellipse at 76% 72%,#5e2a1550 0,transparent 25%),radial-gradient(ellipse at 48% 35%,#a77a4b25 0,transparent 34%);
    filter:blur(35px);
    animation:smoke-drift 18s ease-in-out infinite alternate
}

.case-hero-glow {
    position:absolute;
    z-index:2;
    inset:0;
    pointer-events:none;
    background:radial-gradient(circle at 72% 67%,#f0a43b2e 0,transparent 18%),radial-gradient(circle at 30% 78%,#c8561d1b 0,transparent 23%);
    mix-blend-mode:screen;
    animation:city-breathe 5.5s ease-in-out infinite
}

.ember-canvas {
    position:absolute;
    z-index:4;
    inset:0;
    width:100%;
    height:100%;
    pointer-events:none;
    filter:drop-shadow(0 0 2px #e36b22) drop-shadow(0 0 5px #8f2e0f66)
}

.case-hero-grid {
    z-index:5
}

.case-hero-foot {
    z-index:6
}

.case-title {
    position:relative
}

.case-title:before {
    content:"";
    position:absolute;
    left:-28px;
    top:-24px;
    width:1px;
    height:118px;
    background:linear-gradient(#f0bc55,transparent);
    box-shadow:0 0 14px #f0a13d66
}

.case-title h1 {
    text-shadow:0 5px 30px #000,0 0 55px #35180a
}

.case-title h1 em {
    text-shadow:0 0 24px #d978243d
}

.case-title-actions a:first-child {
    box-shadow:0 0 0 1px #f9d47f22 inset,0 0 32px #c35c1721;
    animation:cta-heat 4s ease-in-out infinite
}

.case-stamp {
    background:linear-gradient(90deg,transparent,#120e096b,transparent)
}

@keyframes smoke-drift {
    0% {
        transform:translate3d(-2%,1%,0) scale(1)
    }

    50% {
        opacity:.4
    }

    100% {
        transform:translate3d(3%,-2%,0) scale(1.08)
    }

}

@keyframes city-breathe {
    0%,100% {
        opacity:.55
    }

    50% {
        opacity:1
    }

}

@keyframes cta-heat {
    0%,100% {
        box-shadow:0 0 0 1px #f9d47f22 inset,0 0 24px #c35c1715
    }

    50% {
        box-shadow:0 0 0 1px #fff1bd38 inset,0 0 38px #d46f2438
    }

}

@media(max-width:680px) {
    .case-hero-image {
        inset:-8px;
        background-position:37% center;
        transform:translate3d(0,0,0) scale(1.02)
    }

    .case-hero-smoke {
        opacity:.2;
        filter:blur(28px)
    }

    .case-title:before {
        left:-12px;
        top:-16px;
        height:84px
    }

    .ember-canvas {
        opacity:.78
    }

}

@media(prefers-reduced-motion:reduce) {
    .case-hero-image {
        transform:scale(1.02);
        transition:none
    }

    .case-hero-smoke,.case-hero-glow,.case-title-actions a:first-child {
        animation:none
    }

    .ember-canvas {
        display:none
    }

}

/* Desktop full-page scene scrolling */ @media(min-width:901px) and (min-height:700px) {
    .dossier-site {
        height:100vh;
        overflow-y:auto;
        overflow-x:hidden;
        scroll-snap-type:y mandatory;
        scroll-behavior:smooth;
        overscroll-behavior-y:contain
    }

    .dossier-site .poster-header {
        position:fixed
    }

    .dossier-site main>section {
        scroll-snap-align:start;
        scroll-snap-stop:always
    }

    .case-hero {
        height:100svh;
        min-height:700px
    }

    .case-hero-grid {
        min-height:calc(100svh - 40px);
        padding-top:clamp(100px,13vh,150px)
    }

    .case-intro,.case-city,.case-network,.case-visuals,.case-end {
        min-height:100svh
    }

    .case-intro,.case-network,.case-end {
        display:flex;
        align-items:center
    }

    .case-city,.case-visuals {
        display:flex;
        justify-content:center;
        flex-direction:column;
        padding-top:clamp(70px,8vh,110px);
        padding-bottom:clamp(70px,8vh,110px)
    }

    .case-intro,.case-network {
        padding-top:clamp(75px,9vh,120px);
        padding-bottom:clamp(75px,9vh,120px)
    }

    .case-heading-row {
        margin-bottom:clamp(28px,4vh,55px)
    }

    .case-feature {
        min-height:0;
        height:clamp(390px,52vh,570px)
    }

    .case-mosaic {
        grid-template-rows:clamp(210px,30vh,320px) clamp(210px,30vh,320px)
    }

    .case-footer {
        scroll-snap-align:end
    }

    .case-network .case-layout {
        max-height:78vh
    }

}

@media(max-width:900px), (max-height:699px) {
    .dossier-site {
        height:auto;
        overflow:visible;
        scroll-snap-type:none
    }

    .dossier-site main>section {
        scroll-snap-align:none;
        scroll-snap-stop:normal
    }

}

@media(prefers-reduced-motion:reduce) {
    .dossier-site {
        scroll-behavior:auto;
        scroll-snap-type:none!important
    }

}

/* Subtle city parallax */ .case-hero {
    --city-x:0px;
    --city-y:0px
}

.case-hero-image {
    background-image:url('../img/site/noir-city-background.png');
    transform:translate3d(var(--city-x),var(--city-y),0) scale(1.025)
}

@media(max-width:680px) {
    .case-hero-image {
        transform:scale(1.025)
    }

}

#rain-layer {
    position:absolute;
    z-index:4;
    inset:0;
    overflow:hidden;
    pointer-events:none;
    opacity:.92;
    mix-blend-mode:screen;
    background:transparent
}

#rain-layer:after {
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(90deg,#0b08054f 0%,transparent 52%,#0b08052e 100%),linear-gradient(0deg,#120e0957 0%,transparent 38%)
}

#rain-layer #bg-canvas {
    display:block;
    width:100%;
    height:100%;
    background:transparent;
    pointer-events:none
}

@media(max-width:680px) {
    #rain-layer {
        opacity:.58
    }

}

@media(prefers-reduced-motion:reduce) {
    #rain-layer {
        display:none
    }

}

/* Hero typography: levegĹ‘sebb, a noir plakĂˇtkarakter megtartĂˇsĂˇval */ .case-title {
    max-width:940px
}

.case-title>p {
    margin-bottom:30px;
    letter-spacing:3px
}

.case-title h1 {
    font-size:clamp(54px,6vw,92px);
    line-height:1.04;
    letter-spacing:-2.5px;
    text-wrap:balance;
}

.case-title h1 em {
    display:inline-block
}

.case-title-actions {
    margin-top:50px;
    gap:16px
}

@media(max-width:1050px) {
    .case-title h1 {
        font-size:clamp(52px,8vw,82px);
        line-height:1.06;
        letter-spacing:-2px
    }

}

@media(max-width:680px) {
    .case-title>p {
        margin-bottom:23px;
        line-height:1.6;
        letter-spacing:2.2px
    }

    .case-title h1 {
        font-size:clamp(39px,12vw,52px);
        line-height:1.08;
        letter-spacing:-1.2px
    }

    .case-title-actions {
        margin-top:38px;
        gap:12px
    }

}

/* Persistent city news wire and page scrollbar */
html,
body,
.dossier-fullpage,
.dossier-site {
    scrollbar-width:thin;
    scrollbar-color:#f0bc55 #1b130b
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
.dossier-fullpage::-webkit-scrollbar,
.dossier-site::-webkit-scrollbar {
    width:7px;
    height:7px
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
.dossier-fullpage::-webkit-scrollbar-track,
.dossier-site::-webkit-scrollbar-track {
    background:#1b130b;
    border-left:1px solid #4b3516
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
.dossier-fullpage::-webkit-scrollbar-thumb,
.dossier-site::-webkit-scrollbar-thumb {
    background:#f0bc55;
    border:1px solid #d7ad5f
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
.dossier-fullpage::-webkit-scrollbar-thumb:hover,
.dossier-site::-webkit-scrollbar-thumb:hover {
    background:#ffd16f
}

.inner-poster .reading-column p,.inner-poster .reading-column h2 {
    max-width:1320px
}

.inner-poster .reading-column>.button {
    min-width:260px;
    min-height:56px;
    justify-content:space-between;
    gap:24px;
    margin-top:26px;
    padding:0 0 0 25px;
    color:#f5ead7;
    background:#1b130b;
    border:1px solid #725224;
    clip-path:none;
    box-shadow:none;
}

.inner-poster .reading-column>.button span {
    align-self:stretch;
    width:54px;
    display:grid;
    place-items:center;
    color:#120e09;
    background:#f0bc55;
    font-size:16px
}

.inner-poster .reading-column>.button:hover {
    color:#fff;
    background:#2e2214;
    border-color:#f0bc55;
    transform:translateY(-2px)
}

.case-access {
    box-shadow:none
}

.dossier-site .poster-header {
    position:fixed
}

@media(max-width:980px) {
    .dossier-site .poster-header nav {
        position:fixed;
        top:98px
    }

}

.city-wire {
    position:fixed;
    z-index:29;
    top:58px;
    left:0;
    right:0;
    height:40px;
    display:grid;
    grid-template-columns:max-content minmax(0,1fr);
    overflow:hidden;
    color:#d7c3a2;
    background:#0b0805e8;
    border-bottom:1px solid #4b3516;
    box-shadow:0 10px 28px #0007;
    backdrop-filter:blur(8px);
}

.city-wire-label {
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    gap:10px;
    padding:0 24px 0 var(--layout-side);
    color:#120e09;
    background:#f0bc55;
    clip-path:polygon(0 0,calc(100% - 16px) 0,100% 50%,calc(100% - 16px) 100%,0 100%);
    font:700 10px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1.5px;
    white-space:nowrap;
}

.city-wire-label i {
    width:7px;
    height:7px;
    border-radius:50%;
    background:#6d260e;
    box-shadow:0 0 0 4px #6d260e20;
    animation:wire-pulse 1.8s ease-in-out infinite
}

.city-wire-window {
    overflow:hidden;
    mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)
}

.city-wire-track {
    width:100%;
    min-width:0;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center
}

.city-wire-group {
    min-width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto
}

.city-wire.is-marquee .city-wire-track {
    width:max-content;
    justify-content:flex-start;
    animation:city-wire-marquee var(--city-wire-duration,30s) linear infinite;
    will-change:transform
}

.city-wire.is-marquee .city-wire-group {
    min-width:0
}

@media(hover:hover) and (pointer:fine) {
    .city-wire.is-marquee:hover .city-wire-track,.city-wire.is-marquee:focus-within .city-wire-track {
        animation-play-state:paused
    }
}

.city-wire-track a {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    height:100%;
    display:flex;
    align-items:center;
    gap:18px;
    padding:0 38px;
    border-right:1px solid #4b3516;
    color:#bcae98;
    white-space:nowrap;
    font-size:12px
}

.city-wire-event {
    --event-rgb:231,185,71;
    --event-color:#e7b947;
    --event-bright:#fff1bf;
    background:linear-gradient(105deg,rgba(var(--event-rgb),.17),rgba(var(--event-rgb),.025) 48%,rgba(var(--event-rgb),.12));
    box-shadow:inset 0 0 20px rgba(var(--event-rgb),.08)
}

.city-wire-event--red {
    --event-rgb:211,67,61;
    --event-color:#e45d55;
    --event-bright:#ffe0dc
}

.city-wire-event--purple {
    --event-rgb:145,91,224;
    --event-color:#a875ef;
    --event-bright:#eadcff
}

.city-wire-event:after {
    content:"";
    position:absolute;
    z-index:-1;
    inset:0;
    pointer-events:none;
    background:linear-gradient(105deg,transparent 30%,rgba(var(--event-rgb),.12) 43%,rgba(255,255,255,.2) 50%,rgba(var(--event-rgb),.12) 57%,transparent 70%);
    transform:translateX(-130%);
    animation:city-event-sweep 4.8s ease-in-out infinite
}

.city-wire-track .city-wire-event b {color:var(--event-color)}
.city-wire-track .city-wire-event span {color:var(--event-bright)}
.city-wire-track .city-wire-event strong {color:var(--event-bright);text-shadow:0 0 12px rgba(var(--event-rgb),.4)}

.dossier-site.has-active-event {
    --event-rgb:231,185,71;
    --event-color:#e7b947
}

.dossier-site.event-theme-red {--event-rgb:211,67,61;--event-color:#e45d55}
.dossier-site.event-theme-purple {--event-rgb:145,91,224;--event-color:#a875ef}

.dossier-site.has-active-event .case-hero-glow {
    background:radial-gradient(circle at 72% 67%,rgba(var(--event-rgb),.28) 0,transparent 21%),radial-gradient(circle at 28% 75%,rgba(var(--event-rgb),.18) 0,transparent 28%);
    animation:active-event-breathe 4.5s ease-in-out infinite
}

.dossier-site.has-active-event .case-hero-smoke {
    background:radial-gradient(ellipse at 18% 82%,rgba(var(--event-rgb),.3) 0,transparent 30%),radial-gradient(ellipse at 76% 72%,rgba(var(--event-rgb),.26) 0,transparent 27%),radial-gradient(ellipse at 48% 35%,rgba(var(--event-rgb),.14) 0,transparent 36%)
}

.dossier-site.has-active-event .ember-canvas {
    filter:drop-shadow(0 0 2px var(--event-color)) drop-shadow(0 0 6px rgba(var(--event-rgb),.55))
}

@keyframes city-event-sweep {
    0%,25% {transform:translateX(-130%)}
    60%,100% {transform:translateX(130%)}
}

@keyframes city-wire-marquee {
    from {transform:translate3d(0,0,0)}
    to {transform:translate3d(-50%,0,0)}
}

@keyframes active-event-breathe {
    0%,100% {opacity:.62;filter:saturate(.9)}
    50% {opacity:1;filter:saturate(1.35)}
}

.city-wire-track b {
    color:#f0bc55;
    font:700 10px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1.5px
}

.city-wire-track strong {
    color:#f5ead7;
    font:700 9px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1px
}

.site-maintenance-strip {
    position:fixed;
    z-index:28;
    top:98px;
    left:0;
    right:0;
    min-height:48px;
    display:flex;
    align-items:center;
    gap:12px;
    padding:11px var(--layout-side);
    color:#ffe8e8;
    background:rgba(90,18,18,.9);
    border-top:1px solid rgba(217,92,92,.45);
    border-bottom:1px solid rgba(217,92,92,.45);
    border-left:4px solid #e05c5c;
    border-radius:0;
    box-shadow:0 12px 28px #0008;
    backdrop-filter:blur(8px)
}

.site-maintenance-strip i {
    color:#ff7777
}

.site-maintenance-strip strong {
    flex:0 0 auto;
    font:800 13px Mont,sans-serif
}

.site-maintenance-strip span {
    color:#dcbcbc;
    font-size:12px
}

@keyframes wire-pulse {
    50% {
        opacity:.45;
        transform:scale(.75)
    }

}

@media(max-width:680px) {
    .city-wire {
        grid-template-columns:42px 1fr
    }

    .city-wire-label {
        justify-content:center;
        padding:0;
        clip-path:polygon(0 0,30px 0,100% 50%,30px 100%,0 100%)
    }

    .city-wire-label span {
        display:none
    }

    .city-wire-track a {
        gap:12px;
        padding:0 22px;
        font-size:11px
    }

    .city-wire-track strong {
        display:none
    }

    .site-maintenance-strip {
        min-height:54px;
        align-items:flex-start;
        gap:9px;
        padding:9px 16px;
        flex-wrap:wrap
    }

    .site-maintenance-strip span {
        width:100%;
        padding-left:22px;
        font-size:11px
    }

}

@media(prefers-reduced-motion:reduce) {
    .city-wire-track,.city-wire.is-marquee .city-wire-track {
        width:100%;
        animation:none;
        transform:none;
        will-change:auto
    }

    .city-wire-label i {
        animation:none
    }

    .city-wire-event:after,.dossier-site.has-active-event .case-hero-glow {
        animation:none
    }

    .city-wire-window {
        overflow-x:auto;
        mask-image:none
    }

}

/* Desktop horizontal game-system rail */ @media(min-width:681px) {
    .case-feature-rail {
        width:min(1600px,calc(100% - var(--layout-side)));
        margin-left:var(--layout-side);
        margin-right:0;
        padding:0 0 15px;
        grid-template-columns:minmax(700px,1.35fr) repeat(2,minmax(520px,1fr));
        overflow-x:auto;
        overflow-y:hidden;
        overscroll-behavior-x:contain;
        scrollbar-width:thin;
        scrollbar-color:#f0bc55 #2e2214;
    }

    .case-feature-rail::-webkit-scrollbar {
        height:5px
    }

    .case-feature-rail::-webkit-scrollbar-track {
        background:#2e2214
    }

    .case-feature-rail::-webkit-scrollbar-thumb {
        background:#f0bc55
    }

}

.case-end {
    justify-content:center;
    align-items:center;
}

.case-end>div {
    width:min(900px,calc(100% - 64px));
    margin-inline:auto;
    padding:54px 64px;
    background:linear-gradient(90deg,transparent,#120e0994 16%,#120e0994 84%,transparent);
}

.case-end h2 {
    line-height:1.08;
    letter-spacing:-1.5px
}

.case-end p {
    max-width:650px;
    margin:22px auto 0;
    line-height:1.8
}

.case-intro {
    position:relative;
    isolation:isolate;
    overflow:hidden
}

.case-intro:before {
    content:"";
    position:absolute;
    z-index:-1;
    top:0;
    right:0;
    bottom:0;
    width:48%;
    opacity:.13;
    background:linear-gradient(90deg,#120e09,transparent 35%),url('../img/gallery/karakter.png') center/cover;
    filter:sepia(.35) saturate(.65);
    mask-image:linear-gradient(90deg,transparent 0,#000 32%,#000 100%);
}

.case-intro .case-layout {
    row-gap:58px
}

.case-intro-flow {
    grid-column:2/4;
    border-top:1px solid #4b3516;
    padding-top:25px
}

.case-flow-label {
    margin:0 0 18px;
    color:#9e8c72;
    font:700 10px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:2px
}

.case-intro-flow ol {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    margin:0;
    padding:0;
    list-style:none;
    border:1px solid #4b3516;
    background:#120e09b8
}

.case-intro-flow li {
    min-height:105px;
    display:grid;
    grid-template-columns:48px 1fr;
    gap:17px;
    align-items:center;
    padding:20px 25px;
    border-right:1px solid #4b3516
}

.case-intro-flow li:last-child {
    border-right:0
}

.case-intro-flow li>b {
    color:#f0bc55;
    font:700 13px Mont,sans-serif
}

.case-intro-flow li span,.case-intro-flow strong,.case-intro-flow small {
    display:block
}

.case-intro-flow strong {
    color:#f5ead7;
    font:700 13px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:.4px
}

.case-intro-flow small {
    margin-top:7px;
    color:#a99a83;
    font-size:12px;
    line-height:1.45
}

@media(max-width:680px) {
    .case-end>div {
        width:100%;
        padding:38px 0;
        background:none
    }

    .case-end p {
        margin-top:18px
    }

    .case-intro:before {
        display:none
    }

    .case-intro-flow {
        margin-top:42px;
        padding-top:22px
    }

    .case-intro-flow ol {
        grid-template-columns:1fr
    }

    .case-intro-flow li {
        min-height:0;
        border-right:0;
        border-bottom:1px solid #4b3516
    }

    .case-intro-flow li:last-child {
        border-bottom:0
    }

}

/* Window is the full-page scroll container (works for file:// and hosted pages) */ @media(min-width:901px) and (min-height:700px) {
    html.dossier-fullpage {
        height:auto;
        overflow-y:auto;
        scroll-snap-type:y mandatory;
        scroll-behavior:smooth
    }

    .dossier-fullpage body.dossier-site {
        height:auto;
        overflow:visible;
        scroll-snap-type:none;
        overscroll-behavior-y:auto
    }

}

/* Production SITE shell and migrated dynamic components */ html {
    background:#120e09
}

body.poster-site {
    min-height:100vh
}

.poster-header {
    position:fixed
}

.poster-status {
    display:flex;
    gap:18px;
    margin-left:auto;
    margin-right:28px;
    color:#9f927e;
    font:700 9px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1px
}

.poster-status span {
    display:flex;
    align-items:center;
    gap:6px
}

.poster-status i {
    width:6px;
    height:6px;
    border-radius:50%;
    background:#f0bc55;
    box-shadow:0 0 9px #f0bc55
}

.poster-status strong {
    color:#f0bc55
}

.site-main {
    min-height:60vh
}

.inner-hero {
    min-height:430px;
    padding:180px var(--layout-side) 76px;
    background:linear-gradient(90deg,#120e09f2,#120e096b),url('../img/site/noir-header-game-palette.png') center 45%/cover;
    border-bottom:1px solid #4b3516
}

.inner-hero--story { background-image:linear-gradient(90deg,#120e09f2,#120e096b),url('../img/story-hero.png') }
.inner-hero--version { background-image:linear-gradient(90deg,#120e09f2,#120e096b),url('../img/version-hero.png') }
.inner-hero--staff { background-image:linear-gradient(90deg,#120e09f2,#120e096b),url('../img/staff-hero.png') }
.inner-hero--contact { background-image:linear-gradient(90deg,#120e09f2,#120e096b),url('../img/contact-hero.png') }
.inner-hero--terms { background-image:linear-gradient(90deg,#120e09f2,#120e096b),url('../img/terms-hero.png') }
.inner-hero--privacy { background-image:linear-gradient(90deg,#120e09f2,#120e096b),url('../img/privacy-hero.png') }

.site-container {
    width:min(var(--layout-max),calc(100% - (var(--layout-gutter) * 2)));
    margin-inline:auto
}

.inner-hero .site-container {
    width:min(var(--layout-max),100%)
}

.inner-hero h1 {
    max-width:1200px;
    margin:12px 0 16px;
    color:#f5ead7;
    font:700 clamp(46px,6vw,82px)/1 Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:-2px
}

.inner-hero p:last-child {
    max-width:900px;
    margin:0;
    color:#d7c3a2;
    font-size:18px
}

.site-section,.site-article {
    padding:clamp(68px,7vw,112px) 0;
    background:radial-gradient(circle at 65% 10%,#2b1e0f50,transparent 34%),#120e09
}

.site-section:nth-of-type(even) {
    background:#1b130b
}

.site-heading {
    display:flex;
    align-items:end;
    justify-content:space-between;
    margin-bottom:38px
}

.site-heading h2,.site-section>div>h2 {
    margin:8px 0 28px;
    color:#f5ead7;
    font:700 clamp(34px,4vw,58px)/1 Mont,sans-serif;
    text-transform:uppercase
}

.reading-column {
    width:100%;
    max-width:1320px
}

.reading-column p,.rich-text {
    color:#d8d0bf;
    font-size:18px;
    line-height:1.9
}

.reading-column h2,.rich-text h2,.rich-text h3 {
    margin:55px 0 14px;
    color:#f0bc55;
    font-family:Mont,sans-serif;
    text-transform:uppercase
}

.article-cover {
    width:100%;
    max-height:680px;
    margin-bottom:46px;
    border:1px solid #4b3516;
    object-fit:cover
}

.site-button {
    min-width:220px;
    min-height:54px;
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    margin-top:22px;
    padding:0 0 0 24px;
    color:#120e09;
    background:#f0bc55;
    border:1px solid #f0bc55;
    font:700 11px Mont,sans-serif;
    text-transform:uppercase;
    letter-spacing:1px;
    cursor:pointer
}

.site-button span {
    align-self:stretch;
    min-width:54px;
    display:grid;
    place-items:center;
    background:#d7ad5f
}

.site-button:hover {
    background:#ffd16f
}

.site-empty {
    padding:45px;
    border:1px solid #4b3516;
    color:#bbaa91;
    background:#1b130b
}

.site-alert-section {
    padding:22px var(--layout-side);
    background:#0b0805
}

.site-alert {
    width:min(var(--layout-max),100%);
    margin:auto;
    padding:22px 28px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    border:1px solid #725224;
    border-left:4px solid #f0bc55;
    background:#1b130b
}

.site-alert span {
    color:#f0bc55;
    font:700 9px Mont;
    text-transform:uppercase
}

.site-alert h2 {
    margin:4px 0;
    font:700 18px Mont;
    text-transform:uppercase
}

.site-alert>strong {
    color:#f0bc55;
    font:700 25px Mont
}

.news-grid-modern {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px
}

.news-card-modern {
    min-height:460px;
    display:flex;
    flex-direction:column;
    border:1px solid #4b3516;
    background:#1b130b
}

.news-card-modern img {
    height:230px
}

.news-card-modern>div {
    padding:25px;
    display:flex;
    flex:1;
    flex-direction:column
}

.news-card-modern span {
    color:#998b76;
    font-size:11px
}

.news-card-modern h3 {
    margin:8px 0;
    color:#f5ead7;
    font:700 19px/1.25 Mont;
    text-transform:uppercase
}

.news-card-modern p {
    color:#bbaa91
}

.news-card-modern a {
    margin-top:auto;
    color:#f0bc55;
    font:700 10px Mont;
    text-transform:uppercase
}

.leaderboard-modern {
    max-width:900px;
    margin:30px 0 0;
    padding:0;
    list-style:none;
    border-top:1px solid #4b3516
}

.leaderboard-modern li {
    display:grid;
    grid-template-columns:40px 60px 1fr auto;
    gap:18px;
    align-items:center;
    padding:17px;
    border-bottom:1px solid #4b3516
}

.leaderboard-modern img {
    width:60px;
    height:60px;
    border-radius:50%
}

.leaderboard-modern>li>b,.leaderboard-modern strong {
    color:#f0bc55;
    font-family:Mont
}

.gallery-grid-modern {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px
}

.gallery-card {
    position:relative;
    display:block;
    overflow:hidden;
    border:1px solid #4b3516;
    background:#1b130b
}

.gallery-card.is-hidden {
    display:none
}

.gallery-card img {
    width:100%;
    aspect-ratio:16/10;
    object-fit:cover;
    transition:transform .35s
}

.gallery-card:hover img {
    transform:scale(1.035)
}

.gallery-card>span {
    position:absolute;
    right:14px;
    bottom:14px;
    padding:7px 10px;
    color:#120e09;
    background:#f0bc55;
    font:700 9px Mont;
    text-transform:uppercase
}

.gallery-pager,.site-pagination {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    margin-top:36px
}

.gallery-pager button,.site-pagination a,.site-pagination strong {
    min-width:42px;
    min-height:42px;
    display:grid;
    place-items:center;
    padding:0 15px;
    color:#d7c3a2;
    background:#1b130b;
    border:1px solid #4b3516;
    font:700 10px Mont;
    text-transform:uppercase
}

.gallery-pager button:disabled {
    opacity:.35
}

.site-pagination strong {
    color:#120e09;
    background:#f0bc55
}

.events-grid {
    display:grid;
    gap:24px
}

.event-card {
    display:grid;
    grid-template-columns:minmax(240px,.45fr) 1fr;
    min-height:280px;
    border:1px solid #4b3516;
    background:#1b130b
}

.event-card img {
    height:100%
}

.event-card>div {
    padding:36px
}

.event-card h2 {
    margin:12px 0;
    color:#f5ead7;
    font:700 30px Mont;
    text-transform:uppercase
}

.event-card strong {
    color:#f0bc55
}

.version-list {
    max-width:1180px
}

.version-entry {
    margin-bottom:14px;
    border:1px solid #4b3516;
    background:#1b130b
}

.version-entry>button {
    width:100%;
    padding:24px 28px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#f5ead7;
    background:transparent;
    border:0;
    text-align:left;
    cursor:pointer
}

.version-entry button span {
    display:flex;
    align-items:center;
    gap:20px
}

.version-entry button small {
    color:#998b76
}

.version-entry button strong {
    color:#f0bc55;
    font-size:20px
}

.version-entry-content {
    display:none;
    padding:0 28px 30px;
    color:#cbbca5;
    line-height:1.8
}

.version-entry.open .version-entry-content {
    display:block
}

.version-module {
    margin:5px 0;
    color:#f0bc55;
    font:700 10px Mont;
    letter-spacing:1px
}

.staff-intro {
    margin-bottom:45px
}

.staff-intro h2 {
    margin:0 0 24px;
    color:#f5ead7;
    font:700 clamp(24px,2.2vw,34px) Mont;
    text-transform:uppercase
}

.staff-intro p {
    margin:0 0 20px
}

.staff-grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px
}

.staff-card {
    min-height:150px;
    display:grid;
    grid-template-columns:80px 1fr;
    gap:22px;
    align-items:center;
    padding:26px;
    border:1px solid #4b3516;
    background:#1b130b
}

.staff-monogram {
    width:72px;
    height:72px;
    display:grid;
    place-items:center;
    color:#120e09;
    background:#f0bc55;
    font:700 28px Mont
}

.staff-avatar {
    width:72px;
    height:80px;
    display:block;
    object-fit:cover;
    object-position:center top;
    border:1px solid #6b4a1c;
    background:#120e09
}

.staff-card h2 {
    margin:0;
    color:#f5ead7;
    font:700 19px Mont;
    text-transform:uppercase
}

.staff-card ul {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:12px 0 0;
    padding:0;
    list-style:none
}

.staff-card li {
    padding:5px 8px;
    color:var(--staff-rank-color,#d7c3a2);
    border:1px solid var(--staff-rank-color,#4b3516);
    background:rgba(0,0,0,.18);
    box-shadow:inset 0 0 14px color-mix(in srgb,var(--staff-rank-color,#d7c3a2) 10%,transparent);
    font-size:12px
}

.legal-document {
    overflow-wrap:anywhere
}

.legal-document table,.rich-text table {
    width:100%;
    border-collapse:collapse
}

.legal-document th,.legal-document td,.rich-text th,.rich-text td {
    padding:12px;
    border:1px solid #4b3516
}

.legal-document img,.rich-text img {
    max-width:100%;
    height:auto
}

.site-footer {
    padding:60px var(--layout-side) 0;
    display:block;
    text-align:left;
    background:#0b0805
}

.site-footer-grid {
    width:min(var(--layout-max),100%);
    margin:auto;
    display:grid;
    grid-template-columns:.7fr .8fr 1.5fr;
    gap:55px
}

.site-footer-grid>div>p {
    color:#806f58
}

.site-footer nav {
    display:grid;
    align-content:start;
    gap:10px
}

.site-footer nav a {
    color:#bbaa91;
    font:700 10px Mont;
    text-transform:uppercase
}

.site-contact h2 {
    margin:7px 0 20px;
    font:700 27px Mont;
    text-transform:uppercase
}

.site-contact form {
    display:grid;
    gap:13px
}

.site-form-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:13px
}

.site-contact label,.auth-card label {
    display:grid;
    gap:7px;
    color:#cdbfa9;
    font:700 10px Mont;
    text-transform:uppercase;
    letter-spacing:.5px
}

.site-contact input,.site-contact textarea,.auth-card input {
    width:100%;
    padding:13px 14px;
    color:#f5ead7;
    background:#17110d;
    border:1px solid #4b3516;
    font:16px Roboto
}

.site-contact textarea {
    resize:vertical
}

.site-contact .site-button {
    margin-top:0
}

.site-form-note,.site-form-response {
    margin:0;
    color:#a99a83;
    font-size:12px
}

.site-form-response.is-success {
    color:#9bc77c
}

.site-form-response.is-error {
    color:#e68772
}

.site-copyright {
    width:min(var(--layout-max),100%);
    margin:45px auto 0;
    padding:18px 0;
    display:flex;
    justify-content:space-between;
    color:#806f58;
    border-top:1px solid #4b3516;
    font-size:11px;
    text-transform:uppercase
}

.auth-shell,.system-shell,.legal-lock-shell {
    min-height:calc(100vh - 98px);
    padding:170px var(--layout-side) 90px;
    display:grid;
    place-items:center;
    background:linear-gradient(90deg,#120e09ed,#120e0980),url('../img/site/noir-header-game-palette.png') center/cover
}

.auth-card,.system-card,.legal-lock-card {
    width:min(720px,100%);
    padding:48px;
    background:#120e09ed;
    border-top:3px solid #f0bc55
}

.auth-card h1,.system-card h1,.legal-lock-card h1 {
    margin:8px 0 18px;
    color:#f5ead7;
    font:700 clamp(36px,5vw,58px)/1 Mont;
    text-transform:uppercase
}

.auth-card>p,.system-card>p,.legal-lock-card>p {
    color:#cbbca5;
    font-size:17px
}

.auth-card form {
    display:grid;
    gap:18px;
    margin-top:30px
}

.registration-disclaimer {
    padding:16px 18px;
    color:#e8c9c9;
    background:linear-gradient(135deg,rgba(105,38,51,.32),rgba(54,23,29,.55));
    border:1px solid rgba(210,91,112,.48);
    border-left:3px solid #d55b70;
    box-shadow:inset 0 0 28px rgba(154,45,65,.08)
}

.registration-disclaimer strong {
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:8px;
    color:#f08a9c;
    font:700 11px/1.2 Mont,sans-serif;
    letter-spacing:1px;
    text-transform:uppercase
}

.registration-disclaimer p {
    margin:0;
    color:#dec0c0;
    font:400 13px/1.55 Roboto,sans-serif
}

.auth-state-notice {
    margin:28px 0 4px;
    padding:18px 20px;
    color:#d7c3a2;
    background:#1b130b;
    border:1px solid #725224;
    border-left:3px solid #f0bc55
}

.auth-state-notice strong {
    display:block;
    margin-bottom:7px;
    color:#f0bc55;
    font:700 12px Mont,sans-serif;
    letter-spacing:1px;
    text-transform:uppercase
}

.auth-state-notice p {
    margin:0;
    line-height:1.6
}

.auth-state-notice.auth-submit-state {
    width:100%;
    margin:0;
    min-height:72px;
    display:flex;
    flex-direction:column;
    justify-content:center
}

.activation-card {
    min-width:0;
}

.activation-instructions {
    padding:24px;
    font-size:18px;
}

.activation-instructions p + p {
    margin-top:18px;
}

.activation-instructions .activation-email {
    margin:8px 0;
    font:700 18px/1.5 Roboto,sans-serif;
    letter-spacing:0;
    text-transform:none;
    overflow-wrap:anywhere;
}

.activation-card .site-button {
    white-space:normal;
    text-align:left;
}

.case-registration-notice {
    max-width:330px;
    display:flex;
    align-items:center;
    padding:11px 15px;
    color:#f0bc55;
    border-left:2px solid #f0bc55;
    background:#120e09c7;
    font:700 10px/1.5 Mont,sans-serif;
    letter-spacing:.7px;
    text-transform:uppercase
}

.auth-card .check-label {
    display:flex;
    align-items:flex-start;
    text-transform:none;
    font:15px Roboto;
    letter-spacing:0
}

.check-label input {
    width:auto;
    margin-top:5px
}

.auth-links {
    display:grid;
    gap:10px;
    margin-top:26px;
    color:#bbaa91
}

.auth-links a {
    color:#f0bc55
}

.auth-card.is-submitting {
    opacity:.72
}

.system-card-wide,.legal-lock-card {
    width:min(1180px,100%)
}

.system-countdown {
    display:block;
    margin:30px 0;
    color:#f0bc55;
    font:700 clamp(38px,6vw,72px) Mont
}

.system-meta {
    display:flex;
    flex-wrap:wrap;
    gap:10px
}

.system-meta span {
    padding:8px 12px;
    border:1px solid #4b3516;
    color:#cbbca5
}

.system-actions {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:18px;
    margin-top:30px
}

.system-actions .site-button {
    margin:0
}

.system-actions>a:not(.site-button) {
    color:#f0bc55
}

.legal-scroll {
    max-height:52vh;
    overflow:auto;
    margin-top:30px;
    padding:28px;
    border:1px solid #4b3516;
    background:#0b0805
}

.legal-changes {
    margin:24px 0;
    padding:20px;
    border-left:3px solid #f0bc55;
    background:#1b130b
}

.legal-changes pre {
    white-space:pre-wrap;
    color:#d8d0bf
}

.site-button-danger {
    color:#f5ead7;
    background:#5d2119;
    border-color:#8d392b
}

@media(max-width:980px) {
    .poster-status {
        display:none
    }

    .news-grid-modern {
        grid-template-columns:repeat(2,1fr)
    }

    .gallery-grid-modern {
        grid-template-columns:repeat(2,1fr)
    }

    .site-footer-grid {
        grid-template-columns:1fr 1fr
    }

    .site-contact {
        grid-column:1/3
    }

}

@media(max-width:680px) {
    .inner-hero {
        min-height:350px;
        padding:145px 16px 52px
    }

    .inner-hero h1 {
        font-size:42px
    }

    .site-container {
        width:calc(100% - 32px)
    }

    .site-section,.site-article {
        padding:62px 0
    }

    .news-grid-modern,.gallery-grid-modern,.staff-grid {
        grid-template-columns:1fr
    }

    .event-card {
        grid-template-columns:1fr
    }

    .event-card img {
        height:230px
    }

    .site-form-row {
        grid-template-columns:1fr
    }

    .site-footer {
        padding-inline:16px
    }

    .site-footer-grid {
        display:block
    }

    .site-footer nav {
        margin:30px 0
    }

    .site-contact {
        margin-top:35px
    }

    .site-copyright {
        display:grid;
        gap:7px
    }

    .auth-shell,.system-shell,.legal-lock-shell {
        padding:130px 16px 55px
    }

    .auth-card,.system-card,.legal-lock-card {
        padding:30px 22px
    }

    .registration-disclaimer {
        padding:14px 15px
    }

    .registration-disclaimer p {
        font-size:12px
    }

    .system-actions {
        align-items:stretch;
        flex-direction:column
    }

    .system-actions>* {
        width:100%
    }

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

    .leaderboard-modern li {
        grid-template-columns:28px 48px 1fr
    }

    .leaderboard-modern img {
        width:48px;
        height:48px
    }

    .leaderboard-modern strong {
        grid-column:3
    }

    .version-entry>button {
        padding:20px
    }

    .version-entry button span {
        align-items:flex-start;
        flex-direction:column;
        gap:4px
    }

    .version-entry-content {
        padding:0 20px 24px
    }

    .case-mosaic.site-home-gallery {
        height:auto
    }

}

/* Homepage content-fit and leaderboard layout */ .news-card-modern {
    min-height:0
}

.news-card-modern p {
    margin:8px 0 20px;
    line-height:1.65
}

.leaderboard-modern {
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    border:0;
    list-style:none
}

.leaderboard-modern li {
    position:relative;
    min-width:0;
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    grid-template-rows:auto auto;
    column-gap:20px;
    align-items:center;
    padding:24px;
    border:1px solid #4b3516;
    background:linear-gradient(135deg,#21170d,#15100b)
}

.leaderboard-modern img {
    grid-row:1/3;
    width:72px;
    height:72px;
    border:1px solid #725224;
    border-radius:50%;
    filter:sepia(.18)
}

.leaderboard-modern .leaderboard-position {
    position:absolute;
    right:18px;
    top:11px;
    color:#4f3920;
    font:700 32px/1 Mont
}

.leaderboard-modern span {
    min-width:0;
    color:#f5ead7;
    font:700 16px Mont,sans-serif;
    text-transform:uppercase;
    overflow-wrap:anywhere
}

.leaderboard-modern span small {
    display:block;
    margin-bottom:5px;
    color:#998b76;
    font:700 9px Mont;
    letter-spacing:1px
}

.leaderboard-modern strong {
    align-self:start;
    color:#f0bc55;
    font:700 17px Mont
}

.leaderboard-modern strong small {
    display:block;
    color:#766953;
    font:700 8px Mont;
    text-transform:uppercase;
    letter-spacing:1px
}

@media(max-width:980px) {
    .leaderboard-modern {
        grid-template-columns:1fr
    }

}

@media(max-width:680px) {
    .leaderboard-modern li {
        grid-template-columns:58px minmax(0,1fr);
        padding:20px
    }

    .leaderboard-modern img {
        width:58px;
        height:58px
    }

    .leaderboard-modern strong {
        grid-column:2
    }

    .leaderboard-modern .leaderboard-position {
        right:14px;
        font-size:25px
    }

}

.version-arrow {
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    color:#f0bc55;
    border:1px solid #4b3516;
    border-radius:50%;
    font:400 20px/1 Mont,sans-serif;
    transition:transform .25s ease,background-color .25s ease
}

.version-entry.open .version-arrow {
    transform:rotate(180deg);
    background:#2a1d0f
}

.version-entry>button:hover .version-arrow {
    background:#332311
}

.version-entry {
    scroll-margin-top:150px
}

.version-entry:target {
    border-color:#a97832;
    box-shadow:0 0 0 1px #a9783245
}

.contact-hero {
    min-height:520px
}

.contact-page {
    min-height:calc(100vh - 520px)
}

.contact-layout {
    display:grid;
    grid-template-columns:minmax(280px,.7fr) minmax(520px,1.3fr);
    gap:clamp(55px,8vw,130px);
    align-items:start
}

.contact-copy {
    padding-top:20px
}

.contact-copy h2 {
    margin:10px 0 22px;
    color:#f5ead7;
    font:700 clamp(38px,4vw,60px)/1 Mont,sans-serif;
    text-transform:uppercase
}

.contact-copy>p:last-child {
    max-width:520px;
    color:#bbaa91;
    font-size:18px;
    line-height:1.85
}

.contact-form-panel {
    padding:clamp(30px,4vw,56px);
    border:1px solid #4b3516;
    border-top:3px solid #f0bc55;
    background:#17100b
}

.contact-form-panel h2 {
    margin:0 0 30px;
    color:#f5ead7;
    font:700 28px Mont,sans-serif;
    text-transform:uppercase
}

.contact-form-panel textarea {
    min-height:210px
}

.contact-form-panel .site-button {
    width:100%
}

@media(max-width:900px) {
    .contact-layout {
        grid-template-columns:1fr
    }

    .contact-copy {
        padding-top:0
    }

    .contact-form-panel {
        padding:30px
    }

}

/* Article paragraphs follow the shared content container without a second width cap. */ .inner-poster .reading-column p {
    width:auto;
    max-width:none
}

.news-reading {
    width:100%;
    max-width:var(--layout-max);
    margin-inline:auto;
    display:flow-root
}

.news-article {
    padding-left:var(--layout-side);
    padding-right:var(--layout-side)
}

.news-article-cover {
    width:clamp(320px,32vw,480px);
    aspect-ratio:16/10;
    float:left;
    margin:8px 38px 22px 0;
    border:1px solid #4b3516;
    object-fit:cover;
    object-position:center
}

.news-article-body {
    min-width:0
}

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

.news-back-button {
    clear:both;
    float:left;
    margin-top:36px
}

@media(max-width:720px) {
    .news-article {
        padding-left:16px;
        padding-right:16px
    }

    .news-article-cover {
        width:100%;
        aspect-ratio:16/10;
        float:none;
        margin:0 0 28px
    }

    .news-back-button {
        float:none
    }

}

/* Shared SITE page transition, adapted from the former navigation changeover. */
.site-page-transition {
    position:fixed;
    z-index:10000;
    inset:0;
    display:grid;
    place-items:center;
    pointer-events:none;
    visibility:hidden;
    opacity:0;
    background:#0b0805f5;
    transition:opacity .18s ease,visibility 0s linear .18s
}

.site-page-transition-mark {
    position:relative;
    z-index:1;
    color:#e5d6bd;
    opacity:0;
    transform:translateY(8px);
    font:700 clamp(18px,2vw,27px) Mont,Arial,sans-serif;
    letter-spacing:1.5px;
    transition:opacity .18s ease .2s,transform .24s ease .18s
}

.site-page-transition-mark b {
    color:#f0bc55
}

.site-page-transition-mark i {
    display:block;
    position:relative;
    width:190px;
    height:1px;
    margin:13px auto 0;
    overflow:hidden;
    background:#4b3516
}

.site-page-transition-mark i::after {
    content:"";
    position:absolute;
    inset:0;
    background:#f0bc55;
    transform:translateX(-100%)
}

.site-is-leaving .site-page-transition {
    visibility:visible;
    opacity:1;
    transition-delay:0s
}

.site-is-leaving .site-page-transition-mark {
    opacity:1;
    transform:none
}

.site-is-leaving .site-page-transition-mark i::after {
    animation:site-transition-progress .46s cubic-bezier(.3,.7,.35,1) forwards
}

@keyframes site-transition-progress {
    to {
        transform:translateX(0)
    }
}

@media(prefers-reduced-motion:reduce) {
    .site-page-transition {
        display:none
    }
}

/* Közös lebegő vezérlők a publikus oldalakon. */
.site-back-top,.site-age-rating {
    position:fixed;
    bottom:clamp(18px,2vw,32px);
    z-index:28;
    display:flex;
    align-items:center;
    border:1px solid #725224;
    border-radius:999px;
    background:#120e09ed;
    color:#f0c860;
    box-shadow:0 10px 34px #0009;
    font:700 14px Mont,sans-serif;
    backdrop-filter:blur(8px)
}

.site-back-top {
    right:clamp(16px,2vw,32px);
    gap:10px;
    min-height:48px;
    padding:11px 18px;
    cursor:pointer;
    transition:color .18s ease,border-color .18s ease,background-color .18s ease,transform .18s ease
}

.site-age-rating {
    left:clamp(16px,2vw,32px);
    justify-content:center;
    width:56px;
    height:56px;
    font-size:17px;
    line-height:1;
    user-select:none;
    pointer-events:none
}

.site-back-top[hidden] { display:none }
.site-back-top:hover,.site-back-top:focus-visible { color:#ffe08a;border-color:#d9a83f;background:#1d150bed;transform:translateY(-2px) }
.site-back-top:focus-visible { outline:2px solid #f0bc55;outline-offset:3px }

@media(max-width:680px) {
    .site-back-top { right:14px;bottom:14px;width:48px;padding:0;justify-content:center }
    .site-back-top span { display:none }
    .site-age-rating { left:14px;bottom:14px;width:48px;height:48px;font-size:15px }
    body:has(.ng-pwa-install.is-visible) .site-age-rating { visibility:hidden }
}

/* SITE authentication checkbox */
.auth-card .check-label input[type="checkbox"] {
    appearance:none;
    -webkit-appearance:none;
    width:20px;
    min-width:20px;
    height:20px;
    margin:0 2px 0 0;
    padding:0;
    border:1px solid #725224;
    border-radius:2px;
    background:#17110d;
    box-shadow:inset 0 0 0 2px #120e09;
    cursor:pointer;
    transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease
}

.auth-card .check-label {
    align-items:center;
    gap:13px;
    line-height:1.4
}

.auth-card .check-label a {
    color:#f0bc55;
    text-decoration-color:#8b6429;
    text-decoration-line:underline;
    text-decoration-thickness:1px;
    text-underline-offset:3px;
    transition:color .18s ease,text-decoration-color .18s ease
}

.auth-card .check-label a:hover,
.auth-card .check-label a:focus-visible {
    color:#ffd36f;
    text-decoration-color:currentColor
}

.auth-card .check-label input[type="checkbox"]:hover {
    border-color:#f0bc55
}

.auth-card .check-label input[type="checkbox"]:checked {
    border-color:#f0bc55;
    background-color:#f0bc55;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23120e09' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='m3 8 3 3 7-7'/%3E%3C/svg%3E");
    background-position:center;
    background-repeat:no-repeat;
    background-size:14px;
    box-shadow:none
}

.auth-card .check-label input[type="checkbox"]:focus-visible {
    outline:2px solid #f0bc55;
    outline-offset:3px
}
