/* Develop overrides on top of the MultiplyOS kit. Keeps Develop's locked 24 Sep 2026 state colours, one-shape momentum glyph, person-row edge and ink active nav.
   Loaded after multiplyos.css; selectors match the kit's specificity so these win. */

:root {
  --mo-accent-tint: #F8F9FA;
  --mo-st-ok: #189A4E;
  --mo-st-ok-ink: #137B3E;
  --mo-st-watch: #F5D700;
  --mo-st-watch-ink: #7A6A00;
  --mo-st-attn: #F07E13;
  --mo-st-attn-ink: #9E520A;
  --mo-st-high: #E0301E;
  --mo-st-high-ink: #D52E1D;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --mo-st-ok: #189A4E;
    --mo-st-ok-ink: #2E9E5C;
    --mo-st-watch: #F5D700;
    --mo-st-watch-ink: #E8C200;
    --mo-st-attn: #F07E13;
    --mo-st-attn-ink: #E8893A;
    --mo-st-high: #E0301E;
    --mo-st-high-ink: #E24A3C;
  }
}

:root[data-theme="dark"] {
  --mo-st-ok: #189A4E;
  --mo-st-ok-ink: #2E9E5C;
  --mo-st-watch: #F5D700;
  --mo-st-watch-ink: #E8C200;
  --mo-st-attn: #F07E13;
  --mo-st-attn-ink: #E8893A;
  --mo-st-high: #E0301E;
  --mo-st-high-ink: #E24A3C;
}

[data-state="engaged"] { --mo-state-hue: var(--mo-st-ok); --mo-state-ring: var(--mo-st-ok-ink); }
[data-state="watch"] { --mo-state-hue: var(--mo-st-watch); --mo-state-ring: var(--mo-st-watch-ink); }
[data-state="attention"] { --mo-state-hue: var(--mo-st-attn); --mo-state-ring: var(--mo-st-attn-ink); }
[data-state="higher"] { --mo-state-hue: var(--mo-st-high); --mo-state-ring: var(--mo-st-high-ink); }

.mo-state.mo-hue-dot::after,
.mo-state.mo-hue-dot[data-state]::after,
.mo-state.mo-hue-dot[data-state="engaged"]::after,
.mo-state.mo-hue-dot[data-state="watch"]::after,
.mo-state.mo-hue-dot[data-state="attention"]::after,
.mo-state.mo-hue-dot[data-state="higher"]::after { content: none; }
.mo-state.mo-hue-dot { gap: 6px; }
.mo-state.mo-hue-dot[data-state="engaged"]::before {
  order: -2;
  border-color: var(--mo-state-ring);
  background: var(--mo-state-hue);
}
.mo-state.mo-hue-dot[data-state="watch"]::before {
  order: -2;
  border-color: var(--mo-state-ring);
  background: conic-gradient(var(--mo-state-hue) 0% 75%, transparent 75% 100%);
}
.mo-state.mo-hue-dot[data-state="attention"]::before {
  order: -2;
  border-color: var(--mo-state-ring);
  background: conic-gradient(var(--mo-state-hue) 0% 50%, transparent 50% 100%);
}
.mo-state.mo-hue-dot[data-state="higher"]::before {
  order: -2;
  border-color: var(--mo-state-ring);
  background: transparent;
}

.mo-person-row { border-left: 3px solid transparent; }
.mo-person-row[data-state] { border-left-color: var(--mo-state-hue); }

.mo-hue-edge.mo-tile[data-state="engaged"] {
  border-bottom: 3px solid var(--mo-state-hue);
  padding-bottom: 16px;
}
.mo-hue-edge.mo-card[data-state="engaged"] {
  border-left: 3px solid var(--mo-state-hue);
  padding-left: 16px;
}
.mo-hue-edge.mo-tile[data-state="watch"] {
  border-bottom: 3px solid var(--mo-state-hue);
  padding-bottom: 16px;
}
.mo-hue-edge.mo-card[data-state="watch"] {
  border-left: 3px solid var(--mo-state-hue);
  padding-left: 16px;
}
.mo-hue-edge.mo-tile[data-state="attention"] {
  border-bottom: 3px solid var(--mo-state-hue);
  padding-bottom: 16px;
}
.mo-hue-edge.mo-card[data-state="attention"] {
  border-left: 3px solid var(--mo-state-hue);
  padding-left: 16px;
}
.mo-hue-edge.mo-tile[data-state="higher"] {
  border-bottom: 3px solid var(--mo-state-hue);
  padding-bottom: 16px;
}
.mo-hue-edge.mo-card[data-state="higher"] {
  border-left: 3px solid var(--mo-state-hue);
  padding-left: 16px;
}

.mo-nav__item.is-active {
  background: var(--mo-inset);
  color: var(--mo-ink);
  font-weight: 600;
  border-left: 3px solid var(--mo-ink);
  padding-left: 10px;
}
.mo-nav__item.is-active .mo-nav__icon { color: var(--mo-ink); }
.mo-tabbar__tab.is-active { color: var(--mo-ink); font-weight: 600; }

.mo-side { overflow-y: auto; }