:root {
  --floating-glass-fill: var(--semantic-glass);
  --floating-glass-soft-fill: rgba(248, 249, 251, .24);
  --floating-glass-inner-fill: rgba(249, 250, 252, .46);
  --floating-glass-border: rgba(255, 255, 255, .72);
  --floating-glass-inner-border: rgba(82, 89, 101, .12);
  --floating-glass-divider: rgba(70, 76, 86, .12);
  --floating-glass-filter: blur(38px) saturate(1.22) brightness(1.035);
  --floating-glass-shadow: inset 0 1px rgba(255, 255, 255, .84), inset 0 -1px rgba(61, 68, 79, .08), 0 24px 62px rgba(20, 26, 36, .18), 0 5px 16px rgba(20, 26, 36, .09);
  --work-queue-card-surface: #fff;
  --work-queue-card-shadow: 0 8px 22px rgba(26, 46, 77, .11), inset 0 1px rgba(255, 255, 255, .92);
}

html[data-theme="night"] {
  --floating-glass-fill: var(--semantic-glass);
  --floating-glass-soft-fill: rgba(72, 74, 81, .34);
  --floating-glass-inner-fill: rgba(72, 74, 81, .46);
  --floating-glass-border: rgba(255, 255, 255, .18);
  --floating-glass-inner-border: rgba(255, 255, 255, .1);
  --floating-glass-divider: rgba(255, 255, 255, .1);
  --floating-glass-filter: blur(40px) saturate(1.08) brightness(.78);
  --floating-glass-shadow: inset 0 1px rgba(255, 255, 255, .15), inset 0 -1px rgba(0, 0, 0, .24), 0 26px 68px rgba(0, 0, 0, .4), 0 6px 18px rgba(0, 0, 0, .2);
  --work-queue-card-surface: #242426;
  --work-queue-card-shadow: 0 8px 22px rgba(0, 0, 0, .3), inset 0 1px rgba(255, 255, 255, .055);
}

.adaptive-container-workspace { min-width: 0; }
.adaptive-container-table { width: 100%; min-width: 0; overflow: auto; overscroll-behavior-inline: contain; }
.adaptive-container-table table { width: max-content; min-width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: 13px; }
.adaptive-container-table th,
.adaptive-container-table td { box-sizing: border-box; min-width: var(--column-min); width: var(--column-preferred); height: 40px; padding: 7px 10px; overflow: hidden; white-space: nowrap; }
.adaptive-container-table [data-column-pinned="true"] {
  position: sticky;
  left: var(--column-pin-left, 0);
  z-index: 3;
  background: #fff;
}
.adaptive-container-table thead [data-column-pinned="true"] { z-index: 6; }
.adaptive-container-table [data-column-pin-last="true"] {
  box-shadow: 10px 0 18px -18px rgba(15, 23, 42, .55);
}
.dashboard-column-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  width: 100%;
  min-width: 0;
  overflow: hidden;
}
.dashboard-column-heading > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dashboard-column-pin {
  display: none;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #8a93a3;
  opacity: .72;
  cursor: pointer;
  transition: transform 180ms ease, color 180ms ease, opacity 180ms ease, filter 180ms ease;
}
.dashboard-column-pin svg { display: block; width: 11px; height: 11px; margin: auto; fill: currentColor; }
.is-edit-mode .dashboard-column-pin { display: inline-grid; place-items: center; }
.dashboard-column-pin[aria-pressed="true"] { color: #4f6f9f; opacity: 1; transform: rotate(-24deg); }
.dashboard-column-pin:hover,
.dashboard-column-pin:focus-visible { color: #50698f; opacity: 1; transform: scale(1.12); filter: drop-shadow(0 2px 4px rgba(75, 95, 128, .24)); outline: none; }
.dashboard-column-pin[aria-pressed="true"]:hover,
.dashboard-column-pin[aria-pressed="true"]:focus-visible { transform: rotate(-24deg) scale(1.12); }
.adaptive-scrollbar {
  position: sticky;
  bottom: 0;
  z-index: 4;
  height: 14px;
  box-sizing: border-box;
  overflow: hidden;
  background: #fff;
  padding: 4px 5px;
  touch-action: none;
}

/* Complete multi-leg Dispatch plan inside the shared Graphite Glass window. */
.dispatch-plan-form {
  display: grid;
  gap: 14px;
  width: min(720px, 100%);
  padding: 0;
}

.dispatch-plan-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px 10px;
}

.dispatch-plan-grid--identity {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding-bottom: 3px;
}

.dispatch-plan-leg {
  display: grid;
  gap: 9px;
  padding: 13px 0 0;
  border: 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
  background: transparent;
}

.dispatch-plan-leg__label {
  color: var(--text);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: -0.012em;
}

.dispatch-plan-form label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: var(--muted);
  font-size: 0.67rem;
  font-weight: 650;
}

.dispatch-plan-form input,
.dispatch-plan-form select {
  width: 100%;
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  border-radius: 11px;
  color: var(--text);
  background: color-mix(in srgb, var(--surface-solid) 88%, transparent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
  font: inherit;
  font-size: 0.73rem;
}

.dispatch-plan-form input:focus,
.dispatch-plan-form select:focus {
  border-color: rgba(10, 132, 255, 0.68);
  outline: 3px solid rgba(10, 132, 255, 0.13);
  outline-offset: 0;
}

@media (max-width: 760px) {
  .dispatch-plan-form {
    width: 100%;
    gap: 12px;
  }

  .dispatch-plan-grid,
  .dispatch-plan-grid--identity {
    grid-template-columns: minmax(0, 1fr);
  }
}
.adaptive-scrollbar__track {
  position: relative;
  width: 100%;
  height: 6px;
  border-radius: 999px;
  background: #eef2f6;
}
.adaptive-scrollbar__thumb {
  position: absolute;
  inset: 0 auto 0 0;
  min-width: 44px;
  border-radius: 999px;
  background: #8b94a3;
  cursor: grab;
  will-change: transform;
}
.adaptive-scrollbar__thumb[data-dragging="true"] { cursor: grabbing; }
.adaptive-container-cards { display: none; }
.adaptive-container-inspector { min-width: 0; }
.adaptive-columns-popover[hidden] { display: none; }
[data-workspace-tier="mobile"] .adaptive-container-table,
[data-workspace-tier="mobile"] .adaptive-scrollbar { display: none; }
[data-workspace-tier="mobile"] .adaptive-container-cards { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.adaptive-container-card > button {
  display: grid;
  width: 100%;
  min-height: 88px;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  border: 1px solid #dce3ed;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 5px 16px rgba(26, 46, 77, .07);
  color: #172033;
  padding: 10px 11px;
  text-align: left;
}
.adaptive-container-card__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.adaptive-container-card__actions:empty { display: none; }

/* Container status colors remain available for identifiers and compact mobile
   cards. Dense desktop rows use neutral separators; completion alone fills. */
.adaptive-task {
  --adaptive-task-accent: #a7b0bf;
  --adaptive-task-link: #172033;
  --adaptive-task-number-fill: #f3f5f8;
  --adaptive-task-number-border: #667085;
}
.adaptive-task--delivered-to-warehouse {
  --adaptive-task-accent: #8b5cf6;
  --adaptive-task-link: #8b5cf6;
  --adaptive-task-number-fill: #f2ecff;
  --adaptive-task-number-border: #7047c6;
}
.adaptive-task--arrived-at-port {
  --adaptive-task-accent: #ec4899;
  --adaptive-task-link: #ec4899;
  --adaptive-task-number-fill: #fff0f5;
  --adaptive-task-number-border: #d43f77;
}
.adaptive-task--available-for-pickup {
  --adaptive-task-accent: #2f80ed;
  --adaptive-task-link: #2f80ed;
  --adaptive-task-number-fill: #edf4ff;
  --adaptive-task-number-border: #176fd1;
}
.adaptive-task--pending {
  --adaptive-task-accent: #ef4444;
  --adaptive-task-link: #ef4444;
  --adaptive-task-number-fill: #fff0ef;
  --adaptive-task-number-border: #d92d20;
}
.adaptive-task--cancelled {
  --adaptive-task-accent: #98a2b3;
  --adaptive-task-link: #7d8796;
  --adaptive-task-number-fill: #f1f3f5;
  --adaptive-task-number-border: #667085;
}
.adaptive-task--empty-returned {
  --adaptive-task-accent: #218c57;
  --adaptive-task-link: #218c57;
  --adaptive-task-number-fill: #e8f7ed;
  --adaptive-task-number-border: #14733c;
}

.adaptive-container-table [data-column-key="container_no"] a {
  color: var(--adaptive-task-link);
  text-decoration: none;
}

.adaptive-container-table [data-column-key="container_no"] a:hover {
  color: var(--adaptive-task-link);
  text-decoration: none;
}

.adaptive-container-table [data-column-key="container_no"] a:focus-visible {
  color: var(--adaptive-task-link);
  text-decoration: none;
  outline: 1px solid currentColor;
  outline-offset: 2px;
}

.adaptive-container-card > button > strong {
  color: var(--adaptive-task-link);
}

.adaptive-container-table tbody tr.adaptive-task--empty-returned > td {
  background: #edf9f1;
}

.adaptive-task--empty-returned [data-column-key="empty_returned_at"] .adaptive-data-chip {
  border: 1px solid #a9dfbc;
  background: #d9f5e4;
  color: #14733c;
}

.adaptive-container-card.adaptive-task:not(.adaptive-task--neutral) > button {
  border-left: 3px solid var(--adaptive-task-accent);
}

.adaptive-container-card.adaptive-task--empty-returned > button {
  border-color: #9ed8b6;
  background: #edf9f1;
  box-shadow: 0 5px 16px rgba(33, 140, 87, .10);
}

/* Final adaptive authority: keep operational surfaces at the available workspace
   boundary after the shared and pixel-master stylesheets have loaded. */
.operations-shell .app-main {
  min-width: 0;
  container-type: inline-size;
}

.operations-shell .page,
.customer-dashboard {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

.operations-shell .page {
  padding-inline: clamp(16px, 1.2vw, 24px);
}

.operations-shell .operations-dashboard-layout {
  width: 100%;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}

.operations-shell .dashboard-quickview {
  display: none;
}

.operations-shell .operations-dashboard-layout .adaptive-container-inspector {
  display: none;
}

[data-workspace-tier="wide"] .operations-dashboard-layout,
[data-workspace-tier="ultra"] .operations-dashboard-layout {
  grid-template-columns: minmax(0, 1fr);
}

@container (min-width: 1600px) {
  .operations-shell .operations-dashboard-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .operations-shell .dashboard-quickview {
    display: none;
  }
}

.operations-shell .adaptive-scrollbar {
  position: fixed;
  right: 16px;
  bottom: 10px;
  left: 16px;
  z-index: 1000;
  display: block;
  width: auto;
  height: 8px;
  overflow: visible;
  border: 0;
  background: transparent;
  padding: 0;
  pointer-events: none;
}

.operations-shell .adaptive-scrollbar__track {
  height: 8px;
  background: transparent;
  pointer-events: auto;
}

.operations-shell .adaptive-scrollbar__thumb {
  inset: 1px auto auto 0;
  height: 6px;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 999px;
  background: rgba(76, 88, 108, .72);
  box-shadow: 0 3px 12px rgba(25, 39, 61, .2);
  backdrop-filter: blur(12px);
}

.operations-shell .adaptive-scrollbar[data-scrollable="false"] {
  visibility: hidden;
  opacity: 0;
}

.operations-shell .adaptive-container-table {
  scrollbar-width: none;
}

.operations-shell .adaptive-container-table::-webkit-scrollbar {
  display: none;
}

.operations-shell .dashboard-metrics {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}

.operations-shell .dashboard-metric-card {
  min-height: 86px;
  padding: 11px 12px;
}

.operations-shell .dashboard-metric-card small {
  max-width: 52%;
}

.operations-shell .dashboard-metric-card__spark {
  right: 12px;
  bottom: 10px;
  left: auto;
  width: 42%;
  height: 16px;
}

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

.operations-shell .dashboard-action-grid > div,
.operations-shell .dashboard-action-grid .today-work-queue {
  min-height: 0;
  width: 100%;
}

.operations-shell .dashboard-action-grid .today-work-queue-card,
.operations-shell .dashboard-operations-table-wrap th,
.operations-shell .dashboard-operations-table-wrap td,
.operations-shell .adaptive-container-table th,
.operations-shell .adaptive-container-table td {
  min-height: 38px;
  font-size: 13px;
}

.operations-shell .dashboard-action-grid .today-work-queue-card h3,
.operations-shell .dashboard-action-grid .today-work-queue-card__cell,
.operations-shell .dashboard-action-grid .today-work-queue-card__state,
.operations-shell .dashboard-action-grid .today-work-queue-card__priority,
.operations-shell .operations-dashboard-heading p,
.operations-shell .topbar-search,
.operations-shell .topbar .user-identity small {
  font-size: 12px;
}

.operations-shell .dashboard-quickview,
.adaptive-container-inspector {
  min-height: 0;
  font-size: 13px;
}

.operations-shell .dashboard-quickview dt,
.operations-shell .dashboard-quickview dd,
.operations-shell .dashboard-quickview p {
  font-size: 12px;
}

.dashboard-secondary-data:empty {
  display: none;
}

.shell-profile-menu {
  position: relative;
  min-width: 0;
}

.shell-profile-popover {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 90;
  display: grid;
  min-width: 220px;
  gap: 10px;
  border: 1px solid #dfe6ef;
  border-radius: 10px;
  padding: 12px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(15, 31, 57, .14);
}

.shell-profile-popover[hidden] {
  display: none;
}

.adaptive-container-inspector {
  transition: opacity 200ms ease, transform 200ms ease;
}

[data-workspace-tier="mobile"] input,
[data-workspace-tier="mobile"] select,
[data-workspace-tier="mobile"] textarea {
  font-size: 16px;
}

[data-workspace-tier="mobile"] button,
[data-workspace-tier="mobile"] a.button-link,
[data-workspace-tier="mobile"] .adaptive-container-card > button {
  min-height: 44px;
}

@media (max-width: 899px) {
  .operations-shell .page {
    padding-inline: 12px;
  }

  .operations-shell .dashboard-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .operations-shell .dashboard-metric-card {
    min-height: 82px;
  }

  input,
  select,
  textarea {
    font-size: 16px;
  }

  button,
  a.button-link,
  .adaptive-container-card > button {
    min-height: 44px;
  }

  .shell-profile-popover {
    position: fixed;
    inset: auto 12px calc(72px + env(safe-area-inset-bottom)) 12px;
  }
}

/* Status: frosted, pastel analytics. Three-dimensional material remains reserved for tabs. */
.status-operations-page {
  --status-page: #f6f8fc;
  --status-panel: rgba(255, 255, 255, .94);
  --status-edge: rgba(148, 163, 184, .17);
  --status-ink: #0f172a;
  --status-muted: #64748b;
  display: grid;
  gap: clamp(12px, 1.2vw, 20px);
  width: 100%;
  max-width: none;
  margin: 0 auto;
  padding: clamp(2px, .55vw, 8px);
  background: var(--status-page);
  color: var(--status-ink);
}

.status-operations-page__header {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.status-operations-page__header h1 {
  margin: 0;
  font-size: clamp(23px, 1.8vw, 30px);
  letter-spacing: -.035em;
}

.status-range-control {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  border: 1px solid #dfe3e9;
  border-radius: 11px;
  background: #f1f3f6;
}

.status-range-control button {
  min-width: 42px;
  min-height: 28px;
  padding: 0 9px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  color: #747986;
  font-size: 10px;
  font-weight: 700;
}

.status-range-control button[aria-pressed="true"] {
  background: #fff;
  color: #1d1d1f;
  box-shadow: 0 1px 4px rgba(21, 28, 40, .1);
}

.status-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(8px, .8vw, 14px);
}

.status-kpi-card {
  --kpi-color: #4f7fe8;
  display: grid;
  min-height: clamp(112px, 7.2vw, 136px);
  align-content: start;
  overflow: visible;
  padding: clamp(10px, .8vw, 14px);
  border: 1px solid var(--status-edge);
  border-radius: 17px;
  background: linear-gradient(155deg, rgba(255,255,255,.99), color-mix(in srgb, var(--kpi-color) 5%, white)), var(--status-panel);
  box-shadow: 0 10px 30px rgba(28, 45, 75, .055);
  backdrop-filter: blur(10px) saturate(1.03);
  -webkit-backdrop-filter: blur(10px) saturate(1.03);
}

.status-kpi-card--orange { --kpi-color: #d7832f; }
.status-kpi-card--green { --kpi-color: #35a565; }
.status-kpi-card--red { --kpi-color: #d85d55; }
.status-kpi-card > header { display: flex; min-width: 0; align-items: center; gap: 8px; }
.status-kpi-card__icon {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .62);
  border-radius: 11px;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.36), transparent 38%),
    linear-gradient(145deg, color-mix(in srgb, var(--kpi-color) 86%, white), var(--kpi-color));
  box-shadow: 0 9px 20px color-mix(in srgb, var(--kpi-color) 18%, transparent), inset 0 1px rgba(255,255,255,.42);
  color: #fff;
}
.status-kpi-card__icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.status-kpi-card > header > span:not(.status-kpi-card__icon) { overflow: hidden; min-width: 0; color: #0f172a; font-size: clamp(10px, .66vw, 11px); font-weight: 650; letter-spacing: -.01em; text-overflow: ellipsis; white-space: nowrap; }
.status-kpi-card__trend { display: inline-flex; align-items: center; gap: 1px; margin-left: auto; color: #2f9b57; font-size: 9px; font-weight: 750; white-space: nowrap; }
.status-kpi-card__trend i { font-style: normal; }
.status-kpi-card__trend--down { color: #cf554d; }
.status-kpi-card__trend--flat,
.status-kpi-card__trend--unavailable { color: #8b909a; }
.status-kpi-card > strong { margin-top: 7px; font-size: clamp(24px, 1.65vw, 32px); font-weight: 650; font-variant-numeric: tabular-nums; letter-spacing: -.045em; line-height: 1; }
.status-kpi-card > small { margin-top: 2px; color: #94a3b8; font-size: 9px; font-weight: 600; letter-spacing: .025em; text-transform: uppercase; }
.status-kpi-card .kpi-sparkline { height: 25px; margin-top: 3px; }

.status-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 2.15fr) minmax(310px, .85fr);
  gap: 12px;
}

.status-chart {
  --chart-primary: #4f7fe8;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--status-edge);
  border-radius: 20px;
  background: var(--status-panel);
  box-shadow: 0 10px 30px rgba(28, 45, 75, .055);
  backdrop-filter: blur(10px) saturate(1.025);
  -webkit-backdrop-filter: blur(10px) saturate(1.025);
}

.status-chart--hero,
.status-chart--finance,
.status-chart--team,
.status-chart--readiness,
.status-chart--heatmap { padding: 16px 17px 13px; }

.status-chart__header {
  display: flex;
  min-height: 27px;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.status-chart__header h2 {
  margin: 0;
  font-size: clamp(15px, 1.3vw, 19px);
  letter-spacing: -.022em;
}

.status-chart__legend {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(10px, 1.5vw, 20px);
  flex-wrap: wrap;
}

.status-chart__legend-item {
  --legend-color: #4f7fe8;
  display: grid;
  grid-template-columns: 6px auto;
  column-gap: 6px;
  color: var(--status-ink);
  text-decoration: none;
}

.status-chart__legend-item > i { grid-row: 1 / span 2; align-self: center; width: 6px; height: 6px; border-radius: 50%; background: var(--legend-color); }
.status-chart__legend-item > small { color: var(--status-muted); font-size: 8px; line-height: 1.1; }
.status-chart__legend-item > strong { margin-top: 2px; font-size: 14px; line-height: 1; letter-spacing: -.02em; }
.status-chart__legend-item--blue { --legend-color: #4f7fe8; }
.status-chart__legend-item--orange { --legend-color: #d7832f; }
.status-chart__legend-item--green { --legend-color: #35a565; }
.status-chart__legend-item--red { --legend-color: #d85d55; }
.status-chart__legend-item--gray { --legend-color: #8b909a; }

.status-chart__stage { position: relative; min-width: 0; }
.status-chart__plot {
  display: block;
  width: 100%;
  height: clamp(220px, 22vw, 292px);
  margin-top: 7px;
  overflow: visible;
  cursor: crosshair;
}
.status-chart--finance .status-chart__plot { height: clamp(190px, 17vw, 240px); }
.status-chart__grid line { stroke: #e8ebf0; stroke-width: 1; vector-effect: non-scaling-stroke; }
.status-chart__axis text { fill: var(--status-muted); font-size: 9px; }
.status-chart__line { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.25; vector-effect: non-scaling-stroke; }
.status-chart__plot stop:first-child { stop-color: #356df3; stop-opacity: .17; }
.status-chart__plot stop:last-child { stop-color: #356df3; stop-opacity: .015; }
.status-chart__fill { pointer-events: none; }
.status-chart__fill--throughput,
.status-chart__fill--revenue { opacity: 1; }
.status-chart__line--throughput,
.status-chart__line--revenue { stroke: #356df3; }
.status-chart__line--active { stroke: #ed8a18; }
.status-chart__line--completed,
.status-chart__line--profit { stroke: #2fa75b; }
.status-chart__line--risk { stroke: #e94c45; }
.status-chart__line--cost { stroke: #ed8a18; }
.status-chart__cursor { transition: transform 160ms cubic-bezier(.2, .8, .2, 1); }
.status-chart__cursor line { stroke: #7386b9; stroke-dasharray: 4 5; stroke-width: 1; vector-effect: non-scaling-stroke; }
.status-chart__dot { opacity: 0; stroke: #fff; stroke-width: 2; transform-box: fill-box; transform-origin: center; vector-effect: non-scaling-stroke; }
.status-chart__dot.is-selected { opacity: 1; transform: scale(1); transition: opacity 120ms ease, transform 160ms cubic-bezier(.2, .8, .2, 1); }
.status-chart__dot--throughput,
.status-chart__dot--revenue { fill: #4f7fe8; }
.status-chart__dot--active { fill: #e5a04b; }
.status-chart__dot--completed,
.status-chart__dot--profit { fill: #35a565; }
.status-chart__dot--risk { fill: #d85d55; }
.status-chart__dot--cost { fill: #d7832f; }

.status-chart__tooltip {
  position: absolute;
  z-index: 2;
  top: 42px;
  left: clamp(92px, var(--status-cursor-left), calc(100% - 92px));
  display: grid;
  min-width: 142px;
  gap: 6px;
  padding: 9px 10px;
  border: 1px solid var(--status-edge);
  border-radius: 14px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 12px 28px -18px rgba(24, 31, 45, .3);
  backdrop-filter: blur(10px) saturate(1.03);
  -webkit-backdrop-filter: blur(10px) saturate(1.03);
  pointer-events: none;
  transform: translateX(-50%);
  transition: left 160ms cubic-bezier(.2, .8, .2, 1);
}
.status-chart__tooltip > strong { color: var(--status-muted); font-size: 9px; font-weight: 650; }
.status-chart__tooltip-row { --tooltip-color: #4f7fe8; display: grid; grid-template-columns: 6px 1fr auto; align-items: center; gap: 6px; font-size: 9px; }
.status-chart__tooltip-row i { width: 6px; height: 6px; border-radius: 50%; background: var(--tooltip-color); }
.status-chart__tooltip-row small { color: var(--status-muted); }
.status-chart__tooltip-row b { font-size: 10px; font-variant-numeric: tabular-nums; }
.status-chart__tooltip-row--green { --tooltip-color: #35a565; }
.status-chart__tooltip-row--red { --tooltip-color: #d85d55; }
.status-chart__tooltip-row--orange { --tooltip-color: #d7832f; }

.status-timeline-control { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; margin: 0 5px; }
.status-timeline-control output { min-width: 50px; color: var(--status-muted); font-size: 9px; text-align: right; }
.status-timeline-control input { width: 100%; height: 18px; margin: 0; padding: 0; border: 0; background: transparent; accent-color: #4f7fe8; }
.status-timeline-control input::-webkit-slider-runnable-track { height: 3px; border-radius: 999px; background: #e2e6ed; }
.status-timeline-control input::-webkit-slider-thumb { width: 12px; height: 12px; margin-top: -4.5px; border: 2px solid #fff; border-radius: 50%; background: #4f7fe8; box-shadow: 0 1px 5px rgba(38, 79, 164, .3); -webkit-appearance: none; }

.status-chart-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.status-chart-layout > :only-child { grid-column: 1 / -1; }
.status-chart-layout:has(.status-chart--finance) .status-chart--readiness { grid-column: 1 / -1; }

.status-heatmap {
  display: grid;
  align-content: center;
  gap: 7px;
  min-height: 282px;
  padding-top: 12px;
  overflow: hidden;
}
.status-heatmap__axis,
.status-heatmap__row { display: grid; min-width: 0; grid-template-columns: 68px repeat(var(--heat-columns), minmax(0, 1fr)); gap: 5px; align-items: center; }
.status-heatmap__axis small { overflow: hidden; color: var(--status-muted); font-size: 7px; text-align: center; text-overflow: clip; white-space: nowrap; }
.status-heatmap__row { --heat-color: #4f7fe8; }
.status-heatmap__row--orange { --heat-color: #d7832f; }
.status-heatmap__row--green { --heat-color: #35a565; }
.status-heatmap__row--red { --heat-color: #d85d55; }
.status-heatmap__row strong { overflow: hidden; color: var(--status-muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.status-heatmap__row i { display: grid; aspect-ratio: 1; place-items: center; border: 1px solid color-mix(in srgb, var(--heat-color) var(--heat-border), #e9edf3); border-radius: 6px; background: color-mix(in srgb, var(--heat-color) var(--heat-fill), #f5f7fa); font-style: normal; transition: border-color 150ms ease, outline-color 150ms ease; }
.status-heatmap__row i span { color: color-mix(in srgb, var(--heat-color) 76%, #20242b); font-size: 7px; font-weight: 750; }
.status-heatmap__row i.is-selected { outline: 1px solid color-mix(in srgb, var(--heat-color) 65%, white); outline-offset: 1px; }

.status-visual-analysis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-top: 9px;
  padding-top: 10px;
  border-top: 1px solid #edf0f4;
}
.status-visual-analysis__item { --analysis-color: #4f7fe8; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 5px 9px; min-width: 0; }
.status-visual-analysis__item > span { overflow: hidden; color: var(--status-muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.status-visual-analysis__item > strong { font-size: 11px; font-variant-numeric: tabular-nums; }
.status-visual-analysis__item > div { grid-column: 1 / -1; height: 4px; overflow: hidden; border-radius: 999px; background: #edf0f4; }
.status-visual-analysis__item > div > i { display: block; width: var(--analysis-value); height: 100%; border-radius: inherit; background: var(--analysis-color); }
.status-visual-analysis__item--green { --analysis-color: #35a565; }
.status-visual-analysis__item--red { --analysis-color: #d85d55; }
.status-visual-analysis__item--orange { --analysis-color: #d7832f; }
.status-visual-analysis__item--gray { --analysis-color: #8b909a; }

.status-team-visual { display: grid; min-height: 208px; grid-template-columns: minmax(130px, .55fr) minmax(210px, 1.45fr); align-items: center; gap: 26px; padding: 14px 6px 4px; }
.status-team-ring { display: grid; width: 132px; aspect-ratio: 1; place-content: center; justify-self: center; border-radius: 50%; background: radial-gradient(circle at center, #fff 0 60%, transparent 61%), conic-gradient(#35a565 calc(var(--team-present) * 1%), #e9edf2 0); text-align: center; }
.status-team-ring strong { font-size: 30px; letter-spacing: -.05em; line-height: 1; }
.status-team-ring span { margin-top: 4px; color: var(--status-muted); font-size: 8px; font-weight: 650; }
.status-team-distribution { display: grid; gap: 20px; }
.status-team-stack { display: flex; height: 11px; overflow: hidden; border-radius: 999px; background: #edf0f4; }
.status-team-stack i { display: block; min-width: 0; }
.status-team-stack .is-present { width: calc(var(--team-present) * 1%); background: #35a565; }
.status-team-stack .is-pending { width: calc(var(--team-pending) * 1%); background: #d7832f; }
.status-team-stack .is-inactive { width: calc(var(--team-inactive) * 1%); background: #8b909a; }
.status-team-columns { display: grid; height: 88px; grid-template-columns: repeat(3, 1fr); align-items: end; gap: 12px; border-bottom: 1px solid #e6eaf0; }
.status-team-columns i { min-height: 7px; border-radius: 5px 5px 0 0; }
.status-team-columns .is-present { height: max(7px, calc(var(--team-present) * 1%)); background: #35a565; }
.status-team-columns .is-pending { height: max(7px, calc(var(--team-pending) * 1%)); background: #d7832f; }
.status-team-columns .is-inactive { height: max(7px, calc(var(--team-inactive) * 1%)); background: #8b909a; }

.status-readiness-graph { display: grid; align-content: center; gap: 13px; min-height: 220px; padding: 12px 2px 2px; }
.status-readiness-row { --bar-color: #758094; display: grid; grid-template-columns: 28px minmax(98px, .7fr) minmax(120px, 1fr) 24px; align-items: center; gap: 10px; color: var(--status-ink); font-size: 9px; font-weight: 620; }
.status-readiness-row__icon { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid color-mix(in srgb, var(--bar-color) 18%, white); border-radius: 8px; background: color-mix(in srgb, var(--bar-color) 12%, white); color: var(--bar-color); }
.status-readiness-row__icon svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.status-readiness-row > div { height: 5px; overflow: hidden; border-radius: 999px; background: #edf0f4; }
.status-readiness-row > div > i { display: block; width: var(--bar-value); height: 100%; border-radius: inherit; background: var(--bar-color); transition: width 320ms cubic-bezier(.2, .8, .2, 1); }
.status-readiness-row > strong { text-align: right; font-size: 12px; }
.status-readiness-row--red { --bar-color: #d85d55; }
.status-readiness-row--orange { --bar-color: #d7832f; }
.status-readiness-row--purple { --bar-color: #8875bb; }
.status-readiness-row--green { --bar-color: #35a565; }

html[data-theme="night"] .status-operations-page { --status-panel: #1c1c1e; --status-edge: #37373a; --status-ink: #f5f5f7; --status-muted: #a1a1a6; }
html[data-theme="night"] .status-range-control { border-color: #38383b; background: #252527; }
html[data-theme="night"] .status-range-control button { color: #a1a1a6; }
html[data-theme="night"] .status-range-control button[aria-pressed="true"] { background: #3a3a3c; color: #f5f5f7; }
html[data-theme="night"] .status-kpi-card__icon { background: color-mix(in srgb, var(--kpi-color) 18%, #1c1c1e); }
html[data-theme="night"] .status-chart__grid line,
html[data-theme="night"] .status-team-columns { stroke: #323236; border-color: #323236; }
html[data-theme="night"] .status-chart__dot { stroke: #1c1c1e; }
html[data-theme="night"] .status-chart__tooltip { border-color: #3a3a3c; background: rgba(38, 38, 41, .97); }
html[data-theme="night"] .status-timeline-control input::-webkit-slider-runnable-track,
html[data-theme="night"] .status-visual-analysis__item > div,
html[data-theme="night"] .status-team-stack,
html[data-theme="night"] .status-readiness-row > div { background: #323236; }
html[data-theme="night"] .status-visual-analysis { border-color: #323236; }
html[data-theme="night"] .status-team-ring { background: radial-gradient(circle at center, #1c1c1e 0 60%, transparent 61%), conic-gradient(#35a565 calc(var(--team-present) * 1%), #343438 0); }
html[data-theme="night"] .status-heatmap__row i { border-color: color-mix(in srgb, var(--heat-color) var(--heat-border), #343438); background: color-mix(in srgb, var(--heat-color) var(--heat-fill), #252528); }
html[data-theme="night"] .status-heatmap__row i span { color: color-mix(in srgb, var(--heat-color) 58%, #f5f5f7); }

@media (max-width: 1180px) {
  .status-overview-grid { grid-template-columns: 1fr; }
  .status-heatmap { min-height: 225px; }
  .status-chart-layout { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .status-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .status-chart__header { display: grid; gap: 10px; }
  .status-chart__legend { justify-content: flex-start; }
  .status-chart__plot,
  .status-chart--finance .status-chart__plot { height: 220px; }
  .status-team-visual { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .status-operations-page__header { align-items: flex-start; flex-direction: column; }
  .status-kpi-card { min-height: 105px; padding: 11px; }
  .status-kpi-card > header { gap: 6px; }
  .status-kpi-card__icon { width: 34px; height: 34px; flex-basis: 34px; border-radius: 11px; }
  .status-kpi-card__icon svg { width: 18px; height: 18px; }
  .status-kpi-card > header > span:not(.status-kpi-card__icon) { font-size: 10.5px; }
  .status-kpi-card__trend { font-size: 8px; }
  .status-kpi-card footer { grid-template-columns: auto auto; }
  .status-kpi-card__sparkline { display: none; }
  .status-chart--hero,
  .status-chart--finance,
  .status-chart--team,
  .status-chart--readiness,
  .status-chart--heatmap { padding: 13px 11px 10px; }
  .status-chart__tooltip { min-width: 128px; }
  .status-visual-analysis { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .status-chart__cursor,
  .status-chart__tooltip,
  .status-chart__dot,
  .status-heatmap__row i,
  .status-readiness-row > div > i { transition: none; }
}

/* Settings: access control plus immutable audit, without an appearance duplicate. */
.settings-page {
  --settings-ink: #181a1f;
  --settings-muted: #6d717b;
  --settings-surface: #f0f2f5;
  --settings-raised: #f8f9fb;
  --settings-edge: rgba(73, 82, 97, .14);
  display: grid;
  gap: 12px;
  max-width: 1720px;
  margin: 0 auto;
  color: var(--settings-ink);
}

.settings-page__header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  padding: 5px 2px 3px;
}

.settings-page__header h1 { margin: 0; font-size: 28px; letter-spacing: -.035em; }
.settings-page__header p,
.settings-page__header small { margin: 0; color: var(--settings-muted); }
.settings-page__header small { font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.settings-page__header p { margin-top: 2px; font-size: 12px; }

.settings-user-search {
  position: relative;
  display: block;
  width: min(300px, 100%);
}

.settings-user-search > span {
  position: absolute;
  z-index: 1;
  top: -6px;
  left: 14px;
  padding: 0 5px;
  border-radius: 5px;
  background: #f4f5f7;
  color: var(--settings-muted);
  font-size: 9px;
}

.settings-user-search > input {
  width: 100%;
  min-height: 38px;
  padding: 7px 13px;
  border: 1px solid var(--settings-edge);
  border-radius: 14px;
  background: rgba(248, 249, 251, .82);
  color: var(--settings-ink);
  box-shadow: inset 0 1px rgba(255, 255, 255, .84), 0 7px 18px -17px rgba(20, 24, 31, .6);
}

.settings-page__layout {
  display: grid;
  grid-template-columns: minmax(330px, .72fr) minmax(650px, 1.5fr);
  gap: 10px;
  align-items: start;
}

.settings-surface {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--settings-edge);
  border-radius: 24px;
  background:
    linear-gradient(150deg, rgba(255, 255, 255, .65), rgba(239, 242, 246, .76)),
    var(--settings-surface);
  box-shadow: inset 0 1px rgba(255, 255, 255, .85), 0 18px 38px -34px rgba(24, 28, 37, .7);
}

.settings-surface > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 58px;
  padding: 12px 15px;
  border-bottom: 1px solid var(--settings-edge);
}

.settings-surface > header h2 { margin: 1px 0 0; font-size: 15px; letter-spacing: -.015em; }
.settings-surface > header small { color: var(--settings-muted); font-size: 9px; font-weight: 700; letter-spacing: .045em; text-transform: uppercase; }
.settings-surface > header > span {
  padding: 4px 8px;
  border: 1px solid var(--settings-edge);
  border-radius: 999px;
  background: rgba(255, 255, 255, .54);
  color: var(--settings-muted);
  font-size: 9px;
  font-weight: 650;
}

.settings-user-list {
  display: grid;
  max-height: calc(100vh - 190px);
  overflow: auto;
  scrollbar-width: thin;
}

.settings-user {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto minmax(105px, 122px);
  align-items: center;
  gap: 9px;
  min-height: 67px;
  padding: 9px 12px;
  border-bottom: 1px solid rgba(80, 88, 102, .09);
}

.settings-user[hidden] { display: none; }
.settings-user:last-child { border-bottom: 0; }
.settings-user__avatar {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(70, 79, 94, .13);
  border-radius: 50%;
  background: linear-gradient(145deg, #fff, #e3e6eb);
  color: #333842;
  box-shadow: inset 0 1px #fff, 0 7px 14px -12px rgba(0, 0, 0, .6);
  font-size: 10px;
  font-weight: 720;
}

.settings-user__identity { display: grid; min-width: 0; gap: 1px; }
.settings-user__identity strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.settings-user__identity span,
.settings-user__identity small { overflow: hidden; color: var(--settings-muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.settings-user__state {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--settings-muted);
  font-size: 9px;
  font-weight: 620;
}
.settings-user__state i { width: 6px; height: 6px; border-radius: 50%; background: #8e929b; }
.settings-user__state--active i { background: #34a764; box-shadow: 0 0 0 2px rgba(52, 167, 100, .11); }
.settings-user__state--inactive i { background: #d15a55; }

.settings-user__role { display: grid; gap: 2px; }
.settings-user__role > span { color: var(--settings-muted); font-size: 8px; }
.settings-user__role select {
  width: 100%;
  min-height: 32px;
  padding: 4px 25px 4px 9px;
  border: 1px solid var(--settings-edge);
  border-radius: 11px;
  background: rgba(255, 255, 255, .64);
  color: var(--settings-ink);
  font-size: 10px;
}

.settings-empty { margin: 0; padding: 24px 15px; color: var(--settings-muted); font-size: 11px; text-align: center; }
.settings-audit__lock::before { content: "\1F512"; margin-right: 4px; filter: grayscale(1); opacity: .55; }
.settings-audit #adminAuditLog { padding: 0 12px 12px; }
.settings-audit .admin-log-toolbar { margin-top: 10px; }
.settings-audit .table-wrap { border-radius: 15px; box-shadow: none; }

.settings-role-confirmation {
  position: fixed;
  z-index: 1900;
  width: min(276px, calc(100vw - 20px));
  padding: 13px;
  border: 1px solid rgba(78, 86, 101, .18);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .88), rgba(239, 242, 247, .93)),
    #f2f4f7;
  box-shadow: inset 0 1px rgba(255, 255, 255, .94), 0 16px 34px -24px rgba(22, 27, 36, .55);
  color: #1d2026;
  -webkit-backdrop-filter: blur(22px) saturate(1.12);
  backdrop-filter: blur(22px) saturate(1.12);
}
.settings-role-confirmation[hidden] { display: none; }
.settings-role-confirmation__arrow {
  position: absolute;
  top: -6px;
  left: var(--settings-role-arrow-left, 226px);
  width: 11px;
  height: 11px;
  border-top: 1px solid rgba(78, 86, 101, .18);
  border-left: 1px solid rgba(78, 86, 101, .18);
  background: #f7f8fa;
  transform: translateX(-50%) rotate(45deg);
}
.settings-role-confirmation.is-above .settings-role-confirmation__arrow {
  top: auto;
  bottom: -6px;
  border: 0;
  border-right: 1px solid rgba(78, 86, 101, .18);
  border-bottom: 1px solid rgba(78, 86, 101, .18);
  background: #eff2f6;
}
.settings-role-confirmation > small { color: #6d7481; font-size: 8px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.settings-role-confirmation > h2 { margin: 3px 0 8px; font-size: 14px; letter-spacing: -.015em; }
.settings-role-confirmation > p { margin: 0; color: #373d48; font-size: 10px; line-height: 1.4; }
.settings-role-confirmation__guidance { margin-top: 7px !important; color: #6b7280 !important; }
.settings-role-confirmation__error { margin-top: 7px !important; color: #bb403d !important; }
.settings-role-confirmation__actions { display: flex; justify-content: flex-end; gap: 6px; margin-top: 11px; }
.settings-role-confirmation__actions button {
  min-height: 30px;
  padding: 5px 11px;
  border: 1px solid rgba(69, 79, 94, .16);
  border-radius: 10px;
  background: rgba(255, 255, 255, .72);
  color: #39404a;
  font-size: 9px;
  font-weight: 680;
  box-shadow: inset 0 1px rgba(255, 255, 255, .92), 0 6px 14px -12px rgba(20, 25, 34, .7);
  transition: transform 160ms ease, box-shadow 160ms ease;
}
.settings-role-confirmation__actions button:hover,
.settings-role-confirmation__actions button:focus-visible { transform: scale(1.035); box-shadow: inset 0 1px #fff, 0 8px 17px -12px rgba(24, 66, 145, .75); }
.settings-role-confirmation__actions [data-settings-role-confirm] { border-color: rgba(47, 105, 214, .28); color: #1f62cf; }

html[data-theme="night"] .settings-page {
  --settings-ink: #f5f5f7;
  --settings-muted: #9f9fa6;
  --settings-surface: #242529;
  --settings-raised: #2b2c31;
  --settings-edge: rgba(255, 255, 255, .09);
}
html[data-theme="night"] .settings-surface { background: linear-gradient(145deg, rgba(255, 255, 255, .035), transparent), var(--settings-surface); box-shadow: inset 0 1px rgba(255, 255, 255, .045), 0 18px 34px -30px #000; }
html[data-theme="night"] .settings-user-search > span { background: #202125; color: #a5a5ac; }
html[data-theme="night"] .settings-user-search > input,
html[data-theme="night"] .settings-user__role select { border-color: var(--settings-edge); background: #2b2c31; color: #f5f5f7; }
html[data-theme="night"] .settings-user__avatar { border-color: var(--settings-edge); background: linear-gradient(145deg, #3a3b40, #292a2f); color: #f5f5f7; box-shadow: inset 0 1px rgba(255, 255, 255, .08); }
html[data-theme="night"] .settings-surface > header > span { background: rgba(255, 255, 255, .035); }
html[data-theme="night"] .settings-role-confirmation { border-color: rgba(255, 255, 255, .1); background: linear-gradient(145deg, rgba(58, 59, 64, .96), rgba(35, 36, 41, .97)), #27282c; color: #f5f5f7; box-shadow: inset 0 1px rgba(255, 255, 255, .07), 0 16px 34px -24px #000; }
html[data-theme="night"] .settings-role-confirmation__arrow { border-color: rgba(255, 255, 255, .1); background: #38393e; }
html[data-theme="night"] .settings-role-confirmation.is-above .settings-role-confirmation__arrow { background: #25262b; }
html[data-theme="night"] .settings-role-confirmation > p { color: #d3d3d8; }
html[data-theme="night"] .settings-role-confirmation__guidance { color: #a4a4aa !important; }
html[data-theme="night"] .settings-role-confirmation__actions button { border-color: rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .055); color: #dadade; box-shadow: inset 0 1px rgba(255, 255, 255, .06); }
html[data-theme="night"] .settings-role-confirmation__actions [data-settings-role-confirm] { color: #7da8f7; }

@media (max-width: 1200px) {
  .settings-page__layout { grid-template-columns: 1fr; }
  .settings-user-list { max-height: 410px; }
}

@media (max-width: 700px) {
  .settings-page__header { align-items: stretch; flex-direction: column; }
  .settings-user-search { width: 100%; }
  .settings-user { grid-template-columns: 36px minmax(0, 1fr) minmax(100px, 118px); }
  .settings-user__state { grid-column: 2; }
  .settings-user__role { grid-column: 3; grid-row: 1 / span 2; }
}

/* High-density table interaction system. Popovers stay fixed above the table,
   while editability and workflow state are visible without filling active rows. */
.operations-shell .adaptive-container-table table {
  font-size: 11px;
}

.operations-shell .adaptive-container-table th,
.operations-shell .adaptive-container-table td {
  height: 36px;
  min-height: 36px;
  padding: 5px 8px;
}

.adaptive-container-table tbody tr.adaptive-task > td {
  border: 0;
  border-bottom: 1px solid #e6ebf2;
}

.adaptive-container-table tbody tr.adaptive-task > td:first-child {
  border-left: 0;
  padding-left: 14px;
}

.adaptive-task-status-rail {
  position: absolute;
  z-index: 2;
  inset: 3px auto 3px 2px;
  width: 5px;
  min-width: 5px;
  min-height: 0;
  border: 0;
  border-radius: 999px;
  padding: 0;
  background: var(--adaptive-task-accent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--adaptive-task-accent) 32%, transparent);
  cursor: pointer;
  transform-origin: left center;
  transition: transform 190ms cubic-bezier(.22, 1, .36, 1), box-shadow 190ms ease;
}

.adaptive-task-status-rail:hover,
.adaptive-task-status-rail:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--adaptive-task-accent) 18%, transparent), 0 0 13px color-mix(in srgb, var(--adaptive-task-accent) 45%, transparent);
  transform: scaleX(1.75);
}

.adaptive-container-table[data-pan-dragging="true"] {
  cursor: grabbing;
  user-select: none;
}

.adaptive-container-table [data-column-key="container_no"] .dashboard-copy-value,
.adaptive-container-card > button > strong {
  color: var(--adaptive-task-link);
  text-decoration: none;
}

.adaptive-container-table [data-column-key="container_no"] .dashboard-copy-value {
  display: inline-flex;
  min-height: 22px;
  align-items: center;
  border: 1px solid var(--adaptive-task-number-border);
  border-radius: 7px;
  background: var(--adaptive-task-number-fill);
  padding: 3px 7px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72);
  font-weight: 650;
  line-height: 1.1;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.adaptive-container-table [data-column-key="container_no"] .dashboard-copy-value:hover {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82), 0 3px 9px color-mix(in srgb, var(--adaptive-task-number-border) 14%, transparent);
  transform: translateY(-1px);
}

.adaptive-container-table [data-column-key="container_no"] .dashboard-copy-value:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--adaptive-task-number-border) 28%, transparent);
  outline-offset: 2px;
}

.dashboard-cell-value,
.dashboard-copy-value,
.dashboard-copy-icon,
.dashboard-location-button,
.dashboard-note-button,
.dashboard-calendar-button,
.dashboard-pod-folder,
.dashboard-mini-status {
  min-width: 0;
  min-height: 0;
  border: 0;
  background: transparent;
  padding: 0;
  color: inherit;
  font: inherit;
}

.dashboard-identifier-value,
.dashboard-date-value,
.dashboard-location-button,
.dashboard-ctf-tmf {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.dashboard-cell-value,
.dashboard-identifier-value {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dashboard-date-value {
  width: 100%;
  max-width: 100%;
  justify-content: space-between;
  overflow: hidden;
}

.dashboard-date-value > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dashboard-copy-value,
.dashboard-location-button,
.dashboard-note-button,
.dashboard-calendar-button,
.dashboard-pod-folder,
.dashboard-mini-status,
.dashboard-cell-value--editable {
  cursor: pointer;
}

.dashboard-copy-icon,
.dashboard-calendar-button,
.dashboard-note-button,
.dashboard-address-actions button {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 7px;
  color: #587095;
  transition: transform 180ms cubic-bezier(.22, 1, .36, 1),
    box-shadow 180ms ease, color 180ms ease;
}

.dashboard-address-popover {
  width: min(500px, calc(100vw - 28px));
  min-width: 0;
  padding: 0;
}

.dashboard-map-tab {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--floating-glass-border);
  border-radius: 24px;
  background: var(--floating-glass-fill);
  box-shadow: var(--floating-glass-shadow);
  backdrop-filter: var(--floating-glass-filter);
  -webkit-backdrop-filter: var(--floating-glass-filter);
}

.dashboard-map-tab__map {
  position: relative;
  overflow: hidden;
  min-height: 230px;
  border-bottom: 1px solid rgba(95, 108, 127, .13);
  background: #e8edf4;
}

.dashboard-map-tab__canvas { width: 100%; height: 340px; background: linear-gradient(135deg, #e5e8ed, #f4f5f7); }
.dashboard-map-tab__canvas[data-map-unavailable="true"]::after {
  content: "Map unavailable";
  display: grid;
  height: 100%;
  place-items: center;
  color: #777d87;
  font-size: 11px;
}
.dashboard-map-tab__status {
  position: absolute;
  z-index: 2;
  right: 10px;
  bottom: 9px;
  max-width: calc(100% - 20px);
  padding: 6px 9px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .65);
  border-radius: 10px;
  background: rgba(248, 249, 251, .78);
  box-shadow: 0 7px 20px -14px rgba(0, 0, 0, .52);
  backdrop-filter: blur(14px) saturate(1.1);
  -webkit-backdrop-filter: blur(14px) saturate(1.1);
  color: #5e6470;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dashboard-map-tab__status[data-state="saved"] { color: #227a49; }
.dashboard-map-tab__status[data-state="error"] { color: #b74343; }
.dashboard-map-tab__search {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 4;
  display: flex;
  width: min(390px, calc(100% - 24px));
  min-height: 46px;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(96, 108, 126, .18);
  border-radius: 23px;
  background: rgba(255, 255, 255, .94);
  padding: 4px 5px 4px 14px;
  box-shadow: inset 0 1px rgba(255, 255, 255, .96), 0 8px 24px -16px rgba(30, 45, 67, .48);
  backdrop-filter: blur(18px) saturate(1.08);
  -webkit-backdrop-filter: blur(18px) saturate(1.08);
}
.dashboard-map-tab__search-icon {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  fill: none;
  stroke: #7a8492;
  stroke-linecap: round;
  stroke-width: 1.7;
}
.dashboard-map-tab__search label { display: grid; min-width: 0; flex: 1; color: #737b87; font-size: 9px; font-weight: 650; }
.dashboard-map-tab__search input {
  width: 100%;
  min-height: 36px;
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  color: #24262b;
  padding: 6px 2px;
  font: inherit;
  font-size: 11px;
}
.dashboard-map-tab__places-control {
  width: 100%;
  min-height: 36px;
  color-scheme: light;
  font: inherit;
  font-size: 11px;
}
.dashboard-map-tab__search button {
  min-height: 36px;
  border: 1px solid rgba(0, 122, 255, .36);
  border-radius: 999px;
  background: rgba(255, 255, 255, .94);
  box-shadow: inset 0 1px rgba(255, 255, 255, .98), 0 8px 18px -14px rgba(0, 78, 164, .52);
  color: #075fb9;
  padding: 0 14px;
  font-size: 10px;
  font-weight: 700;
  transition: transform 180ms cubic-bezier(.22, 1, .36, 1), box-shadow 180ms ease;
}
.dashboard-map-tab__search button:hover { box-shadow: 0 0 0 3px rgba(0, 122, 255, .1), 0 8px 18px rgba(0, 122, 255, .22); transform: scale(1.04); }
.dashboard-map-tab__search button:disabled { opacity: .42; box-shadow: none; transform: none; cursor: default; }

html[data-theme="night"] .dashboard-map-tab {
  border-color: var(--floating-glass-border);
  background: var(--floating-glass-fill);
}
html[data-theme="night"] .dashboard-map-tab__canvas { background: linear-gradient(135deg, #292a2f, #34363b); }
html[data-theme="night"] .dashboard-map-tab__status { border-color: rgba(255, 255, 255, .08); background: rgba(43, 44, 49, .84); color: #b3b3b9; }
html[data-theme="night"] .dashboard-map-tab__search { border-color: rgba(255, 255, 255, .13); background: rgba(45, 45, 49, .92); color: #f5f5f7; }
html[data-theme="night"] .dashboard-map-tab__search input { background: transparent; color: #f5f5f7; }
html[data-theme="night"] .dashboard-map-tab__places-control { color-scheme: dark; }

@media (max-width: 720px) {
  .dashboard-address-popover { width: min(420px, calc(100vw - 16px)); }
  .dashboard-map-tab { border-radius: 20px; }
  .dashboard-map-tab__map { min-height: 280px; }
  .dashboard-map-tab__canvas { height: 300px; }
  .dashboard-map-tab__search { top: 9px; left: 9px; width: calc(100% - 18px); min-height: 44px; padding-left: 12px; }
  .dashboard-map-tab__search button { min-height: 34px; }
}

.dashboard-copy-icon svg,
.dashboard-calendar-button svg,
.dashboard-note-button svg,
.dashboard-address-actions svg,
.dashboard-location-pin svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.55;
}

.dashboard-copy-icon:hover,
.dashboard-calendar-button:hover,
.dashboard-note-button:hover,
.dashboard-address-actions button:hover {
  color: #1768df;
  box-shadow: 0 0 0 3px rgba(47, 111, 237, .1), 0 5px 14px rgba(34, 75, 140, .13);
  transform: scale(1.09);
}

.dashboard-note-button.has-note {
  border: 1px solid #9f8df3;
  background: #f0ecff;
  color: #6848d8;
}

.dashboard-location-button {
  max-width: 100%;
  color: #334766;
  text-align: left;
}

.dashboard-location-button > span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
}

.dashboard-location-pin {
  display: inline-grid;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  place-items: center;
  color: #ea3e4f;
}

.adaptive-data-chip,
.dashboard-mini-status {
  border: 1px solid color-mix(in srgb, currentColor 43%, transparent);
  border-radius: 7px;
  padding: 3px 6px;
  font-size: 9px;
  font-weight: 680;
}

.dashboard-ctf-tmf {
  width: 100%;
  max-width: 100%;
  gap: 3px;
  overflow: hidden;
  flex-wrap: nowrap;
}

.dashboard-ctf-tmf .dashboard-mini-status { flex: 0 0 auto; }

.dashboard-customer-payment--paid {
  border-color: #c78ca0;
  background: #f9e8ee;
  color: #7c3f54;
}

.dashboard-customer-payment--empty {
  border-color: #d9c8ce;
  background: #f8f3f5;
  color: #8d6b77;
}

.dashboard-mini-status--danger {
  border-color: #f4a5ae;
  background: #fff0f2;
  color: #c52f40;
}

.dashboard-mini-status--warning {
  border-color: #efcf88;
  background: #fff7df;
  color: #9d6907;
}

.dashboard-mini-status--success {
  border-color: #9ed9b5;
  background: #eaf8ef;
  color: #197344;
}

.dashboard-mini-status--neutral {
  border-color: #cfd7e4;
  background: #f2f5f8;
  color: #637086;
}

.dashboard-cell-value--special-fee {
  color: #d63c4c;
  font-weight: 680;
}

.dashboard-cell-value--profit {
  color: #17824a;
  font-weight: 700;
}

.dashboard-pod-folder {
  --folder-color: #ffffff;
  --folder-back-color: #e4e9f1;
  position: relative;
  display: inline-flex;
  width: 32px;
  height: 27px;
  align-items: center;
  justify-content: center;
  overflow: visible;
  border: 0;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  color: #fff;
  transition: transform 210ms cubic-bezier(.22, 1, .36, 1), box-shadow 210ms ease;
}

.dashboard-pod-folder--filled {
  --folder-color: #176ee8;
  --folder-back-color: #0e56bc;
}

.dashboard-pod-folder--empty {
  --folder-color: #ffffff;
  --folder-back-color: #e4e9f1;
  color: #b3bdca;
  cursor: default;
}

.dashboard-pod-folder__back {
  position: relative;
  display: block;
  width: 30px;
  height: 23px;
  border-radius: 3px 7px 7px 7px;
  background: var(--folder-back-color);
  box-shadow: 0 3px 9px rgba(38, 61, 98, .13);
}

.dashboard-pod-folder__back::after {
  position: absolute;
  z-index: 0;
  bottom: 98%;
  left: 0;
  width: 10px;
  height: 4px;
  border-radius: 3px 3px 0 0;
  background: var(--folder-back-color);
  content: '';
}

.dashboard-pod-folder__paper {
  position: absolute;
  z-index: 2;
  bottom: 10%;
  left: 50%;
  width: 70%;
  height: 80%;
  border-radius: 4px;
  background: #e6e6e6;
  transform: translate(-50%, 10%);
  transition: transform 260ms cubic-bezier(.22, 1, .36, 1);
}

.dashboard-pod-folder__paper:nth-child(2) {
  width: 80%;
  height: 70%;
  background: #f2f2f2;
}

.dashboard-pod-folder__paper:nth-child(3) {
  width: 90%;
  height: 60%;
  background: #fff;
}

.dashboard-pod-folder__front {
  position: absolute;
  z-index: 3;
  inset: 0;
  border: 1px solid color-mix(in srgb, var(--folder-color), #15345e 20%);
  border-radius: 3px 7px 7px 7px;
  background: var(--folder-color);
  transform-origin: bottom;
  transition: transform 260ms cubic-bezier(.22, 1, .36, 1);
}

.dashboard-pod-folder:hover,
.dashboard-pod-folder:focus-visible {
  box-shadow: 0 0 16px rgba(47, 128, 237, .28);
  transform: scale(1.12) translateY(-3px);
}

.dashboard-pod-folder:hover .dashboard-pod-folder__paper,
.dashboard-pod-folder:focus-visible .dashboard-pod-folder__paper {
  transform: translate(-50%, 0);
}

.dashboard-pod-folder:hover .dashboard-pod-folder__front,
.dashboard-pod-folder:focus-visible .dashboard-pod-folder__front {
  transform: skew(15deg) scaleY(.6);
}

.dashboard-pod-folder:hover .dashboard-pod-folder__front.right,
.dashboard-pod-folder:focus-visible .dashboard-pod-folder__front.right {
  transform: skew(-15deg) scaleY(.6);
}

.dashboard-pod-viewer {
  position: fixed;
  z-index: 2200;
  inset: 0;
  display: grid;
  place-items: center;
  padding: clamp(18px, 4vw, 64px);
  overflow: hidden;
  background: transparent;
  animation: dashboard-pod-backdrop-in 220ms cubic-bezier(.2, .8, .2, 1) both;
}

.dashboard-pod-viewer__surface {
  position: relative;
  width: min(1180px, 94vw);
  max-height: 90vh;
  color: #172033;
}

.dashboard-pod-viewer__photos {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(14px, 2.4vw, 30px);
  min-height: min(66vh, 620px);
  padding: 18px 16px 30px;
  overflow-x: auto;
  overflow-y: visible;
  scrollbar-width: none;
}

.dashboard-pod-viewer__photos::-webkit-scrollbar {
  display: none;
}

.dashboard-pod-viewer__photo {
  position: relative;
  flex: 0 0 min(31vw, 340px);
  margin: 0;
  isolation: isolate;
  perspective: 1000px;
  transform: rotate(-2deg);
  transform-origin: 50% 74%;
  outline: none;
  transition: filter 240ms ease;
  animation: dashboard-pod-photo-in 260ms cubic-bezier(.2, .8, .2, 1) both;
  animation-delay: calc(var(--pod-photo-index) * 45ms);
}

.dashboard-pod-viewer__photo::before {
  position: absolute;
  z-index: 0;
  inset: -10px;
  border-radius: 30px;
  border: 1px solid rgba(255, 255, 255, .88);
  background: rgba(241, 244, 248, .78);
  box-shadow: inset 0 1px rgba(255, 255, 255, .9), 0 10px 26px -16px rgba(18, 25, 36, .28);
  backdrop-filter: blur(24px) saturate(1.08) brightness(1.02);
  -webkit-backdrop-filter: blur(24px) saturate(1.08) brightness(1.02);
  content: '';
}

.dashboard-pod-viewer__photo:nth-child(even) {
  transform: translateY(10px) rotate(2deg);
}

.dashboard-pod-viewer__photo--has-image:hover,
.dashboard-pod-viewer__photo--has-image:focus {
  z-index: 3;
  filter: saturate(1.06);
}

.dashboard-pod-viewer__photo-inner {
  position: relative;
  z-index: 1;
  width: 100%;
  aspect-ratio: var(--pod-aspect-ratio, 4 / 3);
  transform-style: preserve-3d;
  transition: transform 800ms cubic-bezier(.2, .74, .22, 1);
}

.dashboard-pod-viewer__photo--has-image:hover .dashboard-pod-viewer__photo-inner,
.dashboard-pod-viewer__photo--has-image:focus .dashboard-pod-viewer__photo-inner,
.dashboard-pod-viewer__photo--has-image.is-flipped .dashboard-pod-viewer__photo-inner {
  transform: rotateY(180deg);
}

.dashboard-pod-viewer__front,
.dashboard-pod-viewer__back {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: 25px;
  box-shadow: 0 9px 24px -14px rgba(10, 18, 31, .3), inset 0 1px rgba(255, 255, 255, .62);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.dashboard-pod-viewer__front {
  background: #f4f7fa;
}

.dashboard-pod-viewer__back {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(20px, 2.5vw, 32px);
  border-color: rgba(255, 255, 255, .9);
  background: #eff2f6;
  color: #172033;
  backdrop-filter: blur(26px) saturate(1.06);
  -webkit-backdrop-filter: blur(26px) saturate(1.06);
  transform: rotateY(180deg);
}

.dashboard-pod-viewer__back > strong {
  margin-top: 6px;
  font-size: clamp(17px, 2vw, 23px);
  letter-spacing: .025em;
}

.dashboard-pod-viewer__back dl {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 11px 14px;
  margin: 22px 0 0;
}

.dashboard-pod-viewer__back dl > div {
  min-width: 0;
}

.dashboard-pod-viewer__back dt {
  color: #667188;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.dashboard-pod-viewer__back dd {
  margin: 4px 0 0;
  color: #172033;
  font-size: 11px;
  line-height: 1.35;
}

.dashboard-pod-viewer__back-note {
  padding-top: 9px;
  border-top: 1px solid rgba(77, 92, 119, .14);
}

.dashboard-pod-viewer__image {
  width: 100%;
  height: 100%;
  aspect-ratio: var(--pod-aspect-ratio, 4 / 3);
  overflow: hidden;
  background: #f0f6ff;
}

.dashboard-pod-viewer__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.dashboard-pod-viewer__unavailable {
  display: grid;
  height: 100%;
  place-items: center;
  color: #64738d;
  font-size: 12px;
}

.dashboard-pod-viewer__status {
  display: grid;
  min-height: 280px;
  place-items: center;
  color: #46536c;
  font-size: 13px;
  text-shadow: 0 2px 16px rgba(3, 10, 24, .46);
}

.dashboard-pod-viewer__status.is-error {
  color: #b42338;
}

.pod-upload-editor {
  display: grid;
  gap: 14px;
  padding: 18px;
  color: #1d1d1f;
}

.pod-upload-editor > header p {
  margin: 0 0 4px;
  color: #7a8494;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .15em;
}

.pod-upload-editor > header h2 {
  margin: 0;
  font-size: 20px;
  letter-spacing: -.03em;
}

.pod-upload-editor > header span {
  display: block;
  margin-top: 4px;
  color: #6e7582;
  font-size: 11px;
}

.pod-upload-editor__drop {
  display: grid;
  min-height: 142px;
  place-items: center;
  align-content: center;
  gap: 5px;
  border: 1.5px dashed #2979ff;
  border-radius: 18px;
  background: rgba(32, 119, 255, .035);
  color: #1d1d1f;
  cursor: pointer;
  transition: transform 190ms cubic-bezier(.22, 1, .36, 1), box-shadow 190ms ease, background 190ms ease;
}

.pod-upload-editor__drop:hover,
.pod-upload-editor__drop:focus-within {
  background: rgba(32, 119, 255, .055);
  box-shadow: 0 0 0 4px rgba(0, 122, 255, .09), 0 10px 24px rgba(38, 80, 138, .1);
  transform: translateY(-1px);
}

.pod-upload-editor__drop svg {
  width: 42px;
  height: 42px;
  fill: none;
  stroke: #1473e6;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.35;
}

.pod-upload-editor__drop strong { color: #126bd1; font-size: 13px; }
.pod-upload-editor__drop span { color: #7b8492; font-size: 10px; }
.pod-upload-editor__drop input { position: fixed; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

.pod-upload-editor__assets {
  display: grid;
  gap: 10px;
}

.pod-upload-editor__asset {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(140px, .55fr);
  gap: 9px 12px;
  border: 1px solid rgba(116, 128, 146, .2);
  border-radius: 18px;
  padding: 11px;
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 1px rgba(255, 255, 255, .9) inset, 0 4px 12px rgba(41, 55, 77, .07);
}

.pod-upload-editor__file {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.pod-upload-editor__file > svg {
  width: 17px;
  height: 17px;
  fill: rgba(20, 115, 230, .08);
  stroke: #1473e6;
  stroke-linejoin: round;
  stroke-width: 1.45;
}

.pod-upload-editor__file strong {
  overflow: hidden;
  flex: 1;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pod-upload-editor__file button {
  display: grid;
  width: 28px;
  min-width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid rgba(255, 69, 58, .18);
  border-radius: 50%;
  background: #fff;
  color: #d83b32;
}

.pod-upload-editor__file button svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
}

.pod-upload-editor__note,
.pod-upload-editor__status {
  display: grid;
  gap: 5px;
  color: #4d5767;
  font-size: 10px;
  font-weight: 700;
}

.pod-upload-editor__note em {
  margin-left: 4px;
  color: #d83b32;
  font-size: 8px;
  font-style: normal;
  text-transform: uppercase;
}

.pod-upload-editor textarea,
.pod-upload-editor select {
  width: 100%;
  min-height: 42px;
  border: 1px solid #cbd3df;
  border-radius: 12px;
  padding: 9px 10px;
  background: rgba(255, 255, 255, .94);
  color: #1d1d1f;
  font: inherit;
  resize: vertical;
}

.pod-upload-editor textarea:focus,
.pod-upload-editor select:focus {
  border-color: #1473e6;
  outline: 0;
  box-shadow: 0 0 0 4px rgba(20, 115, 230, .12);
}

.pod-upload-editor__error {
  margin: 0;
  border: 1px solid rgba(216, 59, 50, .18);
  border-radius: 12px;
  padding: 9px 11px;
  background: rgba(255, 69, 58, .055);
  color: #b42318;
  font-size: 11px;
}

.pod-upload-editor__complete-set {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  border: 1px solid rgba(98, 108, 123, .18);
  border-radius: 16px;
  padding: 9px 11px;
  background: rgba(246, 248, 251, .86);
  color: #1d1d1f;
  cursor: pointer;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.pod-upload-editor__complete-set:hover,
.pod-upload-editor__complete-set:focus-within {
  border-color: rgba(20, 115, 230, .4);
  box-shadow: 0 0 0 3px rgba(20, 115, 230, .08);
  transform: translateY(-1px);
}

.pod-upload-editor__complete-set input {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: #1473e6;
}

.pod-upload-editor__complete-set span {
  display: grid;
  gap: 2px;
}

.pod-upload-editor__complete-set strong { font-size: 11px; }
.pod-upload-editor__complete-set small { color: #687384; font-size: 9px; }

@media (max-width: 620px) {
  .pod-upload-editor__asset { grid-template-columns: minmax(0, 1fr); }
  .pod-upload-editor__file { grid-column: auto; }
}

@keyframes dashboard-pod-backdrop-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes dashboard-pod-photo-in {
  from { opacity: 0; transform: translateY(18px) scale(.96); }
  to { opacity: 1; }
}

@media (max-width: 720px) {
  .dashboard-pod-viewer {
    padding: 18px 12px;
  }

  .dashboard-pod-viewer__photos {
    justify-content: flex-start;
    min-height: 62vh;
    scroll-snap-type: x proximity;
  }

  .dashboard-pod-viewer__photo {
    flex-basis: min(78vw, 330px);
    scroll-snap-align: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:not([data-motion="on"]) .dashboard-pod-viewer,
  html:not([data-motion="on"]) .dashboard-pod-viewer__photo {
    animation: none;
  }

  html:not([data-motion="on"]) .dashboard-pod-viewer__photo,
  html:not([data-motion="on"]) .dashboard-pod-viewer__photo-inner {
    transition: none;
  }
}

#dashboardContainerWorkspace.is-edit-mode .adaptive-container-workspace {
  position: relative;
  isolation: isolate;
}

#dashboardContainerWorkspace.is-edit-mode .adaptive-container-workspace::before {
  position: absolute;
  z-index: -1;
  inset: 8% 4%;
  background: center / min(38vw, 480px) no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 220'%3E%3Cg fill='none' stroke='%2319253a' stroke-width='9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M67 166 238 35l42 43L109 209l-58 8Z'/%3E%3Cpath d='m216 53 42 43M70 166l39 43'/%3E%3C/g%3E%3C/svg%3E");
  content: '';
  opacity: .035;
  pointer-events: none;
}

#dashboardContainerWorkspace.is-edit-mode [data-column-editable="true"]:not([data-column-pinned="true"]) {
  position: relative;
}

#dashboardContainerWorkspace.is-edit-mode [data-column-editable="true"] {
  border-inline: 0;
  background: linear-gradient(90deg, rgba(0, 122, 255, .055), rgba(0, 122, 255, .012) 74%, transparent);
  box-shadow: inset 2px 0 #007aff;
}

#dashboardContainerWorkspace.is-edit-mode th[data-column-editable="true"] {
  color: #1f64ad;
  font-weight: 760;
  box-shadow: inset 2px 0 #007aff, 0 2px 7px rgba(0, 122, 255, .07);
}

#dashboardContainerWorkspace.is-edit-mode .adaptive-task--empty-returned [data-column-editable="true"] {
  background: linear-gradient(90deg, rgba(0, 122, 255, .055), rgba(237, 249, 241, .96) 24%);
  box-shadow: inset 2px 0 #007aff;
}

#dashboardContainerWorkspace.is-edit-mode [data-column-editable="true"]:focus-within {
  z-index: 3;
  border-radius: 6px;
  outline: 2px solid rgba(0, 122, 255, .82);
  outline-offset: -2px;
  box-shadow: inset 2px 0 #007aff, 0 0 0 3px rgba(0, 122, 255, .12), 0 0 16px rgba(0, 122, 255, .12);
}

#dashboardContainerWorkspace[aria-busy="true"] [data-column-editable="true"] {
  pointer-events: none;
}

.dashboard-cell-value--editable:hover,
.dashboard-mini-status:hover {
  filter: brightness(1.02);
  transform: scale(1.04);
}

.dashboard-cell-editor-popover,
.dashboard-note-popover,
.dashboard-address-popover {
  display: grid;
  gap: 9px;
  min-width: 190px;
  padding: 10px;
  color: #1a2943;
}

.dashboard-cell-editor-control {
  display: grid;
  gap: 5px;
  color: #65738a;
  font-size: 9px;
  font-weight: 680;
}

.dashboard-cell-editor-control input,
.dashboard-cell-editor-control textarea {
  width: 100%;
  min-height: 34px;
  border: 1px solid rgba(102, 132, 180, .34);
  border-radius: 10px;
  background: rgba(255, 255, 255, .9);
  padding: 7px 9px;
  color: #17243c;
  font-size: 11px;
  outline: none;
}

.dashboard-cell-editor-control input:focus,
.dashboard-cell-editor-control textarea:focus {
  border-color: #3a83ef;
  box-shadow: 0 0 0 3px rgba(58, 131, 239, .13), 0 0 18px rgba(58, 131, 239, .13);
}

.dashboard-floating-options {
  display: flex;
  max-width: 310px;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0;
}

.dashboard-floating-option {
  min-height: 28px;
  border: 1px solid color-mix(in srgb, currentColor 45%, transparent);
  border-radius: 9px;
  padding: 5px 8px;
  font-size: 9px;
  font-weight: 680;
  transition: transform 190ms cubic-bezier(.22, 1, .36, 1), box-shadow 190ms ease;
}

.dashboard-floating-option--paid,
.dashboard-floating-option--empty-returned {
  background: #e3f6ea;
  color: #167344;
}

.dashboard-floating-option--unpaid,
.dashboard-floating-option--pending {
  background: #fff0f2;
  color: #c52f40;
}

.dashboard-floating-option--arrived-at-port {
  background: #ffe8f2;
  color: #be3476;
}

.dashboard-floating-option--available-for-pickup {
  background: #e6f1ff;
  color: #1769cf;
}

.dashboard-floating-option--delivered-to-warehouse {
  background: #eee8ff;
  color: #6844cf;
}

.dashboard-floating-option--cancelled {
  background: #edf0f4;
  color: #687385;
}

.dashboard-floating-option--not-arrived {
  background: #fff;
  color: #627089;
}

.dashboard-floating-option:hover,
.dashboard-floating-option:focus-visible {
  box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 13%, transparent), 0 7px 17px rgba(29, 48, 81, .12);
  transform: scale(1.08);
}

.dashboard-floating-option--40,
.dashboard-floating-option--40hq,
.dashboard-floating-option--45,
.dashboard-floating-option--custom {
  border-color: rgba(75, 95, 124, .2);
  background: rgba(255, 255, 255, .94);
  box-shadow: inset 0 1px rgba(255, 255, 255, .98), 0 5px 14px rgba(38, 48, 64, .08);
  color: #26344a;
}

.dashboard-floating-option--40[aria-selected="true"],
.dashboard-floating-option--40hq[aria-selected="true"],
.dashboard-floating-option--45[aria-selected="true"],
.dashboard-floating-option--custom[aria-selected="true"] {
  border-color: rgba(0, 122, 255, .5);
  box-shadow: inset 0 0 0 1px rgba(0, 122, 255, .18), 0 6px 15px rgba(28, 88, 154, .11);
  color: #075fb9;
}

.dashboard-custom-type-editor {
  display: grid;
  min-width: 210px;
  gap: 6px;
  padding: 10px;
  border: 1px solid rgba(79, 96, 121, .18);
  border-radius: 15px;
  background: rgba(255, 255, 255, .94);
  box-shadow: inset 0 1px rgba(255, 255, 255, .98), 0 13px 28px -20px rgba(28, 39, 56, .42);
  color: #657083;
  font-size: 9px;
  font-weight: 680;
}

.dashboard-custom-type-editor input {
  min-height: 36px;
  border: 1px solid rgba(76, 103, 143, .23);
  border-radius: 11px;
  background: #fff;
  color: #17243c;
  padding: 7px 10px;
  outline: 0;
}

.dashboard-custom-type-editor input:focus {
  border-color: rgba(0, 122, 255, .65);
  box-shadow: 0 0 0 3px rgba(0, 122, 255, .11);
}

.dashboard-driver-trigger {
  position: relative;
  min-width: 92px;
  padding-right: 17px;
  text-align: left;
}

.dashboard-driver-trigger::after {
  position: absolute;
  top: 50%;
  right: 4px;
  width: 5px;
  height: 5px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  content: '';
  opacity: .55;
  transform: translateY(-65%) rotate(45deg);
}

.dashboard-driver-options {
  display: flex;
  width: min(210px, calc(100vw - 24px));
  max-height: min(310px, calc(100vh - 36px));
  flex-direction: column;
  gap: 4px;
  overflow-y: auto;
  padding: 2px;
  scrollbar-width: none;
  animation: dashboard-driver-dropdown-in 210ms cubic-bezier(.22, 1, .36, 1) both;
}

.dashboard-driver-options::-webkit-scrollbar {
  display: none;
}

.dashboard-driver-option {
  display: grid;
  width: 100%;
  min-height: 32px;
  grid-template-columns: minmax(0, 1fr) 14px;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(91, 105, 127, .2);
  border-radius: 11px;
  background: rgba(248, 250, 253, .9);
  box-shadow: inset 0 1px rgba(255, 255, 255, .88), 0 3px 10px rgba(31, 43, 62, .08);
  backdrop-filter: blur(18px) saturate(1.22);
  -webkit-backdrop-filter: blur(18px) saturate(1.22);
  padding: 7px 9px;
  color: #263248;
  font-size: 10px;
  font-weight: 650;
  text-align: left;
  transition: transform 190ms cubic-bezier(.22, 1, .36, 1), border-color 190ms ease, box-shadow 190ms ease;
}

.dashboard-driver-option svg {
  width: 13px;
  height: 13px;
  fill: none;
  opacity: 0;
  stroke: #0a72e8;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.dashboard-driver-option.is-selected {
  border-color: rgba(0, 122, 255, .36);
  background: rgba(231, 243, 255, .94);
  color: #105cae;
}

.dashboard-driver-option.is-selected svg {
  opacity: 1;
}

.dashboard-driver-option:hover,
.dashboard-driver-option:focus-visible {
  z-index: 1;
  border-color: rgba(0, 122, 255, .42);
  outline: 0;
  box-shadow: inset 0 1px rgba(255, 255, 255, .92), 0 0 0 3px rgba(0, 122, 255, .1), 0 9px 20px rgba(23, 65, 112, .16);
  transform: scale(1.035);
}

.dashboard-driver-options--loading,
.dashboard-driver-options--message {
  min-height: 34px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(91, 105, 127, .18);
  border-radius: 11px;
  background: rgba(248, 250, 253, .9);
  box-shadow: inset 0 1px rgba(255, 255, 255, .86), 0 4px 12px rgba(31, 43, 62, .08);
  color: #667085;
  font-size: 10px;
}

.dashboard-driver-options--loading {
  flex-direction: row;
}

.dashboard-driver-options--message button {
  min-height: 26px;
  border: 0;
  border-radius: 8px;
  background: #e7f2ff;
  color: #0a67c8;
}

.dashboard-driver-loading-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #0a84ff;
  box-shadow: 0 0 0 4px rgba(10, 132, 255, .1);
  animation: dashboard-driver-loading 900ms ease-in-out infinite alternate;
}

@keyframes dashboard-driver-dropdown-in {
  from { opacity: 0; transform: translateY(-7px) scale(.98); }
  to { opacity: 1; transform: none; }
}

@keyframes dashboard-driver-loading {
  to { opacity: .38; transform: scale(.72); }
}

.dashboard-address-actions {
  display: flex;
  justify-content: flex-end;
  gap: 5px;
}

.dashboard-address-actions button {
  min-width: 30px;
  min-height: 30px;
  border: 1px solid rgba(99, 126, 172, .2);
  background: rgba(255, 255, 255, .72);
}

.adaptive-container-table tr.is-work-queue-target {
  position: relative;
  z-index: 4;
}

.adaptive-container-table tr.is-work-queue-target::after {
  position: absolute;
  z-index: 7;
  inset: 0;
  border-radius: 5px;
  background: linear-gradient(90deg, #ff3e67, #ffb020, #1fcf93, #2f80ed, #8b5cf6, #ff3e67) 0 0 / 280% 100%;
  content: '';
  pointer-events: none;
  padding: 2px;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: dashboard-rainbow-border 1.45s linear infinite;
}

@keyframes dashboard-rainbow-border {
  to { background-position: 280% 0; }
}

@media (prefers-reduced-motion: reduce) {
  html:not([data-motion="on"]) .adaptive-container-table tr.is-work-queue-target::after {
    animation: none;
    background-position: 50% 0;
  }
}

html[data-motion="off"] .adaptive-container-table tr.is-work-queue-target::after {
  animation: none;
  background-position: 50% 0;
}

@media (max-width: 520px) {
  .operations-shell .dashboard-metrics {
    grid-template-columns: minmax(0, 1fr);
  }
}

.dashboard-overlay-layer {
  position: fixed;
  z-index: 1200;
}

.dashboard-overlay--popover {
  top: var(--dashboard-overlay-top, 64px);
  left: var(--dashboard-overlay-left, auto);
  width: min(360px, calc(100vw - 24px));
  max-height: min(680px, calc(100vh - 84px));
  overflow: auto;
  border: 1px solid var(--floating-glass-border);
  border-radius: 18px;
  background: var(--floating-glass-fill);
  box-shadow: var(--floating-glass-shadow);
  backdrop-filter: var(--floating-glass-filter);
  -webkit-backdrop-filter: var(--floating-glass-filter);
}

.dashboard-overlay--popover::before {
  content: "";
  position: absolute;
  left: var(--dashboard-overlay-arrow-x, 50%);
  width: 12px;
  height: 12px;
  border: 1px solid var(--floating-glass-border);
  background: var(--floating-glass-fill);
  transform: translateX(-50%) rotate(45deg);
  pointer-events: none;
}

.dashboard-overlay--popover[data-placement="bottom"]::before {
  top: -7px;
  border-right: 0;
  border-bottom: 0;
}

.dashboard-overlay--popover[data-placement="top"]::before {
  bottom: -7px;
  border-top: 0;
  border-left: 0;
}

.dashboard-overlay--popover[data-overlay="cell-options"] {
  width: max-content;
  max-width: min(360px, calc(100vw - 24px));
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
  backdrop-filter: none;
}

.dashboard-overlay--popover[data-overlay="driver-options"] {
  width: max-content;
  max-width: calc(100vw - 24px);
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

@media (max-width: 720px) {
  .dashboard-driver-option {
    min-height: 44px;
    font-size: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:not([data-motion="on"]) .dashboard-driver-options,
  html:not([data-motion="on"]) .dashboard-driver-loading-dot {
    animation: none;
  }

  html:not([data-motion="on"]) .dashboard-driver-option {
    transition: none;
  }
}

html[data-motion="off"] .dashboard-driver-options,
html[data-motion="off"] .dashboard-driver-loading-dot {
  animation: none;
}

html[data-motion="off"] .dashboard-driver-option {
  transition: none;
}

.dashboard-overlay--popover[data-overlay="address"] {
  width: max-content;
  max-width: min(360px, calc(100vw - 24px));
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
  backdrop-filter: none;
}

.dashboard-filter-popover,
.dashboard-filter-form {
  display: grid;
  gap: 12px;
}

.dashboard-filter-popover {
  padding: 14px;
}

.dashboard-filter-form__heading,
.dashboard-filter-form__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.dashboard-filter-form__heading button {
  width: 30px;
  min-width: 30px;
  height: 30px;
  padding: 0;
  border-radius: 50%;
}

.dashboard-filter-form label,
.dashboard-filter-form fieldset {
  display: grid;
  gap: 5px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  color: #4d5f7c;
  font-size: 11px;
  font-weight: 650;
}

.dashboard-filter-form input,
.dashboard-filter-form select {
  min-height: 38px;
  border: 1px solid rgba(112, 137, 178, .3);
  border-radius: 11px;
  background: rgba(255, 255, 255, .88);
}

.dashboard-filter-statuses {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.dashboard-filter-statuses label {
  display: inline-flex;
  grid-template-columns: none;
  align-items: center;
  min-height: 30px;
  padding: 5px 8px;
  border: 1px solid rgba(98, 126, 174, .2);
  border-radius: 10px;
  background: rgba(255, 255, 255, .72);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.dashboard-filter-statuses label:hover {
  transform: scale(1.035);
  border-color: rgba(47, 111, 237, .48);
  box-shadow: 0 0 0 3px rgba(47, 111, 237, .09);
}

.dashboard-filter-statuses input {
  width: 14px;
  min-height: 14px;
  margin: 0;
}

.operations-shell .topbar-date--range {
  gap: 6px;
  min-width: 132px;
  padding: 5px 8px;
  font-size: 10px;
}

.operations-shell .topbar-date--range input {
  width: 98px;
  min-height: 28px;
  padding: 2px 4px;
  border: 0;
  background: transparent;
  color: #24334f;
  font-size: 10px;
}

.topbar-compact-action {
  min-width: 36px;
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid rgba(105, 132, 178, .25);
  border-radius: 11px;
  background: rgba(255, 255, 255, .72);
  color: #2c3e5c;
  box-shadow: inset 0 1px rgba(255, 255, 255, .92), 0 6px 18px rgba(35, 55, 92, .07);
  backdrop-filter: blur(16px);
}

.dashboard-edit-button {
  position: relative;
  display: flex;
  width: 100px;
  height: 40px;
  flex: 0 0 100px;
  align-items: center;
  justify-content: flex-start;
  padding: 0 20px;
  border: 1px solid rgba(78, 102, 137, .22);
  border-radius: 13px;
  background: rgba(255, 255, 255, .94);
  box-shadow: inset 0 1px rgba(255, 255, 255, .98), 0 9px 22px -16px rgba(31, 52, 82, .5);
  color: #1468c4;
  cursor: pointer;
  font-weight: 500;
  transition: transform .24s cubic-bezier(.22, 1, .36, 1), box-shadow .24s ease, border-color .24s ease;
}

.dashboard-edit-button__label {
  color: inherit;
  transition: color .3s ease;
}

.dashboard-edit-button__icon {
  position: absolute;
  right: 0;
  width: 13px;
  margin-right: 20px;
  fill: currentColor;
  transition: right .3s ease, margin .3s ease;
}

.dashboard-edit-button:hover {
  border-color: rgba(0, 122, 255, .42);
  box-shadow: inset 0 1px #fff, 0 0 0 3px rgba(0, 122, 255, .08), 0 12px 24px -16px rgba(19, 72, 132, .52);
  transform: translateY(-1px) scale(1.02);
}

.dashboard-edit-button[aria-pressed="true"] {
  border-color: rgba(0, 122, 255, .58);
  background: rgba(247, 251, 255, .98);
  box-shadow: inset 0 0 0 1px rgba(0, 122, 255, .16), 0 9px 22px -16px rgba(0, 87, 184, .52);
}

.dashboard-edit-button:focus-visible {
  outline: 3px solid rgba(35, 98, 219, .34);
  outline-offset: 3px;
}

.dashboard-load-status {
  display: flex;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #71809a;
  font-size: 10px;
}

@media (prefers-reduced-motion: reduce) {
  html:not([data-motion="on"]) .dashboard-filter-statuses label {
    transition: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:not([data-motion="on"]) .adaptive-container-workspace *,
  html:not([data-motion="on"]) .operations-dashboard-layout * {
    transition: none !important;
    animation: none !important;
  }
}

/* Approved modern KPI and floating Task visual master.
   Approved refined iOS KPI surface: shared by the Dashboard operational strip
   and the Status summary while keeping their real metrics. */
.operations-shell .dashboard-metrics {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(8px, .75vw, 14px);
  margin-bottom: 12px;
}

.operations-shell .dashboard-metric-card {
  --metric-surface: rgba(255, 255, 255, .94);
  --metric-accent: #2563eb;
  --metric-accent-rgb: 37, 99, 235;
  position: relative;
  display: grid;
  block-size: clamp(108px, 6.6vw, 128px);
  min-height: 0;
  align-content: start;
  overflow: visible;
  padding: clamp(8px, .55vw, 11px);
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: clamp(15px, 1.05vw, 19px);
  background:
    linear-gradient(155deg, rgba(255, 255, 255, .99) 0 52%, rgba(var(--metric-accent-rgb), .07) 100%),
    var(--metric-surface);
  box-shadow: 0 12px 32px rgba(31, 41, 55, .07), 0 2px 8px rgba(31, 41, 55, .035);
  backdrop-filter: blur(10px) saturate(1.04);
  -webkit-backdrop-filter: blur(10px) saturate(1.04);
  transition: transform 200ms cubic-bezier(.2, .8, .2, 1), box-shadow 200ms ease;
}

.operations-shell .dashboard-metric-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 40px rgba(31, 41, 55, .105), 0 3px 10px rgba(31, 41, 55, .04);
}

.operations-shell .dashboard-metric-card--active {
  --metric-accent: #f28c18;
  --metric-accent-rgb: 242, 140, 24;
}

.operations-shell .dashboard-metric-card--action {
  --metric-accent: #7c3aed;
  --metric-accent-rgb: 124, 58, 237;
}

.operations-shell .dashboard-metric-card--due {
  --metric-accent: #e7a800;
  --metric-accent-rgb: 231, 168, 0;
}

.operations-shell .dashboard-metric-card--risk {
  --metric-accent: #f04438;
  --metric-accent-rgb: 240, 68, 56;
}

.operations-shell .dashboard-metric-card--completed {
  --metric-accent: #28a65a;
  --metric-accent-rgb: 40, 166, 90;
}

.operations-shell .dashboard-metric-card--revenue {
  --metric-accent: #246bfe;
  --metric-accent-rgb: 36, 107, 254;
}

.operations-shell .dashboard-metric-card__heading {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: clamp(5px, .38vw, 7px);
}

.operations-shell .dashboard-metric-card__icon {
  display: grid;
  width: clamp(28px, 1.7vw, 34px);
  height: clamp(28px, 1.7vw, 34px);
  flex: 0 0 clamp(28px, 1.7vw, 34px);
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .62);
  border-radius: clamp(11px, .85vw, 14px);
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.36), transparent 38%),
    linear-gradient(145deg, color-mix(in srgb, var(--metric-accent) 86%, white), var(--metric-accent));
  box-shadow: 0 9px 22px rgba(var(--metric-accent-rgb), .18), inset 0 1px rgba(255,255,255,.44);
  color: #fff;
}

.operations-shell .dashboard-metric-card__icon svg {
  width: clamp(15px, 1vw, 18px);
  height: clamp(15px, 1vw, 18px);
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.operations-shell .dashboard-metric-card__heading > span:not(.dashboard-metric-card__icon) {
  overflow: hidden;
  min-width: 0;
  color: #0f172a;
  font-size: clamp(10px, .64vw, 11px);
  font-weight: 650;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.operations-shell .dashboard-metric-card__trend {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin-left: auto;
  padding: 2px 5px;
  border-radius: 10px;
  background: rgba(16, 185, 129, .08);
  color: #2f9b57;
  font-size: clamp(9px, .54vw, 10px);
  font-weight: 750;
  white-space: nowrap;
}
.operations-shell .dashboard-metric-card__trend i { font-size: 10px; font-style: normal; }
.operations-shell .dashboard-metric-card__trend--down { background: rgba(239,68,68,.075); color: #cf554d; }
.operations-shell .dashboard-metric-card__trend--flat,
.operations-shell .dashboard-metric-card__trend--unavailable { background: rgba(100,116,139,.07); color: #8b909a; }

.operations-shell .dashboard-metric-card__value {
  margin-top: clamp(3px, .32vw, 5px);
  color: #0f172a;
  font-size: clamp(23px, 1.5vw, 30px);
  font-weight: 650;
  letter-spacing: -.035em;
  line-height: 1;
}

.operations-shell .dashboard-metric-card small {
  margin-top: 2px;
  color: #94a3b8;
  font-size: clamp(9px, .56vw, 10px);
  font-weight: 550;
}

.operations-shell .dashboard-metric-card__trend-value {
  color: inherit;
}

/* Shared KPI micro-chart: the same truthful monthly interaction is used by
   Dashboard and Status cards. */
.kpi-sparkline {
  --kpi-line: var(--metric-accent, var(--kpi-color, #4f7fe8));
  position: relative;
  min-width: 0;
  height: clamp(20px, 1.35vw, 26px);
  margin-top: auto;
  padding-top: 4px;
  cursor: crosshair;
}
.kpi-sparkline > svg { display: block; width: 100%; height: 100%; overflow: visible; }
.kpi-sparkline__baseline { stroke: rgba(148, 163, 184, .3); stroke-dasharray: 3 4; stroke-width: 1; vector-effect: non-scaling-stroke; }
.kpi-sparkline__area-stop--top { stop-color: var(--kpi-line); stop-opacity: .26; }
.kpi-sparkline__area-stop--bottom { stop-color: var(--kpi-line); stop-opacity: .025; }
.kpi-sparkline__area { pointer-events: none; }
.kpi-sparkline__line { fill: none; stroke: var(--kpi-line); stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.25; vector-effect: non-scaling-stroke; }
.kpi-sparkline__cursor { opacity: 0; stroke: color-mix(in srgb, var(--kpi-line) 68%, #667085); stroke-dasharray: 2.5 3; stroke-width: 1; vector-effect: non-scaling-stroke; transition: opacity 140ms ease, x1 120ms linear, x2 120ms linear; }
.kpi-sparkline__point { opacity: 0; fill: var(--kpi-line); stroke: #fff; stroke-width: 2; transform-box: fill-box; transform-origin: center; vector-effect: non-scaling-stroke; transition: opacity 140ms ease, transform 160ms cubic-bezier(.2, .8, .2, 1); }
.kpi-sparkline__point.is-selected { opacity: 1; transform: scale(1.22); }
.kpi-sparkline__tooltip { position: absolute; z-index: 3; bottom: calc(100% + 4px); left: clamp(34px, var(--kpi-cursor), calc(100% - 34px)); display: grid; min-width: 66px; padding: 5px 7px; border: 1px solid #e0e5ec; border-radius: 9px; background: rgba(255, 255, 255, .97); box-shadow: 0 8px 18px -14px rgba(25, 34, 50, .6); opacity: 0; pointer-events: none; text-align: center; transform: translate(-50%, 3px); transition: left 120ms linear, opacity 140ms ease, transform 140ms ease; }
.kpi-sparkline__tooltip small { margin: 0; color: #7b818c; font-size: 7px; }
.kpi-sparkline__tooltip b { color: #222833; font-size: 9px; font-variant-numeric: tabular-nums; }
.kpi-sparkline:hover .kpi-sparkline__cursor,
.kpi-sparkline:focus-within .kpi-sparkline__cursor,
.kpi-sparkline:hover .kpi-sparkline__tooltip,
.kpi-sparkline:focus-within .kpi-sparkline__tooltip { opacity: 1; }
.kpi-sparkline:hover .kpi-sparkline__tooltip,
.kpi-sparkline:focus-within .kpi-sparkline__tooltip { transform: translate(-50%, 0); }

.dashboard-weather-card {
  position: relative;
  block-size: clamp(108px, 6.6vw, 128px);
  min-height: 0;
  overflow: hidden;
  padding: clamp(8px, .55vw, 11px);
  border: 1px solid rgba(214, 187, 92, .2);
  border-radius: clamp(15px, 1.05vw, 19px);
  background: radial-gradient(120% 100% at 20% 115%, rgba(255, 244, 171, .68) 0, rgba(255, 248, 201, 0) 68%), rgba(255,255,255,.95);
  box-shadow: 0 12px 32px rgba(31, 41, 55, .07), 0 2px 8px rgba(31, 41, 55, .035);
  color: #544d39;
  transition: transform 240ms cubic-bezier(.2, .8, .2, 1), box-shadow 240ms ease;
}
.dashboard-weather-card:hover { transform: translateY(-2px) scale(1.015); box-shadow: 0 14px 26px -19px rgba(64, 55, 30, .48); }
.dashboard-weather-card header { position: relative; z-index: 2; display: grid; gap: 2px; max-width: 62%; }
.dashboard-weather-card header strong { font-size: clamp(10px, .68vw, 12px); }
.dashboard-weather-card header span { color: rgba(84, 77, 57, .58); font-size: clamp(9px, .58vw, 10px); }
.dashboard-weather-card__temperature { position: absolute; z-index: 2; bottom: clamp(12px, .8vw, 16px); left: clamp(8px, .55vw, 11px); font-size: clamp(24px, 1.55vw, 31px); letter-spacing: -.055em; line-height: 1; }
.dashboard-weather-card footer { position: absolute; right: 12px; bottom: 10px; display: grid; justify-items: end; gap: 2px; }
.dashboard-weather-card footer span { padding: 4px 7px; border-radius: 8px; background: rgba(84, 77, 57, .075); font-size: 8px; font-weight: 650; }
.dashboard-weather-card footer a { color: rgba(84, 77, 57, .48); font-size: 6px; text-decoration: none; }
.dashboard-weather-scene { position: absolute; top: 1px; right: 4px; width: 82px; height: 78px; transform: scale(.52); transform-origin: top right; }
.dashboard-weather-sun { position: absolute; top: 8px; right: 12px; width: 48px; height: 48px; border-radius: 50%; background: #ffd43b; box-shadow: 0 0 22px rgba(255, 212, 59, .18); animation: weather-sun-pulse 4.6s ease-in-out infinite; }
.dashboard-weather-cloud { position: absolute; width: 38px; height: 18px; border-radius: 999px; background: #65a0eb; animation: weather-cloud-drift 8s ease-in-out infinite; }
.dashboard-weather-cloud::before,
.dashboard-weather-cloud::after { position: absolute; bottom: 0; border-radius: 50%; background: inherit; content: ''; }
.dashboard-weather-cloud::before { left: 5px; width: 20px; height: 24px; }
.dashboard-weather-cloud::after { right: 4px; width: 16px; height: 20px; }
.dashboard-weather-cloud--front { top: 44px; left: 5px; z-index: 2; }
.dashboard-weather-cloud--back { top: 30px; right: 0; width: 31px; transform: scale(.8); animation-duration: 11s; }
.dashboard-weather-scene--clear .dashboard-weather-cloud { opacity: 0; }
.dashboard-weather-scene--cloudy .dashboard-weather-sun,
.dashboard-weather-scene--rain .dashboard-weather-sun,
.dashboard-weather-scene--storm .dashboard-weather-sun { opacity: .28; }
.dashboard-weather-scene--cloudy .dashboard-weather-cloud,
.dashboard-weather-scene--rain .dashboard-weather-cloud,
.dashboard-weather-scene--storm .dashboard-weather-cloud { background: #91a1b7; }
.dashboard-weather-scene--snow .dashboard-weather-cloud { background: #b8cae2; }

@keyframes weather-cloud-drift { 0%, 100% { translate: 4px 0; } 50% { translate: -4px 1px; } }
@keyframes weather-sun-pulse { 0%, 100% { transform: scale(.98); } 50% { transform: scale(1.04); } }

html[data-motion="off"] .dashboard-weather-sun,
html[data-motion="off"] .dashboard-weather-cloud { animation: none; }

html[data-theme="night"] .kpi-sparkline__point { stroke: #1c1c1e; }
html[data-theme="night"] .kpi-sparkline__tooltip { border-color: #3a3a3c; background: rgba(38, 38, 41, .98); }
html[data-theme="night"] .kpi-sparkline__tooltip b { color: #f5f5f7; }
html[data-theme="night"] .dashboard-weather-card { border-color: #454132; background: radial-gradient(120% 100% at 20% 115%, #383420 0, rgba(56, 52, 32, 0) 68%), #1c1c1e; color: #f5f5f7; }
html[data-theme="night"] .dashboard-weather-card header span,
html[data-theme="night"] .dashboard-weather-card footer a { color: #a9a38e; }
html[data-theme="night"] .dashboard-weather-card footer span { background: rgba(255, 255, 255, .07); }

@media (prefers-reduced-motion: reduce) {
  .dashboard-weather-sun,
  .dashboard-weather-cloud { animation: none; }
  .dashboard-weather-card,
  .kpi-sparkline__cursor,
  .kpi-sparkline__point,
  .kpi-sparkline__tooltip { transition: none; }
}

html body #todayWorkQueueHost.floating-work-queue-host {
  width: 240px;
}

html body .floating-work-queue-host .today-work-queue {
  gap: 7px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

html body .floating-work-queue-host .today-work-queue__pin {
  width: 28px;
  min-height: 28px;
  margin-right: 8px;
  border-color: var(--floating-glass-border);
  border-radius: 9px;
  background: var(--floating-glass-fill);
  box-shadow: var(--floating-glass-shadow);
  backdrop-filter: var(--floating-glass-filter);
  -webkit-backdrop-filter: var(--floating-glass-filter);
}

html body .floating-work-queue-host .today-work-queue__list {
  gap: 7px;
  padding: 2px 8px 10px 32px;
}

html body .floating-work-queue-host .today-work-queue__item,
html body .floating-work-queue-host .today-work-queue-card {
  width: 200px;
}

html body .floating-work-queue-host .today-work-queue-card {
  --queue-accent: #f04438;
  position: relative;
  display: grid;
  min-height: 62px;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  align-content: center;
  column-gap: 12px;
  row-gap: 4px;
  overflow: hidden;
  border: 1px solid rgba(152, 162, 179, .26);
  border-radius: 12px;
  background: var(--work-queue-card-surface);
  box-shadow: var(--work-queue-card-shadow);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  color: #17223b;
  padding: 10px 12px 9px 18px;
  text-align: left;
  transform: translateX(calc(-22px * var(--work-queue-proximity, 0)));
}

html body .floating-work-queue-host .today-work-queue-card::before {
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 6px;
  width: 3px;
  border-radius: 999px;
  background: var(--queue-accent);
  box-shadow: 0 0 9px var(--queue-accent);
  content: '';
}

html body .floating-work-queue-host .today-work-queue-card--action-required {
  --queue-accent: #ff4d5e;
  border-color: rgba(255, 77, 94, .15);
  background: rgba(255, 250, 251, .91);
}

html body .floating-work-queue-host .today-work-queue-card--progressing {
  --queue-accent: #f59e0b;
  border-color: rgba(245, 158, 11, .16);
  background: rgba(255, 252, 247, .91);
}

html body .floating-work-queue-host .today-work-queue-card--completed {
  --queue-accent: #18a957;
  border-color: rgba(24, 169, 87, .17);
  background: rgba(236, 253, 245, .92);
  box-shadow: 0 8px 22px rgba(24, 169, 87, .11), inset 0 1px rgba(255, 255, 255, .92);
}

html body .floating-work-queue-host .today-work-queue-card--tone-arrived,
html body .floating-work-queue-host .today-work-queue-card--tone-pending {
  --queue-accent: #ff4d5e;
  border-color: rgba(255, 77, 94, .15);
  background: rgba(255, 250, 251, .91);
}

html body .floating-work-queue-host .today-work-queue-card--tone-available {
  --queue-accent: #f59e0b;
  border-color: rgba(245, 158, 11, .16);
  background: rgba(255, 252, 247, .91);
}

html body .floating-work-queue-host .today-work-queue-card--tone-delivered {
  --queue-accent: #8b5cf6;
  border-color: rgba(139, 92, 246, .16);
  background: rgba(252, 250, 255, .91);
}

html body .floating-work-queue-host .today-work-queue-card--tone-cancelled,
html body .floating-work-queue-host .today-work-queue-card--tone-neutral {
  --queue-accent: #98a2b3;
  border-color: rgba(152, 162, 179, .18);
  background: rgba(252, 253, 254, .91);
}

html body .floating-work-queue-host .today-work-queue-card--tone-empty-returned {
  --queue-accent: #18a957;
  border-color: rgba(24, 169, 87, .17);
  background: rgba(236, 253, 245, .92);
  box-shadow: 0 8px 22px rgba(24, 169, 87, .11), inset 0 1px rgba(255, 255, 255, .92);
}

/* Work Queue meaning takes precedence over the container-status tone.
   Status colors remain available in the table and status text, while queue
   cards consistently group the current role's work as blue / yellow / green. */
html body .floating-work-queue-host .today-work-queue-card--action-required {
  --queue-accent: #0a84ff;
  border-color: rgba(10, 132, 255, .24);
  background: var(--work-queue-card-surface);
  box-shadow: var(--work-queue-card-shadow), 0 0 0 1px rgba(10, 132, 255, .04);
}

html body .floating-work-queue-host .today-work-queue-card--at-risk,
html body .floating-work-queue-host .today-work-queue-card--tone-at-risk {
  --queue-accent: #ff4d5e;
  border-color: rgba(255, 77, 94, .32);
  background: rgba(255, 249, 250, .96);
  box-shadow: var(--work-queue-card-shadow), 0 0 0 1px rgba(255, 77, 94, .09);
}

html body .floating-work-queue-host .today-work-queue-card--progressing {
  --queue-accent: #e9a514;
  border-color: rgba(233, 165, 20, .24);
  background: var(--work-queue-card-surface);
  box-shadow: var(--work-queue-card-shadow), 0 0 0 1px rgba(233, 165, 20, .04);
}

html body .floating-work-queue-host .today-work-queue-card--completed {
  --queue-accent: #18a957;
  border-color: rgba(24, 169, 87, .22);
  background: var(--work-queue-card-surface);
  box-shadow: var(--work-queue-card-shadow), 0 0 0 1px rgba(24, 169, 87, .04);
}

html body .floating-work-queue-host .today-work-queue-card strong {
  grid-column: 1;
  grid-row: 1;
  overflow: hidden;
  font-size: 11px;
  font-weight: 680;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html body .floating-work-queue-host .today-work-queue-card__status {
  grid-column: 1;
  grid-row: 2;
  overflow: hidden;
  color: #637491;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html body .floating-work-queue-host .today-work-queue-card time {
  display: grid;
  grid-column: 2;
  grid-row: 1 / 3;
  align-content: space-between;
  justify-items: end;
  margin: 0;
  color: #58709a;
  font-size: 10px;
  line-height: 1.2;
}

html body .floating-work-queue-host .today-work-queue-card__date,
html body .floating-work-queue-host .today-work-queue-card__clock {
  display: block;
  white-space: nowrap;
}

html[data-theme="night"] body .floating-work-queue-host .today-work-queue-card {
  color: #f5f5f7;
}

html[data-theme="night"] body .floating-work-queue-host .today-work-queue-card__status,
html[data-theme="night"] body .floating-work-queue-host .today-work-queue-card time {
  color: #b7c0ce;
}

@media (max-width: 1180px) and (min-width: 900px) {
  .operations-shell .dashboard-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1600px) and (min-width: 1181px) {
  .operations-shell .dashboard-metric-card,
  .dashboard-weather-card { padding: 9px; }
  .operations-shell .dashboard-metric-card__heading { gap: 5px; }
  .operations-shell .dashboard-metric-card__icon { width: 28px; height: 28px; flex-basis: 28px; border-radius: 10px; }
  .operations-shell .dashboard-metric-card__icon svg { width: 15px; height: 15px; }
  .operations-shell .dashboard-metric-card__heading > span:not(.dashboard-metric-card__icon) { font-size: 10px; }
  .operations-shell .dashboard-metric-card__trend { padding: 2px 4px; font-size: 9px; }
  .operations-shell .dashboard-metric-card__value { font-size: 26px; }
}

@media (max-width: 899px) {
  .operations-shell .dashboard-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .operations-shell .dashboard-metric-card { block-size: 104px; }

  .dashboard-weather-card { block-size: 104px; }
}

@media (max-width: 520px) {
  .operations-shell .dashboard-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .operations-shell .dashboard-metric-card,
  .dashboard-weather-card { block-size: 100px; padding: 8px; border-radius: 15px; }
  .operations-shell .dashboard-metric-card__icon { width: 27px; height: 27px; flex-basis: 27px; border-radius: 9px; }
  .operations-shell .dashboard-metric-card__icon svg { width: 14px; height: 14px; }
  .operations-shell .dashboard-metric-card__heading > span:not(.dashboard-metric-card__icon) { font-size: 10px; }
  .operations-shell .dashboard-metric-card__trend { padding: 2px 3px; font-size: 8.5px; }
  .operations-shell .dashboard-metric-card__value { margin-top: 3px; font-size: 22px; }
  .operations-shell .dashboard-metric-card small { margin-top: 1px; font-size: 9px; }
  .kpi-sparkline { height: 19px; padding-top: 2px; }
  .dashboard-weather-card__temperature { bottom: 10px; left: 8px; font-size: 23px; }
  .dashboard-weather-scene { transform: scale(.5); }
}

/* Compact desktop shell: glass navigation lives in the top information rail. */
@media (min-width: 900px) {
  html body .app-shell.operations-shell,
  html body .app-shell.operations-shell.is-sidebar-collapsed {
    display: block;
  }

  html body .operations-shell > .shell-sidebar.shell-navigation {
    display: none;
  }

  html body .operations-shell .topbar {
    min-height: 54px;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px;
    padding: 5px 16px;
  }

  .operations-shell .topbar > * {
    align-self: center;
  }

  .operations-shell .desktop-top-brand {
    position: static;
  }

  .operations-shell .top-glass-navigation {
    position: static;
    z-index: 5;
    margin-left: clamp(72px, 20vw, 560px);
    transform: none;
  }

  .operations-shell .topbar-spacer {
    min-width: 4px;
    flex: 1 1 auto;
  }

  .operations-shell .shell-profile-menu {
    position: static;
    margin: 0;
  }
}

@media (min-width: 900px) and (max-width: 1180px) {
  html body .operations-shell .topbar {
    gap: 6px;
    padding-inline: 12px;
  }

  .operations-shell .desktop-top-brand small {
    display: none;
  }

  .operations-shell .top-glass-navigation {
    margin-left: 16px;
  }

  .operations-shell .topbar-date--range {
    min-width: 92px;
    flex: 0 1 102px;
  }

  .operations-shell .topbar-date--range input {
    width: 72px;
  }

  .operations-shell .topbar-search {
    min-width: 130px;
    flex: 0 1 180px;
  }
}

.desktop-top-brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  color: #111d36;
  line-height: 1;
  white-space: nowrap;
}

.desktop-top-brand__mark {
  display: block;
  width: clamp(118px, 8.6vw, 148px);
  height: auto;
}

.top-glass-navigation {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  align-self: center;
  gap: 5px;
  line-height: 1;
}

.top-glass-navigation .icon-btn {
  position: relative;
  display: inline-grid;
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  place-items: center;
  border: 0;
  border-radius: 12px;
  background: transparent;
  padding: 0;
  color: #60708c;
  cursor: pointer;
  perspective: 240px;
  transform-style: preserve-3d;
  -webkit-tap-highlight-color: transparent;
}

.top-glass-navigation .icon-btn__back,
.top-glass-navigation .icon-btn__front,
.top-glass-navigation .icon-btn__label {
  transition: opacity 220ms cubic-bezier(.22, 1, .36, 1),
    transform 220ms cubic-bezier(.22, 1, .36, 1),
    box-shadow 220ms ease;
}

.top-glass-navigation .icon-btn__back,
.top-glass-navigation .icon-btn__front {
  position: absolute;
  inset: 0;
  border-radius: 12px;
}

.top-glass-navigation .icon-btn__back {
  display: block;
  opacity: .58;
  transform: rotate(12deg);
  transform-origin: 100% 100%;
  box-shadow: 5px -5px 12px rgba(25, 43, 72, .12);
}

.top-glass-navigation .icon-btn__back--blue { background: linear-gradient(145deg, #2468f2, #2296ef); }
.top-glass-navigation .icon-btn__back--green { background: linear-gradient(145deg, #22a35a, #42c86f); }
.top-glass-navigation .icon-btn__back--indigo { background: linear-gradient(145deg, #6558e8, #4268dd); }
.top-glass-navigation .icon-btn__back--orange { background: linear-gradient(145deg, #f09a2b, #f37036); }

.top-glass-navigation .icon-btn__front {
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .84);
  background: rgba(251, 253, 255, .78);
  box-shadow: inset 0 1px rgba(255, 255, 255, .96), 0 7px 17px rgba(31, 53, 87, .09);
  color: #5d6e89;
  backdrop-filter: blur(16px) saturate(1.18);
  -webkit-backdrop-filter: blur(16px) saturate(1.18);
  transform-origin: 80% 50%;
}

.top-glass-navigation .icon-btn:hover,
.top-glass-navigation .icon-btn:focus-visible,
.top-glass-navigation .icon-btn.active {
  z-index: 2;
  outline: none;
}

.top-glass-navigation .icon-btn:hover .icon-btn__back,
.top-glass-navigation .icon-btn:focus-visible .icon-btn__back {
  transform: rotate(22deg) translate3d(-4px, -4px, 7px);
  box-shadow: 0 0 0 3px rgba(47, 111, 237, .07), 7px -7px 16px rgba(29, 78, 151, .17);
}

.top-glass-navigation .icon-btn:hover .icon-btn__front,
.top-glass-navigation .icon-btn:focus-visible .icon-btn__front {
  color: #1768df;
  transform: translate3d(0, 0, 18px) scale(1.055);
  box-shadow: inset 0 1px rgba(255, 255, 255, .98), 0 0 0 3px rgba(47, 111, 237, .08), 0 10px 24px rgba(36, 81, 153, .16);
}

.top-glass-navigation .icon-btn.active .icon-btn__front {
  border-color: rgba(47, 111, 237, .42);
  color: #1768df;
  box-shadow: inset 0 1px rgba(255, 255, 255, .96), 0 0 0 3px rgba(47, 111, 237, .08), 0 8px 20px rgba(36, 81, 153, .13);
}

.top-glass-navigation .icon-btn__icon,
.top-glass-navigation .icon-btn__icon svg {
  width: 17px;
  height: 17px;
}

.top-glass-navigation .icon-btn__icon svg {
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.top-glass-navigation .icon-btn__icon {
  display: grid;
  place-items: center;
}

.top-glass-navigation .icon-btn__label {
  position: absolute;
  top: calc(100% + 7px);
  left: 50%;
  z-index: 4;
  width: max-content;
  max-width: 150px;
  padding: 4px 7px;
  border: 1px solid rgba(119, 143, 180, .2);
  border-radius: 7px;
  background: rgba(24, 35, 57, .9);
  box-shadow: 0 8px 20px rgba(19, 30, 49, .18);
  color: #fff;
  font-size: 9px;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -3px);
  transition: opacity 150ms ease, transform 150ms ease;
}

.top-glass-navigation .icon-btn:hover .icon-btn__label,
.top-glass-navigation .icon-btn:focus-visible .icon-btn__label {
  opacity: 1;
  transform: translate(-50%, 0);
}

.top-add-launcher {
  position: relative;
  display: inline-grid;
  height: 34px;
  place-items: center;
}

.top-add-options {
  position: absolute;
  top: calc(100% + 12px);
  left: 50%;
  z-index: 30;
  display: grid;
  width: max-content;
  gap: 8px;
  padding: 0;
  background: transparent;
  transform: translateX(-50%);
}

.top-add-options[hidden] { display: none; }

.top-add-option {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  gap: 7px;
  padding: 5px 10px;
  border: 1px solid color-mix(in srgb, var(--top-add-color) 42%, white);
  border-radius: 13px;
  background: color-mix(in srgb, var(--top-add-color) 10%, var(--floating-glass-fill));
  box-shadow: var(--floating-glass-shadow);
  color: #24324a;
  font: inherit;
  font-size: 10px;
  white-space: nowrap;
  cursor: pointer;
  backdrop-filter: var(--floating-glass-filter);
  -webkit-backdrop-filter: var(--floating-glass-filter);
  transition: transform 190ms cubic-bezier(.22, 1, .36, 1), box-shadow 190ms ease;
}

.top-add-option--blue { --top-add-color: #2678ed; }
.top-add-option--indigo { --top-add-color: #6259dc; }
.top-add-option--orange { --top-add-color: #e9862c; }

.top-add-option svg { width: 15px; height: 15px; }
.top-add-option:hover,
.top-add-option:focus-visible {
  outline: none;
  transform: scale(1.055) translateY(-1px);
  box-shadow: inset 0 1px rgba(255, 255, 255, .96), 0 0 0 3px color-mix(in srgb, var(--top-add-color) 12%, transparent), 0 11px 24px color-mix(in srgb, var(--top-add-color) 22%, rgba(31, 49, 77, .12));
}

.shell-profile-menu {
  margin-left: 1px;
}

.shell-profile-stack {
  position: relative;
  display: grid;
  height: 36px;
  min-width: 58px;
  justify-items: center;
}

.shell-profile-avatar {
  position: relative;
  display: grid;
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  place-items: center;
  overflow: visible;
  border: 1px solid rgba(89, 119, 170, .26);
  border-radius: 50%;
  background: rgba(255, 255, 255, .82);
  padding: 0;
  box-shadow: inset 0 1px rgba(255, 255, 255, .95), 0 8px 20px rgba(32, 54, 91, .12);
  color: #152440;
}

.shell-profile-avatar .user-avatar {
  width: 32px;
  height: 32px;
  font-size: 11px;
}

.shell-profile-network-dot {
  position: absolute;
  right: 0;
  bottom: 1px;
  width: 8px;
  height: 8px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #e34b55;
}

.shell-profile-avatar[data-network-state="online"] .shell-profile-network-dot {
  background: #20b26b;
}

.shell-profile-caption {
  position: absolute;
  top: 34px;
  right: 0;
  display: grid;
  width: 82px;
  max-width: 82px;
  justify-items: end;
  color: #52627b;
  font-size: 8px;
  line-height: 1.05;
  pointer-events: none;
  text-align: right;
}

.shell-profile-caption strong,
.shell-profile-caption small {
  overflow: hidden;
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shell-profile-caption small {
  color: #9aa5b7;
  font-size: 7px;
  text-transform: capitalize;
}

.shell-profile-popover {
  top: calc(100% + 7px);
  width: 188px;
  min-width: 188px;
  gap: 0;
  border-color: var(--floating-glass-border);
  border-radius: 18px;
  background: var(--floating-glass-fill);
  padding: 9px;
  box-shadow: var(--floating-glass-shadow);
  backdrop-filter: var(--floating-glass-filter);
  -webkit-backdrop-filter: var(--floating-glass-filter);
}

.shell-profile-popover > h2 {
  margin: 4px 7px 8px;
  color: #1d1d1f;
  font-size: 11px;
  font-weight: 740;
  letter-spacing: -.01em;
}

.shell-appearance-control {
  display: flex;
  min-height: 46px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-top: 1px solid rgba(60, 60, 67, .12);
  padding: 0 7px;
  color: #1d1d1f;
}

.shell-appearance-control > span:first-child {
  display: grid;
  gap: 2px;
}

.shell-appearance-control strong {
  font-size: 9px;
  font-weight: 720;
}

.shell-appearance-control small {
  color: #6e6e73;
  font-size: 7px;
}

.shell-motion-input,
.shell-theme-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.shell-motion-toggle {
  position: relative;
  display: block;
  width: 44px;
  height: 24px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #8e8e93;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08);
  transition: background 220ms ease;
}

.shell-motion-toggle::before {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .22);
  content: '';
  transition: transform 280ms cubic-bezier(.34, 1.56, .64, 1);
}

.shell-motion-toggle i {
  position: absolute;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .8);
  opacity: 0;
}

.shell-motion-toggle i:nth-child(1) { top: 7px; left: 11px; }
.shell-motion-toggle i:nth-child(2) { top: 12px; left: 16px; }
.shell-motion-toggle i:nth-child(3) { top: 16px; left: 10px; }
.shell-motion-input:checked + .shell-motion-toggle { background: #007aff; }
.shell-motion-input:checked + .shell-motion-toggle::before { transform: translateX(20px); }
.shell-motion-input:checked + .shell-motion-toggle i { opacity: .42; }

.shell-theme-toggle {
  position: relative;
  display: block;
  width: 56px;
  height: 30px;
  flex: 0 0 auto;
  overflow: hidden;
  border-radius: 999px;
  background: #8dcaf2;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08);
  transition: background 200ms cubic-bezier(.445, .05, .55, .95);
}

.shell-theme-handler {
  position: absolute;
  z-index: 2;
  top: 2px;
  left: 2px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #ffd095;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .23);
  transform: rotate(-45deg);
  transition: all 380ms cubic-bezier(.68, -.55, .265, 1.55);
}

.shell-theme-toggle .crater {
  position: absolute;
  border-radius: 50%;
  background: #d9d9dc;
  opacity: 0;
}

.shell-theme-toggle .crater--1 { top: 9px; left: 6px; width: 3px; height: 3px; }
.shell-theme-toggle .crater--2 { top: 16px; left: 13px; width: 4px; height: 4px; }
.shell-theme-toggle .crater--3 { top: 6px; left: 15px; width: 6px; height: 6px; }
.shell-theme-toggle .star { position: absolute; border-radius: 99px; background: #fff; transition: all 280ms cubic-bezier(.445, .05, .55, .95); }
.shell-theme-toggle .star--1 { top: 7px; left: 25px; width: 20px; height: 2px; }
.shell-theme-toggle .star--2 { top: 13px; left: 22px; width: 20px; height: 2px; }
.shell-theme-toggle .star--3 { top: 20px; left: 29px; width: 18px; height: 2px; }
.shell-theme-toggle .star--4, .shell-theme-toggle .star--5, .shell-theme-toggle .star--6 { width: 2px; height: 2px; opacity: 0; }
.shell-theme-toggle .star--4 { top: 8px; left: 8px; }
.shell-theme-toggle .star--5 { top: 19px; left: 11px; }
.shell-theme-toggle .star--6 { top: 23px; left: 19px; }
.shell-theme-input:checked + .shell-theme-toggle { background: #3a3a3c; }
.shell-theme-input:checked + .shell-theme-toggle .shell-theme-handler { background: #e5e5ea; transform: translateX(26px) rotate(0); }
.shell-theme-input:checked + .shell-theme-toggle .crater { opacity: 1; }
.shell-theme-input:checked + .shell-theme-toggle .star--1 { width: 2px; height: 2px; }
.shell-theme-input:checked + .shell-theme-toggle .star--2 { width: 3px; height: 3px; transform: translateX(-4px); }
.shell-theme-input:checked + .shell-theme-toggle .star--3 { width: 2px; height: 2px; transform: translateX(-6px); }
.shell-theme-input:checked + .shell-theme-toggle .star--4,
.shell-theme-input:checked + .shell-theme-toggle .star--5,
.shell-theme-input:checked + .shell-theme-toggle .star--6 { opacity: .9; }

.shell-motion-input:focus-visible + .shell-motion-toggle,
.shell-theme-input:focus-visible + .shell-theme-toggle {
  outline: 2px solid #007aff;
  outline-offset: 3px;
}

html[data-theme="night"] {
  color-scheme: dark;
  --apple-canvas: #111113;
  --apple-elevated: #1c1c1e;
  --apple-elevated-2: #242426;
  --apple-text: #f5f5f7;
  --apple-muted: #a1a1a7;
  --apple-separator: rgba(99, 99, 102, .42);
  background: #111113;
}

html[data-theme="night"] body,
html[data-theme="night"] .operations-shell,
html[data-theme="night"] .app-main,
html[data-theme="night"] .page {
  background: #111113;
  color: #f5f5f7;
}

html[data-theme="night"] .topbar,
html[data-theme="night"] .dashboard-metric-card,
html[data-theme="night"] .adaptive-container-workspace,
html[data-theme="night"] .panel {
  border-color: rgba(84, 84, 88, .54);
  background: #1c1c1e;
  color: #f5f5f7;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .045);
}

html[data-theme="night"] .shell-profile-popover {
  border-color: var(--floating-glass-border);
  background: var(--floating-glass-fill);
  color: #f5f5f7;
}

html[data-theme="night"] .shell-profile-popover > h2,
html[data-theme="night"] .shell-appearance-control { color: #f5f5f7; }
html[data-theme="night"] .shell-appearance-control { border-color: rgba(84, 84, 88, .54); }
html[data-theme="night"] .shell-appearance-control small { color: #98989d; }

/* Calm Apple Night surfaces: graphite layers instead of pure black/white
   breaks. Semantic colors stay intact, but the information canvas remains
   one quiet hierarchy. */
html[data-theme="night"] .desktop-top-brand strong,
html[data-theme="night"] .shell-profile-caption strong,
html[data-theme="night"] .container-operations-panel h2,
html[data-theme="night"] .dashboard-metric-card__top > span,
html[data-theme="night"] .dashboard-metric-card__top > strong {
  color: #f5f5f7;
}

html[data-theme="night"] .desktop-top-brand small,
html[data-theme="night"] .shell-profile-caption small,
html[data-theme="night"] .dashboard-metric-card__top > small,
html[data-theme="night"] .dashboard-metric-card__trend span:last-child {
  color: #a1a1a7;
}

html[data-theme="night"] .dashboard-metric-card__heading > span:not(.dashboard-metric-card__icon),
html[data-theme="night"] .dashboard-metric-card__value,
html[data-theme="night"] .status-kpi-card > header > span:not(.status-kpi-card__icon),
html[data-theme="night"] .status-kpi-card > strong {
  color: #f5f5f7;
}

html[data-theme="night"] .dashboard-metric-card small,
html[data-theme="night"] .status-kpi-card > small {
  color: #a1a1a7;
}

html[data-theme="night"] .container-operations-panel {
  border-color: rgba(99, 99, 102, .38);
  background: #1c1c1e;
  color: #f5f5f7;
  box-shadow: 0 16px 38px rgba(0, 0, 0, .24), inset 0 1px rgba(255, 255, 255, .035);
}

html[data-theme="night"] .container-operations-panel__header {
  border-color: rgba(99, 99, 102, .34);
  background: #242426;
}

html[data-theme="night"] .adaptive-container-table,
html[data-theme="night"] .adaptive-container-table table,
html[data-theme="night"] .adaptive-container-table tbody {
  background: #1c1c1e;
  color: #f5f5f7;
}

html[data-theme="night"] .adaptive-container-table thead th {
  border-color: rgba(99, 99, 102, .34);
  background: #2c2c2e;
  color: #b7b7bd;
}

html[data-theme="night"] .adaptive-container-table tbody tr.adaptive-task > td {
  border-bottom-color: rgba(99, 99, 102, .32);
  background: #1f1f21;
  color: #ededf0;
}

html[data-theme="night"] .adaptive-container-table [data-column-key="container_no"] {
  background: #242426;
}

html[data-theme="night"] .adaptive-container-table tbody tr.adaptive-task--empty-returned > td,
html[data-theme="night"] .adaptive-container-table tbody tr.adaptive-task--empty-returned > td[data-column-key="container_no"] {
  background: #193026;
}

html[data-theme="night"] .topbar input,
html[data-theme="night"] .topbar select,
html[data-theme="night"] .topbar-compact-action {
  border-color: rgba(99, 99, 102, .44);
  background: #2c2c2e;
  color: #f5f5f7;
}

html[data-theme="night"] .topbar input::placeholder { color: #98989d; }

html[data-theme="night"] .adaptive-data-chip,
html[data-theme="night"] .dashboard-copy-value {
  filter: saturate(.82) brightness(.92);
}

/* Independent Apple task windows: no backdrop, tray, or Dashboard dimming. */
.task-workspace {
  position: fixed;
  z-index: 2500;
  inset: 0;
  overflow: visible;
  pointer-events: none;
}

.task-workspace-panels {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

body .task-workspace-panel {
  position: fixed;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  width: min(var(--task-panel-width, 520px), calc(100vw - 32px));
  max-height: min(var(--task-panel-max-height, 680px), calc(100dvh - 82px));
  overflow: hidden;
  border: 1px solid var(--floating-glass-border);
  border-radius: 28px;
  background: var(--floating-glass-fill);
  box-shadow: var(--floating-glass-shadow);
  color: #1d1d1f;
  transform: none;
  pointer-events: auto;
  backdrop-filter: var(--floating-glass-filter);
  -webkit-backdrop-filter: var(--floating-glass-filter);
}

body .task-workspace-panel[hidden] { display: none; }

body .task-workspace-panel[data-dragging="true"] {
  box-shadow: 0 1px rgba(255, 255, 255, .98) inset, 0 3px 0 rgba(104, 120, 143, .15), 0 28px 70px rgba(21, 34, 55, .24), 0 8px 20px rgba(21, 34, 55, .12);
}

body .task-workspace-panel__chrome {
  position: relative;
  top: auto;
  right: auto;
  z-index: 4;
  display: flex;
  min-height: 50px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--floating-glass-divider);
  padding: 8px 10px 8px 17px;
  background: var(--floating-glass-soft-fill);
  cursor: grab;
  touch-action: none;
  user-select: none;
}

body .task-workspace-panel[data-dragging="true"] .task-workspace-panel__chrome { cursor: grabbing; }

body .task-workspace-panel__context {
  display: block;
  overflow: hidden;
  color: #25262a;
  font-size: 12px;
  font-weight: 680;
  letter-spacing: -.015em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body .task-workspace-panel__controls {
  display: flex;
  align-items: center;
  gap: 5px;
  border: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

body .task-workspace-panel__chrome button {
  --task-control-border: rgba(95, 105, 122, .24);
  --task-control-fill: linear-gradient(180deg, #f4f5f7, #d9dde3);
  position: relative;
  display: inline-grid;
  width: 18px;
  min-width: 18px;
  min-height: 18px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  padding: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  color: #646b76;
  font-size: 7px;
  transition: transform 180ms cubic-bezier(.22, 1, .36, 1), filter 180ms ease;
}

body .task-workspace-panel__chrome button::before {
  position: absolute;
  inset: 3px;
  border: .5px solid var(--task-control-border);
  border-radius: 50%;
  background: var(--task-control-fill);
  box-shadow: inset 0 .5px rgba(255, 255, 255, .72), 0 1px 2px rgba(32, 45, 65, .1);
  content: '';
}

body .task-workspace-panel__chrome button:hover {
  box-shadow: none;
  filter: saturate(1.04);
  transform: scale(1.12);
}

body .task-workspace-panel__chrome button:hover::before {
  box-shadow: inset 0 .5px rgba(255, 255, 255, .72), 0 0 0 2px rgba(96, 106, 121, .07), 0 3px 7px rgba(32, 45, 65, .13);
}

body .task-workspace-panel__chrome button:focus-visible {
  outline: 1px solid rgba(0, 122, 255, .34);
  outline-offset: 0;
}

body .task-workspace-panel__chrome .task-workspace-lock svg {
  width: 6px;
  height: 6px;
}

body .task-workspace-panel__chrome .task-workspace-lock svg,
body .task-workspace-panel__chrome .task-workspace-close svg,
body .task-workspace-panel__chrome .task-workspace-hide svg,
body .task-workspace-panel__chrome .task-workspace-done svg {
  position: relative;
  z-index: 1;
  width: 6px;
  height: 6px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

body .task-workspace-panel__chrome .task-workspace-lock[aria-pressed="true"] {
  --task-control-border: rgba(107, 116, 130, .36);
  --task-control-fill: linear-gradient(180deg, #eef0f3, #c8cdd4);
  color: #3f4752;
}

body .task-workspace-panel__chrome .task-workspace-close {
  --task-control-border: rgba(181, 43, 35, .28);
  --task-control-fill: #ff5f57;
  color: rgba(89, 21, 17, .76);
}

body .task-workspace-panel__chrome .task-workspace-hide {
  --task-control-border: rgba(168, 118, 0, .24);
  --task-control-fill: #febc2e;
  color: rgba(98, 76, 0, .7);
}

body .task-workspace-panel__chrome .task-workspace-done {
  --task-control-border: rgba(23, 123, 55, .26);
  --task-control-fill: #28c840;
  color: rgba(13, 83, 35, .76);
}

body .task-workspace-panel__content {
  min-height: 0;
  max-height: calc(min(var(--task-panel-max-height, 680px), 100dvh - 82px) - 50px);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 22px;
}

.task-workspace-save-confirmation {
  position: absolute;
  z-index: 12;
  top: 50%;
  left: 50%;
  display: grid;
  min-width: 104px;
  place-items: center;
  gap: 7px;
  border: 1px solid rgba(41, 150, 79, .2);
  border-radius: 22px;
  padding: 13px 18px 12px;
  background: rgba(247, 252, 248, .9);
  box-shadow: inset 0 1px rgba(255, 255, 255, .9), 0 14px 34px rgba(25, 75, 43, .17);
  color: #16753a;
  pointer-events: none;
  backdrop-filter: blur(18px) saturate(1.08);
  -webkit-backdrop-filter: blur(18px) saturate(1.08);
  animation: task-workspace-save-confirmation 720ms cubic-bezier(.22, 1, .36, 1) both;
}

.task-workspace-save-confirmation__mark {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 50%;
  background: #28c840;
  box-shadow: 0 0 0 5px rgba(40, 200, 64, .12), 0 6px 14px rgba(30, 139, 57, .2);
  color: #fff;
}

.task-workspace-save-confirmation__mark svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
}

.task-workspace-save-confirmation strong {
  font-size: 11px;
  font-weight: 650;
}

body .task-workspace-panel .is-save-confirmed {
  animation: task-workspace-field-confirmation 620ms cubic-bezier(.22, 1, .36, 1) both;
}

@keyframes task-workspace-save-confirmation {
  0% { opacity: 0; transform: translate(-50%, -42%) scale(.72); }
  38% { opacity: 1; transform: translate(-50%, -50%) scale(1.04); }
  72% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -54%) scale(.98); }
}

@keyframes task-workspace-field-confirmation {
  0%, 100% { filter: none; }
  42% { filter: drop-shadow(0 0 7px rgba(40, 200, 64, .42)); }
}

.create-record-workspace {
  display: grid;
  gap: 12px;
  margin: 0;
}

.create-record-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.create-record-field {
  display: grid;
  min-width: 0;
  gap: 7px;
  margin: 0;
  color: #555d69;
  font-size: 10px;
  font-weight: 650;
}

.create-record-field--wide { grid-column: 1 / -1; }

.create-record-field > input,
.create-record-field > textarea,
.create-record-field > output {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(103, 115, 135, .2);
  border-radius: 14px;
  background: rgba(255, 255, 255, .58);
  box-shadow: inset 0 1px rgba(255, 255, 255, .8), 0 3px 10px rgba(37, 48, 66, .055);
  color: #24262b;
  padding: 9px 11px;
  font: inherit;
  font-weight: 540;
}

.create-record-field > textarea {
  min-height: 74px;
  resize: vertical;
}

.create-record-field > output {
  display: flex;
  align-items: center;
  color: #7b8290;
}

.create-record-field > input:focus,
.create-record-field > textarea:focus {
  outline: 0;
  border-color: rgba(0, 122, 255, .55);
  box-shadow: inset 0 1px rgba(255, 255, 255, .86), 0 0 0 3px rgba(0, 122, 255, .11), 0 7px 18px rgba(26, 92, 175, .1);
}

.create-record-field [data-field-error] {
  min-height: 11px;
  color: #c9342d;
  font-size: 9px;
}

.create-record-error {
  min-height: 16px;
  margin: 0;
  color: #c9342d;
  font-size: 10px;
}

.create-record-error:empty { display: none; }

.container-inspection {
  display: grid;
  gap: 14px;
  margin: 0;
}

.container-inspection__values {
  display: grid;
  overflow: hidden;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border: 1px solid var(--floating-glass-inner-border);
  border-radius: 21px;
  background: var(--floating-glass-inner-fill);
  box-shadow: inset 0 1px rgba(255, 255, 255, .76), 0 6px 18px rgba(38, 49, 67, .06);
}

.inspection-value {
  display: grid;
  min-width: 0;
  gap: 4px;
  border-bottom: 1px solid rgba(103, 115, 135, .11);
  padding: 12px 14px;
}

.inspection-value:nth-child(odd) { border-right: 1px solid rgba(103, 115, 135, .11); }
.inspection-value dt { color: #7a818d; font-size: 9px; font-weight: 640; }
.inspection-value dd {
  overflow-wrap: anywhere;
  margin: 0;
  color: #24262b;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: -.01em;
}
.inspection-value--success dd,
.inspection-value--profit dd { color: #218c57; }
.inspection-value--danger dd,
.inspection-value--special-fee dd { color: #d2363e; }
.inspection-value--available dd { color: #2369dc; }
.inspection-value--delivered dd { color: #7348c2; }

.inspection-related {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 10px;
}

.inspection-related-card {
  overflow: hidden;
  border: 1px solid var(--floating-glass-inner-border);
  border-radius: 23px;
  background: var(--floating-glass-inner-fill);
  box-shadow: inset 0 1px rgba(255, 255, 255, .84), 0 10px 24px rgba(38, 49, 67, .07);
  padding: 14px;
}

.inspection-related-card h3 {
  margin: 0 0 10px;
  color: #202227;
  font-size: 12px;
  font-weight: 720;
  letter-spacing: -.015em;
}

.inspection-related-card dl { display: grid; gap: 8px; margin: 0; }
.inspection-related-card dl > div { display: grid; grid-template-columns: minmax(90px, .8fr) minmax(0, 1.2fr); gap: 8px; }
.inspection-related-card dt { color: #7a818d; font-size: 9px; font-weight: 640; }
.inspection-related-card dd { overflow-wrap: anywhere; margin: 0; color: #24262b; font-size: 10px; font-weight: 620; text-align: right; }

.inspection-progress {
  --inspection-blue: #007aff;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--floating-glass-inner-border);
  border-radius: 23px;
  background: var(--floating-glass-inner-fill);
  box-shadow: inset 0 1px rgba(255, 255, 255, .86), 0 9px 24px rgba(32, 68, 116, .08);
  padding: 24px 18px 14px;
}

.inspection-progress__truck {
  position: absolute;
  z-index: 2;
  top: 12px;
  left: calc(16px + (100% - 56px) * var(--inspection-progress));
  width: 26px;
  color: var(--inspection-blue);
  filter: drop-shadow(0 4px 5px rgba(0, 122, 255, .18));
  transform: translateX(-50%);
  transition: left 280ms cubic-bezier(.22, 1, .36, 1);
}

.inspection-progress__truck svg { width: 100%; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }
.inspection-progress__line { position: absolute; top: 43px; right: 24px; left: 24px; height: 3px; border-radius: 999px; background: #d8e0eb; }
.inspection-progress__line i { display: block; width: calc(100% * var(--inspection-progress)); height: 100%; border-radius: inherit; background: var(--inspection-blue); }
.inspection-progress ol { position: relative; display: flex; justify-content: space-between; margin: 15px 0 0; padding: 0; list-style: none; }
.inspection-progress li { display: grid; width: 48px; justify-items: center; gap: 7px; color: #858c98; font-size: 8px; font-weight: 620; text-align: center; }
.inspection-progress li i { width: 9px; height: 9px; border: 2px solid #d8e0eb; border-radius: 50%; background: #f5f7fa; }
.inspection-progress li.is-complete i { border-color: var(--inspection-blue); background: var(--inspection-blue); box-shadow: 0 0 0 3px rgba(0, 122, 255, .1); }
.inspection-progress li.is-current { color: #1d1d1f; }
.inspection-progress p { margin: 13px 0 0; color: #646c79; font-size: 9px; text-align: center; }

.workflow-page--workspace-action {
  min-height: 0;
  margin: 0;
  padding: 0;
}

.workflow-page--workspace-action .workflow-form--workspace {
  overflow: hidden;
  margin: 0;
  border: 1px solid var(--floating-glass-inner-border);
  border-radius: 22px;
  background: var(--floating-glass-inner-fill);
  box-shadow: inset 0 1px rgba(255, 255, 255, .68), 0 8px 22px rgba(34, 44, 60, .07);
  padding: 0;
}

.workflow-page--workspace-action .workflow-form-grid {
  display: grid;
  overflow: hidden;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
}

.workflow-page--workspace-action .workflow-form-grid > * {
  min-width: 0;
  padding: 16px 18px;
}

.workflow-page--workspace-action .workflow-form-grid > :nth-child(even) {
  border-left: 1px solid var(--floating-glass-divider);
}

.workflow-page--workspace-action .workflow-form-grid > :nth-child(n + 3) {
  border-top: 1px solid var(--floating-glass-divider);
}

.workflow-page--workspace-action .workflow-form-error {
  margin: 0;
  border-top: 1px solid var(--floating-glass-divider);
  padding: 10px 14px;
}

.workflow-page--workspace-action .workflow-form-error:empty {
  display: none;
}

.pod-upload-editor--workspace {
  gap: 12px;
  padding: 0;
}

.pod-upload-editor--workspace .pod-upload-editor__drop {
  min-height: 116px;
  border-radius: 20px;
  background: rgba(0, 122, 255, .035);
}

.pod-upload-editor--workspace .pod-upload-editor__assets {
  gap: 0;
  border-top: 1px solid rgba(98, 108, 123, .14);
}

.pod-upload-editor--workspace .pod-upload-editor__asset {
  grid-template-columns: minmax(0, 1fr) minmax(180px, .7fr);
  gap: 10px 14px;
  border: 0;
  border-bottom: 1px solid rgba(98, 108, 123, .14);
  border-radius: 0;
  padding: 13px 2px;
  background: transparent;
  box-shadow: none;
}

.pod-upload-editor--workspace .pod-upload-editor__file button {
  border-color: rgba(255, 69, 58, .24);
  background: rgba(255, 255, 255, .48);
  box-shadow: inset 0 1px rgba(255, 255, 255, .75), 0 3px 8px rgba(33, 43, 58, .07);
}

.workflow-evidence-section--workspace {
  margin: 0 0 14px;
  border: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.workflow-evidence-section--workspace .workflow-evidence-grid {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 9px;
}

.workflow-evidence-section--workspace .workflow-evidence-unavailable,
.workflow-evidence-section--workspace .workflow-empty {
  min-height: 52px;
  aspect-ratio: auto;
  border: 1px solid rgba(101, 111, 128, .14);
  border-radius: 16px;
  padding: 14px 16px;
  background: rgba(255, 255, 255, .3);
  font-size: 10px;
}

.workflow-evidence-section--workspace .workflow-evidence-card {
  border-color: rgba(101, 111, 128, .16);
  border-radius: 18px;
  background: rgba(255, 255, 255, .42);
  box-shadow: inset 0 1px rgba(255, 255, 255, .72), 0 5px 16px rgba(38, 49, 67, .07);
}

.workflow-evidence-section--workspace .workflow-evidence-card figcaption {
  gap: 2px;
  padding: 8px 9px 9px;
  font-size: 10px;
}

.workflow-evidence-section--workspace .workflow-evidence-card time,
.workflow-evidence-section--workspace .workflow-evidence-card span {
  font-size: 9px;
}

.evidence-correction-workspace,
.empty-return-review-workspace {
  display: grid;
  gap: 12px;
}

.evidence-correction-workspace > label,
.empty-return-review-workspace > label {
  display: grid;
  gap: 6px;
  margin: 0;
  color: #555d69;
  font-size: 10px;
  font-weight: 650;
}

.workspace-field-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.workspace-field-label em {
  color: #858b95;
  font-size: 9px;
  font-style: normal;
  font-weight: 520;
}

.evidence-correction-workspace input[type="file"],
.evidence-correction-workspace textarea,
.empty-return-review-workspace textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(103, 115, 135, .2);
  border-radius: 14px;
  background: rgba(255, 255, 255, .58);
  box-shadow: inset 0 1px rgba(255, 255, 255, .78), 0 3px 10px rgba(37, 48, 66, .06);
  color: #24262b;
  padding: 9px 10px;
}

.evidence-correction-workspace textarea,
.empty-return-review-workspace textarea {
  min-height: 76px;
  resize: vertical;
}

.evidence-correction-workspace .system-input-glow.textarea-glow,
.empty-return-review-workspace .system-input-glow.textarea-glow {
  min-height: 76px;
}

.finance-completion-workspace {
  display: grid;
  gap: 14px;
}

.finance-workspace-metrics {
  display: grid;
  overflow: hidden;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  border: 1px solid rgba(103, 115, 135, .16);
  border-radius: 19px;
  background: rgba(255, 255, 255, .34);
  box-shadow: inset 0 1px rgba(255, 255, 255, .76), 0 6px 18px rgba(38, 49, 67, .07);
}

.finance-workspace-metrics > div {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 11px 13px;
}

.finance-workspace-metrics > div + div {
  border-left: 1px solid rgba(103, 115, 135, .13);
}

.finance-workspace-metrics dt {
  color: #747b87;
  font-size: 9px;
  font-weight: 620;
}

.finance-workspace-metrics dd {
  overflow: hidden;
  margin: 0;
  color: #24262b;
  font-size: 15px;
  font-weight: 720;
  letter-spacing: -.025em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-workspace-metrics__profit dd { color: #208e55; }

.finance-workspace-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px 12px;
}

.finance-workspace-field {
  display: grid;
  min-width: 0;
  gap: 6px;
  margin: 0;
  color: #555d69;
  font-size: 9px;
  font-weight: 650;
}

.finance-workspace-field--wide { grid-column: 1 / -1; }

.finance-workspace-field > input,
.finance-workspace-field > textarea,
.finance-workspace-money {
  width: 100%;
  min-height: 40px;
  border: 1px solid rgba(103, 115, 135, .2);
  border-radius: 13px;
  background: rgba(255, 255, 255, .55);
  box-shadow: inset 0 1px rgba(255, 255, 255, .78), 0 3px 10px rgba(37, 48, 66, .055);
  color: #24262b;
}

.finance-workspace-field > input,
.finance-workspace-field > textarea {
  padding: 8px 10px;
}

.finance-workspace-field > textarea {
  min-height: 66px;
  resize: vertical;
}

.finance-workspace-money {
  display: flex;
  align-items: center;
}

.finance-workspace-money > i {
  padding-left: 10px;
  color: #7c8491;
  font-style: normal;
  font-weight: 620;
}

.finance-workspace-money > input {
  width: 100%;
  min-width: 0;
  min-height: 38px;
  border: 0;
  background: transparent;
  color: #24262b;
  padding: 8px 10px 8px 5px;
}

.finance-completion-workspace .system-input-glow {
  min-height: 40px;
  height: 40px;
  border-radius: 13px;
  --border-radius: 13px;
  --glow-padding: 12px;
}

.finance-completion-workspace .system-input-glow.textarea-glow {
  min-height: 66px;
  height: 66px;
}

.finance-completion-workspace .workflow-form-error:empty { display: none; }

.workspace-date-field,
.workspace-choice {
  min-width: 0;
  margin: 0;
  border: 0;
  padding: 0;
}

.workspace-date-field > span,
.workspace-choice > legend {
  display: block;
  margin: 0 0 7px;
  color: #555d69;
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .01em;
}

.workspace-date-field input {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(103, 115, 135, .2);
  border-radius: 14px;
  background: rgba(255, 255, 255, .58);
  box-shadow: inset 0 1px rgba(255, 255, 255, .78), 0 3px 10px rgba(37, 48, 66, .06);
  color: #24262b;
  padding: 8px 10px;
}

.workspace-choice__options {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  background: transparent;
}

body .task-workspace-panel .workspace-choice__option {
  --choice-rgb: 112, 119, 130;
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(var(--choice-rgb), .38);
  border-radius: 999px;
  background: rgba(var(--choice-rgb), .08);
  box-shadow: inset 0 1px rgba(255, 255, 255, .62), 0 3px 9px rgba(var(--choice-rgb), .08);
  color: rgb(var(--choice-rgb));
  padding: 7px 12px;
  font-size: 10px;
  font-weight: 650;
  transition: transform 210ms cubic-bezier(.22, 1, .36, 1), box-shadow 210ms ease, background 210ms ease;
}

body .task-workspace-panel .workspace-choice__option[data-tone="paid"],
body .task-workspace-panel .workspace-choice__option[data-tone="empty-returned"] { --choice-rgb: 32, 142, 85; }
body .task-workspace-panel .workspace-choice__option[data-tone="unpaid"],
body .task-workspace-panel .workspace-choice__option[data-tone="pending"] { --choice-rgb: 210, 54, 62; }
body .task-workspace-panel .workspace-choice__option[data-tone="arrived"] { --choice-rgb: 208, 65, 128; }
body .task-workspace-panel .workspace-choice__option[data-tone="available"] { --choice-rgb: 35, 105, 220; }
body .task-workspace-panel .workspace-choice__option[data-tone="delivered"] { --choice-rgb: 115, 72, 194; }
body .task-workspace-panel .workspace-choice__option[data-tone="cancelled"],
body .task-workspace-panel .workspace-choice__option[data-tone="neutral"] { --choice-rgb: 100, 108, 120; }

body .task-workspace-panel .workspace-choice__option[aria-checked="true"] {
  background: rgba(var(--choice-rgb), .18);
  box-shadow: inset 0 1px rgba(255, 255, 255, .58), 0 0 0 2px rgba(var(--choice-rgb), .14), 0 5px 13px rgba(var(--choice-rgb), .12);
}

body .task-workspace-panel .workspace-choice__option:hover,
body .task-workspace-panel .workspace-choice__option:focus-visible {
  outline: 0;
  background: rgba(var(--choice-rgb), .15);
  box-shadow: inset 0 1px rgba(255, 255, 255, .62), 0 0 0 3px rgba(var(--choice-rgb), .12), 0 7px 17px rgba(var(--choice-rgb), .16);
  transform: scale(1.04);
}

.workspace-choice [data-field-error],
.workspace-date-field [data-field-error] {
  display: block;
  min-height: 12px;
  margin-top: 4px;
  color: #c9342d;
  font-size: 9px;
}

.task-workspace-restore {
  display: inline-grid;
  min-width: 31px;
  min-height: 31px;
  grid-auto-flow: column;
  place-items: center;
  gap: 3px;
  border: 1px solid rgba(100, 119, 150, .2);
  border-radius: 11px;
  background: var(--floating-glass-fill);
  box-shadow: var(--floating-glass-shadow);
  color: #66768e;
  backdrop-filter: var(--floating-glass-filter);
  -webkit-backdrop-filter: var(--floating-glass-filter);
}

.task-workspace-restore[hidden] { display: none; }
.task-workspace-restore svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.task-workspace-restore span { min-width: 8px; color: #007aff; font-size: 8px; font-weight: 760; }

.topbar-task-shelf.has-hidden-task-windows {
  display: flex;
  width: auto;
  max-width: none;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
}

html[data-theme="night"] body .task-workspace-panel {
  color: #f5f5f7;
  box-shadow: var(--floating-glass-shadow);
}

html[data-theme="night"] body .task-workspace-panel__chrome {
  border-color: rgba(84, 84, 88, .54);
  background: rgba(58, 58, 62, .36);
}

html[data-theme="night"] body .task-workspace-panel__context { color: #f5f5f7; }
html[data-theme="night"] .workspace-date-field > span,
html[data-theme="night"] .workspace-choice > legend { color: #c7c7cc; }
html[data-theme="night"] .workspace-date-field input {
  border-color: rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .08);
  color: #f5f5f7;
  color-scheme: dark;
}

html[data-theme="night"] .create-record-field { color: #c7c7cc; }
html[data-theme="night"] .create-record-field > input,
html[data-theme="night"] .create-record-field > textarea,
html[data-theme="night"] .create-record-field > output {
  border-color: rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .08);
  color: #f5f5f7;
}
html[data-theme="night"] .container-inspection__values,
html[data-theme="night"] .inspection-progress,
html[data-theme="night"] .inspection-related-card {
  border-color: var(--floating-glass-inner-border);
  background: var(--floating-glass-inner-fill);
}
html[data-theme="night"] .inspection-value { border-color: rgba(255, 255, 255, .08); }
html[data-theme="night"] .inspection-value dt { color: #9a9aa0; }
html[data-theme="night"] .inspection-value dd,
html[data-theme="night"] .inspection-progress li.is-current,
html[data-theme="night"] .inspection-related-card h3,
html[data-theme="night"] .inspection-related-card dd { color: #f5f5f7; }
html[data-theme="night"] .inspection-related-card dt { color: #9a9aa0; }

html[data-theme="night"] .pod-upload-editor--workspace .pod-upload-editor__asset,
html[data-theme="night"] .pod-upload-editor--workspace .pod-upload-editor__assets {
  border-color: rgba(255, 255, 255, .1);
}

html[data-theme="night"] .workflow-evidence-section--workspace .workflow-evidence-card,
html[data-theme="night"] .evidence-correction-workspace input[type="file"],
html[data-theme="night"] .evidence-correction-workspace textarea,
html[data-theme="night"] .empty-return-review-workspace textarea {
  border-color: rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .07);
  color: #f5f5f7;
}

html[data-theme="night"] .finance-workspace-metrics,
html[data-theme="night"] .finance-workspace-field > input,
html[data-theme="night"] .finance-workspace-field > textarea,
html[data-theme="night"] .finance-workspace-money {
  border-color: rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .07);
  color: #f5f5f7;
}

html[data-theme="night"] .finance-workspace-metrics > div + div { border-color: rgba(255, 255, 255, .1); }
html[data-theme="night"] .finance-workspace-metrics dd,
html[data-theme="night"] .finance-workspace-money > input { color: #f5f5f7; }

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  body .task-workspace-panel { background: #eef1f5; }
  html[data-theme="night"] body .task-workspace-panel { background: #292a2e; }
}

/* Any legacy full-screen confirmation still uses the same material authority.
   The page remains undimmed; only the floating surface receives the blur. */
body .modal-card {
  border: 1px solid var(--floating-glass-border);
  border-radius: 28px;
  background: var(--floating-glass-fill);
  box-shadow: var(--floating-glass-shadow);
  backdrop-filter: var(--floating-glass-filter);
  -webkit-backdrop-filter: var(--floating-glass-filter);
}

body .modal-backdrop {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

@media (max-width: 899px) {
  body .task-workspace-panel {
    inset: auto 8px calc(70px + env(safe-area-inset-bottom)) 8px !important;
    width: auto;
    max-height: calc(100dvh - 150px);
    border-radius: 26px;
  }

  body .task-workspace-panel__chrome { cursor: default; }
      body .task-workspace-panel__chrome button {
        width: 44px;
        min-width: 44px;
        min-height: 44px;
      }
      body .task-workspace-panel__chrome button::before { inset: 16px; }
  .workflow-page--workspace-action .workflow-form-grid { grid-template-columns: minmax(0, 1fr); }
  .workflow-page--workspace-action .workflow-form-grid > :nth-child(even) { border-left: 0; }
  .workflow-page--workspace-action .workflow-form-grid > :nth-child(n + 2) { border-top: 1px solid var(--floating-glass-divider); }
  .pod-upload-editor--workspace .pod-upload-editor__asset { grid-template-columns: minmax(0, 1fr); }
  .finance-workspace-grid { grid-template-columns: minmax(0, 1fr); }
  .finance-workspace-field--wide { grid-column: auto; }
  body .task-workspace-panel .workspace-choice__option { min-height: 44px; padding-inline: 15px; }
  .create-record-grid { grid-template-columns: 1fr; }
  .create-record-field--wide { grid-column: auto; }
  .container-inspection__values { grid-template-columns: 1fr; }
  .inspection-value:nth-child(odd) { border-right: 0; }
}

html[data-motion="off"] *,
html[data-motion="off"] *::before,
html[data-motion="off"] *::after {
  scroll-behavior: auto !important;
  transition-duration: .001ms !important;
  animation-duration: .001ms !important;
  animation-iteration-count: 1 !important;
}

html[data-motion="off"] .top-glass-navigation .icon-btn__back,
html[data-motion="off"] .top-glass-navigation .icon-btn__front,
html[data-motion="off"] .top-add-option,
html[data-motion="off"] .dashboard-filter-statuses label:hover,
html[data-motion="off"] .workspace-choice__option,
html[data-motion="off"] .workspace-choice__option:hover,
html[data-motion="off"] .workspace-choice__option:focus-visible {
  transform: none;
}

/* Team attendance: approved iOS frosted roster composition. */
.team-page {
  --team-ink: #0f172a;
  --team-muted: #64748b;
  --team-page-surface: rgba(255, 255, 255, .72);
  --team-panel: rgba(255, 255, 255, .78);
  --team-edge: rgba(148, 163, 184, .22);
  --team-shadow: 0 8px 24px rgba(15, 23, 42, .06);
  display: grid;
  gap: clamp(12px, 1.2vw, 20px);
  color: var(--team-ink);
  padding: clamp(12px, 1.6vw, 24px);
  border: 1px solid rgba(148, 163, 184, .16);
  border-radius: clamp(22px, 2vw, 30px);
  background:
    radial-gradient(circle at 12% 4%, rgba(59, 130, 246, .075), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(139, 92, 246, .045), transparent 28%),
    linear-gradient(145deg, rgba(248, 251, 255, .9), rgba(241, 246, 252, .76));
  box-shadow: inset 0 1px rgba(255, 255, 255, .88);
}

.team-add {
  min-height: 32px;
  margin-left: auto;
  padding: 0 12px 0 7px;
  border: 1px solid rgba(37, 99, 235, .18);
  border-radius: 999px;
  background: rgba(255, 255, 255, .66);
  color: #2563eb;
  box-shadow: inset 0 1px rgba(255, 255, 255, .95), 0 8px 20px -16px rgba(37, 99, 235, .65);
  font-size: 10px;
  font-weight: 600;
}
.team-add span { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-right: 5px; border-radius: 50%; background: #2563eb; color: #fff; font-size: 15px; }

.team-trust-strip {
  display: flex;
  align-items: center;
  gap: 10px clamp(18px, 3vw, 42px);
  min-height: clamp(52px, 4.5vw, 68px);
  padding: 10px clamp(14px, 2vw, 26px);
  border: 1px solid var(--team-edge);
  border-radius: 20px;
  background: var(--team-page-surface);
  box-shadow: var(--team-shadow), inset 0 1px rgba(255, 255, 255, .92);
  backdrop-filter: blur(18px) saturate(1.08);
  -webkit-backdrop-filter: blur(18px) saturate(1.08);
  font-size: clamp(10px, .78vw, 13px);
  color: #475569;
}
.team-trust-strip > span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.team-trust-strip i { width: 9px; height: 9px; border-radius: 50%; background: #34c759; box-shadow: inset 0 1px rgba(255,255,255,.55), 0 0 0 4px rgba(52, 199, 89, .09), 0 2px 7px rgba(22, 163, 74, .28); }
.team-trust-strip .team-network--needs-office i { background: #ff9f0a; box-shadow: inset 0 1px rgba(255,255,255,.5), 0 0 0 4px rgba(255, 159, 10, .09), 0 2px 7px rgba(217, 119, 6, .25); }
.team-trust-strip button { margin-left: auto; min-height: 32px; padding: 0 13px; border: 1px solid var(--team-edge); border-radius: 999px; background: rgba(255,255,255,.62); color: #64748b; box-shadow: inset 0 1px rgba(255,255,255,.9), 0 8px 18px -16px rgba(15,23,42,.6); font-size: 10px; }

.team-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(10px, 1.2vw, 18px); }
.team-metric {
  --team-accent: #2563eb;
  --team-accent-soft: rgba(37, 99, 235, .13);
  position: relative;
  display: grid;
  grid-template-columns: clamp(44px, 3.5vw, 56px) minmax(0, 1fr);
  align-items: center;
  gap: clamp(10px, 1.2vw, 18px);
  min-height: clamp(102px, 7.6vw, 132px);
  padding: clamp(14px, 1.45vw, 22px);
  overflow: hidden;
  border: 1px solid var(--team-edge);
  border-radius: 20px;
  background:
    radial-gradient(circle at 96% 10%, var(--team-accent-soft), transparent 32%),
    var(--team-panel);
  box-shadow: var(--team-shadow), inset 0 1px rgba(255, 255, 255, .94);
  backdrop-filter: blur(16px) saturate(1.08);
  -webkit-backdrop-filter: blur(16px) saturate(1.08);
  transition: transform 220ms ease, box-shadow 220ms ease;
}
.team-metric:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(15, 23, 42, .09), inset 0 1px rgba(255, 255, 255, .96); }
.team-metric::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--team-accent); border-radius: 0 4px 4px 0; }
.team-metric--present { --team-accent: #10b981; --team-accent-soft: rgba(16, 185, 129, .13); }
.team-metric--pending { --team-accent: #f59e0b; --team-accent-soft: rgba(245, 158, 11, .14); }
.team-metric--inactive { --team-accent: #94a3b8; --team-accent-soft: rgba(148, 163, 184, .16); }
.team-metric__icon { position: relative; z-index: 2; display: grid; place-items: center; width: clamp(44px, 3.5vw, 56px); aspect-ratio: 1; border: 1px solid color-mix(in srgb, var(--team-accent) 20%, white); border-radius: 16px; background: linear-gradient(145deg, rgba(255,255,255,.96), var(--team-accent-soft)); box-shadow: inset 0 1px rgba(255,255,255,.95), 0 10px 22px -15px var(--team-accent); }
.team-metric__icon svg { width: 56%; height: 56%; fill: color-mix(in srgb, var(--team-accent) 18%, transparent); stroke: var(--team-accent); stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.team-metric__copy { position: relative; z-index: 2; min-width: 0; }
.team-metric__copy > span, .team-metric__copy > small { display: block; color: var(--team-muted); }
.team-metric__copy > span { font-size: clamp(11px, .85vw, 14px); font-weight: 600; color: #334155; }
.team-metric__copy > strong { display: block; margin: 5px 0 4px; font-size: clamp(25px, 2.05vw, 36px); line-height: 1; letter-spacing: -.045em; font-variant-numeric: tabular-nums; }
.team-metric__copy > small { font-size: clamp(9px, .7vw, 12px); }
.team-metric__watermark { position: absolute; right: clamp(8px, 1.5vw, 24px); top: 50%; width: clamp(48px, 5vw, 82px); height: clamp(48px, 5vw, 82px); transform: translateY(-50%); opacity: .1; color: var(--team-accent); }
.team-metric__watermark svg { width: 100%; height: 100%; fill: currentColor; stroke: currentColor; stroke-width: 1.2; }

.team-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, 28%); gap: clamp(12px, 1.4vw, 22px); align-items: stretch; }
.team-roster, .team-today { min-width: 0; border: 1px solid var(--team-edge); border-radius: 22px; background: var(--team-page-surface); box-shadow: var(--team-shadow), inset 0 1px rgba(255, 255, 255, .92); backdrop-filter: blur(18px) saturate(1.08); -webkit-backdrop-filter: blur(18px) saturate(1.08); overflow: hidden; }
.team-section-heading { display: flex; align-items: center; min-height: clamp(56px, 4.8vw, 72px); padding: 12px clamp(14px, 1.5vw, 22px); border-bottom: 1px solid var(--team-edge); }
.team-section-heading span, .team-section-heading strong { display: block; }
.team-section-heading span { color: #2563eb; font-size: clamp(9px, .68vw, 11px); font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.team-section-heading strong { margin-top: 3px; font-size: clamp(12px, .9vw, 15px); }
.team-roster__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1px; background: var(--team-edge); }
.team-person { display: grid; grid-template-columns: clamp(38px, 3.4vw, 48px) minmax(130px, 1.4fr) minmax(130px, 1fr) auto; align-items: center; gap: clamp(10px, 1.3vw, 20px); min-height: clamp(74px, 5.8vw, 92px); padding: 12px clamp(14px, 1.5vw, 22px); background: rgba(255, 255, 255, .82); }
.team-person__avatar { display: grid; place-items: center; width: clamp(38px, 3.4vw, 48px); aspect-ratio: 1; border: 1px solid rgba(148, 163, 184, .17); border-radius: 50%; background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(226,232,240,.82)); color: #334155; font-size: clamp(10px, .78vw, 13px); font-weight: 700; box-shadow: inset 0 1px #fff, 0 8px 18px -14px rgba(15,23,42,.7); }
.team-person__identity strong, .team-person__identity span, .team-person__clock span, .team-person__clock strong { display: block; }
.team-person__identity strong { font-size: clamp(11px, .86vw, 14px); }
.team-person__status { margin-top: 5px; color: var(--team-muted); font-size: clamp(9px, .7vw, 11px); }
.team-person__status i { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: #ff9f0a; box-shadow: 0 0 0 3px rgba(255,159,10,.08); }
.team-person--present .team-person__status { color: #248a3d; }
.team-person--present .team-person__status i { background: #34c759; }
.team-person--inactive .team-person__status i { background: #8e8e93; }
.team-person__clock span { color: var(--team-muted); font-size: clamp(8px, .65vw, 10px); }
.team-person__clock strong { margin-top: 4px; font-size: clamp(9px, .72vw, 11px); font-weight: 600; }
.team-person__actions { display: flex; gap: 6px; }
.team-mini-action { min-height: 30px; padding: 0 11px; border: 1px solid rgba(148, 163, 184, .2); border-radius: 999px; background: rgba(255,255,255,.56); color: #475569; box-shadow: inset 0 1px rgba(255,255,255,.9); font-size: 9px; transition: transform 180ms ease, box-shadow 180ms ease; }
.team-mini-action:hover { transform: scale(1.045); box-shadow: 0 7px 18px -13px rgba(0, 0, 0, .52); }
.team-records { max-height: 430px; margin: 0; padding: 0; overflow: auto; list-style: none; scrollbar-width: none; }
.team-records::-webkit-scrollbar { display: none; }
.team-records li { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; align-items: center; gap: 9px; min-height: 52px; padding: 10px 14px; border-bottom: 1px solid var(--team-edge); font-size: 10px; }
.team-records li > span:last-child { color: var(--team-muted); font-variant-numeric: tabular-nums; }
.team-record__dot { width: 6px; height: 6px; border-radius: 50%; background: #34c759; }
.team-empty { padding: 18px; color: var(--team-muted); font-size: 10px; }
.team-empty--today { display: flex !important; align-items: center; gap: 14px !important; min-height: clamp(92px, 7vw, 120px) !important; }
.team-empty__calendar { display: grid; place-items: center; width: 48px; height: 48px; flex: 0 0 48px; border-radius: 16px; background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(37,99,235,.11)); box-shadow: inset 0 1px white, 0 10px 22px -16px rgba(37,99,235,.65); }
.team-empty__calendar svg { width: 26px; height: 26px; fill: rgba(37,99,235,.12); stroke: #2563eb; stroke-width: 1.6; }

.team-action-tab {
  position: fixed;
  z-index: 1600;
  top: clamp(92px, 14vh, 150px);
  right: clamp(18px, 5vw, 80px);
  display: grid;
  gap: 13px;
  width: min(340px, calc(100vw - 28px));
  padding: 42px 18px 18px;
  border: 1px solid rgba(255, 255, 255, .76);
  border-radius: 26px;
  background: rgba(238, 239, 242, .82);
  box-shadow: inset 0 1px rgba(255, 255, 255, .92), 0 24px 70px -32px rgba(31, 35, 43, .55), 0 5px 15px -10px rgba(31, 35, 43, .32);
  backdrop-filter: blur(26px) saturate(1.15);
  -webkit-backdrop-filter: blur(26px) saturate(1.15);
  animation: team-tab-enter 220ms cubic-bezier(.2,.8,.2,1) both;
}
@keyframes team-tab-enter { from { opacity: 0; transform: translateY(12px) scale(.975); } }
.team-action-tab > p { margin: 0; color: #7a7a82; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.team-action-tab > h2 { margin: -8px 0 3px; font-size: 18px; letter-spacing: -.035em; }
.team-action-tab > small { color: #74747c; font-size: 9px; line-height: 1.45; }
.team-action-tab__traffic { position: absolute; top: 13px; right: 14px; display: flex; align-items: center; gap: 6px; }
.team-traffic { width: 11px; min-width: 11px; height: 11px; min-height: 11px; padding: 0; border: 0; border-radius: 50%; box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .18), inset 0 1px rgba(255, 255, 255, .35), 0 2px 5px -3px rgba(0, 0, 0, .55); filter: saturate(.84); }
.team-traffic--close { background: #ff5f57; }
.team-traffic--hide { background: #febc2e; }
.team-traffic--done { background: #28c840; }
.team-action-tab .system-input { margin: 0; }
.team-action-tab__confirm { padding: 14px; border: 1px solid rgba(60, 60, 67, .11); border-radius: 17px; background: rgba(255, 255, 255, .48); color: #48484d; font-size: 10px; line-height: 1.5; }
.team-action-tab[data-error]::after { content: attr(data-error); color: #c9342f; font-size: 9px; }

html[data-theme="night"] .team-page {
  --team-ink: #f5f5f7;
  --team-muted: #a8a8b0;
  --team-page-surface: rgba(38, 39, 43, .86);
  --team-panel: rgba(45, 46, 51, .8);
  --team-edge: rgba(255, 255, 255, .085);
  --team-shadow: 0 8px 24px rgba(0, 0, 0, .2);
  background:
    radial-gradient(circle at 12% 4%, rgba(90, 140, 220, .08), transparent 30%),
    linear-gradient(145deg, rgba(31,32,36,.97), rgba(25,26,30,.94));
}
html[data-theme="night"] .team-trust-strip,
html[data-theme="night"] .team-roster,
html[data-theme="night"] .team-today { background: var(--team-page-surface); box-shadow: inset 0 1px rgba(255, 255, 255, .045), var(--team-shadow); }
html[data-theme="night"] .team-trust-strip { color: #c7c7cc; }
html[data-theme="night"] .team-metric__copy > span { color: #dedee4; }
html[data-theme="night"] .team-person { background: rgba(43, 44, 49, .96); }
html[data-theme="night"] .team-person__avatar { background: linear-gradient(145deg, #44454b, #2d2e33); color: #f5f5f7; border-color: var(--team-edge); box-shadow: inset 0 1px rgba(255,255,255,.08); }
html[data-theme="night"] .team-mini-action { color: #c7c7cc; border-color: var(--team-edge); background: rgba(255,255,255,.045); }
html[data-theme="night"] .team-action-tab { border-color: rgba(255,255,255,.09); background: rgba(43,44,49,.9); color: #f5f5f7; box-shadow: inset 0 1px rgba(255,255,255,.06), 0 26px 70px -28px #000; }
html[data-theme="night"] .team-action-tab__confirm { border-color: var(--team-edge); background: rgba(255,255,255,.045); color: #d1d1d6; }

@media (max-width: 980px) {
  .team-layout { grid-template-columns: 1fr; }
  .team-roster__grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .team-page { gap: 10px; padding: 10px; border-radius: 21px; }
  .team-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team-metric { grid-template-columns: 40px minmax(0, 1fr); gap: 9px; min-height: 96px; padding: 12px; border-radius: 17px; }
  .team-metric__icon { width: 40px; border-radius: 13px; }
  .team-metric__watermark { width: 46px; height: 46px; right: 6px; }
  .team-trust-strip { align-items: flex-start; flex-wrap: wrap; }
  .team-trust-strip button { width: 100%; margin-left: 0; min-height: 32px; }
  .team-person { grid-template-columns: 40px minmax(0, 1fr); gap: 9px; padding: 11px 12px; }
  .team-person__clock, .team-person__actions { grid-column: 2; }
  .team-action-tab { inset: auto 10px calc(76px + env(safe-area-inset-bottom)); width: auto; }
}

@media (max-width: 340px) {
  .team-metrics { grid-template-columns: minmax(0, 1fr); }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .team-trust-strip,
  .team-metric,
  .team-roster,
  .team-today { background: #f8fafc; }
  html[data-theme="night"] .team-trust-strip,
  html[data-theme="night"] .team-metric,
  html[data-theme="night"] .team-roster,
  html[data-theme="night"] .team-today { background: #292a2e; }
}

@media (max-width: 899px) {
  .desktop-top-brand,
  .top-glass-navigation,
  .shell-profile-menu,
  .topbar-compact-action,
  .dashboard-edit-button {
    display: none;
  }
}