/* PWA-only stylesheet (loaded after styles.css).
 * styles.css stays byte-identical to the private game's theme.css (minus the
 * Tailwind @imports/@theme wrapper) so data-parity can assert exact parity.
 * Everything in this file is a deliberate phone-PWA difference:
 *   1. Tap targets raised to 44px for phone use versus the desktop source.
 *   2. A tighter 560px media query for the command-center cards.
 *   3. Collapsible-section styles for the mobile declutter pass. */
.sim-stop-summary{position:relative;display:grid;gap:3px;margin-top:12px;padding:12px 56px 12px 12px;background:color-mix(in srgb,var(--accent) 14%,var(--surface-strong));border-left:4px solid var(--accent)}
.sim-stop-summary button{position:absolute;right:6px;top:6px;min-width:44px;min-height:44px;border:0;background:transparent;color:var(--text);font-size:20px}
.first-step-list>div{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:8px;align-items:center;min-height:44px;padding:8px 10px;background:var(--surface-strong)}
.first-step-list button{min-width:52px;min-height:44px;border:1px solid var(--border);background:var(--bg);color:var(--text);font-weight:850}
.context-tip button{flex:0 0 auto;min-width:72px;min-height:44px;padding:0 12px;border:0;background:var(--accent);color:var(--accent-ink);font-weight:900}
@media(max-width:560px){.gm-inbox,.first-steps,.pennant-race,.walkoff-headline{padding:14px;border-radius:9px}.inbox-heading{align-items:flex-start;flex-direction:column}.sim-decision-button{width:100%}.inbox-list>button{grid-template-columns:minmax(0,1fr) auto}.inbox-kind{grid-column:1/-1;justify-self:start}.pennant-race{grid-template-columns:1fr}.magic-number{grid-template-columns:auto auto 1fr;justify-items:start;gap:8px;min-width:0}.magic-number strong{font-size:28px}.magic-number small{align-self:center}.no-hitter-banner{margin:-14px -14px 12px;align-items:flex-start;flex-direction:column}.context-tip{align-items:flex-start}.first-step-list>div{grid-template-columns:20px minmax(0,1fr) auto}}

/* ---------- Collapsible sections (mobile declutter pass) ---------- */
.hidden { display: none !important; }
.fold-card { margin-top: 12px; padding: 12px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }
.fold-card > h3 { margin: 0 0 4px; font-size: 16px; font-family: Georgia, serif; }
.fold-head { cursor: pointer; user-select: none; -webkit-user-select: none; padding: 6px 0; margin: 0; font-size: 16px; font-family: Georgia, serif; }
.fold-head:focus-visible { outline: 3px solid color-mix(in srgb, var(--gold) 70%, transparent); outline-offset: 2px; border-radius: 4px; }
.fold-arrow { display: inline-block; width: 1.1em; opacity: .7; }
.fold-body { margin-top: 8px; }

/* ---------- Whitespace tightening (mobile declutter pass) ---------- */
.dashboard-grid { gap: 12px; }
.list-page > section, .list-page > .forty-man-board, .list-page > .non-tender-board { margin-top: 12px; }
@media (max-width: 560px) {
  .section-heading h2, .page-intro h2 { font-size: 22px; }
  .club-header { padding: 20px 16px 14px; }
}
