:root {
  --ink: #172017;
  --muted: #61705f;
  --line: #d9ded3;
  --paper: #fbfaf6;
  --panel: #ffffff;
  --brand: #243326;
  --accent: #b55f31;
  --sun: #d89a22;
  --ok: #2f6f48;
  --warn: #9c3d2e;
  --shadow: 0 12px 30px rgba(23, 32, 23, 0.08);
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --sticky-menu-height: 64px;
  --admin-rail-width: 280px;
  --admin-rail-collapsed-width: 88px;
}

* { box-sizing: border-box; }
html {
  min-height: 100%;
  background: var(--paper);
  scroll-padding-top: calc(var(--sticky-menu-height) + 16px);
}
body {
  min-height: 100dvh;
  margin: 0;
  padding-bottom: var(--safe-bottom);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.45;
  letter-spacing: 0;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }

.app-loading-screen {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: none;
  place-items: center;
  padding: max(24px, var(--safe-top)) max(24px, var(--safe-right)) max(24px, var(--safe-bottom)) max(24px, var(--safe-left));
  background-color: var(--brand);
  background-image: linear-gradient(145deg, rgba(36, 51, 38, 0.96), rgba(23, 32, 23, 0.98));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 220ms ease, visibility 220ms ease;
}
.app-loader-active .app-loading-screen {
  display: grid;
}
.app-loader-active:not(.app-loader-ready):not(.app-loader-expired) .app-loading-screen {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.app-loading-screen__mark {
  position: relative;
  display: grid;
  place-items: center;
  width: clamp(86px, 24vw, 128px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fbfaf6;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.34);
}
.app-loading-screen__mark::before {
  content: "";
  position: absolute;
  inset: -13px;
  border-radius: inherit;
  border: 3px solid rgba(255, 255, 255, 0.18);
  border-top-color: var(--sun);
  border-right-color: rgba(255, 255, 255, 0.5);
  animation: app-loader-spin 900ms linear infinite;
}
.app-loading-screen__mark img {
  width: 72%;
  height: 72%;
  object-fit: contain;
}

@keyframes app-loader-spin {
  to {
    transform: rotate(360deg);
  }
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 10;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 64px;
  padding-top: max(10px, var(--safe-top));
  padding-right: max(clamp(14px, 4vw, 32px), var(--safe-right));
  padding-bottom: 10px;
  padding-left: max(clamp(14px, 4vw, 32px), var(--safe-left));
  background: rgba(251, 250, 246, 0.94);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
}
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; }
.topbar__main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-width: 0;
}
.topbar__main:empty {
  display: none;
}
.brand-mark {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  color: white;
  background: var(--brand);
  border-radius: 8px;
  font-size: 0.8rem;
}
.topbar-shift-menu {
  position: relative;
  display: none;
  justify-self: center;
  margin: 0;
}
.topbar-shift-menu summary {
  list-style: none;
}
.topbar-shift-menu summary::-webkit-details-marker {
  display: none;
}
.topbar-shift-clock {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 0;
  min-height: 38px;
  padding: 6px 10px;
  border: 1px solid #cce1d1;
  border-radius: 999px;
  background: #edf6ef;
  color: var(--brand);
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}
.topbar-shift-clock span {
  color: var(--muted);
  font-size: 0.68rem;
  text-transform: uppercase;
}
.topbar-shift-clock strong {
  color: var(--brand);
}
.topbar-shift-menu[open] .topbar-shift-clock {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(36, 51, 38, 0.14);
}
.topbar-shift-menu__options {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}
.topbar-shift-menu__project {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 56px;
  padding: 10px 12px;
  border: 1px solid #cce1d1;
  border-radius: 8px;
  background: #edf6ef;
  color: var(--brand);
  font-weight: 900;
}
.topbar-shift-menu__project span {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.topbar-shift-menu__project small {
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 900;
  text-transform: uppercase;
}
.topbar-shift-menu__project strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nav { display: flex; justify-content: center; gap: 6px; flex-wrap: wrap; min-width: 0; }
.topbar__utilities {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  min-width: 0;
}
.topbar__utilities > * {
  flex: 0 1 auto;
  min-width: 0;
}
.nav a, .button, button {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px 13px;
  background: var(--panel);
  color: var(--ink);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.nav a:hover, .button:hover, button:hover { border-color: var(--accent); }
.nav .nav-current-project {
  border-color: #cce1d1;
  background: #edf6ef;
  color: var(--brand);
}
.primary {
  background: var(--brand);
  color: white;
  border-color: var(--brand);
}
.clock-in-button {
  position: relative;
  display: flex;
  width: 100%;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  overflow: hidden;
  isolation: isolate;
  min-height: 58px;
  padding: 8px 14px 8px 10px;
  text-align: left;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, background 160ms ease;
}
.clock-in-button:disabled {
  cursor: progress;
}
.clock-in-button__icon,
.clock-in-button__media {
  flex: 0 0 auto;
  position: relative;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  overflow: hidden;
  background: #fbfaf6;
  color: var(--brand);
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(23, 32, 23, 0.12), 0 1px 0 rgba(255, 255, 255, 0.18);
}
.clock-in-button__icon::before {
  content: "";
  width: 18px;
  height: 18px;
  border: 2px solid currentColor;
  border-radius: 50%;
}
.clock-in-button__icon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 8px;
  height: 6px;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translate(-1px, -6px);
}
.clock-in-button__media {
  display: none;
  border-radius: 50%;
}
.clock-in-button__media video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: contrast(1.2);
}
.clock-in-button__text {
  flex: 1 1 auto;
  display: grid;
  min-width: 0;
  gap: 2px;
}
.clock-in-button__label {
  min-width: 0;
  font-size: 1.05rem;
  line-height: 1.08;
  overflow-wrap: break-word;
}
.clock-in-button__hint {
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.1;
}
.clock-in-button.is-clocking-in,
.clock-in-button.is-hammering {
  border-color: var(--sun);
  box-shadow: 0 0 0 3px rgba(216, 154, 34, 0.2);
  transform: translateY(1px);
}
.clock-in-button.is-hammering .clock-in-button__icon {
  display: none;
}
.clock-in-button.is-hammering .clock-in-button__media {
  display: grid;
  animation: hammer-button-pop 900ms ease-out;
}
.clock-in-form {
  display: grid;
  gap: 8px;
  margin: 0;
}
.clock-in-form .form-status {
  margin: 0;
}
@keyframes hammer-button-pop {
  0% { transform: scale(0.98); }
  28% { transform: scale(1.08) rotate(-1deg); }
  56% { transform: scale(0.99); }
  100% { transform: scale(1); }
}
.button--quiet {
  background: transparent;
  color: var(--muted);
  border-style: dashed;
}
.button--quiet:hover,
.button--quiet:focus-visible {
  color: var(--ink);
}
.icon-button {
  width: 42px;
  padding: 0;
  font-size: 1.2rem;
}
.logout-form { margin: 0; }
.mobile-menu {
  position: relative;
  display: none;
  margin: 0;
  justify-self: end;
}
.mobile-menu__toggle {
  display: grid;
  place-items: center;
  width: 44px;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  cursor: pointer;
  list-style: none;
}
.mobile-menu__toggle::-webkit-details-marker {
  display: none;
}
.mobile-menu__icon {
  display: grid;
  gap: 5px;
  width: 20px;
}
.mobile-menu__icon span {
  display: block;
  height: 2px;
  border-radius: 999px;
  background: var(--ink);
}
.mobile-menu__panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 30;
  display: grid;
  gap: 4px;
  width: min(270px, calc(100vw - 28px));
  padding: 8px;
  border: 1px solid rgba(23, 32, 23, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 40px rgba(23, 32, 23, 0.16);
  max-height: calc(100dvh - var(--sticky-menu-height) - var(--safe-bottom) - 18px);
  overflow: auto;
  overscroll-behavior: contain;
}
.mobile-menu__panel a,
.mobile-menu__panel button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ink);
  font-weight: 850;
  text-align: left;
}
.mobile-menu__panel a:hover,
.mobile-menu__panel button:hover,
.mobile-menu__panel a:focus-visible,
.mobile-menu__panel button:focus-visible {
  background: #f4efe4;
}
.mobile-menu__panel .mobile-menu__current-project {
  display: grid;
  gap: 2px;
  min-width: 0;
  background: #edf6ef;
  color: var(--brand);
}
.mobile-menu__current-project span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}
.mobile-menu__current-project strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mobile-menu__logout {
  margin: 4px 0 0;
  padding-top: 4px;
  border-top: 1px solid var(--line);
}
.run-as-form {
  margin: 0;
}
.run-as-trigger {
  display: grid;
  gap: 2px;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
  text-align: left;
}
.run-as-trigger span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.run-as-trigger strong {
  font-size: 0.94rem;
}
.topbar__utilities .run-as-trigger,
.topbar__utilities .viewing-pill {
  max-width: min(100%, 320px);
}
.topbar__utilities .run-as-trigger strong,
.topbar__utilities .viewing-pill strong,
.topbar__utilities .viewing-pill small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.page {
  width: min(1180px, calc(100% - 28px));
  margin: 0 auto;
  padding: 24px 0 48px;
}
.pull-refresh-indicator {
  position: fixed;
  top: max(10px, env(safe-area-inset-top));
  left: 50%;
  z-index: 80;
  min-width: 148px;
  padding: 9px 13px;
  border: 1px solid #d7c28a;
  border-radius: 999px;
  background: #fff8e8;
  color: #76530d;
  box-shadow: var(--shadow);
  font-size: 0.86rem;
  font-weight: 900;
  text-align: center;
  transform: translate(-50%, -130%);
  transition: transform 160ms ease, opacity 160ms ease;
  opacity: 0;
  pointer-events: none;
}
.pull-refresh-indicator.is-visible {
  opacity: 1;
}
.pull-refresh-indicator[hidden] {
  display: none;
}
.mobile-onboarding {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  margin-bottom: 18px;
  padding: 16px;
  border-left: 5px solid var(--accent);
}
.mobile-onboarding[hidden] {
  display: none;
}
.mobile-onboarding__copy {
  display: grid;
  gap: 8px;
}
.mobile-onboarding__copy h2,
.mobile-onboarding__copy p {
  margin-bottom: 0;
}
.mobile-onboarding__steps {
  display: grid;
  gap: 5px;
  margin: 0;
  padding-left: 20px;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.4;
}
.mobile-onboarding__actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.mobile-onboarding__actions [hidden] {
  display: none;
}
.page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 4px; font-size: clamp(2rem, 7vw, 4rem); line-height: 0.95; letter-spacing: 0; }
h2 { margin-bottom: 10px; font-size: 1.1rem; }
.eyebrow {
  margin-bottom: 8px;
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}
.muted, small { color: var(--muted); }
.alert {
  padding: 12px;
  border: 1px solid #efb1a6;
  border-radius: 8px;
  background: #fff0ed;
  color: var(--warn);
}
.status-strip {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 0 18px;
  padding: 12px 14px;
  background: #edf6ef;
  border: 1px solid #cce1d1;
  border-radius: 8px;
}
.current-shift {
  position: sticky;
  top: var(--sticky-menu-height);
  z-index: 9;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  margin: -10px auto 20px;
  padding: 12px 14px;
  background: #edf6ef;
  border: 1px solid #cce1d1;
  border-radius: 8px;
}
.current-shift__summary {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}
.current-shift__meta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
}
.current-shift__live {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 9px;
  border-radius: 999px;
  background: #d8eddf;
  color: var(--ok);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}
.current-shift__live--icon {
  justify-content: center;
  width: 34px;
  min-width: 34px;
  padding: 0;
  aspect-ratio: 1;
}
.current-shift__live--icon .current-shift__action-icon {
  width: 17px;
  height: 17px;
  stroke-width: 2.2;
}
.current-shift__actions {
  display: grid;
  grid-template-columns: minmax(348px, auto) repeat(3, auto);
  gap: 8px;
  align-items: center;
  justify-content: end;
  min-width: 0;
}
.current-shift__project {
  display: none;
}
.current-shift__actions form {
  margin: 0;
}
.current-shift__actions .button,
.current-shift__actions button {
  width: 100%;
}
.current-shift__icon-action,
.current-shift__photo-form .button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
}
.current-shift__clock-out-menu {
  display: none;
  margin: 0;
}
.current-shift__clock-out-menu summary {
  list-style: none;
}
.current-shift__clock-out-menu summary::-webkit-details-marker {
  display: none;
}
.current-shift__clock-out-menu[open] summary {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(36, 51, 38, 0.14);
}
.current-shift__action-icon {
  display: block;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.current-shift__action-icon .current-shift__icon-fill {
  fill: currentColor;
  stroke: none;
}
.current-shift__clock-out-form {
  display: grid;
  gap: 8px;
  align-items: end;
}
.current-shift__clock-out-form--quick {
  grid-template-columns: minmax(180px, 220px) minmax(160px, 200px);
}
.current-shift__clock-out-options {
  position: absolute;
  top: calc(100% + 8px);
  right: 14px;
  z-index: 12;
  width: min(360px, calc(100vw - 28px));
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow);
  max-height: calc(100dvh - var(--sticky-menu-height) - var(--safe-bottom) - 18px);
  overflow: auto;
  overscroll-behavior: contain;
}
.current-shift__clock-out-choice-form {
  display: grid;
  gap: 8px;
  min-width: 0;
  margin: 0;
}
.current-shift__clock-out-choice-form--personal {
  grid-template-columns: 1fr;
}
.current-shift__clock-choice {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  min-height: 54px;
  padding: 10px 12px;
  overflow-wrap: anywhere;
  text-align: left;
}
.current-shift__clock-choice .current-shift__action-icon {
  width: 22px;
  height: 22px;
}
.current-shift__clock-choice span {
  flex: 1 1 auto;
  min-width: 0;
}
.current-shift__clock-choice--end,
.current-shift__clock-choice--lunch,
.current-shift__clock-choice--personal {
  width: 100%;
}
.current-shift__reason {
  min-width: 0;
}
.current-shift__reason select,
.current-shift__personal-note input {
  min-height: 44px;
}
.current-shift__personal-note {
  min-width: 0;
}
.current-shift__clock-out-choice-form--personal .current-shift__clock-choice {
  order: 1;
}
.current-shift__personal-note {
  order: 2;
}
.current-shift__clock-out-form .form-status,
.current-shift__clock-out-choice-form .form-status {
  margin: 0;
}
.current-shift__clock-out-choice-form .form-status {
  grid-column: 1 / -1;
}
.note-dialog {
  width: min(500px, calc(100% - 32px));
  background: var(--panel);
}
.note-dialog[open] {
  display: grid;
  grid-template-rows: auto auto;
  align-content: start;
}
.note-dialog__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 18px 18px 8px;
}
.note-dialog__head strong {
  display: block;
  font-size: 1.35rem;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.note-dialog__project {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 800;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.note-dialog__head form {
  margin: 0;
}
.note-dialog__close {
  display: grid;
  place-items: center;
  width: 42px;
  min-width: 42px;
  min-height: 42px;
  border-radius: 999px;
  background: #f7f5ef;
  font-size: 1.25rem;
  line-height: 1;
}
.note-dialog__form {
  gap: 14px;
  padding: 8px 18px 18px;
}
.note-dialog__form textarea {
  min-height: 150px;
  background: #fbfaf6;
  line-height: 1.35;
  resize: vertical;
}
.project-manager-notice-dialog {
  width: min(660px, calc(100% - 32px));
}
.note-dialog__actions {
  display: flex;
  justify-content: flex-end;
}
.note-dialog__actions button {
  min-width: 140px;
  min-height: 48px;
}
.morning-alert-dialog {
  width: min(620px, calc(100% - 28px));
  background: var(--panel);
}
.morning-alert-dialog[open] {
  display: block;
}
.morning-alert-dialog__form {
  display: grid;
  gap: 0;
  margin: 0;
}
.morning-alert-dialog__head {
  display: flex;
  gap: 14px;
  justify-content: space-between;
  align-items: flex-start;
  padding: max(22px, calc(var(--safe-top) + 14px)) max(22px, var(--safe-right)) 14px max(22px, var(--safe-left));
  border-bottom: 1px solid var(--line);
  background: #f7f5ef;
}
.morning-alert-dialog__head h2 {
  margin: 0;
  font-size: 1.45rem;
  line-height: 1.08;
}
.morning-alert-dialog__body {
  display: grid;
  gap: 12px;
  max-height: min(58dvh, 520px);
  overflow: auto;
  padding: 16px max(22px, var(--safe-right)) 16px max(22px, var(--safe-left));
}
.morning-alert {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid rgba(23, 32, 23, 0.1);
  border-left: 5px solid #b85c38;
  border-radius: 8px;
  background: #fffdfa;
}
.morning-alert h3,
.morning-alert p {
  margin: 0;
}
.morning-alert h3 {
  font-size: 1.08rem;
}
.morning-alert small {
  color: var(--muted);
  font-weight: 800;
}
.morning-alert-dialog__actions {
  display: flex;
  justify-content: flex-end;
  padding: 14px max(22px, var(--safe-right)) max(22px, calc(var(--safe-bottom) + 18px)) max(22px, var(--safe-left));
}
.morning-alert-dialog__actions button {
  min-height: 48px;
  min-width: 150px;
}
.queue-status,
.form-status {
  display: none;
  margin: 0 0 14px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 800;
}
.queue-status.is-visible,
.form-status.is-visible { display: block; }
.queue-status[data-state="waiting"],
.form-status[data-state="queued"],
.form-status[data-state="requesting"],
.form-status[data-state="submitting"] {
  border-color: #edd39a;
  background: #fff8e8;
  color: #76530d;
}
.queue-status[data-state="syncing"] {
  border-color: #bdd7ef;
  background: #eef7ff;
  color: #28577c;
}
.queue-status[data-state="synced"],
.form-status[data-state="captured"] {
  border-color: #cce1d1;
  background: #edf6ef;
  color: var(--ok);
}
.form-status[data-state="cleared"] {
  border-color: #d7d2c5;
  background: #f8f5ed;
  color: var(--muted);
}
.queue-status[data-state="failed"],
.form-status[data-state^="failed"],
.form-status[data-state="geolocation_unavailable"] {
  border-color: #efb1a6;
  background: #fff0ed;
  color: var(--warn);
}
.offline-queue-status {
  margin: 0 0 14px;
  box-shadow: var(--shadow);
}
.quick-photo-form {
  display: grid;
}
.quick-photo-form .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
}
.action-detail {
  display: grid;
  gap: 10px;
}
.action-detail summary {
  color: var(--accent);
  font-size: 0.92rem;
  font-weight: 900;
  cursor: pointer;
  list-style: none;
}
.action-detail summary::-webkit-details-marker {
  display: none;
}
.action-detail__form {
  margin-top: 4px;
}
.photo-action-card {
  display: grid;
  gap: 12px;
}
.photo-action-card > p {
  margin: 0;
}
.photo-action-card__form .button {
  min-height: 56px;
}
.section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}
.section-head h2 { margin-bottom: 0; }
.photo-section-head__actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: flex-end;
}
.photo-section-head__actions .quick-photo-form {
  margin: 0;
}
.date-filter {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 8px;
  width: min(420px, 100%);
}
.date-filter label {
  min-width: 0;
}
.date-filter input {
  min-width: 0;
}
.date-filter button {
  min-width: 92px;
}
.photo-date-tools {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  width: min(430px, 100%);
  margin: 0 0 16px;
}
.photo-date-calendar,
.photo-date-list {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
}
.photo-date-calendar__head {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
}
.photo-date-calendar__month {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 32px;
  gap: 8px;
  align-items: center;
  width: 100%;
}
.photo-date-calendar__month strong {
  text-align: center;
}
.photo-date-calendar__month-link {
  display: grid;
  place-items: center;
  min-width: 32px;
  min-height: 32px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1;
}
.photo-date-calendar__head strong,
.photo-date-list > strong {
  font-size: 0.95rem;
}
.photo-date-calendar__head span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}
.photo-date-calendar__weekdays,
.photo-date-calendar__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
}
.photo-date-calendar__weekdays span {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
}
.photo-date-day {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 8px;
  color: color-mix(in srgb, var(--ink) 72%, white);
  font-size: 0.88rem;
  font-weight: 700;
}
.photo-date-day.has-photos {
  border-color: #cce1d1;
  background: #edf6ef;
  color: var(--brand);
  font-weight: 950;
}
.photo-date-day.is-selected {
  border-color: var(--brand);
  box-shadow: 0 0 0 2px rgba(36, 51, 38, 0.12);
}
.photo-date-day small {
  position: absolute;
  right: 4px;
  bottom: 2px;
  color: var(--ok);
  font-size: 0.62rem;
  font-weight: 950;
}
.photo-date-day--empty {
  min-height: 38px;
}
.photo-date-list__links {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.photo-date-list__links a {
  display: grid;
  gap: 2px;
  min-height: 42px;
  padding: 7px 10px;
  border: 1px solid #cce1d1;
  border-radius: 8px;
  background: #edf6ef;
  color: var(--brand);
  font-weight: 900;
}
.photo-date-list__links a.is-active {
  border-color: var(--brand);
  box-shadow: 0 0 0 2px rgba(36, 51, 38, 0.12);
}
.photo-date-list__links small {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 850;
}
.count-pill {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 5px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--muted);
  font-size: 0.85rem;
  font-weight: 800;
}
.auth-panel {
  width: min(430px, 100%);
  margin: 8vh auto;
  padding: 22px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}
.auth-footnote {
  margin: 14px 0 0;
  color: var(--muted);
  font-weight: 800;
}
.auth-footnote a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.auth-check {
  margin: 0;
  color: var(--ink);
  font-weight: 800;
}
.auth-check span {
  line-height: 1.25;
}
.invite-profile-preview {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}
.invite-profile-preview__controls {
  display: grid;
  justify-items: start;
  min-width: 0;
  gap: 8px;
}
.invite-profile-preview__label,
.field-label > span:first-child {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
}
.invite-profile-preview__button {
  width: auto;
  max-width: 100%;
}
.invite-profile-preview__button span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.invite-profile-preview__status {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.stack { display: grid; gap: 12px; }
.form-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 12px;
  align-items: end;
}
.field-label {
  display: grid;
  min-width: 0;
  gap: 6px;
}
label { display: grid; gap: 6px; min-width: 0; color: var(--muted); font-size: 0.9rem; font-weight: 700; }
input, select, textarea {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: white;
  color: var(--ink);
  font: inherit;
}
.readonly-field {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #f7f5ef;
  color: var(--ink);
  font: inherit;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
input[type="file"] {
  max-width: 100%;
  min-width: 0;
  padding: 8px 10px;
  overflow: hidden;
}
textarea { resize: vertical; }
@media (max-width: 420px) {
  .auth-panel {
    margin: 5vh auto;
    padding: 18px;
  }
  .invite-profile-preview {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .invite-profile-preview .account-avatar--xl {
    --avatar-size: 96px;
  }
}
fieldset {
  margin: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
}
legend { color: var(--muted); font-weight: 800; }
.check { display: flex; align-items: center; gap: 8px; margin: 8px 0; }
.check input { width: auto; min-height: auto; }

.project-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 14px;
}
.project-card, .admin-card, .work-panel > div, .work-panel > form, .two-column > form, .feed article, .photo-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.project-card {
  display: grid;
  gap: 12px;
  min-height: 210px;
  padding: 16px;
  background: var(--panel);
  border-color: color-mix(in srgb, var(--company-bg, #eef1ea) 60%, var(--line));
  box-shadow: inset 0 4px 0 color-mix(in srgb, var(--company-bg, #eef1ea) 70%, white), var(--shadow);
}
.project-card h2 { font-size: 1.35rem; margin: 0; }
.pill {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 9px;
  border-radius: 999px;
  background: #f4ead6;
  color: #6d4714;
  font-size: 0.78rem;
  font-weight: 800;
}
.pill.live { background: #e2f2e6; color: var(--ok); }
.pill--edited {
  border: 1px solid #cfd8c9;
  background: #eef1ea;
  color: #4f5f4d;
}
.account-avatar {
  position: relative;
  display: grid;
  place-items: center;
  width: var(--avatar-size, 44px);
  height: var(--avatar-size, 44px);
  flex: 0 0 var(--avatar-size, 44px);
  overflow: hidden;
  border: 1px solid rgba(23, 32, 23, 0.1);
  border-radius: 50%;
  background: #243326;
  color: white;
  font-size: 0.86rem;
  font-weight: 900;
}
.account-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.account-avatar--sm {
  --avatar-size: 38px;
}
.account-avatar--xl {
  --avatar-size: 112px;
  font-size: 2rem;
}
.account-settings-grid {
  display: grid;
  grid-template-columns: minmax(240px, 0.8fr) minmax(320px, 1fr) minmax(420px, 1.05fr);
  gap: 16px;
  align-items: start;
  grid-auto-flow: dense;
}
.account-settings-grid > * {
  min-width: 0;
}
.account-profile-overview {
  justify-items: start;
}
.account-profile-overview h2 {
  margin-bottom: 4px;
  overflow-wrap: anywhere;
}
.account-profile-overview .muted,
.account-form-card .muted {
  margin-bottom: 0;
}
.account-details-card {
  grid-column: 3;
  grid-row: span 2;
}
.account-password-card {
  grid-column: 1 / span 2;
}
.account-device-access-card .check {
  align-items: flex-start;
}
.account-device-access-card .company-edit-actions {
  justify-content: flex-start;
}
.account-device-access-card .form-status {
  margin-bottom: 0;
}
.install-app-steps {
  display: grid;
  gap: 7px;
  margin: 0;
  padding-left: 20px;
  color: var(--muted);
  font-size: 0.93rem;
  line-height: 1.45;
}
.install-app-steps[hidden] {
  display: none;
}
.install-app-steps li {
  padding-left: 2px;
}
.install-app-card .company-edit-actions[hidden],
[data-install-actions][hidden] {
  display: none;
}
.account-notification-card {
  grid-column: span 2;
}
.account-notification-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.account-notification-panel,
.account-notification-preferences {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fffdfa;
}
.account-notification-panel h3,
.account-notification-preferences h3 {
  margin: 0;
  font-size: 1rem;
}
.notification-channel-options {
  display: grid;
  gap: 10px;
}
.notification-device-summary {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}
.notification-device-summary span {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}
.notification-device-summary strong {
  font-size: 0.98rem;
  line-height: 1.25;
}
.notification-device-summary small {
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.35;
}
.notification-channel-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}
.notification-channel-option input {
  width: auto;
  min-height: auto;
  margin-top: 3px;
}
.notification-channel-option span {
  display: grid;
  gap: 2px;
}
.notification-channel-option small {
  font-size: 0.84rem;
  line-height: 1.35;
}
.account-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.account-photo-field {
  display: grid;
  gap: 10px;
}
.account-photo-editor {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px dashed #cfd6c8;
  border-radius: 16px;
  background: linear-gradient(180deg, #fcfbf8 0%, #f4f1e8 100%);
}
.account-photo-editor__empty {
  display: grid;
  gap: 4px;
}
.account-photo-editor__empty strong {
  font-size: 0.95rem;
}
.account-photo-editor__empty .muted {
  margin-top: 0;
}
.account-photo-editor__workspace {
  display: grid;
  grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
  gap: 16px;
  align-items: center;
}
.account-photo-editor__empty[hidden],
.account-photo-editor__workspace[hidden] {
  display: none;
}
.account-photo-editor__stage-wrap {
  display: grid;
  width: 100%;
  justify-content: center;
}
.account-photo-editor__stage {
  position: relative;
  width: clamp(220px, 32vw, 320px);
  height: clamp(220px, 32vw, 320px);
  overflow: hidden;
  border: 4px solid rgba(255, 255, 255, 0.92);
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0) 34%),
    linear-gradient(135deg, #d8e5da, #eef2e8);
  box-shadow:
    inset 0 0 0 1px rgba(36, 51, 38, 0.08),
    0 18px 36px rgba(23, 32, 23, 0.12);
  touch-action: none;
  cursor: grab;
}
.account-photo-editor.is-dragging .account-photo-editor__stage {
  cursor: grabbing;
}
.account-photo-editor__stage img {
  position: absolute;
  inset: 0 auto auto 0;
  max-width: none;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
  transform-origin: top left;
}
.account-photo-editor__controls {
  display: grid;
  gap: 14px;
}
.account-photo-editor__zoom {
  display: grid;
  gap: 8px;
}
.account-photo-editor__zoom-row {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  gap: 10px;
  align-items: center;
}
.account-photo-editor__zoom > span:first-child {
  font-size: 0.82rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}
.account-photo-editor__zoom input {
  width: 100%;
  min-height: auto;
}
.account-photo-editor__zoom-button {
  display: grid;
  place-items: center;
  width: 44px;
  min-height: 44px;
  padding: 0;
  font-size: 1.35rem;
  line-height: 1;
}
.account-photo-editor__controls .button {
  justify-self: start;
}
.worker-identity {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  max-width: 100%;
  color: var(--ink);
  font-weight: 900;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.worker-identity--compact {
  gap: 0;
  width: fit-content;
}
.stats-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: auto 0 0;
}
.stats-row div { padding-top: 10px; border-top: 1px solid var(--line); }
dt { color: var(--muted); font-size: 0.74rem; font-weight: 800; text-transform: uppercase; }
dd { margin: 2px 0 0; font-weight: 900; }

.work-panel, .two-column {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
.work-panel--single {
  grid-template-columns: minmax(0, 1fr);
}
.work-panel > div, .work-panel > form, .two-column > form { padding: 16px; }
.tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  margin: 22px 0 14px;
  padding-bottom: 4px;
}
.tabs a {
  white-space: nowrap;
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  font-weight: 800;
}
.tabs a.is-active {
  border-color: var(--brand);
  background: #edf6ef;
  color: var(--brand);
  box-shadow: 0 0 0 2px rgba(36, 51, 38, 0.08);
}
.content-tab-panel[hidden] {
  display: none;
}
.admin-tabs {
  display: inline-flex;
  max-width: 100%;
  gap: 4px;
  overflow-x: auto;
  margin: 0 0 18px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #eef1ea;
}
.admin-tabs a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 8px 14px;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--muted);
  font-weight: 900;
  white-space: nowrap;
}
.admin-tabs a:hover {
  border-color: var(--accent);
  color: var(--ink);
}
.admin-tabs a.is-active {
  background: var(--panel);
  border-color: var(--line);
  color: var(--ink);
  box-shadow: 0 5px 14px rgba(23, 32, 23, 0.08);
}
.section { margin: 26px 0; }
.section[id] { scroll-margin-top: 92px; }
.admin-tab-panel.section { margin-top: 0; }
.admin-tab-panel[hidden] { display: none; }
.admin-settings-stack {
  gap: 18px;
}
.admin-settings-tabs {
  align-self: flex-start;
  margin-bottom: 0;
}
.admin-settings-tab-panel {
  display: grid;
  gap: 18px;
  outline: none;
}
.admin-settings-tab-panel .muted {
  overflow-wrap: anywhere;
}
.admin-settings-section-intro {
  padding: 24px;
  background: linear-gradient(135deg, rgba(244, 239, 228, 0.95) 0%, rgba(255, 255, 255, 0.95) 100%);
}
.admin-settings-section-intro h2 {
  margin-bottom: 8px;
}
.admin-settings-section-intro .muted {
  max-width: 760px;
  margin-bottom: 0;
  overflow-wrap: anywhere;
}
.photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 14px;
}
.photo-card { overflow: hidden; }
.photo-card img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: #e5e1d8;
}
.card-body { display: grid; gap: 8px; padding: 12px; }
.photo-card__caption {
  margin: 0;
  overflow-wrap: anywhere;
}
.photo-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.photo-card__actions button {
  min-height: 40px;
}
.admin-photo-filters {
  margin-bottom: 16px;
}
.admin-photo-review {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 140px;
  gap: 14px;
  align-items: start;
}
.photo-review-stage {
  display: grid;
  gap: 12px;
  min-width: 0;
}
.photo-review-catchupbar {
  position: sticky;
  top: 92px;
  z-index: 6;
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) 46px;
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 22px;
  background: rgba(251, 250, 246, 0.94);
  box-shadow: 0 18px 38px rgba(23, 32, 23, 0.08);
  backdrop-filter: blur(16px);
}
.photo-review-nav-button {
  display: inline-grid;
  place-items: center;
  width: 46px;
  min-width: 46px;
  height: 46px;
  min-height: 46px;
  padding: 0;
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--brand);
  font-size: 1.5rem;
  line-height: 1;
}
.photo-review-progress {
  display: grid;
  gap: 4px;
  min-width: 0;
  text-align: center;
}
.photo-review-progress strong {
  font-size: clamp(1.05rem, 1.8vw, 1.32rem);
  line-height: 1;
}
.photo-review-progress span:not(.photo-review-progressbar) {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}
.photo-review-progressbar {
  display: block;
  width: min(220px, 100%);
  height: 4px;
  margin: 3px auto 0;
  overflow: hidden;
  border-radius: 999px;
  background: #e3e5dd;
}
.photo-review-progressbar span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: var(--brand);
  transition: width 180ms ease;
}
.photo-review-card {
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(320px, 0.72fr);
  gap: 0;
  min-width: 0;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--company-bg, #eef1ea) 60%, var(--line));
  border-radius: 26px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), color-mix(in srgb, var(--company-bg, #eef1ea) 20%, #ffffff));
  box-shadow: 0 22px 46px rgba(23, 32, 23, 0.08);
  touch-action: pan-y;
}
.photo-review-card[hidden],
.photo-review-thumb[hidden] {
  display: none;
}
.photo-review-image-shell {
  display: grid;
  place-items: center;
  min-height: min(72vh, 760px);
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(13, 19, 14, 0.88), rgba(17, 24, 18, 0.98)),
    var(--brand);
}
.photo-review-image-shell img {
  display: block;
  max-width: 100%;
  max-height: min(72vh, 760px);
  object-fit: contain;
}
.photo-review-meta {
  display: grid;
  gap: 16px;
  align-content: start;
  min-width: 0;
  padding: 22px;
}
.photo-review-meta h2 {
  margin: 0 0 4px;
  font-size: clamp(1.6rem, 2vw, 2.2rem);
  line-height: 1.02;
  text-wrap: balance;
}
.photo-review-facts {
  grid-template-columns: 1fr;
}
.photo-review-action-form {
  display: grid;
  gap: 10px;
  margin-top: auto;
}
.photo-review-step-controls,
.photo-review-links {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.photo-review-step-controls {
  justify-content: space-between;
}
.photo-review-step-controls .link-button {
  min-height: 32px;
  padding-inline: 0;
}
.photo-review-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
}
.photo-review-controls button {
  min-height: 54px;
  border-radius: 15px;
  font-size: 1rem;
}
.photo-review-keep {
  background: rgba(255, 255, 255, 0.88);
}
.photo-review-reviewed {
  box-shadow: 0 12px 24px rgba(36, 51, 38, 0.16);
}
.photo-review-links .link-button {
  min-height: 38px;
}
.photo-review-rail {
  position: sticky;
  top: 100px;
  display: grid;
  gap: 8px;
  max-height: calc(100vh - 128px);
  overflow-y: auto;
  padding-right: 2px;
}
.photo-review-thumb {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  overflow: hidden;
  border: 3px solid transparent;
  border-radius: 12px;
  background: transparent;
  transition: border-color 160ms ease, transform 160ms ease;
}
.photo-review-thumb img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
.photo-review-thumb.is-active {
  border-color: var(--brand);
  transform: translateY(-1px);
}
.photo-review-thumb.is-reviewed::after {
  content: "Reviewed";
  position: absolute;
  inset: auto 5px 5px 5px;
  padding: 3px 5px;
  border-radius: 999px;
  background: rgba(226, 242, 230, 0.94);
  color: var(--ok);
  font-size: 0.62rem;
  font-weight: 900;
  text-align: center;
}
.pill.ok {
  background: #e2f2e6;
  color: var(--ok);
}
.feed { display: grid; gap: 10px; }
.feed article { padding: 14px; }
.note-thread-list {
  display: grid;
  gap: 10px;
  max-width: 860px;
}
.note-thread {
  display: grid;
  gap: 10px;
}
.note-thread__head {
  display: flex;
  gap: 10px;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
}
.note-thread__head strong {
  min-width: 0;
  overflow-wrap: anywhere;
}
.note-thread__head small {
  color: var(--muted);
  font-weight: 800;
}
.note-thread__body {
  margin: 0;
  line-height: 1.45;
  overflow-wrap: break-word;
}
.note-thread__reply-panel {
  display: grid;
  gap: 8px;
  justify-items: start;
}
.note-thread__reply-panel > summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  list-style: none;
  cursor: pointer;
}
.note-thread__reply-panel > summary::-webkit-details-marker {
  display: none;
}
.note-thread__reply-form {
  width: min(560px, 100%);
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfaf6;
}
.note-thread__reply-form textarea {
  min-height: 92px;
  background: #fff;
  line-height: 1.35;
  resize: vertical;
}
.note-thread__reply-actions {
  display: flex;
  justify-content: flex-end;
}
.note-thread__replies {
  display: grid;
  gap: 10px;
  margin-top: 2px;
  padding-left: 16px;
  border-left: 3px solid #e5ddd0;
}
.note-thread__reply {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 6px 0 4px 12px;
}
.note-thread__reply .note-thread__reply-form {
  width: 100%;
}
.activity-feed {
  display: grid;
  gap: 10px;
  max-width: 860px;
}
.activity-collapsed {
  display: grid;
  gap: 8px;
  max-width: 640px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow);
}
.activity-collapsed p {
  margin-bottom: 2px;
}
.activity-collapsed .button {
  justify-self: start;
}
.activity-notice {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  max-width: 860px;
  margin-bottom: 10px;
  padding: 10px 12px;
  border: 1px solid #cce1d1;
  border-radius: 8px;
  background: #edf6ef;
  color: var(--brand);
  font-weight: 800;
}
.activity-notice a {
  color: var(--accent);
  font-weight: 900;
}
.activity-notice--error {
  border-color: #efc8bf;
  background: #fff0ed;
  color: #8a2f1e;
}
.project-notice-stack {
  display: grid;
  gap: 12px;
}
.project-notice {
  display: grid;
  gap: 10px;
  padding: 16px 18px;
  border: 1px solid rgba(23, 32, 23, 0.1);
  border-left: 5px solid #b85c38;
  border-radius: 8px;
  background: #fffdfa;
  box-shadow: 0 14px 30px rgba(23, 32, 23, 0.06);
}
.project-notice__head {
  display: flex;
  gap: 12px;
  justify-content: space-between;
  align-items: flex-start;
}
.project-notice h2,
.project-notice p {
  margin: 0;
}
.project-notice h2 {
  font-size: 1.18rem;
  line-height: 1.12;
}
.project-notice small {
  color: var(--muted);
  font-weight: 800;
}
.admin-active-feed .activity-feed {
  max-width: none;
}
.admin-active-feed .activity-event-title a {
  color: inherit;
  text-decoration: none;
}
.admin-active-feed .activity-event-title a:hover,
.admin-active-feed .activity-event-title a:focus-visible {
  color: var(--brand);
  text-decoration: underline;
}
.activity-item {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: start;
  padding: 16px 18px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}
.activity-feed .activity-item {
  padding: 16px 18px;
}
.activity-kind {
  justify-self: start;
  align-self: start;
  min-height: 28px;
  padding: 5px 10px;
  border-radius: 999px;
  background: #eef1ea;
  color: var(--brand);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}
.activity-card-head {
  display: grid;
  gap: 8px;
}
.activity-title-row {
  display: flex;
  gap: 12px;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
}
.activity-title-with-avatar {
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: 0;
  flex-wrap: wrap;
}
.activity-title-row h3 {
  margin: 0;
  font-size: 1.18rem;
  line-height: 1.2;
}
.activity-title-row time {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 850;
  white-space: nowrap;
}
.activity-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.activity-body {
  display: grid;
  gap: 10px;
  align-content: start;
  min-width: 0;
}
.activity-body > * {
  min-width: 0;
}
.activity-event-title {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 900;
  line-height: 1.2;
}
.activity-detail {
  margin: 0;
  color: var(--muted);
  font-size: 0.95rem;
  font-weight: 750;
  line-height: 1.45;
}
.activity-note {
  margin: 0;
  overflow-wrap: break-word;
}
.activity-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(124px, 1fr));
  gap: 8px;
  margin: 0;
}
.activity-facts div {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfaf6;
}
.activity-facts dt {
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}
.activity-facts dd {
  margin: 0;
  color: var(--ink);
  font-size: 0.98rem;
  font-weight: 900;
  line-height: 1.25;
  overflow-wrap: break-word;
}
.captured-location {
  display: grid;
  gap: 3px;
}
.captured-location__label {
  display: block;
  font: inherit;
  color: inherit;
  overflow-wrap: break-word;
}
.captured-location a {
  color: var(--accent);
  font-size: 0.82rem;
  font-weight: 800;
  text-decoration: none;
}
.captured-location a:hover,
.captured-location a:focus-visible {
  text-decoration: underline;
}
.activity-title {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: baseline;
  margin: 0;
}
.activity-meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 0.85rem;
  font-weight: 700;
}
.activity-item > .activity-meta {
  display: grid;
  gap: 6px;
  align-content: start;
}
.activity-photo {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
.activity-photo-preview {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
.activity-photo img,
.activity-photo-preview img {
  width: 112px;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 8px;
  background: #e5e1d8;
}
.activity-photo-preview img {
  width: 132px;
}
.activity-photo-batch-thumbs {
  --batch-thumb-size: 63px;
  display: grid;
  grid-template-columns: repeat(2, var(--batch-thumb-size));
  gap: 6px;
  width: 132px;
}
.activity-photo-batch-thumbs a,
.activity-photo-batch-more {
  display: block;
  width: var(--batch-thumb-size);
  aspect-ratio: 1;
}
.activity-photo-batch-thumbs img {
  width: var(--batch-thumb-size);
  aspect-ratio: 1;
}
.activity-photo-batch-more {
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #ede8df;
  color: var(--ink);
  font-weight: 800;
}
.activity-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 0;
}
.activity-actions .link-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--accent);
  font-weight: 900;
}

.table-wrap {
  overflow-x: auto;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}
table { width: 100%; border-collapse: collapse; min-width: 760px; }
th, td { padding: 11px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: 0.78rem; text-transform: uppercase; }
.edit-row td { background: #f8f5ed; }
.edit-row.is-targeted td {
  background: #fff3d6;
  box-shadow: inset 4px 0 0 #d89a22;
}
.inline-edit {
  display: grid;
  grid-template-columns: repeat(6, minmax(140px, 1fr));
  gap: 10px;
  align-items: end;
}
.link-button {
  min-height: 34px;
  padding: 5px 9px;
  border: 0;
  background: transparent;
  color: var(--accent);
}
.time-filter-panel {
  display: grid;
  gap: 12px;
  min-width: 0;
  margin-bottom: 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow);
}
.time-filter-panel__head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  min-width: 0;
}
.time-filter-panel__head > div {
  min-width: 0;
}
.time-filter-panel__head h2,
.time-filter-panel__head p {
  margin-bottom: 0;
}
.time-filter-panel__head .count-pill {
  flex: 0 1 auto;
  max-width: 100%;
  overflow-wrap: anywhere;
  white-space: normal;
}
.time-filter-presets {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}
.time-filter-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 7px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfaf6;
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 850;
}
.time-filter-chip.is-active {
  border-color: var(--brand);
  background: var(--brand);
  color: white;
}
.time-filter-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  align-items: end;
  min-width: 0;
}
.time-filter-form label {
  min-width: 0;
}
.time-filter-form input[type="date"] {
  display: block;
  width: 100%;
  inline-size: 100%;
  max-inline-size: 100%;
  margin: 0;
}
.time-filter-form select {
  display: block;
  width: 100%;
}
.time-filter-form__actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}
.time-filter-form__actions .button,
.time-filter-form__actions button {
  min-height: 42px;
  min-width: 0;
  white-space: nowrap;
}
.time-overview {
  display: grid;
  gap: 14px;
  margin-bottom: 18px;
}
.time-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.time-kpis--payable {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.time-kpi {
  padding: 14px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}
.time-kpi span {
  display: block;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  text-transform: uppercase;
}
.time-kpi strong {
  display: block;
  margin-top: 3px;
  font-size: 1.5rem;
  line-height: 1.1;
}
.time-kpi small {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 0.82rem;
}
.time-days {
  display: none;
  gap: 14px;
}
.time-day {
  display: grid;
  gap: 10px;
}
.time-day__head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
}
.time-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}
.time-card.is-targeted {
  border-color: #d89a22;
  box-shadow: 0 0 0 3px rgba(216, 154, 34, 0.18), var(--shadow);
}
.time-card__head,
.time-card__meta,
.time-card__stats,
.time-card__locations {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
}
.time-card__badges {
  display: inline-flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
}
.time-card__title {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  min-width: 0;
}
.time-card__title strong {
  min-width: 0;
  overflow-wrap: anywhere;
}
.time-card__title .company-pill {
  margin-bottom: 0;
}
.time-card__meta,
.time-card__stats,
.time-card__locations {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
}
.time-card__locations {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.time-card__locations div {
  min-width: 0;
}
.time-card__locations dt {
  margin: 0 0 4px;
}
.time-card__locations dd {
  margin: 0;
}
.time-card--employee {
  gap: 12px;
}
.time-card--employee .time-card__head {
  align-items: flex-start;
}
.time-card__employee-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
  gap: 8px;
  margin: 0;
}
.time-card__employee-facts div {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfaf6;
}
.time-card__employee-facts dt,
.time-card__reason span {
  margin: 0;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}
.time-card__employee-facts dd {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.time-card__reason {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 750;
  line-height: 1.35;
}
.time-card__reason span {
  display: block;
  margin-bottom: 3px;
}
.time-card__reason--edit {
  color: var(--ink);
}
.time-card__actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.time-entry-reason-cell {
  display: grid;
  gap: 4px;
  justify-items: start;
}
.time-entry-reason-cell .pill {
  min-height: 22px;
  padding: 2px 7px;
  font-size: 0.72rem;
}
.time-entry-reason-cell small {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 750;
  line-height: 1.35;
}
.time-entry-admin-note {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.35;
}
.captured-location--admin-ended .captured-location__label {
  color: var(--muted);
}
.project-time-table__actions {
  width: 1%;
  white-space: nowrap;
}
.project-time-edit-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 6px 10px;
}
.time-entry-edit-head {
  max-width: 980px;
}
.time-entry-edit-head h1 {
  overflow-wrap: anywhere;
}
.time-entry-edit-head__actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.time-entry-edit-panel {
  display: grid;
  gap: 16px;
  max-width: 980px;
  padding: 16px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}
.time-entry-edit-summary {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
  min-width: 0;
}
.time-entry-edit-summary__identity,
.time-entry-edit-summary__badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  min-width: 0;
}
.time-entry-edit-summary__identity > strong {
  min-width: 0;
  font-size: 1.15rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.time-entry-edit-summary__identity .company-pill {
  margin-bottom: 0;
}
.time-entry-edit-summary__badges {
  justify-content: flex-end;
}
.time-entry-edit-facts,
.time-entry-edit-locations {
  margin: 0;
}
.time-entry-edit-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(136px, 1fr));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfaf6;
}
.time-entry-edit-facts div {
  min-width: 0;
  padding: 12px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.time-entry-edit-facts dt,
.time-entry-edit-locations dt {
  margin: 0;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}
.time-entry-edit-facts dd,
.time-entry-edit-locations dd {
  margin: 4px 0 0;
  min-width: 0;
  color: var(--ink);
  font-weight: 850;
  overflow-wrap: anywhere;
}
.time-entry-edit-locations {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding-top: 2px;
}
.time-entry-edit-locations > div {
  min-width: 0;
}
.time-entry-edit-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 12px;
  align-items: end;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.time-entry-edit-form > label {
  min-width: 0;
}
.time-entry-edit-form input[type="datetime-local"] {
  display: block;
  inline-size: 100%;
  min-inline-size: 0;
  max-inline-size: 100%;
  -webkit-appearance: none;
  appearance: none;
}
.time-entry-edit-form label:last-of-type,
.time-entry-edit-form__actions {
  grid-column: 1 / -1;
}
.time-entry-edit-form__actions {
  display: flex;
  justify-content: flex-start;
}
.time-table th:nth-child(3),
.time-table td:nth-child(3) {
  width: 1%;
  white-space: nowrap;
}
.time-table td:nth-child(3) {
  padding-right: 8px;
}
.report-table th:nth-child(2),
.report-table td:nth-child(2),
.report-table th:nth-child(4),
.report-table td:nth-child(4) {
  width: 1%;
  white-space: nowrap;
}
.report-table td:nth-child(2),
.report-table td:nth-child(4) {
  padding-right: 8px;
}

.admin-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 14px;
}
.admin-card { padding: 16px; align-content: start; }
.admin-create-panel { margin-bottom: 28px; }
.report-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 12px;
  align-items: end;
  margin-bottom: 16px;
}
.payroll-period {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
  padding: 12px;
  background: #f8f5ed;
}
.payroll-period legend {
  padding: 0 5px;
}
.payroll-period__controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(110px, 160px)) auto;
  gap: 10px;
  align-items: end;
}
.payroll-period__status {
  margin: 0;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 750;
}
.payroll-period__status[data-state="warning"] {
  color: #76530d;
}
.filter-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.users-table td, .users-table th { white-space: nowrap; }
.users-table td:nth-child(2) { white-space: normal; min-width: 220px; }
.status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
}
.status-badge.ok { background: #e2f2e6; color: var(--ok); }
.status-badge.muted-badge { background: #eceae4; color: var(--muted); }
.status-badge.time-edited-badge { background: #eef1ea; color: #4f5f4d; }
.status-badge.active,
.status-badge.status-active,
.status-badge.is-active { background: #e2f2e6; color: var(--ok); }
.status-badge.archived,
.status-badge.status-archived,
.status-badge.is-archived { background: #eceae4; color: var(--muted); }
.status-badge.pending,
.status-badge.status-pending,
.status-badge.draft,
.status-badge.status-draft { background: #fff8e8; color: #76530d; }
.status-badge.warning,
.status-badge.status-warning { background: #fff0ed; color: var(--warn); }
.company-heading,
.company-inline,
.company-pill,
.company-choice__body {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  min-width: 0;
}
.company-heading {
  margin-bottom: 4px;
  padding: 4px 8px 4px 5px;
  border-radius: 8px;
  background: var(--company-bg, #eef1ea);
  color: var(--company-fg, var(--ink));
}
.company-heading .eyebrow {
  margin: 0;
  color: inherit;
}
.company-heading__mark,
.company-inline__mark,
.company-pill__mark,
.company-choice__mark {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  object-fit: contain;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: white;
}
.company-inline {
  max-width: 100%;
  min-height: 34px;
  padding: 4px 9px 4px 5px;
  border: 1px solid color-mix(in srgb, var(--company-bg, #eef1ea) 70%, #172017);
  border-radius: 999px;
  background: var(--company-bg, #eef1ea);
  color: var(--company-fg, var(--ink));
  font-size: 0.78rem;
  font-weight: 900;
  overflow-wrap: break-word;
}
.company-pill {
  max-width: 100%;
  min-height: 34px;
  padding: 4px 9px 4px 5px;
  border: 1px solid color-mix(in srgb, var(--company-bg, #eef1ea) 70%, #172017);
  border-radius: 999px;
  background: var(--company-bg, #eef1ea);
  color: var(--company-fg, var(--ink));
  font-size: 0.78rem;
  font-weight: 900;
  overflow-wrap: break-word;
}
.company-pill__mark {
  display: block;
}
.company-pill--compact {
  gap: 0;
  width: fit-content;
  min-height: 32px;
  padding: 2px;
}
.company-pill--compact .company-pill__mark {
  width: 24px;
  height: 24px;
}
.company-pill[data-company="sunray-windows"] {
  border-color: #000;
  background: #000;
  color: #fff;
}
.company-pill[data-company="sunray-windows"] .company-pill__mark {
  border: 0;
  border-radius: 0;
  background: #000;
}
.company-pill[data-company="chalmers-contracting"] .company-pill__mark {
  border: 0;
  border-radius: 0;
  background: transparent;
}
.company-asset-fallback {
  display: inline-grid;
  place-items: center;
  padding: 0 4px;
  background: #eef1ea;
  color: var(--brand);
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1;
}
.company-picker {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 0;
  border: 0;
}
.company-picker legend {
  padding: 0;
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
}
.company-picker__options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}
.form-grid .company-picker {
  grid-column: span 2;
}
.company-choice {
  position: relative;
  min-width: 0;
  color: var(--ink);
}
.company-choice input {
  position: absolute;
  width: 1px;
  min-height: 1px;
  opacity: 0;
}
.company-choice__body {
  width: 100%;
  min-height: 44px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--company-bg, white);
  color: var(--company-fg, var(--ink));
  font-weight: 850;
  cursor: pointer;
}
.company-choice input:checked + .company-choice__body {
  border-color: var(--brand);
  box-shadow: inset 0 0 0 1px var(--brand);
}
.company-choice input:focus-visible + .company-choice__body {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.project-company-heading {
  align-items: center;
  width: fit-content;
}
.project-company-logo {
  width: auto;
  max-width: 190px;
  height: 42px;
  object-fit: contain;
  padding: 4px 8px;
  border-radius: 8px;
  background: white;
}
.project-company-heading[data-company="sunray-windows"] .project-company-logo {
  background: #000;
}
.project-detail-head {
  position: relative;
  display: grid;
  gap: 18px;
  align-items: center;
  justify-content: stretch;
  justify-items: stretch;
  margin-bottom: 18px;
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--company-bg, #eef1ea) 70%, #172017);
  border-radius: 8px;
  background: var(--company-bg, #eef1ea);
  color: var(--company-fg, var(--ink));
}
.project-detail-head__main {
  min-width: 0;
}
.project-detail-head__brand-row {
  min-width: 0;
}
.project-detail-head--open {
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 22px;
  min-height: 192px;
  padding: 28px 18px 20px 20px;
  overflow: visible;
}
.project-detail-head--open .project-detail-head__main {
  display: grid;
  gap: 4px;
  align-content: start;
  justify-self: stretch;
  width: 100%;
  padding-right: 0;
  padding-bottom: 0;
}
.project-detail-head--open .project-company-heading {
  max-width: 100%;
  margin-bottom: 8px;
  padding: 0;
  background: transparent;
}
.project-detail-head--open .project-company-logo {
  width: auto;
  max-width: 154px;
  height: 36px;
  padding: 0;
  background: transparent;
  object-position: left center;
}
.project-detail-head--open .company-heading__mark,
.project-detail-head--open .company-asset-fallback {
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 8px;
}
.project-detail-head__summary {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.project-detail-head--open .project-detail-head__summary {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: end;
  width: 100%;
}
.project-detail-head__copy {
  min-width: 0;
}
.project-detail-head--open h1 {
  margin: 0;
  font-size: clamp(2.15rem, 7vw, 3rem);
  line-height: 0.95;
}
.project-detail-head--open p {
  margin: 0;
  font-size: 1.03rem;
  line-height: 1.25;
}
.project-detail-head p,
.project-detail-head .muted {
  color: inherit;
}
.project-detail-head .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-color: color-mix(in srgb, var(--company-bg, #eef1ea) 35%, white);
  background: rgba(255, 255, 255, 0.92);
  color: var(--ink);
  text-align: center;
}
.project-detail-head__actions {
  --current-shift-action-size: 46px;
  display: flex;
  gap: 9px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.project-detail-head__footer {
  display: flex;
  gap: 12px;
  align-items: flex-end;
  justify-content: space-between;
  justify-self: stretch;
  min-width: 0;
  width: 100%;
  padding-top: 14px;
  border-top: 1px solid color-mix(in srgb, var(--company-fg, var(--ink)) 13%, transparent);
}
.project-detail-head__actions .quick-photo-form {
  margin: 0;
}
.project-detail-head__clock-in {
  flex: 1 1 min(420px, 100%);
  width: min(420px, 100%);
  margin: 0;
}
.project-detail-head__clock-in button,
.project-detail-head__clock-in .clock-in-button {
  width: 100%;
}
.project-detail-head__clock-out {
  flex: 0 0 auto;
  width: auto;
}
.project-detail-head__clock-out button {
  width: auto;
  min-height: var(--current-shift-action-size);
  padding: 0 16px;
}
.project-detail-head__clock-out-menu {
  position: static;
  flex: 0 0 auto;
  width: auto;
  margin: 0;
}
.project-detail-head__clock-out-menu summary {
  list-style: none;
}
.project-detail-head__clock-out-menu summary::-webkit-details-marker {
  display: none;
}
.project-detail-head__clock-out-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: var(--current-shift-action-size);
  padding: 0 16px;
}
.project-detail-head .project-detail-head__clock-out-trigger {
  border-color: var(--brand);
  background: var(--brand);
  color: white;
}
.project-detail-head__clock-out-menu[open] .project-detail-head__clock-out-trigger {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(36, 51, 38, 0.14);
}
.project-detail-head__clock-out-options {
  right: 0;
  color: var(--ink);
}
.project-detail-head__clock-out-options .button {
  border-color: var(--line);
  background: var(--panel);
  color: var(--ink);
}
.project-detail-head__clock-out-options .button.primary {
  border-color: var(--brand);
  background: var(--brand);
  color: white;
}
.project-detail-head__clock-in .clock-in-button {
  min-height: 54px;
  border-color: rgba(255, 255, 255, 0.78);
  background-color: rgba(255, 255, 255, 0.96);
  background-image: none;
  color: var(--brand);
  box-shadow: none;
}
.project-detail-head__clock-in .clock-in-button__icon {
  background: #edf6ef;
  color: var(--brand);
}
.project-detail-head__clock-in .clock-in-button__hint {
  color: var(--muted);
}
.project-detail-head__clock-in .clock-in-button.is-clocking-in,
.project-detail-head__clock-in .clock-in-button.is-hammering {
  background: #fff8e8;
}
.project-detail-head__icon-action,
.project-detail-head__photo-form .button {
  width: var(--current-shift-action-size);
  min-width: var(--current-shift-action-size);
  max-width: var(--current-shift-action-size);
  height: var(--current-shift-action-size);
  min-height: var(--current-shift-action-size);
  max-height: var(--current-shift-action-size);
  padding: 0;
  border-radius: 8px;
  aspect-ratio: 1;
}
.project-detail-head__icon-action .current-shift__action-icon,
.project-detail-head__photo-form .current-shift__action-icon {
  width: 18px;
  height: 18px;
}
.project-detail-head__action-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.project-detail-head__photo-form {
  width: var(--current-shift-action-size);
  min-width: var(--current-shift-action-size);
}
.project-detail-head__photo-form .quick-photo-form__label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.project-detail-head__elapsed {
  display: grid;
  gap: 4px;
  justify-items: end;
  margin-left: auto;
  color: inherit;
  text-align: right;
}
.project-detail-head__elapsed-label {
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1;
  opacity: 0.76;
  text-transform: uppercase;
}
.project-detail-head__elapsed strong {
  font-size: 1.28rem;
  line-height: 1;
}
.project-detail-head__status {
  display: none;
}
.project-detail-head__actions:empty {
  display: none;
}
input[type="color"] {
  min-width: 72px;
  padding: 5px;
}
.user-edit-form {
  grid-template-columns: 1.2fr 1.4fr 1.2fr 0.8fr 0.7fr auto;
}
.admin-project-head {
  align-items: center;
  margin-bottom: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.admin-project-head h1 {
  font-size: clamp(2.35rem, 4.5vw, 3.15rem);
  line-height: 1;
}
.admin-project-head .eyebrow {
  margin-bottom: 4px;
}
.admin-project-head .project-action-group {
  justify-content: flex-end;
}
.admin-project-tabs {
  margin-bottom: 16px;
}
.admin-project-panel {
  display: grid;
  gap: 12px;
}
.admin-project-section-head {
  align-items: center;
  margin-bottom: 0;
}
.admin-project-section-head .eyebrow {
  margin-bottom: 4px;
}
.flash {
  margin: 0 0 14px;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  font-weight: 800;
}
.flash.success,
.flash.ok,
.flash.is-success {
  border-color: #cce1d1;
  background: #edf6ef;
  color: var(--ok);
}
.flash.error,
.flash.warning,
.flash.is-error {
  border-color: #efb1a6;
  background: #fff0ed;
  color: var(--warn);
}
.admin-flash-card {
  display: grid;
  gap: 12px;
  margin-bottom: 18px;
}
.admin-flash-card .flash {
  margin: 0;
}
.invite-link-copy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}
.admin-filter-form {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(150px, 0.36fr) minmax(190px, 0.45fr) auto;
  gap: 10px;
  align-items: end;
  margin: 0;
  padding: 10px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
}
.admin-filter-form label {
  gap: 4px;
  font-size: 0.78rem;
}
.admin-filter-form input,
.admin-filter-form select {
  min-height: 38px;
  padding-block: 8px;
}
.admin-filter-form input[type="search"] {
  background: white;
}
.admin-filter-form .filter-actions,
.project-admin-actions,
.project-action-group {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.project-admin-actions form,
.project-action-group form {
  margin: 0;
}
.admin-filter-form .filter-actions {
  justify-content: flex-end;
}
.admin-filter-form .button,
.admin-filter-form button,
.project-admin-actions .button,
.project-admin-actions button,
.project-action-group .button,
.project-action-group button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  text-align: center;
  white-space: nowrap;
}
.admin-filter-form .button,
.admin-filter-form button {
  min-height: 38px;
  padding-block: 8px;
}
.expense-report-panel {
  margin-bottom: 14px;
}
.expense-mobile-reports {
  display: none;
}
.expense-mobile-reports__head {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
}
.expense-mobile-reports__head h2,
.expense-mobile-breakdown h3 {
  margin: 0;
}
.expense-mobile-periods,
.expense-mobile-breakdowns {
  display: grid;
  gap: 8px;
}
.expense-mobile-periods {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.expense-mobile-period,
.expense-mobile-report-row {
  min-width: 0;
  color: inherit;
  text-decoration: none;
}
.expense-mobile-period {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid #e5ddcc;
  border-radius: 8px;
  background: #fffdf8;
}
.expense-mobile-period span,
.expense-mobile-report-row small {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 850;
  line-height: 1.15;
  text-transform: uppercase;
}
.expense-mobile-period strong {
  overflow: hidden;
  font-size: 0.92rem;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.expense-mobile-period small {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.68rem;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.expense-mobile-breakdown {
  display: grid;
  gap: 6px;
}
.expense-mobile-breakdown h3 {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  text-transform: uppercase;
}
.expense-mobile-breakdown__rows {
  display: grid;
  gap: 4px;
}
.expense-mobile-report-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 8px;
  align-items: baseline;
  min-height: 34px;
  padding: 6px 8px;
  border: 1px solid #eee7d7;
  border-radius: 7px;
  background: #fffdf8;
}
.expense-mobile-report-row span {
  overflow: hidden;
  font-size: 0.84rem;
  font-weight: 850;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.expense-mobile-report-row strong {
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
  white-space: nowrap;
}
.expense-mobile-report-row small {
  grid-column: 1 / -1;
}
.expense-report-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 12px;
}
.expense-report-grid--breakdown {
  grid-template-columns: repeat(3, minmax(240px, 1fr));
  margin-top: 14px;
}
.expense-report-list {
  min-width: 0;
}
.expense-report-list h3 {
  margin: 0 0 8px;
  font-size: 1rem;
}
.expense-report-list table {
  min-width: 0;
  font-size: 0.9rem;
}
.expense-summary-link {
  display: grid;
  gap: 4px;
  color: inherit;
  text-decoration: none;
}
.expense-summary-link:hover strong,
.expense-report-link:hover {
  color: var(--accent);
}
.expense-report-link {
  color: inherit;
  font-weight: 750;
  text-decoration: none;
}
.expense-review-queues {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 8px;
}
.expense-review-queue {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 44px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8f6ef;
  color: inherit;
  text-decoration: none;
}
.expense-review-queue:hover,
.expense-review-queue[data-active="true"] {
  border-color: var(--accent);
  background: #fffaf0;
}
.expense-review-queue span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}
.expense-review-queue strong {
  color: var(--ink);
  font-size: 1.05rem;
  line-height: 1;
}
.expense-filter-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  align-items: end;
  margin: 0;
}
.expense-filter-form__wide {
  grid-column: span 2;
}
.expense-filter-form label {
  gap: 4px;
  font-size: 0.78rem;
}
.expense-filter-form input,
.expense-filter-form select {
  min-height: 38px;
  padding-block: 8px;
}
.expense-filter-form .filter-actions {
  justify-content: flex-end;
}
.expense-bulk-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin: 0;
}
.expense-bulk-actions .button,
.expense-bulk-actions button {
  min-height: 34px;
  padding: 6px 10px;
}
.expense-review-toolbar {
  display: grid;
  grid-template-columns: 160px minmax(260px, 1.1fr) minmax(420px, 1.5fr) minmax(220px, 0.8fr);
  gap: 12px;
  align-items: center;
  padding: 9px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8f6ef;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}
.expense-select-all {
  display: inline-flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  margin: 0;
  color: var(--ink);
  font-size: 0.78rem;
  text-transform: none;
}
.expense-review-list {
  display: grid;
  gap: 10px;
}
.expense-review-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  padding: 16px 16px 18px;
  border: 1px solid #d8d5ca;
  border-radius: 8px;
  background: linear-gradient(180deg, #fffdf8 0%, #fbfaf5 100%);
  box-shadow: 0 10px 26px rgba(40, 51, 34, 0.06);
  transition: border-color 180ms ease, box-shadow 180ms ease, opacity 160ms ease, transform 160ms ease;
}
.expense-review-card:hover {
  border-color: #c7c2b3;
  box-shadow: 0 14px 34px rgba(40, 51, 34, 0.09);
}
.expense-review-card[data-expense-removing="1"] {
  opacity: 0;
  transform: translateY(-4px);
}
.expense-review-card__select {
  display: flex;
  justify-content: center;
  padding-top: 4px;
}
.expense-review-card__content {
  min-width: 0;
  display: grid;
  gap: 14px;
}
.expense-row-save-form {
  display: none;
}
.expense-review-card__head {
  display: grid;
  grid-template-columns: minmax(110px, 0.45fr) minmax(210px, 0.9fr) minmax(280px, 1.4fr);
  gap: 12px;
  align-items: start;
  padding-bottom: 12px;
  border-bottom: 1px solid #ece7dc;
}
.expense-review-card__status,
.expense-review-card__identity,
.expense-review-card__subject {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.expense-review-card__identity strong,
.expense-review-card__subject strong {
  overflow-wrap: anywhere;
}
.expense-review-card__identity small,
.expense-review-card__subject small {
  color: var(--muted);
}
.expense-review-reasons {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}
.expense-review-reason {
  display: inline-flex;
  align-items: center;
  min-height: 21px;
  padding: 3px 7px;
  border: 1px solid #f0dcaa;
  border-radius: 999px;
  background: #fff8e8;
  color: #76530d;
  font-size: 0.7rem;
  font-weight: 850;
  line-height: 1.1;
}
.expense-duplicate-panel {
  display: grid;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid #ead8ad;
  border-radius: 8px;
  background: #fffaf0;
}
.expense-duplicate-panel[data-state="duplicate"] {
  border-color: #e2c6be;
  background: #fff6f3;
}
.expense-duplicate-panel__summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: baseline;
}
.expense-duplicate-panel__summary strong {
  font-size: 0.88rem;
}
.expense-duplicate-panel__summary span {
  color: var(--muted);
  font-size: 0.82rem;
}
.expense-duplicate-panel__summary a,
.expense-duplicate-match {
  color: var(--accent);
  font-weight: 800;
  text-decoration: none;
}
.expense-duplicate-panel__matches {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 6px;
}
.expense-duplicate-match {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel);
}
.expense-duplicate-match:hover {
  border-color: var(--accent);
}
.expense-duplicate-match span,
.expense-duplicate-match small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.expense-duplicate-match span {
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}
.expense-duplicate-match small {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 650;
}
.expense-review-summary,
.expense-mobile-edit-button {
  display: none;
}
.expense-review-summary {
  min-width: 0;
}
.expense-review-summary__primary {
  display: flex;
  gap: 8px;
  align-items: baseline;
  justify-content: space-between;
  min-width: 0;
}
.expense-review-summary__primary strong,
.expense-review-summary__primary span,
.expense-review-summary__details dd {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.expense-review-summary__primary strong {
  color: var(--ink);
  font-size: 0.98rem;
  font-variant-numeric: tabular-nums;
}
.expense-review-summary__primary span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
}
.expense-review-summary__details {
  display: grid;
  gap: 0;
  margin: 0;
}
.expense-review-summary__details div {
  display: grid;
  grid-template-columns: 66px minmax(0, 1fr);
  gap: 8px;
  align-items: baseline;
  min-width: 0;
}
.expense-review-summary__details dt,
.expense-review-summary__details dd {
  margin: 0;
  font-size: 0.76rem;
  line-height: 1.25;
}
.expense-review-summary__details dt {
  color: var(--muted);
  font-weight: 850;
}
.expense-review-summary__details dd {
  color: var(--ink);
  font-weight: 750;
}
.expense-edit-dialog {
  width: min(560px, calc(100% - 24px));
  max-height: min(82dvh, 720px);
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 18px;
  background: var(--panel);
  color: var(--ink);
  box-shadow: 0 26px 70px rgba(23, 32, 23, 0.28);
}
.expense-edit-dialog::backdrop {
  background: rgba(23, 32, 23, 0.42);
  backdrop-filter: blur(4px);
}
.expense-edit-dialog__panel {
  display: grid;
  grid-template-rows: auto auto auto;
  max-height: inherit;
}
.expense-edit-dialog__head,
.expense-edit-dialog__foot {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
}
.expense-edit-dialog__head {
  border-bottom: 1px solid #ece7dc;
}
.expense-edit-dialog__head h3 {
  margin: 2px 0 0;
  font-size: 1.08rem;
  line-height: 1.15;
}
.expense-edit-dialog__head small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-weight: 750;
}
.expense-edit-dialog__fields {
  min-width: 0;
  max-height: min(58dvh, 520px);
  overflow: auto;
  padding: 10px 16px;
}
.expense-edit-dialog__foot {
  border-top: 1px solid #ece7dc;
  background: #fbfaf6;
}
.expense-review-card__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, 240px);
  gap: 18px;
  align-items: start;
}
.expense-review-fields {
  display: grid;
  grid-template-columns: minmax(130px, 0.75fr) minmax(160px, 1fr) minmax(150px, 0.95fr) minmax(150px, 0.9fr) minmax(150px, 0.75fr);
  gap: 10px;
  align-items: start;
}
.expense-review-fields label {
  min-width: 0;
  gap: 4px;
  color: var(--muted);
  font-size: 0.78rem;
}
.expense-review-fields input,
.expense-review-fields select {
  width: 100%;
  min-height: 36px;
  padding: 7px 8px;
  font-size: 0.9rem;
}
.expense-row-check {
  width: 18px;
  height: 18px;
  min-height: 18px;
  padding: 0;
}
.expense-review-side {
  min-width: 0;
  display: grid;
  gap: 12px;
  align-content: start;
  padding-left: 16px;
  border-left: 1px solid #ece7dc;
}
.expense-review-files {
  min-width: 0;
  display: grid;
  gap: 8px;
}
.expense-review-files > strong {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 850;
}
.expense-money-fields {
  display: grid;
  grid-template-columns: minmax(78px, 1fr) 54px;
  gap: 6px;
}
.expense-subject-cell {
  max-width: 340px;
}
.expense-subject-title,
.expense-ai-note {
  display: block;
  overflow-wrap: anywhere;
}
.expense-ai-note {
  margin-top: 4px;
  color: var(--muted);
}
.expense-review-evidence {
  display: grid;
  gap: 6px;
  max-width: 900px;
}
.expense-evidence {
  margin-top: 6px;
}
.expense-evidence summary {
  width: fit-content;
  cursor: pointer;
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 850;
}
.expense-evidence pre {
  max-width: min(520px, 70vw);
  max-height: 220px;
  margin: 6px 0 0;
  padding: 8px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfaf6;
  color: var(--ink);
  font: 0.78rem/1.42 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  white-space: pre-wrap;
}
.expense-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}
.expense-row-actions form {
  margin: 0;
}
.expense-row-actions .button,
.expense-row-actions button {
  min-height: 34px;
  padding: 6px 9px;
  white-space: nowrap;
}
.expense-suggested-action-note {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 6px;
  padding: 5px 8px;
  border: 1px solid #e6c88d;
  border-radius: 8px;
  background: #fff7e5;
  color: #6f4706;
  font-size: 0.76rem;
  font-weight: 850;
}
.expense-suggested-action-note[hidden] {
  display: none;
}
.expense-row-actions .expense-suggested-action {
  border-color: #a74f22;
  background: #a74f22;
  color: #fffaf2;
  box-shadow: 0 8px 20px rgba(167, 79, 34, 0.18);
}
.expense-row-actions .expense-suggested-action:hover,
.expense-row-actions .expense-suggested-action:focus-visible {
  border-color: #873d19;
  background: #873d19;
  color: #fffaf2;
}
.expense-file-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.expense-file-link {
  text-decoration: none;
}
.expense-file-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 7px 11px 7px 8px;
  border: 1px solid #d7cfbd;
  border-radius: 8px;
  background: #fffaf0;
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 850;
  box-shadow: 0 4px 12px rgba(93, 73, 38, 0.08);
  transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}
.expense-file-button:hover,
.expense-file-button:focus-visible {
  border-color: #bf9d61;
  background: #fff4dc;
  box-shadow: 0 8px 18px rgba(93, 73, 38, 0.12);
  transform: translateY(-1px);
}
.expense-file-button:active {
  transform: translateY(0);
}
.expense-file-button__icon {
  display: inline-grid;
  place-items: center;
  min-width: 34px;
  height: 24px;
  padding: 0 6px;
  border-radius: 6px;
  background: #c35528;
  color: white;
  font-size: 0.68rem;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}
.expense-file-button__label {
  white-space: nowrap;
}
.expense-file-button--pdf {
  color: #733716;
}
.expense-row-feedback {
  min-height: 18px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 750;
}
.expense-row-feedback[data-state="success"] {
  color: #386641;
}
.expense-row-feedback[data-state="error"] {
  color: #a33a2f;
}
.expense-pdf-preview {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfaf6;
}
.expense-pdf-preview[hidden] {
  display: none;
}
.expense-pdf-preview__head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}
.expense-pdf-preview__head strong {
  min-width: 0;
  overflow-wrap: anywhere;
}
.expense-pdf-preview__head > div {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.expense-pdf-preview__head .button,
.expense-pdf-preview__head button {
  min-height: 32px;
  padding: 5px 9px;
}
.expense-pdf-preview iframe {
  width: 100%;
  height: min(72vh, 720px);
  min-height: 420px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: white;
}
@media (max-width: 900px) {
  .expense-report-grid,
  .expense-filter-form,
  .expense-review-toolbar,
  .expense-review-card,
  .expense-review-card__head,
  .expense-review-card__body,
  .expense-review-fields {
    grid-template-columns: 1fr;
  }
  .expense-review-toolbar {
    display: none;
  }
  .expense-review-card {
    gap: 8px;
  }
  .expense-review-card__select {
    justify-content: flex-start;
  }
  .expense-review-side {
    padding-left: 0;
    border-left: 0;
    padding-top: 12px;
    border-top: 1px solid #ece7dc;
  }
  .expense-filter-form__wide {
    grid-column: auto;
  }
  .expense-filter-form .filter-actions {
    justify-content: stretch;
  }
  .expense-filter-form .filter-actions .button,
  .expense-filter-form .filter-actions button {
    flex: 1 1 0;
  }
  .expense-pdf-preview iframe {
    height: 68vh;
    min-height: 320px;
  }
}

@media (max-width: 640px) {
  body[data-view="admin_expenses"] .admin-main-stack > .admin-card.stack {
    margin-right: -8px;
    margin-left: -8px;
    padding: 14px 10px;
  }
  body[data-view="admin_expenses"] .admin-main-stack > .admin-card.stack .admin-side-card__head {
    margin-bottom: 6px;
  }
  body[data-view="admin_expenses"] .admin-kpi-grid,
  body[data-view="admin_expenses"] .expense-report-panel {
    display: none;
  }
  body[data-view="admin_expenses"] .admin-page-head {
    gap: 8px;
    margin-bottom: 10px;
  }
  body[data-view="admin_expenses"] .admin-page-head .muted {
    display: none;
  }
  body[data-view="admin_expenses"] .admin-page-actions {
    gap: 0;
  }
  body[data-view="admin_expenses"] .admin-page-actions > :not(form:last-child) {
    display: none;
  }
  body[data-view="admin_expenses"] .admin-page-actions > form:last-child button {
    width: 100%;
    min-height: 34px;
    padding: 6px 10px;
  }
  body[data-view="admin_expenses"] .expense-mobile-reports {
    display: grid;
    gap: 10px;
    margin: 0 -8px 10px;
    padding: 12px 10px;
    border-top: 1px solid #e8deca;
    border-bottom: 1px solid #e8deca;
    background: #fbfaf6;
  }
  body[data-view="admin_expenses"] .expense-mobile-reports__head {
    min-height: 34px;
  }
  body[data-view="admin_expenses"] .expense-mobile-reports__head h2 {
    font-size: 1rem;
    line-height: 1.15;
  }
  body[data-view="admin_expenses"] .expense-mobile-reports__head .button {
    min-height: 30px;
    padding: 5px 9px;
    font-size: 0.78rem;
  }
  body[data-view="admin_expenses"] .expense-mobile-breakdowns {
    gap: 9px;
  }
  body[data-view="admin_expenses"] .expense-filter-card {
    margin: 0 -8px 10px;
    padding: 10px;
    border-radius: 0;
    border-right: 0;
    border-left: 0;
    box-shadow: none;
  }
  body[data-view="admin_expenses"] .expense-filter-card .admin-side-card__head {
    display: block;
    margin-bottom: 6px;
  }
  body[data-view="admin_expenses"] .expense-filter-card .admin-side-card__head .eyebrow,
  body[data-view="admin_expenses"] .expense-filter-card .count-pill {
    display: none;
  }
  body[data-view="admin_expenses"] .expense-filter-card h2 {
    font-size: 1rem;
    line-height: 1.15;
  }
  body[data-view="admin_expenses"] .expense-review-queues,
  body[data-view="admin_expenses"] .expense-filter-field--advanced {
    display: none;
  }
  body[data-view="admin_expenses"] .expense-filter-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }
  body[data-view="admin_expenses"] .expense-filter-field {
    min-width: 0;
    gap: 3px;
    font-size: 0.7rem;
    line-height: 1.15;
  }
  body[data-view="admin_expenses"] .expense-filter-field--search,
  body[data-view="admin_expenses"] .expense-filter-form .filter-actions {
    grid-column: 1 / -1;
  }
  body[data-view="admin_expenses"] .expense-filter-form input,
  body[data-view="admin_expenses"] .expense-filter-form select {
    min-height: 32px;
    padding: 5px 8px;
    border-radius: 7px;
    font-size: 0.84rem;
  }
  body[data-view="admin_expenses"] .expense-filter-form .filter-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }
  body[data-view="admin_expenses"] .expense-filter-form .filter-actions .button,
  body[data-view="admin_expenses"] .expense-filter-form .filter-actions button {
    min-height: 32px;
    padding: 5px 8px;
    font-size: 0.86rem;
  }
  .expense-review-list {
    gap: 6px;
  }
  .expense-review-card {
    position: relative;
    grid-template-columns: 26px minmax(0, 1fr);
    gap: 6px;
    padding: 7px;
    border-radius: 7px;
    background: #fffdf8;
    box-shadow: none;
  }
  .expense-review-card:hover {
    box-shadow: none;
  }
  .expense-review-card__select {
    justify-content: center;
    padding-top: 4px;
  }
  .expense-review-card__content {
    gap: 5px;
  }
  .expense-review-card__head {
    gap: 4px;
    padding-right: 92px;
    padding-bottom: 5px;
  }
  .expense-review-card .status-badge {
    min-height: 22px;
    padding: 3px 8px;
    font-size: 0.7rem;
    line-height: 1.05;
  }
  .expense-review-card__status {
    display: flex;
    flex-wrap: wrap;
    gap: 3px 6px;
    align-items: center;
  }
  .expense-review-card__status small {
    font-size: 0.74rem;
    line-height: 1.15;
  }
  .expense-review-card__identity,
  .expense-review-card__subject {
    gap: 2px;
  }
  .expense-review-card__identity strong,
  .expense-review-card__subject strong {
    font-size: 0.9rem;
    line-height: 1.2;
  }
  .expense-review-card__identity small,
  .expense-review-card__subject small {
    font-size: 0.74rem;
    line-height: 1.2;
  }
  .expense-review-card__identity small {
    display: none;
  }
  .expense-review-card__subject small {
    display: none;
  }
  .expense-review-card__subject strong {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .expense-review-reasons {
    display: none;
  }
  .expense-duplicate-panel {
    padding: 8px;
  }
  .expense-duplicate-panel__matches {
    grid-template-columns: minmax(0, 1fr);
  }
  .expense-review-card__body {
    gap: 5px;
  }
  .expense-review-summary {
    display: grid;
    gap: 4px;
    padding: 5px 0;
    border-top: 1px solid #ece7dc;
    border-bottom: 1px solid #ece7dc;
  }
  .expense-review-summary__primary {
    display: block;
  }
  .expense-review-summary__primary span {
    position: absolute;
    top: 8px;
    right: 9px;
    max-width: 88px;
    overflow: hidden;
    padding: 2px 0;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .expense-review-summary__primary span:empty {
    display: none;
  }
  .expense-review-summary__details {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px 10px;
  }
  .expense-review-summary__details div {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 5px;
  }
  .expense-review-summary__details div:nth-child(3) {
    grid-column: 1 / -1;
  }
  .expense-review-summary__primary strong {
    font-size: 0.93rem;
  }
  .expense-review-summary__primary span,
  .expense-review-summary__details dt,
  .expense-review-summary__details dd {
    font-size: 0.72rem;
    line-height: 1.18;
  }
  .expense-review-card .expense-review-fields {
    display: none;
  }
  .expense-edit-dialog .expense-review-fields {
    display: grid;
    gap: 0;
    border-top: 0;
  }
  .expense-review-fields label {
    display: grid;
    grid-template-columns: minmax(78px, 0.34fr) minmax(0, 1fr);
    gap: 2px 8px;
    align-items: center;
    min-height: 36px;
    padding: 4px 0;
    border-bottom: 1px solid #ece7dc;
    font-size: 0.68rem;
    line-height: 1.15;
  }
  .expense-review-fields label > input,
  .expense-review-fields label > select,
  .expense-review-fields label > .expense-money-fields {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
  }
  .expense-review-fields label > small {
    grid-column: 2;
    grid-row: 2;
    min-width: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 0.64rem;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .expense-review-fields input,
  .expense-review-fields select {
    min-height: 30px;
    padding: 4px 7px;
    border-radius: 7px;
    font-size: 0.82rem;
  }
  .expense-money-fields {
    grid-template-columns: minmax(0, 1fr) 50px;
    gap: 4px;
  }
  .expense-mobile-edit-button {
    display: inline-flex;
  }
  .expense-row-actions > button[data-expense-action="save"] {
    display: none;
  }
  .expense-review-side {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding-top: 0;
    border-top: 0;
  }
  .expense-review-files {
    flex: 1 1 150px;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    align-items: center;
  }
  .expense-review-files > strong {
    display: none;
  }
  .expense-row-actions {
    flex: 1 1 150px;
  }
  .expense-file-list {
    gap: 6px;
  }
  .expense-file-button {
    min-height: 32px;
    padding: 5px 8px 5px 6px;
    font-size: 0.78rem;
  }
  .expense-file-button__icon {
    min-width: 31px;
    height: 22px;
    font-size: 0.64rem;
  }
  .expense-row-actions {
    gap: 5px;
  }
  .expense-row-actions .button,
  .expense-row-actions button {
    min-height: 32px;
    padding: 5px 8px;
    border-radius: 7px;
    font-size: 0.86rem;
  }
  .expense-suggested-action-note,
  .expense-row-feedback {
    font-size: 0.76rem;
  }
  .expense-review-evidence {
    display: none;
  }
  .expense-edit-dialog {
    inset: auto 0 0 0;
    width: 100%;
    height: auto;
    max-height: none;
    margin: auto 0 0;
    border-radius: 20px 20px 0 0;
  }
  .expense-edit-dialog__panel {
    max-height: none;
  }
  .expense-edit-dialog__head,
  .expense-edit-dialog__foot {
    padding: 12px 14px;
  }
  .expense-edit-dialog__fields {
    padding: 6px 14px 10px;
  }
}
.project-admin-list {
  display: grid;
  gap: 10px;
}
.project-admin-list.is-surface,
.project-admin-list.project-admin-surface {
  gap: 0;
  overflow: hidden;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 8px 20px rgba(23, 32, 23, 0.05);
}
.project-admin-list.is-surface .project-admin-item,
.project-admin-list.project-admin-surface .project-admin-item {
  border-width: 0 0 1px;
  border-radius: 0;
  box-shadow: none;
}
.project-admin-list.is-surface .project-admin-item:last-child,
.project-admin-list.project-admin-surface .project-admin-item:last-child {
  border-bottom: 0;
}
.project-admin-item {
  min-width: 0;
  overflow: hidden;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}
.project-admin-summary {
  display: grid;
  grid-template-columns: minmax(260px, 1.3fr) minmax(220px, 1fr) 90px minmax(210px, auto);
  gap: 10px 16px;
  align-items: center;
  min-width: 0;
  padding: 12px 14px;
}
.project-admin-summary > * {
  min-width: 0;
}
.project-admin-summary h2,
.project-admin-summary h3,
.project-admin-title {
  margin: 0;
  font-size: 1rem;
  line-height: 1.22;
  overflow-wrap: break-word;
}
.project-admin-summary p,
.project-admin-summary address,
.project-admin-meta,
.project-admin-description {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 0.86rem;
  font-style: normal;
  font-weight: 650;
  overflow-wrap: break-word;
}
.project-admin-description {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.project-admin-meta {
  display: flex;
  gap: 6px 10px;
  flex-wrap: wrap;
  align-items: center;
}
.project-admin-summary dl,
.project-admin-details {
  display: flex;
  gap: 8px 14px;
  flex-wrap: wrap;
  margin: 0;
}
.project-admin-summary dt,
.project-admin-details dt {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}
.project-admin-summary dd,
.project-admin-details dd {
  margin: 2px 0 0;
  font-weight: 900;
  overflow-wrap: break-word;
}
.project-admin-actions {
  justify-content: flex-end;
  flex-wrap: nowrap;
}
.project-edit-panel {
  padding: 14px;
  background: #f8f5ed;
  border-top: 1px solid var(--line);
}
.project-edit-panel .inline-edit,
.project-edit-panel form {
  display: grid;
  grid-template-columns: 1fr minmax(250px, 1.3fr) 1fr minmax(180px, 1fr) minmax(120px, 0.55fr) auto;
  gap: 10px;
  align-items: end;
}
.project-edit-panel textarea {
  min-height: 42px;
}
.project-edit-panel button[type="submit"],
.project-edit-panel .primary {
  align-self: end;
}
.project-admin-table {
  min-width: 880px;
}
.project-admin-table td,
.project-admin-table th {
  vertical-align: middle;
}
.project-admin-table td:first-child {
  min-width: 240px;
  white-space: normal;
}
.project-admin-table .project-admin-actions {
  justify-content: flex-start;
}
.company-create-form {
  margin-bottom: 16px;
}
.company-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
  gap: 12px;
  align-items: end;
}
.company-form-grid--compact {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 130px), 1fr));
}
.company-edit-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
  gap: 12px;
  align-items: end;
}
.company-form-grid > *,
.company-edit-form > * {
  min-width: 0;
}
.company-card-flash {
  grid-column: 1 / -1;
  margin: 0;
}
.company-form-grid label,
.company-edit-form label {
  min-width: 0;
}
.integration-secret-status {
  display: grid;
  gap: 6px;
}
.integration-secret-status .status-badge {
  justify-self: start;
}
.integration-secret-status .muted {
  margin: 0;
}
.company-admin-list {
  display: grid;
  gap: 10px;
}
.company-admin-item {
  display: grid;
  grid-template-columns: minmax(0, 260px) minmax(0, 1fr);
  gap: 14px;
  padding: 14px;
  background:
    linear-gradient(90deg, var(--company-bg, #eef1ea) 0 10px, var(--panel) 10px),
    var(--panel);
  border: 1px solid color-mix(in srgb, var(--company-bg, #eef1ea) 55%, var(--line));
  border-radius: 8px;
  box-shadow: var(--shadow);
}
.company-admin-item,
.company-admin-preview,
.company-logo-box,
.company-mark-box {
  min-width: 0;
}
.company-admin-preview {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 76px;
  gap: 10px;
  align-items: stretch;
}
.company-logo-box,
.company-mark-box {
  display: grid;
  place-items: center;
  min-height: 76px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--company-bg, #fbfaf6);
  color: var(--company-fg, var(--ink));
}
.company-logo-preview {
  width: 100%;
  max-height: 58px;
  object-fit: contain;
}
.company-mark-preview {
  width: 48px;
  height: 48px;
  object-fit: contain;
  border-radius: 8px;
}
.company-logo-preview.company-asset-fallback {
  min-height: 44px;
  color: var(--muted);
  text-align: center;
  overflow-wrap: anywhere;
}
.company-edit-flags,
.company-edit-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.company-edit-actions {
  justify-content: flex-end;
  grid-column: 1 / -1;
}
.test-email-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}
.test-email-form button {
  min-height: 42px;
}
.notification-template-preview {
  display: grid;
  gap: 7px;
  padding: 14px;
  border: 1px solid #e3dbcf;
  border-left: 5px solid #b85c38;
  border-radius: 8px;
  background: #fffdfa;
}
.notification-template-preview span {
  color: #b85c38;
  font-size: 0.76rem;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}
.notification-template-preview strong {
  font-size: 1.02rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.notification-template-preview p {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.4;
}
.company-edit-form input[type="file"],
.company-form-grid input[type="file"] {
  font-size: 0.84rem;
}

@media (max-width: 1100px) {
  .company-admin-item,
  .company-admin-preview,
  .company-edit-form,
  .company-form-grid {
    grid-template-columns: 1fr;
  }
}
.empty-state {
  display: grid;
  justify-items: start;
  gap: 10px;
  padding: 28px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
}

dialog {
  width: min(1100px, calc(100% - 20px));
  max-height: calc(100dvh - 20px);
  border: 0;
  border-radius: 8px;
  padding: 0;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.28);
  overflow: hidden;
}
dialog::backdrop { background: rgba(23, 32, 23, 0.6); }
.photo-capture-dialog {
  height: min(760px, calc(100dvh - 48px));
  background: var(--panel);
}
.photo-capture-dialog[open] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto auto;
}
.photo-capture-dialog__topbar,
.photo-capture-dialog__actions {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 10px max(10px, env(safe-area-inset-right)) 10px max(10px, env(safe-area-inset-left));
  background: var(--panel);
}
.photo-capture-dialog__topbar {
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
}
.photo-capture-dialog__actions {
  justify-content: flex-end;
  border-top: 1px solid var(--line);
  padding-bottom: max(10px, env(safe-area-inset-bottom));
}
.photo-capture-dialog__count {
  margin-right: auto;
  color: var(--muted);
  font-weight: 800;
}
.photo-capture-dialog__stage {
  display: grid;
  place-items: center;
  min-height: 0;
  overflow: hidden;
  background: #10140f;
}
.photo-capture-dialog__stage video {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.photo-capture-dialog__thumbs {
  display: flex;
  gap: 8px;
  min-height: 74px;
  padding: 8px max(10px, env(safe-area-inset-right)) 8px max(10px, env(safe-area-inset-left));
  overflow-x: auto;
  border-top: 1px solid var(--line);
  background: #f4f1e8;
}
.photo-capture-dialog__thumb {
  flex: 0 0 auto;
  width: 58px;
  height: 58px;
  border: 1px solid var(--line);
  border-radius: 8px;
  object-fit: cover;
}
#markup-dialog {
  height: min(860px, calc(100dvh - 48px));
  background: var(--panel);
}
#markup-dialog[open] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}
.markup-topbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-height: 66px;
  padding: max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) 10px max(10px, env(safe-area-inset-left));
  background: var(--panel);
  border-bottom: 1px solid var(--line);
}
.markup-close-form {
  margin: 0;
}
.markup-title {
  min-width: 0;
  overflow: hidden;
  font-size: 1rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.markup-top-actions,
.markup-control-row {
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
}
.markup-icon-button,
.markup-save,
.markup-tools button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  white-space: nowrap;
}
.markup-icon-button:disabled,
.markup-tools button:disabled {
  cursor: not-allowed;
  opacity: 0.46;
}
.markup-icon-button {
  width: 48px;
  padding: 0;
  font-size: 1.15rem;
  line-height: 1;
}
.markup-save {
  min-width: 64px;
  padding-inline: 14px;
}
.markup-stage {
  display: grid;
  place-items: center;
  min-height: 0;
  padding: 12px;
  overflow: auto;
  background: #ece8de;
  overscroll-behavior: contain;
}
#markup-canvas {
  display: block;
  max-width: 100%;
  max-height: 100%;
  background: #ece8de;
  box-shadow: 0 8px 26px rgba(23, 32, 23, 0.18);
  touch-action: none;
}
.markup-tools {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 10px max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
  border-top: 1px solid var(--line);
  background: var(--panel);
}
.markup-tool-tray {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}
.markup-tool-group {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  min-width: 0;
}
.markup-tool-group button,
.markup-contrast-group button,
.markup-transform-group button,
.markup-delete {
  min-width: 48px;
  padding: 0 10px;
  overflow: hidden;
  font-size: 0.9rem;
  text-overflow: ellipsis;
}
.markup-tool-group button[aria-pressed="true"],
.markup-contrast-group button[aria-pressed="true"] {
  border-color: var(--brand);
  background: #edf6ef;
}
.markup-contrast-group,
.markup-transform-group {
  display: grid;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f4f2ec;
}
.markup-contrast-group {
  grid-template-columns: repeat(2, minmax(58px, 1fr));
}
.markup-transform-group {
  grid-template-columns: repeat(2, 48px);
}
.markup-contrast-group button {
  border-color: transparent;
  background: transparent;
}
.markup-transform-group button {
  padding: 0;
  border-color: transparent;
  background: transparent;
  font-size: 1.08rem;
}
.markup-delete {
  color: var(--warn);
}
.markup-label-field {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}
.markup-label-field span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}
.markup-label-field input {
  min-width: 0;
  min-height: 48px;
}
.markup-label-field textarea {
  min-height: 58px;
  resize: vertical;
}
.markup-meta-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
  align-items: end;
}
.photo-caption-dialog {
  width: min(560px, calc(100% - 20px));
  background: var(--panel);
}

@media (max-width: 980px) {
  .admin-filter-form {
    grid-template-columns: minmax(220px, 1fr) minmax(150px, 0.45fr);
  }
  .admin-filter-form label:first-of-type {
    grid-column: 1 / -1;
  }
  .admin-filter-form .filter-actions {
    grid-column: 1 / -1;
  }
  .admin-filter-form .filter-actions {
    justify-content: flex-start;
  }
  .project-admin-summary {
    grid-template-columns: minmax(220px, 1fr) minmax(170px, 0.8fr) auto;
  }
  .project-admin-actions {
    grid-column: 1 / -1;
  }
  .project-admin-actions {
    justify-content: flex-start;
  }
  .project-edit-panel .inline-edit,
  .project-edit-panel form {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }
}

@media (max-width: 760px) {
  .mobile-onboarding {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .mobile-onboarding__actions {
    justify-content: stretch;
  }

  .mobile-onboarding__actions .button,
  .mobile-onboarding__actions button {
    flex: 1 1 150px;
  }

  .topbar {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px 10px;
  }
  .brand span:last-child { display: none; }
  .brand {
    grid-column: 1;
    grid-row: 1;
    z-index: 1;
  }
  .topbar__main {
    grid-column: 1 / -1;
    grid-row: 1;
    justify-self: center;
    width: max-content;
    max-width: calc(100% - 132px);
    min-width: 0;
    justify-content: center;
  }
  .topbar-shift-menu {
    display: block;
    min-width: 0;
    max-width: 100%;
  }
  .topbar-shift-clock {
    max-width: 100%;
    padding-inline: 8px;
    overflow: hidden;
  }
  .topbar__main .nav {
    display: none;
  }
  .topbar__utilities {
    display: contents;
  }
  .mobile-menu {
    grid-column: 3;
    grid-row: 1;
    flex: 0 0 auto;
    align-self: center;
    justify-self: end;
    display: block;
    z-index: 1;
  }
  .topbar__utilities .viewing-pill,
  .topbar__utilities .logout-form {
    display: none;
  }
  .topbar__utilities .run-as-form {
    grid-column: 1 / -1;
    grid-row: 2;
    display: block;
    width: 100%;
    max-width: none;
  }
  .topbar__utilities .run-as-trigger {
    width: 100%;
    max-width: none;
  }
  .run-as-form label {
    justify-content: space-between;
  }
  .run-as-form select {
    flex: 1 1 auto;
  }
  .page-head { align-items: stretch; flex-direction: column; }
  .section-head { align-items: stretch; flex-direction: column; }
  .photo-section-head__actions {
    width: 100%;
    justify-content: stretch;
  }
  .photo-section-head__actions .quick-photo-form,
  .photo-section-head__actions .date-filter {
    width: 100%;
  }
  .date-filter {
    width: 100%;
  }
  .photo-date-tools {
    grid-template-columns: minmax(0, 1fr);
  }
  .photo-date-calendar,
  .photo-date-list {
    padding: 12px;
  }
  .photo-date-day {
    min-height: 34px;
    font-size: 0.82rem;
  }
  .work-panel, .two-column { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .report-filters { grid-template-columns: 1fr; }
  .admin-filter-form {
    grid-template-columns: minmax(0, 1fr) minmax(150px, 0.55fr);
    padding: 10px;
  }
  .admin-filter-form label:first-of-type,
  .admin-filter-form .filter-actions {
    grid-column: 1 / -1;
  }
  .admin-filter-form .filter-actions {
    display: flex;
    justify-content: stretch;
  }
  .admin-filter-form .button,
  .admin-filter-form button {
    width: auto;
  }
  .payroll-period__controls { grid-template-columns: 1fr; }
  .inline-edit { grid-template-columns: 1fr; }
  .time-entry-edit-head__actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: stretch;
  }
  .time-entry-edit-head__actions .button {
    justify-content: center;
    text-align: center;
  }
  .time-entry-edit-panel {
    padding: 12px;
  }
  .time-entry-edit-summary,
  .time-entry-edit-locations,
  .time-entry-edit-form {
    grid-template-columns: 1fr;
  }
  .time-entry-edit-summary {
    display: grid;
  }
  .time-entry-edit-summary__badges {
    justify-content: flex-start;
  }
  .time-entry-edit-form label:last-of-type,
  .time-entry-edit-form__actions {
    grid-column: auto;
  }
  .time-entry-edit-form__actions button {
    width: 100%;
  }
  .project-admin-summary {
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 12px;
  }
  .project-admin-details,
  .project-admin-actions,
  .project-action-group {
    grid-column: 1 / -1;
  }
  .project-admin-actions,
  .project-action-group {
    display: flex;
    justify-content: stretch;
  }
  .project-admin-actions .button,
  .project-admin-actions button,
  .project-action-group .button,
  .project-action-group button {
    width: auto;
  }
  .project-detail-head__actions {
    justify-content: stretch;
  }
  .project-detail-head__footer {
    flex-direction: column;
    align-items: stretch;
  }
  .project-detail-head--open .project-detail-head__footer {
    flex-direction: column;
    align-items: stretch;
    padding-top: 16px;
  }
  .project-detail-head--open {
    gap: 22px;
    min-height: 182px;
    padding: 24px 18px 18px 20px;
  }
  .project-detail-head--open .project-detail-head__actions {
    --current-shift-action-size: 48px;
    display: grid;
    grid-template-columns: minmax(104px, 1fr) repeat(2, minmax(0, 0.82fr));
    gap: 8px;
    flex-wrap: initial;
    justify-content: stretch;
    width: 100%;
  }
  .project-detail-head--open .project-detail-head__elapsed {
    display: flex;
    align-self: stretch;
    flex-direction: column;
    justify-content: space-between;
    min-width: max-content;
    margin-left: auto;
    padding: 1px 0 5px;
    transform: translateY(-2px);
  }
  .project-detail-head--open .project-detail-head__brand-row {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
  }
  .project-detail-head--open .project-detail-head__status {
    display: inline-flex;
    flex: 0 0 auto;
    gap: 5px;
    align-items: center;
    margin-top: 1px;
    padding: 4px 7px;
    border: 1px solid color-mix(in srgb, var(--company-fg, white) 20%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--company-fg, white) 8%, transparent);
    color: var(--company-fg, white);
    font-size: 0.67rem;
    font-weight: 800;
    line-height: 1;
    opacity: 0.86;
    white-space: nowrap;
  }
  .project-detail-head--open .project-detail-head__status::before {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: currentColor;
    content: "";
  }
  .project-detail-head__clock-in {
    flex: 1 1 100%;
    width: 100%;
  }
  .project-detail-head--open .project-detail-head__clock-out {
    flex: 0 0 auto;
    width: auto;
  }
  .project-detail-head--open .project-detail-head__main {
    padding-right: 0;
    padding-bottom: 0;
  }
  .project-detail-head--open .project-company-heading {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    margin-bottom: 5px;
  }
  .project-detail-head--open .project-company-logo {
    max-width: 128px;
    height: 30px;
  }
  .project-detail-head--open .company-heading__mark,
  .project-detail-head--open .company-asset-fallback {
    width: 30px;
    height: 30px;
  }
  .project-detail-head--open .project-detail-head__summary {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
  }
  .project-detail-head--open .project-detail-head__clock-out-menu,
  .project-detail-head--open .project-detail-head__icon-action,
  .project-detail-head--open .project-detail-head__photo-form,
  .project-detail-head--open .project-detail-head__photo-form .button {
    width: 100%;
    min-width: 0;
    max-width: none;
  }
  .project-detail-head--open .project-detail-head__clock-out-trigger,
  .project-detail-head--open .project-detail-head__icon-action,
  .project-detail-head--open .project-detail-head__photo-form .button {
    width: 100%;
    min-height: var(--current-shift-action-size);
    height: var(--current-shift-action-size);
    max-height: var(--current-shift-action-size);
    padding-inline: 10px;
    aspect-ratio: auto;
  }
  .project-detail-head--open .project-detail-head__clock-out-trigger {
    border-color: color-mix(in srgb, var(--brand) 68%, var(--company-fg, white));
    background: color-mix(in srgb, var(--brand) 82%, var(--company-fg, white));
    color: white;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--company-fg, white) 12%, transparent);
  }
  .project-detail-head--open .project-detail-head__icon-action,
  .project-detail-head--open .project-detail-head__photo-form .button {
    border-style: solid;
    border-color: color-mix(in srgb, var(--company-fg, white) 34%, transparent);
    background: color-mix(in srgb, var(--company-fg, white) 11%, transparent);
    color: var(--company-fg, white);
    gap: 6px;
    font-size: 0.86rem;
    box-shadow: none;
  }
  .project-detail-head--open .project-detail-head__action-label,
  .project-detail-head--open .project-detail-head__photo-form .quick-photo-form__label {
    position: static;
    width: auto;
    height: auto;
    padding: 0;
    margin: 0;
    overflow: visible;
    clip: auto;
    white-space: nowrap;
    border: 0;
  }
  .project-detail-head--open .project-detail-head__photo-form.current-shift__icon-form {
    grid-template-columns: minmax(0, 1fr);
  }
  .project-edit-panel {
    padding: 12px;
  }
  .project-edit-panel .inline-edit,
  .project-edit-panel form {
    grid-template-columns: 1fr;
  }
  .current-shift {
    position: sticky;
    top: var(--sticky-menu-height);
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    margin-top: 0;
    padding: 8px;
  }
  .current-shift > div:first-child {
    min-width: 0;
  }
  .current-shift__summary {
    flex-wrap: nowrap;
    gap: 6px;
    min-width: 0;
  }
  .current-shift__summary strong {
    display: none;
  }
  .current-shift__summary > a {
    min-width: 0;
    overflow: hidden;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .current-shift__live {
    min-height: 24px;
    padding: 3px 7px;
    font-size: 0.72rem;
  }
  .current-shift__meta {
    display: none;
  }
  .current-shift__actions {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: 42px;
    align-self: start;
    gap: 6px;
    width: auto;
    max-width: 100%;
    justify-content: end;
  }
  .current-shift__clock-out-form--quick {
    display: none;
  }
  .current-shift__clock-out-menu {
    display: block;
  }
  .current-shift__icon-action,
  .current-shift__photo-form .button {
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 0;
  }
  .current-shift__action-text,
  .current-shift__photo-form .quick-photo-form__label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  .current-shift__clock-out-options {
    right: max(8px, env(safe-area-inset-right));
    width: min(360px, calc(100vw - 16px));
  }
  .topbar-shift-menu__options {
    left: 50%;
    right: auto;
    width: min(340px, calc(100vw - 24px));
    transform: translateX(-50%);
  }
  .note-dialog {
    width: min(420px, calc(100% - 24px));
    max-height: calc(100dvh - 24px);
    height: auto;
    border-radius: 8px;
  }
  .note-dialog__actions,
  .note-dialog__actions button {
    width: 100%;
  }
  body[data-view="projects"] .current-shift {
    align-items: center;
  }
  body[data-view="projects"] .current-shift__project {
    display: none;
    gap: 14px;
    min-width: 0;
    padding: 14px;
    border: 1px solid color-mix(in srgb, var(--company-bg, #172017) 72%, white);
    border-radius: 8px;
    background: var(--company-bg, #172017);
    color: var(--company-fg, #fff);
    text-decoration: none;
  }
  body[data-view="projects"] .current-shift__project[data-company="sunray-windows"] {
    border-color: #000;
    background: #000;
    color: #fff;
  }
  .current-shift__project-brand {
    display: flex;
    gap: 12px;
    align-items: center;
    min-width: 0;
  }
  .current-shift__project-logo {
    flex: 0 1 178px;
    display: inline-grid;
    place-items: center;
    min-width: 0;
    max-width: 58%;
    min-height: 52px;
    padding: 6px 0;
    border-radius: 8px;
    background: var(--company-bg, #172017);
    overflow: hidden;
  }
  .current-shift__project-logo img {
    display: block;
    width: 100%;
    max-height: 52px;
    object-fit: contain;
  }
  .current-shift__project-logo--mark {
    flex-basis: 56px;
    width: 56px;
    height: 56px;
    padding: 10px;
  }
  .current-shift__project-company {
    min-width: 0;
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.1;
    overflow-wrap: anywhere;
    text-transform: uppercase;
  }
  .current-shift__project-copy {
    display: grid;
    gap: 4px;
    min-width: 0;
  }
  .current-shift__project-copy span {
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0;
    opacity: 0.78;
    text-transform: uppercase;
  }
  .current-shift__project-copy strong {
    font-size: 2rem;
    line-height: 1;
    overflow-wrap: anywhere;
  }
  .current-shift__project-copy small {
    color: inherit;
    font-size: 1rem;
    font-weight: 700;
    opacity: 0.9;
    overflow-wrap: anywhere;
  }
  body[data-view="projects"][data-open-shift="1"] .project-grid > .project-card[data-project-current="1"] {
    display: none;
  }
  body[data-view="projects"][data-open-shift="1"] .shift-card--open > .quick-actions--clock-out,
  body[data-view="projects"][data-open-shift="1"] .shift-card--open > .action-detail {
    display: none;
  }
  .offline-queue-status {
    position: sticky;
    top: 148px;
    z-index: 8;
  }
  .activity-item {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .activity-feed .activity-item {
    padding: 14px;
  }
  .note-thread__replies {
    padding-left: 10px;
  }
  .note-thread__reply {
    padding-left: 8px;
  }
  .note-thread__reply-actions,
  .note-thread__reply-actions button {
    width: 100%;
  }
  .activity-event-title {
    font-size: 1.05rem;
  }
  .activity-title-row {
    gap: 6px;
  }
  .activity-title-row h3 {
    font-size: 1.08rem;
  }
  .activity-title-row time {
    width: 100%;
    white-space: normal;
  }
  .activity-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .activity-photo {
    grid-template-columns: 88px minmax(0, 1fr);
  }
  .activity-photo-preview {
    grid-template-columns: 88px minmax(0, 1fr);
  }
  .activity-photo-batch-thumbs {
    --batch-thumb-size: 41px;
    width: 88px;
  }
  .activity-photo img,
  .activity-photo-preview img { width: 88px; }
  .activity-photo-batch-thumbs img { width: var(--batch-thumb-size); }
  .time-filter-panel__head {
    display: grid;
    gap: 10px;
  }
  .time-filter-panel__head .count-pill {
    width: 100%;
    justify-content: center;
    border-radius: 8px;
  }
  .time-filter-presets {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
  }
  .time-filter-chip {
    min-width: 0;
    width: 100%;
    padding-inline: 8px;
    text-align: center;
    white-space: normal;
  }
  .time-filter-chip:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
  .time-filter-form {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    overflow: hidden;
  }
  .time-filter-form label {
    overflow: hidden;
  }
  .time-filter-form input[type="date"] {
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    width: 100%;
    inline-size: 100%;
    max-inline-size: 100%;
    padding-inline: 12px;
    text-align: center;
  }
  .time-filter-form input[type="date"]::-webkit-date-and-time-value {
    margin: 0;
    min-height: 1.35em;
    text-align: center;
  }
  .time-filter-form__actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .time-filter-form__actions .button,
  .time-filter-form__actions button {
    width: 100%;
    padding-inline: 8px;
    white-space: normal;
  }
  .time-kpis { grid-template-columns: 1fr; }
  .time-days { display: grid; }
  .time-table { display: none; }
  .time-card__locations { grid-template-columns: 1fr; }
  .project-time-table {
    overflow: visible;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .project-time-table table,
  .project-time-table tbody {
    display: block;
    width: 100%;
    min-width: 0;
  }
  .project-time-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  .project-time-table tbody {
    display: grid;
    gap: 10px;
  }
  .project-time-table tr {
    display: grid;
    gap: 10px;
    padding: 14px;
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 8px;
    box-shadow: var(--shadow);
  }
  .project-time-table td {
    display: grid;
    grid-template-columns: minmax(78px, 0.34fr) minmax(0, 1fr);
    gap: 8px 10px;
    align-items: start;
    min-width: 0;
    padding: 0;
    border: 0;
    font-weight: 800;
  }
  .project-time-table td::before {
    content: attr(data-label);
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1.2;
    text-transform: uppercase;
  }
  .project-time-table .project-time-table__worker {
    grid-template-columns: minmax(0, 1fr);
  }
  .project-time-table .project-time-table__worker::before {
    content: none;
  }
  .project-time-table .project-time-table__actions {
    width: auto;
    white-space: normal;
    grid-template-columns: minmax(0, 1fr);
  }
  .project-time-table .project-time-table__actions::before {
    content: none;
  }
  .project-time-table .project-time-edit-link {
    width: 100%;
  }
  .project-time-table .captured-location,
  .project-time-table .worker-identity {
    min-width: 0;
  }
  h1 { font-size: 2.3rem; }
  dialog {
    width: 100%;
    max-width: none;
    height: 100dvh;
    max-height: none;
    border-radius: 0;
  }
  .note-dialog {
    position: fixed;
    inset: auto 12px max(12px, env(safe-area-inset-bottom));
    width: auto;
    max-width: none;
    height: auto;
    max-height: min(78dvh, 560px);
    margin: 0;
    border-radius: 14px;
  }
  .note-dialog[open] {
    grid-template-rows: auto minmax(0, auto);
  }
  .note-dialog__head {
    padding: 16px 16px 6px;
  }
  .note-dialog__form {
    overflow: auto;
    padding: 8px 16px 16px;
  }
  .note-dialog__form textarea {
    min-height: 150px;
    max-height: 34dvh;
  }
  .note-dialog__actions,
  .note-dialog__actions button {
    width: 100%;
  }
  .morning-alert-dialog[open] {
    display: grid;
  }
  .morning-alert-dialog__form {
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-height: 100%;
  }
  .morning-alert-dialog__head {
    align-items: flex-start;
  }
  .morning-alert-dialog__body {
    align-content: start;
    max-height: none;
    min-height: 0;
  }
  .morning-alert-dialog__actions {
    align-self: end;
  }
  #markup-dialog {
    height: 100dvh;
    grid-template-rows: auto minmax(0, 1fr) auto;
  }
  .photo-capture-dialog {
    height: 100dvh;
  }
  .photo-capture-dialog__topbar {
    padding-top: max(8px, env(safe-area-inset-top));
  }
  .photo-capture-dialog__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .photo-capture-dialog__count {
    grid-column: 1 / -1;
  }
  .markup-topbar {
    min-height: 60px;
    grid-template-columns: auto minmax(42px, 1fr) auto;
    padding-top: max(8px, env(safe-area-inset-top));
    padding-bottom: 8px;
  }
  .markup-stage {
    height: auto;
    min-height: 0;
    padding: 8px;
  }
  .markup-tools {
    padding-top: 8px;
  }
  .markup-tool-tray {
    grid-template-columns: 1fr;
  }
  .markup-meta-fields {
    grid-template-columns: 1fr;
  }
  .markup-control-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    justify-content: stretch;
  }
  .markup-delete {
    min-width: 76px;
  }
}

@media (max-width: 560px) {
  .admin-project-head .project-action-group,
  .admin-filter-form,
  .admin-filter-form .filter-actions,
  .project-admin-actions,
  .project-action-group {
    display: grid;
    grid-template-columns: 1fr;
  }
  .admin-filter-form {
    grid-template-columns: 1fr;
  }
  .admin-filter-form .button,
  .admin-filter-form button,
  .project-admin-actions .button,
  .project-admin-actions button,
  .project-action-group .button,
  .project-action-group button {
    width: 100%;
  }
  .project-admin-summary {
    grid-template-columns: 1fr;
  }
  .form-grid .company-picker {
    grid-column: auto;
  }
  .company-picker__options {
    grid-template-columns: 1fr;
  }
  .company-form-grid,
  .company-edit-form,
  .company-admin-item,
  .company-admin-preview,
  .test-email-form {
    grid-template-columns: 1fr;
  }
  .test-email-form button {
    width: 100%;
  }
  .company-edit-actions {
    justify-content: stretch;
  }
  .company-edit-actions button {
    width: 100%;
  }
}

/* Employee and foreman welcome dashboard */
.welcome-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.95fr);
  gap: 14px;
  align-items: stretch;
  margin: 0 0 18px;
}
.welcome-grid > * {
  min-width: 0;
}
.shift-card,
.quick-start-card {
  display: grid;
  gap: 12px;
  align-content: start;
  min-width: 0;
  padding: 16px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}
.shift-card {
  border-color: #cce1d1;
}
.shift-card--open,
.project-card--current {
  border-color: #cce1d1;
}
.shift-card h2,
.shift-card h3,
.quick-start-card h2,
.quick-start-card h3 {
  margin: 0;
  font-size: 1.1rem;
  line-height: 1.2;
}
.shift-card__heading-row {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
}
.shift-card p,
.quick-start-card p {
  margin: 0;
  min-width: 0;
  overflow-wrap: break-word;
}
.shift-card dl,
.quick-start-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}
.shift-card dt,
.quick-start-card dt,
.project-card__meta dt {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  text-transform: uppercase;
}
.shift-card dd,
.quick-start-card dd,
.project-card__meta dd {
  margin: 2px 0 0;
  min-width: 0;
  font-weight: 900;
  overflow-wrap: break-word;
}
.shift-card .stats-row,
.quick-start-card .stats-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}
.welcome-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: auto;
}
.welcome-actions form {
  margin: 0;
}
.welcome-actions .button,
.welcome-actions button,
.project-card__actions .button,
.project-card__actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  text-align: center;
}
.recent-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.recent-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 12px;
  align-items: center;
  min-width: 0;
  padding: 10px;
  background: #fbfaf6;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.recent-item > * {
  min-width: 0;
}
.recent-item a,
a.recent-item {
  font-weight: 800;
}
.recent-item time,
.recent-item small,
.recent-item .muted {
  color: var(--muted);
  font-size: 0.85rem;
  font-weight: 700;
}
.project-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
}
.project-grid > .project-card {
  gap: 10px;
  min-width: 0;
  min-height: 220px;
  color: inherit;
}
.project-grid > .project-card > * {
  min-width: 0;
}
.project-grid > .project-card p {
  margin: 0;
  color: var(--muted);
  font-weight: 700;
  overflow-wrap: break-word;
}
.project-grid > .project-card h2,
.project-card__primary,
.project-card__primary h2,
.project-card__primary h3 {
  min-width: 0;
  overflow-wrap: break-word;
}
.project-card__primary {
  display: grid;
  gap: 6px;
}
.project-card__primary h2,
.project-card__primary h3 {
  margin: 0;
  line-height: 1.18;
}
.project-card__meta {
  display: flex;
  gap: 8px 12px;
  flex-wrap: wrap;
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
}
.project-grid > .project-card .project-card__meta--address {
  color: color-mix(in srgb, var(--company-fg, var(--ink)) 68%, var(--muted));
  font-size: 1.03rem;
  font-weight: 800;
}
.project-grid > .project-card .project-card__meta--subline {
  gap: 4px;
  color: color-mix(in srgb, var(--muted) 88%, var(--paper));
  font-size: 0.8rem;
  font-weight: 700;
}
.project-grid > .project-card .project-card__meta--subline time {
  color: inherit;
  font-weight: 700;
}
.project-card__meta > * {
  min-width: 0;
}
.project-card__actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.project-card__actions form {
  flex: 1 1 130px;
  margin: 0;
}
.project-card__actions .button,
.project-card__actions button {
  flex: 1 1 130px;
}
.project-card__actions form .button,
.project-card__actions form button {
  width: 100%;
}
.project-grid .pill {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: break-word;
}
.project-grid .stats-row {
  min-width: 0;
}
.project-grid .stats-row div,
.project-grid .stats-row dd {
  min-width: 0;
}
.project-grid .stats-row dd {
  overflow-wrap: break-word;
}

@media (max-width: 900px) {
  .welcome-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .welcome-grid {
    gap: 10px;
    margin-bottom: 14px;
  }
  .shift-card,
  .quick-start-card {
    padding: 14px;
  }
  .shift-card dl,
  .quick-start-card dl {
    grid-template-columns: 1fr;
  }
  .shift-card .stats-row,
  .quick-start-card .stats-row {
    grid-template-columns: 1fr;
  }
  .welcome-actions,
  .project-card__actions {
    display: grid;
  }
  .welcome-actions {
    grid-template-columns: 1fr;
  }
  .project-card__actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .welcome-actions .button,
  .welcome-actions button,
  .project-card__actions .button,
  .project-card__actions button {
    width: 100%;
  }
  .recent-item {
    grid-template-columns: 1fr;
  }
  .project-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .project-grid > .project-card {
    min-height: 0;
    padding: 14px;
  }
  .project-card__header {
    padding: 12px;
  }
  .project-card__actions form,
  .project-card__actions .button,
  .project-card__actions button {
    flex-basis: auto;
  }
  .project-card__actions form {
    min-width: 0;
  }
  .project-card__actions > .button:only-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 420px) {
  .activity-facts {
    grid-template-columns: 1fr;
  }
  .project-grid .stats-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }
  .project-card__top {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Action-first work landing refinements */
.welcome-head {
  align-items: center;
  margin-bottom: 14px;
}
.welcome-head h1 {
  font-size: clamp(2.2rem, 4vw, 3.25rem);
}
.welcome-head .muted {
  max-width: 720px;
  font-size: 1.05rem;
}
.shift-card,
.quick-start-card {
  gap: 14px;
}
.shift-card h2,
.quick-start-card h2 {
  font-size: clamp(1.45rem, 3vw, 2rem);
}
.quick-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  align-items: end;
  margin-top: 2px;
}
.quick-actions .button,
.quick-actions button {
  width: 100%;
  min-height: 48px;
}
.quick-clock-form--primary button,
.photo-action-card__form .button,
.quick-photo-form .button {
  min-height: 54px;
  font-size: 1rem;
  font-weight: 900;
}
.welcome-grid--start {
  grid-template-columns: 1fr;
}
.welcome-grid--start .shift-card {
  width: min(760px, 100%);
}
.shift-card--start {
  gap: 16px;
}
.start-work-company {
  display: flex;
  align-items: center;
  margin-top: -2px;
}
.shift-card--start h2 {
  font-size: clamp(2rem, 5vw, 3.25rem);
  line-height: 1;
}
.start-work-form {
  display: grid;
  margin: 0;
}
.start-work-form button {
  width: 100%;
  min-height: 76px;
  font-size: clamp(1.45rem, 4vw, 2.1rem);
  font-weight: 900;
}
.start-work-form .clock-in-button {
  justify-content: flex-start;
  gap: 18px;
  padding: 12px 18px 12px 12px;
}
.start-work-form .clock-in-button__icon,
.start-work-form .clock-in-button__media {
  width: 58px;
  height: 58px;
}
.start-work-form .clock-in-button__text {
  flex: 1 1 auto;
  text-align: left;
}
.start-work-form .clock-in-button__label {
  font-size: 1em;
}
.start-work-form .clock-in-button__hint {
  font-size: 0.92rem;
}
.start-work-links {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}
.start-work-links__change {
  color: var(--accent);
  font-weight: 900;
}
.start-work-links__details {
  min-height: 42px;
  padding-inline: 16px;
}
.employee-project-tools {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.36fr);
  gap: 12px;
  align-items: end;
  margin: 0 0 14px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--panel) 88%, var(--paper));
}
.employee-project-filters {
  align-items: center;
}
.employee-project-filters .filter-chip {
  cursor: pointer;
  width: auto;
}
.employee-project-search {
  min-width: 0;
}
.employee-project-count {
  grid-column: 1 / -1;
  margin: -4px 0 0;
  font-size: 0.86rem;
  font-weight: 800;
}
.employee-project-empty-filter {
  margin-bottom: 14px;
}
.employee-project-empty-filter[hidden] {
  display: none !important;
}
.employee-project-lock {
  border: 1px solid #cce1d1;
  background: #edf6ef;
}
.project-card__actions .clock-in-button {
  min-height: 54px;
  gap: 10px;
  padding: 7px 12px 7px 8px;
}
.project-card__actions .clock-in-button__icon,
.project-card__actions .clock-in-button__media {
  width: 40px;
  height: 40px;
}
.project-card__actions .clock-in-button__text {
  gap: 0;
  justify-items: start;
}
.project-card__actions .clock-in-button__label {
  font-size: 1rem;
  line-height: 1.1;
}
.project-card__actions .clock-in-button__hint {
  display: none;
}
.project-switcher {
  display: grid;
  gap: 12px;
}
.project-switcher__list {
  display: grid;
  gap: 10px;
}
.project-switcher-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, 0.34fr);
  gap: 12px;
  align-items: start;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow);
}
.project-switcher-card[hidden] {
  display: none;
}
.project-switcher-card__main {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.project-switcher-card__badges {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
  min-width: 0;
}
.project-switcher-card__badges .pill {
  min-height: 24px;
  padding: 3px 8px;
  font-size: 0.74rem;
}
.project-switcher-card h3 {
  margin: 0;
  font-size: 1.18rem;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.project-switcher-card p,
.project-switcher-card small {
  margin: 0;
  overflow-wrap: anywhere;
}
.project-switcher-card__last-shift {
  color: color-mix(in srgb, var(--muted) 88%, var(--paper));
  font-size: 0.8rem;
  font-weight: 700;
}
.project-switcher-card__actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(74px, auto);
  gap: 8px;
  align-items: stretch;
}
.project-switcher-card__actions form {
  margin: 0;
}
.project-switcher-card__actions .button,
.project-switcher-card__actions button {
  width: 100%;
  min-height: 46px;
}
.project-switcher-card__actions > .button {
  min-height: 40px;
  padding-block: 6px;
}
.quick-actions form {
  margin: 0;
}
.quick-clock-form {
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(160px, 220px);
  gap: 8px;
  align-items: end;
}
.quick-clock-form label {
  min-width: 0;
}
.quick-clock-form .form-status {
  grid-column: 1 / -1;
}
.quick-actions--clock-out {
  grid-template-columns: minmax(0, 1.2fr) minmax(180px, 0.45fr) minmax(180px, 0.45fr);
}
.quick-actions--clock-out .quick-clock-form {
  grid-column: 1 / 2;
}
.project-card__top {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-width: 0;
}
.project-card__header {
  display: grid;
  gap: 12px;
  padding: 12px 14px 14px;
  border: 1px solid color-mix(in srgb, var(--company-bg, #eef1ea) 45%, white);
  border-radius: 8px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--company-bg, #eef1ea) 16%, white) 0%, white 100%);
}
.project-card--white-company {
  border-color: color-mix(in srgb, var(--brand) 28%, var(--line));
  box-shadow: inset 0 4px 0 var(--brand), 0 16px 34px rgba(23, 32, 23, 0.1);
}
.project-card--white-company .project-card__header {
  border-color: color-mix(in srgb, var(--brand) 30%, var(--line));
  background: linear-gradient(180deg, #ffffff 0%, #fbfaf6 100%);
}
.project-card--white-company .company-pill {
  border-color: color-mix(in srgb, var(--brand) 24%, var(--line));
  background: white;
  color: var(--brand);
  box-shadow: inset 0 0 0 1px rgba(23, 32, 23, 0.03);
}
.project-card--white-company .stats-row div,
.project-card--white-company .project-card__actions {
  border-color: color-mix(in srgb, var(--brand) 18%, var(--line));
}
.project-card__badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  min-width: 0;
}
.project-card__identity {
  display: grid;
  gap: 8px;
}
.project-card__identity h2 {
  font-size: clamp(1.55rem, 3vw, 2rem);
  line-height: 0.98;
}
.project-card__top .pill {
  min-width: 0;
}
.project-card__header .company-pill,
.project-card__header .pill {
  box-shadow: 0 1px 0 rgba(23, 32, 23, 0.04);
}
.project-card h2 a {
  text-decoration: none;
}
.project-card h2 a:focus-visible,
.project-card h2 a:hover {
  color: var(--accent);
}
.project-card__actions {
  align-items: stretch;
}
.project-card__actions .button,
.project-card__actions button {
  min-height: 46px;
}
.project-card__actions .form-status {
  flex-basis: 100%;
}

/* Job/location card polish */
.project-list-section .project-grid {
  align-items: stretch;
  gap: clamp(14px, 2vw, 20px);
}

.project-grid > .project-card {
  --job-card-line: color-mix(in srgb, var(--company-bg, #eef1ea) 18%, var(--line));
  --job-card-soft: color-mix(in srgb, var(--company-bg, #eef1ea) 10%, var(--paper));
  position: relative;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  gap: 14px;
  min-height: 300px;
  padding: 14px;
  border-color: var(--job-card-line);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--company-bg, #eef1ea) 8%, #fff) 0%, #fff 46%, #fbfaf6 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8), 0 18px 38px rgba(23, 32, 23, 0.1);
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.project-grid > .project-card::after {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  border-radius: 8px 8px 0 0;
  background: color-mix(in srgb, var(--company-bg, #eef1ea) 80%, white);
  opacity: 0.95;
}

.project-grid > .project-card:focus-within {
  border-color: color-mix(in srgb, var(--company-bg, #eef1ea) 58%, var(--brand));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--company-bg, #eef1ea) 24%, transparent), 0 18px 38px rgba(23, 32, 23, 0.1);
}

@media (hover: hover) {
  .project-grid > .project-card:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--company-bg, #eef1ea) 54%, var(--brand));
    box-shadow: 0 24px 46px rgba(23, 32, 23, 0.13);
  }
}

.project-grid > .project-card.project-card--current {
  background:
    linear-gradient(180deg, color-mix(in srgb, #e2f2e6 48%, #fff) 0%, #fff 46%, #fbfaf6 100%);
  box-shadow: inset 0 0 0 1px rgba(47, 111, 72, 0.08), 0 20px 42px rgba(47, 111, 72, 0.14);
}

.project-card__header {
  gap: 14px;
  padding: 0;
  border: 0;
  background: transparent;
}

.project-card__top {
  gap: 12px;
}

.project-card__badges {
  gap: 7px;
}

.project-card__header .company-pill {
  max-width: min(100%, 16rem);
  min-height: 32px;
  padding-right: 10px;
  border-color: color-mix(in srgb, var(--company-bg, #eef1ea) 58%, var(--ink));
  box-shadow: none;
}

.project-card__header .company-pill span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-card__top .pill,
.project-switcher-card__badges .pill {
  min-height: 28px;
  border-radius: 8px;
  font-size: 0.72rem;
  letter-spacing: 0.02em;
}

.project-card__identity {
  gap: 10px;
  padding-inline: 2px;
}

.project-card__identity h2 {
  font-size: clamp(1.42rem, 2.4vw, 1.88rem);
  line-height: 1.04;
  text-wrap: balance;
}

.project-grid > .project-card .project-card__meta--address,
.project-switcher-card p {
  position: relative;
  display: block;
  padding: 9px 10px 9px 28px;
  border: 1px solid color-mix(in srgb, var(--company-bg, #eef1ea) 24%, var(--line));
  border-radius: 8px;
  background: var(--job-card-soft, color-mix(in srgb, var(--company-bg, #eef1ea) 10%, var(--paper)));
  color: color-mix(in srgb, var(--ink) 78%, var(--muted));
  font-size: 0.93rem;
  font-weight: 760;
  line-height: 1.28;
}

.project-grid > .project-card .project-card__meta--address::before,
.project-switcher-card p::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--company-bg, #eef1ea) 82%, var(--brand));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--company-bg, #eef1ea) 22%, #fff);
  transform: translateY(-50%);
}

.project-grid > .project-card .project-card__meta--subline {
  margin-top: -2px;
  color: color-mix(in srgb, var(--muted) 84%, var(--paper));
  font-size: 0.78rem;
  font-weight: 760;
}

.project-grid .stats-row {
  gap: 8px;
  margin: 0;
}

.project-grid .stats-row div {
  display: grid;
  gap: 3px;
  align-content: center;
  min-height: 60px;
  padding: 9px 10px;
  border: 1px solid color-mix(in srgb, var(--company-bg, #eef1ea) 18%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--company-bg, #eef1ea) 7%, white);
}

.project-grid .stats-row dt {
  color: color-mix(in srgb, var(--muted) 88%, var(--company-fg, var(--ink)));
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.06em;
}

.project-grid .stats-row dd {
  margin: 0;
  color: var(--ink);
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.08;
}

.project-card__actions {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(7rem, 0.8fr);
  gap: 8px;
  align-items: stretch;
  margin-top: auto;
  padding-top: 0;
  border-top: 0;
}

.project-card__actions form {
  min-width: 0;
}

.project-card__actions form,
.project-card__actions .button,
.project-card__actions button {
  flex: none;
}

.project-card__actions .button,
.project-card__actions button,
.project-switcher-card__actions .button,
.project-switcher-card__actions button {
  width: 100%;
  min-height: 50px;
  border-radius: 8px;
  transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease, color 180ms ease, transform 180ms ease;
}

.project-card__actions .primary,
.project-switcher-card__actions .primary {
  box-shadow: 0 12px 22px rgba(36, 51, 38, 0.18);
}

.project-card__actions .button--quiet,
.project-switcher-card__actions .button--quiet {
  border-style: solid;
  background: color-mix(in srgb, var(--panel) 64%, var(--paper));
  color: color-mix(in srgb, var(--brand) 78%, var(--muted));
}

.project-card__actions .quick-photo-form .button,
.project-switcher-card__actions .quick-photo-form .button {
  border-color: color-mix(in srgb, var(--sun) 34%, var(--line));
  background: #fffaf0;
  color: #76530d;
}

.project-card__actions > .button:only-child,
.project-card__actions form:only-child {
  grid-column: 1 / -1;
}

.project-card__actions .button:active,
.project-card__actions button:active,
.project-switcher-card__actions .button:active,
.project-switcher-card__actions button:active {
  transform: translateY(1px) scale(0.99);
}

.project-card a:focus-visible,
.project-card button:focus-visible,
.project-switcher-card a:focus-visible,
.project-switcher-card button:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--accent) 42%, transparent);
  outline-offset: 3px;
}

.project-switcher-card {
  --job-card-soft: color-mix(in srgb, var(--company-bg, #eef1ea) 10%, var(--paper));
  grid-template-columns: minmax(0, 1fr) auto minmax(220px, 0.36fr);
  gap: 14px;
  align-items: center;
  padding: 14px;
  border-color: color-mix(in srgb, var(--company-bg, #eef1ea) 18%, var(--line));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--company-bg, #eef1ea) 7%, #fff) 0%, #fff 100%);
  box-shadow: 0 16px 34px rgba(23, 32, 23, 0.09);
}

.project-switcher-card__main {
  gap: 8px;
}

.project-switcher-card__badges {
  gap: 7px;
}

.project-switcher-card h3 {
  font-size: 1.24rem;
  line-height: 1.12;
  text-wrap: balance;
}

.project-switcher-card__actions {
  grid-template-columns: minmax(0, 1.3fr) minmax(6.75rem, 0.7fr);
}

@media (max-width: 760px) {
  .project-grid > .project-card {
    gap: 12px;
    min-height: 0;
    padding: 12px;
  }

  .project-card__actions {
    grid-template-columns: 1fr;
  }

  .project-card__actions .button,
  .project-card__actions button,
  .project-switcher-card__actions .button,
  .project-switcher-card__actions button {
    min-height: 52px;
  }

  .project-switcher-card {
    align-items: start;
  }
}

@media (max-width: 420px) {
  .project-grid > .project-card .project-card__meta--address,
  .project-switcher-card p {
    font-size: 0.9rem;
  }

  .project-grid .stats-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }

  .project-grid .stats-row div {
    min-height: 58px;
    padding: 8px;
  }
}

body[data-view="projects"] .current-shift {
  display: none;
}

.current-shift__actions {
  --current-shift-action-size: 44px;
}
.current-shift__clock-out-menu,
.current-shift__icon-form {
  width: var(--current-shift-action-size);
  min-width: var(--current-shift-action-size);
}
.current-shift__icon-action,
.current-shift__icon-form .button,
.current-shift__photo-form .button {
  width: var(--current-shift-action-size);
  min-width: var(--current-shift-action-size);
  max-width: var(--current-shift-action-size);
  height: var(--current-shift-action-size);
  min-height: var(--current-shift-action-size);
  max-height: var(--current-shift-action-size);
  padding: 0;
  aspect-ratio: 1;
}
.current-shift__icon-form.quick-photo-form {
  grid-template-columns: var(--current-shift-action-size);
}
@media (min-width: 761px) {
  .current-shift__icon-action--labeled,
  .current-shift__icon-form--labeled,
  .current-shift__icon-form--labeled .button {
    width: auto;
    min-width: 0;
    max-width: none;
  }
  .current-shift__icon-action--labeled,
  .current-shift__icon-form--labeled .button {
    height: var(--current-shift-action-size);
    min-height: var(--current-shift-action-size);
    max-height: none;
    padding: 0 14px;
    aspect-ratio: auto;
  }
  .current-shift__icon-form--labeled.quick-photo-form {
    grid-template-columns: minmax(0, 1fr);
  }
  .current-shift__icon-action--labeled .current-shift__action-text,
  .current-shift__icon-form--labeled .quick-photo-form__label {
    position: static;
    width: auto;
    height: auto;
    padding: 0;
    margin: 0;
    overflow: visible;
    clip: auto;
    white-space: nowrap;
    border: 0;
  }
}

@media (max-width: 760px) {
  .topbar {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }
  .mobile-menu {
    justify-self: end;
  }
  .welcome-head {
    gap: 10px;
    margin-bottom: 12px;
  }
  .welcome-head h1 {
    font-size: 2rem;
  }
  .welcome-head .muted {
    font-size: 1rem;
  }
  .welcome-grid--start .shift-card {
    width: 100%;
  }
  .shift-card--start h2 {
    font-size: 2rem;
  }
  .start-work-form button {
    min-height: 66px;
  }
  .start-work-form .clock-in-button {
    gap: 12px;
    padding-inline: 10px 14px;
  }
  .start-work-form .clock-in-button__icon,
  .start-work-form .clock-in-button__media {
    width: 52px;
    height: 52px;
  }
  .quick-actions,
  .quick-clock-form {
    grid-template-columns: 1fr;
  }
  .employee-project-tools {
    grid-template-columns: 1fr;
    padding: 10px;
  }
  .employee-project-filters {
    flex-wrap: nowrap;
    gap: 6px;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .employee-project-filters::-webkit-scrollbar {
    display: none;
  }
  .employee-project-filters .filter-chip {
    flex: 0 0 auto;
    min-height: 40px;
    gap: 6px;
    padding: 7px 10px;
    box-shadow: none;
  }
  .employee-project-filters .filter-chip--company {
    justify-content: center;
    width: 42px;
    min-width: 42px;
    padding-inline: 7px;
  }
  .employee-project-filters .filter-chip--company .filter-chip__mark {
    width: 28px;
    height: 28px;
    border-radius: 999px;
  }
  .employee-project-filters .filter-chip--company .filter-chip__label--full,
  .employee-project-filters .filter-chip--company .filter-chip__label--short,
  .employee-project-filters .filter-chip--company strong {
    display: none;
  }
  .project-switcher-card {
    grid-template-columns: minmax(0, 1fr);
  }
  .project-switcher-card__actions {
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
  }
  .quick-actions--clock-out {
    grid-template-columns: 1fr;
  }
  .quick-actions--clock-out .quick-clock-form {
    grid-template-columns: 1fr;
  }
  .current-shift__actions {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: var(--current-shift-action-size);
    width: auto;
    max-width: 100%;
    justify-content: end;
  }
  .current-shift__clock-out-form {
    grid-template-columns: 1fr;
  }
  .project-card__top {
    align-items: center;
  }
  body[data-view="projects"][data-open-shift="1"] .shift-card--open > .quick-actions--clock-out {
    display: grid;
  }
  body[data-view="projects"][data-open-shift="1"] .shift-card--open > .action-detail {
    display: grid;
  }
  body[data-view="projects"] .current-shift {
    display: grid;
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-loading-screen,
  .clock-in-button,
  .clock-in-button__media {
    transition: none;
  }
  .app-loading-screen__mark::before,
  .clock-in-button.is-hammering .clock-in-button__media {
    animation: none;
  }
}

/* Admin desktop redesign */
body.admin-body {
  background:
    radial-gradient(circle at top left, rgba(216, 154, 34, 0.08), transparent 26%),
    linear-gradient(180deg, #f5f0e6 0%, #f7f4ed 28%, #f2eee5 100%);
}

.admin-body {
  color: #19211a;
}

.admin-body .page {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 28px 32px 48px;
}

.page--admin {
  min-width: 0;
}

.admin-shell {
  display: grid;
  grid-template-columns: var(--admin-rail-width) minmax(0, 1fr);
  min-height: 100vh;
  transition: grid-template-columns 180ms ease;
}

.admin-rail {
  position: sticky;
  top: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 24px;
  align-self: start;
  min-height: 100dvh;
  max-height: 100dvh;
  padding-top: max(28px, var(--safe-top));
  padding-right: max(22px, var(--safe-right));
  padding-bottom: max(28px, var(--safe-bottom));
  padding-left: max(22px, var(--safe-left));
  overflow: auto;
  overscroll-behavior: contain;
  background:
    linear-gradient(180deg, rgba(36, 51, 38, 0.97) 0%, rgba(24, 35, 27, 0.99) 100%);
  color: #f5f1e7;
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  transition: padding 180ms ease;
}

.admin-rail__brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.admin-brand {
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.admin-brand .brand-mark {
  width: 44px;
  height: 44px;
  background: linear-gradient(135deg, #f1e2b9 0%, #c5894e 100%);
  color: #243326;
  border-radius: 14px;
  font-weight: 900;
}

.admin-brand__copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.admin-brand__copy strong {
  font-size: 1rem;
}

.admin-brand__copy small,
.admin-rail__footer .muted {
  color: rgba(245, 241, 231, 0.7);
}

.admin-rail__nav {
  display: grid;
  gap: 8px;
  align-content: start;
}

.admin-rail__nav a {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 0 16px;
  border: 1px solid transparent;
  border-radius: 16px;
  color: rgba(245, 241, 231, 0.82);
  font-weight: 800;
  transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease, transform 140ms ease;
}

.admin-rail__nav-icon {
  display: grid;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  place-items: center;
}

.admin-rail__nav-icon .current-shift__action-icon,
.admin-rail__toggle .current-shift__action-icon {
  width: 20px;
  height: 20px;
}

.admin-rail__nav-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-rail__toggle {
  display: grid;
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(245, 241, 231, 0.2);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(245, 241, 231, 0.9);
  box-shadow: none;
}

.admin-rail__toggle:hover,
.admin-rail__toggle:focus-visible {
  color: #fff;
  border-color: rgba(245, 241, 231, 0.32);
  background: rgba(255, 255, 255, 0.1);
}

.admin-rail__toggle .current-shift__action-icon {
  transition: transform 180ms ease;
}

.admin-rail__nav a:hover,
.admin-rail__nav a:focus-visible {
  color: white;
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
  transform: translateX(2px);
}

.admin-rail__nav a.is-active {
  color: #18231b;
  background: linear-gradient(135deg, #f2e6c2 0%, #e4c57a 100%);
  border-color: rgba(0, 0, 0, 0.1);
  box-shadow: 0 16px 28px rgba(0, 0, 0, 0.16);
}

.admin-rail__footer {
  display: grid;
  gap: 4px;
  padding: 18px 16px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.04);
}

.admin-rail__account {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.admin-rail__account > span:last-child {
  display: grid;
  gap: 2px;
  min-width: 0;
}

@media (min-width: 901px) {
  .admin-rail-collapsed .admin-shell {
    grid-template-columns: var(--admin-rail-collapsed-width) minmax(0, 1fr);
  }

  .admin-rail-collapsed .admin-rail {
    gap: 20px;
    padding-right: max(14px, var(--safe-right));
    padding-left: max(14px, var(--safe-left));
  }

  .admin-rail-collapsed .admin-rail__brand {
    display: grid;
    justify-content: center;
    justify-items: center;
  }

  .admin-rail-collapsed .admin-brand {
    justify-content: center;
  }

  .admin-rail-collapsed .admin-brand__copy,
  .admin-rail-collapsed .admin-rail__account-copy,
  .admin-rail-collapsed .admin-rail__nav-label {
    display: none;
  }

  .admin-rail-collapsed .admin-rail__nav a {
    justify-content: center;
    padding: 0;
  }

  .admin-rail-collapsed .admin-rail__nav a:hover,
  .admin-rail-collapsed .admin-rail__nav a:focus-visible {
    transform: none;
  }

  .admin-rail-collapsed .admin-rail__footer {
    justify-items: center;
    padding: 14px 0;
  }

  .admin-rail-collapsed .admin-rail__account {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .admin-rail-collapsed .admin-rail__toggle .current-shift__action-icon {
    transform: scaleX(-1);
  }
}

.admin-rail__account strong,
.admin-rail__account .muted {
  overflow-wrap: anywhere;
}

.admin-rail__footer .eyebrow {
  margin-bottom: 2px;
  color: rgba(245, 241, 231, 0.62);
}

.admin-workspace {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
}

.admin-utility {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  min-width: 0;
  padding-top: max(18px, var(--safe-top));
  padding-right: max(32px, var(--safe-right));
  padding-bottom: 18px;
  padding-left: max(32px, var(--safe-left));
  background: rgba(247, 244, 237, 0.85);
  border-bottom: 1px solid rgba(23, 32, 23, 0.08);
  backdrop-filter: blur(18px);
}

.admin-utility__title {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.admin-utility__title .eyebrow {
  margin-bottom: 0;
}

.admin-utility__title strong {
  font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  font-size: 1.2rem;
  letter-spacing: -0.02em;
}

.admin-utility__actions {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.admin-current-project {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  max-width: min(280px, 34vw);
  border-color: #cce1d1;
  background: #edf6ef;
  color: var(--brand);
}

.admin-current-project__copy {
  display: grid;
  gap: 1px;
  min-width: 0;
  text-align: left;
}

.admin-current-project__copy span {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.admin-current-project__copy strong {
  min-width: 0;
  overflow: hidden;
  color: var(--brand);
  font-size: 0.9rem;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.run-as-form--admin .run-as-trigger {
  background: rgba(255, 255, 255, 0.7);
}

.admin-user-pill {
  display: flex;
  gap: 10px;
  align-items: center;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
}

.admin-user-pill__copy {
  display: grid;
  gap: 2px;
}

.admin-user-pill__copy > span {
  font-weight: 800;
}

.admin-user-pill__copy small {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 700;
}

.viewing-pill {
  display: inline-grid;
  gap: 2px;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 14px;
  background: rgba(255, 248, 232, 0.9);
}

.viewing-pill span {
  color: #76530d;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.viewing-pill strong {
  font-size: 0.94rem;
}

.viewing-pill small {
  color: #76530d;
  font-size: 0.78rem;
  font-weight: 700;
}

.admin-body .icon-button {
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
}

.admin-page-head,
.admin-page-actions,
.admin-kpi-grid,
.admin-dashboard-card-grid,
.admin-dashboard-wide-grid,
.admin-layout,
.admin-main-stack,
.admin-side-panel,
.admin-side-card,
.admin-settings-grid,
.admin-filter-panel__grid,
.admin-filter-panel__footer,
.project-ops-list,
.project-ops-row,
.project-ops-row__identity,
.project-ops-row__actions,
.project-ops-row__detail,
.admin-surface__head,
.admin-drawer__head,
.admin-drawer__footer {
  min-width: 0;
}

.admin-page-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-end;
  margin-bottom: 20px;
}

.admin-page-head h1 {
  margin-bottom: 8px;
  font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  font-size: clamp(3.15rem, 5vw, 4.8rem);
  line-height: 0.92;
  letter-spacing: -0.04em;
}

.admin-page-head .muted {
  max-width: 760px;
  font-size: 1.04rem;
}

.admin-page-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
}

.admin-page-actions .button,
.admin-page-actions button {
  min-height: 46px;
  padding-inline: 16px;
  border-radius: 14px;
}

.admin-page-actions__create-shortcut {
  display: none;
}

.button-quiet {
  background: #f4efe4;
}

.button-destructive-quiet {
  background: #fff3ef;
  color: #8a3824;
}

.admin-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.admin-kpi-card {
  display: grid;
  gap: 8px;
  padding: 18px 20px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 18px 38px rgba(23, 32, 23, 0.08);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.admin-kpi-card > span,
.admin-kpi-card__main-link > span,
.admin-kpi-card > small {
  color: var(--muted);
}

.admin-kpi-card > span,
.admin-kpi-card__main-link > span {
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-kpi-card strong,
.admin-kpi-card__main-link strong {
  font-size: clamp(1.7rem, 2.5vw, 2.45rem);
  line-height: 1;
}

.admin-kpi-card > small {
  font-size: 0.86rem;
  font-weight: 700;
}
.admin-kpi-card--link {
  color: inherit;
  text-decoration: none;
}
.admin-kpi-card__main-link {
  display: grid;
  gap: 8px;
  color: inherit;
  text-decoration: none;
}
.admin-kpi-card__main-link:focus-visible {
  border-radius: 8px;
  outline: 3px solid rgba(36, 51, 38, 0.18);
  outline-offset: 4px;
}
.admin-kpi-card--link:hover,
.admin-kpi-card--link:focus-visible,
.admin-kpi-card--interactive:hover,
.admin-kpi-card--interactive:focus-within {
  border-color: rgba(23, 32, 23, 0.16);
  box-shadow: 0 22px 44px rgba(23, 32, 23, 0.12);
  transform: translateY(-1px);
  outline: none;
}
.admin-kpi-card--compact strong {
  font-size: clamp(1.45rem, 2vw, 1.95rem);
  line-height: 1.04;
}
.admin-kpi-card--compact small {
  font-size: 0.8rem;
}
.admin-kpi-avatar-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.admin-kpi-avatar {
  --avatar-size: 34px;
  box-shadow: 0 10px 22px rgba(23, 32, 23, 0.08);
}
.admin-kpi-avatar--link {
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}
.admin-kpi-avatar--link:hover,
.admin-kpi-avatar--link:focus-visible {
  border-color: var(--accent);
  box-shadow: 0 12px 26px rgba(23, 32, 23, 0.16);
  outline: none;
  transform: translateY(-1px);
}

.chat-page-head {
  align-items: center;
}

.chat-page-head .admin-page-actions {
  flex: 0 0 auto;
}

.chat-page-head h1 {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: clamp(2.45rem, 5vw, 4.1rem);
  line-height: 0.95;
}

.chat-compose-shortcut {
  display: inline-grid;
  place-items: center;
  width: 46px;
  min-width: 46px;
  height: 46px;
  min-height: 46px;
  padding: 0;
  border-radius: 50%;
  font-size: 1.45rem;
  line-height: 1;
}

.chat-shell {
  display: grid;
  grid-template-columns: minmax(330px, 0.42fr) minmax(0, 1fr);
  gap: 18px;
  align-items: stretch;
}

.chat-sidebar {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
}

.chat-people-strip {
  display: flex;
  gap: 18px;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  padding: 2px 2px 10px;
}

.chat-person-shortcut {
  flex: 0 0 76px;
  margin: 0;
}

.chat-person-shortcut button {
  display: grid;
  gap: 7px;
  justify-items: center;
  width: 100%;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.12;
  text-align: center;
}

.chat-person-shortcut button:hover,
.chat-person-shortcut button:focus-visible {
  color: var(--ink);
  transform: translateY(-1px);
}

.chat-person-shortcut button > span:last-child {
  max-width: 76px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-avatar {
  --chat-avatar-size: 48px;
  display: inline-grid;
  place-items: center;
  width: var(--chat-avatar-size);
  height: var(--chat-avatar-size);
  overflow: hidden;
  border-radius: 50%;
  background: #9aa9cf;
  color: #fff;
  font-weight: 900;
  line-height: 1;
  box-shadow: inset 0 -12px 22px rgba(36, 51, 38, 0.12);
}

.chat-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.chat-avatar--xl {
  --chat-avatar-size: 72px;
  font-size: 1.65rem;
}

.chat-avatar--sm {
  --chat-avatar-size: 46px;
  font-size: 1rem;
}

.chat-avatar--thread {
  --chat-avatar-size: 42px;
  font-size: 0.98rem;
}

.chat-search-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.chat-search-form input[type="search"] {
  min-height: 44px;
  border: 0;
  border-radius: 999px;
  background: #eceeea;
  box-shadow: inset 0 0 0 1px rgba(23, 32, 23, 0.05);
}

.chat-search-form .admin-toolbar__actions {
  display: flex;
  gap: 8px;
}

.chat-search-form .button,
.chat-search-form button {
  min-height: 44px;
  border-radius: 999px;
}

.chat-conversation-list,
.chat-message-list {
  display: grid;
  min-width: 0;
}

.chat-conversation-list {
  gap: 0;
  overflow: hidden;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 18px 38px rgba(23, 32, 23, 0.08);
}

.chat-conversation {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 12px 12px 12px 14px;
  border: 0;
  border-bottom: 1px solid rgba(23, 32, 23, 0.08);
  background: transparent;
  color: inherit;
  text-decoration: none;
  transition: background-color 160ms ease, transform 160ms ease;
}

.chat-conversation:last-child {
  border-bottom: 0;
}

.chat-conversation:hover,
.chat-conversation.is-active {
  background: #f4f6f2;
}

.chat-conversation:active {
  transform: scale(0.995);
}

.chat-conversation.is-active .chat-avatar {
  box-shadow:
    0 0 0 3px rgba(47, 111, 72, 0.16),
    inset 0 -12px 22px rgba(36, 51, 38, 0.12);
}

.chat-conversation__content {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.chat-conversation__topline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: baseline;
  min-width: 0;
}

.chat-conversation strong,
.chat-conversation time,
.chat-conversation__preview {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-conversation time,
.chat-conversation small,
.chat-conversation__preview,
.chat-conversation__chevron {
  color: var(--muted);
  font-size: 0.84rem;
}

.chat-conversation small {
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.chat-conversation__chevron {
  font-size: 1.6rem;
  line-height: 1;
}

.chat-new-chat {
  padding: 0;
  overflow: hidden;
}

.chat-new-chat summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 48px;
  padding: 12px 14px;
  color: var(--brand);
  cursor: pointer;
  font-weight: 900;
  list-style: none;
}

.chat-new-chat summary::-webkit-details-marker {
  display: none;
}

.chat-new-chat summary span:last-child {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #edf3ee;
  color: var(--brand);
  font-size: 1.2rem;
}

.chat-new-chat form {
  padding: 0 14px 14px;
}

.chat-people-picker {
  display: grid;
  gap: 8px;
  max-height: 300px;
  overflow: auto;
  padding: 0;
  border: 0;
}

.chat-people-picker legend {
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.chat-people-picker label {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
}

.chat-people-picker input {
  width: 18px;
  height: 18px;
}

.chat-people-picker span:last-child {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.chat-people-picker strong,
.chat-people-picker small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-people-picker small {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.chat-thread {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 0;
  min-width: 0;
  max-height: min(76dvh, 820px);
  overflow: hidden;
  padding: 0;
  border-radius: 28px;
  background: #fff;
}

.chat-thread__head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 16px 18px;
  border-bottom: 1px solid rgba(23, 32, 23, 0.08);
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(14px);
}

.chat-thread__back {
  display: none;
}

.chat-thread__head > div {
  min-width: 0;
}

.chat-thread__head h2 {
  margin: 0 0 2px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: clamp(1.35rem, 2vw, 1.85rem);
  line-height: 1.08;
}

.chat-message-list {
  overflow: auto;
  align-content: end;
  gap: 8px;
  padding: 18px;
  background:
    radial-gradient(circle at 50% 0, rgba(235, 239, 232, 0.9), rgba(255, 255, 255, 0) 310px),
    #fff;
}

.chat-message {
  display: grid;
  gap: 5px;
  justify-self: start;
  width: fit-content;
  max-width: min(680px, 76%);
  padding: 10px 13px;
  border: 0;
  border-radius: 19px 19px 19px 6px;
  background: #e9e9eb;
  color: #161b16;
}

.chat-message--mine {
  justify-self: end;
  border-radius: 19px 19px 6px 19px;
  background: #243326;
  color: #fff;
}

.chat-message--target {
  outline: 3px solid rgba(184, 92, 56, 0.35);
  outline-offset: 3px;
}

.chat-message header {
  display: flex;
  gap: 8px;
  align-items: baseline;
  justify-content: space-between;
  min-width: 0;
}

.chat-message header strong,
.chat-message header time {
  min-width: 0;
}

.chat-message header time {
  color: color-mix(in srgb, currentColor 58%, transparent);
  font-size: 0.7rem;
  font-weight: 800;
  white-space: nowrap;
}

.chat-message p {
  margin: 0;
  overflow-wrap: anywhere;
}

.chat-attachment-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(104px, 1fr));
  gap: 6px;
  overflow: hidden;
  border-radius: 14px;
}

.chat-attachment-grid a {
  display: block;
  min-width: 0;
  aspect-ratio: 1;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.24);
}

.chat-attachment-grid img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.chat-location-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  min-width: min(260px, 100%);
  padding: 10px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
  color: var(--ink);
  text-decoration: none;
}

.chat-message--mine .chat-location-card {
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.13);
  color: #fff;
}

.chat-location-card__pin {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  font-weight: 900;
}

.chat-location-card strong,
.chat-location-card small {
  display: block;
  min-width: 0;
}

.chat-location-card small {
  color: color-mix(in srgb, currentColor 72%, transparent);
  font-size: 0.78rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.chat-project-links,
.chat-project-mention-panel {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}

.chat-project-links a,
.chat-project-mention-panel button {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.76);
  color: var(--brand);
  font-size: 0.8rem;
  font-weight: 900;
  text-decoration: none;
}

.chat-project-mention-panel {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  max-height: 112px;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 0 2px;
  transition: max-height 180ms ease, opacity 180ms ease;
}

.chat-project-mention-panel.is-collapsed {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
}

.chat-project-mention-panel button[hidden] {
  display: none;
}

.chat-compose {
  display: grid;
  gap: 8px;
  padding: 12px 14px max(12px, var(--safe-bottom));
  border-top: 1px solid rgba(23, 32, 23, 0.08);
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(14px);
}

.chat-compose__tools {
  display: flex;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.chat-compose__tools:empty {
  display: none;
}

.chat-compose__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
  min-width: 0;
}

.chat-compose textarea {
  width: 100%;
  min-height: 42px;
  max-height: 132px;
  padding: 10px 14px;
  border: 1px solid rgba(23, 32, 23, 0.12);
  border-radius: 21px;
  background: #fff;
  font-size: 16px;
  line-height: 1.25;
  resize: none;
  appearance: none;
}

.chat-compose__input {
  flex: 1 1 auto;
  min-width: 0;
}

.chat-compose__tool,
.chat-compose__send {
  display: inline-grid;
  place-items: center;
  width: 38px;
  min-width: 38px;
  height: 38px;
  min-height: 38px;
  padding: 0;
  border-radius: 50%;
  font-size: 1.05rem;
  line-height: 1;
}

.chat-compose__tool {
  background: #eef0ec;
  color: var(--brand);
}

.chat-compose__send {
  border-color: var(--brand);
  background: var(--brand);
  color: #fff;
}

.chat-compose__attachments {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  min-width: 0;
}

.chat-compose__attachments[hidden] {
  display: none;
}

.chat-compose__chip {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  min-height: 30px;
  max-width: 100%;
  padding: 5px 8px;
  border: 1px solid rgba(23, 32, 23, 0.1);
  border-radius: 999px;
  background: #f7f5ee;
  color: var(--brand);
  font-size: 0.8rem;
  font-weight: 900;
}

.chat-compose__chip button {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  min-height: 20px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(23, 32, 23, 0.08);
  color: inherit;
  line-height: 1;
}

.chat-compose__status {
  margin: 0;
  padding: 7px 9px;
  font-size: 0.78rem;
}

.chat-compose__actions {
  display: flex;
  justify-content: flex-end;
}

.chat-search-results {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 16px;
  background: #f8f6ef;
}

.chat-search-results h3 {
  margin: 0;
  font-size: 1rem;
}

.chat-search-results a {
  display: grid;
  gap: 2px;
  padding: 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.74);
  color: inherit;
  text-decoration: none;
}

.chat-search-results span,
.chat-search-results em {
  color: var(--muted);
  font-size: 0.82rem;
}

.chat-search-results em {
  font-style: normal;
}

.chat-empty-state {
  margin: 0;
}

.admin-dashboard-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.admin-dashboard-card {
  display: grid;
  gap: 14px;
  align-content: space-between;
  min-height: 172px;
}

.admin-dashboard-card > div {
  display: grid;
  gap: 6px;
}

.admin-dashboard-card h2 {
  margin-bottom: 0;
  font-size: clamp(1.2rem, 1.8vw, 1.6rem);
  letter-spacing: -0.03em;
}

.admin-dashboard-card .button,
.admin-side-card--shortcut .button {
  min-height: 36px;
  padding: 8px 12px;
  justify-self: start;
}

.admin-dashboard-wide-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(300px, 0.75fr);
  gap: 20px;
  align-items: start;
}

.admin-dashboard-activity-list {
  display: grid;
  gap: 10px;
}

.admin-dashboard-activity-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px solid rgba(23, 32, 23, 0.08);
}

.admin-dashboard-activity-row:last-child {
  border-bottom: 0;
}

.admin-dashboard-activity-row h3 {
  margin: 7px 0 3px;
  font-size: 1rem;
}

.admin-dashboard-activity-row time {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 800;
}
.admin-dashboard-feed__footer {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(23, 32, 23, 0.08);
}
.admin-dashboard-feed__footer .muted {
  margin: 0;
  font-size: 0.86rem;
  font-weight: 750;
}

.admin-dashboard-split-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.admin-dashboard-comment-feed {
  gap: 16px;
}

.admin-dashboard-comment-list {
  display: grid;
  gap: 12px;
}

.admin-dashboard-comment-card {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.76);
}

.admin-dashboard-comment-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.admin-dashboard-comment-head h3 {
  margin: 8px 0 4px;
  font-size: 1.12rem;
}

.admin-dashboard-comment-head .muted {
  margin-bottom: 0;
}

.admin-dashboard-comment-head time {
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 800;
  white-space: nowrap;
}

.admin-dashboard-comment-author {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.admin-dashboard-comment-actions {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.admin-dashboard-comment-actions form {
  margin: 0;
}

.admin-dashboard-comment-actions .button,
.admin-dashboard-comment-actions button {
  min-height: 36px;
  padding: 8px 12px;
}

.admin-dashboard-comment-reply {
  display: grid;
}

.admin-dashboard-comment-reply[open] {
  gap: 8px;
}

.admin-dashboard-comment-reply > summary {
  list-style: none;
}

.admin-dashboard-comment-reply > summary::-webkit-details-marker {
  display: none;
}

.admin-dashboard-comment-reply .note-thread__reply-form {
  width: min(100%, 520px);
}

.note-thread-list--dashboard {
  max-width: none;
}

.note-thread-list--dashboard .note-thread,
.note-thread-list--dashboard .note-thread__reply {
  padding-inline: 0;
}

.admin-side-card--shortcut {
  gap: 14px;
}

.admin-side-card--shortcut .muted {
  margin-bottom: 0;
}

.admin-side-card--shortcut .admin-dashboard-split-actions {
  gap: 8px;
}

.admin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.75fr) minmax(320px, 0.95fr);
  gap: 20px;
  align-items: start;
}

.admin-layout--report {
  grid-template-columns: minmax(340px, 0.85fr) minmax(0, 1.65fr);
}

.admin-layout--projects {
  grid-template-columns: minmax(0, 1.95fr) minmax(280px, 0.72fr);
}

.admin-layout--projects .admin-side-panel {
  margin-top: 64px;
  top: 164px;
}

.admin-layout--projects .admin-toolbar {
  grid-template-columns: minmax(0, 1fr) minmax(140px, 0.45fr) minmax(140px, 0.45fr) auto;
}

.admin-layout--projects .admin-toolbar__intro {
  grid-column: 1 / -1;
  display: flex;
  gap: 12px;
  align-items: baseline;
  flex-wrap: wrap;
}

.admin-main-stack {
  display: grid;
  gap: 16px;
}

.admin-side-panel {
  position: sticky;
  top: 100px;
}

.admin-side-panel--wide {
  top: 100px;
}

.admin-card,
.admin-surface,
.admin-side-card {
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 22px 46px rgba(23, 32, 23, 0.08);
}

.admin-card,
.admin-side-card,
.admin-surface {
  padding: 22px;
}

.admin-surface--flush {
  padding: 0;
  overflow: hidden;
}

.admin-surface__head,
.admin-side-card__head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-end;
  margin-bottom: 18px;
}

.admin-page-head > div,
.admin-surface__head > div,
.admin-side-card__head > div,
.admin-drawer__head > div {
  min-width: 0;
  flex: 1 1 auto;
}

.admin-surface--flush .admin-surface__head {
  padding: 22px 22px 0;
}

.admin-surface__head h2,
.admin-side-card__head h2,
.admin-drawer__head h2,
.project-ops-row h3 {
  margin-bottom: 0;
  font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  font-size: clamp(1.55rem, 2vw, 2rem);
  line-height: 1.02;
  letter-spacing: -0.03em;
}

.admin-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, auto) minmax(240px, 1.25fr) repeat(2, minmax(160px, 0.5fr)) auto;
  gap: 12px;
  align-items: end;
  padding: 16px 18px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 16px 34px rgba(23, 32, 23, 0.06);
  backdrop-filter: blur(14px);
}

.admin-toolbar.admin-toolbar--photo-review {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.admin-toolbar--sticky {
  position: sticky;
  top: 98px;
  z-index: 8;
}

.admin-toolbar__intro {
  display: grid;
  gap: 2px;
}

.admin-toolbar__intro strong {
  font-size: 1.15rem;
}

.admin-toolbar__intro small {
  color: var(--muted);
  font-weight: 700;
}

.admin-toolbar label {
  gap: 4px;
  font-size: 0.79rem;
}

.admin-toolbar input,
.admin-toolbar select {
  min-height: 44px;
  border-radius: 14px;
}

.admin-toolbar__actions {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.admin-toolbar__actions .button,
.admin-toolbar__actions button {
  min-height: 44px;
}

.admin-filter-deck {
  display: grid;
  gap: 18px;
}

.admin-filter-deck--sticky {
  position: sticky;
  top: 98px;
  z-index: 8;
}

.admin-filter-deck__section {
  display: grid;
  gap: 10px;
}

.admin-filter-deck__head {
  display: flex;
  gap: 10px;
  align-items: baseline;
  flex-wrap: wrap;
}

.admin-filter-deck__head .eyebrow {
  margin: 0;
}

.admin-filter-deck__head strong {
  font-size: 1rem;
}

.filter-chip-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.filter-chip {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  color: inherit;
  font-size: 0.86rem;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 0 10px 22px rgba(23, 32, 23, 0.05);
}

.filter-chip strong {
  font-size: 0.78rem;
  color: var(--muted);
}

.filter-chip__label--short,
.admin-mobile-search {
  display: none;
}

.filter-chip.is-active {
  border-color: rgba(23, 32, 23, 0.18);
  background: #243326;
  color: #fff;
}

.filter-chip.is-active strong {
  color: rgba(255, 255, 255, 0.76);
}

.filter-chip--company {
  min-width: 0;
}

.filter-chip__mark {
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  object-fit: contain;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 6px;
  background: white;
}

.admin-toolbar--compact {
  position: static;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.admin-toolbar--compact label {
  gap: 6px;
}

.admin-toolbar--compact input {
  min-height: 48px;
}

.project-ops-list {
  display: grid;
}

.project-ops-row {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(170px, 0.8fr) minmax(120px, 0.55fr) minmax(100px, 0.38fr) minmax(230px, 0.82fr);
  gap: 14px;
  align-items: center;
  padding: 18px 22px;
  border-top: 1px solid rgba(23, 32, 23, 0.08);
}

.project-ops-row--project {
  position: relative;
  grid-template-columns: minmax(0, 1.25fr) minmax(250px, 0.95fr) auto;
}

.project-ops-row--project::before {
  content: "";
  position: absolute;
  inset: 14px auto 14px 0;
  width: 4px;
  border-radius: 999px;
  background: var(--company-bg, #eef1ea);
  opacity: 0.9;
}

.project-ops-list .project-ops-row:first-child {
  border-top: 0;
}

.project-ops-row--user {
  grid-template-columns: minmax(0, 1.25fr) minmax(120px, 0.45fr) minmax(130px, 0.45fr) minmax(100px, 0.35fr) minmax(120px, 0.35fr);
}

.project-ops-row--user-payroll {
  grid-template-columns: minmax(0, 1.25fr) minmax(110px, 0.4fr) minmax(115px, 0.42fr) minmax(130px, 0.45fr) minmax(100px, 0.35fr) minmax(120px, 0.35fr);
}

.project-ops-row--invite {
  grid-template-columns: minmax(0, 1.25fr) minmax(120px, 0.45fr) minmax(140px, 0.5fr) minmax(130px, 0.45fr) minmax(120px, 0.35fr);
}

.project-ops-row__identity {
  display: grid;
  gap: 10px;
}

.project-ops-row__company {
  width: fit-content;
  max-width: 100%;
}

.project-ops-row__identity .muted {
  margin-bottom: 0;
  max-width: 44ch;
}

.project-ops-row__detail {
  display: grid;
  gap: 4px;
}

.project-ops-row__meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: center;
}

.project-ops-row__detail span {
  color: var(--muted);
  font-size: 0.73rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.project-ops-row__detail strong {
  font-size: 0.96rem;
  overflow-wrap: anywhere;
}

.project-ops-row__status {
  justify-self: start;
}

.project-ops-row__actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
}

.project-ops-row__actions form {
  margin: 0;
}

.project-ops-row__actions .button,
.project-ops-row__actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  text-align: center;
}

.project-ops-row__actions .primary {
  min-width: 88px;
}

.admin-filter-panel {
  gap: 18px;
}

.admin-filter-panel__grid {
  display: grid;
  gap: 12px;
}

.admin-filter-panel__grid label {
  gap: 5px;
}

.admin-filter-panel__grid input,
.admin-filter-panel__grid select {
  min-height: 44px;
  border-radius: 14px;
}

.admin-filter-panel__footer {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.admin-layout--notices {
  grid-template-columns: minmax(320px, 0.52fr) minmax(0, 1fr);
  align-items: start;
}
.notice-compose-card {
  gap: 16px;
}
.notice-compose-card textarea {
  min-height: 120px;
  resize: vertical;
}
.notice-date-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.notice-audience-fieldset {
  display: grid;
  gap: 12px;
  min-width: 0;
  margin: 0;
  padding: 14px;
  border: 1px solid rgba(23, 32, 23, 0.1);
  border-radius: 8px;
}
.notice-audience-fieldset legend {
  padding: 0 6px;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.notice-audience-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.notice-audience-options label,
.notice-recipient-choice {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  font-size: 0.9rem;
  font-weight: 800;
}
.notice-audience-options input,
.notice-recipient-choice input {
  width: auto;
  min-height: 0;
}
.notice-recipient-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 8px;
  max-height: 240px;
  overflow: auto;
  padding: 4px;
}
.notice-recipient-choice {
  align-items: flex-start;
  padding: 10px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}
.notice-recipient-choice span {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.notice-recipient-choice strong,
.notice-recipient-choice small {
  overflow-wrap: anywhere;
}
.notice-recipient-choice small {
  color: var(--muted);
}
.admin-notice-list {
  display: grid;
}
.admin-notice-row {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(240px, 0.8fr) auto;
  gap: 16px;
  align-items: center;
  padding: 18px 22px;
  border-top: 1px solid rgba(23, 32, 23, 0.08);
}
.admin-notice-list .admin-notice-row:first-child {
  border-top: 0;
}
.admin-notice-row__main {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.admin-notice-row__badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.admin-notice-row h3 {
  margin: 0;
  font-size: 1.2rem;
  line-height: 1.12;
}
.admin-notice-row p {
  margin: 0;
  overflow-wrap: anywhere;
}
.admin-notice-row__meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.admin-filter-panel__footer small {
  color: var(--muted);
  font-weight: 700;
}

.payroll-period--feature {
  gap: 8px;
  padding: 10px 12px 12px;
  border-radius: 20px;
  background: linear-gradient(180deg, #f6f0e1 0%, #fbf8f1 100%);
  border-color: rgba(181, 95, 49, 0.18);
}
.payroll-period--feature legend {
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}
.payroll-period--feature > p {
  font-size: 0.9rem;
}

.admin-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.table-wrap--dense {
  border-radius: 18px;
  box-shadow: none;
}

.table-wrap--dense table {
  min-width: 720px;
}

.table-wrap--dense th,
.table-wrap--dense td {
  padding: 13px 14px;
}

.table-wrap--dense td strong {
  display: block;
}

.table-wrap--dense td small {
  display: block;
  margin-top: 4px;
}

.admin-drawer {
  position: fixed;
  inset: 0;
  z-index: 40;
}

.admin-drawer__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(18, 26, 20, 0.38);
  cursor: pointer;
}

.admin-drawer__panel {
  position: absolute;
  top: 0;
  right: 0;
  width: min(540px, 100vw);
  height: 100vh;
  padding: 28px;
  overflow-y: auto;
  background: #fbf8f2;
  border-left: 1px solid rgba(23, 32, 23, 0.08);
  box-shadow: -24px 0 60px rgba(12, 18, 14, 0.18);
}

.admin-modal .admin-drawer__panel {
  inset: 50% auto auto 50%;
  width: min(720px, calc(100vw - 32px));
  max-height: min(760px, calc(100vh - 32px));
  height: auto;
  padding: 28px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 24px;
  transform: translate(-50%, -50%);
  box-shadow: 0 28px 70px rgba(12, 18, 14, 0.22);
}

.admin-drawer__head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  margin-bottom: 18px;
}

.admin-drawer__close {
  width: 44px;
  min-height: 44px;
  font-size: 1.5rem;
  line-height: 1;
}

.admin-drawer__form {
  gap: 14px;
}

.admin-drawer__footer {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  padding-top: 6px;
}

.admin-drawer__footer .button,
.admin-drawer__footer button {
  min-height: 44px;
}

.run-as-modal__intro {
  margin: 8px 0 0;
}

.run-as-modal__return {
  margin: 0 0 18px;
}

.run-as-modal__return .button,
.run-as-modal__return button {
  min-height: 44px;
}

.run-as-tabs {
  margin-bottom: 18px;
}

.run-as-panel {
  outline: none;
}

.run-as-user-list {
  display: grid;
  gap: 12px;
}

.run-as-user-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px 16px;
  align-items: center;
  padding: 16px;
  border: 1px solid rgba(23, 32, 23, 0.08);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.76);
}

.run-as-user-row.is-current {
  border-color: rgba(181, 95, 49, 0.36);
  background: rgba(255, 248, 232, 0.92);
}

.run-as-user-main {
  min-width: 0;
}

.run-as-user-main strong {
  display: block;
  margin-bottom: 4px;
  font-size: 1.02rem;
}

.run-as-user-main .muted {
  margin: 0;
  overflow-wrap: anywhere;
}

.run-as-user-meta {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.run-as-user-action {
  margin: 0;
}

.run-as-user-action .button,
.run-as-user-action button {
  min-height: 38px;
  white-space: nowrap;
}

.run-as-user-empty {
  margin: 0;
}

body.has-admin-drawer {
  overflow: hidden;
}

.admin-body .flash {
  margin-bottom: 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.92);
}

.admin-body .count-pill {
  min-height: 36px;
  padding-inline: 12px;
  border-radius: 999px;
}

.admin-body .company-admin-list {
  gap: 14px;
}

.admin-body .company-admin-item {
  border-radius: 22px;
  box-shadow: 0 18px 36px rgba(23, 32, 23, 0.08);
}

@media (max-width: 1280px) {
  .admin-shell {
    grid-template-columns: 236px minmax(0, 1fr);
  }

  .admin-body .page,
  .admin-utility {
    padding-left: 24px;
    padding-right: 24px;
  }

  .admin-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-dashboard-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-layout,
  .admin-dashboard-wide-grid,
  .admin-layout--report {
    grid-template-columns: 1fr;
  }

  .admin-side-panel,
  .admin-side-panel--wide,
  .admin-toolbar--sticky {
    position: static;
  }

  .admin-settings-grid {
    grid-template-columns: 1fr;
  }

  .admin-page-actions__create-shortcut {
    display: inline-flex;
  }

  .admin-filter-deck--sticky {
    position: static;
  }
}

@media (max-width: 1100px) {
  .chat-shell {
    grid-template-columns: 1fr;
  }

  .chat-message-list {
    max-height: none;
  }

  .admin-photo-review {
    grid-template-columns: 1fr;
  }

  .photo-review-catchupbar {
    top: 86px;
  }

  .photo-review-card {
    grid-template-columns: 1fr;
  }

  .photo-review-rail {
    position: static;
    grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
    max-height: none;
    overflow: visible;
  }

  .project-ops-row,
  .project-ops-row--user,
  .admin-notice-row,
  .admin-toolbar {
    grid-template-columns: 1fr;
  }

  .admin-toolbar.admin-toolbar--photo-review {
    grid-template-columns: 1fr;
  }

  .account-settings-grid,
  .account-notification-grid,
  .account-form-grid,
  .account-photo-editor__workspace {
    grid-template-columns: 1fr;
  }

  .account-details-card,
  .account-password-card {
    grid-column: auto;
    grid-row: auto;
  }

  .account-notification-card {
    grid-column: auto;
  }

  .account-photo-editor__stage {
    width: clamp(260px, calc(100vw - 72px), 360px);
    max-width: 100%;
    height: clamp(260px, calc(100vw - 72px), 360px);
    margin: 0 auto;
  }

  .project-ops-row__meta,
  .admin-notice-row__meta {
    grid-template-columns: 1fr;
  }

  .project-ops-row__actions {
    justify-content: flex-start;
  }
}

@media (max-width: 900px) {
  .admin-shell {
    grid-template-columns: 1fr;
  }

  .admin-rail {
    position: static;
    min-height: 0;
    padding-bottom: 18px;
  }

  .admin-rail__toggle {
    display: none;
  }

  .admin-rail__nav {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }
}

@media (max-width: 760px) {
  .admin-rail {
    display: none;
  }
  .admin-body .page,
  .admin-utility {
    padding: 18px 16px 26px;
  }

  .admin-page-head,
  .admin-page-actions,
  .admin-filter-deck__head,
  .admin-surface__head,
  .admin-side-card__head,
  .admin-drawer__footer {
    grid-template-columns: 1fr;
    display: grid;
    justify-content: stretch;
  }

  .admin-utility {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 10px;
    align-items: start;
    padding-top: max(10px, var(--safe-top));
    padding-right: max(14px, var(--safe-right));
    padding-bottom: 12px;
    padding-left: max(14px, var(--safe-left));
    background: rgba(255, 255, 255, 0.92);
  }

  .admin-utility__actions {
    display: contents;
  }

  .admin-utility__actions > :not(.mobile-menu):not(.run-as-form) {
    display: none;
  }

  .admin-settings-tabs a[data-admin-tab="account-settings"] {
    order: 1;
  }

  .admin-settings-tabs a[data-admin-tab="notification-settings"] {
    order: 2;
  }

  .admin-settings-tabs a[data-admin-tab="branding-settings"] {
    order: 3;
  }

  .admin-settings-tabs a[data-admin-tab="payroll-settings"] {
    order: 4;
  }

  .admin-settings-tabs a[data-admin-tab="integrations-settings"] {
    order: 5;
  }

  .admin-utility__actions .mobile-menu {
    grid-column: 2;
    grid-row: 1;
    align-self: flex-end;
    justify-self: end;
  }

  .admin-utility__actions .run-as-form {
    grid-column: 1 / -1;
    grid-row: 2;
    display: block;
    width: 100%;
  }

  .admin-utility__actions .run-as-form .run-as-trigger {
    width: 100%;
  }

  .admin-utility__title strong {
    font-size: 1.05rem;
    line-height: 1.08;
  }

  body.is-mobile-header-collapsed .topbar__utilities .run-as-form,
  body.is-mobile-header-collapsed .admin-utility__actions .run-as-form {
    display: none;
  }

  .admin-page-actions,
  .filter-chip-row,
  .admin-toolbar__actions,
  .project-ops-row__actions,
  .admin-notice-row .project-ops-row__actions,
  .admin-filter-panel__footer,
  .admin-dashboard-comment-actions {
    justify-content: stretch;
  }

  .admin-dashboard-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-kpi-grid {
    grid-template-columns: 1fr;
  }

  .admin-dashboard-activity-row {
    display: grid;
  }

  .admin-dashboard-comment-head {
    display: grid;
  }

  .run-as-user-row {
    grid-template-columns: 1fr;
  }

  .run-as-user-meta {
    justify-content: flex-start;
  }

  .run-as-modal__return .button,
  .run-as-modal__return button,
  .run-as-user-action .button,
  .run-as-user-action button {
    width: 100%;
  }

  .admin-page-actions .button,
  .admin-page-actions button,
  .filter-chip,
  .admin-toolbar__actions .button,
  .admin-toolbar__actions button,
  .project-ops-row__actions .button,
  .project-ops-row__actions button,
  .project-ops-row__actions form,
  .project-ops-row__actions form button,
  .admin-notice-row .project-ops-row__actions .button,
  .admin-notice-row .project-ops-row__actions button,
  .admin-notice-row .project-ops-row__actions form,
  .admin-notice-row .project-ops-row__actions form button,
  .admin-dashboard-comment-actions .button,
  .admin-dashboard-comment-actions button,
  .admin-dashboard-comment-actions form,
  .admin-dashboard-comment-actions form button,
  .admin-dashboard-comment-actions details,
  .admin-filter-panel__footer .button,
  .admin-filter-panel__footer button {
    width: 100%;
  }

  .admin-page-actions .button,
  .admin-page-actions button,
  .filter-chip,
  .admin-toolbar__actions .button,
  .admin-toolbar__actions button,
  .project-ops-row__actions .button,
  .project-ops-row__actions button,
  .project-ops-row__actions form button,
  .admin-notice-row .project-ops-row__actions .button,
  .admin-notice-row .project-ops-row__actions button,
  .admin-notice-row .project-ops-row__actions form button,
  .admin-dashboard-comment-actions .button,
  .admin-dashboard-comment-actions button,
  .admin-dashboard-comment-actions form button,
  .admin-filter-panel__footer .button,
  .admin-filter-panel__footer button,
  .admin-drawer__footer .button,
  .admin-drawer__footer button,
  .run-as-modal__return .button,
  .run-as-modal__return button,
  .run-as-user-action .button,
  .run-as-user-action button,
  .photo-review-controls button,
  .photo-review-links .link-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
  }

  .admin-dashboard-card {
    min-height: 158px;
  }

  .admin-side-card--shortcut .admin-dashboard-split-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-toolbar--photo-review {
    grid-template-columns: 1fr;
  }

  .chat-page-head {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }

  body[data-view="chat"] {
    overflow-x: hidden;
    overscroll-behavior-x: none;
  }

  body[data-view="chat"] .page {
    overflow-x: clip;
  }

  .chat-page-head.is-thread-selected {
    display: none;
  }

  .chat-page-head .admin-page-actions {
    display: flex;
    justify-content: flex-end;
    justify-self: end;
    width: auto;
  }

  .chat-page-head .admin-page-actions .chat-compose-shortcut {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    border-radius: 50%;
  }

  .chat-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .chat-shell {
    gap: 12px;
  }

  .chat-sidebar {
    display: contents;
  }

  .chat-shell.is-list-selected .chat-thread {
    display: none;
  }

  .chat-shell.is-thread-selected .chat-sidebar {
    display: none;
  }

  .chat-shell.is-thread-selected .chat-thread {
    display: grid;
    height: calc(100dvh - var(--chat-thread-offset, 152px));
    min-height: 0;
    margin-inline: -16px;
    border-inline: 0;
    border-radius: 0;
  }

  .chat-shell.is-thread-selected .chat-thread--empty {
    height: auto;
    min-height: 0;
  }

  .chat-people-strip {
    order: 1;
    margin-inline: -16px;
    padding: 2px 16px 10px;
  }

  .chat-person-shortcut {
    flex-basis: 72px;
  }

  .chat-avatar--xl {
    --chat-avatar-size: 64px;
    font-size: 1.42rem;
  }

  .chat-search-form {
    grid-template-columns: minmax(0, 1fr) auto;
    order: 2;
  }

  .chat-search-form--empty {
    grid-template-columns: minmax(0, 1fr);
  }

  .chat-search-form .admin-toolbar__actions {
    display: flex;
    justify-content: flex-end;
  }

  .chat-search-form.chat-search-form--empty .admin-toolbar__actions {
    display: none;
  }

  .chat-search-form .admin-toolbar__actions .button,
  .chat-search-form .admin-toolbar__actions button {
    width: auto;
    min-width: 0;
    padding-inline: 13px;
  }

  .chat-conversation-list {
    display: grid;
    margin-inline: -16px;
    border-inline: 0;
    border-radius: 0;
    box-shadow: none;
    order: 3;
  }

  .chat-conversation {
    padding-inline: 16px 10px;
  }

  .chat-thread {
    order: 4;
    max-height: none;
    border-radius: 22px;
  }

  .chat-new-chat {
    order: 5;
  }

  .chat-new-chat:not([open]):not(:target) {
    display: none;
  }

  .chat-thread__head {
    grid-template-columns: auto auto minmax(0, 1fr);
    gap: 10px;
    padding: 10px 14px;
  }

  .chat-thread__back {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(23, 32, 23, 0.08);
    border-radius: 50%;
    background: #fff;
    color: var(--ink);
    font-size: 1.8rem;
    line-height: 1;
    text-decoration: none;
  }

  .chat-thread__head h2 {
    font-size: 1.36rem;
  }

  .chat-thread__head .eyebrow {
    margin-bottom: 2px;
  }

  .chat-thread__head .muted {
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .chat-message-list {
    overflow: visible;
    padding: 14px;
  }

  .chat-shell.is-thread-selected .chat-message-list {
    align-content: start;
    overflow: auto;
    overscroll-behavior: contain;
    overflow-anchor: none;
  }

  .chat-shell.is-thread-selected.is-keyboard-docked .chat-message-list {
    padding-bottom: calc(var(--chat-compose-height, 112px) + 14px);
  }

  .chat-shell.is-thread-selected.is-keyboard-docked .chat-compose {
    position: fixed;
    right: 0;
    bottom: max(0px, var(--chat-keyboard-inset, 0px));
    left: 0;
    z-index: 80;
    box-shadow: 0 -10px 24px rgba(23, 32, 23, 0.08);
  }

  .chat-shell.is-thread-selected .chat-thread--empty .chat-message-list {
    overflow: visible;
  }

  .chat-message-list--empty {
    align-content: start;
    padding-block: 12px;
  }

  .chat-message-list--empty .chat-empty-state {
    width: 100%;
    padding: 12px 14px;
    border: 0;
    border-radius: 0;
    background: transparent;
  }

  .chat-message-list--empty .chat-empty-state h2 {
    margin-bottom: 2px;
    font-size: 1rem;
  }

  .chat-message-list--empty .chat-empty-state p {
    margin: 0;
    font-size: 0.92rem;
  }

  .chat-message {
    max-width: 88%;
  }

  .chat-message--mine {
    justify-self: end;
  }

  .chat-message header {
    flex-wrap: wrap;
  }

  .chat-people-picker {
    max-height: 220px;
  }

  .chat-project-mention-panel {
    display: flex;
    flex-wrap: wrap;
    max-height: min(32dvh, 168px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    padding: 0 0 2px;
  }

  .chat-project-mention-panel button {
    flex: 0 1 auto;
    max-width: 100%;
    white-space: normal;
  }

  .admin-photo-review {
    gap: 0;
    margin-inline: -16px;
    margin-bottom: max(12px, var(--safe-bottom));
  }

  .photo-review-stage {
    --photo-review-workspace: calc(100dvh - var(--sticky-menu-height) - 12px - max(10px, var(--safe-bottom)));
    gap: 8px;
    min-height: var(--photo-review-workspace);
  }

  @supports (height: 100svh) {
    .photo-review-stage {
      --photo-review-workspace: calc(100svh - var(--sticky-menu-height) - 12px - max(10px, var(--safe-bottom)));
    }
  }

  .photo-review-catchupbar {
    top: calc(var(--sticky-menu-height) + 8px);
    grid-template-columns: 38px minmax(0, 1fr) 38px;
    gap: 8px;
    min-height: 54px;
    margin-inline: 16px;
    padding: 7px;
    border-radius: 18px;
  }

  .photo-review-nav-button {
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
    border-radius: 13px;
  }

  .photo-review-progress {
    gap: 2px;
  }

  .photo-review-progress strong {
    font-size: 1.08rem;
  }

  .photo-review-progress span:not(.photo-review-progressbar) {
    font-size: 0.72rem;
  }

  .photo-review-progressbar {
    height: 3px;
    margin-top: 2px;
  }

  .photo-review-card {
    display: grid;
    grid-template-rows: minmax(220px, 44dvh) minmax(0, 1fr);
    height: calc(var(--photo-review-workspace) - 62px);
    min-height: 0;
    padding: 0;
    border-radius: 0;
    border-inline: 0;
  }

  .photo-review-image-shell {
    position: relative;
    min-height: 0;
    height: 100%;
  }

  .photo-review-image-shell img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }

  .photo-review-meta {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 0;
    padding: 12px 16px max(12px, var(--safe-bottom));
    overflow: hidden;
  }

  .photo-review-meta > div:first-child,
  .photo-review-meta .activity-badges,
  .photo-review-action-form,
  .photo-review-links {
    flex: 0 0 auto;
  }

  .photo-review-meta h2 {
    margin-bottom: 2px;
    font-size: clamp(1.3rem, 6vw, 1.78rem);
    line-height: 0.98;
  }

  .photo-review-meta .eyebrow {
    margin-bottom: 4px;
    font-size: 0.72rem;
  }

  .photo-review-meta .muted {
    margin-bottom: 0;
    font-size: 0.82rem;
    line-height: 1.22;
  }

  .photo-review-meta .activity-badges {
    gap: 6px;
  }

  .photo-review-meta .company-pill,
  .photo-review-meta .pill {
    min-height: 28px;
    font-size: 0.72rem;
  }

  .photo-review-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    align-content: start;
    align-items: start;
    padding-right: 2px;
  }

  .photo-review-facts div {
    align-self: start;
    padding: 7px 8px;
  }

  .photo-review-facts div:first-child {
    grid-column: 1 / -1;
  }

  .photo-review-facts dt {
    margin-bottom: 3px;
    font-size: 0.64rem;
  }

  .photo-review-facts dd {
    font-size: 0.88rem;
    line-height: 1.14;
  }

  .photo-review-action-form {
    position: static;
    z-index: auto;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }

  .photo-review-step-controls {
    display: none;
  }

  .photo-review-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .photo-review-controls button,
  .photo-review-links .link-button {
    width: 100%;
    min-height: 42px;
  }

  .photo-review-controls {
    gap: 8px;
  }

  .photo-review-controls button {
    border-radius: 14px;
    font-size: 0.9rem;
  }

  .photo-review-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .photo-review-links .link-button {
    min-height: 34px;
    border: 1px solid rgba(23, 32, 23, 0.08);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.72);
    font-size: 0.82rem;
  }

  .photo-review-rail {
    display: none;
  }

  .photo-review-thumb {
    flex: 0 0 88px;
  }

  .admin-card,
  .admin-surface,
  .admin-side-card,
  .admin-toolbar,
  .admin-body .flash {
    border-radius: 18px;
  }

  .admin-drawer__panel {
    width: 100vw;
    padding: 22px 18px;
  }

  .admin-modal .admin-drawer__panel {
    inset: auto 0 0 0;
    width: 100vw;
    max-height: min(88vh, 760px);
    padding: 22px 18px;
    border-radius: 20px 20px 0 0;
    transform: none;
  }

  .admin-toolbar--compact {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  body[data-view="admin_projects"].admin-body .admin-utility {
    position: sticky;
    top: 0;
  }

  body[data-view="admin_projects"] .admin-main-stack {
    gap: 12px;
  }

  body[data-view="admin_projects"] .admin-filter-deck--sticky {
    position: sticky;
    top: calc(var(--sticky-menu-height) + 8px);
    z-index: 18;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px 8px;
    margin: 0 -8px 8px;
    padding: 8px;
    border-radius: 18px;
    background: rgba(251, 250, 246, 0.96);
    box-shadow: 0 14px 30px rgba(23, 32, 23, 0.14);
    backdrop-filter: blur(18px);
  }

  body[data-view="admin_projects"] .admin-filter-deck__head,
  body[data-view="admin_projects"] .admin-search-form--desktop {
    display: none;
  }

  body[data-view="admin_projects"] .admin-filter-deck__section {
    min-width: 0;
    gap: 0;
  }

  body[data-view="admin_projects"] .admin-filter-deck__section:first-of-type {
    grid-column: 1 / -1;
  }

  body[data-view="admin_projects"] .admin-filter-deck__section:nth-of-type(2) {
    grid-column: 1;
    grid-row: 2;
  }

  body[data-view="admin_projects"] .filter-chip-row {
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 6px;
    min-width: 0;
    padding: 1px 0 4px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  body[data-view="admin_projects"] .filter-chip-row::-webkit-scrollbar {
    display: none;
  }

  body[data-view="admin_projects"] .filter-chip {
    flex: 0 0 auto;
    width: auto;
    min-height: 34px;
    gap: 6px;
    padding: 6px 10px;
    font-size: 0.78rem;
    box-shadow: none;
  }

  body[data-view="admin_projects"] .filter-chip strong {
    font-size: 0.72rem;
  }

  body[data-view="admin_projects"] .filter-chip--company {
    min-width: 36px;
    justify-content: center;
    padding-inline: 8px;
  }

  body[data-view="admin_projects"] .filter-chip--company .filter-chip__mark {
    width: 24px;
    height: 24px;
    border-radius: 999px;
  }

  body[data-view="admin_projects"] .filter-chip--company .filter-chip__label--full,
  body[data-view="admin_projects"] .filter-chip--company strong {
    display: none;
  }

  body[data-view="admin_projects"] .filter-chip--company .filter-chip__label--short {
    display: inline;
  }

  body[data-view="admin_projects"] .admin-mobile-search {
    position: relative;
    display: block;
    grid-column: 2;
    grid-row: 2;
    justify-self: end;
  }

  body[data-view="admin_projects"] .admin-mobile-search summary {
    position: relative;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border: 1px solid rgba(23, 32, 23, 0.14);
    border-radius: 999px;
    background: white;
    color: var(--brand);
    cursor: pointer;
    list-style: none;
  }

  body[data-view="admin_projects"] .admin-mobile-search summary::-webkit-details-marker {
    display: none;
  }

  body[data-view="admin_projects"] .admin-mobile-search svg {
    width: 18px;
    height: 18px;
  }

  body[data-view="admin_projects"] .admin-mobile-search[open] summary,
  body[data-view="admin_projects"] .admin-mobile-search.has-query summary {
    border-color: var(--brand);
    background: var(--brand);
    color: white;
  }

  body[data-view="admin_projects"] .admin-mobile-search.has-query summary::after {
    content: "";
    position: absolute;
    top: 5px;
    right: 5px;
    width: 7px;
    height: 7px;
    border: 1px solid white;
    border-radius: 999px;
    background: var(--sun);
  }

  body[data-view="admin_projects"] .admin-mobile-search__form {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 19;
    display: grid;
    gap: 8px;
    width: min(326px, calc(100vw - 32px));
    padding: 12px;
    border: 1px solid rgba(23, 32, 23, 0.12);
    border-radius: 16px;
    background: white;
    box-shadow: 0 20px 42px rgba(23, 32, 23, 0.2);
  }

  body[data-view="admin_projects"] .admin-mobile-search__form label {
    gap: 6px;
    font-size: 0.78rem;
  }

  body[data-view="admin_projects"] .admin-mobile-search__form input {
    min-height: 42px;
    border-radius: 12px;
  }

  body[data-view="admin_projects"] .admin-mobile-search__actions {
    display: flex;
    gap: 8px;
  }

  body[data-view="admin_projects"] .admin-mobile-search__actions .button,
  body[data-view="admin_projects"] .admin-mobile-search__actions button {
    flex: 1 1 0;
    min-height: 40px;
    border-radius: 12px;
  }
}