/* ERATHRON / PUBLIC SHOWCASE · staging only
   The existing login, registration, password reset and legal dialogs
   keep their original handlers and styles. */
.auth-page {
    overflow-x: hidden;
    overflow-y: auto;
    background: #070808;
    color: #ede0c7;
    scrollbar-color: #735020 #100f0e;
}
.auth-page::before {
    background-image:
        linear-gradient(90deg, rgba(3,3,4,.02) 0%, rgba(5,5,6,.18) 47%, rgba(4,5,6,.74) 75%, #08090b 100%),
        url("../../assets/ui/auth-background.webp?v=20260905-bg2");
    background-position: center top;
    background-size: cover;
}
.auth-page::after {
    background: linear-gradient(180deg, rgba(5,6,7,.40), transparent 16%, rgba(5,6,7,.10) 52%, #08090b 94%);
}
.auth-landing {
    display: flex;
    flex-direction: column;
    min-height: 100svh;
    height: auto;
    isolation: isolate;
}
.auth-landing * { box-sizing: border-box; }
.auth-landing .landing-header {
    position: relative;
    z-index: 3;
    flex-shrink: 0;
    min-height: 66px;
    padding: 10px clamp(16px, 3.6vw, 72px);
    border-bottom: 1px solid rgba(209,157,76,.34);
    background: linear-gradient(180deg, rgba(6,7,8,.98),rgba(6,7,8,.88));
    box-shadow: 0 12px 28px rgba(0,0,0,.34);
}
.auth-landing .landing-nav {
    flex-wrap: wrap;
    gap: clamp(11px, 2.1vw, 34px);
}
.auth-landing .landing-nav-link {
    position: relative;
    min-height: 40px;
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 700;
    font-size: clamp(10px, .79vw, 13px);
    letter-spacing: .055em;
    color: #e7d6b9;
    text-decoration: none;
    white-space: nowrap;
}
.auth-landing .landing-nav-link:hover,
.auth-landing .landing-nav-link:focus-visible {
    color: #f8d288;
    outline: 2px solid transparent;
    text-shadow: 0 0 16px rgba(222,176,91,.38);
}
.auth-landing .landing-nav-link::after {
    content: "";
    position: absolute;
    bottom: 3px;
    left: 0;
    width: 0;
    height: 1px;
    background: #c99a4b;
    transition: width .18s ease;
}
.auth-landing .landing-nav-link:hover::after,
.auth-landing .landing-nav-link:focus-visible::after { width: 100%; }
.landing-nav-emblem {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: clamp(142px, 10vw, 170px);
    height: 44px;
    flex: 0 0 auto;
    text-decoration: none;
}
.landing-nav-emblem img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 1px 8px rgba(0,0,0,.6));
}
.landing-nav-emblem:focus-visible { outline: 1px solid #ddb663; outline-offset: 2px; }
.auth-landing .language-switcher--auth {
    border: 1px solid rgba(198,148,67,.48);
    background: rgba(7,7,8,.85);
}
.auth-landing .language-switcher-select { color: #f0d4a6; }

.auth-landing .landing-hero {
    position: relative;
    flex: none;
    min-height: min(650px, 68vw);
    padding: 46px clamp(26px,5vw,110px) 76px;
    justify-content: flex-end;
}
.auth-landing .landing-hero::after {
    content: "";
    position: absolute;
    inset: 0 0 0 48%;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(3,5,7,.65) 45%, rgba(4,6,8,.79));
}
.auth-landing .landing-hero-content {
    position: relative;
    z-index: 1;
    width: clamp(380px,42vw,670px);
    max-width: 100%;
    padding: 4px 0 12px;
    transform: none;
}
.auth-landing .landing-hero-content::before { display: none; }
.auth-landing .landing-logo {
    width: min(100%, 550px);
    max-height: 225px;
    filter: drop-shadow(0 9px 12px rgba(0,0,0,.92));
}
.landing-showcase-kicker {
    margin-top: 2px;
    color: #d5ad62;
    font: 700 11px/1.6 Georgia, serif;
    letter-spacing: .24em;
    text-transform: uppercase;
}
.auth-landing .landing-copy { margin-top: 12px; }
.auth-landing .landing-copy h1 {
    font-size: clamp(32px,3.1vw,56px);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: .05em;
    color: #f4dfb8;
    text-shadow: 0 3px 1px rgba(0,0,0,.7),0 5px 24px rgba(0,0,0,.9);
}
.auth-landing .landing-copy p {
    max-width: 590px;
    margin: 16px auto 0;
    color: #e5d5bf;
    font-size: clamp(13px,1.02vw,17px);
    font-weight: 400;
    letter-spacing: .006em;
    line-height: 1.65;
    text-shadow: 0 2px 9px #000;
}
.landing-ornament {
    width: min(100%, 260px);
    height: 1px;
    margin: 18px auto 0;
    background: linear-gradient(90deg, transparent, #b58345, transparent);
}
.auth-landing .landing-actions { margin-top: 27px; width: min(100%, 580px); gap: 14px; }
.auth-landing .landing-cta {
    min-height: 56px;
    border-radius: 3px;
    border-width: 1px;
    font: 700 clamp(11px,.88vw,14px)/1.3 Georgia,serif;
    letter-spacing: .075em;
}
.auth-landing .landing-cta-primary {
    background: linear-gradient(180deg,#862522,#570f15);
    border-color: #ae753c;
    box-shadow: inset 0 1px rgba(255,219,152,.2),0 8px 0 rgba(0,0,0,.12),0 15px 28px rgba(0,0,0,.46);
}
.auth-landing .landing-cta-secondary {
    background: linear-gradient(180deg,rgba(23,21,19,.95),rgba(8,9,11,.9));
    border-color: #a88146;
}
.auth-landing .landing-status { justify-content: center; margin-top: 14px; }
.landing-feature-strip {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: clamp(8px,1.6vw,22px);
    width: 100%;
    max-width: 650px;
    margin: 30px auto 0;
}
.landing-feature {
    min-width: 0;
    text-align: center;
    color: #e2c99e;
}
.landing-feature-symbol {
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(42px,4vw,58px);
    height: clamp(42px,4vw,58px);
    margin: 0 auto 11px;
    transform: rotate(45deg);
    border: 1px solid #ae8243;
    background: linear-gradient(145deg,rgba(42,32,20,.9),rgba(5,9,11,.9));
    box-shadow: inset 0 0 0 3px rgba(6,7,8,.75),0 5px 22px #0009;
    color: #d9b278;
}
.landing-feature-symbol svg { width: 28px; height: 28px; transform: rotate(-45deg); fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
.landing-feature-label { display: block; font: 700 clamp(10px,.82vw,13px)/1.35 Georgia,serif; text-transform: uppercase; letter-spacing: .045em; }
.landing-feature-subtitle { display: block; margin-top: 5px; font-size: 9px; line-height: 1.4; color: #b2a693; text-transform: uppercase; letter-spacing: .08em; }

/* Two editorial sections; a visible gap is intentional for visual hierarchy. */
.landing-showcase-area {
    position: relative;
    z-index: 2;
    width: min(1500px, calc(100% - clamp(24px,7vw,130px)));
    margin: -12px auto 0;
    padding: 30px 0 48px;
    display: grid;
    grid-template-columns: minmax(0,1.9fr) minmax(320px,1fr);
    gap: clamp(20px,2.3vw,38px);
}
.landing-showcase-area::before {
    content: "";
    position: absolute;
    inset: 0 -3vw -12px;
    z-index: -1;
    background: linear-gradient(180deg,rgba(6,8,9,.18),rgba(5,7,8,.96) 22%,#070808 100%);
    border-top: 1px solid rgba(178,131,69,.18);
}
.landing-showcase-area section { min-width: 0; scroll-margin-top: 22px; }
.landing-section-heading {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 52px;
    margin: 0 0 19px;
}
.landing-section-heading h2 {
    flex: none;
    margin: 0;
    color: #eacb92;
    font: 700 clamp(21px,1.7vw,28px)/1.1 Georgia,serif;
    letter-spacing: .035em;
    text-shadow: 0 3px 12px #000;
    text-transform: uppercase;
}
.landing-section-heading::after { content: ""; height: 1px; flex: 1; background: linear-gradient(90deg,#8b6938,transparent); }
.landing-section-intro {
    color: #bdb3a6;
    line-height: 1.55;
    font-size: 13px;
    margin: -10px 0 18px;
}
.landing-gallery-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.landing-gallery-card {
    position: relative;
    width: 100%;
    min-height: 190px;
    padding: 0;
    overflow: hidden;
    border: 1px solid #775934;
    border-radius: 4px;
    background: #141a1a;
    box-shadow: 0 10px 24px #0007,inset 0 0 0 2px #0c0e0e;
    text-align: left;
    cursor: pointer;
    isolation: isolate;
    aspect-ratio: 16/9;
    transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.landing-gallery-card:hover,.landing-gallery-card:focus-visible {
    transform: translateY(-3px);
    border-color: #dda95a;
    box-shadow: 0 12px 24px #0009,0 0 0 1px #b58140;
    outline: none;
}
.landing-gallery-card img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 18%;
    transition: transform .32s ease;
}
.landing-gallery-card:hover img { transform: scale(1.045); }
.landing-gallery-card::before { content: ""; z-index: -1; position:absolute; inset: 0; background: linear-gradient(135deg,#32251b,#0d1515 60%); }
.landing-gallery-card::after { content: ""; pointer-events:none; position: absolute; inset: 43% 0 0; background: linear-gradient(180deg,transparent,rgba(2,3,4,.96)); }
.landing-gallery-card-copy {
    display: flex;
    align-items: center;
    gap: 11px;
    position: absolute;
    z-index: 1;
    left: 13px;
    right: 13px;
    bottom: 12px;
    color: #f3ddaf;
}
.landing-gallery-card-icon { display:flex; align-items:center; justify-content:center; width: 38px; height: 38px; flex: 0 0 38px; border:1px solid #ad7c38; border-radius:50%; background:#0c1115cc; font-size:21px; }
.landing-gallery-card-title { display:block; font:700 15px/1.1 Georgia,serif; text-transform:uppercase; letter-spacing:.055em; }
.landing-gallery-card-subtitle { display:block; margin-top:4px; color:#b8a995; font-size:9px; text-transform:uppercase; letter-spacing:.09em; }
.landing-gallery-card-arrow { margin-left:auto; display:grid; place-items:center; width:28px;height:28px;border:1px solid #ac853e;border-radius:50%;font-size:16px; }
.landing-gallery-card .landing-gallery-fallback { display:none; position:absolute;inset:0;z-index:0;align-items:center;justify-content:center;color:#967e55;font-size:12px;font-style:italic; }
.landing-gallery-card.is-image-missing .landing-gallery-fallback { display:flex; }
.landing-gallery-card.is-image-missing img { display:none; }

.landing-news-list { display: grid; gap: 13px; }
.landing-news-card {
    overflow: hidden;
    border: 1px solid rgba(140,111,65,.5);
    border-radius: 4px;
    background: linear-gradient(145deg,rgba(20,22,23,.98),rgba(7,9,11,.96));
    box-shadow: 0 10px 25px #0008;
}
.landing-news-card summary { display: grid; grid-template-columns: 105px minmax(0,1fr) 20px; gap:12px; align-items:center; cursor:pointer; padding: 11px; list-style:none; }
.landing-news-card summary::-webkit-details-marker { display:none; }
.landing-news-card summary:focus-visible { outline: 1px solid #d1a052; outline-offset: -2px; }
.landing-news-art { align-self:stretch; min-height:98px; border: 1px solid #715331; border-radius: 3px; background: linear-gradient(155deg,#6b3325,#191515 55%,#0d1414); display:grid;place-items:center;color:#bb995f;font-size:32px; }
.landing-news-art--fortress { background: linear-gradient(165deg,#4b3b25,#101315 77%); }
.landing-news-copy { min-width:0; }
.landing-news-tag { display:block; margin-bottom:7px;color:#d3a457;font-size:9px;font-weight:800;letter-spacing:.15em;text-transform:uppercase; }
.landing-news-title { display:block; font:700 clamp(15px,1vw,18px)/1.24 Georgia,serif;color:#f5d9a7; }
.landing-news-excerpt { display:block; margin-top:6px;color:#b7afa5;font-size:11px;line-height:1.5; }
.landing-news-chevron { color:#d4a25a;font-size:25px;transition:transform .2s; }
.landing-news-card[open] .landing-news-chevron { transform:rotate(90deg); }
.landing-news-expanded { border-top:1px solid #60472a; padding: 15px 20px 19px;color:#d1c2ab;font-size:12px;line-height:1.7; }
.landing-news-expanded p { margin:0; }
.landing-news-expanded p+p { margin-top:10px; }

.auth-landing .landing-footer {
    position: relative;
    z-index: 2;
    width:100%;
    min-height: 64px;
    margin-top:auto;
    border-top: 1px solid rgba(173,125,60,.36);
    background: rgba(4,6,7,.92);
    color:#99918a;
}
.auth-landing .landing-footer-links button { color:#bd9d6f; }
.auth-landing .landing-footer-links button:hover { color:#efd39e; }

/* Accessible native <dialog>: focus stays inside, ESC closes automatically. */
.landing-gallery-dialog { box-sizing:border-box; position:fixed; inset:0; margin:auto; width:min(1600px,calc(100vw - 40px)); max-height:min(94dvh,1040px); padding:0; border:1px solid #a77b3d; border-radius:6px; background:#080c0e; color:#e9d8b8; box-shadow:0 24px 120px #000; }
.landing-gallery-dialog::backdrop { background:rgba(0,0,0,.91);backdrop-filter:blur(5px); }
.landing-gallery-dialog-inner { display:flex; flex-direction:column; max-height:calc(min(94dvh,1040px) - 2px); overflow:hidden; }
.landing-gallery-dialog-top { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 15px;border-bottom:1px solid #4e3a24; }
.landing-gallery-dialog-title { margin:0;font:700 21px/1.2 Georgia,serif;color:#f0d39b; }
.landing-gallery-dialog-close { display:grid;place-items:center;min-width:44px;height:44px;border:1px solid #7c623a;background:#151312;color:#ecd4ac;font-size:25px;cursor:pointer; }
.landing-gallery-dialog-image { display:block; width:100%; max-width:100%; height:auto; max-height:calc(94dvh - 156px); margin:auto; object-fit:contain; background:#050708; }
.landing-gallery-dialog-bottom { display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 15px;border-top:1px solid #4e3a24; }
.landing-gallery-dialog-caption { flex:1;color:#c7b89e;font-size:13px;line-height:1.5;text-align:center; }
.landing-gallery-dialog-navigation { flex:none;display:flex;align-items:center;gap:6px; }
.landing-gallery-dialog-nav { width:44px;height:44px;border:1px solid #916c3b;background:#141517;color:#edd5a0;cursor:pointer;font-size:25px; }
.landing-gallery-dialog-nav:hover,.landing-gallery-dialog-close:hover { background:#30241b; }
.landing-gallery-dialog-counter { min-width:36px; color:#c9ad7e;font-size:11px;text-align:center; }

/* Narrow laptops: keep the editorial columns, but reduce the hero. */
@media(max-width:1150px) {
  .auth-landing .landing-hero { min-height:580px; padding:38px 35px 65px; }
  .auth-landing .landing-hero-content { width:min(600px,52vw); }
  .landing-showcase-area { grid-template-columns:minmax(0,1.45fr) minmax(290px,1fr); width:calc(100% - 46px); gap:20px; }
  .landing-gallery-card { min-height:160px; }
  .landing-news-card summary { grid-template-columns:75px minmax(0,1fr) 17px;gap:9px; }
  .landing-news-art { min-height:82px; }
}
@media(max-width:900px) {
  .auth-landing .landing-hero { min-height:610px; justify-content:center; }
  .auth-landing .landing-hero::after { inset:0; background:rgba(5,6,7,.38); }
  .auth-landing .landing-hero-content { width:min(650px,95%);padding:23px 20px;background:rgba(5,7,8,.67);border:1px solid #785c365e; }
  .landing-showcase-area { display:flex;flex-direction:column;gap:32px; }
  .landing-gallery-card { min-height:180px; }
  .auth-landing .landing-header { flex-wrap:wrap;row-gap:4px; }
}
@media(max-width:680px) {
  .auth-landing .landing-header { gap:8px; padding:9px 11px 13px; }
  .auth-landing .landing-nav { order:2;display:flex;flex-wrap:wrap;justify-content:center;width:100%;gap:4px 15px; }
  .landing-nav-emblem { width: clamp(100px, 28vw, 120px);height:44px;flex-basis:clamp(100px, 28vw, 120px); }
  .auth-landing .landing-nav-link {min-height:36px;font-size:10px;}
  .auth-landing .auth-language-switcher-host {order:1;width:100%;justify-content:flex-end; }
  .auth-landing .landing-hero { min-height:0; padding:34px 12px 55px; }
  .auth-landing .landing-hero-content { width:100%;max-width:540px;padding:22px 14px; }
  .auth-landing .landing-logo { max-height:140px;width:min(100%,360px); }
  .auth-landing .landing-copy h1 {font-size:clamp(26px,7vw,39px);}
  .auth-landing .landing-copy p {font-size:13px;}
  .auth-landing .landing-actions {grid-template-columns:1fr 1fr;gap:8px;}
  .auth-landing .landing-cta {padding:10px 6px;font-size:10px;min-height:52px;}
  .landing-feature-strip { gap:11px 6px;margin-top:27px; }
  .landing-feature-symbol {height:42px;width:42px;margin-bottom:9px;}
  .landing-feature-label {font-size:10px;}
  .landing-feature-subtitle {font-size:8px;letter-spacing:.02em;}
  .landing-showcase-area {width:calc(100% - 26px);margin:0 auto;padding:20px 0 32px;}
  .landing-section-heading h2 {font-size:22px;}
  .landing-gallery-grid {gap:10px;}
  .landing-gallery-card {min-height:0;aspect-ratio:4/3;}
  .landing-gallery-card-copy {left:7px;right:7px;bottom:8px;gap:5px;}
  .landing-gallery-card-icon {width:28px;height:28px;flex-basis:28px;font-size:15px;}
  .landing-gallery-card-title {font-size:11px;}
  .landing-gallery-card-subtitle {font-size:8px;letter-spacing:0;}
  .landing-gallery-card-arrow {width:21px;height:21px;font-size:13px;}
  .landing-gallery-dialog {width:calc(100vw - 14px);max-height:96dvh;}
  .landing-gallery-dialog-inner {max-height:calc(96dvh - 2px);}
  .landing-gallery-dialog-image {max-height:calc(96dvh - 205px);}
}
@media(max-width:390px) {
  .auth-landing .landing-nav {gap:0 12px;}
  .auth-landing .landing-nav-link {font-size:9px;}
  .auth-landing .landing-cta {font-size:9px;}
  .landing-gallery-card-icon {display:none;}
  .landing-feature-subtitle {display:none;}
  .landing-news-card summary {grid-template-columns:72px minmax(0,1fr) 14px;gap:7px;padding:8px;}
  .landing-news-title {font-size:14px;}
}
@media(prefers-reduced-motion:reduce) {
  .landing-gallery-card, .landing-gallery-card img, .auth-landing .landing-nav-link::after {transition:none!important;}
  html {scroll-behavior:auto!important;}
}

/* =========================================================
   DESKTOP VIEWPORT FIT — ERATHRON landing
   On normal desktop monitors show BOTH rows of real game previews
   and the news without forcing a vertical scroll.
   Restrict these adjustments to desktop: never compress the
   readable mobile/tablet design or touch-size gallery controls.
========================================================= */
@media (min-width: 1180px) and (min-height: 700px) {
  .auth-landing {
    height: 100svh;
    min-height: 0;
  }

  .auth-landing .landing-header {
    min-height: 54px;
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .auth-landing .landing-nav-link { min-height: 32px; }
  .auth-landing .landing-nav-emblem {
    width: 148px;
    height: 38px;
    flex-basis: 148px;
  }

  .auth-landing .landing-hero {
    flex: 0 0 auto;
    height: clamp(360px, 46svh, 460px);
    min-height: 0;
    padding: 10px clamp(16px, 3.9vw, 82px) 8px 32px;
    align-items: center;
  }

  .auth-landing .landing-hero-content {
    width: min(550px, 39vw);
    max-width: 100%;
    padding: 0;
    transform: translate(14px, -4px);
  }

  .auth-landing .landing-logo {
    width: min(410px, 100%);
    max-height: 118px;
  }

  .auth-landing .landing-showcase-kicker {
    margin-top: 0;
    font-size: 9px;
    letter-spacing: .18em;
  }

  .auth-landing .landing-copy { margin-top: 6px; }
  .auth-landing .landing-copy h1 {
    font-size: clamp(31px, 2.3vw, 43px);
    line-height: 1.025;
  }
  .auth-landing .landing-copy p {
    margin-top: 8px;
    font-size: clamp(11px, .88vw, 14px);
    line-height: 1.43;
  }
  .auth-landing .landing-ornament { margin-top: 9px; }
  .auth-landing .landing-actions {
    margin-top: 15px;
    gap: 10px;
    width: min(100%, 520px);
  }
  .auth-landing .landing-cta {
    min-height: 44px;
    font-size: clamp(10px, .76vw, 12px);
  }
  .auth-landing .landing-status { margin-top: 7px; }
  .auth-landing .landing-feature-strip {
    margin-top: 14px;
    gap: 8px;
  }
  .auth-landing .landing-feature-symbol {
    width: 38px;
    height: 38px;
    margin-bottom: 8px;
  }
  .auth-landing .landing-feature-symbol svg {
    width: 23px;
    height: 23px;
  }
  .auth-landing .landing-feature-label { font-size: 11px; }
  .auth-landing .landing-feature-subtitle { font-size: 8px; }

  /* One shared framed band along the entire bottom of the castle artwork. */
  .landing-showcase-area {
    flex: 1 1 auto;
    align-self: stretch;
    width: calc(100% - clamp(36px, 3.9vw, 96px));
    min-height: 0;
    margin: -3px auto 14px;
    padding: clamp(10px, 1.2svh, 16px) clamp(12px, 1.15vw, 22px);
    display: grid;
    grid-template-columns: minmax(0, 2.55fr) minmax(310px, 1fr);
    gap: clamp(12px, 1vw, 24px);
    border: 1px solid rgba(181, 132, 64, .56);
    border-radius: 5px;
    background: linear-gradient(110deg, rgba(4, 6, 7, .84), rgba(4, 6, 8, .97) 85%);
    box-shadow: 0 14px 46px rgba(0, 0, 0, .55);
  }
  .landing-showcase-area::before { display: none; }
  .landing-showcase-area section {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
  }
  .landing-section-heading {
    min-height: 38px;
    margin-bottom: 5px;
    gap: 10px;
  }
  .landing-section-heading h2 { font-size: clamp(23px, 1.5vw, 32px); }
  .landing-section-intro {
    margin: -3px 0 8px;
    font-size: clamp(11px, .66vw, 14px);
    line-height: 1.4;
  }
  .landing-gallery-grid {
    display: grid;
    flex: 1 1 auto;
    min-height: 0;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }
  .landing-gallery-card {
    height: 100%;
    min-height: 0;
    aspect-ratio: auto;
  }
  .landing-gallery-card-copy { bottom: 9px; }
  .landing-gallery-card-icon {
    width: 32px;
    height: 32px;
    flex-basis: 32px;
    font-size: 17px;
  }
  .landing-gallery-card-title { font-size: clamp(13px, .89vw, 19px); }
  .landing-gallery-card-subtitle { font-size: clamp(8px, .55vw, 10px); }
  .landing-news-list {
    display: grid;
    align-content: start;
    flex: 0 0 auto;
    grid-template-rows: repeat(2, auto);
    gap: 9px;
  }
  .landing-news-card summary {
    grid-template-columns: clamp(62px, 5.1vw, 92px) minmax(0, 1fr) 17px;
    gap: clamp(8px, .8vw, 15px);
    padding: clamp(8px, .75vw, 12px);
  }
  .landing-news-art { min-height: clamp(70px, 9svh, 104px); }
  .landing-news-title { font-size: clamp(14px, .95vw, 20px); }
  .landing-news-excerpt { line-height: 1.48; }

  .auth-landing .landing-footer {
    flex: 0 0 auto;
    margin-top: 0;
    min-height: 45px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  /* Expanded news is allowed to grow the page rather than crop text. */
  .auth-landing:has(.landing-news-card[open]) {
    height: auto;
    min-height: 100svh;
  }
  .auth-landing:has(.landing-news-card[open]) .landing-showcase-area {
    flex: 0 0 auto;
    min-height: 385px;
  }
  .auth-landing:has(.landing-news-card[open]) .landing-gallery-grid {
    min-height: 290px;
  }
}

/* Short desktop/laptop viewports need less vertical space, not
   hidden content. The legal links remain in the normal document flow. */
@media (min-width: 1180px) and (min-height: 700px) and (max-height: 850px) {
  .auth-landing .landing-logo { max-height: 87px; width: min(310px, 100%); }
  .auth-landing .landing-copy { margin-top: 3px; }
  .auth-landing .landing-copy h1 {
    font-size: clamp(29px, 2.24vw, 33px);
    line-height: 1.02;
  }
  .auth-landing .landing-copy p { margin-top: 5px; font-size: 11px; line-height: 1.34; }
  .auth-landing .landing-ornament { margin-top: 6px; }
  .auth-landing .landing-actions { margin-top: 10px; }
  .auth-landing .landing-cta { min-height: 38px; }
  .auth-landing .landing-status { margin-top: 5px; }
  .auth-landing .landing-feature-strip { margin-top: 10px; }
  .auth-landing .landing-feature-symbol { height: 32px; width: 32px; margin-bottom: 5px; }
  .auth-landing .landing-feature-symbol svg { height: 20px; width: 20px; }
  .auth-landing .landing-feature-subtitle { font-size: 7px; }
  .landing-showcase-area { padding-top: 7px; padding-bottom: 8px; }
  .landing-section-heading { min-height: 31px; margin-bottom: 5px; }
  .landing-section-intro { margin-bottom: 6px; }
  .auth-landing .landing-footer { min-height: 40px; padding-top: 6px; padding-bottom: 6px; }
}

/* =========================================================
   PUBLIC LANDING READABILITY — MOBILE AND FOOTER
   Keep desktop hero/gallery fit untouched; CSS comes after
   the <=390px compact rules so phone text is not 9px.
========================================================= */
@media (max-width: 680px) {
  .auth-landing .landing-nav {
    flex-wrap: wrap;
    column-gap: 8px;
    row-gap: 2px;
  }

  .auth-landing .landing-nav-link {
    min-height: 44px;
    font-size: clamp(11px, 2.25vw, 12px);
    letter-spacing: .025em;
    line-height: 1.3;
  }

  .auth-landing .landing-nav-emblem {
    width: clamp(100px, 28vw, 120px);
    height: 44px;
    flex-basis: clamp(100px, 28vw, 120px);
  }

  .auth-landing .landing-social-link {
    min-width: 26px;
    padding-inline: 3px;
    justify-content: center;
  }

  .auth-landing .landing-social-link svg {
    width: 17px;
    height: 17px;
  }

  .auth-landing .landing-footer {
    gap: 2px;
    padding: 10px 12px max(14px, env(safe-area-inset-bottom, 0px));
    color: #c3b6a2;
    font-size: 11px;
  }

  .auth-landing .landing-footer-author {
    justify-content: center;
    gap: 7px;
    line-height: 1.5;
  }

  .auth-landing .landing-footer-links {
    gap: 2px 8px;
    flex-wrap: wrap;
  }

  .auth-landing .landing-footer-links button {
    min-height: 44px;
    padding: 8px 4px;
    color: #e1c393;
    font-size: 12px;
    line-height: 1.35;
    white-space: normal;
  }
}

@media (min-width: 681px) {
  .auth-landing .landing-footer {
    color: #bcb0a0;
    font-size: 11px;
  }

  .auth-landing .landing-footer-links button {
    min-height: 36px;
    padding: 6px 3px;
    color: #d7b987;
  }
}

.auth-landing .landing-nav-link:focus-visible,
.auth-landing .landing-footer-links button:focus-visible {
  outline: 2px solid #ddb663;
  outline-offset: 2px;
}


/* Narrow desktops also keep the gallery/news aligned in a single wide band.
   Scroll naturally when the viewport does not have room for the cards. */
@media (min-width: 901px) and (max-width: 1179px) {
  .landing-showcase-area {
    width: calc(100% - 42px);
    margin: -12px auto 20px;
    padding: 18px;
    grid-template-columns: minmax(0, 2fr) minmax(285px, 1fr);
    gap: 16px;
    border: 1px solid rgba(181, 132, 64, .56);
    border-radius: 5px;
    background: rgba(4, 6, 8, .92);
  }
  .landing-showcase-area::before { display: none; }
  .landing-gallery-card { min-height: 140px; }
}

/* Long translations must wrap inside the gallery and news cards. */
.landing-gallery-card-copy > span:nth-child(2) { min-width: 0; }
.landing-gallery-card-title, .landing-news-title {
  overflow-wrap: anywhere;
  hyphens: auto;
}


/* Accessible news reader: the compact homepage cards open full articles.
   Keep this modal independent of registration and the gallery lightbox. */
.landing-news-dialog {
  box-sizing: border-box;
  position: fixed;
  inset: 0;
  margin: auto;
  width: min(940px, calc(100vw - 32px));
  max-height: min(88dvh, 840px);
  padding: 0;
  border: 1px solid #ad813f;
  border-radius: 7px;
  background: #080b0e;
  color: #ead9bb;
  box-shadow: 0 30px 110px rgba(0, 0, 0, .96);
}
.landing-news-dialog::backdrop {
  background: rgba(0, 0, 0, .88);
  backdrop-filter: blur(5px);
}
.landing-news-dialog-inner {
  display: flex;
  flex-direction: column;
  max-height: calc(min(88dvh, 840px) - 2px);
  overflow: hidden;
}
.landing-news-dialog-header {
  flex: 0 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding: clamp(14px, 2.5vw, 24px);
  border-bottom: 1px solid rgba(196, 143, 67, .52);
  background: linear-gradient(100deg, #1c1713, #090c0e 72%);
}
.landing-news-dialog-kicker {
  display: block;
  color: #c6a371;
  font: 700 10px/1.5 Georgia, serif;
  letter-spacing: .22em;
}
.landing-news-dialog-header h2 {
  margin: 2px 0 0;
  color: #f2d39d;
  font: 700 clamp(24px, 3.5vw, 36px)/1.15 Georgia, serif;
  text-transform: uppercase;
}
.landing-news-dialog-close {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid #a27a40;
  border-radius: 4px;
  background: #171514;
  color: #f1d4a4;
  font-size: 29px;
  cursor: pointer;
}
.landing-news-dialog-close:hover { background: #34251c; }
.landing-news-dialog-close:focus-visible,
.landing-news-dialog-choice:focus-visible {
  outline: 2px solid #f2c56d;
  outline-offset: 3px;
}
.landing-news-dialog-scroll {
  overflow-y: auto;
  min-height: 0;
  padding: clamp(14px, 2.3vw, 24px);
  overscroll-behavior: contain;
  scrollbar-color: #916f3f #101115;
}
.landing-news-dialog-choices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.landing-news-dialog-choice {
  min-width: 0;
  min-height: 62px;
  padding: 13px 16px;
  border: 1px solid rgba(161, 115, 57, .5);
  border-radius: 4px;
  background: #131619;
  color: #d8c4a0;
  font: 700 clamp(13px, 1.5vw, 16px)/1.4 Georgia, serif;
  text-align: left;
  cursor: pointer;
  overflow-wrap: anywhere;
}
.landing-news-dialog-choice:hover {
  border-color: #e0ae63;
  background: #262019;
}
.landing-news-dialog-choice[aria-pressed="true"] {
  border-color: #d0a05a;
  background: linear-gradient(110deg, #40301d, #171a1b);
  color: #ffdfac;
  box-shadow: inset 3px 0 #cf9a51;
}
.landing-news-dialog-article {
  padding: clamp(16px, 2.6vw, 28px);
  border: 1px solid rgba(174, 128, 67, .42);
  border-radius: 4px;
  background: linear-gradient(145deg, rgba(28, 28, 26, .91), #0a0e11);
}
.landing-news-dialog-tag {
  display: block;
  margin-bottom: 9px;
  color: #d8a75e;
  font: 800 11px/1.3 Georgia, serif;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.landing-news-dialog-article h3 {
  margin: 0 0 14px;
  color: #f3d4a2;
  font: 700 clamp(22px, 2.8vw, 30px)/1.26 Georgia, serif;
  overflow-wrap: anywhere;
}
.landing-news-dialog-lead {
  margin: 0 0 17px;
  color: #d8c2a0;
  font-size: clamp(14px, 1.5vw, 17px);
  line-height: 1.6;
}
.landing-news-dialog-body {
  border-top: 1px solid rgba(174, 128, 67, .25);
  padding-top: 14px;
  color: #cfcbc4;
  font-size: clamp(13px, 1.35vw, 15px);
  line-height: 1.8;
}
.landing-news-dialog-body p { margin: 0 0 14px; }
.landing-news-dialog-body p:last-child { margin-bottom: 0; }

@media (max-width: 680px) {
  .landing-news-dialog {
    width: calc(100vw - 16px);
    max-height: 94dvh;
  }
  .landing-news-dialog-inner { max-height: calc(94dvh - 2px); }
  .landing-news-dialog-header { padding: 12px 15px; }
  .landing-news-dialog-scroll { padding: 12px; }
  .landing-news-dialog-choices { grid-template-columns: 1fr; gap: 8px; margin-bottom: 12px; }
  .landing-news-dialog-choice { min-height: 48px; padding: 10px 12px; font-size: 14px; }
  .landing-news-dialog-article { padding: 16px 14px; }
  .landing-news-dialog-article h3 { font-size: 23px; }
  .landing-news-dialog-body { font-size: 14px; }
}

/* Compact game thumbnails on the public homepage.
   Only the cards change; the full-size gallery dialog stays as it is. */
@media (min-width: 1180px) {
  #game-preview .landing-gallery-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: none;
    flex: 0 0 auto;
    align-content: start;
    gap: 10px;
  }

  #game-preview .landing-gallery-card {
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
  }

  #game-preview .landing-gallery-card-copy {
    left: 7px;
    right: 7px;
    bottom: 8px;
    gap: 6px;
  }

  #game-preview .landing-gallery-card-icon {
    width: 25px;
    height: 25px;
    flex-basis: 25px;
    font-size: 14px;
  }

  #game-preview .landing-gallery-card-title {
    font-size: clamp(11px, .82vw, 13px);
    line-height: 1.2;
  }

  #game-preview .landing-gallery-card-subtitle {
    margin-top: 3px;
    font-size: 8px;
    letter-spacing: 0;
  }

  #game-preview .landing-gallery-card-arrow {
    width: 23px;
    height: 23px;
    flex: 0 0 23px;
    font-size: 15px;
  }
}

/* Once the gallery is a compact single row, do not stretch its framed
   showcase to fill the screen. Give unused vertical space back to the
   castle hero; the footer remains at the bottom of desktop viewports. */
@media (min-width: 1180px) and (min-height: 700px) {
  .auth-landing .landing-hero {
    flex: 1 1 auto;
  }
  .auth-landing .landing-showcase-area {
    flex: 0 0 auto;
  }
}

/* Installable PWA in the news list, not as a tiny footer action.
   This is a single actionable news card; the install prompt remains
   controlled by js/core/pwa.js and hidden on unsupported devices. */
#latest-news .landing-news-install:not([hidden]) {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 11px;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
#latest-news .landing-news-install:not([hidden]):hover {
  border-color: #c99a4b;
  background: linear-gradient(145deg,rgba(42,30,16,.99),rgba(8,11,13,.98));
}
#latest-news .landing-news-install:focus-visible {
  outline: 2px solid #ddb663;
  outline-offset: 2px;
}
#latest-news .landing-news-install .landing-news-art {
  min-height: 76px;
  background: linear-gradient(155deg,#564223,#171515 70%,#0d1414);
}
@media (min-width: 1180px) and (min-height: 700px) {
  #latest-news .landing-news-install:not([hidden]) {
    grid-template-columns: clamp(62px,5.1vw,92px) minmax(0,1fr) 17px;
    gap: clamp(8px,.8vw,15px);
    padding: clamp(8px,.75vw,12px);
  }
}
@media (max-width: 1150px) {
  #latest-news .landing-news-install:not([hidden]) {
    grid-template-columns: 75px minmax(0,1fr) 17px;
    gap: 9px;
  }
}
@media (max-width: 680px) {
  #latest-news .landing-news-install:not([hidden]) {
    grid-template-columns: 72px minmax(0,1fr) 16px;
    gap: 8px;
    padding: 9px;
  }
  #latest-news .landing-news-install .landing-news-art {
    min-height: 70px;
  }
}

/* PWA installation is a second, explicit action inside the news reader.
   The news entry and article choice only appear when installation is supported. */
[data-pwa-news-open][hidden],
[data-pwa-news-choice][hidden] {
  display: none !important;
}
.landing-news-dialog-install-action:not([hidden]) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  margin: 17px 0 2px;
  padding: 11px 19px;
  border: 1px solid rgba(219, 169, 76, .85);
  border-radius: 5px;
  background: linear-gradient(180deg, #714526, #3a2418);
  color: #ffedc8;
  font: 800 14px/1.3 Georgia, "Times New Roman", serif;
  letter-spacing: .035em;
  cursor: pointer;
  text-align: center;
}
.landing-news-dialog-install-action:hover:not(:disabled) {
  border-color: #f2cc78;
  background: linear-gradient(180deg, #8a552d, #51301d);
}
.landing-news-dialog-install-action:focus-visible {
  outline: 2px solid #f2cc78;
  outline-offset: 3px;
}
.landing-news-dialog-install-action:disabled {
  opacity: .55;
  cursor: default;
}
@media (max-width: 680px) {
  .landing-news-dialog-install-action:not([hidden]) {
    width: 100%;
    min-height: 48px;
  }
}
