/* SPEC-P4 5 – Touch- und Kleinbild-Layout. Keine reine Skalierung: --u bekommt eine Untergrenze (kleinste Designschrift 12–13
   wird so ≥ 11 CSS-px), Menüs und HUD füllen die ganze Fläche, Ziele sind ≥ 44 CSS-px. HUD-Maße hier bewusst in CSS-px. */

@media (pointer: coarse), (max-height: 520px), (max-width: 760px) {
  :root, #stage { --u: clamp(0.92px, calc(var(--ui-scale) * 1.4px), 1.15px); }

  html, body { overscroll-behavior: none; }

  #menus { left: 0; top: 0; width: 100%; height: 100%; font-size: calc(16 * var(--u)); }
  #hud { left: 0; top: 0; width: 100%; height: 100%; font-size: 13px; --hud-ox: var(--lb-x, 0px); --hud-oy: var(--lb-y, 0px); }

  /* ================================================================ Menüs: fließend, scrollbar, Safe-Area */
  .menu-layer {
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: max(4px, env(safe-area-inset-top)) max(4px, env(safe-area-inset-right)) max(4px, env(safe-area-inset-bottom)) max(4px, env(safe-area-inset-left));
  }
  html.aow-menu #stage::after { background: rgba(8, 10, 16, 0.62); }
  .menu-layer, .menu-layer * { touch-action: pan-x pan-y; }
  .menu-layer.is-ingame { background: rgba(8, 10, 16, 0.72); }
  .menu-layer input[type="range"] { touch-action: none; }

  .menu-panel {
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    flex: 1 0 auto;
    padding: 12px;
    border-radius: 10px;
  }
  .menu-screen { min-width: 0; }
  .menu-title { font-size: 22px; gap: 8px; }
  .menu-title .ico { width: 22px; height: 22px; }
  .menu-actions { flex-wrap: wrap; gap: 8px; margin-top: 12px; }
  .menu-actions .mbtn { flex: 1 1 auto; min-width: min(44%, 150px); }
  .menu-stack { width: min(100%, 420px); align-self: center; }
  .screen-pause, .screen-result { align-items: stretch; }
  .screen-pause .menu-stack { margin: 12px auto 0; }

  /* Bedienelemente: Mindestmaße */
  .mbtn { min-height: 44px; padding: 0 14px; font-size: 15px; gap: 8px; }
  .mbtn-lg { min-height: 48px; font-size: 16px; }
  .mbtn .ico { width: 20px; height: 20px; }
  .seg { min-height: 44px; min-width: 44px; padding: 0 10px; font-size: 13px; }
  .tab { min-height: 44px; min-width: 44px; padding: 0 10px; font-size: 13px; }
  .tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .tabs .tab { flex: none; }
  .switch { min-height: 44px; }
  .text-input { min-height: 44px; font-size: 16px; }
  .slider { min-height: 44px; }
  .credit-link, .credit-more { min-height: 44px; }

  .menu-credit {
    position: static;
    flex: none;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 6px;
    padding: 2px 6px 0;
    margin-top: auto;
    font-size: 12px;
    line-height: 1.2;
    text-align: center;
  }
  .menu-layer.is-ingame .menu-credit { background: none; border: 0; padding: 0 6px; }
  .menu-pause .menu-credit { display: none; }
  .credit-link.is-legal { padding: 0 8px; min-width: 44px; justify-content: center; }

  /* ---------------------------------------------------------------- Hauptmenü */
  .menu-main { padding-bottom: 0; }
  .screen-main {
    position: relative;
    inset: auto;
    flex: 1 0 auto;
    padding: 4px 8px;
    gap: 8px;
  }
  .mm-top { min-height: 44px; gap: 6px; width: 100%; }
  .mm-announce { top: 52px; max-width: calc(100% - 16px); font-size: 13px; padding: 0 2px 0 10px; border-radius: 8px; gap: 4px; }
  .mm-account { max-width: 30%; padding: 0 4px; }
  .mm-account > .ico { display: none; }
  .mm-guest { flex: 1 1 auto; min-height: 44px; padding: 4px 8px; gap: 8px; border-radius: 10px; }
  .mm-guest > .ico { width: 22px; height: 22px; }
  .mm-guest-text b { font-size: 13px; }
  .mm-guest-text small { font-size: 11px; line-height: 1.2; }
  .mm-guest-go { font-size: 20px; }
  .mm-icon { width: 44px; }
  .title-block { margin-top: 0; }
  .game-title { font-size: clamp(30px, 9.5vmin, 46px); letter-spacing: 0.03em; line-height: 1.05; }
  .game-subtitle { margin-top: 2px; font-size: clamp(12px, 3.6vmin, 15px); }
  .beta-tag { position: static; display: inline-block; font-size: 11px; padding: 3px 7px; margin: 2px 0; }
  .mm-play { width: 100%; max-width: 560px; gap: 6px; }
  .mm-playbtn { min-height: 56px; font-size: 24px; }
  .mm-playbtn .ico { width: 24px; height: 24px; }
  .mm-setup { font-size: 13px; }
  .mm-modes { gap: 6px; }
  .mm-modes .mbtn { padding: 0 4px; font-size: 14px; min-height: 46px; gap: 5px; }
  .mm-modes .mbtn .ico { width: 18px; height: 18px; }
  .mm-tabs { width: 100%; max-width: 760px; margin-bottom: 0; padding: 3px; gap: 2px; border-radius: 10px; }
  .mm-tab { min-height: 50px; gap: 2px; font-size: 11px; padding: 0 1px; }
  .mm-tab > .ico { width: 22px; height: 22px; }
  .mm-tab .menu-badge { top: 1px; right: 4px; }

  /* ---------------------------------------------------------------- Warlord-Auswahl */
  .screen-select { width: 100%; flex: 1 0 auto; gap: 8px; padding: 4px; }
  .wl-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .wl-card { min-height: 0; padding: 10px 8px; gap: 3px; }
  .wl-crest { height: auto; }
  .wl-crest .ico { width: 40px; height: 40px; }
  .wl-name { font-size: 17px; }
  .wl-title, .wl-sect, .wl-sect span { font-size: 12px; }
  .wl-sect b { font-size: 11px; }
  .wl-sect small { font-size: 11px; }
  .wl-check { width: 26px; height: 26px; top: 6px; right: 6px; }
  .diff-block { width: 100%; }
  .seg-diff { display: flex; width: 100%; }
  .seg-diff .seg { flex: 1; min-width: 0; font-size: 13px; padding: 0 4px; }
  .diff-label { font-size: 12px; }
  .diff-desc { font-size: 13px; }

  /* ---------------------------------------------------------------- Ergebnis */
  .screen-result { gap: 8px; }
  .result-title { font-size: 34px; }
  .result-sub { font-size: 14px; }
  .result-icon .ico { width: 34px; height: 34px; }
  .stats-table th, .stats-table td { font-size: 14px; padding: 5px 4px; }
  .row-score th, .row-score td { font-size: 15px; }
  .submit-row { flex-wrap: wrap; }
  .submit-row .field { flex: 1 1 180px; min-width: 0; }
  .result-note { font-size: 13px; padding: 8px 10px; }
  .result-invite small { font-size: 12px; text-align: center; }

  /* ---------------------------------------------------------------- Rangliste, Einstellungen */
  .screen-leaderboard { display: flex; flex-direction: column; }
  .lb-tabs { margin-top: 8px; }
  .lb-head th, .lb-table td { font-size: 12px; padding: 7px 3px; }
  .lb-body { max-height: none; overflow: visible; }
  .lb-table .c-wl, .lb-table .c-age, .lb-table .c-dur { display: none; }
  .set-row { flex-wrap: wrap; gap: 4px 10px; min-height: 44px; padding: 4px 0; }
  .set-label { font-size: 14px; }
  .set-ctrl { flex: 1 1 auto; justify-content: flex-end; min-width: 0; }
  .slider-wrap { width: min(100%, 300px); }
  .set-mini { min-height: 44px; }

  /* ---------------------------------------------------------------- Bereichs-Screens: fließen, Ebene scrollt als Ganzes */
  .screen-market, .screen-profile, .screen-inventory, .screen-expedition, .screen-campaign, .screen-duel, .screen-leaderboard, .screen-settings { gap: 8px; }
  .mk-body, .pf-body, .inv-gear-body, .inv-grid-wrap, .cp-body, .exp-lb-body, .inv-body, .inv-cols, .inv-card {
    flex: none;
    height: auto;
    max-height: none;
    overflow: visible;
    min-height: 0;
    scrollbar-gutter: auto;
    padding-right: 0;
  }
  .inv-cols, .pf-cols { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .mk-head, .cp-head, .duel-head { flex-wrap: wrap; gap: 6px; }
  .mk-head .menu-title, .cp-title { font-size: 24px; }
  .mk-wallet { margin-left: 0; flex-wrap: wrap; gap: 4px; }
  .wallet { min-height: 30px; padding: 0 8px 0 5px; gap: 4px; }
  .wallet .ico { width: 18px; height: 18px; }
  .wallet b { font-size: 14px; }
  .wallet small { font-size: 11px; letter-spacing: 0.02em; }
  .mk-tabs .tab { min-height: 44px; padding: 0 12px; font-size: 14px; }
  .mk-cards, .dyn-grid, .stance-cards, .pf-wls, .cp-missions, .exp-wls, .item-choice, .cp-unlocks {
    grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr));
    gap: 6px;
  }
  .mk-card { padding: 6px; gap: 5px; }
  .mk-buy, .dyn-buy, .cp-start, .cp-unlock-btn { min-height: 44px; }
  .pf-card { padding: 10px; gap: 8px; }
  .pf-name { flex-wrap: wrap; }
  .pf-name .field { flex: 1 1 160px; min-width: 0; }
  .pf-league-icon { width: 56px; height: 56px; flex: none; }
  .pf-league-icon .ico { width: 32px; height: 32px; }
  .pf-league-name { font-size: 20px; }
  .pf-cap { flex-wrap: wrap; }
  .pf-stat-grid { gap: 4px 12px; }
  .pf-stat-grid dt { font-size: 13px; }
  .stance-card { min-height: 44px; }
  .pf-wl { min-width: 44px; min-height: 44px; }
  .field-label { font-size: 12px; }
  .inv-card { padding: 8px; gap: 6px; }
  .inv-h { font-size: 19px; flex-wrap: wrap; gap: 6px; }
  .inv-row { gap: 6px; }
  .inv-row-label { width: 84px; font-size: 12px; gap: 4px; }
  .inv-row-label .ico { width: 20px; height: 20px; }
  .inv-slots { gap: 4px; flex-wrap: wrap; }
  .inv-slot { width: 70px; height: 70px; }
  .inv-slot small, .inv-slot.is-empty small, .inv-filter-label, .inv-slot-lv { font-size: 11px; letter-spacing: 0.02em; }
  .inv-card .item-card small, .cp-ch.is-locked .cp-ch-sub { font-size: 11px; }
  .cp-chapters { flex-wrap: nowrap; overflow-x: auto; }
  .cp-ch { flex: none; min-height: 44px; min-width: 120px; }
  .cp-intro { flex-wrap: wrap; gap: 8px; padding: 8px; }
  .cp-intro-title { font-size: 18px; }
  .cp-intro-body { font-size: 13px; }
  .cp-card { padding: 8px; gap: 5px; }
  .cp-keys { display: none; }
  .cp-card-foot { flex-wrap: wrap; gap: 4px; }
  .cp-start { flex: 1 1 100%; padding: 0 6px; }
  .inv-filter { flex-wrap: wrap; gap: 4px; max-width: 100%; }
  .inv-seg { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .inv-seg .seg { flex: none; }
  .exp-ramp, .exp-ramp .segmented { max-width: 100%; }
  .exp-ramp .seg, .exp-start .segmented .seg { flex: 1 1 0; min-width: 0; padding: 0 3px; font-size: 12px; }
  .cp-tl-label, .cp-tl-label span, .cp-ch-num, .cp-ch-sub, .cp-tag, .cp-mod { font-size: 11px; }
  .duel-hint { font-size: 13px; }
  .exp-start-cta .mbtn { min-width: 0; width: 100%; }
  .exp-path { grid-template-columns: repeat(5, minmax(0, 1fr)); row-gap: 4px; }
  .acc { width: 100%; }

  /* ---------------------------------------------------------------- Pause */
  .pause-rotate { display: none; }

  .item-loot-box { position: static; width: 100%; max-width: 420px; margin: 0 auto; transform: none; }

  /* Replay-Leiste */
  .replay-bar { left: max(4px, env(safe-area-inset-left)); right: max(4px, env(safe-area-inset-right)); width: auto; max-width: none; transform: none; bottom: max(2px, env(safe-area-inset-bottom)); min-height: 0; font-size: 12px; }
  .replay-bar button { min-width: 44px; min-height: 44px; font-size: 13px; }

  /* ================================================================ HUD im Spiel */
  #hud { --bar-h: 46px; --bottom-h: 70px; --pad-l: max(4px, env(safe-area-inset-left)); --pad-r: max(4px, env(safe-area-inset-right)); }
  .hud-panel { border-radius: 8px; }
  .hud-root kbd { display: none; }

  /* Oben: Gold, XP, Weiterentwickeln | Zeit | Gegner, System */
  .hud-top { top: 2px; left: var(--pad-l); right: var(--pad-r); height: var(--bar-h); gap: 4px; }
  .hud-econ { gap: 6px; padding: 0 2px 0 6px; min-width: 0; }
  .hud-myage { display: none; }
  .hud-gold { min-width: 66px; padding: 0; gap: 3px; }
  .hud-gold .ico { width: 18px; height: 18px; }
  .hud-gold-val { font-size: 17px; }
  .hud-xp { gap: 3px; min-width: 0; }
  .hud-xp .ico-xp { display: none; }
  .hud-agecap { display: none; }
  .bar-xp { width: clamp(62px, 13vw, 130px); height: 16px; }
  .bar-text { font-size: 11px; }
  .btn-evolve { width: 42px; height: 42px; padding: 0; min-width: 44px; }
  .btn-evolve span { display: none; }
  .btn-evolve .ico { width: 24px; height: 24px; }
  .hud-timer { position: static; transform: none; height: auto; padding: 0 6px; font-size: 15px; gap: 3px; flex: none; }
  .hud-timer .ico { display: none; }
  .hud-right { gap: 4px; }
  .hud-enemy { padding: 0 4px; gap: 3px; }
  .hud-enemy-text { display: none; }
  .hud-enemy-crest .ico { width: 22px; height: 22px; }
  .hud-enemy-age { width: 26px; height: 26px; }
  .hud-enemy-age .ico { width: 16px; height: 16px; }
  .hud-sys { gap: 1px; padding: 0 1px; }
  .hud-sys .btn-icon { width: 44px; height: 44px; }
  .btn-icon .ico { width: 22px; height: 22px; }
  .hud-fps { min-width: 44px; font-size: 11px; padding: 0 2px; }

  /* Basis-HP */
  .hud-bases { top: calc(var(--bar-h) + 4px); left: var(--pad-l); right: var(--pad-r); gap: 8px; pointer-events: none; }
  .basebar { flex: 0 1 44%; min-width: 0; padding: 1px 6px; gap: 4px; border-radius: 6px; }
  .basebar > .ico { width: 12px; height: 12px; }
  .basebar .bar-base { flex: 1; width: auto; min-width: 0; height: 10px; }
  .basebar-num { min-width: 0; font-size: 11px; white-space: nowrap; }

  .hud-notices { top: calc(var(--bar-h) + 24px); }
  .hud-root.is-autopilot .hud-notices { top: calc(var(--bar-h) + 72px); }
  .hud-storm { padding: 3px 8px; gap: 6px; }
  .hud-storm .ico { width: 18px; height: 18px; }
  .hud-storm-text b { font-size: 13px; }
  .hud-storm-text small { font-size: 11px; }
  .hud-toast { font-size: 13px; padding: 5px 10px; max-width: 86vw; }
  .hud-autopilot { top: calc(var(--bar-h) + 24px); min-height: 44px; padding: 3px 10px; gap: 6px; left: 50%; transform: translateX(-50%); }
  .hud-autopilot-text b { font-size: 13px; }
  .hud-autopilot-text small { font-size: 11px; }
  .hud-autopilot-ico { width: 26px; height: 26px; }
  .hud-boss { top: calc(var(--bar-h) + 66px); font-size: 12px; }

  /* Unten: Einheiten | Türme, Schmiede | Spezial, Fähigkeit; Warteschlange und Item-Knöpfe schweben darüber */
  .hud-bottom {
    left: var(--pad-l);
    right: var(--pad-r);
    bottom: max(2px, env(safe-area-inset-bottom));
    height: var(--bottom-h);
    gap: 3px;
    align-items: stretch;
  }
  .hud-warlord { display: none; }
  .hud-army { position: static; flex: 1 1 auto; padding: 2px; gap: 0; background: var(--panel); }
  .unit-cards { width: 100%; height: 100%; gap: 3px; }
  .unit-card { flex: 1 1 0; width: auto; min-width: 44px; height: 100%; border-radius: 8px; }
  .unit-card:hover { transform: none; }
  .unit-role { top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 4px; }
  .unit-role .ico { width: 13px; height: 13px; }
  .unit-thumb { top: 1px; left: 14px; right: 2px; bottom: 25px; height: auto; }
  .unit-thumb .ico { width: 28px; height: 28px; }
  .unit-name { bottom: 13px; left: 1px; right: 1px; font-size: 11px; line-height: 12px; }
  .unit-card .unit-cost { bottom: 1px; font-size: 12px; gap: 2px; }
  .unit-card .unit-cost .ico { width: 11px; height: 11px; }

  .queue { position: absolute; left: var(--pad-l); bottom: calc(var(--bottom-h) + 4px); padding: 0; gap: 0; background: transparent; }
  .queue-label { display: none; }
  .queue-slots { gap: 2px; }
  .q-slot { width: 44px; height: 44px; padding: 3px; border-radius: 7px; }
  .q-slot:not(.is-filled) { display: none; }
  .q-ico .ico { width: 26px; height: 26px; }
  .q-bar { left: 3px; right: 3px; bottom: 2px; height: 4px; }

  .hud-towers, .hud-forge { position: static; width: 56px; padding: 2px; flex: none; }
  .btn-towers, .btn-forge { position: relative; flex: 1; width: 100%; height: 100%; gap: 1px; padding: 0; border-radius: 8px; }
  .btn-towers .ico-tower, .btn-forge .ico-forge { width: 26px; height: 26px; }
  .btn-towers-label { font-size: 11px; letter-spacing: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
  .slot-dots, .forge-dots, .slot-text { display: none; }
  .btn-towers .slot-text { display: inline; position: absolute; top: 2px; right: 3px; font-size: 11px; color: var(--gold-hi); }

  .hud-powers { gap: 3px; padding: 2px 3px; flex: none; }
  .power-wrap { width: auto; gap: 0; }
  .power { width: 62px; height: 62px; border-width: 2px; }
  .power-ico .ico { width: 30px; height: 30px; }
  .power-cd { font-size: 18px; }
  .power-label { display: none; }

  .hud-items {
    position: absolute;
    right: var(--pad-r);
    bottom: calc(var(--bottom-h) + 4px);
    width: auto;
    display: flex !important;
    gap: 3px;
    padding: 2px;
  }
  .hud-items[hidden] { display: none !important; }
  .hud-items .power-item { width: 46px; height: 46px; border-width: 2px; }
  .hud-items .power-item .power-ico .ico { width: 24px; height: 24px; }
  .hud-items .power-item .power-cd { font-size: 15px; }

  /* Popover als Blatt über der unteren Leiste */
  .tower-pop, .forge-pop {
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(100% + 3px);
    width: auto;
    max-width: 680px;
    max-height: calc(var(--app-h, 100dvh) - var(--bottom-h) - 8px - env(safe-area-inset-bottom));
    margin: 0 auto;
    padding: 6px 8px;
    gap: 6px;
    overflow-y: auto;
    touch-action: pan-y;
    overscroll-behavior: contain;
  }
  .tower-pop *, .forge-pop * { touch-action: pan-y; }
  .tower-pop::after, .forge-pop::after { display: none; }
  .forge-rows { gap: 4px; }
  .forge-row { padding: 3px 6px; gap: 6px; }
  .forge-role { width: 36px; height: 36px; }
  .forge-up, .btn-repair { min-height: 44px; }
  .pop-title { font-size: 15px; gap: 6px; }
  .pop-title .ico { width: 18px; height: 18px; }
  .btn-close { width: 44px; height: 44px; }
  .tower-cards { gap: 6px; }
  .tower-card { min-height: 88px; padding: 3px; gap: 2px; }
  .tower-card-thumb { height: 40px; }
  .tower-card-name, .tower-card-stats { font-size: 11px; }
  .pop-foot { flex-wrap: wrap; gap: 6px; }
  .btn-buyslot { min-height: 44px; font-size: 12px; padding: 0 8px; }
  .slot-pick { min-height: 60px; font-size: 11px; }
  .pop-note { font-size: 12px; }
  .sell-pop { min-width: 170px; padding: 4px 6px; }
  .sell-head { font-size: 13px; }
  .btn-sell { min-height: 44px; font-size: 14px; }

  /* Weiche */
  .hud-root > .choice-layer, #hud.hud-root > .choice-layer { top: 2px; bottom: 2px; left: var(--pad-l); right: var(--pad-r); overflow-y: auto; touch-action: pan-y; align-items: flex-start; }
  .choice-pop { width: 100%; max-width: 760px; padding: 8px; gap: 6px; pointer-events: auto; }
  .choice-pop, .choice-pop * { touch-action: pan-y; }
  .choice-title { font-size: 17px; }
  .choice-sub, .choice-auto { font-size: 12px; min-width: 0; }
  .choice-cards { gap: 6px; }
  .choice-card { padding: 6px; gap: 4px; min-height: 44px; }
  .choice-age { font-size: 16px; gap: 6px; }
  .choice-age .ico { width: 22px; height: 22px; }
  .choice-tl { font-size: 11px; }
  .choice-units { display: none; }
  .choice-desc { font-size: 12px; line-height: 1.25; }

  /* Tooltip, Tutorial */
  .hud-tip { font-size: 12px; padding: 6px 8px; max-width: min(320px, 90vw); }
  .tip-title { font-size: 13px; }
  .tip-stats, .tip-body, .tip-sub, .tip-dim, .tip-good, .tip-bad, .tip-section { font-size: 12px; }
  .tut-bubble { width: min(330px, 86vw); padding: 7px 9px; border-width: 1px; }
  .tut-bubble p { font-size: 13px; line-height: 1.25; }
  .tut-row { margin-top: 3px; }
  .tut-row small { font-size: 11px; }
  .tut-btn { min-height: 44px; font-size: 13px; padding: 0 10px; }
}

/* Flache Querformate: Hauptmenü zweispaltig, damit alles ohne Scrollen passt */
@media (pointer: coarse) and (orientation: landscape) and (max-height: 520px), (orientation: landscape) and (max-height: 520px) {
  .screen-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
    grid-template-rows: auto minmax(0, 1fr) auto;
    grid-template-areas: 'top top' 'title play' 'tabs tabs';
    gap: 4px 10px;
    align-items: center;
    justify-items: center;
    min-height: 0;
  }
  .mm-top { grid-area: top; }
  /* Über dem Titel in der linken Spalte, damit „Spielen“ frei bleibt */
  .mm-announce { left: 12px; top: 54px; transform: none; max-width: calc(44% - 12px); }
  .title-block { grid-area: title; }
  .mm-play { grid-area: play; }
  .mm-tabs { grid-area: tabs; max-width: none; }
  .wl-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .wl-sect { display: none; }
  .wl-card { padding: 6px 4px; }
  .wl-crest .ico { width: 30px; height: 30px; }
  .wl-name { font-size: 14px; }
}

/* Hochformat: Hauptmenü untereinander, Tab-Leiste in zwei Reihen; Rotate-Hinweis im Pause-Screen */
@media (orientation: portrait) and (max-width: 900px) {
  .menu-layer.is-ingame { background: #0b0d14; }
  .screen-main { justify-content: flex-start; gap: 16px; padding-top: 8px; }
  .mm-top { flex-wrap: wrap; justify-content: space-between; }
  .mm-account { max-width: 50%; }
  .mm-guest { order: 5; flex: 1 0 100%; padding: 8px 12px; }
  .mm-guest-text b { font-size: 15px; }
  .mm-guest-text small { font-size: 12px; }
  .title-block { margin-top: auto; }
  .game-title { font-size: clamp(38px, 13vw, 64px); }
  .game-subtitle { font-size: 14px; margin-top: 6px; }
  .mm-play { gap: 10px; }
  .mm-playbtn { min-height: 72px; font-size: 30px; }
  .mm-modes .mbtn { min-height: 54px; }
  .wallet small { display: none; }
  .mm-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; margin-bottom: auto; padding: 5px; }
  .mm-tab { min-height: 62px; font-size: 12px; gap: 4px; }
  .mm-tab > .ico { width: 26px; height: 26px; }
  .mm-tab .menu-badge { right: 16%; }
  .menu-pause .pause-rotate {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 12px 0 4px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(230, 180, 34, 0.14);
    border: 1px solid var(--gold);
    font: 600 14px / 1.3 var(--font-body);
    color: var(--gold-hi);
  }
  .pause-rotate-ico {
    flex: none;
    width: 24px;
    height: 38px;
    border: 3px solid var(--gold-hi);
    border-radius: 5px;
    animation: rotate-phone 2.2s ease-in-out infinite;
  }
}
@keyframes rotate-phone {
  0%, 25% { transform: rotate(0deg); }
  60%, 100% { transform: rotate(90deg); }
}
@media (prefers-reduced-motion: reduce) {
  .pause-rotate-ico { animation: none; transform: rotate(90deg); }
}