/* In-flow reading navigation on phones. Shared header and desktop stay intact. */
@media (max-width: 760px) {
  html:has(.mobile-navigation-inline) { scroll-behavior: auto; }
  .project-navigation-ready .php-site.mobile-navigation-inline .page-shell {
    padding: 16px 16px 32px;
  }
  .php-site.mobile-navigation-inline #main .project-heading { padding-bottom: 0 !important; }
  .php-site.mobile-navigation-inline #main .project-heading > .button[href$="/tutorials"] { display: none; }
  .php-site.mobile-navigation-inline #main .guide-heading .guide-tutorial-options { display: none; }
  .project-navigation-ready .php-site.mobile-navigation-inline .project-navigation-dock {
    position: static; inset: auto; transform: none; z-index: auto;
    display: block; width: 100%; max-width: none; max-height: none;
    margin: 14px 0 20px; padding: 0; border: 0;
    border-radius: 0; background: transparent; box-shadow: none; overflow: visible;
  }
  .php-site.mobile-navigation-inline .project-navigation-toggle { display: none; }
  .php-site.mobile-navigation-inline #main :is(.project-reader-nav, .rule-related-navigation) {
    display: grid; grid-template-columns: repeat(var(--mobile-navigation-columns, 4), minmax(0, 1fr));
    grid-auto-rows: auto; gap: 6px !important;
    width: 100%; height: auto; max-height: none; min-height: 0;
    padding: 0; margin: 0; overflow: visible; border: 0;
  }
  .php-site.mobile-navigation-inline #main :is(.project-reader-nav, .rule-related-navigation) > a {
    box-sizing: border-box; display: flex; align-items: center; justify-content: center; text-align: center;
    min-width: 0; width: 100%; min-height: 44px; height: auto; padding: 5px;
    border: 1px solid var(--ui-line); border-radius: 6px; background: var(--ui-surface);
    color: var(--ui-ink) !important; font-size: 12px; line-height: 16px; font-weight: 500;
    white-space: normal; overflow-wrap: anywhere; text-decoration: none;
  }
  .php-site.mobile-navigation-inline #main .project-reader-nav > a[aria-current] {
    background: var(--ui-soft); border-color: var(--ui-accent); color: var(--ui-accent) !important;
  }
  .php-site.mobile-navigation-inline #main .project-reader-nav .page-navigation-divider {
    grid-column: 1 / -1; align-self: end; min-width: 0;
    margin: 0; padding: 8px 0 2px; border: 0;
  }
  .php-site.mobile-navigation-inline #main .rule-mobile-related {
    margin: 24px 0; padding-top: 18px; border-top: 1px solid var(--ui-line);
  }
  .php-site.mobile-navigation-inline #main .rule-mobile-related h2 {
    margin: 0 0 12px; font-size: 16px; line-height: 1.5;
  }
  .php-site.mobile-navigation-inline #main .rule-related-navigation a:focus-visible {
    outline: 2px solid var(--ui-accent); outline-offset: -3px;
  }
  .php-site.mobile-navigation-inline #main .rule-navigation-organized .guide-client-heading {
    display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: center;
    gap: 12px !important; margin-bottom: 0; padding: 8px 0 16px !important;
    border-bottom: 0;
  }
  .php-site.mobile-navigation-inline #main .rule-navigation-organized .guide-client-logo {
    width: 48px; height: 48px; margin: 0; border-radius: 12px;
  }
  .php-site.mobile-navigation-inline #main .rule-navigation-organized .guide-client-info { display: contents; }
  .php-site.mobile-navigation-inline #main .rule-navigation-organized .rules-kicker { display: none; }
  .php-site.mobile-navigation-inline #main .rule-navigation-organized .guide-client-heading h1 {
    margin: 0; font-size: 20px !important; line-height: 1.45 !important;
  }
  .php-site.mobile-navigation-inline #main .rule-navigation-organized .guide-client-facts {
    grid-column: 1 / -1; gap: 8px; margin: 2px 0 0;
  }
  .php-site.mobile-navigation-inline #main .rule-navigation-organized .guide-client-facts > div {
    grid-template-columns: 56px minmax(0, 1fr); gap: 8px;
  }
  .php-site.mobile-navigation-inline #main .rule-navigation-organized .guide-client-facts :is(dt, dd) { font-size: 12px; }
  .php-site.mobile-navigation-inline #main .rule-navigation-organized .platform-option {
    font-size: 12px; padding: 3px 6px; gap: 4px;
  }
  .php-site.mobile-navigation-inline #main .rule-navigation-organized .guide-client-description {
    grid-column: 1 / -1; margin: 0; font-size: 14px; line-height: 1.75;
  }
  .php-site.mobile-navigation-inline #main .rule-navigation-organized #sources > .software-rule-actions { display: none; }
}
