/* Shared iPhone and Android refinements.
   This file loads after mob.css so mobile interaction rules have one predictable final cascade. */

@media (pointer: coarse) {
  button,
  .btn,
  details > summary {
    min-height: 44px;
    touch-action: manipulation;
  }

  input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
  select,
  textarea {
    min-height: 44px;
    font-size: 16px;
  }

  input[type="checkbox"],
  input[type="radio"] {
    width: 20px;
    min-width: 20px;
    height: 20px;
    padding: 0;
  }

  .check-line,
  .confirm-unsafe {
    min-height: 44px;
    padding-block: .35rem;
  }

  .daily-actions button,
  .qty-presets button,
  .claim-actions button,
  .row-actions button,
  .building-actions button,
  .rule-jump > summary,
  .review-def > summary,
  .review-cohort,
  .spot-shell > summary {
    min-height: 44px;
  }
}

@media (max-width: 640px),
       (max-width: 1024px) and (max-height: 500px) and (pointer: coarse) {
  html {
    max-width: 100%;
    overflow-x: clip;
  }

  body,
  main,
  .panel {
    min-width: 0;
    max-width: 100%;
  }

  /* Own wide data locally. A table can scroll inside its panel without dragging the entire page. */
  .panel:has(table),
  .table-wrap {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  /* Turn unlabelled horizontal action ribbons into a stable, thumb-friendly button grid. */
  .command-toolbar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
  }

  .command-toolbar > *,
  .command-toolbar form,
  .command-toolbar :is(button, .btn) {
    min-width: 0;
    width: 100%;
  }

  .command-toolbar > .dim {
    grid-column: 1 / -1;
    width: auto;
  }

  .segmented-tabs,
  .game-switcher,
  .arc-stages {
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline proximity;
  }

  .segmented-tabs > *,
  .game-switcher > *,
  .arc-stages > * {
    scroll-snap-align: start;
  }

  /* Compact disclosures are bounded, anchored popovers rather than viewport-covering layers. */
  .nav-shell[open] > .gamenav {
    max-height: 70vh;
    max-height: min(70dvh, 32rem);
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .statusbar-more {
    position: static;
  }

  .statusbar-mobile-secondary {
    position: absolute;
    right: max(.5rem, env(safe-area-inset-right));
    bottom: auto;
    left: max(.5rem, env(safe-area-inset-left));
    top: calc(100% + .35rem);
    width: auto;
    max-width: 34rem;
    max-height: 70vh;
    max-height: min(70dvh, 28rem);
    margin: 0 auto;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .statusbar-more[open] > .statusbar-mobile-secondary {
    margin-top: 0;
    padding: .65rem;
  }

  .spot-shell {
    display: block;
    border-left: 0;
  }

  .spot-shell > summary {
    display: flex;
    min-height: 46px;
    border-top: 0;
    border-bottom: 0;
  }

  .spot-shell:not([open]) > .spot-ticker {
    display: none;
  }

  .spot-shell[open] {
    position: absolute;
    left: max(.5rem, env(safe-area-inset-left));
    right: max(.5rem, env(safe-area-inset-right));
    top: .2rem;
    z-index: 95;
    max-height: 76vh;
    max-height: min(76dvh, 28rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #171a1e;
  }

  .spot-shell[open] > .spot-ticker {
    height: auto;
    border: 1px solid var(--line);
  }

  .spot-ticker {
    max-width: 100%;
  }

  /* Keep controls clear of rounded corners, notches, and the home indicator. */
  .masthead {
    padding-top: max(.45rem, env(safe-area-inset-top));
    padding-right: max(.65rem, env(safe-area-inset-right));
    padding-left: max(.65rem, env(safe-area-inset-left));
  }

  .nav-shell > .nav-toggle {
    padding-right: max(.8rem, env(safe-area-inset-right));
    padding-left: max(.8rem, env(safe-area-inset-left));
  }

  .nav-shell[open] > .gamenav,
  .public-nav {
    padding-right: env(safe-area-inset-right);
    padding-left: env(safe-area-inset-left);
  }

  .ticker {
    padding-left: max(.6rem, env(safe-area-inset-left));
  }

  .spot-shell:not([open]) {
    margin-right: env(safe-area-inset-right);
  }

  main {
    padding-right: max(.5rem, env(safe-area-inset-right));
    padding-left: max(.5rem, env(safe-area-inset-left));
  }

  footer {
    padding-right: max(.5rem, env(safe-area-inset-right));
    padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
    padding-left: max(.5rem, env(safe-area-inset-left));
  }

  .toast-stack {
    right: max(.8rem, env(safe-area-inset-right));
    bottom: max(.8rem, env(safe-area-inset-bottom));
    left: max(.8rem, env(safe-area-inset-left));
    max-width: none;
  }
}

@media (max-width: 360px) {
  .command-toolbar {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 640px),
       (max-width: 1024px) and (max-height: 500px) and (pointer: coarse) {
  .community-header, .scope-callout, .forum-board-card, .invite-row, .member-card {
    align-items: stretch; flex-direction: column;
  }
  .community-header .button-row, .community-header > a, .scope-callout > a { width: 100%; }
  .community-header .button-row > *, .community-header > a, .scope-callout > a { justify-content: center; }
  .community-subnav, .filter-pills { display: grid; grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); }
  .community-subnav a, .filter-pills a { justify-content: center; text-align: center; }
  .organization-grid { grid-template-columns: minmax(0, 1fr); }
  .thread-card { grid-template-columns: minmax(0, 1fr); }
  .thread-activity { justify-items: start; white-space: normal; }
  .member-control, .touch-form, .post-actions, .moderator-actions, .report-disclosure form { width: 100%; }
  .member-control select, .member-control button, .touch-form select, .touch-form button,
  .moderator-actions form, .moderator-actions input, .moderator-actions button,
  .report-disclosure input, .report-disclosure button { width: 100%; max-width: none; }
  .member-control, .touch-form, .moderator-actions form, .report-disclosure form { display: grid; grid-template-columns: minmax(0, 1fr); }
  .forum-post { padding: .75rem; }
  .post-header { display: grid; }
  .organization-badge { flex-basis: auto; }
  .confirm-inline .confirm-note { display: block; margin: .5rem 0 0; }
}

@media (max-width: 360px) {
  .community-subnav, .filter-pills { grid-template-columns: minmax(0, 1fr); }
  .scope-badge, .organization-badge { font-size: .62rem; }
}

/* Facility Refits: 320px-safe cards and board controls with no horizontal dependence. */
@media (max-width: 760px) {
  .refit-grid, .refit-effect-pair, .order-detail-grid, .refit-order-list > article { grid-template-columns: minmax(0, 1fr); }
  .refit-card-head { align-items: flex-start; flex-direction: column; }
  .refit-facts > div { grid-template-columns: minmax(0, 1fr); gap: .15rem; }
  .refit-facts dd { text-align: left; }
  .refit-money { grid-template-columns: minmax(0, 1fr); }
  .refit-money .refit-total { grid-column: auto; }
  .refit-confirm-actions, .danger-zone { align-items: stretch; flex-direction: column; }
  .refit-confirm-actions > *, .danger-zone button { width: 100%; text-align: center; }
  .exchange-board .table-wrap { overflow: visible; }
  .refit-board-table { display: block; min-width: 0; width: 100%; }
  .refit-board-table caption { display: block; }
  .refit-board-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .refit-board-table tbody, .refit-board-table tr, .refit-board-table th, .refit-board-table td { display: block; width: 100%; box-sizing: border-box; }
  .refit-board-table tr { margin: .75rem 0; border: 1px solid var(--line-strong); border-top: 3px solid var(--gold); background: var(--panel-raised); }
  .refit-board-table th, .refit-board-table td { padding: .7rem; border-bottom: 1px solid var(--line); }
  .refit-board-table [data-label]::before { display: block; margin-bottom: .25rem; color: var(--dim); content: attr(data-label); font-size: .65rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
  .exchange-fill-form { display: grid; grid-template-columns: minmax(5rem, .65fr) minmax(8rem, 1fr); min-width: 0; width: 100%; }
  .exchange-fill-form label, .exchange-fill-form small { grid-column: 1 / -1; }
  .exchange-fill-form input, .exchange-fill-form button { min-width: 0; width: 100%; min-height: 46px; }
  .contributor-list li { grid-template-columns: minmax(0, 1fr); gap: .2rem; }
}
@media (max-width: 360px) {
  .refit-card, .refit-confirm, .refit-order-detail { padding: .7rem; }
  .exchange-fill-form { grid-template-columns: minmax(0, 1fr); }
  .exchange-fill-form label, .exchange-fill-form small { grid-column: auto; }
  .quality-badge { max-width: 100%; overflow-wrap: anywhere; }
}

@media (max-width: 360px) {
  /* Large unformatted balances in the server fallback must wrap rather than widen the page. */
  .ticker { flex-wrap: wrap; overflow-wrap: anywhere; }
  .ticker b { min-width: 0; overflow-wrap: anywhere; }
}