/* 0.12.25-mobileprompts: phone readability pass for the Playbook.
   Loaded last. No CSS zoom. Leaves phone-viewport.js / the wide-Android viewport fix untouched.
   Rules: body text >= 16px, line-height ~1.5, balanced clamp() headings, 44px touch targets,
   no horizontal scroll, nothing hidden under the fixed bottom nav. */
@media (max-width:800px), (pointer:coarse) {
  html, body { overflow-x: clip; }
  body { line-height: 1.5; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  h1, h2, h3 { text-wrap: balance; overflow-wrap: anywhere; }
  h1, .page-heading h1, .questionnaire h1 { font-size: clamp(1.6rem, 6.4vw, 2.15rem); line-height: 1.2; }
  .intro h1 { font-size: clamp(1.8rem, 8vw, 2.45rem); line-height: 1.15; }
  h2 { font-size: clamp(1.2rem, 5vw, 1.4rem); line-height: 1.3; }
  h3 { font-size: max(1.05rem, 17px); line-height: 1.35; }
  p, li, dd, dt, label, legend, .option, .check, .notice, .error, .success { line-height: 1.5; }

  /* 16px floor on the small print that was 12-15px on phones */
  .eyebrow, .edition, .account, .topbar .account, .quiet, .text-button, .small, p.small, .muted,
  .field, label.field, .field span, .option, .option span, .check, legend, .chips span, .pill, .journey-step,
  .question-count, .version, .focus-change, .timeline-item p, .timeline-item time, .queue-count,
  .compact dl, .review-item dl, .checks li, .why, .starting > p, .role-grid p, .role-grid h3,
  .notice, .error, .success, .rehearsal, .tile-detail, .sidebar-note, .navlink, .voice-button,
  footer, footer *, #phone-display, .pwa-install-strip, .pwa-install-strip *, #toast,
  table, .metrics span, .metrics small, .card-head .eyebrow, .prompt-label {
    font-size: max(1em, 16px);
  }
  .eyebrow, .card-head .eyebrow, .edition, .question-count { font-size: 16px; letter-spacing: .06em; line-height: 1.4; }
  .small, p.small, .muted, .option span, .chips span, .pill, .journey-step, .version, .timeline-item time { font-size: 16px; }
  .account, .topbar .account { font-size: 16px; }
  .field, label.field { font-size: 16px; }

  /* touch targets */
  button, .primary, .secondary, .quiet, .text-button, .navlink, summary, select, input:not([type=checkbox]):not([type=radio]) { min-height: 44px; }
  a.text-button, .focus-change { display: inline-flex; align-items: center; min-height: 44px; }
  summary { display: flex; align-items: center; }
  .pwa-install-open, .pwa-install-strip button { min-height: 44px; min-width: 44px; }
  #phone-display { min-height: 44px; }
  .checks summary, .why summary { min-height: 44px; }

  /* bottom nav: labels as large as the five columns allow (16px from 365px wide) */
  .mobile-tab { font-size: 16px; line-height: 1.2; min-height: 64px; }
  :has(> .mobile-tab:nth-of-type(5)) > .mobile-tab { font-size: clamp(14.5px, 4.4vw, 16px); }
  .mobile-tab span { overflow-wrap: normal; word-break: normal; hyphens: none; }

  /* consistent padding, no cramped top, nothing under the fixed nav */
  main { padding-top: max(1.25rem, env(safe-area-inset-top, 0px)); padding-left: max(1rem, env(safe-area-inset-left, 0px)); padding-right: max(1rem, env(safe-area-inset-right, 0px)); }
  .panel { padding: 1.15rem; }
  .topbar { padding-top: max(.75rem, env(safe-area-inset-top, 0px)); }
}

/* 16px floor for legacy small-print rules (generated from style/mobile/pwa/caddie/learning-loop/entry/phone-layout CSS).
   The :not(#mp) bump only outranks the old class selectors; it never shrinks larger text. */
@media (max-width:800px), (pointer:coarse) {
  html:not(#mp) .text-button,
  html:not(#mp) .edition,
  html:not(#mp) .account,
  html:not(#mp) .rehearsal,
  html:not(#mp) .eyebrow,
  html:not(#mp) .navlink,
  html:not(#mp) .sidebar-note,
  html:not(#mp) .field,
  html:not(#mp) .check,
  html:not(#mp) .small,
  html:not(#mp) .notice,
  html:not(#mp) .error,
  html:not(#mp) .success,
  html:not(#mp) .question-count,
  html:not(#mp) legend,
  html:not(#mp) .option,
  html:not(#mp) .starting>p,
  html:not(#mp) .pill,
  html:not(#mp) .chips span,
  html:not(#mp) .card-head .eyebrow,
  html:not(#mp) .version,
  html:not(#mp) .prompt-label,
  html:not(#mp) .checks li,
  html:not(#mp) .why,
  html:not(#mp) .compact dl,
  html:not(#mp) .timeline-item p,
  html:not(#mp) .timeline-item time,
  html:not(#mp) .metrics span,
  html:not(#mp) .metrics small,
  html:not(#mp) table,
  html:not(#mp) .review-item dl,
  html:not(#mp) .queue-count,
  html:not(#mp) #toast,
  html:not(#mp) footer,
  html:not(#mp) .topbar .quiet,
  html:not(#mp) .focus-change,
  html:not(#mp) .role-grid h3,
  html:not(#mp) .role-grid p,
  html:not(#mp) .journey-step,
  html:not(#mp) #phone-display,
  html:not(#mp) .focus-banner .small,
  html:not(#mp) .focus-banner button,
  html:not(#mp) .heading-actions>button,
  html:not(#mp) .topbar .account,
  html:not(#mp) .tile-detail,
  html:not(#mp).large-phone-display #phone-display,
  html:not(#mp) .current-prompt-heading p,
  html:not(#mp) #pwa-tools,
  html:not(#mp) .pwa-dialog-note,
  html:not(#mp) .pwa-install-strip,
  html:not(#mp) .caddie-app .primary,
  html:not(#mp) .caddie-app .secondary,
  html:not(#mp) .caddie-app .text-button,
  html:not(#mp) .caddie-app p,
  html:not(#mp) .caddie-app .eyebrow,
  html:not(#mp) .caddie-app .small,
  html:not(#mp) .caddie-review-note,
  html:not(#mp) .caddie-breadcrumb button,
  html:not(#mp) .caddie-breadcrumb span,
  html:not(#mp) .caddie-edition-label,
  html:not(#mp) .caddie-hero p,
  html:not(#mp) .caddie-hero-meta span,
  html:not(#mp) .caddie-hero-actions .primary,
  html:not(#mp) .caddie-hero-actions .caddie-ghost,
  html:not(#mp) .caddie-art-caption,
  html:not(#mp) .caddie-value-list>div,
  html:not(#mp) .caddie-value-list strong,
  html:not(#mp) .caddie-route-choice legend,
  html:not(#mp) .caddie-route-choice span,
  html:not(#mp) .caddie-route-choice strong,
  html:not(#mp) .caddie-name-check,
  html:not(#mp) .caddie-app .check,
  html:not(#mp) .caddie-browser-note,
  html:not(#mp) .caddie-tabs button,
  html:not(#mp) .caddie-section-head>.secondary,
  html:not(#mp) .caddie-chip,
  html:not(#mp) .caddie-feature .eyebrow,
  html:not(#mp) .caddie-feature p,
  html:not(#mp) .caddie-card-link,
  html:not(#mp) .caddie-hole small,
  html:not(#mp) .caddie-keep p,
  html:not(#mp) .caddie-keep .secondary,
  html:not(#mp) .caddie-mode button,
  html:not(#mp) .caddie-mode-row>span,
  html:not(#mp) .caddie-round-note p,
  html:not(#mp) .caddie-hole-number span,
  html:not(#mp) .caddie-hole-facts span,
  html:not(#mp) .caddie-hole-pager,
  html:not(#mp) .caddie-hole-pager .secondary,
  html:not(#mp) .caddie-skill-steps li,
  html:not(#mp) .caddie-human-check strong,
  html:not(#mp) .caddie-human-check p,
  html:not(#mp) .caddie-saved-notice,
  html:not(#mp) .caddie-saved-notice .text-button,
  html:not(#mp) .caddie-context-preview summary,
  html:not(#mp) .caddie-context-preview p,
  html:not(#mp) .caddie-context-nudge,
  html:not(#mp) .caddie-context-nudge .text-button,
  html:not(#mp) .caddie-app .field,
  html:not(#mp) .caddie-app input:not([type=checkbox],
  html:not(#mp) [type=radio],
  html:not(#mp) [type=hidden]),
  html:not(#mp) .caddie-app select,
  html:not(#mp) .caddie-app textarea,
  html:not(#mp) .caddie-app .caddie-generated-prompt,
  html:not(#mp) .caddie-prompt-actions .primary,
  html:not(#mp) .caddie-prompt-actions .secondary,
  html:not(#mp) .caddie-club-row label,
  html:not(#mp) .caddie-club-row select,
  html:not(#mp) .caddie-club-row input,
  html:not(#mp) .caddie-profile-aside p,
  html:not(#mp) .caddie-saved-card p,
  html:not(#mp) .caddie-saved-card .eyebrow,
  html:not(#mp) .caddie-saved-actions .secondary,
  html:not(#mp) .caddie-privacy summary,
  html:not(#mp) .caddie-report summary,
  html:not(#mp) .caddie-beyond p,
  html:not(#mp) .caddie-inline-success,
  html:not(#mp) .caddie-weather-intro p,
  html:not(#mp) .caddie-weather-caution,
  html:not(#mp) .caddie-weather-table table,
  html:not(#mp) .caddie-weather-table caption,
  html:not(#mp) .caddie-report-grid>div,
  html:not(#mp) .caddie-home-entry p,
  html:not(#mp) .caddie-home-entry .eyebrow,
  html:not(#mp) .caddie-home-entry .primary,
  html:not(#mp) .caddie-app,
  html:not(#mp) .caddie-section-head p,
  html:not(#mp) .caddie-section-head .eyebrow,
  html:not(#mp) .caddie-feature-main p,
  html:not(#mp) .caddie-altitude-guide p,
  html:not(#mp) .caddie-altitude-guide .small,
  html:not(#mp) .caddie-altitude-guide summary,
  html:not(#mp) .caddie-altitude-guide a,
  html:not(#mp) .caddie-altitude-example span,
  html:not(#mp) .caddie-altitude-example strong,
  html:not(#mp) .caddie-life-connection summary,
  html:not(#mp) .caddie-app .caddie-life-connection p,
  html:not(#mp) .caddie-app .caddie-life-connection .small,
  html:not(#mp) .mma-journey span,
  html:not(#mp) .mma-skill-journey span,
  html:not(#mp) .mma-journey b,
  html:not(#mp) .mma-skill-journey b,
  html:not(#mp) .mma-intent>span,
  html:not(#mp) .mma-moment .eyebrow,
  html:not(#mp) .mma-moment p,
  html:not(#mp) .mma-progress span,
  html:not(#mp) .caddie-app .mma-progress p,
  html:not(#mp) .caddie-app .mma-return p,
  html:not(#mp) .mma-learning-note strong,
  html:not(#mp) .caddie-app .mma-learning-note p,
  html:not(#mp) .mma-before-after span,
  html:not(#mp) .caddie-app .mma-before-after p,
  html:not(#mp) .mma-plan-steps li,
  html:not(#mp) .mma-method>strong,
  html:not(#mp) .caddie-app .mma-method p,
  html:not(#mp) .mma-refinements legend,
  html:not(#mp) .mma-refinements button,
  html:not(#mp) .mma-handoff summary,
  html:not(#mp) .mma-handoff .field,
  html:not(#mp) .mma-handoff .caddie-ai-link,
  html:not(#mp) .mma-topic-choices .primary,
  html:not(#mp) .mma-topic-choices .secondary,
  html:not(#mp) .mma-intent strong,
  html:not(#mp) .mma-starter-result>.primary,
  html:not(#mp) .mma-example-card span,
  html:not(#mp) .caddie-app .mma-example-card p:last-child,
  html:not(#mp) .caddie-app .caddie-day-top p,
  html:not(#mp) .caddie-app .caddie-game-line,
  html:not(#mp) .caddie-app .golf-day-lines,
  html:not(#mp) .golf-game-button span,
  html:not(#mp) .caddie-app .golf-how p,
  html:not(#mp) .caddie-app .golf-explore>p,
  html:not(#mp) .caddie-route-picker,
  html:not(#mp) .caddie-route-picker select,
  html:not(#mp) .learning-requirements { font-size: 16px; }
  .caddie-app { font-size: 16px; }
}

/* 0.12.26-mobile-flow: readable content, natural height and reflow at phone widths. */
@media (max-width:800px), (pointer:coarse) {
  html { scroll-padding-bottom: 100px; }
  body { font-size:18px; line-height:1.55; }
  main, .workspace, .panel, .auth-layout, .intro, .auth-panel { min-width:0; }
  html:not(#mp) main { width:auto; min-height:0; padding:20px 16px 28px; }
  html:not(#mp) .workspace { min-height:0; align-content:start; }
  html:not(#mp) .auth-layout { min-height:0; gap:24px; padding:0; }
  html:not(#mp) .intro { padding:0; }
  html:not(#mp) .intro h1 { font-size:clamp(30px,8vw,40px); line-height:1.2; margin:10px 0 16px; letter-spacing:-.025em; }
  html:not(#mp) h1, html:not(#mp) .page-heading h1 { font-size:clamp(28px,7.2vw,36px); line-height:1.22; margin:8px 0 12px; }
  html:not(#mp) h2 { font-size:clamp(23px,5.8vw,28px); line-height:1.28; }
  html:not(#mp) h3 { font-size:21px; line-height:1.3; }
  html:not(#mp) main p:not(.eyebrow):not(.small):not(.golf-privacy),
  html:not(#mp) .tile-detail, html:not(#mp) .caddie-app p:not(.eyebrow):not(.small),
  html:not(#mp) .option, html:not(#mp) .option span, html:not(#mp) .field,
  html:not(#mp) .caddie-app .field, html:not(#mp) .caddie-app textarea,
  html:not(#mp) input:not([type=checkbox]):not([type=radio]), html:not(#mp) select, html:not(#mp) textarea { font-size:18px; line-height:1.55; }
  html:not(#mp) .panel { padding:16px; margin-bottom:16px; }
  html:not(#mp) .page-heading { margin-bottom:20px; }
  html:not(#mp) .home-tile { gap:12px; padding:16px 12px; }
  html:not(#mp) .home-tile strong { font-size:20px; line-height:1.3; }
  html:not(#mp) .golf-win-list li { display:flex; flex-direction:column; gap:12px; padding:14px; }
  .golf-win-list li::before { display:none; }
  .golf-win-list strong { font-size:20px; }
  .golf-win-actions, .golf-prompt-editor { width:100%; }
  html:not(#mp) .caddie-hero { padding:20px 16px; gap:16px; min-height:0; }
  html:not(#mp) .caddie-hero h1 { line-height:1.2; }
  html:not(#mp) #display-tools { position:static; margin:12px 16px; padding-bottom:calc(88px + env(safe-area-inset-bottom,0px)); }
  html:not(#mp) #phone-display { white-space:normal; min-height:44px; }
  html:not(#mp) .mobile-nav { padding-bottom:env(safe-area-inset-bottom,0px); }
  html:not(#mp) .mobile-nav ~ footer { margin-bottom:90px; }
  html:not(#mp) button, html:not(#mp) .primary, html:not(#mp) .secondary { white-space:normal; line-height:1.35; }
}
.golf-prompt-editor { grid-column:2; display:flex; flex-direction:column; gap:8px; font-size:16px; font-weight:700; }
.golf-prompt-editor textarea { width:100%; min-width:0; padding:12px; border:1px solid #738b7a; border-radius:10px; background:white; color:#153a25; font:inherit; font-size:18px; line-height:1.5; field-sizing:content; min-height:7.5em; resize:vertical; }
.golf-prompt-editor textarea:focus-visible { outline:3px solid #1d6b3f; outline-offset:3px; }
@media (min-width:801px) { html.large-phone-display { font-size:20px; } }

/* 0.12.53-home-tidy: Install and the display-size control are at least 44x44 CSS px.
   Above 900px the install strip is 34px tall. The extra tap height uses a negative
   margin so the strip, and the Home heading under it, stay where they are.
   The release line is static text ("My Living Playbook") and must not eat clicks. */
html body .pwa-install-strip button.pwa-install-open {
  box-sizing: border-box;
  min-width: 44px;
  min-height: 44px;
}
/* Desktop strip stays its current height. The control is 44px tall and the
   extra height hangs just below the strip, so the Home heading does not move. */
@media (min-width: 801px) {
  html body .pwa-install-strip button.pwa-install-open {
    margin-top: 0;
    margin-bottom: -10px;
  }
}
html #phone-display,
html.large-phone-display #phone-display {
  box-sizing: border-box;
  min-width: 44px;
  min-height: 44px;
}
body.mma-playbook > .app-release { pointer-events: none; }
