/* Mobile calendar navigation retains its open, frameless arrows. */
@media (max-width: 700px) {
  .hero__cta { grid-template-columns: minmax(0,1fr) 1px minmax(0,1fr) 1px minmax(0,1fr); column-gap: 6px; }
  .hero__cta > .hero__quick-link { width: 100%; min-width: 0; justify-content: center; text-align: center; font-size: clamp(11.5px,3.1vw,13px); gap: 6px; }
  .hero__cta > .hero__timetable { grid-column: 5; grid-row: 2; color: var(--accent-text); }
  .hero__cta > .hero__links-divider { justify-self: center; background: linear-gradient(transparent,rgba(var(--surface-rgb),.24),transparent); }
  .hero__cta > .hero__links-divider--last { grid-column: 4; }
  /* Keep the whole navigation available while the page scrolls. The separate
     backdrop does not turn fixed popovers into children of a filtered header. */
  body .nav.glass, body:has(.hero.page-active) .nav.glass {
    --nav-scene-glass: rgba(22,22,26,.40);
    --nav-stage-mix: clamp(0%,calc(var(--teacher-room-dim,0) * 161.3%),100%);
    position: fixed; top: 0; left: 0; right: 0; transform: none;
    width: 100%; padding-top: max(8px,env(safe-area-inset-top)); padding-bottom: 8px;
    border: 0; border-radius: 0; background: transparent; box-shadow: none;
    backdrop-filter: none; -webkit-backdrop-filter: none; isolation: isolate;
  }
  body .nav.glass::before {
    content: ''; position: absolute; inset: 0 0 -12px; z-index: -1; pointer-events: none;
    /* The glass takes its colour from the actual content behind it. The team
       scene shares its existing dimmer progress, including entry and exit. */
    background-color: color-mix(in srgb,var(--nav-scene-glass),rgba(4,4,6,.72) var(--nav-stage-mix));
    background-image: linear-gradient(110deg,#ffffff06,transparent 45%,#00000008);
    border: 0; opacity: 0;
    mask-image: linear-gradient(#000 calc(100% - 16px),transparent);
    -webkit-mask-image: linear-gradient(#000 calc(100% - 16px),transparent);
    backdrop-filter: blur(22px) saturate(1.05); -webkit-backdrop-filter: blur(22px) saturate(1.05);
    transition: opacity 220ms, background-color 450ms ease;
  }
  body .nav.glass.is-scrolled::before, body .nav.glass.is-search-open::before { opacity: 1; }
  body .nav :is(#nav-burger,#nav-search,#nav-ann) {
    color: color-mix(in srgb,var(--ink-dim),#f5f3f0 var(--nav-stage-mix));
    transition: color 450ms ease;
  }
  /* Keep the destination ink absent until the travelling paper has arrived.
     finishAnnPopup releases it directly into the separate stroke reassembly. */
  #nav-ann[aria-expanded="true"] > svg { opacity: 0; }
  #nav-ann > svg { overflow: visible; }
  #nav-ann > svg > * { transform-box: fill-box; transform-origin: center; }
  .nav.is-search-open > .nav__logo, .nav.is-search-open #nav-ann { opacity: 0; pointer-events: none; }
  .nav #nav-search { position: relative; z-index: 3; }
  .nav #nav-search-panel {
    position: absolute; right: auto; max-width: none; padding: 0; border: 0;
    background: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none;
    z-index: 2; animation: none; transform: none; overflow: visible; transition: none;
  }
  .nav #nav-search-panel .navsearch__row {
    box-sizing: border-box; height: 38px; min-height: 36px; width: 100%; margin-left: auto;
    padding: 7px 40px 7px 13px; border-radius: 20px;
    border: 1px solid color-mix(in srgb,var(--orange) 35%,var(--glass-border));
    background: rgba(174,178,188,.14);
    box-shadow: inset 0 1px 0 #ffffff18; overflow: hidden; transform-origin: right center;
  }
  .nav #nav-search-panel .navsearch__row::after, .nav #nav-search-ic { display: none; }
  .nav #nav-search-panel .navsearch__row input { width: 100%; min-width: 0; font-size: 16px; }
  .nav #nav-search-panel .dash__sr {
    position: absolute; top: calc(100% + 12px); left: 0; right: 0; margin: 0;
    max-height: min(55dvh,420px); padding: 8px; border: 1px solid var(--glass-border);
    border-radius: 16px; background: var(--bg-2); box-shadow: 0 14px 32px #0004;
  }
  :root[data-theme="light"] body .nav.glass { --nav-scene-glass: rgba(235,232,242,.50); }
  :root[data-theme="light"] .nav #nav-search-panel .navsearch__row { background: rgba(255,255,255,.34); }
}
@media (prefers-reduced-motion: reduce) {
  body .nav.glass::before, body .nav :is(#nav-burger,#nav-search,#nav-ann) { transition: none; }
}

/* The draggable contact button keeps its menu inside the viewport on either
   edge. Only the main button captures dragging; links retain normal taps. */
.contact-fab__main { touch-action: none; user-select: none; -webkit-user-select: none; }
body:not(.fab-in-tabbar) .contact-fab.is-positioned {
  right: auto; bottom: auto; left: var(--fab-x); top: var(--fab-y);
  width: var(--fab-size); height: var(--fab-size); gap: 0; transform: none;
  transition: left 340ms cubic-bezier(.22,1,.36,1), top 340ms cubic-bezier(.22,1,.36,1);
}
body:not(.fab-in-tabbar) .contact-fab.is-dragging { transition: none; }
.contact-fab.is-dragging .contact-fab__main { cursor: grabbing; transform: scale(1.06); }
body:not(.fab-in-tabbar) .contact-fab.is-positioned .contact-fab__items {
  position: absolute; bottom: calc(100% + 12px); right: var(--fab-menu-right,0px);
  width: max-content; max-width: calc(100vw - 24px);
  max-height: var(--fab-menu-height,60dvh); overflow-y: auto; overflow-x: hidden;
  padding: 6px; margin: -6px; transform-origin: bottom right;
}
body:not(.fab-in-tabbar) .contact-fab.is-positioned.is-menu-below .contact-fab__items {
  bottom: auto; top: calc(100% + 12px); transform-origin: top right;
}
.contact-fab.is-docked:not(.is-open) .contact-fab__main { box-shadow: 0 3px 16px #0004; }
@media (prefers-reduced-motion: reduce) {
  body .contact-fab.is-positioned { transition: none; }
  .contact-fab.is-dragging .contact-fab__main { transform: none; }
}

@media (max-width: 720px) {
  /* Keep the touch targets, remove just the circles around previous/next. */
  #cal-view .cal-strip-row .cal-nav__arrow,
  #cal-view .cal-strip-row .cal-nav__arrow:hover,
  #cal-view .cal-strip-row .cal-nav__arrow:active {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--ink);
  }
  #cal-view .cal-strip-row .cal-nav__arrow:focus-visible {
    outline: 2px solid var(--orange-hi);
    outline-offset: -4px;
  }
}