/*
 * Orlando field journal — clear-glass finish
 * Loaded last across the root pages. Keep the light, blue-gray notebook palette;
 * the lens is defined by reflected edges and layered light, not by milky opacity.
 */
@media screen {
  :root {
    --glass-ink: #304650;
    --glass-ink-strong: #263d47;
    --glass-edge: #ffffff;
    --glass-edge-cool: #94adb5;
    --glass-shadow: #344f5a24;
    --glass-tint: #dce9ed;
    --glass-focus: #3e6878;
    --glass-lens: linear-gradient(145deg,
      rgb(255 255 255 / 76%) 0%,
      rgb(242 249 250 / 36%) 32%,
      rgb(205 224 229 / 28%) 68%,
      rgb(255 255 255 / 53%) 100%);
    --glass-rim: linear-gradient(135deg,
      #fff 0%, #ffffffd9 15%, #a8c0c7 38%, #ffffffed 51%,
      #91aab2 73%, #ffffff 100%);
    --glass-luster: linear-gradient(116deg,
      transparent 18%, #ffffffa8 35%, #ffffff24 49%, transparent 64%);
    --glass-contact: 0 9px 22px -10px var(--glass-shadow),
      0 2px 5px #344f5a10,
      inset 0 1px 1px #fff,
      inset 0 -1px 1px #819ca625;
  }

  /* Concise actions only — never the letter buttons that animate on the homepage. */
  body :is(.btn, .hero-btn, .cta-button, button.primary, a.primary, .story-pill,
    .launch-button, .birthday-nav-home, .oe-button),
  body .navbar :is(.menu-btn, .menu-toggle),
  body.site-interior .navbar .menu-toggle,
  body :is(.routes .home-link, .birthday-page .home-link),
  body .party-control,
  body :is(button, a)[class~="action"],
  body :is(button, a)[class~="filter-button"] {
    position: relative;
    isolation: isolate;
    border: 1px solid transparent !important;
    border-radius: 999px !important;
    background: var(--glass-lens) !important;
    background-clip: padding-box;
    color: var(--glass-ink-strong) !important;
    box-shadow:
      0 0 0 1px #78949e40,
      0 1px 0 1px #ffffffd9,
      var(--glass-contact),
      inset 0 0 0 1px #ffffff63 !important;
    -webkit-backdrop-filter: blur(8px) saturate(1.18);
    backdrop-filter: blur(8px) saturate(1.18);
    text-decoration: none;
    text-shadow: 0 1px #ffffffa8;
    transition: transform .2s cubic-bezier(.2,.75,.25,1),
      box-shadow .2s ease, background-color .2s ease, border-color .2s ease;
  }

  body :is(.btn:not(.hamburger-btn):not(.mobile-nav-button), .hero-btn, .cta-button,
    button.primary, a.primary, .story-pill, .launch-button, .birthday-nav-home, .oe-button)::before,
  body .navbar .menu-btn::before,
  body .routes .home-link::before,
  body.birthday-page .home-link::before,
  body .party-control::before,
  body :is(button, a)[class~="action"]::before,
  body :is(button, a)[class~="filter-button"]::before {
    content: "" !important;
    position: absolute;
    z-index: -1;
    inset: 1px 2px 48% 2px;
    display: block;
    border: 0;
    border-radius: inherit;
    background: linear-gradient(180deg, #ffffffd9 0%, #ffffff76 35%, #ffffff00 100%);
    opacity: .92;
    pointer-events: none;
    transform: none;
  }

  body :is(.btn:not(.hamburger-btn):not(.mobile-nav-button), .hero-btn, .cta-button,
    button.primary, a.primary, .story-pill, .launch-button, .birthday-nav-home, .oe-button)::after,
  body .navbar .menu-btn::after,
  body .routes .home-link::after,
  body.birthday-page .home-link::after,
  body :is(button, a)[class~="action"]:not(.hamburger-btn):not(.mobile-nav-button)::after,
  body :is(button, a)[class~="filter-button"]:not(.hamburger-btn):not(.mobile-nav-button)::after {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    box-sizing: border-box;
    width: auto;
    height: auto;
    margin: 0;
    padding: 1px;
    border: 0;
    border-radius: inherit;
    background: var(--glass-rim);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    transition: opacity .2s ease;
  }

  /* menu-toggle ::after intentionally remains its real "Menu" label */
  body .navbar .menu-toggle::after {
    content: "Menu" !important;
    position: static;
    z-index: auto;
    inset: auto;
    display: block;
    width: auto;
    height: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--glass-ink-strong);
    font: inherit;
    pointer-events: none;
  }

  body .navbar .menu-toggle {
    overflow: visible;
  }

  @media (hover: hover) and (pointer: fine) {
      body :is(.btn, .hero-btn, .cta-button, button.primary, a.primary, .story-pill,
        .launch-button, .birthday-nav-home, .oe-button):hover,
    body .navbar :is(.menu-btn, .menu-toggle):hover,
    body.site-interior .navbar .menu-toggle:hover,
    body :is(.routes .home-link, .birthday-page .home-link):hover,
    body .party-control:hover,
    body :is(button, a)[class~="action"]:hover,
    body :is(button, a)[class~="filter-button"]:hover {
      transform: translateY(-1px);
      border-color: #ffffff !important;
      box-shadow:
        0 0 0 1px #718e984d,
        0 2px 0 1px #ffffffeb,
        0 13px 25px -12px #314e5b45,
        inset 0 1px 2px #fff,
        inset 0 -2px 4px #819ca63d !important;
    }

    body :is(.btn:not(.hamburger-btn):not(.mobile-nav-button), .hero-btn, .cta-button,
      button.primary, a.primary, .story-pill, .launch-button, .birthday-nav-home, .oe-button):hover::after,
    body .navbar .menu-btn:hover::after,
    body .routes .home-link:hover::after,
    body .birthday-page .home-link:hover::after,
    body :is(button, a)[class~="action"]:not(.hamburger-btn):not(.mobile-nav-button):hover::after,
    body :is(button, a)[class~="filter-button"]:not(.hamburger-btn):not(.mobile-nav-button):hover::after {
      opacity: .76;
    }
  }

  body :is(.btn, .hero-btn, .cta-button, button.primary, a.primary, .story-pill,
    .launch-button, .birthday-nav-home, .oe-button):active,
  body .navbar :is(.menu-btn, .menu-toggle):active,
  body.site-interior .navbar .menu-toggle:active,
  body :is(.routes .home-link, .birthday-page .home-link):active,
  body .party-control:active,
  body :is(button, a)[class~="action"]:active,
  body :is(button, a)[class~="filter-button"]:active {
    transform: translateY(1px) scale(.985);
    box-shadow:
      0 0 0 1px #78949e45,
      0 1px 1px #fff,
      inset 0 2px 5px #526e7838,
      inset 0 1px 1px #ffffffc9 !important;
  }

  body :is(button, a)[disabled],
  body :is(button, a)[aria-disabled="true"] {
    opacity: .58;
    filter: saturate(.55);
    transform: none !important;
    cursor: not-allowed;
  }

  body :is(.btn, .hero-btn, .cta-button, button.primary, a.primary, .story-pill,
    .launch-button, .birthday-nav-home, .oe-button, .navbar .menu-btn, .navbar .menu-toggle,
    .routes .home-link, .birthday-page .home-link, .party-control,
    button[class~="action"], a[class~="action"],
    button[class~="filter-button"], a[class~="filter-button"]):focus-visible {
    outline: 3px solid var(--glass-focus) !important;
    outline-offset: 4px;
  }

  /* Compact navigation panes: a readable, lightly refractive sheet. */
  body .navbar.mobile-open .nav-links,
  body .navbar:has(.menu-btn).mobile-open .nav-links,
  body .mobile-menu.active {
    border: 1px solid #ffffff !important;
    background:
      linear-gradient(145deg, #f7fbfceF, #e2edf0e8) !important;
    box-shadow:
      0 1px 0 #fff,
      0 18px 46px #304d5a26,
      inset 0 1px 0 #fff,
      inset 0 -1px 0 #94adb533 !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.12);
    backdrop-filter: blur(16px) saturate(1.12);
  }

  body .navbar.mobile-open .nav-links a,
  body .mobile-menu.active a {
    border-radius: 10px;
    color: #344e58 !important;
  }

  body .navbar.mobile-open .nav-links a:is(:hover, [aria-current="page"]),
  body .mobile-menu.active a:is(:hover, [aria-current="page"]) {
    background: #dce8eb !important;
    color: #263d47 !important;
  }

  @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    body :is(.btn, .hero-btn, .cta-button, button.primary, a.primary, .story-pill,
      .launch-button, .birthday-nav-home, .oe-button),
    body .navbar :is(.menu-btn, .menu-toggle),
    body :is(.routes .home-link, .birthday-page .home-link),
    body .party-control,
    body :is(button, a)[class~="action"],
    body :is(button, a)[class~="filter-button"] {
      background: linear-gradient(145deg, #f5f9fa, #dce8eb) !important;
    }

    body .navbar.mobile-open .nav-links,
    body .navbar:has(.menu-btn).mobile-open .nav-links,
    body .mobile-menu.active {
      background: #edf3f4 !important;
    }
  }

  /* Opening panels and short feature surfaces only; prose, forms and data stay solid. */
  body.home-page .opening-inner,
  body.site-interior:not(.dogwalking-page):not(.workwear-page) :is(.hero, .page-header, .sf911-hero, .records-hero),
  body.site-interior.dogwalking-page .hero,
  body.site-interior.workwear-page #home,
  body.birthday-page .party-instrument,
  body.site-interior:not(.dogwalking-page):not(.workwear-page) :is(.card, .contact-option, .stats-grid article, .call-card, .trains-topic),
  body.site-interior.contact-page .security-q,
  body.site-interior:not(.dogwalking-page):not(.workwear-page) .support-sidebar {
    border-color: #ffffffd9 !important;
    background-image:
      radial-gradient(ellipse at 16% 0%, #ffffffb8 0%, #ffffff00 54%),
      linear-gradient(142deg, #edf4f5d9 0%, #dce8ebbd 48%, #f8fbfbc9 100%) !important;
    box-shadow:
      0 1px 0 #fff,
      0 14px 34px -18px #36535f35,
      inset 0 1px 0 #ffffffed,
      inset 0 -1px 0 #839da626 !important;
  }

  body.site-interior:not(.dogwalking-page):not(.workwear-page) :is(.card, .contact-option, .stats-grid article, .call-card, .trains-topic) {
    background-color: #eaf1f2 !important;
    background-image:
      radial-gradient(ellipse at 12% 0%, #ffffffc2 0%, #ffffff00 58%),
      linear-gradient(142deg, #f2f7f8 0%, #e6eef0 48%, #f8fbfb 100%) !important;
  }

  body.birthday-page .party-instrument {
    background-image:
      radial-gradient(ellipse at 14% -20%, #ffffffce 0%, #ffffff00 55%),
      linear-gradient(125deg, #e0eaed 0%, #e9f0f2 49%, #dce7ea 100%) !important;
  }

  /* Give the not-found illustration the same clear, cool-edged material. */
  body .wreck .glass {
    filter: drop-shadow(0 1px 1px #36596842);
  }
  body .glass-chip {
    background: linear-gradient(135deg, #ffffffed 0%, #bcd6df94 48%, #faffff 100%);
    border-color: #ffffffed;
    box-shadow: 0 6px 8px #36596835, inset 0 1px 2px #fff;
  }

  /* Preserve operational signals and semantic priority colors. */
  body.site-interior.page-sf911 :is(.map-filters, .map-shell, .map-legend, .live-status),
  body.site-interior.page-sf911 .priority-pill,
  body.site-interior.records-request-page :is(.records-warning, .records-privacy, .incident-summary),
  body :is(.alert, .sf911-notice, [role="alert"], [aria-invalid="true"]) {
    background-image: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  body.site-interior.page-sf911 .priority-pill {
    box-shadow: none !important;
  }

  /* Never glass native controls, record letters, tables, or large reading surfaces. */
  body :is(input, select, textarea, fieldset, .request-letter, table, th, td,
    .map-shell, .map-filters, .map-legend, .live-status) {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

@media screen and (prefers-reduced-motion: reduce) {
  body :is(.btn, .hero-btn, .cta-button, button.primary, a.primary, .story-pill,
    .launch-button, .birthday-nav-home, .oe-button, .navbar .menu-btn, .navbar .menu-toggle,
    .routes .home-link, .birthday-page .home-link, .party-control,
    button[class~="action"], a[class~="action"],
    button[class~="filter-button"], a[class~="filter-button"]),
  body :is(.btn:not(.hamburger-btn):not(.mobile-nav-button), .hero-btn, .cta-button,
    button.primary, a.primary, .story-pill, .launch-button, .birthday-nav-home, .oe-button)::after,
  body .routes .home-link::after,
  body.birthday-page .home-link::after,
  body :is(button, a)[class~="action"]:not(.hamburger-btn):not(.mobile-nav-button)::after,
  body :is(button, a)[class~="filter-button"]:not(.hamburger-btn):not(.mobile-nav-button)::after {
    transition: none !important;
  }
}

@media screen and (prefers-contrast: more), screen and (forced-colors: active) {
  body :is(.btn, .hero-btn, .cta-button, button.primary, a.primary, .story-pill,
    .launch-button, .birthday-nav-home, .oe-button,
    .navbar .menu-btn, .navbar .menu-toggle, .routes .home-link, .birthday-page .home-link, .party-control,
    button[class~="action"], a[class~="action"],
    button[class~="filter-button"], a[class~="filter-button"]) {
    border: 1px solid currentColor !important;
    color: CanvasText !important;
    background: Canvas !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  body :is(.btn, .hero-btn, .cta-button, button.primary, a.primary, .story-pill)::before,
  body :is(.btn, .hero-btn, .cta-button, button.primary, a.primary, .story-pill)::after,
  body .navbar .menu-btn::before,
  body .navbar .menu-btn::after,
  body .routes .home-link::before,
  body .routes .home-link::after,
  body :is(button, a)[class~="action"]::before,
  body :is(button, a)[class~="action"]::after,
  body :is(button, a)[class~="filter-button"]::before,
  body :is(button, a)[class~="filter-button"]::after {
    display: none !important;
    content: none !important;
  }

  body .navbar .menu-toggle::before { display: none !important; content: none !important; }
  body .navbar .menu-toggle::after {
    display: block !important;
    content: "Menu" !important;
    color: CanvasText !important;
  }

  body .navbar.mobile-open .nav-links,
  body .navbar:has(.menu-btn).mobile-open .nav-links,
  body .mobile-menu.active {
    border: 1px solid currentColor !important;
    color: CanvasText !important;
    background: Canvas !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  body :is(.btn, .hero-btn, .cta-button, button.primary, a.primary, .story-pill,
    .launch-button, .birthday-nav-home, .oe-button, .navbar .menu-btn, .navbar .menu-toggle,
    .routes .home-link, .birthday-page .home-link, .party-control,
    button[class~="action"], a[class~="action"],
    button[class~="filter-button"], a[class~="filter-button"])::before,
  body :is(.btn:not(.hamburger-btn):not(.mobile-nav-button), .hero-btn, .cta-button,
    button.primary, a.primary, .story-pill, .launch-button, .birthday-nav-home, .oe-button)::after,
  body .routes .home-link::after,
  body .birthday-page .home-link::after,
  body :is(button, a)[class~="action"]:not(.hamburger-btn):not(.mobile-nav-button)::after,
  body :is(button, a)[class~="filter-button"]:not(.hamburger-btn):not(.mobile-nav-button)::after {
    display: none !important;
    content: none !important;
  }

  body :is(.btn, .hero-btn, .cta-button, button.primary, a.primary, .story-pill,
    .launch-button, .birthday-nav-home, .oe-button, .navbar .menu-btn, .routes .home-link,
    .birthday-page .home-link, .party-control,
    button[class~="action"], a[class~="action"],
    button[class~="filter-button"], a[class~="filter-button"]) {
    color: CanvasText !important;
    background: Canvas !important;
  }
}
