/* Desktop layout. Keep this after legacy styles; phone rules remain in V168. */
@media (min-width: 781px) {
    body.game-body.travian-game-ui {
        --pro-shell-max: 1360px;
        --pro-content-max: 1040px;
        --game-header-height: 82px;
        --game-bottom-nav-height: 0px;
        --window-top: calc(var(--game-header-height) + var(--game-notice-space, 0px) + 12px);
        --window-bottom: 12px;
        --window-space: calc(100dvh - var(--window-top) - var(--window-bottom));
        --realm-ratio: calc(16 / 9);
        --realm-width: min(1200px, calc(100vw - 32px), calc((100dvh - var(--game-header-height) - var(--game-notice-space, 0px) - 24px) * var(--realm-ratio)));
        --realm-height: calc(var(--realm-width) / var(--realm-ratio));
        background: radial-gradient(ellipse at 50% 20%, #28372b, #101c18 80%) !important;
        font-size: 15px;
    }
    body.game-body.travian-game-ui.has-village-switcher { --game-header-height: 122px; }
    body.game-body.travian-game-ui .game-header {
        width: min(1360px, 100%); max-width: 1360px;
        height: var(--game-header-height); margin-inline: auto;
    }
    body.game-body.travian-game-ui .game-header-inner {
        display: grid; grid-template-columns: 132px 260px minmax(0, 1fr) auto;
        align-items: center; gap: 8px; width: 100%; max-width: none;
        height: 80px !important; padding: 7px 10px; box-sizing: border-box;
    }
    body.game-body.travian-game-ui .game-header .compact-brand { display: flex; gap: 5px; }
    body.game-body.travian-game-ui .compact-brand > span:last-child { display: block; }
    body.game-body.travian-game-ui .compact-brand strong { font-size: 15px; }
    body.game-body.travian-game-ui .header-game-nav { display: flex; gap: 3px; min-width: 0; }
    body.game-body.travian-game-ui .header-game-nav .nav-item { display: flex; flex-direction: column; min-width: 0; flex: 1; padding: 4px 3px; }
    body.game-body.travian-game-ui .header-game-nav .nav-art,
    body.game-body.travian-game-ui .header-game-nav .nav-art img { width: 32px; height: 32px; }
    body.game-body.travian-game-ui .header-game-nav .nav-item > b { display: block; font-size: 11px; line-height: 1.3; }
    body.game-body.travian-game-ui .game-header .resource-bar { min-width: 0; gap: 5px; padding: 0; grid-column: auto; }
    body.game-body.travian-game-ui .game-header .resource-item {
        height: 60px; min-height: 60px; min-width: 0;
        grid-template-columns: 28px minmax(0, 1fr); gap: 3px; padding: 5px 4px 7px;
    }
    body.game-body.travian-game-ui .game-header .resource-symbol { width: 28px; height: 30px; }
    body.game-body.travian-game-ui .game-header .resource-copy { min-width: 0; }
    body.game-body.travian-game-ui .game-header .resource-copy strong { font-size: 14px; line-height: 1.25; font-variant-numeric: tabular-nums; }
    body.game-body.travian-game-ui .game-header .resource-copy small { font-size: 10px; line-height: 1.3; }
    body.game-body.travian-game-ui .game-header .header-actions { display: flex; grid-column: auto; gap: 4px; align-items: center; }
    body.game-body.travian-game-ui .game-header .header-actions .header-icon { width: 36px; min-width: 36px; height: 40px; }
    body.game-body.travian-game-ui .game-header .header-actions .header-icon img { width: 30px; height: 30px; }
    body.game-body.travian-game-ui .game-header .player-pill { display: flex; min-width: 0; max-width: 96px; }
    body.game-body.travian-game-ui .game-header .player-pill > span { max-width: 55px; overflow: hidden; text-overflow: ellipsis; }
    body.game-body.travian-game-ui .village-switch-bar { height: 40px; min-height: 40px; max-width: none; font-size: 14px; }
    body.game-body.travian-game-ui .village-switch-bar strong { font-size: 15px; }
    body.game-body.travian-game-ui .village-switch-bar small { font-size: 13px; }

    /* The artwork and every click target use the SAME proportional rectangle. */
    body.game-body.travian-game-ui.game-page-immersive:is(.game-route-city, .game-route-village) .game-content-immersive {
        position: relative; inset: auto; width: var(--realm-width) !important;
        max-width: 1280px !important; height: var(--realm-height) !important;
        min-width: 0 !important; min-height: 0 !important;
        margin: calc(12px + var(--game-notice-space, 0px)) auto 12px !important;
        padding: 0 !important; aspect-ratio: var(--realm-ratio) !important;
        border: 0; border-radius: 6px; box-sizing: border-box; overflow: hidden;
        outline: 1px solid #88744e;
    }
    body.game-body.travian-game-ui.game-page-immersive :is(.realm-screen, .realm-workspace, .realm-map-panel, .realm-map) {
        width: 100% !important; height: 100% !important; min-width: 0 !important;
        min-height: 0 !important; max-height: none !important; margin: 0 !important;
        padding: 0 !important; border: 0 !important;
    }
    body.game-body.travian-game-ui.game-page-immersive .realm-map-background {
        position: absolute; inset: 0; width: 100% !important; height: 100% !important;
        object-fit: contain !important; object-position: center; transform: none !important;
    }
    body.game-body.travian-game-ui .game-shell {
        width: min(1360px, calc(100% - 24px)) !important; max-width: 1360px !important;
        min-height: 0; background: transparent !important; border: 0; box-shadow: none;
    }
    body.game-body.travian-game-ui.game-page-section .game-content {
        background: transparent !important; border: 0 !important; box-shadow: none !important;
    }
    body.game-body.travian-game-ui.game-page-section .game-content::before,
    body.game-body.travian-game-ui.game-page-section .game-content::after,
    body.game-body.travian-game-ui .game-window-stage::before { display: none; }
    body.game-body.travian-game-ui .game-window-stage {
        top: var(--window-top); bottom: auto; left: 0; right: 0;
        width: min(1280px, calc(100% - 24px)); height: var(--window-space);
        margin-inline: auto; padding: 0; align-items: flex-start;
    }
    body.game-body.travian-game-ui .game-window-stage > .game-window {
        width: min(1040px, 100%) !important; max-width: 1040px !important;
        max-height: var(--window-space) !important;
    }
    body.game-body.travian-game-ui .game-window-stage > .world-window { width: 100% !important; max-width: 1280px !important; }
    body.game-body.travian-game-ui .game-window-stage > .construction-window { width: min(820px, 100%) !important; max-width: 820px !important; }
    body.game-body.travian-game-ui .game-popup { width: min(1040px, calc(100vw - 32px)); max-width: 1040px; }
    body.game-body.travian-game-ui .game-popup:has(.world-window) { width: min(1280px, calc(100vw - 32px)); max-width: 1280px; }
    body.game-body.travian-game-ui .game-popup:has(.construction-window) { width: min(820px, calc(100vw - 32px)); }
    body.game-body.travian-game-ui .game-window > .window-heading { min-height: 48px; }
    body.game-body.travian-game-ui .game-window > .window-heading h1 { font-size: 24px; line-height: 1.2; }
    body.game-body.travian-game-ui .game-window .window-close { width: 40px; height: 40px; min-width: 40px; min-height: 40px; flex-basis: 40px; }
    body.game-body.travian-game-ui .window-body { font-size: 15px; }
    body.game-body.travian-game-ui .map98-window .map97-toolbar { gap: 8px; height: 42px; }
    body.game-body.travian-game-ui .map98-window .map97-toolbar .world-search { flex: 0 1 420px; }
    body.game-body.travian-game-ui .map98-window .map97-toolbar .world-search label { font-size: 13px; }
    body.game-body.travian-game-ui .map98-window .map97-toolbar .world-search input { font-size: 17px; height: 40px; }
    body.game-body.travian-game-ui .map98-window :is(.map97-tool, .map97-toolbar .world-search button) { width: 40px; height: 40px; min-height: 40px; }
    body.game-body.travian-game-ui .map98-window .map97-footer { font-size: 13px; min-height: 28px; }
    body.game-body.travian-game-ui .map98-window .map100-oasis .world-animals > div { font-size: 14px; min-height: 45px; }
    body.game-body.travian-game-ui .map98-window .map100-oasis-actions .button { font-size: 14px; }

    /* Desktop chat shares the game frame; its history alone scrolls. */
    body.game-body.travian-game-ui:not(.keyboard-visible) #game-popup:has(.chat-v156),
    body.game-body.travian-game-ui:not(.keyboard-visible) .game-window-stage:has(> .chat-v156) {
        inset: var(--window-top) 0 auto !important; margin: 0 auto !important;
        width: min(1000px, calc(100vw - 32px)) !important; max-width: 1000px !important;
        height: var(--desktop-chat-height) !important; max-height: var(--desktop-chat-height) !important;
        --desktop-chat-height: calc(100dvh - var(--window-top) - 12px);
        --window-space: var(--desktop-chat-height);
        z-index: 60; border-radius: 6px;
    }
    body.game-body.travian-game-ui .game-window-stage > .game-window.chat-v156,
    body.game-body.travian-game-ui #game-popup.game-popup .game-window.chat-v156 { padding: 7px !important; border-radius: 6px !important; }
    body.game-body.travian-game-ui .chat-v156 .world-chat-messages { padding-inline: 18px; }
    body.game-body.travian-game-ui .chat-v156 .world-message { padding-block: 8px; }
    body.game-body.travian-game-ui .chat-v156 .world-message p { font-size: 15px; line-height: 1.5; }
    body.game-body.travian-game-ui .chat-v156 .chat-toolbar { padding: 7px 16px; font-size: 13px; }

    body.game-body.travian-game-ui .game-more-layer { padding: 12px; align-items: center; }
    body.game-body.travian-game-ui .game-more-drawer { width: min(460px, calc(100vw - 32px)); max-width: 460px; max-height: calc(100dvh - 24px) !important; padding: 8px; }
    body.game-body.travian-game-ui .game-more-drawer > header { min-height: 46px; }
    body.game-body.travian-game-ui .game-more-drawer > header h2 { font-size: 24px; }
    body.game-body.travian-game-ui .game-more-links > a { min-height: 36px; padding: 4px 8px; grid-template-columns: 28px minmax(0, 1fr); }
    body.game-body.travian-game-ui .game-more-links strong { font-size: 15px; }
    body.game-body.travian-game-ui .game-more-links > a > i,
    body.game-body.travian-game-ui .game-more-links > a > i img { width: 28px; height: 28px; }

    /* Forms retain their readable size, including after focus or a resize. */
    body.public-portal .public-workspace { overflow-y: auto !important; }
    body.public-portal .auth-main { height: auto; min-height: min-content; flex: 1 0 auto; }
    body.public-portal .auth-main > .site-container { height: auto; min-height: 100%; padding-block: 20px; align-items: center; justify-content: center; }
    body.public-portal .public-fitted { transform: none !important; }
    body.public-portal.guest-page-login .login-stage { max-width: 1120px; padding-inline: 24px; justify-content: center; }
    body.public-portal.guest-page-login .auth-card { width: min(480px, 100%); flex-shrink: 0; margin-block: auto; }
    body.public-portal .auth-card input { font-size: 16px; min-height: 44px; }
    body.public-portal .public-footer { font-size: 13px; }
}
@media (min-width: 781px) and (max-width: 1279px) {
    body.game-body.travian-game-ui { --game-header-height: 130px; }
    body.game-body.travian-game-ui.has-village-switcher { --game-header-height: 170px; }
    body.game-body.travian-game-ui .game-header-inner { grid-template-columns: 135px minmax(0, 1fr) auto; grid-template-rows: 60px 46px; gap: 8px; height: 128px !important; }
    body.game-body.travian-game-ui .game-header .compact-brand { grid-column: 1; grid-row: 1; }
    body.game-body.travian-game-ui .game-header .resource-bar { grid-column: 2 / 4; grid-row: 1; }
    body.game-body.travian-game-ui .header-game-nav { grid-column: 1 / 3; grid-row: 2; justify-self: start; width: 420px; }
    body.game-body.travian-game-ui .header-game-nav .nav-item { flex-direction: row; align-items: center; justify-content: center; min-height: 42px; height: 42px; gap: 4px; }
    body.game-body.travian-game-ui .header-game-nav .nav-art,
    body.game-body.travian-game-ui .header-game-nav .nav-art img { width: 26px; height: 26px; }
    body.game-body.travian-game-ui .game-header .header-actions { grid-column: 3; grid-row: 2; }
    body.game-body.travian-game-ui .game-header .resource-copy strong { font-size: 16px; }
}
@media (min-width: 781px) and (max-height: 740px) {
    body.game-body.travian-game-ui .game-more-links > a { min-height: 32px; padding-block: 2px; }
}

/* The public desktop page flows naturally; no whole-page scaling. */
@media (min-width: 850px) {
    html:has(.portal-board), body:has(> .portal-board) { height: auto; min-height: 100%; overflow-x: hidden; overflow-y: auto; overscroll-behavior-y: auto; }
    body:has(> .portal-board) { min-height: 100dvh; }
    .portal-board {
        position: relative; inset: auto; width: min(1360px, 100%); height: auto;
        min-height: 100dvh; margin: 0 auto; transform: none;
        display: flex; flex-direction: column; overflow: visible;
    }
    .portal-header { min-height: 76px; padding: 12px 24px; gap: 16px; flex-wrap: wrap; }
    .portal-header .portal-brand { font-size: 27px; }
    .portal-header .portal-nav { gap: 16px; flex-wrap: wrap; }
    .portal-header .portal-nav :is(a, button) { font-size: 12px; padding-block: 9px; }
    .portal-main { display: flex; flex-direction: column; gap: 24px; overflow: visible; padding-bottom: 28px; }
    .portal-inset { margin-inline: 28px; }
    .portal-hero { min-height: 490px; flex-shrink: 0; }
    .portal-hero .hero-copy { display: flex; flex-direction: column; align-items: flex-start; text-align: left; height: auto; width: 54%; max-width: 680px; padding: 36px 0 36px 32px; gap: 16px; }
    .portal-hero .hero-copy > h1 { font-size: clamp(32px, 3.3vw, 45px) !important; line-height: 1.1; white-space: normal; }
    .portal-hero .hero-copy > p { font-size: 16px; line-height: 1.5; }
    .portal-hero .hero-eyebrow { display: block; font-size: 11px; }
    .portal-hero .hero-actions .portal-button { font-size: 15px; min-height: 44px; }
    .portal-hero .server-scroll { width: 460px; max-width: 100%; align-self: flex-start; }
    .portal-hero .server-metrics b { font-size: 30px; }
    .portal-hero .server-metrics small, .portal-hero .server-deadline, .portal-hero .server-next-start { font-size: 12px; }
    .feature-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
    .feature-grid .feature-card { min-height: 180px; }
    .feature-grid .feature-card > img { height: 112px; min-height: 112px; flex: none; object-fit: cover; }
    .feature-grid .card-copy { padding: 12px 9px; gap: 7px; flex: 1; }
    .feature-grid .card-copy strong { font-size: 15px; }
    .feature-grid .card-copy > span { font-size: 13px; line-height: 1.4; }
    .tribes-section .ornate-heading { height: auto; margin-bottom: 18px; }
    .tribes-section .ornate-heading h2 { font-size: 23px; }
    .tribes-section .tribe-grid { gap: 12px; }
    .tribes-section .tribe-card { height: auto; min-height: 174px; overflow: visible; }
    .tribes-section .tribe-visual { flex: none; height: 96px; }
    .tribes-section .tribe-medallion { height: 90px; max-height: 90px; }
    .tribes-section .tribe-card > strong { font-size: 14px; padding: 6px 8px; }
    .tribes-section .tribe-brief { display: block; height: auto; font-size: 13px; line-height: 1.4; margin-top: 9px; overflow: visible; }
    .campaign-grid { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr); gap: 18px; min-height: 225px; }
    .campaign-grid .campaign-heading { font-size: 19px; padding-bottom: 12px; }
    .campaign-grid .weather-card { min-height: 156px; }
    .campaign-grid .weather-card strong { font-size: 14px; }
    .campaign-grid .weather-card > span > span { font-size: 12px; line-height: 1.4; }
    .campaign-grid .stage-link { height: auto; min-height: 32px; font-size: 12px; }
    .campaign-grid .aztec-copy strong { font-size: 25px; }
    .campaign-grid .aztec-copy > span { font-size: 14px; line-height: 1.4; }
    .campaign-grid .victory-card { padding: 10px; }
    .campaign-grid .victory-card strong { font-size: 12px; }
    .campaign-grid .victory-card > span > span { display: block; font-size: 12px; line-height: 1.4; }
    .portal-footer { min-height: 64px; height: auto; padding: 16px 24px; gap: 12px; flex-wrap: wrap; }
    .portal-footer nav { flex-wrap: wrap; gap: 14px; }
    .portal-footer nav a, .portal-footer .footer-promise { font-size: 12px; }
}
@media (min-width: 850px) and (max-width: 1100px) {
    .portal-header .portal-nav { order: 3; width: 100%; justify-content: space-between; margin: 0; }
    .portal-hero .hero-copy { width: 65%; }
    .feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tribes-section .tribe-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 22px; }
    .campaign-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .campaign-grid .campaign-seasons { grid-column: 1 / -1; }
}
