/* Shared phone ergonomics. Do not disable user scaling or text selection. */
html { -webkit-text-size-adjust:100%; scroll-padding-bottom:calc(var(--bid-dock-height, 0px) + 24px); }
button, a, summary { touch-action:manipulation; }
input, select, textarea { font-size:16px; scroll-margin-block:24px; }
.modal { max-height:calc(var(--visible-height, 100dvh) - 32px); overflow-y:auto; overscroll-behavior-y:contain; }
body:has(dialog[open]) { overflow:hidden; }
.close-button { min-width:44px; min-height:44px; flex-shrink:0; }
.toast { width:max-content; max-width:calc(100% - 32px); overflow-wrap:anywhere; text-align:center; }
@media(max-width:820px) {
  .app-frame { padding-left:max(16px,env(safe-area-inset-left)); padding-right:max(16px,env(safe-area-inset-right)); padding-top:max(16px,env(safe-area-inset-top)); }
  .hub { padding-left:max(20px,env(safe-area-inset-left)); padding-right:max(20px,env(safe-area-inset-right)); }
  button, summary, .play { min-height:44px; }
  .icon-button { min-width:44px; }
  .form-grid, .form-grid label, .modal-head > div { min-width:0; }
  .modal-head h2, .mission-brief h2, .compare-card h3 { overflow-wrap:anywhere; }
  .modal-actions { flex-wrap:wrap; }
  .modal-actions > button { flex:1 1 140px; }
}
@media(max-width:570px) {
  .setup-view { margin-top:12px; }
  .setup-hero { margin-bottom:4px; }
  .setup-hero p { font-size:.86rem; }
  .setup-poster { display:none; }
  .tab-body { min-height:0; }
  .ghost-button { font-size:14px; }
  .item-art { flex-shrink:0; }
  body.live-auction { padding-bottom:calc(var(--bid-dock-height, 210px) + 24px); }
  .online-game #auctionClock { bottom:calc(var(--bid-dock-height, 0px) + 8px); }
  body.live-auction .toast { bottom:calc(var(--bid-dock-height, 210px) + 12px); }
  #phoneBids { background:#131d34; padding-left:max(12px,env(safe-area-inset-left)); padding-right:max(12px,env(safe-area-inset-right)); }
  #phoneBids:has(.scenario-shortcut) > strong { padding-right:0; }
  #phoneBids small { font-size:12px; line-height:1.4; }
  #phoneBids > div { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  #phoneBids .bid-button { padding:8px 2px; min-width:0; }
  #phoneBids .scenario-shortcut, #phoneBids .phone-pass { min-height:44px; }
  .modal { width:calc(100% - 24px); }
  .modal-inner { padding:18px; }

  /* --- Compact topbar: wraps rather than overflowing on narrow phones --- */
  .topbar { flex-wrap:wrap; gap:8px; margin-bottom:8px; align-items:center; }
  .hub-back { display:none; }
  .brand-lockup { gap:8px; flex:1; min-width:0; }
  .brand-lockup .eyebrow { display:none; }
  .brand-mark { width:28px; height:28px; border-radius:7px; }
  .brand-mark span:first-child { width:12px; height:3px; top:7px; left:7px; box-shadow:0 5px 0 var(--acid); }
  .brand-mark span:last-child { width:3px; height:10px; right:7px; bottom:5px; }
  .topbar h1 { font-size:1.1rem; }
  .topbar-actions { flex-wrap:wrap; gap:4px; justify-content:flex-end; }
  .topbar-actions .feedback-trigger:not(.rating-switch):not(.share-trigger) { display:none; }
  .topbar-actions .share-trigger { display:none; }
  .topbar-actions .rating-switch { font-size:11px; padding:6px 8px; min-height:44px; }
  .topbar-actions .rules-button { padding:6px 8px; min-height:44px; font-size:.75rem; }
  .topbar-actions .rules-button .button-icon { width:16px; height:16px; font-size:.6rem; }
  .topbar-actions .round-chip { padding:5px 8px; font-size:.6rem; }

  /* --- Compact room strip --- */
  .room-strip { flex-direction:row; flex-wrap:wrap; align-items:center; padding:6px 0 8px; gap:4px 8px; }
  .room-strip > div:first-child { flex:1; min-width:0; }
  .room-strip .meta-label { font-size:.6rem; }
  .room-strip strong { font-size:1rem; }
  .room-strip .room-subtext { display:none; }
  .room-strip-actions { gap:4px; flex-wrap:wrap; }
  .room-strip-actions .my-role { display:none; }
  .room-strip-actions .invite-text { flex-basis:100%; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.6rem; }
  .room-strip-actions .outline-button { padding:5px 8px; font-size:.6rem; white-space:nowrap; min-height:44px; }
  .room-strip-actions .icon-button { min-width:32px; min-height:44px; width:32px; height:44px; font-size:1rem; }

  /* --- Tighter auctioneer panel --- */
  .luna-panel { padding:12px; gap:10px; min-height:auto; }
  .luna-orb { width:30px; height:30px; }
  .luna-orb::after { inset:-5px; }
  .luna-heading h3 { font-size:.9rem; }
  .luna-reaction { font-size:.82rem; line-height:1.4; margin-top:8px; max-height:4.2em; overflow:hidden; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; }

  /* --- Bid strip: price and buttons always visible --- */
  .bid-price { padding:6px 10px 8px; }
  .current-bid span { font-size:1.1rem; }
  .current-bid strong { font-size:clamp(1.8rem, 8vw, 2.4rem); }
  .bid-leader strong { font-size:.75rem; }

  /* --- Bidder cards: tighter --- */
  .bidder-card { padding:12px; }
  .player-name { font-size:1rem; }
  .budget-number { font-size:1.1rem; }
  .bidder-stats { margin-top:10px; padding-top:8px; }

  /* --- Mission brief --- */
  .mission-brief { padding:14px; margin-bottom:12px; }
  .mission-brief h2 { font-size:20px; margin-bottom:8px; }
  .mission-brief p { font-size:14px; line-height:1.45; margin-bottom:8px; }
}
/* --- Hub page compact header on mobile --- */
@media(max-width:570px) {
  .hub header { flex-wrap:wrap; gap:8px; padding:16px 0; align-items:center; }
  .hub header .feedback-trigger:not(.rating-switch):not(.share-trigger) { font-size:11px; padding:5px 8px; min-height:44px; }
  .hub header .share-trigger { display:none !important; }
  .hub header .rating-switch { font-size:11px; padding:5px 8px; min-height:44px; }
  .hub header > a[href="#join"] { font-size:11px; white-space:nowrap; text-align:right; }
}
@media(hover:none) {
  button:hover, .play:hover { transform:none; }
}