:root {
  --bg: #eef7f1;
  --bg-soft: #f8fcf8;
  --card: rgba(255, 255, 255, 0.94);
  --ink: #17231d;
  --muted: #5d6f66;
  --line: rgba(31, 111, 74, 0.16);
  --brand: #1f6f4a;
  --brand-2: #256f91;
  --gold: #d9a441;
  --green: #2f7a4e;
  --red: #b24a3b;
  --orange: #c7792f;
  --blue: #256f91;
  --shadow: 0 18px 50px rgba(31, 111, 74, 0.14);
  --radius: 24px;
  --mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
  --mobile-bottom-nav-height: 76px;
  --mobile-nav-bottom-gap: max(10px, var(--mobile-safe-bottom));
  --mobile-content-bottom-breathing-room: 32px;
  --mobile-content-bottom-padding: calc(var(--mobile-bottom-nav-height) + var(--mobile-nav-bottom-gap) + var(--mobile-content-bottom-breathing-room));
  --mobile-fab-bottom: calc(var(--mobile-bottom-nav-height) + var(--mobile-nav-bottom-gap) + 24px);
  --safe-area-bottom: var(--mobile-safe-bottom);
  --bottom-nav-height: var(--mobile-bottom-nav-height);
  --bottom-nav-gap: var(--mobile-nav-bottom-gap);
  --mobile-page-bottom-breathing-room: var(--mobile-content-bottom-breathing-room);
  --mobile-page-bottom-padding: var(--mobile-content-bottom-padding);
  --sticky-action-height: 60px;
  --sticky-action-bar-offset: calc(var(--mobile-bottom-nav-height) + var(--mobile-nav-bottom-gap) + 12px);
  --fab-size: 58px;
  --fab-bottom-offset: var(--mobile-fab-bottom);
  --nav-height: var(--mobile-bottom-nav-height);
  color-scheme: light;
}

* { box-sizing: border-box; }
html {
  scroll-behavior: smooth;
  scroll-padding-bottom: var(--mobile-page-bottom-padding);
}
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at top left, rgba(95, 174, 123, 0.24), transparent 34rem),
    radial-gradient(circle at 100% 8%, rgba(73, 157, 191, 0.15), transparent 30rem),
    linear-gradient(180deg, #f5fbf7 0%, var(--bg) 48%, #dbeee4 100%);
  color: var(--ink);
  min-height: 100vh;
  min-height: 100dvh;
}

a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
button[disabled] { opacity: .48; cursor: not-allowed; }
[hidden] { display: none !important; }

.icon {
  width: var(--icon-size, 1.25rem);
  height: var(--icon-size, 1.25rem);
  display: inline-block;
  flex-shrink: 0;
  vertical-align: -0.125em;
}
.icon-sm { --icon-size: 1rem; }
.icon-md { --icon-size: 1.25rem; }
.icon-lg { --icon-size: 1.5rem; }
.icon-xl { --icon-size: 2.25rem; }

.app-shell {
  width: min(1120px, 100%);
  margin: 0 auto;
  padding: max(14px, env(safe-area-inset-top, 0px)) 14px var(--mobile-page-bottom-padding);
}
.app-shell.wide { width: min(1280px, 100%); }
.content {
  display: grid;
  gap: 18px;
  min-width: 0;
}
.content > * { min-width: 0; }

@media (max-width: 760px), (pointer: coarse) {
  body.authenticated-shell {
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
    overscroll-behavior: none;
  }

  body.authenticated-shell .app-shell {
    height: calc(100vh - var(--mobile-bottom-nav-height) - var(--mobile-nav-bottom-gap) - 8px);
    max-height: calc(100vh - var(--mobile-bottom-nav-height) - var(--mobile-nav-bottom-gap) - 8px);
    padding-top: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scroll-padding-bottom: var(--mobile-content-bottom-padding);
    -webkit-overflow-scrolling: touch;
  }

  body.authenticated-shell .topbar {
    margin: 0 -14px 10px;
    padding: max(10px, calc(env(safe-area-inset-top, 0px) + 8px)) 14px 12px;
    background: rgba(238,247,241,.84);
    border-bottom: 1px solid rgba(31,111,74,.10);
  }

  @supports (height: 100dvh) {
    body.authenticated-shell .app-shell {
      height: calc(100dvh - var(--mobile-bottom-nav-height) - var(--mobile-nav-bottom-gap) - 8px);
      max-height: calc(100dvh - var(--mobile-bottom-nav-height) - var(--mobile-nav-bottom-gap) - 8px);
    }
  }
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0 14px;
  backdrop-filter: blur(18px);
}
.brand { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.brand strong { display: block; font-size: 16px; line-height: 1; }
.brand small { display: block; color: var(--muted); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-size: 10px; margin-top: 3px; }
.crest {
  width: 42px; height: 42px; border-radius: 14px;
  display: inline-grid; place-items: center;
  color: #eef7f1; font-family: Georgia, serif; font-size: 24px; font-weight: 800;
  background: linear-gradient(145deg, var(--brand), #256f91);
  box-shadow: 0 8px 24px rgba(31, 111, 74, 0.22), inset 0 0 0 2px rgba(255,255,255,.2);
  flex: none;
}
.crest.large { width: 72px; height: 72px; border-radius: 24px; font-size: 42px; }
.top-actions { display: flex; align-items: center; gap: 8px; }
.notification-link {
  width: 40px; height: 40px; border-radius: 14px; background: var(--card); border: 1px solid var(--line);
  display: inline-grid; place-items: center; position: relative; box-shadow: 0 8px 24px rgba(31,111,74,.08);
  padding: 0;
  line-height: 0;
  text-align: center;
  -webkit-appearance: none;
  appearance: none;
}
.notification-link > .icon { --icon-size: 1.25rem; }
.notification-link span { position: absolute; right: -4px; top: -4px; background: var(--red); color: white; font-size: 10px; border-radius: 999px; min-width: 18px; height: 18px; display: grid; place-items: center; font-weight: 800; }
.icon-button {
  width: 44px;
  height: 44px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: var(--card);
  color: var(--brand);
  display: inline-grid;
  place-items: center;
  box-shadow: 0 8px 24px rgba(31,111,74,.08);
  font-size: 20px;
  font-weight: 950;
  cursor: pointer;
}
.icon-button:hover, .icon-button:focus-visible { background: #ffffff; border-color: rgba(31,111,74,.28); outline: none; }
.quick-top-action,
.notification-settings-trigger {
  padding: 0;
  line-height: 0;
  text-align: center;
  -webkit-appearance: none;
  appearance: none;
}
.notification-link > .icon,
.quick-top-action > .icon,
.notification-settings-trigger > .icon {
  display: block;
  margin: auto;
  vertical-align: middle;
}
.user-menu { position: relative; }
.user-menu summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 44px;
  min-height: 44px;
  background: var(--card);
  border: 1px solid var(--line);
  padding: 6px 10px 6px 6px;
  border-radius: 999px;
  box-shadow: 0 8px 24px rgba(31,111,74,.08);
  font-weight: 800;
}
.user-menu summary::-webkit-details-marker { display: none; }
.menu-card { position: absolute; right: 0; top: calc(100% + 10px); width: 260px; background: #f8fcf8; border: 1px solid var(--line); border-radius: 20px; padding: 12px; box-shadow: var(--shadow); display: grid; gap: 6px; }
.menu-card a, .menu-card button { display: block; width: 100%; text-align: left; border: 0; border-radius: 14px; background: transparent; padding: 10px; color: var(--ink); }
.menu-card a:hover, .menu-card button:hover { background: rgba(31,111,74,.06); }
.menu-identity { padding: 10px; border-bottom: 1px solid var(--line); }
.menu-identity span { display: block; color: var(--muted); font-size: 13px; margin-top: 2px; }

.avatar { --avatar: #7c3aed; --avatar-position: center center; --avatar-scale: 1; width: 34px; height: 34px; border-radius: 999px; display: inline-grid; place-items: center; background: var(--avatar); color: white; font-weight: 900; font-size: 12px; box-shadow: inset 0 0 0 2px rgba(255,255,255,.38); flex: none; overflow: hidden; position: relative; }
.avatar.tiny { width: 26px; height: 26px; font-size: 10px; }
.avatar.large { width: 72px; height: 72px; font-size: 23px; box-shadow: inset 0 0 0 3px rgba(255,255,255,.44), 0 12px 30px rgba(31,111,74,.16); }
.avatar.image img { width: 100%; height: 100%; object-fit: cover; object-position: var(--avatar-position); transform: scale(var(--avatar-scale)); transform-origin: var(--avatar-position); display: block; }
.avatar.image { background: #f8fcf8; }
.user-pill, .claim-stack { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-weight: 750; }
.claim-stack .avatar + .avatar { margin-left: -12px; }

.hero-card, .detail-hero, .event-detail-hero, .equipment-detail-hero, .project-detail-hero {
  border: 1px solid var(--line);
  border-radius: 30px;
  padding: clamp(20px, 4vw, 34px);
  background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(225,242,246,.92));
  box-shadow: var(--shadow);
  overflow: hidden;
}
.hero-card { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; }
.eyebrow { color: var(--brand-2); text-transform: uppercase; letter-spacing: .12em; font-size: 11px; font-weight: 950; margin: 0 0 8px; }
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: clamp(30px, 7vw, 56px); line-height: .96; letter-spacing: -.045em; margin-bottom: 12px; }
h2 { font-size: clamp(20px, 4vw, 28px); letter-spacing: -.03em; margin-bottom: 12px; }
h3 { font-size: 18px; letter-spacing: -.02em; margin-bottom: 8px; }
p { color: var(--muted); line-height: 1.55; }
.hero-card p { max-width: 62ch; margin-bottom: 0; }
.hero-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.operational-header {
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 16px;
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(229,244,239,.88));
  box-shadow: 0 10px 30px rgba(31,111,74,.08);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
}
.operational-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.operational-copy .eyebrow { margin-bottom: 2px; }
.operational-copy h1 {
  font-size: clamp(24px, 4vw, 34px);
  line-height: 1.05;
  letter-spacing: -.035em;
  margin-bottom: 0;
}
.operational-copy p:not(.eyebrow) {
  margin: 0;
  max-width: 62ch;
  font-size: 14px;
  line-height: 1.4;
}
.operational-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}
.operational-actions .button.xl {
  min-height: 44px;
  border-radius: 16px;
  padding: 11px 16px;
}

.button {
  border: 0;
  border-radius: 16px;
  padding: 11px 16px;
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
  color: #f8fcf8;
  font-weight: 900;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  box-shadow: 0 10px 28px rgba(31,111,74,.18);
}
.button.secondary { background: #f8fcf8; color: var(--brand); border: 1px solid var(--line); box-shadow: none; }
.button.ghost { background: transparent; color: var(--brand); border: 1px dashed var(--line); box-shadow: none; }
.button.danger { background: #ab3b32; color: #fff; box-shadow: 0 10px 22px rgba(171,59,50,.20); }
.button.small { min-height: 34px; padding: 8px 11px; border-radius: 12px; font-size: 13px; }
.button.xl { min-height: 52px; border-radius: 18px; padding: 14px 20px; }
.button.full { width: 100%; }
.button.icon-text { white-space: nowrap; }
.button.disabled, .button[aria-disabled="true"], .button:disabled { opacity: .55; pointer-events: none; filter: grayscale(.15); }
.button.is-pending {
  opacity: .82;
  pointer-events: none;
  filter: none;
}
.button.is-pending::before {
  content: "";
  width: 1em;
  height: 1em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 999px;
  flex: 0 0 auto;
  animation: schild-spin .75s linear infinite;
}
form[data-schild-submitting="true"] button[type="submit"],
form[data-schild-submitting="true"] input[type="submit"] {
  pointer-events: none;
}

@keyframes schild-spin {
  to { transform: rotate(1turn); }
}

.flash-stack { display: grid; gap: 8px; margin: 4px 0 10px; }
.flash { padding: 12px 14px; border-radius: 16px; background: var(--card); border: 1px solid var(--line); font-weight: 800; }
.flash-success { border-color: rgba(47,122,78,.28); background: rgba(47,122,78,.08); color: #1f5938; }
.flash-error { border-color: rgba(171,59,50,.28); background: rgba(171,59,50,.08); color: #7f2923; }
.flash-info { border-color: rgba(54,94,145,.24); background: rgba(54,94,145,.08); color: #274976; }
.flash-invite {
  display: grid;
  gap: 10px;
  color: var(--ink);
  font-weight: 750;
}
.flash-invite-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}
.flash-invite-head strong,
.flash-invite-head span {
  display: block;
  overflow-wrap: anywhere;
}
.flash-invite-head span,
.flash-invite p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}
.invite-copy-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}
.invite-copy-field {
  min-height: 40px;
  border-color: rgba(31,111,74,.18);
  color: #254538;
  font-weight: 750;
}

.segmented { display: flex; gap: 8px; overflow-x: auto; padding: 4px; background: rgba(248,252,248,.68); border: 1px solid var(--line); border-radius: 18px; }
.segmented, .quick-starters {
  scrollbar-width: none;
  mask-image: linear-gradient(90deg, transparent 0, #000 14px, #000 calc(100% - 28px), transparent 100%);
}
.segmented::-webkit-scrollbar, .quick-starters::-webkit-scrollbar { display: none; }
.segmented a { flex: 0 0 auto; border-radius: 14px; padding: 10px 14px; color: var(--muted); font-weight: 900; }
.segmented a.active { background: var(--brand); color: #f8fcf8; }
.help-tabs.segmented {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  overflow: visible;
  mask-image: none;
  padding: 8px;
  border-radius: 24px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 14px 36px rgba(31,111,74,.10);
}
.help-tabs a { display: inline-flex; align-items: center; gap: 8px; }
.help-tabs.segmented a {
  justify-content: center;
  min-width: 0;
  min-height: 48px;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 16px;
  background: rgba(248,252,248,.62);
  color: #53675e;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.76);
  text-align: center;
  line-height: 1.1;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.help-tabs.segmented a:hover,
.help-tabs.segmented a:focus-visible {
  border-color: rgba(31,111,74,.28);
  color: var(--brand);
  background: rgba(255,255,255,.88);
}
.help-tabs.segmented a.active {
  border-color: transparent;
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
  color: #f8fcf8;
  box-shadow: 0 12px 28px rgba(31,111,74,.24);
}
.help-tabs a span { min-width: 22px; height: 22px; border-radius: 999px; display: inline-grid; place-items: center; padding: 0 6px; background: rgba(31,111,74,.10); color: var(--brand); font-size: 12px; }
.help-tabs a.active span { background: rgba(255,255,255,.22); color: #f8fcf8; }

.help-dashboard {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(260px, .9fr);
  gap: 16px;
  align-items: end;
  border: 1px solid var(--line);
  border-radius: 30px;
  padding: clamp(18px, 4vw, 30px);
  background:
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(230,246,238,.92)),
    radial-gradient(circle at top right, rgba(217,164,65,.18), transparent 18rem);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.help-dashboard h1 { margin-bottom: 10px; }
.help-dashboard p:not(.eyebrow) { max-width: 58ch; margin-bottom: 0; }
.help-dashboard .hero-actions { grid-column: 1 / -1; }
.help-stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.help-stat-grid a {
  display: grid;
  gap: 2px;
  padding: 12px;
  border-radius: 18px;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(31,111,74,.12);
}
.help-stat-grid strong { color: var(--brand); font-size: 26px; line-height: 1; }
.help-stat-grid span { color: var(--muted); font-size: 12px; font-weight: 850; }

.card-list { display: grid; gap: 12px; }
.card-list.compact { gap: 10px; }
.work-card, .project-card, .equipment-card, .more-card, .notification-card, .routine-card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 12px 34px rgba(31,111,74,.08);
  overflow: hidden;
}
.work-card { display: grid; gap: 0; position: relative; }
.card-main { display: block; padding: 16px; }
.card-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.meta-grid, .detail-meta { display: flex; flex-wrap: wrap; gap: 8px; color: var(--muted); font-size: 13px; font-weight: 800; }
.meta-grid span, .detail-meta span { padding: 7px 9px; border-radius: 999px; background: rgba(31,111,74,.05); }
.meta-icon-chip { display: inline-flex; align-items: center; gap: 5px; }
.card-action { padding: 0 16px 16px; }
.priority-ring-urgent { border-left: 6px solid var(--red); }
.priority-ring-high { border-left: 6px solid var(--orange); }
.priority-ring-normal { border-left: 6px solid var(--gold); }
.priority-ring-low { border-left: 6px solid var(--green); }

.priority, .status { border-radius: 999px; padding: 6px 9px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; font-weight: 950; }
.priority-low { background: rgba(47,122,78,.12); color: #1f5938; }
.priority-normal { background: rgba(217,164,65,.18); color: #7f5719; }
.priority-high { background: rgba(183,102,32,.15); color: #884911; }
.priority-urgent { background: rgba(171,59,50,.14); color: #7f2923; }
.status-open, .status-maybe, .status-reserved, .status-planning, .status-idea { background: rgba(54,94,145,.11); color: #274976; }
.status-fyi { background: rgba(31,111,74,.10); color: #1d5f3e; }
.status-claimed, .status-assigned, .status-scheduled, .status-active, .status-checked-out { background: rgba(217,164,65,.18); color: #7f5719; }
.status-done, .status-yes, .status-available { background: rgba(47,122,78,.12); color: #1f5938; }
.status-live { background: rgba(31,111,74,.17); color: #155c3a; }
.status-today { background: rgba(31,111,74,.08); color: #315b49; }
.status-canceled, .status-no, .status-unavailable, .status-under-maintenance, .status-archived { background: rgba(171,59,50,.12); color: #7f2923; }
.status-waiting { background: rgba(183,102,32,.13); color: #884911; }
.tone-danger { color: var(--red); }
.tone-warning { color: var(--orange); }
.tone-muted, .muted { color: var(--muted); }
.tiny { font-size: 12px; }

.two-col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.detail-grid { align-items: start; }
.panel { border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,255,255,.9); padding: 16px; box-shadow: 0 10px 30px rgba(31,111,74,.06); }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.panel-head h2 { margin: 0; }
.panel-head a { color: var(--brand-2); font-weight: 900; }
.disclosure-section {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(248,252,248,.78);
  margin-top: 12px;
  overflow: hidden;
}
.disclosure-section > summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 14px;
  cursor: pointer;
  min-height: 52px;
}
.disclosure-section > summary::-webkit-details-marker { display: none; }
.disclosure-section > summary:focus-visible {
  outline: 3px solid rgba(37,111,145,.35);
  outline-offset: -3px;
}
.disclosure-section > summary strong { display: block; }
.disclosure-summary {
  display: block;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
  margin-top: 2px;
}
.disclosure-edit {
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 7px 10px;
  color: var(--brand);
  background: #fff;
  font-size: 12px;
  font-weight: 950;
}
.disclosure-body {
  border-top: 1px solid var(--line);
  padding: 14px;
}
.disclosure-section[data-error-open="true"] {
  border-color: rgba(171,59,50,.45);
  box-shadow: 0 0 0 3px rgba(171,59,50,.08);
}
.disclosure-section[data-error-open="true"] > summary {
  background: rgba(171,59,50,.05);
}

.notification-hero { position: relative; overflow: visible; align-items: flex-start; }
.notification-hero-copy { display: grid; gap: 12px; padding-right: 58px; }
.notification-hero-copy .hero-actions { margin-top: 8px; }
.notification-settings-drawer {
  display: grid;
  justify-items: end;
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 45;
}
.notification-settings-drawer > summary {
  list-style: none;
}
.notification-settings-drawer > summary::-webkit-details-marker {
  display: none;
}
.notification-settings-drawer[open] > summary {
  margin-bottom: 10px;
}
.notification-settings-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: min(430px, calc(100vw - 44px));
  max-height: min(72vh, 680px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255,255,255,.985);
  padding: 16px;
  box-shadow: 0 18px 54px rgba(31,111,74,.18);
}
.notification-settings-panel h2 {
  margin-bottom: 12px;
}
.notification-settings-push { margin-bottom: 12px; }
.notification-settings-open .fab { display: none; }
.operational-actions .notification-settings-drawer {
  position: relative;
  top: auto;
  right: auto;
  z-index: 45;
}
.operational-actions .notification-settings-drawer[open] > summary {
  margin-bottom: 0;
}

.empty-state { border: 1px dashed rgba(31,111,74,.22); border-radius: 28px; padding: 34px 20px; text-align: center; background: rgba(248,252,248,.58); }
.empty-icon { width: 56px; height: 56px; margin: 0 auto 12px; border-radius: 20px; background: rgba(217,164,65,.2); display: grid; place-items: center; color: var(--brand); }
.empty-state p { max-width: 46ch; margin-left: auto; margin-right: auto; }

.form-shell { display: grid; grid-template-columns: .8fr 1.2fr; gap: 18px; align-items: start; }
.form-intro { padding: 22px 6px; }
.form-card, .login-card { border: 1px solid var(--line); border-radius: 28px; background: var(--card); padding: 18px; box-shadow: var(--shadow); }
.form-card,
.panel,
.rules-viewer,
.profile-photo-editor,
.detail-hero,
.event-detail-hero,
.equipment-detail-hero,
.project-detail-hero,
.work-card,
.project-card,
.equipment-card,
.more-card {
  scroll-margin-bottom: var(--mobile-page-bottom-padding);
}
.login-card.welcome-pass {
  position: relative;
  overflow: hidden;
  display: grid;
  gap: 14px;
  padding: 20px;
}
.login-card.welcome-pass::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 92px;
  background:
    radial-gradient(circle at 18% 18%, rgba(217,164,65,.20), transparent 34px),
    linear-gradient(135deg, rgba(31,111,74,.10), rgba(37,111,145,.08));
  pointer-events: none;
}
.welcome-pass-head,
.auth-method-stack,
.login-card.welcome-pass > .tiny,
.login-card.welcome-pass > .flash {
  position: relative;
  z-index: 1;
}
.welcome-pass-head {
  display: grid;
  gap: 7px;
}
.welcome-pass-head h2 {
  margin: 0;
  font-size: clamp(28px, 5vw, 36px);
  letter-spacing: -.03em;
}
.welcome-pass-head p { margin-bottom: 0; }
.welcome-pass-kicker,
.auth-helper-badge {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  border-radius: 999px;
  padding: 5px 9px;
  background: rgba(217,164,65,.18);
  color: #725013;
  border: 1px solid rgba(217,164,65,.24);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.auth-method-stack { display: grid; gap: 12px; }
.auth-divider { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: center; color: var(--muted); font-size: 12px; font-weight: 900; text-transform: uppercase; }
.auth-divider::before, .auth-divider::after { content: ""; height: 1px; background: var(--line); }
.oauth-button { background: #ffffff; color: #1f2937; border: 1px solid var(--line); box-shadow: none; }
.passkey-block {
  display: grid;
  gap: 8px;
}
.passkey-primary {
  gap: 10px;
  min-height: 58px;
  border-radius: 20px;
  background: linear-gradient(135deg, var(--brand), #1f7d68);
  box-shadow: 0 16px 34px rgba(31,111,74,.28);
}
.oauth-group {
  display: grid;
  gap: 9px;
}
.auth-group-label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.oauth-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 8px;
}
.auth-provider {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  justify-content: stretch;
  justify-items: start;
  text-align: left;
  min-height: 46px;
  padding: 10px 12px;
}
.provider-chip {
  width: 100%;
  min-height: 50px;
  padding: 10px 9px;
  border-radius: 18px;
  display: inline-flex;
  justify-content: center;
  text-align: center;
  gap: 8px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 8px 22px rgba(31,111,74,.06);
}
.provider-chip:hover,
.provider-chip:focus-visible {
  border-color: rgba(31,111,74,.28);
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(31,111,74,.10);
}
.auth-provider span:last-child { align-self: center; }
.auth-mark {
  width: 28px;
  height: 28px;
  border-radius: 10px;
  display: inline-grid;
  place-items: center;
  font-size: 12px;
  font-weight: 950;
  line-height: 1;
  background: rgba(31,111,74,.08);
  color: var(--brand);
  border: 1px solid rgba(31,111,74,.12);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.6);
}
.provider-google .auth-mark { background: #ffffff; color: #1f2937; border-color: rgba(66,133,244,.28); }
.provider-yahoo .auth-mark { background: #f3eafe; color: #5f01d1; border-color: rgba(95,1,209,.24); }
.provider-microsoft .auth-mark { background: #eef6ff; color: #256f91; border-color: rgba(37,111,145,.22); }
.passkey-mark {
  background: rgba(248,252,248,.94);
  color: var(--brand);
  border-color: rgba(248,252,248,.72);
}
.password-panel {
  display: grid;
  gap: 10px;
}
.password-toggle {
  justify-content: space-between;
  gap: 10px;
  border-radius: 18px;
  background: rgba(248,252,248,.92);
  scroll-margin-top: 92px;
}
.password-toggle::after {
  content: "+";
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: rgba(31,111,74,.08);
}
.password-toggle[aria-expanded="true"]::after { content: "-"; }
.password-form {
  padding-top: 2px;
}
.stacked-form, .compact-form { display: grid; gap: 12px; }
.mobile-form-section {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 22px;
  background: rgba(248,252,248,.62);
}
.mobile-form-section + .mobile-form-section { margin-top: 2px; }
.mobile-form-section-head { display: grid; gap: 3px; }
.mobile-form-section-head h2 { margin: 0; font-size: 19px; line-height: 1.1; }
.mobile-form-section-head p { margin: 0; color: var(--muted); font-size: 13px; font-weight: 700; line-height: 1.35; }
.mobile-form-section-body { display: grid; gap: 12px; }
.disclosure-section.mobile-form-section { padding: 0; gap: 0; background: rgba(248,252,248,.62); }
.disclosure-section.mobile-form-section > summary { border-radius: 22px; }
.disclosure-section.mobile-form-section .disclosure-body { display: grid; gap: 12px; }
.mobile-form-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  padding-top: 2px;
}
.mobile-form-actions .button { width: 100%; min-height: var(--sticky-action-height); justify-content: center; }
.calendar-event-form > .mobile-form-actions {
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
  align-items: stretch;
}
.calendar-event-form > .mobile-form-actions .button {
  min-height: 52px;
}
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.choice-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.choice-card {
  position: relative;
  display: grid;
  gap: 8px;
  min-height: 104px;
  align-items: start;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #ffffff;
  cursor: pointer;
}
.choice-card input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.choice-card > span {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.choice-card strong {
  display: block;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.15;
}
.choice-card small {
  display: block;
  color: var(--muted);
  font-size: 14px;
  font-weight: 750;
  line-height: 1.35;
}
.choice-card:has(input:focus-visible) {
  outline: 3px solid rgba(37,111,145,.24);
  outline-offset: 2px;
}
.choice-card:has(input:checked),
.choice-card.selected {
  border-color: rgba(31,111,74,.42);
  background: linear-gradient(135deg, rgba(31,111,74,.08), rgba(212,235,243,.50));
  box-shadow: 0 10px 26px rgba(31,111,74,.10);
}
.attendance-mode-field {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.attendance-mode-field > legend {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.attendance-mode-grid {
  gap: 12px;
}
.field { display: grid; gap: 7px; color: var(--ink); font-weight: 850; min-width: 0; }
.field b { color: var(--red); }
.required-note { margin: 0; color: var(--muted); font-size: 13px; font-weight: 800; }
.required-note b { color: var(--red); }
.field input, .field textarea, .field select, .inline-form input, .inline-form select, .inline-form textarea, .comment-form textarea {
  width: 100%; min-width: 0; min-height: 44px; border: 1px solid var(--line); background: #ffffff; color: var(--ink); border-radius: 16px; padding: 12px 13px; outline: none;
}
.field .choice-card input[type="radio"] {
  width: 1px;
  min-height: 0;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
  background: transparent;
}
.field.has-error input,
.field.has-error textarea,
.field.has-error select { border-color: rgba(171,59,50,.65); box-shadow: 0 0 0 3px rgba(171,59,50,.10); }
.field textarea, textarea { min-height: 110px; resize: vertical; }
.field small, .check-field small { color: var(--muted); font-size: 12px; font-weight: 650; }
.field small.field-error { color: var(--red); font-weight: 850; }
.form-error-summary { border: 1px solid rgba(171,59,50,.24); background: rgba(171,59,50,.08); color: #7f2923; border-radius: 18px; padding: 12px; display: grid; gap: 6px; }
.form-error-summary ul { margin: 0; padding-left: 18px; }
.check-field { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start; min-height: 48px; padding: 12px; border: 1px solid var(--line); border-radius: 16px; background: rgba(248,252,248,.75); font-weight: 850; }
.check-field input[type="checkbox"], .mini-check input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--brand); }
.check-field small { grid-column: 2; }
.assignee-field { display: grid; gap: 10px; margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: 16px; background: rgba(248,252,248,.75); }
.assignee-field legend { padding: 0 6px; font-weight: 900; color: var(--ink); }
.assignee-field > small { color: var(--muted); font-size: 12px; font-weight: 650; }
.assignee-search { margin: 0; }
.assignee-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.assignee-option { display: flex; gap: 8px; align-items: flex-start; padding: 10px; border: 1px solid rgba(31,111,74,.14); border-radius: 14px; background: #fff; font-weight: 850; }
.assignee-option input { margin-top: 3px; }
.assignee-option small { display: block; color: var(--muted); font-size: 11px; font-weight: 750; margin-top: 2px; }
.person-chip-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.assignee-field .person-chip-grid {
  max-height: 248px;
  overflow: auto;
  padding-right: 2px;
  scrollbar-gutter: stable;
}
.person-chip { position: relative; display: block; cursor: pointer; }
.person-chip.is-filtered { display: none; }
.person-chip input { position: absolute; opacity: 0; pointer-events: none; }
.person-chip span {
  min-height: 48px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1px 8px;
  align-items: center;
  padding: 9px 10px;
  border-radius: 16px;
  border: 1px solid rgba(31,111,74,.14);
  background: #fff;
  box-shadow: 0 6px 18px rgba(31,111,74,.04);
}
.person-chip .avatar { grid-row: 1 / span 2; }
.person-chip strong { line-height: 1.1; overflow-wrap: anywhere; }
.person-chip small { color: var(--muted); font-size: 11px; font-weight: 800; }
.person-chip.selected span, .person-chip input:focus-visible + span {
  border-color: rgba(31,111,74,.45);
  background: rgba(31,111,74,.08);
  box-shadow: inset 0 0 0 1px rgba(31,111,74,.16);
}
.starter-block { display: grid; gap: 8px; }
.starter-block > span { color: var(--muted); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .08em; }
.quick-starters { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; }
.quick-starters button {
  flex: 0 0 auto;
  border: 1px solid rgba(31,111,74,.16);
  background: rgba(255,255,255,.9);
  color: var(--brand);
  border-radius: 999px;
  min-height: 44px;
  padding: 10px 12px;
  font-weight: 900;
}
.quick-starters button.active {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
}
.quick-starters button:focus-visible { outline: 3px solid rgba(37,111,145,.22); }
.file-upload-field { position: relative; }
.file-upload-field.has-error .file-upload-control { border-color: rgba(171,59,50,.65); box-shadow: 0 0 0 3px rgba(171,59,50,.10); }
.file-upload-control {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 56px;
  padding: 10px;
  border: 1px dashed rgba(31,111,74,.32);
  border-radius: 18px;
  background: #f8fcf8;
  cursor: pointer;
}
.file-upload-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  border-radius: 14px;
  padding: 9px 12px;
  background: rgba(31,111,74,.10);
  color: var(--brand);
  font-weight: 950;
}
.file-upload-control small {
  min-width: 0;
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.file-upload-field:focus-within .file-upload-control {
  outline: 3px solid rgba(37,111,145,.22);
  outline-offset: 2px;
}
.native-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 1px;
  opacity: 0;
  overflow: hidden;
}
.file-preview-list { display: grid; gap: 8px; margin-top: 8px; }
.file-preview-item {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 10px;
  align-items: center;
  min-height: 48px;
  padding: 8px;
  border-radius: 14px;
  background: rgba(31,111,74,.05);
  border: 1px solid rgba(31,111,74,.12);
  color: var(--muted);
  font-weight: 800;
  overflow: hidden;
}
.file-preview-item img { width: 42px; height: 42px; border-radius: 12px; object-fit: cover; background: #fff; }
.file-preview-item span { overflow-wrap: anywhere; }
.inline-form { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; }
.comment-form { display: grid; gap: 10px; }
.form-card > form.stacked-form,
.panel > form.stacked-form,
.disclosure-body > form.stacked-form,
.comment-form,
.inline-form {
  scroll-margin-bottom: var(--mobile-page-bottom-padding);
}
.comments { display: grid; gap: 10px; margin-top: 12px; }
.comments article { padding: 12px; border-radius: 16px; background: rgba(31,111,74,.04); }
.comments small { display: block; color: var(--muted); margin: 3px 0 6px; }
.warning-note { border-radius: 16px; padding: 12px; background: rgba(183,102,32,.1); color: #884911; font-weight: 850; }

.login-shell { min-height: calc(100vh - 80px); display: grid; grid-template-columns: 1fr 420px; gap: 24px; align-items: center; }
.login-brand h1 { max-width: 560px; }
.login-shell-visual {
  position: relative;
  isolation: isolate;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 420px) minmax(0, .55fr);
  gap: 0;
  min-height: calc(100vh - 116px);
  padding: clamp(18px, 3vw, 30px);
  border: 1px solid rgba(31, 111, 74, .18);
  border-radius: 34px;
  background: #dceee4;
  box-shadow: 0 24px 70px rgba(31, 111, 74, .18);
  overflow: hidden;
}
.login-shell-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(238, 247, 241, .30), rgba(238, 247, 241, .04) 40%, rgba(238, 247, 241, .18)),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(31,111,74,.06));
  pointer-events: none;
}
.login-art {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
.login-art img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  filter: saturate(1.05) contrast(1.03);
  pointer-events: none;
}
.login-panel {
  position: relative;
  z-index: 2;
  grid-column: 2;
  display: grid;
  gap: 14px;
  width: 100%;
  max-width: 420px;
}
.login-shell-visual .login-brand {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 6px 14px;
  padding: 16px 18px;
  border: 1px solid rgba(31, 111, 74, .16);
  border-radius: 26px;
  background: rgba(255, 255, 255, .86);
  box-shadow: 0 16px 42px rgba(31, 111, 74, .12);
  backdrop-filter: blur(12px);
}
.login-shell-visual .login-brand > :first-child {
  grid-row: 1 / span 2;
}
.login-shell-visual .login-brand h1 {
  grid-column: 2;
  max-width: none;
  margin-bottom: 0;
  font-size: 42px;
  line-height: 1;
  letter-spacing: 0;
}
.login-shell-visual .login-brand p {
  grid-column: 2;
  margin-bottom: 0;
  color: var(--muted);
  font-weight: 750;
}
.login-shell-visual .login-card {
  background: rgba(255, 255, 255, .94);
  border-color: rgba(31, 111, 74, .16);
  box-shadow: 0 18px 54px rgba(31, 111, 74, .14);
  backdrop-filter: blur(16px);
}
.login-shell-visual .login-card.welcome-pass {
  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,252,248,.94)),
    radial-gradient(circle at 20% 0%, rgba(217,164,65,.18), transparent 120px);
  border-color: rgba(31,111,74,.18);
  box-shadow: 0 18px 54px rgba(31,111,74,.16);
}

.calendar-agenda-header {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .9fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(31,111,74,.14);
  border-radius: 22px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 14px 38px rgba(31,111,74,.10);
}
.calendar-header-copy { display: grid; gap: 4px; min-width: 0; }
.calendar-header-copy .eyebrow { margin: 0; }
.calendar-header-copy p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: 13px; font-weight: 750; line-height: 1.35; }
.calendar-header-title { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px 10px; }
.calendar-header-title h1 { margin: 0; font-size: clamp(28px, 4vw, 42px); line-height: 1; }
.calendar-header-title span {
  border-radius: 999px;
  padding: 6px 10px;
  background: rgba(31,111,74,.08);
  color: var(--brand);
  font-size: 13px;
  font-weight: 950;
}
.calendar-header-actions {
  display: grid;
  grid-template-columns: max-content max-content;
  gap: 8px;
  justify-content: end;
}
.calendar-header-actions .button { min-height: 44px; }
.calendar-view-tabs { flex: 0 1 auto; }
.calendar-board-panel { display: grid; gap: 12px; overflow: hidden; }
.calendar-board-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}
.calendar-board-head > div { text-align: center; min-width: 0; }
.calendar-board-head h2 { margin-bottom: 0; }
.calendar-weekdays {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 950;
  text-align: center;
  text-transform: uppercase;
}
.month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}
.month-day {
  min-height: 132px;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 18px;
  background: rgba(255,255,255,.78);
  padding: 10px;
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
  color: inherit;
}
.month-day.blank { background: transparent; border: 0; }
.month-day.today { border-color: rgba(217,164,65,.46); box-shadow: inset 0 0 0 2px rgba(217,164,65,.12); }
.month-day.selected {
  border-color: rgba(37,111,145,.42);
  background: rgba(37,111,145,.08);
  box-shadow: inset 0 0 0 2px rgba(37,111,145,.12);
}
.month-day:hover,
.month-day:focus-visible {
  outline: 3px solid rgba(37,111,145,.22);
  outline-offset: 2px;
}
.month-day-number { display: flex; justify-content: space-between; gap: 6px; align-items: center; font-weight: 950; }
.month-day-number strong {
  border-radius: 999px;
  padding: 3px 6px;
  background: rgba(217,164,65,.18);
  color: #68450f;
  font-size: 10px;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.month-day-events { display: grid; gap: 5px; min-width: 0; }
.event-dot-row { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; min-height: 12px; }
.event-dot-row span {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--brand);
}
.event-dot-row em {
  font-style: normal;
  color: var(--brand);
  font-size: 11px;
  font-weight: 950;
  line-height: 1;
}
.month-day-count {
  justify-self: start;
  border-radius: 999px;
  padding: 3px 7px;
  background: rgba(31,111,74,.08);
  color: var(--brand);
  font-size: 11px;
  font-weight: 950;
}
.calendar-event-pill {
  display: grid;
  gap: 1px;
  min-width: 0;
  border-radius: 12px;
  padding: 7px 8px;
  background: rgba(31,111,74,.08);
  border: 1px solid rgba(31,111,74,.10);
  color: var(--ink);
}
.calendar-event-pill span {
  color: var(--brand-2);
  font-size: 11px;
  font-weight: 950;
}
.calendar-event-pill strong {
  font-size: 12px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.empty-day { color: rgba(92,111,100,.72); font-size: 12px; font-weight: 750; }
.year-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.year-month-card {
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 20px;
  padding: 12px;
  background: rgba(255,255,255,.78);
  min-width: 0;
  display: grid;
  gap: 8px;
  color: inherit;
}
.year-month-card:hover,
.year-month-card:focus-visible {
  outline: 3px solid rgba(37,111,145,.22);
  outline-offset: 2px;
}
.year-month-title { display: inline-flex; color: var(--brand); font-weight: 950; }
.year-month-count {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  align-items: baseline;
  gap: 4px;
  border-radius: 999px;
  padding: 7px 10px;
  background: rgba(31,111,74,.08);
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.year-month-count strong { color: var(--brand); font-size: 18px; line-height: 1; }
.year-month-next { color: var(--muted); font-size: 13px; font-weight: 750; line-height: 1.35; overflow-wrap: anywhere; }
.mini-weekdays, .mini-month-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; }
.mini-weekdays span { text-align: center; color: var(--muted); font-size: 10px; font-weight: 950; }
.mini-day {
  min-height: 26px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  position: relative;
}
.mini-day.blank { background: transparent; }
.mini-day.has-events { background: rgba(31,111,74,.09); color: var(--brand); }
.mini-day.has-events::after {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: var(--gold);
  position: absolute;
  bottom: 3px;
}
.mini-day.today { outline: 2px solid rgba(217,164,65,.34); outline-offset: 1px; }
.calendar-subscribe-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
}
.calendar-subscribe-panel h2 { margin-bottom: 6px; }
.calendar-subscribe-panel p { margin-bottom: 0; }
.calendar-subscribe-actions { display: flex; flex-wrap: wrap; justify-content: end; gap: 8px; }
.calendar-subscribe-fallback {
  grid-column: 1 / -1;
  border: 1px solid rgba(217,164,65,.30);
  border-radius: 16px;
  padding: 10px 12px;
  background: rgba(217,164,65,.12);
  color: #735114;
  font-weight: 850;
}
.calendar-subscribe-guide {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.calendar-subscribe-guide article {
  border: 1px solid rgba(31,111,74,.13);
  border-radius: 18px;
  padding: 12px;
  background: rgba(248,252,248,.78);
}
.calendar-subscribe-guide strong,
.calendar-subscribe-guide span {
  display: block;
}
.calendar-subscribe-guide strong { color: var(--ink); margin-bottom: 4px; }
.calendar-subscribe-guide span { color: var(--muted); font-size: 13px; font-weight: 750; line-height: 1.45; }
.calendar-subscribe-backdrop { z-index: 58; padding-bottom: max(14px, var(--safe-area-bottom)); }
.calendar-subscribe-sheet.calendar-subscribe-panel {
  display: grid;
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: 14px;
  max-height: min(720px, calc(100dvh - 28px));
  overflow: auto;
}
.calendar-subscribe-sheet .calendar-subscribe-actions { justify-content: start; }
.calendar-subscribe-sheet .copy-url-field { min-height: 44px; }
.copy-url-field {
  grid-column: 1 / -1;
  width: 100%;
  font-size: 13px;
  color: var(--muted);
  background: rgba(248,252,248,.72);
}
.month-agenda {
  margin-top: 6px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}
.month-agenda h3 { margin-bottom: 10px; }
.month-agenda-list { display: grid; gap: 8px; }
.month-agenda-list a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 16px;
  background: rgba(255,255,255,.74);
  padding: 9px;
}
.month-agenda-list strong { display: block; color: var(--ink); overflow-wrap: anywhere; }
.month-agenda-list small { display: block; color: var(--muted); margin-top: 2px; font-weight: 750; }
.month-agenda-empty { border-top: 1px solid var(--line); padding-top: 14px; margin-bottom: 0; }
.selected-day-agenda {
  display: grid;
  gap: 10px;
  margin-top: 6px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}
.selected-day-head { display: grid; gap: 2px; }
.selected-day-head .eyebrow { margin: 0; }
.selected-day-head h3 { margin: 0; }

.event-card .card-main { display: grid; grid-template-columns: auto 1fr; gap: 14px; }
.event-card-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.event-card-actions .button {
  flex: 1 1 118px;
  justify-content: center;
}
.event-card-time { margin-left: auto; white-space: nowrap; }
.event-card-image,
.event-agenda-thumb {
  overflow: hidden;
  border: 1px solid rgba(31,111,74,.16);
  background: rgba(225,242,246,.72);
  box-shadow: 0 10px 26px rgba(31,111,74,.14);
}
.event-card-image {
  width: 72px;
  height: 72px;
  border-radius: 20px;
}
.event-agenda-thumb {
  width: 44px;
  height: 44px;
  border-radius: 14px;
}
.event-card-image img,
.event-agenda-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.date-badge { width: 58px; height: 64px; border-radius: 18px; background: var(--brand); color: #f8fcf8; display: grid; place-items: center; box-shadow: 0 10px 26px rgba(31,111,74,.18); }
.date-badge strong { font-size: 24px; line-height: .8; }
.date-badge span { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; font-weight: 900; }
.date-badge.large { width: 84px; height: 92px; border-radius: 26px; }
.date-badge.large strong { font-size: 38px; }
.date-badge.tiny { width: 46px; height: 50px; border-radius: 14px; box-shadow: none; }
.date-badge.tiny strong { font-size: 18px; }
.date-badge.tiny span { font-size: 9px; }
.event-detail-hero, .equipment-detail-hero { display: flex; gap: 18px; align-items: center; }
.event-detail-hero.has-event-image {
  display: grid;
  grid-template-columns: minmax(220px, 36%) auto minmax(0, 1fr);
  align-items: center;
  padding: 14px;
}
.event-hero-image {
  aspect-ratio: 16 / 10;
  min-height: 240px;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid rgba(31,111,74,.12);
  background: rgba(225,242,246,.72);
}
.event-hero-image.compact { min-height: 170px; }
.event-hero-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.event-detail-hero.has-event-image > div:last-child {
  padding: clamp(8px, 2vw, 16px);
  align-self: center;
}
.event-detail-summary {
  gap: 14px;
  align-items: center;
}
.event-detail-summary.has-event-image {
  grid-template-columns: minmax(180px, 28%) auto minmax(0, 1fr);
}
.event-summary-copy { display: grid; gap: 6px; min-width: 0; }
.event-summary-copy h1 { margin: 0; }
.event-summary-copy p { margin: 0; }
.event-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.event-stats.fyi-event-stats { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.event-stats div { border: 1px solid var(--line); border-radius: 22px; padding: 18px; background: var(--card); text-align: center; }
.event-stats strong { display: block; font-size: 30px; }
.event-stats span { color: var(--muted); font-weight: 850; }
.fyi-notice {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  border: 1px solid rgba(31,111,74,.16);
  border-radius: 20px;
  padding: 14px;
  background: linear-gradient(135deg, rgba(31,111,74,.07), rgba(225,242,246,.72));
}
.fyi-notice p { margin: 3px 0 0; }
.rsvp-list, .item-list, .vendor-list, .decision-list, .mini-list { display: grid; gap: 10px; }
.rsvp-list article, .item-row, .vendor-list article, .decision-list article, .mini-list a, .mini-list article { border: 1px solid var(--line); border-radius: 18px; padding: 12px; background: rgba(248,252,248,.62); }
.item-row { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: start; }
.item-row small, .mini-list span, .decision-list small, .vendor-list small { display: block; color: var(--muted); font-weight: 750; margin-top: 3px; }
.item-actions { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; justify-content: end; }
.event-task-more.action-more > div { min-width: 180px; }
.event-image-field {
  border: 1px solid rgba(31,111,74,.14);
  border-radius: 20px;
  padding: 14px;
  background: rgba(248,252,248,.78);
}
.event-image-preview {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 16 / 10;
  border: 1px solid rgba(31,111,74,.16);
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(225,242,246,.72), rgba(255,255,255,.92));
  margin: 2px 0 12px;
}
.event-image-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.event-image-empty {
  display: grid;
  gap: 4px;
  padding: 18px;
  text-align: center;
}
.event-image-empty strong {
  color: var(--brand);
}
.event-image-empty span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
  line-height: 1.4;
}
.event-image-picker-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.current-event-image {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  margin-bottom: 12px;
}
.current-event-image img {
  width: 96px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  border: 1px solid rgba(31,111,74,.16);
}
.current-event-image strong,
.current-event-image span {
  display: block;
}
.current-event-image span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
  overflow-wrap: anywhere;
}
.event-plan-panel .panel-head { align-items: flex-start; }
.event-plan-panel .panel-head p { margin: 4px 0 0; max-width: 64ch; }
.event-task-list { display: grid; gap: 10px; }
.event-task-card { background: #fff; border-color: rgba(31,111,74,.13); }
.event-task-card.is-canceled { opacity: .72; }
.event-task-main { display: grid; gap: 9px; min-width: 0; }
.event-task-main h3 { margin: 0; }
.event-task-main p { margin: 0; }
.event-task-compact-detail {
  color: var(--muted);
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.event-task-mini-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.event-task-mini-meta span {
  border-radius: 999px;
  background: rgba(31,111,74,.07);
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  padding: 6px 9px;
}
.task-card-top { display: flex; gap: 7px; flex-wrap: wrap; align-items: center; }
.slot-pill {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  border-radius: 999px;
  padding: 6px 10px;
  border: 1px solid rgba(31,111,74,.13);
  background: rgba(31,111,74,.06);
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.slot-pill strong { color: var(--brand); font-size: 14px; }
.slot-pill.open { background: rgba(37,111,145,.09); border-color: rgba(37,111,145,.22); }
.event-task-people { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 2px; }
.event-task-people > div { border: 1px solid rgba(31,111,74,.10); border-radius: 14px; padding: 9px; background: rgba(248,252,248,.68); min-width: 0; }
.event-task-people strong { display: block; margin-bottom: 6px; font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.assignee-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.assignee-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 4px 8px 4px 5px; border-radius: 999px; background: rgba(31,111,74,.07); color: var(--ink); font-weight: 800; font-size: 12px; }
.assignee-chip span:last-child { overflow-wrap: anywhere; }
.assignee-chip.outside { background: rgba(217,164,65,.16); color: #68450f; }
.outside-mark { width: 22px; height: 22px; border-radius: 999px; display: inline-grid; place-items: center; background: rgba(255,255,255,.76); color: #68450f; font-size: 11px; font-weight: 950; text-transform: uppercase; }
.task-full-note { color: var(--muted); font-size: 12px; font-weight: 900; align-self: center; }
.locked-field { min-height: 100%; border: 1px solid var(--line); border-radius: 18px; padding: 13px; background: rgba(248,252,248,.68); }
.locked-field p { margin: 6px 0 0; }
.user-chip-picker { display: flex; flex-wrap: wrap; gap: 8px; max-height: 236px; overflow: auto; padding: 7px; border: 1px solid var(--line); border-radius: 18px; background: #ffffff; }
.user-chip-option {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 7px 10px;
  border: 1px solid rgba(31,111,74,.14);
  border-radius: 999px;
  background: rgba(248,252,248,.72);
  font-weight: 900;
  cursor: pointer;
}
.user-chip-option input { position: absolute; opacity: 0; pointer-events: none; }
.user-chip-option:has(input:focus-visible) { outline: 3px solid rgba(37,111,145,.24); outline-offset: 2px; }
.user-chip-option:has(input:checked) { background: var(--brand); border-color: var(--brand); color: #fff; }
.user-chip-option:has(input:checked) .avatar { border-color: rgba(255,255,255,.7); box-shadow: none; }
.outside-name-editor { display: grid; gap: 8px; }
.outside-chip-controls { display: grid; gap: 8px; border: 1px solid var(--line); border-radius: 18px; padding: 10px; background: #fff; }
.outside-chip-list { display: flex; flex-wrap: wrap; gap: 7px; min-height: 32px; align-items: center; }
.outside-chip-entry { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.outside-name-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(217,164,65,.34);
  border-radius: 999px;
  background: rgba(217,164,65,.15);
  color: #68450f;
  padding: 7px 9px;
  font-weight: 900;
}
.outside-name-remove-mark {
  width: 14px;
  height: 14px;
  display: inline-block;
  flex: 0 0 auto;
  background:
    linear-gradient(45deg, transparent calc(50% - 1px), currentColor calc(50% - 1px), currentColor calc(50% + 1px), transparent calc(50% + 1px)),
    linear-gradient(-45deg, transparent calc(50% - 1px), currentColor calc(50% - 1px), currentColor calc(50% + 1px), transparent calc(50% + 1px));
}
.event-task-backdrop { z-index: 58; padding-bottom: max(14px, var(--safe-area-bottom)); }
.event-task-sheet {
  display: grid;
  gap: 12px;
  max-height: calc(100dvh - max(28px, env(safe-area-inset-top)) - max(28px, var(--safe-area-bottom)));
  overflow-y: auto;
  padding-bottom: max(18px, var(--safe-area-bottom));
}
.event-task-sheet h2 { margin-bottom: 0; }
.event-task-sheet > p { margin: -4px 0 0; }
.date-time-grid input[type="datetime-local"] { min-height: 50px; }

.equipment-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.equipment-grid.small { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.equipment-card a { display: grid; gap: 10px; padding: 14px; }
.equipment-top { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.equipment-icon { width: 46px; height: 46px; border-radius: 16px; display: grid; place-items: center; background: rgba(31,111,74,.09); color: var(--brand); font-weight: 950; overflow: hidden; flex: 0 0 auto; }
.equipment-icon.has-photo { background: #f8fcf8; border: 1px solid rgba(31,111,74,.12); box-shadow: 0 8px 22px rgba(31,111,74,.10); }
.equipment-icon img { width: 100%; height: 100%; object-fit: cover; display: block; }
.equipment-icon.large { width: 82px; height: 82px; border-radius: 28px; }
.equipment-card-copy { display: grid; gap: 5px; min-width: 0; }
.equipment-card-copy h3 {
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
}
.equipment-location {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.equipment-status-detail {
  margin: 0;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.equipment-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.equipment-next-action {
  display: inline-flex;
  align-items: center;
  min-height: 31px;
  border-radius: 999px;
  padding: 7px 10px;
  background: rgba(37,111,145,.10);
  color: #184f66;
  font-size: 12px;
  font-weight: 950;
}
.equipment-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
}
.equipment-card-meta span {
  border-radius: 999px;
  background: rgba(31,111,74,.055);
  padding: 5px 8px;
}
.equipment-tabs {
  position: sticky;
  top: 8px;
  z-index: 22;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 5px;
  padding: 6px;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 18px;
  background: rgba(248,252,248,.92);
  box-shadow: 0 14px 34px rgba(31,111,74,.10);
  backdrop-filter: blur(12px);
}
.equipment-tabs a {
  min-height: 42px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  color: var(--muted);
  font-size: 13px;
  font-weight: 950;
  text-align: center;
}
.equipment-tabs a.active,
.equipment-tabs a[aria-selected="true"] {
  background: var(--brand);
  color: #fff;
  box-shadow: 0 10px 24px rgba(31,111,74,.18);
}
.equipment-detail-summary {
  align-items: center;
  padding: 16px;
}
.equipment-hero-copy { display: grid; gap: 7px; min-width: 0; }
.equipment-hero-copy h1 {
  margin: 0;
  overflow-wrap: anywhere;
}
.equipment-hero-copy .equipment-location {
  color: var(--muted);
}
.equipment-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 4px;
}
.equipment-hero-actions .button {
  min-width: 148px;
}
.equipment-secondary-action {
  box-shadow: none;
  white-space: nowrap;
}
.equipment-more-button {
  width: auto;
  min-width: 44px;
  padding: 0 12px;
  grid-auto-flow: column;
  gap: 7px;
  border-radius: 15px;
  box-shadow: none;
}
.equipment-more-button span {
  font-size: 12px;
  font-weight: 950;
}
.equipment-primary-action {
  box-shadow: 0 12px 30px rgba(31,111,74,.20);
  justify-content: center;
  text-align: center;
  white-space: nowrap;
}
.equipment-primary-note {
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}
.equipment-action-sheet-list { display: grid; gap: 8px; }
.equipment-action-sheet-list .button {
  width: 100%;
  justify-content: flex-start;
  text-align: left;
  min-height: 46px;
}
.equipment-workspace { display: grid; gap: 14px; }
.equipment-workspace > .panel { margin: 0; }
.meter-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.meter-grid span { border-radius: 14px; padding: 10px; background: rgba(31,111,74,.05); color: var(--muted); font-size: 12px; font-weight: 850; }
.meter-grid strong { display: block; color: var(--ink); font-size: 17px; margin-top: 3px; }
.maintenance-alert, .maintenance-row { border-radius: 14px; padding: 10px; font-weight: 850; }
.maintenance-alert.compact { display: inline-flex; align-items: center; padding: 7px 9px; font-size: 12px; }
.maintenance-alert.ok, .maintenance-row.ok { background: rgba(47,122,78,.1); color: #1f5938; }
.maintenance-alert.soon, .maintenance-row.soon { background: rgba(183,102,32,.11); color: #884911; }
.maintenance-alert.due, .maintenance-row.due { background: rgba(171,59,50,.11); color: #7f2923; }
.equipment-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.equipment-actions.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.equipment-actions .button { width: 100%; justify-content: center; text-align: center; white-space: normal; }
.action-panel { display: grid; gap: 12px; align-items: start; }
.action-cues { display: flex; flex-wrap: wrap; gap: 8px; }
.action-cue { border-radius: 999px; padding: 8px 10px; font-weight: 850; font-size: 13px; }
.action-cue.available { border: 1px solid rgba(47,122,78,.24); background: rgba(47,122,78,.11); color: #1f5938; }
.action-cue.blocked { border: 1px solid rgba(199,121,47,.24); background: rgba(199,121,47,.10); color: #704314; }
.action-cues.realtime-status { display: grid; }
.action-cues.realtime-status .action-cue {
  width: 100%;
  border-radius: 22px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.35;
  box-shadow: 0 10px 24px rgba(31,111,74,.08);
}
.record-actions, .settings-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
.settings-actions { margin-bottom: 0; }
.records-expander { margin-top: 10px; border: 1px solid var(--line); border-radius: 16px; background: rgba(248,252,248,.72); overflow: hidden; }
.records-expander summary { cursor: pointer; padding: 12px; color: var(--brand); font-weight: 950; }
.records-expander .mini-list { padding: 0 12px 12px; }
.equipment-availability-preview { display: grid; gap: 10px; scroll-margin-bottom: var(--mobile-page-bottom-padding); }
.equipment-availability-strip {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(56px, 1fr);
  gap: 6px;
  overflow-x: auto;
  padding: 2px 2px 8px;
  scroll-snap-type: x proximity;
}
.equipment-availability-strip .equipment-calendar-day { scroll-snap-align: start; }
.equipment-calendar-details { margin-top: 6px; border: 1px solid rgba(31,111,74,.12); border-radius: 18px; background: rgba(248,252,248,.72); overflow: hidden; scroll-margin-bottom: var(--mobile-page-bottom-padding); }
.equipment-calendar-details > summary { cursor: pointer; padding: 12px 14px; color: var(--brand); font-weight: 950; }
.equipment-calendar-details .equipment-calendar { padding: 0 12px 12px; }
.equipment-calendar { display: grid; gap: 10px; padding-bottom: 4px; }
.equipment-calendar-head { display: grid; grid-template-columns: 42px minmax(0, 1fr) 42px; gap: 8px; align-items: center; }
.equipment-calendar-head h3 { margin: 0; text-align: center; font-size: 18px; }
.equipment-calendar-head .button { min-height: 40px; width: 42px; padding: 0; justify-content: center; }
.equipment-calendar-summary {
  justify-self: center;
  border: 1px solid rgba(31,111,74,.16);
  border-radius: 999px;
  background: rgba(31,111,74,.08);
  color: var(--brand);
  padding: 7px 12px;
  font-size: 12px;
  font-weight: 950;
  text-align: center;
  max-width: 100%;
  font: inherit;
}
button.equipment-calendar-summary { cursor: pointer; min-height: 44px; }
button.equipment-calendar-summary:focus-visible { outline: 3px solid rgba(37,111,145,.24); outline-offset: 2px; }
.equipment-calendar-summary[data-tone="pending"] { background: rgba(217,164,65,.14); border-color: rgba(217,164,65,.30); color: #735114; }
.equipment-calendar-summary[data-tone="complete"] { background: rgba(47,122,78,.13); border-color: rgba(47,122,78,.28); color: #1f5938; }
.equipment-calendar-summary[data-tone="blocked"] { background: rgba(199,121,47,.12); border-color: rgba(199,121,47,.28); color: #704314; }
.equipment-calendar-weekdays,
.equipment-calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; }
.equipment-calendar-weekdays span { color: var(--muted); font-size: 11px; font-weight: 950; text-align: center; text-transform: uppercase; }
.equipment-calendar-day {
  min-width: 0;
  min-height: 52px;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 14px;
  background: rgba(248,252,248,.78);
  color: var(--ink);
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 3px;
  padding: 7px 4px;
  font: inherit;
  text-align: center;
}
.equipment-calendar-day strong { line-height: 1; font-size: 16px; }
.equipment-calendar-day em { font-style: normal; color: var(--muted); font-size: 10px; font-weight: 950; text-transform: uppercase; }
.equipment-calendar-day span { font-size: 10px; font-weight: 900; color: var(--muted); line-height: 1.05; }
.equipment-calendar-day.compact { min-height: 60px; border-radius: 13px; }
button.equipment-calendar-day { cursor: pointer; }
button.equipment-calendar-day:hover,
button.equipment-calendar-day:focus-visible,
.equipment-calendar-day.selected { outline: 3px solid rgba(37,111,145,.22); border-color: rgba(37,111,145,.36); background: rgba(37,111,145,.08); }
.equipment-calendar-day.in-range { background: rgba(37,111,145,.08); border-color: rgba(37,111,145,.18); }
.equipment-calendar-day.range-start,
.equipment-calendar-day.range-end { background: linear-gradient(135deg, var(--brand), var(--brand-2)); border-color: transparent; color: #fff; box-shadow: 0 9px 20px rgba(31,111,74,.18); }
.equipment-calendar-day.range-start span,
.equipment-calendar-day.range-end span { color: rgba(255,255,255,.92); }
.equipment-calendar-day.outside { opacity: .42; }
.equipment-calendar-day.today { box-shadow: inset 0 0 0 2px rgba(217,164,65,.38); }
.equipment-calendar-day.reserved { background: rgba(37,111,145,.12); border-color: rgba(37,111,145,.26); color: #184f66; }
.equipment-calendar-day.checked-out { background: rgba(31,111,74,.16); border-color: rgba(31,111,74,.30); color: var(--brand); }
.equipment-calendar-day.unavailable,
.equipment-calendar-day[aria-disabled="true"],
button.equipment-calendar-day:disabled {
  cursor: not-allowed;
  opacity: .62;
  filter: grayscale(.08);
}
.equipment-calendar-day.reserved span,
.equipment-calendar-day.checked-out span { color: inherit; }
.equipment-calendar-legend { display: flex; flex-wrap: wrap; gap: 7px; }
.equipment-calendar-legend span { border-radius: 999px; padding: 5px 8px; font-size: 11px; font-weight: 950; }
.equipment-calendar-legend .open { background: rgba(248,252,248,.82); border: 1px solid rgba(31,111,74,.12); color: var(--muted); }
.equipment-calendar-legend .reserved { background: rgba(37,111,145,.12); color: #184f66; }
.equipment-calendar-legend .checked-out { background: rgba(31,111,74,.16); color: var(--brand); }
.maintenance-list { display: grid; gap: 10px; margin-bottom: 16px; }
.maintenance-row { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center; }
.maintenance-row small { display: block; margin-top: 3px; }

.file-list { display: grid; gap: 8px; }
.file-list a { display: grid; grid-template-columns: auto 1fr; gap: 8px 10px; align-items: center; padding: 10px; border-radius: 16px; background: rgba(31,111,74,.04); border: 1px solid var(--line); }
.file-list small { grid-column: 2; color: var(--muted); }
.file-icon { color: var(--brand); display: inline-grid; place-items: center; }
.equipment-file-groups { display: grid; gap: 12px; }
.equipment-file-category { display: grid; gap: 10px; padding: 12px; border: 1px solid rgba(31,111,74,.12); border-radius: 18px; background: rgba(248,252,248,.62); }
.equipment-file-category-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: start; }
.equipment-file-category-head h3 { margin: 0; font-size: 17px; line-height: 1.1; }
.equipment-file-category-head p { margin: 3px 0 0; color: var(--muted); font-size: 13px; font-weight: 700; line-height: 1.3; }
.equipment-file-category-head strong { align-self: start; border-radius: 999px; padding: 5px 8px; background: rgba(31,111,74,.09); color: var(--brand); font-size: 11px; white-space: nowrap; }
.equipment-file-category-icon { width: 36px; height: 36px; border-radius: 12px; display: inline-grid; place-items: center; background: rgba(31,111,74,.09); color: var(--brand); }
.equipment-file-list a strong { overflow-wrap: anywhere; }
.timeline { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.timeline li { display: grid; grid-template-columns: 16px 1fr; gap: 10px; }
.timeline li > span { width: 10px; height: 10px; background: var(--gold); border-radius: 999px; margin-top: 6px; }
.timeline small { display: block; color: var(--muted); margin-top: 2px; }
.change-list { list-style: none; margin: 9px 0 0; padding: 0; display: grid; gap: 6px; }
.change-list li { display: grid; grid-template-columns: minmax(92px, .45fr) minmax(0, 1fr); gap: 8px; padding: 7px 9px; border-radius: 12px; background: rgba(31,111,74,.045); }
.change-list li > span { width: auto; height: auto; margin-top: 0; border-radius: 0; background: transparent; color: var(--muted); font-size: 12px; font-weight: 850; }
.change-list strong { font-size: 12px; overflow-wrap: anywhere; }
.help-detail-hero { display: grid; gap: 10px; }
.detail-action-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 4px; }
.detail-action-row form { margin: 0; }
.action-more { position: relative; }
.action-more summary { list-style: none; }
.action-more summary::-webkit-details-marker { display: none; }
.action-more:not([open]) > div { display: none; }
.action-more > div {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  min-width: 210px;
  z-index: 10;
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--shadow);
}
.action-more a, .action-more button {
  width: 100%;
  min-height: 40px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--ink);
  padding: 8px 10px;
  text-align: left;
  font-weight: 850;
}
.action-more a:hover, .action-more button:hover { background: rgba(31,111,74,.06); }
.help-actions-backdrop,
.help-comment-backdrop {
  z-index: 58;
  padding-bottom: max(14px, var(--safe-area-bottom));
}
.help-actions-sheet,
.help-comment-sheet {
  display: grid;
  gap: 12px;
  max-height: min(78vh, 620px);
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid rgba(31,111,74,.12);
}
.help-action-sheet-list {
  display: grid;
  gap: 8px;
}
.help-action-sheet-list a,
.help-action-sheet-list button {
  width: 100%;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  color: var(--ink);
  padding: 12px 14px;
  text-align: left;
  font-weight: 900;
}
.help-action-sheet-list a:hover,
.help-action-sheet-list button:hover {
  background: rgba(31,111,74,.06);
}
.help-action-sheet-list form { margin: 0; }
.help-comment-sheet textarea {
  min-height: 140px;
  resize: vertical;
}
.help-comment-actions {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: 8px;
}
.help-comment-actions .button {
  width: 100%;
  min-height: 52px;
  justify-content: center;
}
.help-update-stream { display: grid; gap: 12px; }
.help-people-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.help-people-grid > div {
  display: grid;
  gap: 7px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(31,111,74,.035);
}
.help-people-grid strong { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }

.project-card a { display: grid; gap: 9px; padding: 14px; }
.project-card h3 { margin: 0; font-size: 19px; line-height: 1.15; overflow-wrap: anywhere; }
.project-card p { margin: 0; color: var(--muted); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.project-card .meta-grid { gap: 6px; }
.project-card-focus,
.project-card-update {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid rgba(31,111,74,.10);
  border-radius: 14px;
  background: rgba(248,252,248,.72);
}
.project-card-focus strong,
.project-card-update strong { font-size: 14px; line-height: 1.25; overflow-wrap: anywhere; }
.project-card-focus small,
.project-card-update small { color: var(--muted); font-size: 12px; font-weight: 750; }
.project-card-update span { color: var(--muted); font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .06em; }
.project-detail-hero { display: grid; gap: 10px; }
.project-action-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 2px; }
.project-action-more > div { min-width: 190px; }
.more-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.more-card { display: grid; gap: 5px; padding: 14px; min-height: 88px; align-content: center; }
button.more-card {
  width: 100%;
  text-align: left;
  color: var(--ink);
  font: inherit;
  cursor: pointer;
}
.more-card strong { font-size: 16px; line-height: 1.15; }
.more-card span { color: var(--muted); line-height: 1.32; font-size: 13px; }
.routine-list { display: grid; gap: 12px; }
.routine-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 14px;
  color: var(--ink);
}
.routine-card-icon {
  width: 46px;
  height: 46px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  color: var(--brand);
  background: rgba(31,111,74,.08);
  flex: 0 0 auto;
}
.routine-card-main { display: grid; gap: 4px; min-width: 0; }
.routine-card-main strong { font-size: 18px; line-height: 1.15; overflow-wrap: anywhere; }
.routine-card-main small { color: var(--muted); font-weight: 800; line-height: 1.35; }
.routine-card-meta {
  display: grid;
  justify-items: end;
  gap: 5px;
  min-width: 80px;
}
.routine-card-meta small { color: var(--muted); font-size: 12px; font-weight: 850; }
.routine-generate-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 270px) minmax(190px, 270px) auto;
  align-items: end;
  gap: 12px;
}
.routine-generate-card > div { display: grid; gap: 4px; min-width: 0; }
.routine-generate-card > div strong { font-size: 18px; overflow-wrap: anywhere; }
.routine-generate-card > div span { color: var(--muted); font-weight: 800; }
.routine-generate-card form { display: grid; gap: 8px; margin: 0; }
.routine-generate-card .field { margin: 0; }
.routine-generation-list { display: grid; gap: 8px; }
.routine-generation-list a,
.routine-generation-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 12px;
  padding: 12px;
  color: var(--ink);
  border: 1px solid rgba(31,111,74,.10);
  border-radius: 16px;
  background: rgba(248,252,248,.72);
}
.routine-generation-list strong { overflow-wrap: anywhere; }
.routine-generation-list span { color: var(--brand); font-weight: 900; }
.routine-generation-list small { grid-column: 1 / -1; color: var(--muted); font-weight: 800; }
.routine-generation-list p { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.35; }
.install-nudge {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 10px 24px rgba(31,111,74,.07);
}
.install-nudge[hidden] { display: none; }
.install-nudge div { display: grid; gap: 2px; min-width: 0; }
.install-nudge strong { font-size: 14px; }
.install-nudge span { color: var(--muted); font-size: 13px; line-height: 1.35; }
.notification-list { display: grid; gap: 10px; }
.notification-card { display: block; padding: 14px; }
.notification-card.unread { border-left: 6px solid var(--gold); }
.notification-card p { margin: 4px 0; }
.notification-card small { color: var(--muted); }

.rules-meta { display: flex; justify-content: space-between; gap: 12px; align-items: center; border: 1px solid var(--line); border-radius: 22px; background: var(--card); padding: 14px 16px; }
.rules-meta span { display: block; color: var(--muted); margin-top: 3px; }
.rules-viewer { display: grid; gap: 14px; padding-bottom: var(--mobile-page-bottom-padding); }
.rules-viewer figure { margin: 0; border: 1px solid var(--line); border-radius: 22px; background: #fff; padding: 8px; box-shadow: 0 12px 34px rgba(31,111,74,.08); }
.rules-page-link { display: block; border-radius: 16px; overflow: hidden; background: #f8fcf8; }
.rules-viewer img { width: 100%; max-height: min(74vh, 900px); object-fit: contain; border-radius: 16px; display: block; }
.rules-viewer figcaption { display: grid; gap: 2px; text-align: center; color: var(--muted); font-weight: 850; padding: 8px 0 2px; }
.rules-viewer figcaption small { color: var(--brand); font-size: 12px; }
.rules-source-card { display: grid; gap: 8px; justify-items: start; }
.rules-source-card p { margin-bottom: 4px; }
.rules-text-preview { white-space: pre-wrap; overflow-x: auto; margin: 0; border: 1px solid var(--line); border-radius: 20px; background: #ffffff; padding: 16px; line-height: 1.5; color: var(--ink); }

.user-list-admin { display: grid; gap: 8px; }
.admin-create-user {
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--card);
  box-shadow: 0 12px 34px rgba(31,111,74,.07);
}
.admin-create-user > summary { border-radius: 22px; padding: 14px; }
.admin-create-user .disclosure-body { padding: 14px; }
.program-settings-reset { margin: 0; }
.user-row-form { display: grid; grid-template-columns: 1.2fr 1fr auto auto auto; gap: 8px; align-items: center; padding: 10px; border: 1px solid var(--line); border-radius: 16px; background: rgba(248,252,248,.62); }
.user-row-form small { display: block; color: var(--muted); }
.mini-check { display: inline-flex; gap: 8px; align-items: center; min-height: 44px; padding: 8px 0; color: var(--muted); font-weight: 850; }
.compact-list { display: grid; gap: 8px; margin-top: 10px; }
.inline-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(31,111,74,.04);
}
.inline-action span { display: grid; gap: 2px; min-width: 0; }
.inline-action small { color: var(--muted); font-size: 12px; }

.bottom-nav {
  position: fixed;
  z-index: 30;
  left: 50%;
  bottom: var(--bottom-nav-gap);
  transform: translateX(-50%);
  width: min(560px, calc(100% - 18px));
  height: var(--bottom-nav-height);
  border: 1px solid rgba(31,111,74,.16);
  border-radius: 28px;
  background: rgba(248,252,248,.91);
  backdrop-filter: blur(22px);
  box-shadow: 0 18px 60px rgba(31,111,74,.2);
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  padding: 8px;
  transition: opacity .16s ease, transform .18s ease, visibility .16s ease;
}
.nav-item { display: grid; place-items: center; align-content: center; gap: 2px; color: var(--muted); border-radius: 20px; font-size: 11px; font-weight: 950; }
.nav-icon { line-height: 1; display: grid; place-items: center; }
.nav-svg { --icon-size: 22px; }
.nav-icon > .icon {
  display: block;
  margin: auto;
  vertical-align: middle;
}
.nav-item.active { background: var(--brand); color: #f8fcf8; }
.fab {
  position: fixed;
  right: max(18px, calc((100vw - min(1120px, 100vw)) / 2 + 18px));
  bottom: var(--fab-bottom-offset);
  width: var(--fab-size);
  height: var(--fab-size);
  border-radius: 22px;
  border: 0;
  background: linear-gradient(135deg, var(--gold), #d9a441);
  color: var(--brand); font-weight: 800; display: grid; place-items: center;
  padding: 0;
  line-height: 0;
  text-align: center;
  -webkit-appearance: none;
  appearance: none;
  box-shadow: 0 16px 46px rgba(31,111,74,.28);
  z-index: 29;
  transition: opacity .16s ease, transform .18s ease, visibility .16s ease;
}
.fab > .icon {
  display: block;
  margin: auto;
  vertical-align: middle;
}
.sheet-open .fab,
.mobile-shell-fab-suppressed .fab {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transform: translateY(10px) scale(.96);
}
.pwa-update-prompt {
  position: fixed;
  z-index: 28;
  left: 50%;
  bottom: calc(var(--fab-bottom-offset) + var(--fab-size) + 26px);
  transform: translateX(-50%);
  width: min(560px, calc(100% - 18px));
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(31,111,74,.18);
  border-radius: 22px;
  background: rgba(248,252,248,.96);
  box-shadow: 0 16px 48px rgba(31,111,74,.22);
  backdrop-filter: blur(18px);
}
.pwa-update-prompt[hidden] { display: none; }
.pwa-update-prompt strong,
.pwa-update-prompt span { display: block; }
.pwa-update-prompt span { color: var(--muted); font-size: 13px; line-height: 1.35; }
.pwa-update-actions { display: flex; gap: 8px; align-items: center; }
.modal-backdrop { position: fixed; inset: 0; z-index: 50; background: rgba(23,35,29,.45); display: grid; align-items: end; padding: 14px; }
.action-sheet { width: min(560px, 100%); margin: 0 auto; background: #f8fcf8; border-radius: 30px; padding: 12px 16px 18px; box-shadow: 0 24px 70px rgba(0,0,0,.28); }
.sheet-top { display: grid; grid-template-columns: 36px minmax(0, 1fr) 36px; align-items: center; min-height: 36px; }
.sheet-grabber { grid-column: 2; width: 46px; height: 5px; border-radius: 99px; background: rgba(31,111,74,.18); justify-self: center; }
.sheet-close {
  grid-column: 3;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--brand);
  line-height: 0;
  display: grid;
  place-items: center;
  padding: 0;
  text-align: center;
  -webkit-appearance: none;
  appearance: none;
}
.sheet-close > .icon {
  display: block;
  margin: auto;
  vertical-align: middle;
}
.sheet-close:focus-visible {
  outline: none;
  border-color: rgba(37,111,145,.42);
  box-shadow: 0 0 0 3px rgba(37,111,145,.18);
}
.summary-sheet {
  display: grid;
  gap: 10px;
  max-height: min(82vh, 720px);
  overflow: auto;
}
.summary-sheet-body { display: grid; gap: 12px; }
.summary-sheet-body h2 {
  margin: 0;
  font-size: 25px;
  letter-spacing: 0;
}
.summary-sheet-body > p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}
.summary-meta-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.summary-meta-list span {
  border-radius: 999px;
  background: rgba(31,111,74,.08);
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  padding: 7px 10px;
}
.summary-task-list {
  display: grid;
  gap: 8px;
}
.summary-task-list h3 {
  margin: 4px 0 0;
  font-size: 16px;
}
.summary-task-row {
  width: 100%;
  min-height: 54px;
  border: 1px solid rgba(31,111,74,.14);
  border-radius: 16px;
  background: rgba(255,255,255,.72);
  color: var(--ink);
  text-align: left;
  padding: 10px 12px;
}
.summary-task-row strong,
.summary-task-row small { display: block; }
.summary-task-row small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.summary-task-row:focus-visible,
[data-open-summary]:focus-visible {
  outline: 3px solid rgba(31,111,74,.32);
  outline-offset: 3px;
}
.summary-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.summary-action-row .button { min-height: 44px; }
.help-composer-backdrop { z-index: 57; padding-bottom: max(14px, var(--safe-area-bottom)); }
.help-composer-sheet {
  display: grid;
  gap: 12px;
  max-height: min(86vh, 820px);
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid rgba(31,111,74,.12);
}
.sheet-title-row { display: grid; gap: 4px; }
.sheet-title-row h2 { margin-bottom: 0; }
.sheet-title-row p:last-child { margin-bottom: 0; }
.help-composer-sheet .field textarea { min-height: 92px; }
.equipment-sheet-backdrop { z-index: 58; padding-bottom: max(14px, var(--safe-area-bottom)); }
.equipment-sheet {
  display: grid;
  gap: 12px;
  max-height: calc(100vh - 56px);
  max-height: calc(100dvh - max(28px, env(safe-area-inset-top)) - max(28px, var(--safe-area-bottom)));
  overflow-y: auto;
  padding-bottom: max(18px, var(--safe-area-bottom));
}
.equipment-sheet h2 { margin-bottom: 0; }
.equipment-sheet > p { margin: -4px 0 0; }
.file-preview-backdrop {
  z-index: 60;
  align-items: center;
  padding: max(14px, env(safe-area-inset-top)) 14px max(14px, var(--safe-area-bottom));
}
.file-preview-dialog {
  width: min(1040px, 100%);
  max-height: calc(100vh - 28px);
  max-height: calc(100dvh - max(28px, env(safe-area-inset-top)) - max(28px, var(--safe-area-bottom)));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px;
  margin: 0 auto;
  padding: 14px;
  border: 1px solid rgba(31,111,74,.14);
  border-radius: 24px;
  background: #f8fcf8;
  box-shadow: 0 26px 80px rgba(0,0,0,.32);
}
.file-preview-dialog:focus { outline: none; }
.file-preview-top {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
}
.file-preview-top h2 {
  margin: 0;
  font-size: 22px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}
.file-preview-top p { margin: 3px 0 0; }
.file-preview-toolbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}
.file-preview-toolbar span {
  justify-self: center;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}
.file-preview-stage {
  position: relative;
  display: grid;
  min-height: 260px;
  overflow: hidden;
  border-radius: 18px;
}
.file-preview-body {
  min-height: 260px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  display: grid;
  place-items: center;
}
.file-preview-body.image-mode {
  cursor: grab;
  touch-action: none;
}
.file-preview-body.image-mode.is-dragging { cursor: grabbing; }
.file-preview-body img {
  max-width: 100%;
  max-height: min(68vh, 720px);
  display: block;
  object-fit: contain;
  transform-origin: center center;
  transition: transform .12s ease;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
}
.file-preview-body.is-dragging img { transition: none; }
.file-preview-body iframe {
  width: 100%;
  height: min(68vh, 720px);
  min-height: 360px;
  border: 0;
  background: #fff;
}
.file-preview-empty {
  max-width: 420px;
  padding: 24px;
  text-align: center;
  color: var(--muted);
}
.file-preview-empty strong {
  display: block;
  color: var(--ink);
  margin-bottom: 6px;
}
.file-preview-nav {
  position: absolute;
  top: 50%;
  z-index: 2;
  transform: translateY(-50%);
  min-height: 46px;
  border: 1px solid rgba(31,111,74,.18);
  border-radius: 999px;
  padding: 8px 10px;
  background: rgba(248,252,248,.88);
  color: var(--brand);
  font-weight: 950;
  box-shadow: 0 12px 30px rgba(31,111,74,.14);
}
.file-preview-nav.previous { left: 10px; }
.file-preview-nav.next { right: 10px; }
.file-preview-nav:disabled {
  opacity: .35;
  pointer-events: none;
}
.file-preview-zoom-controls {
  position: absolute;
  left: 50%;
  bottom: 12px;
  z-index: 3;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px;
  border: 1px solid rgba(31,111,74,.14);
  border-radius: 999px;
  background: rgba(248,252,248,.92);
  box-shadow: 0 14px 34px rgba(31,111,74,.16);
  backdrop-filter: blur(14px);
}
.file-preview-zoom-controls[hidden] { display: none; }
.file-preview-zoom-controls button {
  min-width: 34px;
  height: 34px;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 999px;
  background: #fff;
  color: var(--brand);
  font-weight: 950;
}
.file-preview-zoom-controls [data-file-preview-zoom-reset] {
  min-width: 48px;
  padding: 0 10px;
}
.file-preview-zoom-controls span {
  min-width: 46px;
  text-align: center;
  color: var(--brand);
  font-size: 12px;
  font-weight: 950;
}
.file-preview-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}
.install-backdrop { z-index: 55; padding-bottom: max(14px, var(--safe-area-bottom)); }
.install-sheet {
  display: grid;
  gap: 14px;
  max-height: calc(100vh - 56px);
  max-height: calc(100dvh - max(28px, env(safe-area-inset-top)) - max(28px, var(--safe-area-bottom)));
  overflow-y: auto;
  padding-bottom: max(18px, var(--safe-area-bottom));
}
.install-prompt-head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: start; }
.install-prompt-head h2 { margin-bottom: 6px; }
.install-prompt-head p:last-child { margin-bottom: 0; }
.install-guide-frame {
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 12px 34px rgba(31,111,74,.08);
  aspect-ratio: 720 / 1279;
}
.install-guide-picture,
.install-guide-picture img {
  display: block;
  width: 100%;
}
.install-guide-picture img {
  height: auto;
  aspect-ratio: 720 / 1279;
}
.install-steps { display: grid; gap: 9px; }
.install-steps article {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(31,111,74,.045);
}
.install-steps article > span {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(217,164,65,.22);
  color: var(--brand);
  font-weight: 950;
}
.install-steps strong { display: block; }
.install-steps small { display: block; color: var(--muted); line-height: 1.35; margin-top: 2px; font-weight: 750; }
.install-actions { display: grid; gap: 8px; }
.push-backdrop { z-index: 56; padding-bottom: max(14px, var(--safe-area-bottom)); }
.push-sheet { display: grid; gap: 14px; }
.push-state-note {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(31,111,74,.045);
  padding: 12px;
  color: var(--muted);
  font-weight: 800;
  line-height: 1.4;
}
.quick-grid { display: grid; gap: 10px; margin: 14px 0; }
.quick-grid a { display: grid; gap: 3px; padding: 14px; border: 1px solid var(--line); border-radius: 18px; background: rgba(31,111,74,.04); }
.quick-grid span { color: var(--muted); }

@media (max-width: 860px) {
  .hero-card { display: grid; align-items: start; }
  .help-dashboard { grid-template-columns: 1fr; align-items: start; }
  .help-dashboard .hero-actions { grid-column: auto; }
  .help-tabs.segmented {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .help-tabs.segmented a {
    grid-column: span 2;
    min-height: 50px;
    padding: 10px 8px;
  }
  .help-tabs.segmented a:nth-child(4),
  .help-tabs.segmented a:nth-child(5) {
    grid-column: span 3;
  }
  .two-col, .form-shell, .login-shell { grid-template-columns: 1fr; }
  .equipment-grid, .equipment-grid.small, .more-grid { grid-template-columns: 1fr; }
  .equipment-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .equipment-tabs { top: 6px; }
  .form-grid, .choice-card-grid { grid-template-columns: 1fr; }
  .inline-form { grid-template-columns: 1fr; }
  .user-row-form { grid-template-columns: 1fr; }
  .year-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .calendar-agenda-header {
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 10px;
  }
  .calendar-header-actions {
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    justify-content: stretch;
  }
  .calendar-header-actions .button {
    width: 100%;
    justify-content: center;
    text-align: center;
    white-space: normal;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 13px;
    line-height: 1.1;
  }
  .calendar-subscribe-panel { grid-template-columns: 1fr; }
  .calendar-subscribe-actions { justify-content: start; }
  .calendar-subscribe-guide { grid-template-columns: 1fr; }
  .event-detail-hero, .equipment-detail-hero { align-items: flex-start; }
  .event-detail-hero.has-event-image { grid-template-columns: 1fr; }
  .routine-generate-card { grid-template-columns: 1fr; align-items: stretch; }
  .routine-generate-card .button { width: 100%; justify-content: center; }
  .event-detail-summary {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .event-detail-summary.has-event-image {
    grid-template-columns: 1fr;
  }
  .event-hero-image { min-height: 220px; }
  .event-hero-image.compact { min-height: 180px; }
  .event-task-people { grid-template-columns: 1fr; }
  .help-people-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .install-nudge { display: grid; align-items: start; }
  .install-nudge .button { width: 100%; justify-content: center; }
  .equipment-tabs { gap: 4px; padding: 5px; border-radius: 16px; }
  .equipment-tabs a { min-height: 38px; font-size: 12px; }
  .equipment-card a { padding: 13px; gap: 9px; }
  .equipment-card-footer { display: grid; grid-template-columns: 1fr; align-items: stretch; }
  .equipment-card-footer .maintenance-alert,
  .equipment-next-action { justify-content: center; width: 100%; }
  .equipment-detail-summary {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    padding: 14px;
  }
  .equipment-detail-summary .equipment-icon.large {
    width: 58px;
    height: 58px;
    border-radius: 20px;
  }
  .equipment-hero-copy h1 {
    font-size: 27px;
    line-height: 1.05;
  }
  .equipment-hero-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .equipment-hero-actions .equipment-primary-action {
    min-width: 104px;
    width: 100%;
    grid-column: 1 / -1;
  }
  .equipment-secondary-action {
    min-width: 0;
    width: 100%;
  }
  .equipment-more-button {
    min-width: 74px;
  }
  .equipment-actions.compact { gap: 8px; }
  .equipment-calendar { gap: 9px; }
  .equipment-calendar-grid,
  .equipment-calendar-weekdays { gap: 4px; }
  .equipment-calendar-day {
    min-height: 48px;
    border-radius: 11px;
    padding: 7px 2px;
  }
  .equipment-calendar-day strong { font-size: 15px; }
  .equipment-calendar-day span { font-size: 9px; }
  .equipment-calendar-summary { width: 100%; padding: 8px 10px; }
  .equipment-file-category-head { grid-template-columns: auto minmax(0, 1fr); }
  .equipment-file-category-head strong { grid-column: 1 / -1; justify-self: start; }
  .file-preview-backdrop { padding: 8px; align-items: stretch; }
  .file-preview-dialog { border-radius: 22px; padding: 10px; max-height: calc(100dvh - 16px); }
  .file-preview-top h2 { font-size: 18px; }
  .file-preview-toolbar { grid-template-columns: 1fr auto 1fr; gap: 6px; }
  .file-preview-toolbar .button { min-height: 38px; padding: 8px 10px; font-size: 12px; }
  .file-preview-stage { min-height: 220px; }
  .file-preview-body { min-height: 220px; border-radius: 16px; }
  .file-preview-body img { max-height: calc(100dvh - 220px); }
  .file-preview-body iframe { height: calc(100dvh - 220px); min-height: 260px; }
  .file-preview-nav { display: none; }
  .file-preview-zoom-controls { bottom: 8px; max-width: calc(100% - 16px); }
  .file-preview-zoom-controls button { min-width: 32px; height: 32px; }
  .file-preview-zoom-controls span { min-width: 42px; }
  .file-preview-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .file-preview-actions .button { width: 100%; justify-content: center; }
}

@media (max-width: 520px) {
  :root {
    --mobile-bottom-nav-height: 72px;
    --mobile-content-bottom-breathing-room: 38px;
    --fab-size: 54px;
  }
  .app-shell { padding-left: 10px; padding-right: 10px; }
  body.authenticated-shell .topbar {
    margin-left: -10px;
    margin-right: -10px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: max(8px, calc(env(safe-area-inset-top, 0px) + 6px));
  }
  .brand small { display: none; }
  .user-menu summary span:not(.avatar) { display: none; }
  .hero-card, .detail-hero, .event-detail-hero, .equipment-detail-hero, .project-detail-hero, .help-dashboard { border-radius: 24px; padding: 18px; }
  .operational-header {
    display: grid;
    gap: 10px;
    border-radius: 20px;
    padding: 13px 14px;
  }
  .operational-copy .eyebrow {
    font-size: 10px;
    margin-bottom: 0;
  }
  .operational-copy h1 {
    font-size: 25px;
    line-height: 1.02;
  }
  .operational-copy p:not(.eyebrow) {
    font-size: 13px;
    line-height: 1.35;
  }
  .operational-actions {
    display: grid;
    grid-template-columns: 1fr;
    justify-content: stretch;
  }
  .operational-actions .button,
  .operational-actions form,
  .operational-actions form .button {
    width: 100%;
  }
  .operational-actions .button {
    min-height: 44px;
  }
  .operational-actions .notification-settings-drawer {
    justify-items: stretch;
  }
  .operational-actions .notification-settings-drawer > summary {
    width: 100%;
    border-radius: 16px;
  }
  .operational-actions .notification-settings-panel {
    right: auto;
    left: 0;
    width: calc(100vw - 44px);
  }
  h1 { font-size: 34px; }
  .help-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .help-stat-grid strong { font-size: 22px; }
  .detail-action-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-action-row > *, .detail-action-row .button { width: 100%; }
  .project-action-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-action-row > *, .project-action-row .button { width: 100%; }
  .action-more > div { right: auto; left: 0; }
  .rules-meta { display: grid; align-items: start; }
  .rules-meta .button { width: 100%; justify-content: center; }
  .more-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .more-card { min-height: 76px; padding: 12px; border-radius: 18px; }
  .more-card strong { font-size: 15px; }
  .more-card span { font-size: 12px; }
  .routine-card {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    padding: 12px;
    gap: 10px;
    border-radius: 18px;
  }
  .routine-card-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
  }
  .routine-card-main strong { font-size: 16px; }
  .routine-card-main small { font-size: 12px; }
  .routine-card-meta {
    grid-column: 2;
    justify-items: start;
    min-width: 0;
  }
  .routine-generation-list a,
  .routine-generation-list article { grid-template-columns: 1fr; }
  .help-composer-backdrop { padding: 8px 8px max(8px, var(--safe-area-bottom)); }
  .help-composer-sheet { border-radius: 24px; padding: 10px 12px 14px; }
  .event-detail-hero, .equipment-detail-hero { display: grid; }
  .event-detail-hero.has-event-image { padding: 10px; }
  .event-hero-image { min-height: 190px; border-radius: 20px; }
  .event-card-image { width: 62px; height: 62px; border-radius: 18px; }
  .current-event-image { grid-template-columns: 76px minmax(0, 1fr); gap: 10px; }
  .current-event-image img { width: 76px; height: 58px; border-radius: 14px; }
  .calendar-agenda-header {
    border-radius: 20px;
    padding: 10px;
    gap: 8px;
  }
  .calendar-header-title h1 {
    font-size: 28px;
  }
  .calendar-header-title span {
    padding: 5px 9px;
    font-size: 12px;
  }
  .calendar-header-copy p:not(.eyebrow) {
    display: none;
  }
  .calendar-board-panel { padding: 10px; }
  .calendar-toolbar { display: grid; }
  .calendar-toolbar .button { width: 100%; }
  .calendar-view-tabs { width: 100%; }
  .calendar-view-tabs a { flex: 1 1 0; text-align: center; }
  .calendar-board-head { grid-template-columns: 42px minmax(0, 1fr) 42px; }
  .calendar-weekdays { gap: 3px; font-size: 10px; }
  .month-grid { gap: 4px; }
  .month-day {
    min-height: 44px;
    border-radius: 12px;
    padding: 5px 3px;
    gap: 3px;
    align-content: center;
    justify-items: center;
    text-align: center;
  }
  .month-day.blank { min-height: 0; }
  .month-day-number { font-size: 12px; justify-content: center; }
  .month-day-number strong { display: none; }
  .event-dot-row { justify-content: center; gap: 3px; }
  .event-dot-row span { width: 6px; height: 6px; }
  .month-day-count {
    justify-self: center;
    padding: 2px 6px;
    font-size: 10px;
  }
  .calendar-event-pill { padding: 5px; border-radius: 9px; }
  .month-day-events {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
  }
  .month-day-events .calendar-event-pill {
    position: relative;
    flex: 0 0 44px;
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    border-radius: 999px;
    background: transparent;
    border-color: transparent;
    place-items: center;
  }
  .month-day-events .calendar-event-pill::before {
    content: "";
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: var(--brand);
    border: 1px solid var(--brand);
  }
  .month-day-events .calendar-event-pill span,
  .month-day-events .calendar-event-pill strong { display: none; }
  .empty-day { display: none; }
  .year-grid { grid-template-columns: 1fr; }
  .year-month-picker { gap: 8px; }
  .year-month-card {
    min-height: 72px;
    border-radius: 18px;
    padding: 12px;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }
  .year-month-title,
  .year-month-next { grid-column: 1; }
  .year-month-count {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
  }
  .mini-day { min-height: 30px; }
  .calendar-subscribe-actions { display: grid; }
  .calendar-subscribe-actions .button { width: 100%; }
  .calendar-subscribe-sheet.calendar-subscribe-panel {
    max-height: calc(100dvh - 20px);
  }
  .event-image-picker-actions { display: grid; }
  .event-image-picker-actions .button { width: 100%; }
  .event-detail-summary .date-badge.large {
    width: 62px;
    height: 68px;
    border-radius: 20px;
  }
  .event-detail-summary .date-badge.large strong { font-size: 28px; }
  .event-summary-copy h1 { font-size: 27px; line-height: 1.05; }
  .event-stats { gap: 8px; }
  .event-stats div { padding: 12px 8px; }
  .event-stats strong { font-size: 24px; }
  .item-row { grid-template-columns: 1fr; }
  .item-actions { justify-content: start; }
  .event-plan-panel .panel-head { display: grid; }
  .outside-chip-entry { grid-template-columns: 1fr; }
  .event-task-sheet { border-radius: 24px; padding-left: 14px; padding-right: 14px; }
  .bottom-nav { border-radius: 24px; }
  .nav-item { font-size: 10px; border-radius: 17px; }
  .fab { border-radius: 20px; }
  .install-backdrop { padding-left: 10px; padding-right: 10px; }
  .install-sheet { border-radius: 24px; padding-left: 14px; padding-right: 14px; }
  .install-prompt-head { grid-template-columns: 1fr; }
}

/* polished release layer */
.crest-img {
  width: 42px; height: 42px; border-radius: 14px; overflow: hidden; display: inline-grid; place-items: center;
  background: #f8fcf8; border: 1px solid var(--line); box-shadow: 0 8px 24px rgba(31, 111, 74, 0.22);
  flex: none;
}
.crest-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.crest-img.large { width: 72px; height: 72px; border-radius: 24px; }
.today-command-hero {
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 16px;
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(229,244,239,.88));
  box-shadow: 0 10px 30px rgba(31,111,74,.08);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}
.today-command-hero h1 {
  margin: 0;
  font-size: clamp(28px, 6vw, 42px);
  line-height: 1.02;
  letter-spacing: 0;
}
.today-command-hero p:not(.eyebrow) {
  margin: 4px 0 0;
  max-width: 48ch;
  font-size: 15px;
  line-height: 1.35;
}
.today-count-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(70px, 1fr));
  gap: 8px;
}
.today-count-strip span {
  display: grid;
  justify-items: center;
  gap: 2px;
  min-height: 58px;
  padding: 8px 10px;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 16px;
  background: rgba(255,255,255,.76);
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.today-count-strip strong {
  color: var(--brand);
  font-size: 24px;
  line-height: 1;
}
.today-queue {
  display: grid;
  gap: 12px;
}
.today-queue-section {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255,255,255,.9);
  padding: 14px;
  box-shadow: 0 10px 30px rgba(31,111,74,.06);
  scroll-margin-bottom: var(--mobile-page-bottom-padding);
}
.today-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.today-section-head h2 {
  margin: 0;
  font-size: 20px;
  letter-spacing: 0;
}
.today-section-head span {
  min-width: 30px;
  height: 30px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: rgba(31,111,74,.08);
  color: var(--brand);
  font-weight: 950;
}
.today-queue-list {
  display: grid;
  gap: 9px;
}
.routine-review-list {
  display: grid;
  gap: 10px;
}
.routine-review-item {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) minmax(230px, .82fr);
  gap: 10px;
  align-items: start;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(31,111,74,.14);
  border-left: 5px solid var(--orange);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(217,164,65,.08), rgba(248,252,248,.84));
}
.routine-review-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.routine-review-copy h3 {
  margin: 0;
  font-size: 17px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.routine-review-copy p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
  line-height: 1.35;
}
.routine-review-actions {
  display: grid;
  gap: 7px;
}
.routine-review-actions form {
  margin: 0;
  display: grid;
  gap: 7px;
}
.routine-review-actions .field {
  margin: 0;
}
.routine-review-actions .field > span {
  font-size: 11px;
}
.routine-review-actions .field input {
  min-height: 40px;
  padding: 8px 10px;
  border-radius: 14px;
  font-size: 13px;
}
.routine-review-actions .button {
  width: 100%;
  justify-content: center;
}
.today-queue-item {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) minmax(92px, auto);
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(31,111,74,.12);
  border-left-width: 5px;
  border-radius: 18px;
  background: rgba(248,252,248,.78);
}
.today-danger { border-left-color: var(--red); }
.today-warning { border-left-color: var(--orange); }
.today-neutral { border-left-color: var(--brand); }
.today-item-icon {
  width: 42px;
  height: 42px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  background: rgba(31,111,74,.08);
  color: var(--brand);
}
.today-danger .today-item-icon { background: rgba(171,59,50,.1); color: var(--red); }
.today-warning .today-item-icon { background: rgba(199,121,47,.12); color: var(--orange); }
.today-item-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.today-item-kicker {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
}
.today-item-copy h3 {
  margin: 0;
  font-size: 17px;
  line-height: 1.15;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}
.today-item-copy p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.today-item-action {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: stretch;
}
.today-item-action form {
  margin: 0;
  display: grid;
}
.today-item-action .button {
  width: 100%;
  white-space: nowrap;
}
.today-empty-line {
  margin: 0;
  padding: 12px;
  border: 1px dashed rgba(31,111,74,.18);
  border-radius: 16px;
  color: var(--muted);
  background: rgba(248,252,248,.58);
}
.empty-actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.method-list { display: grid; gap: 10px; }
.method-list article {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; align-items: center;
  border: 1px solid var(--line); border-radius: 18px; padding: 12px; background: rgba(248,252,248,.65);
}
.method-list strong, .method-list span, .method-list .compact-list { grid-column: 1; }
.method-list article > .button { grid-column: 2; grid-row: 1 / span 2; }
.method-list span { color: var(--muted); line-height: 1.4; font-size: 13px; font-weight: 700; }
.sign-in-recovery-list article {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}
.sign-in-recovery-list .recovery-method-main {
  display: grid;
  grid-template-columns: minmax(0, auto) auto;
  justify-content: start;
  align-items: center;
  gap: 5px 8px;
  min-width: 0;
}
.sign-in-recovery-list .recovery-method-main > span:not(.method-status) {
  grid-column: 1 / -1;
}
.method-status {
  display: inline-flex;
  align-items: center;
  grid-column: auto;
  width: fit-content;
  max-width: 100%;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(93,111,103,.11);
  color: var(--muted);
  font-size: 11px;
  font-weight: 950;
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: 0;
}
.method-status-ready {
  background: rgba(31,111,74,.11);
  color: var(--brand);
}
.method-status-warning {
  background: rgba(217,164,65,.20);
  color: #725013;
}
.method-status-muted {
  background: rgba(93,111,103,.10);
  color: var(--muted);
}
.push-method-list article { grid-template-columns: minmax(0, 1fr) auto auto auto; align-items: center; }
.push-method-list article > .button { grid-row: auto; }
.push-method-list article > .button:nth-of-type(1) { grid-column: 2; }
.push-method-list article > .button:nth-of-type(2) { grid-column: 3; }
.push-method-list article > .inline-action {
  display: block;
  grid-column: 4;
  grid-row: auto;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.method-list.notification-settings-push article {
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
}
.method-list.notification-settings-push article > strong,
.method-list.notification-settings-push article > span,
.method-list.notification-settings-push article > .button,
.method-list.notification-settings-push article > .inline-action {
  grid-column: 1;
}
.method-list.notification-settings-push article > .button,
.method-list.notification-settings-push article > .inline-action .button {
  width: 100%;
}
.method-list.notification-settings-push article > .inline-action {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.meta-table { display: grid; gap: 8px; }
.meta-table div { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); padding: 10px 0; min-width: 0; }
.meta-table span { color: var(--muted); font-weight: 750; }
.meta-table span,
.meta-table strong { overflow-wrap: anywhere; min-width: 0; }
.settings-crest-preview { width: 180px; height: 180px; border-radius: 38px; object-fit: cover; display: grid; place-items: center; background: linear-gradient(135deg, var(--brand), var(--brand-2)); color: #f8fcf8; font-family: Georgia, serif; font-size: 96px; font-weight: 900; box-shadow: var(--shadow); margin: 0 auto 18px; }
.crest-preview-panel { text-align: center; }
.user-row-form.polished { grid-template-columns: 1.2fr .9fr auto auto 1fr auto; }
.offline-state { margin-top: 12vh; }
.sheet-open { overflow: hidden; }
@media (max-width: 860px) {
  .today-command-hero {
    grid-template-columns: 1fr;
    padding: 14px;
    border-radius: 20px;
  }
  .today-count-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .today-count-strip span {
    min-height: 50px;
    padding: 7px 8px;
  }
  .today-queue-section {
    padding: 12px;
    border-radius: 20px;
  }
  .today-queue-item {
    grid-template-columns: 38px minmax(0, 1fr) minmax(104px, auto);
    gap: 8px 10px;
    padding: 10px;
    align-items: start;
  }
  .routine-review-item {
    grid-template-columns: 42px minmax(0, 1fr);
  }
  .routine-review-actions {
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr);
  }
  .today-item-icon {
    width: 38px;
    height: 38px;
    border-radius: 14px;
  }
  .today-item-action {
    grid-column: 3;
    grid-row: 1;
    justify-items: start;
  }
  .today-item-action .button {
    width: 100%;
    min-width: 104px;
  }
  .button.small {
    min-height: 44px;
    padding: 10px 13px;
  }
  .method-list article { grid-template-columns: 1fr; }
  .method-list article > .button { grid-column: 1; grid-row: auto; justify-self: start; }
  .sign-in-recovery-list .recovery-method-main { grid-template-columns: minmax(0, 1fr); }
  .push-method-list article { grid-template-columns: 1fr; }
  .push-method-list article > .button:nth-of-type(1),
  .push-method-list article > .button:nth-of-type(2),
  .push-method-list article > .inline-action { grid-column: 1; }
  .user-row-form.polished { grid-template-columns: 1fr; }
  .form-card > form.stacked-form,
  .panel > form.stacked-form,
  .disclosure-body > form.stacked-form,
  form[data-mobile-form] {
    padding-bottom: calc(var(--sticky-action-height) + var(--mobile-page-bottom-breathing-room));
  }
  .form-card > form.stacked-form > button[type="submit"]:last-child,
  .panel > form.stacked-form > button[type="submit"]:last-child,
  .disclosure-body > form.stacked-form > button[type="submit"]:last-child {
    min-height: var(--sticky-action-height);
    margin-top: 4px;
  }
  .mobile-form-shell { gap: 12px; }
  .mobile-form-shell .form-intro {
    padding: 0 2px;
    display: grid;
    gap: 5px;
  }
  .mobile-form-shell .form-intro h1 {
    margin: 0;
    font-size: clamp(28px, 8vw, 42px);
    line-height: 1.02;
  }
  .mobile-form-shell .form-intro p {
    margin: 0;
    font-size: 15px;
    line-height: 1.35;
  }
  .mobile-form-section {
    border-radius: 20px;
    padding: 12px;
  }
  .mobile-form-section-head h2 { font-size: 18px; }
  .mobile-form-actions {
    margin: 2px -4px -2px;
    padding: 8px;
    border: 1px solid rgba(31,111,74,.12);
    border-radius: 20px;
    background: rgba(248,252,248,.96);
    box-shadow: 0 16px 44px rgba(31,111,74,.18);
    backdrop-filter: blur(14px);
  }
  .modal-backdrop .mobile-form-actions,
  .action-sheet .mobile-form-actions {
    position: sticky;
    bottom: 0;
    z-index: 45;
    margin-bottom: 0;
  }
  .file-upload-control {
    grid-template-columns: 1fr;
    justify-items: stretch;
  }
  .file-upload-button { width: 100%; }
  .person-chip-grid,
  .user-chip-picker {
    display: grid;
    grid-template-columns: 1fr;
    max-height: none;
    overflow: visible;
  }
  .assignee-field .person-chip-grid {
    max-height: 236px;
    overflow: auto;
  }
}
@media (max-width: 520px) {
  .today-count-strip { gap: 6px; }
  .today-count-strip span { font-size: 11px; }
  .today-count-strip strong { font-size: 22px; }
  .empty-actions { display: grid; }
  .empty-actions .button { width: 100%; }
}


/* Final release: profile headshots and admin user management */
.headshot-preview { display: grid; justify-items: start; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 20px; background: rgba(31,111,74,.035); }
.headshot-preview .avatar.large { margin-bottom: 2px; }
.profile-photo-summary {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 18px;
  background: rgba(255,255,255,.74);
}
.profile-photo-summary-avatar {
  width: 62px;
  height: 62px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--brand);
  color: #fff;
  font-weight: 950;
  box-shadow: 0 10px 24px rgba(31,111,74,.12);
}
.profile-photo-summary-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.profile-photo-summary strong { display: block; font-size: 15px; }
.profile-photo-summary p { margin: 3px 0 0; line-height: 1.32; }
.profile-photo-editor {
  --preview-position: 50% 50%;
  --preview-scale: 1;
  display: grid;
  grid-template-columns: minmax(138px, 180px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(31,111,74,.035);
}
.profile-photo-stage { display: grid; justify-items: center; gap: 10px; text-align: center; }
.profile-photo-stage p { margin: 0; font-size: 13px; }
.profile-photo-frame {
  width: min(42vw, 168px);
  height: min(42vw, 168px);
  max-width: 168px;
  max-height: 168px;
  min-width: 132px;
  min-height: 132px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  overflow: hidden;
  position: relative;
  background: var(--avatar);
  color: #f8fcf8;
  border: 6px solid rgba(255,255,255,.9);
  box-shadow: 0 18px 40px rgba(31,111,74,.16), 0 0 0 1px var(--line);
  touch-action: none;
  user-select: none;
}
.profile-photo-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(23,35,29,.16), inset 0 0 0 14px rgba(255,255,255,.08);
  pointer-events: none;
}
.profile-photo-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--preview-position);
  transform: scale(var(--preview-scale));
  transform-origin: var(--preview-position);
  display: block;
}
.profile-photo-frame img[hidden] { display: none; }
.profile-photo-initials { font-size: 42px; font-weight: 950; letter-spacing: -.04em; }
.profile-photo-editor.has-image .profile-photo-initials { display: none; }
.profile-photo-tools { display: grid; gap: 14px; min-width: 0; }
.file-drop {
  border: 1px dashed rgba(31,111,74,.32);
  border-radius: 18px;
  min-height: 52px;
  display: grid;
  place-items: center;
  padding: 12px;
  background: #f8fcf8;
  color: var(--brand);
  font-weight: 900;
  cursor: pointer;
  position: relative;
}
.file-drop.has-error { border-color: rgba(171,59,50,.65); box-shadow: 0 0 0 3px rgba(171,59,50,.10); }
.file-drop small { display: block; margin-top: 5px; color: var(--muted); font-weight: 800; text-align: center; overflow-wrap: anywhere; }
.sr-only-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.range-field input[type="range"] { width: 100%; accent-color: var(--brand); padding: 0; min-height: 44px; }
.range-field output { float: right; color: var(--brand); font-weight: 900; }
.zoom-step-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.nudge-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-items: center;
}
.nudge-grid button:nth-child(1), .nudge-grid button:nth-child(5) { grid-column: 2; }
.nudge-grid button:nth-child(2) { grid-column: 1; grid-row: 2; }
.nudge-grid button:nth-child(3) { grid-column: 2; grid-row: 2; }
.nudge-grid button:nth-child(4) { grid-column: 3; grid-row: 2; }
.nudge-grid button:nth-child(5) { grid-row: 3; }
.final-users { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.ops-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}
.ops-grid > .panel { min-width: 0; }
.ops-grid > .panel:nth-child(4),
.ops-grid > .panel:nth-child(5) {
  grid-column: 1 / -1;
}
.ops-count-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 14px;
}
.ops-count-card {
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 18px;
  padding: 12px;
  background: rgba(248,252,248,.78);
  display: grid;
  gap: 4px;
  min-width: 0;
}
.ops-count-card strong {
  color: var(--brand);
  font-size: 26px;
  line-height: 1;
  overflow-wrap: anywhere;
}
.ops-count-card span,
.ops-count-card small {
  color: var(--muted);
  font-weight: 850;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.ops-count-card small { font-size: 12px; }
.ops-meta-table { margin-top: 2px; }
.ops-reference-note {
  margin: 10px 0 0;
  padding: 10px 12px;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 14px;
  background: rgba(31,111,74,.04);
  overflow-wrap: anywhere;
}
.ops-reference-form { padding: 0; }
.ops-reference-form .button { width: fit-content; }
.ops-inline-form {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin: 0 0 14px;
  padding: 12px;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 16px;
  background: rgba(248,252,248,.72);
}
.ops-inline-form span {
  min-width: 0;
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.ops-two-column {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.ops-event-list,
.ops-device-list {
  display: grid;
  gap: 8px;
}
.ops-event-list article,
.ops-device-list article {
  display: grid;
  gap: 4px;
  padding: 11px 12px;
  border: 1px solid rgba(31,111,74,.11);
  border-radius: 16px;
  background: rgba(255,255,255,.74);
  min-width: 0;
}
.ops-event-list strong,
.ops-event-list span,
.ops-event-list small,
.ops-device-list strong,
.ops-device-list span,
.ops-device-list small {
  overflow-wrap: anywhere;
}
.ops-event-list span,
.ops-device-list span,
.ops-event-list small,
.ops-device-list small {
  color: var(--muted);
}
.ops-device-list article {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}
.ops-device-list small { grid-column: 1 / -1; }
.ops-device-metrics {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}
.ops-device-metrics span {
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(31,111,74,.06);
  font-size: 12px;
  font-weight: 900;
}
.access-status {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(31,111,74,.08);
  color: var(--brand);
  font-size: 12px;
  font-weight: 950;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.access-status-attention {
  background: rgba(171,59,50,.12);
  color: #7f2923;
}
.access-status-invite_pending {
  background: rgba(217,164,65,.20);
  color: #725013;
}
.access-status-inactive {
  background: rgba(93,111,103,.12);
  color: var(--muted);
}
.access-status-passkey {
  background: rgba(37,111,145,.13);
  color: #165575;
}
.access-badge-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.user-summary-line {
  display: block;
  margin-bottom: 8px;
  overflow-wrap: anywhere;
  min-width: 0;
}
.access-health-list .button {
  min-height: 34px;
  padding: 7px 10px;
}
.access-detail-grid > .panel:nth-child(n+5) {
  grid-column: 1 / -1;
}
.user-admin-card { border: 1px solid var(--line); border-radius: 24px; background: var(--card); padding: 14px; box-shadow: 0 12px 34px rgba(31,111,74,.07); }
details.user-admin-card { padding: 0; margin-top: 0; align-self: start; }
details.user-admin-card[open] { grid-column: 1 / -1; }
details.user-admin-card > summary { padding: 14px; align-items: flex-start; }
details.user-admin-card > summary > span { min-width: 0; overflow-wrap: anywhere; }
details.user-admin-card > summary strong,
details.user-admin-card .disclosure-summary { overflow-wrap: anywhere; word-break: break-word; }
details.user-admin-card .access-badge-row { margin-top: 6px; }
details.user-admin-card .disclosure-edit { flex: 0 0 auto; }
details.user-admin-card .disclosure-body { padding: 14px; }
.user-admin-head { display: flex; align-items: center; gap: 14px; margin-bottom: 10px; }
.user-admin-head > div:last-child { min-width: 0; }
.user-admin-head strong { display: block; font-size: 18px; }
.user-admin-head small { display: block; color: var(--muted); margin: 2px 0 7px; }
.user-admin-head strong,
.user-admin-head small { overflow-wrap: anywhere; word-break: break-word; }
.user-admin-head .access-status { margin-top: 7px; }
.passkey-management-list {
  gap: 9px;
}
.passkey-management-row {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid rgba(31,111,74,.12);
  border-radius: 16px;
  background: rgba(255,255,255,.72);
}
.passkey-management-row strong,
.passkey-management-row small {
  display: block;
  overflow-wrap: anywhere;
}
.passkey-management-row small {
  color: var(--muted);
  font-weight: 750;
  line-height: 1.35;
}
.passkey-rename-form,
.passkey-remove-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
  margin: 0;
}
.passkey-rename-form .field,
.passkey-remove-form .check {
  margin: 0;
}
.invite-resend-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin: 14px 0;
  padding: 14px 16px;
  border: 1px solid rgba(31,111,74,.14);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(248,252,248,.92), rgba(232,246,240,.76));
}
.invite-resend-panel h2 {
  margin: 0 0 4px;
  font-size: 18px;
  letter-spacing: 0;
}
.invite-resend-panel p {
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.inline-action-form { margin: 0; }
.admin-checks { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; padding: 4px 0; }
.status-admin, .status-mom, .status-child, .status-spouse { background: rgba(31,111,74,.08); color: var(--brand); text-transform: capitalize; }
.status-admin { background: rgba(171,59,50,.10); color: #7f2923; }
.status-mom { background: rgba(217,164,65,.20); color: #725013; }
.danger-zone-section {
  border-color: rgba(171,59,50,.26);
  background: rgba(171,59,50,.035);
}
.danger-zone-section > summary .disclosure-edit { color: var(--red); }
.danger-delete-form {
  border: 1px solid rgba(171,59,50,.18);
  border-radius: 18px;
  padding: 12px;
  background: rgba(255,255,255,.72);
}
.danger-delete-form .button { width: fit-content; }
@media (max-width: 980px) {
  .final-users,
  .ops-grid,
  .ops-two-column {
    grid-template-columns: 1fr;
  }
  .ops-grid > .panel:nth-child(4),
  .ops-grid > .panel:nth-child(5) {
    grid-column: auto;
  }
  .ops-count-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 720px) {
  .ops-count-grid {
    grid-template-columns: 1fr;
  }
  .ops-inline-form,
  .ops-device-list article {
    grid-template-columns: 1fr;
  }
  .access-detail-grid > .panel:nth-child(n+5) {
    grid-column: auto;
  }
  .ops-inline-form .button,
  .ops-reference-form .button {
    width: 100%;
  }
  .ops-device-metrics {
    justify-content: flex-start;
  }
  .invite-copy-row {
    grid-template-columns: 1fr;
  }
  .invite-copy-row .button {
    width: 100%;
  }
  details.user-admin-card > summary {
    gap: 10px;
    padding: 12px;
  }
  details.user-admin-card .disclosure-body {
    padding: 10px;
  }
  details.user-admin-card .mobile-form-section {
    padding: 10px;
    border-radius: 18px;
  }
  .user-admin-head {
    align-items: flex-start;
    gap: 10px;
  }
  .user-admin-head .avatar.large {
    width: 58px;
    height: 58px;
    font-size: 20px;
  }
  .user-admin-card .meta-table div {
    display: grid;
    justify-content: stretch;
    gap: 4px;
  }
  .invite-resend-panel {
    grid-template-columns: 1fr;
    padding: 12px;
    border-radius: 18px;
  }
  .invite-resend-panel .button {
    width: 100%;
  }
  .danger-delete-form .button {
    width: 100%;
  }
  .passkey-rename-form,
  .passkey-remove-form {
    grid-template-columns: 1fr;
  }
  .passkey-rename-form .button,
  .passkey-remove-form .button {
    width: 100%;
  }
  .profile-photo-editor { grid-template-columns: 1fr; gap: 12px; padding: 12px; }
  .profile-photo-stage { justify-items: start; text-align: left; }
  .profile-photo-frame {
    width: 128px;
    height: 128px;
    min-width: 128px;
    min-height: 128px;
    border-width: 5px;
  }
  .profile-photo-tools { gap: 10px; }
  .nudge-grid { grid-template-columns: repeat(3, minmax(44px, 1fr)); gap: 6px; }
}

@media (max-width: 860px) {
  .login-shell-visual {
    grid-template-columns: 1fr;
    min-height: calc(100vh - 110px);
    min-height: calc(100svh - 110px);
    padding: 14px;
    align-items: center;
    border-radius: 28px;
  }
  .login-shell-visual::after {
    background: linear-gradient(180deg, rgba(255, 247, 231, .12), rgba(255, 247, 231, .04) 38%, rgba(255, 247, 231, .18));
  }
  .login-art img { object-position: center top; }
  .login-panel {
    grid-column: 1;
    justify-self: center;
    max-width: 420px;
    gap: 12px;
  }
  .login-shell-visual .login-brand {
    padding: 14px;
    border-radius: 22px;
    gap: 5px 12px;
  }
  .login-shell-visual .auth-method-stack { gap: 10px; }
  .login-card.welcome-pass { gap: 12px; }
  .login-shell-visual .login-brand h1 { font-size: 34px; }
  .login-shell-visual .crest.large,
  .login-shell-visual .crest-img.large {
    width: 60px;
    height: 60px;
    border-radius: 20px;
    font-size: 36px;
  }
}

@media (max-width: 520px) {
  .pwa-update-prompt {
    grid-template-columns: 1fr;
    bottom: calc(var(--fab-bottom-offset) + var(--fab-size) + 22px);
  }
  .pwa-update-actions { justify-content: stretch; }
  .pwa-update-actions .button { width: 100%; }
  .login-shell-visual {
    min-height: calc(100vh - 96px);
    min-height: calc(100svh - 96px);
    padding: 10px;
    border-radius: 24px;
  }
  .login-shell-visual .login-card {
    padding: 14px;
    border-radius: 22px;
  }
  .login-card.welcome-pass {
    padding: 16px;
  }
  .login-card.welcome-pass::before { height: 82px; }
  .welcome-pass-head { gap: 6px; }
  .welcome-pass-head h2 { font-size: 30px; }
  .oauth-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }
  .provider-chip {
    min-height: 66px;
    flex-direction: column;
    gap: 6px;
    padding: 9px 6px;
    font-size: 13px;
    line-height: 1.1;
  }
  .auth-provider { min-height: 44px; }
  .auth-mark { width: 26px; height: 26px; border-radius: 9px; }
  .passkey-primary { min-height: 56px; }
  .login-shell-visual .login-brand h1 { font-size: 30px; }
  .login-shell-visual .login-brand p { font-size: 14px; }
}

@media (display-mode: standalone) {
  body {
    min-height: 100dvh;
  }

  .app-shell {
    padding-top: calc(14px + env(safe-area-inset-top, 0px));
    padding-bottom: var(--mobile-content-bottom-padding);
  }

  body.authenticated-shell .app-shell {
    padding-top: 0;
  }

  .bottom-nav {
    bottom: var(--mobile-nav-bottom-gap);
  }

  .modal-backdrop {
    padding-bottom: max(10px, var(--mobile-safe-bottom));
  }
}

html.standalone-app,
html.standalone-app body {
  min-height: 100dvh;
}

html.standalone-app .app-shell {
  padding-top: calc(14px + env(safe-area-inset-top, 0px));
  padding-bottom: var(--mobile-content-bottom-padding);
}

html.standalone-app body.authenticated-shell .app-shell {
  padding-top: 0;
}

html.standalone-app .bottom-nav {
  bottom: var(--mobile-nav-bottom-gap);
}

html.standalone-app .modal-backdrop {
  padding-bottom: max(10px, var(--mobile-safe-bottom));
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
    transition-delay: 0ms !important;
  }

  .file-preview-body img {
    transition: none !important;
  }

  .button.is-pending::before {
    animation: none;
    border-right-color: currentColor;
    opacity: .62;
  }
}