/* Approved app family: paper, ink, lime, code-native shared icons. No desktop restyling. */
.mobile-app-dock { display: none; }
.mobile-guide-shell { max-width: 580px; margin: 0 auto; padding: 24px; color: #14211e; }
.mobile-guide-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mobile-guide-skip { display: inline-flex; gap: 6px; align-items: center; min-height: 48px; color: #14211e; font-weight: 700; text-decoration: none; padding: 0 10px; }
.mobile-guide { padding-top: 28px; }
.mobile-guide-eyebrow { font-size: 11px; letter-spacing: .12em; font-weight: 800; }
.mobile-guide h1 { font-size: clamp(30px, 7vw, 42px); line-height: 1.1; letter-spacing: -.04em; margin: 12px 0; overflow-wrap: anywhere; }
.mobile-guide-copy { font-size: 16px; line-height: 1.55; color: #4b5751; }
.mobile-guide-illustration { display: block; width: 100%; height: auto; aspect-ratio: 640 / 427; object-fit: contain; margin: 16px 0; border-radius: 24px; }
.mobile-guide-pill { display: flex; align-items: center; justify-content: center; gap: 8px; background: #d9ff57; border: 1px solid #c4e546; border-radius: 99px; padding: 12px; font-weight: 800; }
.mobile-guide-note { color: #4b5751; font-size: 12px; line-height: 1.55; }
.mobile-guide-card, .mobile-guide-role { background: #fffdf8; border: 1px solid #d8dcd1; border-radius: 20px; padding: 18px; }
.mobile-guide-card h2 { margin: 8px 0; font-size: 20px; line-height: 1.3; }
.mobile-guide-card p, .mobile-guide-card li { line-height: 1.55; }
.mobile-guide-card-label { font-size: 11px; letter-spacing: .08em; font-weight: 800; color: #147b6d; margin: 0; }
.mobile-guide-roles { display: grid; gap: 10px; }
.mobile-guide-role { min-height: 72px; display: grid; grid-template-columns: 26px minmax(0, 1fr) 20px; gap: 12px; align-items: center; color: #14211e; text-decoration: none; }
.mobile-guide-role.is-selected { background: #e7f5b5; border-color: #82974b; }
.mobile-guide-role strong, .mobile-guide-role small { display: block; }
.mobile-guide-role small { font-size: 12px; line-height: 1.45; margin-top: 4px; }
.mobile-guide-actions { display: grid; gap: 10px; margin: 22px 0 16px; }
.mobile-guide-primary, .mobile-guide-secondary { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 12px 16px; border-radius: 17px; font-weight: 800; text-align: center; text-decoration: none; color: #14211e; border: 1px solid #c6ccbc; overflow-wrap: anywhere; }
.mobile-guide-primary { background: #d9ff57; border-color: #c0dd4f; }
.mobile-guide-secondary { background: #fffdf8; }
.mobile-guide-progress { display: flex; align-items: center; justify-content: space-between; gap: 4px; }
.mobile-guide-progress ol { display: flex; margin: 0; padding: 0; list-style: none; }
.mobile-guide-progress li { display: grid; place-items: center; width: 32px; min-height: 48px; }
.mobile-guide-dot { display: block; width: 7px; height: 7px; border-radius: 50%; background: #a7b1a5; }
.mobile-guide-progress [aria-current="step"] .mobile-guide-dot { width: 22px; border-radius: 99px; background: #14211e; }
.mobile-guide-back, .mobile-guide-back-placeholder { width: 48px; min-height: 48px; display: grid; place-items: center; color: #14211e; }
.mobile-guide-step { min-width: 32px; font-size: 12px; font-weight: 800; }
.mobile-guide-further { text-align: center; font-size: 12px; }
.mobile-guide-further a { display: inline-block; color: #245e51; padding: 12px 4px; }
.mobile-guide a:focus-visible, .mobile-guide-header a:focus-visible { outline: 3px solid #147b6d; outline-offset: 3px; }
@media (max-width: 767px) {
  /* All seven tools remain available in the real native menu / four-tab dock.
     Do not repeat a desktop utility strip above every mobile learning screen. */
  .egitir-v2 .public-workspace-links { display: none; }
  body[data-mobile-shell="true"] { --mobile-shell-dock-height: max(72px, 4.5rem); --mobile-shell-space: calc(max(96px, 6rem) + env(safe-area-inset-bottom, 0px)); padding-bottom: var(--mobile-shell-space); }
  body[data-mobile-shell="true"]:not(.mobile-guide-page) { background-color: #f5f1e8; }
  html:has(> body[data-mobile-shell="true"]) { scroll-padding-block-end: calc(max(96px, 6rem) + env(safe-area-inset-bottom, 0px)); }
  body[data-mobile-shell="true"] :is(a, button, input, select, textarea, [tabindex]) { scroll-margin-block-end: var(--mobile-shell-space); }
  body[data-mobile-shell="true"][data-mobile-role="student"] .student-center-rail,
  body[data-mobile-shell="true"][data-mobile-role="student"] .student-center-mobile-aware { display: none; }
  body[data-mobile-shell="true"][data-mobile-role="student"] .student-center-account-header > .primary-nav { display: none; }
  .mobile-app-dock { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); position: fixed; z-index: 50; left: 0; right: 0; bottom: 0; min-height: var(--mobile-shell-dock-height, 72px); padding: 4px 6px calc(4px + env(safe-area-inset-bottom, 0px)); background: #fffdf8; border-top: 1px solid #d4d7ca; box-shadow: 0 -6px 25px rgb(20 33 30 / 5%); }
  .mobile-app-dock__item { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 0; min-height: max(64px, 4rem); padding: 3px 2px; gap: 2px; color: #515d55; text-decoration: none; border-radius: 13px; text-align: center; }
  .mobile-app-dock__icon { display: grid; place-items: center; width: 45px; height: 31px; border-radius: 12px; flex-shrink: 0; }
  .mobile-app-dock__label { font-size: .6875rem; line-height: 1.25; font-weight: 700; overflow-wrap: anywhere; }
  .mobile-app-dock__login { font-size: .5625rem; line-height: 1.15; color: #566250; }
  .mobile-app-dock__item[aria-current="page"] { color: #14211e; }
  .mobile-app-dock__item[aria-current="page"] .mobile-app-dock__icon { background: #d9ff57; }
  body:has(#guardian-account:target) .mobile-app-dock__item[aria-current="page"] .mobile-app-dock__icon,
  body:has(#educator-account:target) .mobile-app-dock__item[aria-current="page"] .mobile-app-dock__icon { background: transparent; }
  body:has(#guardian-account:target) .mobile-app-dock [data-mobile-tab="profile"] .mobile-app-dock__icon,
  body:has(#educator-account:target) .mobile-app-dock [data-mobile-tab="profile"] .mobile-app-dock__icon { background: #d9ff57; }
  .mobile-app-dock__item:focus-visible { outline: 3px solid #147b6d; outline-offset: -3px; }
  .mobile-guide-shell { padding: 18px 22px max(24px, env(safe-area-inset-bottom, 0px)); }
  .mobile-guide { padding-top: 24px; }
  .mobile-guide-illustration { max-height: 230px; margin: 12px 0; }
  .mobile-guide-progress li { width: 30px; }
  .mobile-guide-shell .brand { max-width: 132px; }
}
@media (prefers-reduced-motion: reduce) { .mobile-app-dock *, .mobile-guide * { scroll-behavior: auto; } }

/* Keep whole student dock labels at 320px/200% text without reducing fonts. */
@media screen and (max-width: 390px) {
  .mobile-app-dock[data-mobile-role="student"] .mobile-app-dock__item { padding-inline: 0; }
}