/* ??????????????+ FINAL_SPEC ???? */

:root,
:root[data-theme="light"] {
  --blue: #3a8b4e;
  --blue-dark: #2d6e3e;
  --blue-light: #5fad6e;
  --cyan: #3d9b8f;
  --bg: #f6f8f3;
  --card: #ffffff;
  --card2: #edf3e8;
  --hover: #e0ebda;
  --secondary: #edf3e8;
  --border2: #d2dfc9;
  --green: #5cb85c;
  --orange: #e8913a;
  --red: #e05248;
  --info: #4a9bd9;
  --teal: #479f8e;
  --text: #2c3e2d;
  --text2: #5e7560;
  --text3: #647866;
  --border: rgba(44, 62, 45, 0.08);
  --glow: rgba(58, 139, 78, 0.1);
  --grad-primary: #3a8b4e;
  --side: #f9fbf7;
  --topbar: rgba(255, 255, 255, 0.88);
  --priority-from: #123d2c;
  --priority-to: #2a7f5c;
  --font-display: "Exo 2", "Noto Sans SC", sans-serif;
  --font-ui: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-mono: "JetBrains Mono", "DIN Alternate", Consolas, monospace;
  color-scheme: light;
}

:root[data-theme="dark"] {
  --blue: #3b82f6;
  --blue-dark: #2563eb;
  --blue-light: #60a5fa;
  --cyan: #06b6d4;
  --bg: #0f1419;
  --card: #1a1f2e;
  --card2: #222838;
  --hover: #2a3041;
  --secondary: #222838;
  --border2: #2d3548;
  --green: #22c55e;
  --orange: #f59e0b;
  --red: #ef4444;
  --info: #3b82f6;
  --teal: #14b8a6;
  --text: #e2e8f0;
  --text2: #94a3b8;
  --text3: #8d9bb0;
  --border: rgba(255, 255, 255, 0.08);
  --glow: rgba(59, 130, 246, 0.12);
  --grad-primary: #3b82f6;
  --side: #1a1f2e;
  --topbar: rgba(26, 31, 46, 0.85);
  --priority-from: #0b1e3a;
  --priority-to: #1d4ed8;
  color-scheme: dark;
}

[hidden] { display: none !important; }

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; overflow: hidden; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 14px;
  line-height: 1.5;
}
h1, h2, .disp, .page-title h2, .brand { font-family: var(--font-display); }
.mono, .num, .value { font-family: var(--font-mono); }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--border2); border-radius: 4px; }
::-webkit-scrollbar-track { background: transparent; }

/* ===== ?? ===== */
#topbar {
  height: 56px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 16px 0 18px;
  background: var(--topbar);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--blue) 6%, transparent), 0 8px 24px color-mix(in srgb, var(--text) 3%, transparent);
  position: sticky;
  top: 0;
  z-index: 60;
  min-width: 0;
}
#topbar .logo {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  font-size: 15px;
  white-space: nowrap;
  flex-shrink: 0;
}
#topbar .logo .mark {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: linear-gradient(145deg, var(--blue-light), var(--blue-dark));
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 4px 10px color-mix(in srgb, var(--blue) 28%, transparent);
}
#topbar .logo-text {
  display: flex;
  flex-direction: column;
  gap: 0;
  line-height: 1.15;
}
#topbar .logo-text strong { font-size: 14px; }
#topbar .logo-text em {
  font-style: normal;
  font-size: 10px;
  letter-spacing: 0.08em;
  color: var(--text3);
  font-weight: 600;
}
.tb-nav,
.tb-nav-item { display: none !important; }
.tb-weather {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--blue) 6%, #fff);
  color: var(--text2);
  font-size: 12px;
  white-space: nowrap;
}
.tb-weather b { color: var(--text); font-weight: 700; }
.tb-weather.is-llm {
  border-color: color-mix(in srgb, var(--blue) 35%, var(--border));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--blue) 12%, transparent);
}
.tb-wx-ico {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 35%, #ffe08a 0 42%, transparent 43%),
    linear-gradient(145deg, #7ec8ff, #4a9bd9);
  flex-shrink: 0;
}
.ico-bell {
  display: block;
  width: 16px;
  height: 16px;
  background:
    radial-gradient(circle at 50% 18%, var(--text2) 0 28%, transparent 29%),
    linear-gradient(180deg, transparent 20%, var(--text2) 21% 72%, transparent 73%),
    radial-gradient(circle at 50% 78%, var(--text2) 0 18%, transparent 19%);
  mask: none;
}
.side-brand small {
  display: block;
  margin-top: 6px;
  font-size: 10px;
  color: var(--text3);
}
#topbar .logo-text strong {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
}
#topbar .logo-text em {
  font-style: normal;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--blue);
}
#topbar .logo em { font-style: normal; color: var(--blue); }
.farm-select {
  flex: 0 1 200px;
  max-width: 220px;
  min-width: 140px;
  background: var(--card);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 10px;
  height: 34px;
  padding: 0 10px;
  font-size: 12px;
  margin: 0;
  box-shadow: 0 1px 2px color-mix(in srgb, var(--text) 4%, transparent);
}
#g-search {
  flex: 0 1 220px;
  max-width: 240px;
  min-width: 0;
  height: 34px;
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--text2);
  cursor: pointer;
  font-size: 12px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 0 10px;
  overflow: hidden;
  box-shadow: 0 1px 2px color-mix(in srgb, var(--text) 4%, transparent);
}
#g-search > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
#g-search kbd {
  margin-left: auto;
  flex-shrink: 0;
  background: var(--card2);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 0 5px;
  font-size: 11px;
}
#topbar .sp { flex: 1 1 12px; min-width: 8px; }
.tb-clock {
  font-size: 12px;
  color: var(--text2);
  white-space: nowrap;
  flex-shrink: 0;
}
.tb-clock .num { color: var(--text); font-size: 14px; }
.wall-btn {
  flex-shrink: 0;
  height: 34px;
  margin: 0;
  white-space: nowrap;
  padding: 0 12px;
}
.icon-btn {
  position: relative;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border: 1px solid transparent;
  background: none;
  color: var(--text);
  font-size: 14px;
  flex-shrink: 0;
}
.icon-btn:hover { background: var(--hover); border-color: var(--border); }
.badge-dot {
  position: absolute;
  top: 2px;
  right: 2px;
  min-width: 15px;
  height: 15px;
  border-radius: 8px;
  background: var(--red);
  color: #fff;
  font-size: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 3px;
  font-weight: 600;
}
.avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--grad-primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 600;
  flex-shrink: 0;
}
.role-tag { font-size: 11px; color: var(--text2); line-height: 1.2; }

/* ????????????????*/
.user-role {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  min-width: 248px;
  max-width: 280px;
  height: 36px;
  padding: 0 8px 0 6px;
  margin-left: 2px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-sizing: border-box;
}
.user-role-meta {
  flex: 1 1 auto;
  min-width: 72px;
  overflow: hidden;
}
.user-role-name {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#roleSelect {
  flex: 0 0 96px;
  width: 96px;
  min-width: 96px;
  max-width: 96px;
  height: 28px;
  margin: 0;
  padding: 0 6px;
  font-size: 12px;
  background: var(--card2);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 6px;
}

/* ===== ?? ===== */
#layout {
  display: flex;
  height: calc(100vh - 56px);
  min-height: 0;
  overflow: hidden;
}
#sidebar {
  width: 220px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--blue) 4%, var(--side)), var(--side) 28%);
  border-right: 1px solid var(--border);
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  flex-shrink: 0;
  min-height: 0;
  padding: 10px 10px 16px;
  display: flex;
  flex-direction: column;
  transition: width 0.2s ease, padding 0.2s ease;
}
.side-head {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  margin-bottom: 2px;
  flex-shrink: 0;
}
.side-overview {
  min-width: 0;
  height: 38px;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 7px;
  border: 1px solid color-mix(in srgb, var(--blue) 16%, var(--border));
  border-radius: 10px;
  background: linear-gradient(110deg, color-mix(in srgb, var(--blue) 9%, var(--card)), var(--card));
  color: var(--text2);
  text-align: left;
  cursor: pointer;
  overflow: hidden;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.side-overview:hover {
  border-color: color-mix(in srgb, var(--blue) 34%, var(--border));
  background: color-mix(in srgb, var(--blue) 11%, var(--card));
  transform: translateY(-1px);
}
.side-overview-icon {
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--blue);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  box-shadow: 0 4px 10px color-mix(in srgb, var(--blue) 20%, transparent);
}
.side-overview-copy {
  min-width: 0;
  display: grid;
  gap: 1px;
}
.side-overview-copy strong {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--text);
  font-size: 11px;
  line-height: 1.2;
  white-space: nowrap;
}
.side-overview-copy strong i {
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: #33b66d;
  box-shadow: 0 0 0 3px color-mix(in srgb, #33b66d 13%, transparent);
}
.side-overview-copy small {
  overflow: hidden;
  color: var(--text3);
  font-size: 9px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.side-head .side-toggle {
  align-self: center;
  margin: 0;
}
.side-toggle {
  align-self: flex-end;
  width: 30px;
  height: 30px;
  margin: 0 0 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card);
  color: var(--text2);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-family: var(--font-ui);
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.side-toggle:hover {
  background: color-mix(in srgb, var(--blue) 10%, var(--card));
  color: var(--blue-dark);
  border-color: color-mix(in srgb, var(--blue) 28%, var(--border));
}
.side-toggle-ico {
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  transform: translateX(-1px);
}
#layout.is-side-collapsed #sidebar {
  width: 64px;
  padding: 10px 8px 12px;
}
#layout.is-side-collapsed .side-overview { display: none; }
#layout.is-side-collapsed .side-head {
  justify-content: center;
  min-height: 30px;
  margin-bottom: 10px;
}
#layout.is-side-collapsed .side-head .side-toggle { margin: 0; }
#layout.is-side-collapsed .side-toggle {
  align-self: center;
  margin-bottom: 10px;
}
#layout.is-side-collapsed .side-toggle-ico {
  transform: translateX(1px) rotate(180deg);
}
#layout.is-side-collapsed .nav-group,
#layout.is-side-collapsed .mod-name,
#layout.is-side-collapsed .side-brand {
  display: none;
}
#layout.is-side-collapsed .mod-head {
  justify-content: center;
  padding: 10px 0;
  gap: 0;
}
#layout.is-side-collapsed .mod-ico {
  width: 28px;
  height: 28px;
  font-size: 13px;
}
#nav { flex: 1 1 auto; }
.side-brand {
  margin-top: 16px;
  padding: 10px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--card);
  overflow: hidden;
}
.side-brand-art {
  height: 64px;
  border-radius: 10px;
  margin-bottom: 8px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 2px;
  padding: 9px 10px;
  color: #fff;
  background:
    linear-gradient(110deg, rgba(12, 49, 34, .86), rgba(12, 49, 34, .28)),
    url("img/farm-real/hero-xinjiang.jpg") center 52% / cover no-repeat;
}
.side-brand-art b { font: 750 13px/1.2 var(--font-display); }
.side-brand-art span { font-size: 9px; color: rgba(255, 255, 255, .82); }
.side-brand p {
  margin: 0;
  font-size: 11px;
  line-height: 1.45;
  color: var(--text2);
  font-weight: 600;
}
.nav-group {
  padding: 14px 12px 6px;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--text3);
  font-weight: 600;
}
.nav-group small {
  display: block;
  margin-top: 2px;
  font-size: 10px;
  letter-spacing: 0;
  font-weight: 500;
  color: var(--text3);
  opacity: 0.85;
}
.mod-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  margin: 2px 0;
  cursor: pointer;
  font-size: 13px;
  color: var(--text2);
  border: 1px solid transparent;
  border-radius: 10px;
  border-left: 0;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.mod-head:hover {
  background: color-mix(in srgb, var(--blue) 7%, var(--hover));
  color: var(--text);
}
.mod-head.active {
  color: var(--blue-dark);
  background: color-mix(in srgb, var(--blue) 12%, var(--card));
  border-color: color-mix(in srgb, var(--blue) 22%, var(--border));
  font-weight: 650;
  box-shadow: 0 4px 12px color-mix(in srgb, var(--blue) 10%, transparent);
}
.mod-ico {
  width: 22px;
  height: 22px;
  border-radius: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  background: color-mix(in srgb, var(--blue) 8%, var(--card2));
  color: var(--blue);
  opacity: 1;
}
.mod-head.active .mod-ico {
  background: color-mix(in srgb, var(--blue) 18%, transparent);
  color: var(--blue-dark);
}
#main {
  flex: 1;
  min-width: 0;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: 14px 18px 36px;
  position: relative;
  animation: fadeIn 0.28s ease;
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.crumb {
  font-size: 11px;
  color: var(--text3);
  margin: 0;
  white-space: nowrap;
}
.crumb.inline {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 6px;
  background: var(--card2);
  border: 1px solid var(--border);
}
.crumb b { color: var(--text2); font-weight: 500; }
.page-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px 14px;
  margin-bottom: 8px;
  flex-wrap: wrap;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
}
.page-title-main {
  display: contents;
}
.page-title h2 { font-size: 16px; font-weight: 700; letter-spacing: 0.2px; margin: 0; line-height: 1.2; }
.page-title .sub-t {
  font-size: 12px;
  color: var(--text3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: min(440px, 38vw);
}
.page-env {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  margin-left: auto;
  max-width: min(760px, 72vw);
  cursor: pointer;
}
.page-env[hidden] { display: none !important; }
.page-env-item {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  height: 24px;
  padding: 0 9px;
  border-radius: 6px;
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  background: color-mix(in srgb, var(--card) 88%, var(--cyan) 4%);
  white-space: nowrap;
}
.page-env-item em {
  font-family: var(--font-ui);
  font-style: normal;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--text3);
  transform: translateY(-0.5px);
}
.page-env-item b {
  font-family: var(--font-mono);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--text);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.page-env-item.is-warn {
  border-color: color-mix(in srgb, var(--orange) 42%, var(--border));
  background: color-mix(in srgb, var(--orange) 9%, var(--card));
}
.page-env-item.is-warn em {
  color: color-mix(in srgb, #9a3412 75%, var(--text3));
}
.page-env-item.is-warn b {
  color: #9a3412;
  font-weight: 700;
}
@media (max-width: 900px) {
  .page-env { margin-left: 0; max-width: 100%; width: 100%; }
  .page-title .sub-t { margin-left: 0; max-width: none; }
  .page-env-item b { font-size: 12px; }
}
.page-title.is-farm .page-path,
.page-title.is-farm .crumb { display: none !important; }
.page-title.is-farm .sub-t { max-width: min(620px, 56vw); }
.page-title:not(.is-farm) .sub-t {
  flex: 1 0 100%;
  max-width: 100%;
  margin-top: -5px;
}
.page-title .ops { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.page-path {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--text2);
  background: color-mix(in srgb, var(--green) 12%, var(--card));
  border: 1px solid color-mix(in srgb, var(--green) 28%, var(--border));
  white-space: nowrap;
}
.page-path.expert {
  color: var(--blue-dark);
  background: color-mix(in srgb, var(--blue) 12%, var(--card));
  border-color: color-mix(in srgb, var(--blue) 30%, var(--border));
}
.page-path.gov {
  color: #9a5b12;
  background: color-mix(in srgb, var(--orange) 12%, var(--card));
  border-color: color-mix(in srgb, var(--orange) 30%, var(--border));
}
:root[data-theme="dark"] .page-path.expert { color: var(--blue-light); }
:root[data-theme="dark"] .page-path.gov { color: #fbbf24; }

/* ===== ?? / KPI ===== */
.card, .panel {
  background: var(--card);
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 14px;
  padding: 16px 18px;
  box-shadow:
    0 1px 0 color-mix(in srgb, var(--text) 2.5%, transparent),
    0 10px 28px color-mix(in srgb, var(--blue) 5%, transparent);
}
.panel h3 {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 12px;
  color: var(--text);
  letter-spacing: 0.3px;
  font-family: var(--font-display);
}
.kpis { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-top: 4px; }
.kpis-lead { margin-bottom: 14px; }
.kpi, .card.kpi-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 14px 16px;
  position: relative;
  overflow: hidden;
  transition: border-color 0.15s, transform 0.15s, box-shadow 0.15s;
}
.kpis-lead .kpi:hover {
  border-color: color-mix(in srgb, var(--kc, var(--blue)) 45%, var(--border));
  transform: translateY(-1px);
  box-shadow: 0 8px 20px color-mix(in srgb, var(--kc, var(--blue)) 12%, transparent);
}
.kpi:before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  border-radius: 3px 0 0 3px;
  background: var(--kc, var(--blue));
}
.kpi .label, .k-label { font-size: 12px; color: var(--text2); }
.kpi .value, .k-val, .value {
  font-size: 26px;
  font-weight: 700;
  color: var(--kc, var(--blue));
  margin: 4px 0;
  line-height: 1.1;
}
.k-trend { font-size: 11px; color: var(--text3); }
.k-trend.up { color: var(--green); }

.grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 14px; margin-top: 14px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 14px; }
.item {
  background: var(--card2);
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 12px 14px;
  margin: 8px 0;
}
.item.ok { border-color: color-mix(in srgb, var(--green) 35%, transparent); }
.item.warn { border-color: color-mix(in srgb, var(--orange) 40%, transparent); background: color-mix(in srgb, var(--orange) 8%, var(--card)); }
.item.danger { border-color: color-mix(in srgb, var(--red) 35%, transparent); }
.ok { color: var(--green); }
.warn { color: var(--orange); }
.danger { color: var(--red); }
.sub { color: var(--text2); margin-top: 4px; font-size: 12px; }

/* ===== ???????????? ===== */
.priority {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 14px;
  margin-top: 4px;
}
.priority-unified { grid-template-columns: 1fr; }
.priority-main {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  padding: 18px 22px 20px;
  background: linear-gradient(120deg, var(--priority-from), var(--priority-to));
  color: #f7fff9;
}
.priority-kicker { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; opacity: 0.85; }
.priority-title { margin: 8px 0 8px; font-family: var(--font-display); font-size: 24px; line-height: 1.25; }
.priority-desc { opacity: 0.92; font-size: 13px; max-width: 48em; }
.priority-actions { margin-top: 14px; }
.priority-side { border-radius: 10px; padding: 16px 18px; background: var(--card); border: 1px solid var(--border); }
.weather-row { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 10px; }
.weather-row b { display: block; font-size: 18px; color: var(--text); font-family: var(--font-mono); }
.map-chrome { display: flex; align-items: center; gap: 8px; }
.mini-twin-clean .hud-float { display: none; }

.cmd-board {
  margin-top: 0;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--orange) 35%, var(--border));
  background: var(--card);
  box-shadow: 0 10px 28px color-mix(in srgb, var(--orange) 10%, transparent);
}
.cmd-board.is-ok {
  border-color: color-mix(in srgb, var(--green) 30%, var(--border));
  box-shadow: 0 10px 28px color-mix(in srgb, var(--green) 8%, transparent);
}
.cmd-live {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background: color-mix(in srgb, var(--card2) 80%, var(--blue) 6%);
  border-bottom: 1px solid var(--border);
}
.cmd-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text2);
  font-size: 12px;
  cursor: default;
}
button.cmd-chip {
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}
button.cmd-chip:hover {
  border-color: var(--blue);
  color: var(--blue);
  background: color-mix(in srgb, var(--blue) 8%, var(--card));
}
.cmd-chip b { color: var(--text); font-family: var(--font-mono); margin-left: 2px; }
.cmd-chip.ok { color: var(--green); border-color: color-mix(in srgb, var(--green) 35%, var(--border)); }
.cmd-chip.warn {
  color: var(--orange);
  border-color: color-mix(in srgb, var(--orange) 40%, var(--border));
  background: color-mix(in srgb, var(--orange) 10%, var(--card));
}
.cmd-chip.area {
  background: color-mix(in srgb, var(--blue) 10%, var(--card));
  border-color: color-mix(in srgb, var(--blue) 30%, var(--border));
  color: var(--blue);
  font-weight: 600;
}
.cmd-loop {
  margin-left: auto;
  font-size: 11px;
  color: var(--text3);
  letter-spacing: 0.04em;
}
.cmd-body {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(260px, 0.9fr);
  gap: 0;
}
.cmd-main {
  padding: 18px 20px 20px;
  background: linear-gradient(125deg, var(--priority-from), var(--priority-to));
  color: #f7fff9;
}
.cmd-kicker {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.cmd-badge {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(255,255,255,0.16);
  border: 1px solid rgba(255,255,255,0.22);
  font-size: 11px;
  letter-spacing: 0.08em;
}
.cmd-land-tag {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 10px;
  border-radius: 6px;
  background: rgba(0,0,0,0.18);
  font-size: 12px;
  font-weight: 600;
}
.cmd-title {
  margin: 0 0 10px;
  font-family: var(--font-display);
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.25;
  font-weight: 700;
}
.cmd-desc {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  opacity: 0.94;
  max-width: 42em;
}
.cmd-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.cmd-cta {
  height: 36px !important;
  padding: 0 16px !important;
  font-size: 14px !important;
  font-weight: 600;
  margin: 0 !important;
  background: #fff !important;
  color: var(--blue-dark) !important;
  border: 0 !important;
}
.cmd-cta:hover { filter: brightness(0.96); }
.cmd-cta-ghost {
  height: 36px !important;
  margin: 0 !important;
  background: transparent !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
}
.cmd-cta-ghost:hover {
  background: rgba(255,255,255,0.1) !important;
  color: #fff !important;
  border-color: #fff !important;
}
.cmd-facts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding: 14px;
  background: var(--card);
}
.cmd-fact {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px 12px 10px;
  background: var(--card2);
  min-height: 88px;
}
.cmd-fact .sub { display: block; margin: 0 0 6px; font-size: 11px; }
.cmd-fact b {
  display: block;
  font-size: 20px;
  line-height: 1.15;
  color: var(--text);
  font-family: var(--font-display);
}
.cmd-fact b.num { font-family: var(--font-mono); color: var(--orange); }
.cmd-fact em {
  display: block;
  margin-top: 6px;
  font-style: normal;
  font-size: 12px;
  color: var(--text3);
}
.cmd-meter {
  height: 6px;
  margin-top: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
}
.cmd-meter i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--orange), var(--green));
}
.cmd-fact.clickable { cursor: pointer; transition: border-color 0.15s, transform 0.15s; }
.cmd-fact.clickable:hover {
  border-color: var(--blue);
  transform: translateY(-1px);
}
@media (max-width: 980px) {
  .cmd-body { grid-template-columns: 1fr; }
  .cmd-loop { margin-left: 0; width: 100%; }
}

/* ===== ?? / ?? ===== */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 32px;
  padding: 0 12px;
  border-radius: 9px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  font-size: 13px;
  cursor: pointer;
  margin-right: 6px;
  transition: all 0.15s;
  box-shadow: 0 1px 2px color-mix(in srgb, var(--text) 4%, transparent);
}
.btn:hover { border-color: var(--blue); color: var(--blue); }
.btn.primary, .btn:not(.ghost):not(.danger) {
  background: var(--grad-primary);
  border-color: transparent;
  color: #fff;
}
.btn.primary:hover, .btn:not(.ghost):not(.danger):hover {
  background: var(--blue-dark);
  color: #fff;
}
.btn.ghost {
  background: transparent;
  color: var(--text);
  border: 1px solid var(--border);
}
.priority-main .btn { background: #fff; color: var(--blue-dark); border: 0; }
.priority-main .btn.ghost { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,0.35); }

.tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 1px 8px;
  border-radius: 10px;
  font-size: 11px;
  border: 1px solid transparent;
}
.tag.green { color: var(--green); background: color-mix(in srgb, var(--green) 12%, transparent); border-color: color-mix(in srgb, var(--green) 35%, transparent); }
.tag.orange { color: var(--orange); background: color-mix(in srgb, var(--orange) 12%, transparent); border-color: color-mix(in srgb, var(--orange) 35%, transparent); }
.tag.blue { color: var(--blue); background: color-mix(in srgb, var(--blue) 12%, transparent); border-color: color-mix(in srgb, var(--blue) 35%, transparent); }
.tag.red { color: var(--red); background: color-mix(in srgb, var(--red) 12%, transparent); border-color: color-mix(in srgb, var(--red) 35%, transparent); }
.tag.gray { color: var(--text2); background: color-mix(in srgb, var(--text2) 10%, transparent); border-color: color-mix(in srgb, var(--text2) 30%, transparent); }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; }
.dot.green { background: var(--green); }
.dot.orange { background: var(--orange); }
.dot.red { background: var(--red); }
.dot.pulse { animation: pulse 1.2s infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }

.table, .tbl { width: 100%; border-collapse: collapse; font-size: 13px; }
.table th, .table td, .tbl th, .tbl td {
  padding: 10px 8px;
  border-bottom: 1px solid var(--border);
  text-align: left;
}
.table th, .tbl th { color: var(--text2); font-weight: 600; background: var(--card2); }

input, select, textarea {
  width: 100%;
  background: var(--card2);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 8px 10px;
  margin: 6px 0 10px;
  font: 13px/1.4 var(--font-ui);
}
#topbar select,
#topbar .farm-select,
#topbar #roleSelect {
  width: auto;
  margin: 0;
  padding: 0 8px;
}
#topbar #roleSelect {
  width: 96px;
  min-width: 96px;
  max-width: 96px;
  padding: 0 6px;
}
#topbar .farm-select {
  width: 100%;
  max-width: 220px;
}
input:focus, select:focus, textarea:focus {
  outline: 2px solid color-mix(in srgb, var(--blue) 25%, transparent);
  border-color: var(--blue);
}

.twin {
  height: 520px;
  border-radius: 10px;
  background: linear-gradient(160deg, #1a2a1c 0%, #243528 45%, #1e3338 100%);
  position: relative;
  overflow: hidden;
  border: 1px solid var(--border);
}
:root[data-theme="light"] .twin {
  background: linear-gradient(160deg, #dfe8d6 0%, #c5d4bc 40%, #b7cfc8 100%);
}
.twin.basemap-moisture {
  background: linear-gradient(165deg, #2a2418 0%, #1e2f28 50%, #163044 100%);
}
:root[data-theme="light"] .twin.basemap-moisture {
  background: linear-gradient(165deg, #e8dfd0 0%, #d4e0d6 50%, #c5d8e8 100%);
}
.twin.basemap-crop {
  background: linear-gradient(165deg, #1a2818 0%, #243820 55%, #1c3020 100%);
}
:root[data-theme="light"] .twin.basemap-crop {
  background: linear-gradient(165deg, #dde8d4 0%, #c8dcb8 55%, #b8d4a8 100%);
}
.twin.basemap-risk {
  background: linear-gradient(165deg, #1c1818 0%, #2a2018 50%, #301818 100%);
}
:root[data-theme="light"] .twin.basemap-risk {
  background: linear-gradient(165deg, #e8e0d8 0%, #e0d0c4 50%, #e8c8c0 100%);
}
.twin.basemap-device {
  background: linear-gradient(165deg, #182018 0%, #1e2820 50%, #1a2428 100%);
}
:root[data-theme="light"] .twin.basemap-device {
  background: linear-gradient(165deg, #d8e0d4 0%, #c8d4c8 50%, #c0d0d4 100%);
}
svg.field { width: 100%; height: 100%; }
.plot {
  fill-opacity: 0.9;
  cursor: pointer;
  transition: fill-opacity 0.25s ease, filter 0.2s ease;
}
.plot:hover { fill-opacity: 1; filter: brightness(1.08); }
.plot.focus { filter: brightness(1.12); }
.plot-chip-bg {
  fill: rgba(12, 18, 14, 0.55);
  stroke: rgba(255, 255, 255, 0.18);
  stroke-width: 0.8;
  pointer-events: none;
}
:root[data-theme="light"] .plot-chip-bg {
  fill: rgba(255, 255, 255, 0.78);
  stroke: rgba(30, 50, 30, 0.15);
}
.plot-code {
  fill: #fff;
  font-size: 11px;
  font-weight: 700;
  font-family: var(--font-display);
  pointer-events: none;
}
:root[data-theme="light"] .plot-code { fill: #1e2e20; }
.plot-metric {
  fill: #e8f5e9;
  font-size: 10px;
  font-family: var(--font-mono);
  font-weight: 600;
  pointer-events: none;
}
:root[data-theme="light"] .plot-metric { fill: #243528; }
.plot-sub {
  fill: rgba(255, 255, 255, 0.72);
  font-size: 8px;
  pointer-events: none;
}
:root[data-theme="light"] .plot-sub { fill: rgba(30, 50, 30, 0.65); }
.heat-blob { pointer-events: none; }
.heat-core { pointer-events: none; }
.pulse-ring { animation: pulseRing 1.8s ease-in-out infinite; transform-origin: center; transform-box: fill-box; }
@keyframes pulseRing {
  0%, 100% { opacity: 0.55; transform: scale(1); }
  50% { opacity: 0.2; transform: scale(1.35); }
}

/* ???? ? Fleet overlay */
.dev-mark { cursor: pointer; }
.dev-halo { fill: rgba(255, 255, 255, 0.08); }
.dev-mark.online .dev-halo { fill: rgba(34, 197, 94, 0.18); animation: pulse 2s infinite; }
.dev-ring { fill: none; stroke: #fff; stroke-width: 1.5; }
.dev-core { fill: var(--cyan); }
.dev-mark.sensor .dev-core { fill: #38bdf8; }
.dev-mark.weather .dev-core { fill: #a78bfa; }
.dev-mark.irrigation .dev-core { fill: #3b82f6; }
.dev-mark.drone .dev-core { fill: #f59e0b; }
.dev-mark.tractor .dev-core { fill: #22c55e; }
.dev-mark.robot .dev-core { fill: #ec4899; }
.dev-mark.idle .dev-core { fill: #94a3b8; }
.dev-glyph {
  fill: #fff;
  font-size: 8px;
  font-weight: 700;
  font-family: var(--font-display);
  pointer-events: none;
}
.dev-label-bg { fill: rgba(10, 16, 12, 0.72); }
.dev-label {
  fill: #f1f5f9;
  font-size: 9px;
  font-family: var(--font-mono);
  pointer-events: none;
}
.cb-svg-label {
  fill: rgba(255, 255, 255, 0.75);
  font-size: 9px;
  font-family: var(--font-ui);
}
:root[data-theme="light"] .cb-svg-label { fill: rgba(30, 50, 30, 0.7); }

.legend { display: flex; gap: 14px; flex-wrap: wrap; color: var(--text2); font-size: 12px; margin-top: 10px; align-items: center; }
.legend-pro { justify-content: space-between; gap: 12px; }
.colorbar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 200px;
}
.colorbar svg { flex: 1; height: 12px; border-radius: 4px; overflow: hidden; border: 1px solid var(--border); }
.cb-low, .cb-high { font-size: 11px; color: var(--text3); white-space: nowrap; }
.device-legend { display: flex; flex-wrap: wrap; gap: 10px; font-size: 11px; color: var(--text2); }
.device-legend .dl {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin-right: 4px;
  vertical-align: middle;
}
.dl.sensor { background: #38bdf8; }
.dl.weather { background: #a78bfa; }
.dl.irrigation { background: #3b82f6; }
.dl.drone { background: #f59e0b; }
.dl.tractor { background: #22c55e; }
.dl.robot { background: #ec4899; }
.legend-hint { font-size: 11px; color: var(--text3); }

.layer-switch {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
  margin: 0 0 12px;
}
.layer-tab {
  text-align: left;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text2);
  cursor: pointer;
  transition: all 0.15s;
}
.layer-tab:hover { border-color: var(--blue); color: var(--text); }
.layer-tab.active {
  border-color: var(--blue);
  background: color-mix(in srgb, var(--blue) 12%, var(--card));
  color: var(--text);
  box-shadow: inset 3px 0 0 var(--blue);
}
.lt-name { display: block; font-weight: 600; font-size: 13px; font-family: var(--font-display); }
.lt-en { display: block; font-size: 10px; color: var(--text3); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.twin-stage {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr) 260px;
  gap: 12px;
  align-items: start;
}
.twin-rail .hud-panel { max-height: calc(100vh - 220px); overflow: auto; }
.twin-map-wrap { min-width: 0; }
.twin-hero .hud-float {
  position: absolute;
  top: 12px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(12, 18, 14, 0.55);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #f5faf5;
  z-index: 2;
  pointer-events: none;
}
:root[data-theme="light"] .twin-hero .hud-float {
  background: rgba(255, 255, 255, 0.82);
  color: var(--text);
  border-color: var(--border);
}
.hud-float.left { left: 12px; }
.hud-float.right { right: 12px; text-align: right; }
.hud-float .sub { opacity: 0.75; font-size: 10px; }
.hud-float b { font-size: 13px; font-family: var(--font-display); }

.land-row {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 8px;
  border-radius: 8px;
  cursor: pointer;
  margin: 4px 0;
  border: 1px solid transparent;
}
.land-row:hover { background: var(--hover); }
.land-row.active {
  background: color-mix(in srgb, var(--blue) 10%, var(--card2));
  border-color: color-mix(in srgb, var(--blue) 35%, transparent);
}
.land-row-body { flex: 1; min-width: 0; }
.swatch {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  flex-shrink: 0;
  margin-top: 4px;
  border: 1px solid rgba(0, 0, 0, 0.12);
}
.swatch.lg { width: 18px; height: 18px; border-radius: 4px; margin-top: 0; }
.metric-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 8px;
}
.metric-grid b { display: block; font-size: 16px; }

/* ===== ?? HUD ??????/??????===== */
.status-strip {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 8px 10px;
  margin-bottom: 12px;
  border-radius: 8px;
  background: var(--card);
  border: 1px solid var(--border);
}
.live-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--green);
  font-family: var(--font-mono);
}
.status-text { flex: 1; min-width: 160px; font-size: 13px; color: var(--text); }
.chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 26px;
  padding: 0 8px;
  border-radius: 99px;
  background: var(--card2);
  border: 1px solid var(--border);
  font-size: 11px;
  color: var(--text2);
  white-space: nowrap;
}
.hud-grid {
  display: grid;
  grid-template-columns: 1fr 1.35fr 1fr;
  gap: 12px;
  margin-top: 14px;
  align-items: start;
}
.hud-panel { min-width: 0; }
.dash-hud { align-items: stretch; }
.dash-side {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.dash-alerts,
.dash-feed {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.alert-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 10px;
  max-height: 280px;
  overflow: auto;
}
.alert-row {
  display: grid;
  grid-template-columns: 12px 1fr;
  gap: 10px;
  align-items: start;
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--card2);
  border: 1px solid transparent;
  cursor: pointer;
}
.alert-row:hover { border-color: var(--border); }
.alert-row.warn { border-color: color-mix(in srgb, var(--orange) 40%, transparent); }
.alert-body { min-width: 0; }
.alert-body b {
  display: block;
  font-size: 13px;
  line-height: 1.35;
  padding-right: 8px;
}
.ops-feed {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 10px;
  max-height: 320px;
  overflow: auto;
  border-left: 2px solid var(--border);
  padding-left: 12px;
}
.ops-feed-item {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
}
.ops-feed-item:last-child { border-bottom: 0; }
.ops-feed-item:hover .ops-feed-body { color: var(--blue); }
.ops-feed-time {
  font-size: 11px;
  color: var(--text3);
  padding-top: 2px;
}
.ops-feed-body { min-width: 0; font-size: 13px; line-height: 1.4; }
.ops-feed-body b { font-size: 12px; color: var(--text2); }

.ai-ops {
  margin-top: 14px;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--card) 92%, var(--cyan));
}
.ai-ops-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.ai-ops-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.ai-ops-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px;
  min-width: 0;
}
.ai-ops-title { font-weight: 600; margin: 6px 0 4px; font-size: 14px; }
.ai-conflict { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border); cursor: pointer; }
.ai-timeline { margin-top: 8px; display: flex; flex-direction: column; gap: 8px; }
.ai-tl-item {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 8px;
  align-items: start;
  font-size: 12px;
}
.ai-insight-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-top: 10px;
}
.ai-insight {
  text-align: left;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card2);
  color: inherit;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 4px;
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.ai-insight:hover { border-color: var(--blue); transform: translateY(-1px); }
.ai-insight b { font-size: 12px; font-weight: 600; line-height: 1.4; }

@media (max-width: 1200px) {
  .ai-ops-grid,
  .ai-insight-row { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .ai-ops-grid,
  .ai-insight-row { grid-template-columns: 1fr; }
}
.mini-twin {
  height: 260px;
  border-radius: 10px;
  margin-top: 8px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(160deg, #1a2a1c, #243528);
  border: 1px solid var(--border);
}
:root[data-theme="light"] .mini-twin {
  background: linear-gradient(160deg, #dfe8d6, #c5d4bc);
}
.mini-twin .hud-float {
  position: absolute;
  top: 8px;
  padding: 6px 8px;
  border-radius: 6px;
  background: rgba(12, 18, 14, 0.5);
  color: #fff;
  font-size: 11px;
  pointer-events: none;
}
:root[data-theme="light"] .mini-twin .hud-float {
  background: rgba(255, 255, 255, 0.85);
  color: var(--text);
}
.verify-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 8px 0 12px;
}
.verify-grid .sub { display: block; }
.verify-grid b { font-size: 18px; }
.agent-chip {
  display: grid;
  grid-template-columns: 12px 1fr auto;
  gap: 8px;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
}
.feed { max-height: 200px; overflow: auto; }
.feed-mask {
  mask-image: linear-gradient(180deg, #000 70%, transparent);
  -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent);
}
.feed-item {
  padding: 8px 10px;
  border-radius: 8px;
  margin: 6px 0;
  background: var(--card2);
  cursor: pointer;
  border: 1px solid transparent;
}
.feed-item:hover { border-color: var(--border); }
.feed-item.warn { border-color: color-mix(in srgb, var(--orange) 40%, transparent); }
.blink-soft { animation: blinkSoft 2.4s ease-in-out infinite; }
@keyframes blinkSoft {
  0%, 100% { background: color-mix(in srgb, var(--orange) 8%, var(--card2)); }
  50% { background: color-mix(in srgb, var(--orange) 16%, var(--card2)); }
}
.loop-chain {
  font-size: 12px;
  line-height: 1.55;
  color: var(--text2);
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--card2);
}
body.wall-mode #sidebar { display: none; }
body.wall-mode #main { padding: 14px 18px 28px; }

/* ===== ?????? ===== */
#wall-root {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 200;
  background: #060e1a;
}
#wall-root.show { display: block; }
body.wall-open #layout { visibility: hidden; }
body.wall-open #topbar { display: none; }

.wall-screen {
  height: 100vh;
  display: flex;
  flex-direction: column;
  color: #e2e8f0;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(20, 60, 120, 0.28), transparent 55%),
    radial-gradient(ellipse at 85% 90%, rgba(10, 40, 80, 0.2), transparent 50%),
    #060e1a;
  font-family: var(--font-ui);
  overflow: hidden;
}
.wall-top {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 10px 18px 8px;
  border-bottom: 1px solid rgba(59, 130, 246, 0.18);
  background: linear-gradient(180deg, rgba(8, 20, 40, 0.95), rgba(6, 14, 26, 0.55));
}
.wall-top h1 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 22px;
  letter-spacing: 0.18em;
  color: #e0f0ff;
  text-align: center;
  text-shadow: 0 0 24px rgba(59, 130, 246, 0.35);
}
.wall-top-l, .wall-top-r { display: flex; align-items: center; gap: 10px; }
.wall-top-r { justify-content: flex-end; }
.wall-date, .wall-clock { font-family: var(--font-mono); color: #64a0d4; font-size: 14px; }
.wall-clock { font-size: 20px; color: #93c5fd; font-weight: 600; }
.wall-status {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 8px 18px;
  font-size: 13px;
}
.wall-status b { color: #f8fafc; }
.wall-body {
  flex: 1;
  min-height: 280px;
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr) 280px;
  gap: 10px;
  padding: 0 12px 8px;
}
.wall-col { display: flex; flex-direction: column; gap: 10px; min-height: 0; }
.wall-panel {
  background: linear-gradient(135deg, rgba(8, 22, 48, 0.92), rgba(6, 16, 36, 0.88));
  border: 1px solid rgba(59, 130, 246, 0.2);
  border-radius: 6px;
  padding: 10px 12px;
  position: relative;
  overflow: hidden;
}
.wall-panel::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(59, 130, 246, 0.55), transparent);
}
.wall-panel.grow { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.wall-hd {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #c0daf0;
  margin-bottom: 8px;
  letter-spacing: 0.04em;
}
.wall-hd::before {
  content: "";
  width: 3px;
  height: 12px;
  border-radius: 2px;
  background: linear-gradient(180deg, #3b82f6, #06b6d4);
}
.wall-kpis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.wall-kpis > div {
  background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(59, 130, 246, 0.12);
  border-radius: 6px;
  padding: 8px 10px;
}
.wall-kpis span { display: block; font-size: 11px; color: #94a3b8; }
.wall-kpis b { font-size: 22px; color: #60a5fa; }
.wall-kpis small { font-size: 11px; color: #64748b; margin-left: 2px; }

.wall-agent-svg { width: 100%; height: 210px; }
.wall-link {
  stroke: rgba(96, 165, 250, 0.45);
  stroke-width: 1.2;
  stroke-dasharray: 4 4;
  animation: wallDash 8s linear infinite;
}
@keyframes wallDash { to { stroke-dashoffset: -40; } }
.wall-master-halo { fill: rgba(59, 130, 246, 0.15); animation: pulse 2s infinite; }
.wall-master-core { fill: #2563eb; stroke: #93c5fd; stroke-width: 1.5; }
.wall-master-text { fill: #fff; font-size: 9px; font-weight: 700; font-family: var(--font-display); }
.wall-agent-ring { fill: none; stroke: rgba(148, 163, 184, 0.45); stroke-width: 1.5; }
.wall-agent-ring.on { stroke: #22c55e; }
.wall-agent-core { fill: #0ea5e9; }
.wall-agent-label { fill: #94a3b8; font-size: 9px; }
.wall-agent-cap { font-size: 11px; color: #64748b; text-align: center; margin-top: 4px; }

.wall-prio .kicker { font-size: 11px; color: #60a5fa; letter-spacing: 0.08em; }
.wall-prio .title { font-size: 15px; font-weight: 700; margin: 6px 0; color: #f1f5f9; }
.wall-prio .desc { font-size: 12px; color: #94a3b8; line-height: 1.5; }

.wall-center { display: flex; flex-direction: column; gap: 8px; min-height: 0; }
.wall-map-tools { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.wall-seg {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border-radius: 6px;
  background: rgba(10, 16, 28, 0.55);
  border: 1px solid rgba(59, 130, 246, 0.18);
  backdrop-filter: blur(8px);
}
.twin-base-btn {
  border: 1px solid rgba(59, 130, 246, 0.2);
  background: rgba(15, 23, 42, 0.55);
  color: #94a3b8;
  padding: 4px 12px;
  font-size: 11px;
  cursor: pointer;
  border-radius: 4px;
  transition: 0.2s;
}
.twin-base-btn:hover { color: #e2e8f0; border-color: rgba(59, 130, 246, 0.4); }
.twin-base-btn.active {
  color: #fff;
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.75), rgba(37, 99, 235, 0.85));
  border-color: rgba(96, 165, 250, 0.5);
}
:root[data-theme="light"] .twin-scene-btns .twin-base-btn {
  background: rgba(255, 255, 255, 0.8);
  color: var(--text2);
  border-color: rgba(58, 139, 78, 0.2);
}
:root[data-theme="light"] .twin-scene-btns .twin-base-btn.active {
  background: linear-gradient(135deg, #3a8b4e, #3d9b8f);
  color: #fff;
}

.wall-map-stage {
  position: relative;
  flex: 1;
  min-height: 320px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(59, 130, 246, 0.25);
  background: #0b1524;
}
.wall-scene-photo,
.twin-scene-photo {
  position: absolute;
  inset: 0;
  background-image: var(--scene-img);
  background-size: cover;
  background-position: center;
  transform: scale(1.04);
  filter: saturate(1.05) contrast(1.05);
}
.wall-scene-veil,
.twin-scene-veil {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(6, 14, 26, 0.1), rgba(6, 14, 26, 0.26)),
    radial-gradient(ellipse at center, transparent 45%, rgba(6, 14, 26, 0.32) 100%);
  pointer-events: none;
}
.wall-map-stage.scene-growth .wall-scene-veil {
  background:
    linear-gradient(180deg, rgba(20, 80, 40, 0.1), rgba(6, 14, 26, 0.28)),
    linear-gradient(90deg, rgba(180, 40, 20, 0.06), transparent 40%, rgba(30, 140, 60, 0.1));
}
.wall-field, .wall-map-stage .wall-field {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
}
.wall-plot { cursor: pointer; }
.wall-plot polygon { transition: filter 0.2s, stroke-width 0.2s; }
.wall-plot:hover polygon { filter: brightness(1.08); }
.wall-plot-code, .wall-plot-metric {
  fill: #fff;
  font-size: 11px;
  font-weight: 700;
  pointer-events: none;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.65);
}
.wall-plot-metric { font-size: 10px; font-family: var(--font-mono); font-weight: 600; }
.wall-dev { fill: #38bdf8; stroke: #fff; stroke-width: 1.2; }
.wall-dev.drone { fill: #f59e0b; }
.wall-dev.tractor { fill: #22c55e; }
.wall-dev.robot { fill: #ec4899; }
.wall-dev.irrigation { fill: #3b82f6; }
.wall-dev-lab { fill: #e2e8f0; font-size: 9px; font-family: var(--font-mono); }
.wall-float { display: none; }
.wall-map-legend {
  position: absolute;
  left: 12px;
  bottom: 10px;
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 6px;
  background: rgba(8, 16, 14, 0.55);
  border: 1px solid rgba(255,255,255,0.1);
  color: #c8e6d4;
  font-size: 11px;
  pointer-events: none;
  backdrop-filter: blur(6px);
}
.wall-plot-card { display: none !important; }
.wall-focus-card {
  display: grid;
  grid-template-columns: 88px 1fr;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid rgba(143, 212, 168, 0.22);
  background: rgba(8, 18, 14, 0.55);
}
.wall-focus-photo {
  min-height: 110px;
  background-size: cover;
  background-position: center;
}
.wall-focus-body { padding: 10px 12px; }
.wall-command {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) auto;
  gap: 10px 16px;
  align-items: center;
  margin: 8px 12px 0;
  padding: 10px 14px;
  border-radius: 10px;
  background: linear-gradient(120deg, rgba(18, 56, 40, 0.92), rgba(28, 90, 64, 0.88));
  border: 1px solid rgba(143, 212, 168, 0.22);
  flex-shrink: 0;
}
.wall-command-main {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 12px;
  min-width: 0;
}
.wall-command-main b {
  font-size: 15px;
  color: #f1f8f4;
  font-family: var(--font-display);
}
.wall-command-desc {
  flex: 1 1 100%;
  font-size: 12px;
  color: #b7d9c6;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.wall-command-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  font-size: 11px;
  color: #9fcbb4;
}
.wall-command-actions { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.live-pill.soft {
  background: rgba(255,255,255,0.1);
  border-color: rgba(255,255,255,0.18);
}
.wall-weather {
  color: #9fcbb4;
  font-size: 12px;
  max-width: 220px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wall-status { display: none !important; }
.wall-body {
  flex: 1;
  min-height: 280px;
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr) 280px;
  gap: 10px;
  padding: 8px 12px;
}
.wall-ai-bar { flex-shrink: 0; margin: 8px 12px 0; }
@media (max-width: 1100px) {
  .wall-command { grid-template-columns: 1fr; }
  .wall-body { grid-template-columns: 1fr; overflow: auto; }
  .wall-center { min-height: 360px; }
}
.wall-plot-metrics {
  display: flex;
  gap: 12px;
  margin-top: 8px;
  font-size: 12px;
  color: #94a3b8;
}
.wall-plot-metrics b { color: #e2e8f0; margin-left: 4px; }

.wall-cams {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.wall-cam {
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid rgba(59, 130, 246, 0.2);
  background: #0b1524;
  position: relative;
  height: 72px;
  padding: 0;
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.wall-cam:hover {
  transform: translateY(-2px);
  border-color: rgba(96, 165, 250, 0.55);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}
.wall-card-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.wall-card-actions .btn { margin: 0; }

.clickable { cursor: pointer; transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease; }
.clickable:hover { filter: brightness(1.03); }
.linkish { color: var(--blue); text-decoration: underline; text-underline-offset: 2px; }
.row-focus { background: color-mix(in srgb, var(--blue) 12%, transparent) !important; }
.row-focus td { border-bottom-color: color-mix(in srgb, var(--blue) 30%, transparent); }

.btn, .mod-head, .layer-tab, .twin-base-btn, .land-row, .feed-item, .agent-chip, .item.clickable {
  transition: all 0.18s ease;
}
.btn:active { transform: scale(0.98); }
.btn:focus-visible, .mod-head:focus-visible, .icon-btn:focus-visible, .twin-base-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--blue) 55%, transparent);
  outline-offset: 2px;
}
.agent-chip:hover, .land-row:hover, .feed-item:hover {
  transform: translateX(2px);
}

#cmd-panel {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 120;
  background: rgba(8, 12, 18, 0.45);
  backdrop-filter: blur(4px);
  align-items: flex-start;
  justify-content: center;
  padding-top: 12vh;
}
#cmd-panel.show { display: flex; }
.cmd-box {
  width: min(560px, 92vw);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.28);
  overflow: hidden;
  animation: fadeIn 0.2s ease;
}
#cmd-input {
  width: 100%;
  margin: 0;
  border: 0;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
  padding: 16px 18px;
  font-size: 15px;
  background: transparent;
}
#cmd-list { max-height: 360px; overflow: auto; padding: 8px; }
.cmd-item {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  padding: 10px 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  margin-bottom: 2px;
}
.cmd-item:hover { background: var(--hover); }
.cmd-item b { font-weight: 600; }

.table tr { transition: background 0.15s ease; }
.table tr.clickable:hover, .table tr:hover { background: var(--hover); }

.arch-card.clickable:hover {
  border-color: var(--blue);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px color-mix(in srgb, var(--blue) 12%, transparent);
}
.cam-label {
  position: absolute;
  left: 6px;
  top: 4px;
  z-index: 2;
  font-size: 10px;
  color: #e2e8f0;
  background: rgba(0, 0, 0, 0.45);
  padding: 1px 6px;
  border-radius: 3px;
}
.cam-view {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  animation: camDrift 18s ease-in-out infinite alternate;
}
.cam-view.c1 { background-image: url("img/farm-real/farm-orthophoto.jpg"); }
.cam-view.c2 { background-image: url("img/farm-real/cotton-field.jpg"); }
.cam-view.c3 { background-image: url("img/farm-real/cotton-harvest.jpg"); }
.cam-view.c4 { background-image: url("img/farm-real/corn-field.jpg"); }
@keyframes camDrift {
  from { transform: scale(1.05) translateX(0); }
  to { transform: scale(1.12) translateX(-2%); }
}

.wall-lands, .wall-feed, .wall-fleet { overflow: auto; min-height: 0; }
.wall-land {
  display: flex;
  gap: 8px;
  padding: 8px;
  border-radius: 6px;
  cursor: pointer;
  margin-bottom: 4px;
  border: 1px solid transparent;
}
.wall-land:hover, .wall-land.on {
  background: rgba(59, 130, 246, 0.1);
  border-color: rgba(59, 130, 246, 0.25);
}
.wall-feed-item {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 8px;
  padding: 7px 4px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  font-size: 12px;
  color: #cbd5e1;
}
.wall-feed-item .t { color: #64748b; font-family: var(--font-mono); font-size: 11px; }
.wall-feed-item.flash { animation: flash 0.6s; }
@keyframes flash {
  0% { background: rgba(59, 130, 246, 0.18); }
  100% { background: transparent; }
}
.wall-fleet-row {
  display: grid;
  grid-template-columns: 12px 1fr auto;
  gap: 8px;
  align-items: center;
  padding: 6px 0;
  font-size: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.wall-foot {
  padding: 8px 16px 12px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  border-top: 1px solid rgba(59, 130, 246, 0.15);
}
.wall-loop {
  flex: 1;
  font-size: 12px;
  color: #cbd5e1;
  padding: 8px 12px;
  border-radius: 6px;
  background: linear-gradient(90deg, rgba(15, 23, 42, 0.9), rgba(30, 64, 175, 0.25), rgba(15, 23, 42, 0.9));
  background-size: 200% 100%;
  animation: flow 12s linear infinite;
}
.wall-foot-meta { font-size: 11px; color: #64748b; white-space: nowrap; }

.twin.scene-satellite,
.twin.scene-field {
  background: #1a2a1c;
}
.twin-scene-photo { z-index: 0; }
.twin-scene-veil { z-index: 1; }
.twin.scene-satellite .field-pro,
.twin.scene-field .field-pro { position: relative; z-index: 2; }
.twin.scene-satellite .plot,
.twin.scene-field .plot { fill-opacity: 0.62; }
.twin.scene-satellite .plot:hover,
.twin.scene-field .plot:hover,
.twin.scene-satellite .plot.focus,
.twin.scene-field .plot.focus { fill-opacity: 0.85; }

.scene-thumb {
  height: 110px;
  border-radius: 8px;
  background-size: cover;
  background-position: center;
  margin-bottom: 10px;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--border);
}
.scene-thumb span {
  position: absolute;
  left: 8px;
  bottom: 8px;
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
}

.sensor-dot { cursor: pointer; stroke: rgba(255,255,255,0.65); stroke-width: 0.8; transition: r 0.15s ease, opacity 0.15s; }
.sensor-dot.dim { opacity: 0.28; }
.sensor-dot:hover { opacity: 1; }

.module-hero {
  height: 120px;
  border-radius: 10px;
  margin-bottom: 12px;
  background-image: var(--hero);
  background-size: cover;
  background-position: center;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--border);
}
.module-hero-veil {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, color-mix(in srgb, var(--bg) 55%, transparent), transparent 55%);
}

.agent-chain { display: flex; flex-wrap: wrap; gap: 8px; align-items: stretch; margin: 8px 0 12px; }
.agent-chain-node {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 10px 12px;
  background: var(--card2);
  border-radius: 8px;
  border: 1px solid var(--border);
  min-width: 140px;
  flex: 1;
  position: relative;
}
.agent-chain-arrow {
  position: absolute;
  right: -10px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text3);
  font-weight: 700;
  z-index: 1;
}
.vendor-card { transition: transform 0.18s ease, border-color 0.18s ease; }
.vendor-card:hover { transform: translateY(-2px); border-color: var(--blue); }

@media (max-width: 1100px) {
  .kpis { grid-template-columns: repeat(2, 1fr); }
  .layer-switch { grid-template-columns: repeat(2, 1fr); }
}

.chat-log {
  height: 220px;
  overflow: auto;
  background: var(--card2);
  border-radius: 8px;
  padding: 12px;
  border: 1px solid var(--border);
}
.ai-chat-empty {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 8px;
  padding: 14px;
  border: 1px dashed color-mix(in srgb, var(--orange) 32%, var(--border));
  border-radius: 10px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--orange) 5%, var(--card)), color-mix(in srgb, var(--green) 5%, var(--card)));
}
.ai-chat-empty b { font-size: 15px; color: var(--text); }
.ai-chat-empty p { max-width: 46em; margin: 0; color: var(--text2); font-size: 12px; line-height: 1.65; }
.ai-chat-empty > div { display: flex; flex-wrap: wrap; gap: 6px; }
.ai-chat-empty > div span { padding: 4px 8px; border-radius: 999px; background: var(--card); border: 1px solid var(--border); color: var(--text3); font-size: 11px; }
.msg { margin: 8px 0; }
.bar { height: 8px; background: var(--card2); border: 1px solid var(--border); border-radius: 99px; overflow: hidden; margin-top: 8px; }
.bar > span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--blue-dark), var(--green));
  transition: width 0.45s ease;
}
.loop-strip {
  margin-top: 14px;
  padding: 12px 16px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(90deg, var(--priority-from), var(--grad-primary), var(--cyan), var(--grad-primary), var(--priority-from));
  background-size: 220% 100%;
  animation: flow 10s linear infinite;
  font-size: 13px;
}
@keyframes flow { 0% { background-position: 0% 50%; } 100% { background-position: 200% 50%; } }

.toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.layer-btns { display: flex; gap: 6px; flex-wrap: wrap; }
.row-between { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.mono { font-family: var(--font-mono); font-size: 12px; color: var(--cyan); }
.form-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; align-items: end; }
.form-row .btn { margin: 6px 0 10px; height: 36px; width: 100%; justify-content: center; }
.card.compact { padding: 14px; }
.twin-cards { grid-template-columns: repeat(2, 1fr); }
.device-dot { fill: var(--cyan); stroke: #fff; stroke-width: 1.5; }
.device-dot.drone { fill: var(--orange); }
.device-dot.tractor { fill: var(--green); }
.device-dot.robot { fill: #c45d7a; }
.device-dot.irrigation { fill: var(--info); }
.arch-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 12px; }
.arch-card { background: var(--card2); border-radius: 8px; padding: 14px; border: 1px solid var(--border); }
.arch-title { font-family: var(--font-display); font-weight: 600; margin-bottom: 8px; color: var(--blue); }

#toast-wrap {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 100;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.toast {
  min-width: 240px;
  max-width: 360px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 14px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
  animation: fadeIn 0.25s ease;
}
.toast b { display: block; margin-bottom: 2px; }
.toast .t-sub { font-size: 12px; color: var(--text2); }

#notif-panel {
  display: none;
  position: absolute;
  right: 60px;
  top: 48px;
  width: 340px;
  max-height: calc(100dvh - 64px);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18);
  z-index: 80;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}
#notif-panel.show { display: block; }
#notif-panel .n-head {
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  font-weight: 600;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--card);
}
#notif-panel .n-close { width: 34px; min-width: 34px; height: 34px; }
#notif-panel .n-item {
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
}
#notif-panel .n-item:hover { background: var(--hover); }

@media (max-width: 1100px) {
  /* ?????????? body + layout ?????? */
  #layout {
    flex-direction: column;
    height: calc(100vh - 56px);
    overflow: hidden;
  }
  html, body { overflow: hidden; }
  #sidebar {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    overflow-x: auto;
    overflow-y: hidden;
    flex-shrink: 0;
    padding: 0 8px;
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }
  .side-head { display: none; }
  .side-toggle { display: none; }
  #layout.is-side-collapsed #sidebar {
    width: 100%;
    padding: 0 8px;
  }
  #layout.is-side-collapsed .mod-name {
    display: inline;
  }
  #layout.is-side-collapsed .nav-group,
  #layout.is-side-collapsed .side-brand {
    display: none;
  }
  #layout.is-side-collapsed .mod-head {
    justify-content: flex-start;
    padding: 9px 12px;
    gap: 10px;
  }
  #nav {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 2px;
    flex: 1;
    min-width: 0;
  }
  #main { flex: 1; min-height: 0; }
  .mod-head { white-space: nowrap; border-left: 0; border-bottom: 2px solid transparent; }
  .mod-head.active { border-bottom-color: var(--blue); border-left-color: transparent; }
  .kpis, .grid, .grid-3, .arch-grid, .form-row, .twin-cards, .priority, .hud-grid, .twin-stage, .layer-switch { grid-template-columns: 1fr; }
  .twin { height: 380px; }
  .lt-en { display: none; }
  #g-search { display: none; }
  .farm-select { max-width: 160px; flex-basis: 160px; }
  .user-role { min-width: 220px; }
  #roleSelect { flex-basis: 88px; width: 88px; min-width: 88px; }
  .tb-clock { display: none; }
  .wall-btn { display: none; }
}
@media (max-width: 720px) {
  .user-role-meta { display: none; }
  .user-role { min-width: 140px; max-width: 160px; }
  .farm-select { display: none; }
}

/* v102 · 键盘用户可直接绕过顶部与导航，进入当前页面。 */
.skip-link {
  position: fixed;
  z-index: 10000;
  top: 8px;
  left: 8px;
  padding: 10px 14px;
  border-radius: 8px;
  color: #fff;
  background: #0f3d2c;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .24);
  transform: translateY(-180%);
  transition: transform .15s ease;
}
.skip-link:focus { transform: translateY(0); }
.wall-plot:focus polygon,
.wall-dev-g:focus .wall-dev-halo,
.wall-sensor:focus,
.wall-plant:focus,
.wall-cam:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  filter: drop-shadow(0 0 5px #123f2e);
}

/* ===== ???? v2 ????????/????===== */
.wall-brand-mini { font-family: var(--font-display); font-size: 12px; letter-spacing: 0.12em; color: #7dcea0; font-weight: 600; }
.wall-status-btn { padding: 4px 10px !important; font-size: 12px !important; margin: 0 !important; }
.wall-ai-bar {
  display: grid;
  grid-template-columns: 1fr 1.2fr 0.9fr 1.6fr;
  gap: 8px;
  padding: 0 12px 8px;
}
.wall-ai-item {
  background: linear-gradient(135deg, rgba(12, 32, 24, 0.92), rgba(8, 20, 28, 0.9));
  border: 1px solid rgba(70, 150, 110, 0.28);
  border-radius: 6px;
  padding: 8px 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.wall-ai-item .sub { font-size: 11px; color: #7a9a88; }
.wall-ai-item b { font-size: 18px; color: #8fd4a8; }
.wall-ai-item > span:last-child { font-size: 11px; color: #94a3b8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wall-mini-bar { height: 4px; border-radius: 2px; background: rgba(255,255,255,0.08); margin-top: 4px; overflow: hidden; }
.wall-mini-bar i { display: block; height: 100%; background: linear-gradient(90deg, #2f9e7a, #5ec4ff); }
.wall-ai-timeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  background: linear-gradient(135deg, rgba(12, 32, 24, 0.92), rgba(8, 20, 28, 0.9));
  border: 1px solid rgba(70, 150, 110, 0.28);
  border-radius: 6px;
  padding: 8px 10px;
}
.wall-ai-tl {
  display: flex; flex-direction: column; gap: 2px; font-size: 11px;
  border-left: 2px solid rgba(47, 158, 122, 0.45); padding-left: 8px; min-width: 0;
}
.wall-ai-tl .mono { color: #7eb89a; }
.wall-ai-tl em { color: #64748b; font-style: normal; font-size: 10px; }
.wall-body { grid-template-columns: 300px minmax(0, 1fr) 300px; }
.wall-panel {
  background: linear-gradient(145deg, rgba(10, 28, 22, 0.94), rgba(8, 18, 28, 0.9)) !important;
  border-color: rgba(70, 150, 110, 0.22) !important;
  border-radius: 8px;
}
.wall-hd { color: #c8e6d4; }
.wall-hd::before { background: linear-gradient(180deg, #2f9e7a, #5ec4ff); }
.wall-kpis b { color: #8fd4a8 !important; }
.wall-kpis span { color: #7a9a88 !important; }
.wall-link.hot { stroke: rgba(94, 196, 255, 0.55); stroke-dasharray: 4 3; animation: wallLinkFlow 2.4s linear infinite; }
.wall-link.pulse-once { stroke: #8fd4a8; stroke-width: 2; }
@keyframes wallLinkFlow { to { stroke-dashoffset: -28; } }
.wall-master-halo { fill: rgba(47, 158, 122, 0.18) !important; }
.wall-master-core { fill: #1f7a56 !important; stroke: #8fd4a8 !important; }
.wall-agent-ring.hot { stroke: #5ec4ff; }
.wall-agent-core { fill: #2a8f6a !important; }
.wall-agent-core.hot { fill: #3b9fd4 !important; }
.wall-agent-chain { display: flex; flex-direction: column; gap: 6px; max-height: 120px; overflow: auto; margin-top: 4px; }
.wall-chain-node {
  display: flex; align-items: flex-start; gap: 8px; padding: 6px 8px; border-radius: 6px;
  background: rgba(8, 20, 16, 0.5); border: 1px solid rgba(70, 150, 110, 0.15); position: relative; font-size: 11px;
}
.wall-chain-node b { color: #e2e8f0; font-size: 12px; }
.wall-chain-arrow { position: absolute; right: 8px; top: 8px; color: #5a8a72; font-weight: 700; }
.wall-chain-empty { font-size: 11px; color: #64748b; text-align: center; padding: 8px; }
.wall-prio .kicker { color: #7eb89a !important; }
.wall-screen .twin-base-btn.active {
  background: rgba(47, 158, 122, 0.28) !important;
  border-color: rgba(143, 212, 168, 0.55) !important;
  color: #e8f5ec !important;
}
.wall-map-stage { border-color: rgba(70, 150, 110, 0.28) !important; background: #0a1612 !important; }
.wall-field { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; z-index: 2; }
.wall-dev-halo { fill: rgba(94, 196, 255, 0.18); animation: pulse 2.2s infinite; }
.wall-sensor { stroke: rgba(255,255,255,0.55); stroke-width: 0.6; }
.wall-sensor.dim { opacity: 0.28; }
.wall-plot-card { display: none !important; }
.wall-plot-photo { background-size: cover; background-position: center; min-height: 100%; }
.wall-plot-card-body { padding: 10px 12px; }
@media (max-width: 1280px) {
  .wall-command { grid-template-columns: 1fr; }
}
.wall-plot-metrics { display: grid !important; grid-template-columns: 1fr 1fr; gap: 4px 10px; margin: 8px 0; }
.wall-cam {
  height: auto !important;
  display: flex;
  flex-direction: column;
  border-color: rgba(70, 150, 110, 0.25) !important;
  border-radius: 8px !important;
}
.wall-cam .cam-view {
  height: 78px;
  background-size: cover;
  background-position: center;
  position: relative;
  animation: camDrift 22s ease-in-out infinite alternate;
}
.wall-cam .cam-rec {
  position: absolute; top: 6px; left: 6px; display: inline-flex; align-items: center; gap: 4px;
  font-size: 9px; font-weight: 700; letter-spacing: 0.08em; color: #fff;
  background: rgba(180, 40, 40, 0.75); padding: 2px 6px; border-radius: 3px;
}
.wall-cam .cam-rec i { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: pulse 1.2s infinite; }
.wall-cam .cam-zone {
  position: absolute; right: 6px; bottom: 6px; font-size: 10px; color: #fff;
  background: rgba(0,0,0,0.45); padding: 2px 6px; border-radius: 3px;
}
.wall-cam .cam-label {
  position: static !important; display: flex; flex-direction: column; gap: 2px;
  padding: 6px 8px; text-align: left; background: rgba(8, 18, 14, 0.95);
}
.wall-cam .cam-label b { font-size: 11px; color: #e2e8f0; }
.wall-cam .cam-label span { font-size: 10px; color: #7a9a88; }
.wall-land {
  display: grid !important;
  grid-template-columns: 44px 1fr;
  align-items: center;
  gap: 8px;
  padding: 6px !important;
}
.wall-land-thumb {
  width: 44px; height: 44px; border-radius: 5px; background-size: cover; background-position: center;
  background-color: #1a2a22; border: 1px solid rgba(255,255,255,0.08);
}
.wall-land-body { min-width: 0; }
.wall-land-body .bar { height: 3px; margin-top: 4px; background: rgba(255,255,255,0.08); border-radius: 2px; overflow: hidden; }
.wall-land-body .bar span { display: block; height: 100%; border-radius: 2px; }
.wall-land.on, .wall-land:hover {
  background: rgba(47, 158, 122, 0.12) !important;
  border-color: rgba(143, 212, 168, 0.28) !important;
}
.wall-joint {
  padding: 8px 10px; border-radius: 6px; background: rgba(47, 158, 122, 0.1);
  border: 1px solid rgba(143, 212, 168, 0.25); margin-bottom: 8px; cursor: pointer;
}
.wall-joint-title { font-size: 12px; color: #e2e8f0; margin: 4px 0; line-height: 1.35; }
.wall-joint .bar { height: 4px; margin: 8px 0; background: rgba(255,255,255,0.08); border-radius: 2px; overflow: hidden; }
.wall-joint .bar span { display: block; height: 100%; background: linear-gradient(90deg, #2f9e7a, #5ec4ff); }
.wall-joint-machines { display: flex; flex-wrap: wrap; gap: 4px; }
.wall-mchip {
  font-size: 10px; padding: 2px 6px; border-radius: 4px; background: rgba(8, 20, 16, 0.7);
  border: 1px solid rgba(70, 150, 110, 0.3); color: #b6d4c4; cursor: pointer;
}
.wall-mchip:hover { border-color: #8fd4a8; color: #fff; }
.wall-loop {
  background: linear-gradient(90deg, transparent, rgba(47, 158, 122, 0.14), transparent) !important;
  color: #a8c4b4 !important;
}
.wall-top {
  border-bottom-color: rgba(56, 120, 90, 0.28) !important;
  background: linear-gradient(180deg, rgba(8, 18, 14, 0.96), rgba(6, 14, 18, 0.7)) !important;
}
.wall-top h1 { color: #e8f5ec !important; text-shadow: 0 0 28px rgba(45, 140, 90, 0.28) !important; letter-spacing: 0.12em !important; }
.wall-clock { color: #a8e0c0 !important; }
.wall-date { color: #7eb89a !important; }
@media (max-width: 1200px) {
  .wall-ai-bar { grid-template-columns: 1fr 1fr; }
  .wall-ai-timeline { grid-template-columns: 1fr 1fr; }
}
/* ===== ?????? ===== */
.plant-view-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  flex-wrap: wrap;
}
.plant-dot { cursor: pointer; stroke: rgba(255,255,255,0.7); stroke-width: 0.7; }
.plant-dot.dim { opacity: 0.25; }
.plant-dot.watch { stroke: #f59e0b; stroke-width: 1.4; }
.plant-dot.on { stroke: #fff; stroke-width: 2; }
.plant-dual-mini {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 8px;
}
.plant-dual-mini .bar { height: 4px; margin-top: 4px; }
.plant-workspace {
  display: grid;
  grid-template-columns: 0.95fr 1.35fr;
  gap: 12px;
  align-items: start;
}
.plant-list { max-height: 560px; overflow: auto; margin-top: 8px; }
.plant-row {
  display: grid;
  grid-template-columns: 12px 1fr;
  gap: 10px;
  align-items: start;
  padding: 10px;
  border-radius: 8px;
  border: 1px solid transparent;
  margin-bottom: 6px;
  background: var(--card2);
  cursor: pointer;
}
.plant-row:hover, .plant-row.on { border-color: var(--blue); background: color-mix(in srgb, var(--blue) 8%, var(--card2)); }
.plant-row.watch { border-color: color-mix(in srgb, var(--orange) 35%, transparent); }
.plant-morph-rail {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 6px;
  margin-top: 12px;
}
.morph-step {
  padding: 8px 6px;
  border-radius: 6px;
  background: var(--card2);
  border: 1px solid var(--border);
  text-align: center;
  font-size: 11px;
}
.morph-step.done { opacity: 0.7; border-color: color-mix(in srgb, var(--green) 40%, var(--border)); }
.morph-step.on {
  border-color: var(--blue);
  background: color-mix(in srgb, var(--blue) 12%, var(--card));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--blue) 25%, transparent);
}
.plant-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 14px;
}
.plant-half {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px;
  background: var(--card2);
  min-width: 0;
}
.plant-half.canopy {
  background:
    linear-gradient(180deg, color-mix(in srgb, #7CB342 12%, transparent), transparent 40%),
    var(--card2);
}
.plant-half.root {
  background:
    linear-gradient(0deg, color-mix(in srgb, #8B4513 14%, transparent), transparent 42%),
    var(--card2);
}
.plant-half-hd { font-weight: 600; margin-bottom: 8px; font-size: 13px; }
.plant-silhouette {
  height: 72px;
  border-radius: 8px;
  margin-bottom: 10px;
  position: relative;
  overflow: hidden;
}
.canopy-sil {
  background:
    radial-gradient(ellipse at 50% 70%, #2E7D32 0%, #7CB342 35%, transparent 70%),
    linear-gradient(180deg, #cfe8c4, #e8f2df);
}
.root-sil {
  background:
    radial-gradient(ellipse at 50% 20%, #8B4513 0%, #A0522D 25%, transparent 55%),
    linear-gradient(180deg, #e8d5b5, #c4a574);
}
.canopy-sil::after, .root-sil::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 3px;
  background: #5d4037;
  transform: translateX(-50%);
}
.canopy-sil::after { top: 55%; bottom: 8%; }
.root-sil::after { top: 8%; bottom: 45%; opacity: 0.55; }
.wall-plant { stroke: rgba(255,255,255,0.65); stroke-width: 0.6; cursor: pointer; }
.wall-plant.dim { opacity: 0.28; }
.wall-plant.watch { stroke: #f59e0b; stroke-width: 1.2; }
.layer-switch { grid-template-columns: repeat(6, 1fr); }
@media (max-width: 1100px) {
  .plant-workspace, .plant-split, .plant-morph-rail { grid-template-columns: 1fr; }
  .layer-switch { grid-template-columns: repeat(3, 1fr); }
}
/* ===== ???? / ???? ===== */
.season-progress {
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--card);
}
.bar.lg { height: 8px; margin-top: 8px; }
.season-rail {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.season-step {
  text-align: left;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card);
  color: inherit;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.season-step:hover { border-color: var(--blue); }
.season-step.on { border-color: var(--blue); background: color-mix(in srgb, var(--blue) 10%, var(--card)); }
.season-step.done { opacity: 0.85; }
.season-step.run { border-color: color-mix(in srgb, var(--orange) 50%, var(--border)); }
.season-step .bar { height: 3px; margin-top: 4px; }
.ph-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  font-size: 12px;
}
.ph-flow span {
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--card2);
  border: 1px solid var(--border);
}
.ph-flow i { color: var(--text3); font-style: normal; }
@media (max-width: 1100px) {
  .season-rail { grid-template-columns: repeat(2, 1fr); }
}

/* ===== ??????????????===== */
.role-ribbon {
  margin: 8px 10px 4px;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 1.35;
  border: 1px solid var(--border);
  background: var(--card2);
}
.role-ribbon b { display: block; margin-bottom: 2px; }
.role-ribbon.expert {
  background: color-mix(in srgb, var(--blue) 12%, var(--card));
  border-color: color-mix(in srgb, var(--blue) 35%, var(--border));
}
.role-ribbon.gov {
  background: color-mix(in srgb, var(--info) 12%, var(--card));
  border-color: color-mix(in srgb, var(--info) 35%, var(--border));
}
.role-ribbon.farm {
  background: color-mix(in srgb, var(--green) 10%, var(--card));
}
.role-cap-bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  padding: 12px 14px;
  margin-bottom: 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--card);
}
.role-cap-bar.expert {
  background: linear-gradient(120deg, color-mix(in srgb, var(--blue) 10%, var(--card)), var(--card));
}
.role-cap-bar.gov {
  background: linear-gradient(120deg, color-mix(in srgb, var(--info) 10%, var(--card)), var(--card));
}
.role-cap-bar > div:first-child { flex: 1 1 34%; min-width: 280px; }
.cap-tags { display: flex; flex: 1 1 58%; flex-wrap: wrap; gap: 6px; max-width: 64%; justify-content: flex-end; }
@media (max-width: 980px) {
  .role-cap-bar > div:first-child { min-width: 0; flex-basis: 100%; }
  .cap-tags { max-width: 100%; justify-content: flex-start; }
}
.expert-shortcuts {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
.expert-sc {
  text-align: left;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card2);
  color: inherit;
  cursor: pointer;
  font-family: var(--font-ui);
}
.expert-sc b { display: block; margin-bottom: 2px; }
.expert-sc:hover { border-color: var(--blue); }
body[data-role="expert"] #sidebar .nav-group { color: var(--blue); }
body[data-role="gov"] #sidebar .nav-group { color: var(--info); }
.task-ops { display: flex; flex-wrap: wrap; gap: 4px; }
.dash-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  padding: 8px 10px;
  margin-bottom: 10px;
  border-radius: 10px;
  background: linear-gradient(120deg, color-mix(in srgb, var(--cyan) 12%, var(--card)), var(--card));
  border: 1px solid var(--border);
}
.dash-top-wx {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 1 1 280px;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  text-align: left;
  font-family: var(--font-ui);
  color: inherit;
}
.dash-top-wx .live-pill {
  flex-shrink: 0;
  height: 22px;
  padding: 0 8px;
  font-size: 11px;
}
.dash-top-wx b {
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.dash-top-chip {
  flex-shrink: 0;
  white-space: nowrap;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--card2);
  border: 1px solid var(--border);
  font-size: 11px;
  color: var(--text2);
}
.dash-top-kpis {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 4px;
  flex: 1 1 360px;
  justify-content: flex-end;
}
.dash-kpi {
  display: inline-flex;
  align-items: baseline;
  gap: 3px;
  height: 28px;
  padding: 0 8px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card2);
  color: var(--text);
  font-family: var(--font-ui);
  cursor: pointer;
  white-space: nowrap;
}
.dash-kpi em {
  font-style: normal;
  font-size: 11px;
  color: var(--text3);
}
.dash-kpi b {
  font-size: 13px;
  font-weight: 700;
  font-family: var(--font-mono);
  color: var(--orange);
}
.dash-kpi small {
  font-size: 10px;
  color: var(--text3);
}
.dash-kpi:hover {
  border-color: var(--blue);
  background: color-mix(in srgb, var(--blue) 8%, var(--card));
}
@media (max-width: 900px) {
  .dash-top-kpis { justify-content: flex-start; }
}

/* ===== ???? ? FieldView / Ops Center ?? ===== */
.week-ops {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-bottom: 88px;
}

/* ???????????/ ?? / ???? ???*/
.week-ops.is-compact {
  gap: 8px;
  padding-bottom: 48px;
}
.week-ops.is-compact.is-paused .wo-head {
  border-color: color-mix(in srgb, var(--orange) 40%, var(--border));
}
.wo-head {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 10px 12px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background:
    linear-gradient(115deg, color-mix(in srgb, var(--cyan) 8%, var(--card)), var(--card) 55%);
}
.wo-kpis {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  flex: 1 1 420px;
  min-width: 0;
}
.wo-kpi {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 8px;
  row-gap: 1px;
  align-items: center;
  min-width: 108px;
  max-width: 200px;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: color-mix(in srgb, var(--card) 92%, transparent);
  text-align: left;
  font-family: var(--font-ui);
  color: inherit;
  cursor: default;
}
button.wo-kpi { cursor: pointer; }
button.wo-kpi:hover {
  border-color: color-mix(in srgb, var(--cyan) 40%, var(--border));
}
.wo-kpi .k {
  grid-column: 1 / -1;
  font-size: 11px;
  font-weight: 650;
  color: var(--text3);
  letter-spacing: 0.02em;
}
.wo-kpi strong {
  grid-column: 1 / -1;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wo-kpi.is-score strong {
  color: var(--cyan);
  font-family: var(--font-mono);
  font-size: 16px;
}
.wo-kpi.is-prog {
  min-width: 132px;
  grid-template-columns: 1fr auto;
}
.wo-kpi.is-prog strong {
  grid-column: 1;
  color: var(--orange);
  font-family: var(--font-mono);
  font-size: 16px;
}
.wo-kpi.is-prog em {
  grid-column: 2;
  grid-row: 2;
  font-style: normal;
  font-size: 11px;
  color: var(--text2);
  font-family: var(--font-mono);
}
.wo-kpi.is-prog .bar {
  grid-column: 1 / -1;
  display: block;
  height: 4px;
  margin-top: 2px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 75%, transparent);
  overflow: hidden;
}
.wo-kpi.is-prog .bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--cyan), color-mix(in srgb, var(--orange) 70%, var(--cyan)));
}
.wo-cmds {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin-left: auto;
}
.wo-cmds .btn {
  height: 32px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  margin: 0 !important;
}
.wo-toast {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  padding: 4px 8px 4px 6px;
  border-radius: 6px;
  border: 1px solid color-mix(in srgb, #c47a1a 35%, var(--border));
  background: color-mix(in srgb, #f5a524 10%, var(--card));
  color: var(--text);
}
.wo-toast-ico {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  color: #fff;
  background: #c47a1a;
}
.wo-toast-msg {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
  font-size: 12px;
  line-height: 1.35;
}
.wo-toast-msg b {
  font-weight: 750;
  color: #9a3412;
  white-space: nowrap;
}
.wo-toast-msg span {
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: min(52vw, 420px);
}
.wo-toast-msg em {
  font-style: normal;
  color: var(--text2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: min(40vw, 320px);
}
.wo-toast-acts {
  display: flex;
  flex-shrink: 0;
  gap: 4px;
  margin-left: auto;
}
.wo-toast-acts .btn {
  height: 26px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  margin: 0 !important;
}
.wo-alert {
  display: none;
}
.wo-banner {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  color: #9a3412;
  background: color-mix(in srgb, var(--orange) 10%, var(--card));
  border: 1px solid color-mix(in srgb, var(--orange) 30%, var(--border));
}
.wo-banner.warn {
  border-style: dashed;
  background: color-mix(in srgb, #c45c26 6%, var(--card));
}
.wo-metrics {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card);
  overflow: hidden;
}
.wo-m {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1px;
  flex: 1 1 120px;
  min-width: 0;
  padding: 6px 12px;
  border: 0;
  border-right: 1px solid var(--border);
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: default;
}
.wo-m:last-child { border-right: 0; }
button.wo-m { cursor: pointer; }
button.wo-m:hover { background: color-mix(in srgb, var(--cyan) 6%, var(--card)); }
.wo-m strong {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.2;
  white-space: nowrap;
}
.wo-m strong small {
  font-size: 11px;
  font-weight: 650;
  color: var(--text2);
}
.wo-m > span {
  font-size: 11px;
  color: var(--text2);
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wo-m.is-run strong { color: #175CD3; }
.wo-m.is-wait strong { color: color-mix(in srgb, var(--orange) 75%, #000); }
.wo-m.is-halt strong { color: #B42318; }
.wo-m.is-acc strong { color: #176B5B; }
.wo-m.is-win { flex: 1.4 1 180px; }
.wo-list-block {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  background: var(--card);
}
.wo-strip {
  --wo-ctrl-h: 28px;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--card2) 55%, var(--card));
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.wo-strip .wo-status-tabs,
.wo-strip .wo-day-tabs {
  display: flex;
  flex-wrap: nowrap;
  gap: 5px;
  align-items: center;
  flex: 0 0 auto;
  height: var(--wo-ctrl-h);
}
.wo-strip .wo-chip {
  box-sizing: border-box;
  height: var(--wo-ctrl-h);
  min-height: var(--wo-ctrl-h);
  max-height: var(--wo-ctrl-h);
  padding: 0 10px;
  margin: 0;
  line-height: 1;
  vertical-align: middle;
}
.wo-strip .wo-chip i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 16px;
  min-width: 16px;
  padding: 0 4px;
  line-height: 1;
}
.wo-strip .wo-find-sort {
  box-sizing: border-box;
  flex: 0 0 auto;
  width: 52px;
  min-width: 52px;
  max-width: 52px;
  height: var(--wo-ctrl-h);
  min-height: var(--wo-ctrl-h);
  margin: 0;
  padding: 0 16px 0 8px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background-color: var(--card);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 650;
  line-height: 1;
  appearance: none;
  -webkit-appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--text3) 50%), linear-gradient(135deg, var(--text3) 50%, transparent 50%);
  background-position: calc(100% - 10px) 11px, calc(100% - 6px) 11px;
  background-size: 4px 4px, 4px 4px;
  background-repeat: no-repeat;
  vertical-align: middle;
}
.wo-date {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  height: var(--wo-ctrl-h);
  min-height: var(--wo-ctrl-h);
  margin: 0;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--card);
  overflow: hidden;
  vertical-align: middle;
}
.wo-date-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: var(--wo-ctrl-h);
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text2);
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  font-family: var(--font-ui);
}
.wo-date-btn:hover {
  background: color-mix(in srgb, var(--cyan) 8%, transparent);
  color: var(--text);
}
.wo-date-label {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 70px;
  max-width: 92px;
  height: var(--wo-ctrl-h);
  margin: 0;
  padding: 0 6px;
  border: 0;
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  background: transparent;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}
.wo-date-label.is-week { color: color-mix(in srgb, var(--cyan) 55%, var(--text)); }
.wo-date-label:hover { background: color-mix(in srgb, var(--cyan) 6%, transparent); }
.wo-strip-sep { display: none; }
.wo-strip .wo-day-tabs { display: none; }
.wo-strip .wo-meta {
  display: inline-flex;
  align-items: center;
  height: var(--wo-ctrl-h);
  font-size: 12px;
  font-weight: 650;
  color: var(--text2);
  white-space: nowrap;
  margin-left: auto;
  flex: 0 0 auto;
  line-height: 1;
}
.wo-focus-chip {
  align-self: flex-start;
  margin: 8px 12px;
  border-color: color-mix(in srgb, var(--orange) 50%, var(--border)) !important;
  background: color-mix(in srgb, var(--orange) 12%, var(--card)) !important;
  color: color-mix(in srgb, var(--orange) 80%, #000) !important;
}
.wo-focus-chip[hidden] {
  display: none !important;
}
.wo-alert-top {
  order: -1;
  margin: 0;
}
.wo-find {
  display: none;
}
.wo-day-tabs,
.wo-status-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.wo-find-sort {
  height: 30px;
  padding: 0 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: color-mix(in srgb, var(--card2) 88%, transparent);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 650;
}
.wo-find .wo-meta {
  font-size: 12px;
  font-weight: 650;
  color: var(--text2);
  white-space: nowrap;
}
.wo-focus-bar {
  display: none !important;
}
.wo-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 30px;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--card2) 70%, var(--card));
  font-size: 12px;
  font-family: var(--font-ui);
  font-weight: 650;
  color: var(--text2);
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.wo-chip i {
  font-style: normal;
  min-width: 1.1em;
  padding: 0 5px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 55%, transparent);
  font-size: 11px;
  font-weight: 700;
  color: var(--text3);
}
.wo-chip:hover { border-color: var(--cyan); color: var(--text); }
.wo-chip.is-on {
  background: color-mix(in srgb, var(--cyan) 14%, var(--card));
  border-color: color-mix(in srgb, var(--cyan) 45%, var(--border));
  color: color-mix(in srgb, var(--cyan) 55%, var(--text));
}
.wo-chip.is-on i {
  background: color-mix(in srgb, var(--cyan) 22%, transparent);
  color: inherit;
}
.wo-chip.wo-st-running.is-on {
  border-color: color-mix(in srgb, #175CD3 45%, var(--border));
  background: color-mix(in srgb, #175CD3 10%, var(--card));
  color: #175CD3;
}
.wo-chip.wo-st-todo.is-on,
.wo-chip.wo-st-paused.is-on {
  border-color: color-mix(in srgb, var(--orange) 45%, var(--border));
  background: color-mix(in srgb, var(--orange) 10%, var(--card));
  color: color-mix(in srgb, var(--orange) 70%, #000);
}
.wo-card-states {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  font-weight: 700;
}
.wo-state-jump {
  display: inline-flex;
  align-items: baseline;
  gap: 3px;
  padding: 2px 8px;
  border-radius: 6px;
  border: 1px solid transparent;
  background: color-mix(in srgb, var(--card2) 80%, transparent);
  font: inherit;
  font-size: 14px;
  font-weight: 750;
  color: var(--text);
  cursor: pointer;
}
.wo-state-jump span {
  font-size: 11px;
  font-weight: 650;
  color: var(--text2);
}
.wo-state-jump:hover { border-color: var(--border); }
.wo-state-jump.is-run { color: #175CD3; }
.wo-state-jump.is-wait { color: color-mix(in srgb, var(--orange) 75%, #000); }
.wo-state-jump.is-halt { color: #B42318; }
.wo-state-jump.is-acc { color: #176B5B; }
.wo-ask-fab {
  position: fixed;
  right: 22px;
  bottom: 28px;
  z-index: 60;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: grab;
  color: #176B5B;
  touch-action: none;
  user-select: none;
  filter: drop-shadow(0 8px 18px color-mix(in srgb, #176B5B 28%, transparent));
}
.wo-ask-fab.is-dragging { cursor: grabbing; opacity: 0.92; }
.wo-ask-fab.is-open .wo-ask-bot {
  box-shadow: 0 0 0 3px color-mix(in srgb, #176B5B 28%, transparent);
}
.wo-ask-bot {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(160deg, #1f8f78, #176B5B 55%, #0f4f43);
  color: #dff7ef;
  transition: transform 0.18s ease;
  pointer-events: none;
}
.wo-ask-fab:hover .wo-ask-bot { transform: translateY(-2px) scale(1.04); }
.wo-ask-fab.is-dragging:hover .wo-ask-bot { transform: none; }
.wo-ask-fab:focus-visible .wo-ask-bot {
  outline: 2px solid color-mix(in srgb, #176B5B 70%, #fff);
  outline-offset: 3px;
}
.wo-ask-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--text2);
  background: color-mix(in srgb, var(--card) 92%, transparent);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 2px 8px;
  backdrop-filter: blur(6px);
  pointer-events: none;
}
.wo-ask-panel {
  position: fixed;
  z-index: 61;
  display: flex;
  flex-direction: column;
  width: min(420px, calc(100vw - 24px));
  max-height: min(620px, calc(100vh - 24px));
  border: 1px solid var(--border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--card) 97%, transparent);
  box-shadow: 0 18px 44px color-mix(in srgb, #000 16%, transparent);
  backdrop-filter: blur(12px);
  overflow: hidden;
  font-family: var(--font-ui);
}
.wo-ask-panel[hidden] { display: none !important; }
.wo-ask-panel.is-dragging { opacity: 0.96; }
.wo-ask-hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, color-mix(in srgb, #176B5B 10%, var(--card)), var(--card));
  cursor: grab;
  touch-action: none;
  user-select: none;
}
.wo-ask-hd > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.wo-ask-hd b {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--text);
}
.wo-ask-hd span {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--text3);
}
.wo-ask-hd .btn {
  height: 28px !important;
  padding: 0 10px !important;
  font-size: 12px !important;
  margin: 0 !important;
  cursor: pointer;
}
.wo-ask-sum {
  padding: 8px 12px 10px;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--card2) 45%, var(--card));
}
.wo-ask-sum-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.wo-ask-sum-grid > div {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
  padding: 4px 0;
}
.wo-ask-sum-grid em {
  font-style: normal;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--text3);
}
.wo-ask-sum-grid b {
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.2;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wo-ask-sum-grid b small {
  font-size: 10px;
  font-weight: 600;
  margin-left: 1px;
  color: var(--text2);
}
.wo-ask-sum-grid b.is-run { color: #175CD3; }
.wo-ask-sum-grid b.is-wait { color: color-mix(in srgb, var(--orange) 80%, #000); }
.wo-ask-sum-grid span {
  font-size: 10px;
  color: var(--text2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wo-ask-sum-line {
  margin: 6px 0 0;
  font-size: 11.5px;
  line-height: 1.4;
  color: var(--text2);
}
.wo-ask-sum-warn {
  margin: 6px 0 0;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--orange) 35%, var(--border));
  background: color-mix(in srgb, var(--orange) 8%, var(--card));
  font-size: 11.5px;
  line-height: 1.4;
  color: #9a3412;
}
.wo-ask-sum-warn b {
  margin-right: 6px;
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 0.05em;
}
.wo-ask-sum-warn span {
  display: block;
  margin-top: 2px;
  color: color-mix(in srgb, #9a3412 80%, var(--text2));
}
.wo-ask-sec-hd {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.wo-ask-sec-hd b {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--text);
}
.wo-ask-sec-hd span {
  font-size: 10px;
  font-weight: 600;
  color: var(--text3);
}
.wo-ask-agents {
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
  max-height: 168px;
  overflow: auto;
}
.wo-ask-agent-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.wo-ask-agent {
  position: relative;
  padding: 7px 8px 6px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card);
  min-width: 0;
}
.wo-ask-agent header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
}
.wo-ask-agent header b {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
}
.wo-ask-agent header i {
  font-style: normal;
  font-size: 10px;
  font-weight: 700;
  color: var(--text3);
}
.wo-ask-agent.is-run header i { color: #175CD3; }
.wo-ask-agent.is-ok header i { color: #176B5B; }
.wo-ask-agent.is-warn header i { color: #9a3412; }
.wo-ask-agent .role {
  margin: 2px 0 0;
  font-size: 10px;
  color: var(--text3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wo-ask-agent .act,
.wo-ask-agent .task {
  margin: 3px 0 0;
  font-size: 11px;
  line-height: 1.35;
  color: var(--text2);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.wo-ask-agent .task {
  color: color-mix(in srgb, #176B5B 70%, var(--text));
  -webkit-line-clamp: 1;
}
.wo-ask-agent .score {
  position: absolute;
  right: 6px;
  bottom: 4px;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 650;
  color: var(--text3);
}
.wo-ask-ops {
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
  max-height: 120px;
  overflow: auto;
  background: color-mix(in srgb, var(--card2) 35%, var(--card));
}
.wo-ask-ops[hidden] { display: none !important; }
.wo-ask-op {
  padding: 6px 0;
  border-top: 1px dashed color-mix(in srgb, var(--border) 80%, transparent);
}
.wo-ask-op:first-of-type { border-top: 0; padding-top: 0; }
.wo-ask-op header {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}
.wo-ask-op header b {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
}
.wo-ask-op header i {
  font-style: normal;
  font-size: 10px;
  font-weight: 700;
  color: #175CD3;
}
.wo-ask-op p {
  margin: 2px 0 0;
  font-size: 11.5px;
  line-height: 1.35;
  color: var(--text);
}
.wo-ask-op span {
  display: block;
  margin-top: 2px;
  font-size: 10.5px;
  color: var(--text3);
}
.wo-ask-empty {
  font-size: 12px;
  color: var(--text3);
  padding: 8px 0;
}
.wo-ask-log {
  flex: 1 1 auto;
  min-height: 110px;
  overflow: auto;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.wo-ask-msg {
  display: flex;
  flex-direction: column;
  gap: 3px;
  max-width: 94%;
  padding: 8px 10px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--card2) 70%, var(--card));
  border: 1px solid var(--border);
}
.wo-ask-msg.is-user {
  align-self: flex-end;
  background: color-mix(in srgb, #176B5B 12%, var(--card));
  border-color: color-mix(in srgb, #176B5B 28%, var(--border));
}
.wo-ask-msg.is-bot { align-self: flex-start; }
.wo-ask-msg b {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--text3);
}
.wo-ask-msg p {
  margin: 0;
  font-family: var(--font-ui);
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--text);
  white-space: pre-wrap;
}
.wo-ask-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding: 0 12px 8px;
}
.wo-ask-quick .wo-chip {
  height: 26px;
  padding: 0 9px;
  font-size: 11px;
  font-weight: 600;
}
.wo-ask-acts {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding: 0 12px 8px;
}
.wo-ask-acts:empty { display: none; }
.wo-ask-acts .btn {
  height: 28px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  margin: 0 !important;
}
.wo-ask-ft {
  display: flex;
  gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid var(--border);
  background: var(--card);
}
.wo-ask-ft input {
  flex: 1 1 auto;
  min-width: 0;
  height: 34px;
  padding: 0 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: color-mix(in srgb, var(--card2) 60%, var(--card));
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 13px;
}
.wo-ask-ft .btn {
  height: 34px !important;
  padding: 0 14px !important;
  margin: 0 !important;
  flex: 0 0 auto;
  font-size: 12px !important;
}
@media (max-width: 700px) {
  .wo-strip { flex-wrap: nowrap; }
  .wo-toast { align-items: flex-start; }
  .wo-toast-msg span,
  .wo-toast-msg em { max-width: none; white-space: normal; }
  .wo-toast-acts { margin-left: 0; }
  .wo-m { flex: 1 1 45%; border-right: 0; border-bottom: 1px solid var(--border); }
  .wo-ask-fab { right: 14px; bottom: 76px; }
}
.week-ops.is-compact .wo-queue {
  gap: 0;
  border: 0;
  border-radius: 0;
  overflow: visible;
  background: transparent;
}
.week-ops.is-compact .wo-list-block .wo-queue {
  background: var(--card);
}
.wq-table-head {
  display: grid;
  grid-template-columns: 28px minmax(140px, 1.3fr) 80px 100px minmax(120px, 1.5fr) minmax(168px, auto);
  gap: 8px;
  padding: 8px 10px;
  font-size: 12px;
  font-weight: 700;
  color: var(--text2);
  background: color-mix(in srgb, var(--card2) 82%, var(--cyan));
  border-bottom: 1px solid var(--border);
}
.wq-table-head .wq-h-ops { text-align: right; }
.wq-table-body { display: flex; flex-direction: column; }
.wq-row {
  display: grid;
  grid-template-columns: 32px minmax(140px, 1.3fr) 80px 100px minmax(120px, 1.5fr) minmax(168px, auto);
  gap: 8px;
  align-items: center;
  padding: 7px 10px;
  min-height: 40px;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  background: var(--card);
  transition: background 0.12s ease;
}
.wq-row:last-child { border-bottom: 0; }
.wq-row:hover { background: color-mix(in srgb, var(--cyan) 5%, var(--card)); }
.wq-row.level-red { box-shadow: inset 2px 0 0 #c45c26; }
.wq-row.level-orange { box-shadow: inset 2px 0 0 var(--orange); }
.wq-row.level-blue { box-shadow: inset 2px 0 0 var(--blue); }
.wq-row.is-halted {
  background: color-mix(in srgb, #c45c26 6%, var(--card));
  box-shadow: inset 2px 0 0 #c45c26;
}
.wq-row.is-running { box-shadow: inset 2px 0 0 var(--cyan); }
.wq-row.is-done { opacity: 0.78; }
.wq-row.is-deferred { opacity: 0.9; }
.wq-row .wq-check {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.wq-main {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 6px;
  min-width: 0;
}
.wq-code {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 750;
  font-family: var(--font-mono);
  padding: 0;
  margin: 0;
  border: 0;
  background: none;
  color: inherit;
  cursor: pointer;
  text-align: left;
}
.wq-code:hover {
  color: color-mix(in srgb, var(--cyan) 70%, var(--text));
  text-decoration: underline;
}
.wq-crop {
  font-size: 11px;
  color: var(--text2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wq-day {
  display: flex;
  flex-direction: column;
  gap: 0;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  min-width: 0;
}
.wq-day small {
  font-size: 10px;
  font-weight: 400;
  color: var(--text3);
}
.wq-st {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: center;
}
.wq-row .wq-state,
.wq-row .wq-urgency {
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 4px;
}
.wq-tip {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
  font-size: 11px;
  line-height: 1.3;
}
.wq-tip-text {
  color: var(--text2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wq-agent {
  font-size: 10px;
  color: color-mix(in srgb, var(--cyan) 65%, var(--text3));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wq-row .wq-ops {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  min-width: 0;
}
.wq-row .wq-ops .btn {
  height: 26px !important;
  padding: 0 8px !important;
  font-size: 11px !important;
  margin: 0 !important;
}
.wq-row .wq-ops .btn.wq-primary {
  background: color-mix(in srgb, var(--cyan) 88%, #000) !important;
  border-color: color-mix(in srgb, var(--cyan) 88%, #000) !important;
  color: #fff !important;
  font-weight: 700;
}
.week-ops.is-compact .wo-dock {
  padding: 8px 12px;
  border-radius: 8px;
  gap: 6px;
  align-items: center;
  min-height: 44px;
}
.week-ops.is-compact .wo-dock .btn,
.week-ops.is-compact .wo-dock .land-check-all,
.week-ops.is-compact .wo-dock .sub {
  box-sizing: border-box;
  height: 30px !important;
  min-height: 30px;
  display: inline-flex !important;
  align-items: center;
  margin: 0 !important;
  line-height: 1;
  vertical-align: middle;
}
.week-ops.is-compact .wo-dock .btn {
  padding: 0 12px !important;
  font-size: 12px !important;
}
.week-ops.is-compact .wo-dock .land-check-all {
  gap: 6px;
  padding: 0 2px;
  font-size: 12px;
  font-weight: 650;
  color: var(--text2);
}
.week-ops.is-compact .wo-dock .sub {
  font-size: 12px;
}
.week-ops.is-compact .week-empty { padding: 18px 10px; }

@media (max-width: 1100px) {
  .wo-days { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .wq-table-head { display: none; }
  .wq-row {
    grid-template-columns: 24px minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    gap: 4px 6px;
    padding: 8px 10px;
  }
  .wq-main { grid-column: 2; }
  .wq-day { grid-column: 2; flex-direction: row; gap: 6px; align-items: baseline; }
  .wq-st { grid-column: 3; grid-row: 1; justify-content: flex-end; }
  .wq-tip { grid-column: 2 / -1; }
  .wq-tip-text { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .wq-ops { grid-column: 2 / -1; justify-content: flex-start; }
  .wo-cmds { margin-left: 0; width: 100%; justify-content: flex-start; }
  .wo-find .wo-meta { margin-left: 0; }
}
@media (max-width: 700px) {
  .wo-days { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wo-kpi { max-width: none; flex: 1 1 140px; }
}

.week-ops.is-paused .wo-context {
  border-color: color-mix(in srgb, var(--orange) 40%, var(--border));
}
.wo-context {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background:
    linear-gradient(120deg, color-mix(in srgb, var(--cyan) 10%, var(--card)), var(--card));
}
.wo-ctx {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  min-width: 0;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid transparent;
  background: color-mix(in srgb, var(--card) 70%, transparent);
  text-align: left;
  font-family: var(--font-ui);
  color: inherit;
  cursor: default;
}
button.wo-ctx { cursor: pointer; }
button.wo-ctx:hover {
  border-color: color-mix(in srgb, var(--cyan) 35%, var(--border));
  transform: translateY(-1px);
  transition: transform 0.15s ease, border-color 0.15s ease;
}
.wo-ctx em {
  font-style: normal;
  font-size: 11px;
  color: var(--text3);
}
.wo-ctx b {
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 160px;
}
.wo-ctx span { font-size: 11px; color: var(--text2); }
.wo-score {
  flex-direction: row;
  align-items: center;
  gap: 8px;
  min-width: 88px;
}
.wo-ring {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: conic-gradient(var(--cyan) var(--score-deg, 280deg), color-mix(in srgb, var(--border) 80%, transparent) 0);
  mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
  flex-shrink: 0;
}
.wo-score b {
  font-family: var(--font-mono);
  font-size: 18px;
  color: var(--cyan);
}
.wo-prog b { color: var(--orange); font-family: var(--font-mono); }
.wo-ctx-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
}
.wo-paused-banner,
.wo-halt-banner {
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  animation: wo-fade-in 0.25s ease;
}
.wo-paused-banner {
  color: #9a3412;
  background: color-mix(in srgb, var(--orange) 12%, var(--card));
  border: 1px solid color-mix(in srgb, var(--orange) 35%, var(--border));
}
.wo-halt-banner {
  color: #9a3412;
  background: color-mix(in srgb, #c45c26 8%, var(--card));
  border: 1px dashed color-mix(in srgb, #c45c26 40%, var(--border));
}
.wo-progress {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 4px 2px 2px;
}
.wo-progress-track {
  flex: 1;
  height: 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.wo-progress-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--cyan), color-mix(in srgb, var(--orange) 70%, var(--cyan)));
  transition: width 0.45s ease;
}
.wo-progress > span {
  flex-shrink: 0;
  font-size: 11px;
  color: var(--text2);
  white-space: nowrap;
}
.wo-activity {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.wo-act {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  padding: 7px 9px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card);
  font-size: 11px;
}
.wo-act b {
  font-size: 11px;
  color: color-mix(in srgb, var(--cyan) 70%, var(--text));
}
.wo-act span {
  color: var(--text2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wo-act em {
  font-style: normal;
  color: var(--text3);
  font-size: 10px;
}
.wo-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.wo-search {
  height: 30px;
  min-width: 160px;
  max-width: 220px;
  padding: 0 10px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 12px;
}
.wo-search:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--cyan) 50%, var(--border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--cyan) 12%, transparent);
}
.wo-sort {
  height: 30px;
  padding: 0 8px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 12px;
}
.wo-queue-meta {
  font-size: 12px;
  color: var(--text3);
  padding: 0 2px;
}
.wo-queue.is-refreshing {
  animation: wo-fade-in 0.2s ease;
}
.wq-state.st-done {
  color: #166534;
  background: color-mix(in srgb, #22c55e 16%, transparent);
}
.wq-state.st-defer {
  color: var(--blue-dark, #1e3a5f);
  background: color-mix(in srgb, var(--blue) 14%, transparent);
}
.wq-intervene.is-done {
  border-color: color-mix(in srgb, #22c55e 30%, var(--border));
  color: #166534;
  background: color-mix(in srgb, #22c55e 8%, transparent);
}
.wq-card.is-done {
  opacity: 0.88;
}
.wq-card.is-deferred {
  border-style: dashed;
}
.btn.is-busy {
  opacity: 0.65;
  pointer-events: none;
}
@media (max-width: 1100px) {
  .wo-activity { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .wo-activity { grid-template-columns: 1fr; }
  .wo-search { max-width: none; flex: 1; min-width: 120px; }
}
.wq-badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  justify-content: flex-end;
}
.wq-state {
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
}
.wq-state.st-pend {
  color: #9a5b00;
  background: color-mix(in srgb, var(--orange) 14%, transparent);
}
.wq-state.st-run {
  color: color-mix(in srgb, var(--cyan) 80%, #000);
  background: color-mix(in srgb, var(--cyan) 14%, transparent);
}
.wq-state.st-halt {
  color: #9a3412;
  background: color-mix(in srgb, #c45c26 18%, transparent);
}
.wq-state.st-ok {
  color: #166534;
  background: color-mix(in srgb, #22c55e 14%, transparent);
}
.wq-card.is-halted {
  border-color: color-mix(in srgb, #c45c26 50%, var(--border));
  background: linear-gradient(90deg, color-mix(in srgb, #c45c26 12%, var(--card)), var(--card) 52%);
  box-shadow: inset 3px 0 0 #c45c26;
}
.wq-card.is-running {
  border-color: color-mix(in srgb, var(--cyan) 45%, var(--border));
  box-shadow: inset 3px 0 0 var(--cyan);
}
.wq-card.is-running .wq-bar i {
  animation: wq-bar-pulse 1.6s ease-in-out infinite;
}
@keyframes wq-bar-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.55; }
}
.wq-intervene {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 11px;
  background: color-mix(in srgb, var(--card2) 80%, transparent);
  border: 1px solid var(--border);
}
.wq-intervene.is-run {
  border-color: color-mix(in srgb, var(--cyan) 30%, var(--border));
  color: color-mix(in srgb, var(--cyan) 70%, var(--text));
}
.wq-intervene.is-halted {
  border-color: color-mix(in srgb, #c45c26 35%, var(--border));
  color: #9a3412;
  background: color-mix(in srgb, #c45c26 8%, transparent);
}
.wq-intervene-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--cyan) 50%, transparent);
  animation: wo-dot-pulse 1.4s ease-out infinite;
}
@keyframes wo-dot-pulse {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--cyan) 45%, transparent); }
  70% { box-shadow: 0 0 0 8px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}
.wq-intervene-label { font-weight: 650; }
.wq-halt-reason { color: #9a3412 !important; }
.wq-ops {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 6px;
  min-width: 118px;
}
.wq-ops .btn.danger-outline {
  justify-content: center;
}
.wo-conflict {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  width: 100%;
  padding: 9px 12px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--orange) 32%, var(--border));
  background: color-mix(in srgb, var(--orange) 6%, var(--card));
  text-align: left;
  cursor: pointer;
  font-family: var(--font-ui);
  color: inherit;
  transition: transform 0.15s ease, filter 0.15s ease;
}
.wo-conflict:hover { transform: translateY(-1px); filter: brightness(1.02); }
.wo-conflict-k {
  font-size: 11px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 6px;
  color: #9a3412;
  background: color-mix(in srgb, var(--orange) 18%, transparent);
}
.wo-conflict-t { flex: 1 1 220px; font-size: 12px; }
.wo-conflict-r { font-size: 12px; color: var(--text2); }

.wo-weekstrip {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 6px;
}
.wo-weekstrip .wo-day {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-width: 0;
  padding: 8px 8px 7px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card);
  cursor: pointer;
  font-family: var(--font-ui);
  color: inherit;
  text-align: left;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.wo-weekstrip .wo-day:hover {
  border-color: color-mix(in srgb, var(--cyan) 40%, var(--border));
  transform: translateY(-1px);
}
.wo-weekstrip .wo-day.is-on {
  border-color: color-mix(in srgb, var(--cyan) 55%, var(--border));
  background: color-mix(in srgb, var(--cyan) 10%, var(--card));
  box-shadow: 0 6px 16px color-mix(in srgb, var(--cyan) 12%, transparent);
}
.wo-weekstrip .wo-day.is-today:not(.is-on) {
  border-color: color-mix(in srgb, var(--orange) 35%, var(--border));
}
.wo-day-l { font-size: 11px; color: var(--text3); font-weight: 600; }
.wo-day-d { font-size: 10px; color: var(--text2); }
.wo-day b {
  font-size: 16px;
  font-weight: 750;
  font-family: var(--font-mono);
  line-height: 1.2;
}
.wo-day-dots { display: flex; gap: 3px; min-height: 6px; }
.wo-day-dots .dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  display: inline-block;
}
.wo-day-dots .dot.hot { background: #c45c26; }
.wo-day-dots .dot.ok { background: #22c55e; }
.wo-day-dots .dot.mute { background: color-mix(in srgb, var(--border) 80%, transparent); }

.wo-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
}
.wo-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.wo-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 30px;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--card2) 70%, var(--card));
  font-size: 12px;
  font-family: var(--font-ui);
  font-weight: 650;
  color: var(--text2);
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.wo-chip:hover { border-color: var(--cyan); color: var(--text); }
.wo-chip.is-on {
  background: color-mix(in srgb, var(--cyan) 14%, var(--card));
  border-color: color-mix(in srgb, var(--cyan) 45%, var(--border));
  color: color-mix(in srgb, var(--cyan) 55%, var(--text));
}
.wo-toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.btn.ai-primary {
  background: color-mix(in srgb, var(--cyan) 88%, #000) !important;
  border-color: color-mix(in srgb, var(--cyan) 88%, #000) !important;
  color: #fff !important;
  font-weight: 700;
}
.btn.ai-primary:disabled { opacity: 0.5; }

.wo-queue {
  display: flex;
  flex-direction: column;
  gap: 8px;
  animation: wo-fade-in 0.2s ease;
}
@keyframes wo-fade-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}
.week-empty { padding: 28px 12px; text-align: center; }
.week-empty .btn { margin-top: 12px; }

.wq-card {
  display: grid;
  grid-template-columns: 32px 72px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: stretch;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--card);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.wq-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 22px color-mix(in srgb, #000 6%, transparent);
  border-color: color-mix(in srgb, var(--cyan) 28%, var(--border));
}
.wq-card.level-red {
  border-color: color-mix(in srgb, #c45c26 42%, var(--border));
  background: linear-gradient(90deg, color-mix(in srgb, #c45c26 10%, var(--card)), var(--card) 48%);
}
.wq-card.level-orange {
  border-color: color-mix(in srgb, var(--orange) 38%, var(--border));
  background: linear-gradient(90deg, color-mix(in srgb, var(--orange) 8%, var(--card)), var(--card) 48%);
}
.wq-card.level-blue {
  border-color: color-mix(in srgb, var(--blue) 30%, var(--border));
}
.wq-card.is-ok { opacity: 0.92; }
.wq-check { display: flex; align-items: flex-start; padding-top: 4px; justify-content: center; }
.wq-media {
  width: 72px;
  height: 72px;
  border-radius: 10px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--cyan) 18%, var(--card2)), var(--card2));
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #000 6%, transparent);
}
.wq-media span {
  font-size: 22px;
  font-weight: 700;
  color: color-mix(in srgb, var(--cyan) 55%, var(--text));
}
.wq-body { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.wq-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.wq-id { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.wq-id b { font-size: 15px; font-weight: 750; }
.wq-name {
  font-size: 12px;
  color: var(--text2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wq-urgency {
  flex-shrink: 0;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
}
.wq-urgency.u-hot { color: #9a3412; background: color-mix(in srgb, #c45c26 18%, transparent); }
.wq-urgency.u-mid { color: #9a5b00; background: color-mix(in srgb, var(--orange) 16%, transparent); }
.wq-urgency.u-low { color: #166534; background: color-mix(in srgb, #22c55e 14%, transparent); }
.wq-action-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.wq-tag {
  display: inline-flex;
  align-items: center;
  padding: 1px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 650;
}
.wq-tag.red { color: #9a3412; background: color-mix(in srgb, #c45c26 18%, transparent); }
.wq-tag.orange { color: #9a5b00; background: color-mix(in srgb, var(--orange) 18%, transparent); }
.wq-tag.blue { color: var(--blue-dark); background: color-mix(in srgb, var(--blue) 14%, transparent); }
.wq-tag.green { color: #166534; background: color-mix(in srgb, #22c55e 16%, transparent); }
.wq-why {
  margin: 0;
  font-size: 12px;
  color: var(--text2);
  line-height: 1.45;
}
.wq-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}
.wq-rec {
  font-size: 11px;
  font-weight: 650;
  color: color-mix(in srgb, var(--cyan) 75%, var(--text));
  padding: 1px 6px;
  border-radius: 4px;
  background: color-mix(in srgb, var(--cyan) 10%, transparent);
}
.wq-bar {
  height: 3px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
  margin-top: 4px;
}
.wq-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--cyan), var(--orange));
  transition: width 0.35s ease;
}
.wq-ops {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 6px;
  min-width: 108px;
}
.wq-ops .btn {
  height: 32px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  margin: 0 !important;
  justify-content: center;
}
.wq-ops .btn.wq-primary {
  background: color-mix(in srgb, var(--cyan) 88%, #000) !important;
  border-color: color-mix(in srgb, var(--cyan) 88%, #000) !important;
  color: #fff !important;
  font-weight: 700;
}
.wq-more {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: flex-end;
}
.wq-more .btn {
  height: 26px !important;
  padding: 0 8px !important;
  font-size: 11px !important;
}

.wo-dock {
  position: static;
  bottom: auto;
  z-index: 1;
  display: none;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--card);
  backdrop-filter: none;
  box-shadow: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
#weekDock[hidden],
.wo-dock[hidden],
.dash-cockpit .wo-dock[hidden],
.week-ops.is-compact .wo-dock[hidden] {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
}
.dash-cockpit .wo-dock.is-open:not([hidden]),
.wo-dock.is-open:not([hidden]) {
  display: flex !important;
  visibility: visible !important;
  height: auto !important;
  max-height: none !important;
  padding: 8px 12px !important;
  border-bottom: 1px solid color-mix(in srgb, var(--blue) 25%, var(--border)) !important;
  background: color-mix(in srgb, var(--blue) 7%, #fff) !important;
}
.dash-cockpit .wo-dock,
.week-ops.is-compact .wo-dock {
  position: static !important;
  bottom: auto !important;
  margin: 0;
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  box-shadow: none;
  backdrop-filter: none;
}
.wo-dock.has-sel {
  border-color: color-mix(in srgb, var(--cyan) 45%, var(--border));
  box-shadow: 0 10px 28px color-mix(in srgb, var(--cyan) 16%, transparent);
}
.wo-dock .sp { flex: 1; min-width: 8px; }

.btn.danger-outline {
  color: #9a3412 !important;
  border-color: color-mix(in srgb, #9a3412 45%, var(--border)) !important;
}
.btn.danger-outline:hover {
  background: color-mix(in srgb, #9a3412 8%, var(--card)) !important;
}

@media (max-width: 1100px) {
  .wo-days { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .wo-weekstrip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 800px) {
  .wq-card { grid-template-columns: 24px 56px minmax(0, 1fr); }
  .wq-ops { grid-column: 2 / -1; flex-direction: row; flex-wrap: wrap; min-width: 0; }
  .wq-media { width: 56px; height: 56px; }
  .wo-ctx-actions { margin-left: 0; width: 100%; }
}
@media (max-width: 560px) {
  .wo-days { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wo-weekstrip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* legacy stubs */
.ai-dispatch { margin-bottom: 12px; }

.farm-today { margin-bottom: 12px; }
.farm-today-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 12px 0 10px;
}
.farm-today-toolbar .sp { flex: 1; min-width: 8px; }
.farm-today .prio-rank.quiet {
  width: 20px;
  height: 20px;
  font-size: 11px;
  background: color-mix(in srgb, var(--orange) 14%, transparent);
  color: var(--orange);
}
.farm-today .land-board-row,
.week-plan .land-board-row {
  grid-template-columns: 28px 1fr auto;
}
.week-plan { margin-bottom: 10px; }
.week-plan.is-paused {
  border-color: color-mix(in srgb, var(--orange) 40%, var(--border));
}
.week-safety {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 10px;
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--card2) 88%, var(--green));
}
.week-safety.is-paused {
  border-color: color-mix(in srgb, var(--orange) 40%, var(--border));
  background: color-mix(in srgb, var(--orange) 8%, var(--card));
}
.week-safety-copy {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
  min-width: 0;
}
.week-safety-copy b { font-size: 13px; }
.week-safety-last { opacity: 0.85; }
.week-safety-actions { flex-shrink: 0; display: flex; gap: 8px; }
.btn.danger-outline {
  color: #9a3412 !important;
  border-color: color-mix(in srgb, #9a3412 45%, var(--border)) !important;
}
.btn.danger-outline:hover {
  background: color-mix(in srgb, #9a3412 8%, var(--card)) !important;
}
.btn.danger {
  background: #b45309 !important;
  border-color: #b45309 !important;
  color: #fff !important;
}
.btn.danger:hover { filter: brightness(1.06); }
.week-plan-list { display: flex; flex-direction: column; gap: 12px; }
.week-day-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--muted, #6b7280);
  margin: 2px 0 6px;
  padding-left: 2px;
}
.week-suggest {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
}
.week-suggest-from {
  font-size: 11px;
  color: var(--muted, #6b7280);
}
.week-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}
.week-actions .btn {
  height: 30px !important;
  padding: 0 10px !important;
  font-size: 12px !important;
  margin: 0 !important;
}
@media (max-width: 900px) {
  .week-safety { flex-direction: column; align-items: stretch; }
  .week-actions { width: 100%; }
}
.dash-conflict-chip {
  display: inline-flex;
  align-items: center;
  max-width: min(280px, 42vw);
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--orange) 40%, var(--border));
  background: color-mix(in srgb, var(--orange) 10%, var(--card));
  color: var(--orange);
  font-size: 11px;
  font-weight: 600;
  font-family: var(--font-ui);
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 720px) {
  .farm-today .land-board-row { grid-template-columns: 24px 1fr; }
  .farm-today .prio-rank.quiet { display: none; }
}

.weather-dawn { display: none; }
.warn-pill {
  padding: 2px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--orange) 18%, transparent);
  color: var(--orange);
  font-weight: 600;
}
.farmer-board .cmd-live { display: none; }

/* ????????? + ?????? */
.multi-prio .cmd-body {
  grid-template-columns: minmax(0, 1.65fr) minmax(280px, 0.95fr);
}
.prio-land-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0 4px;
}
.prio-land-card {
  padding: 12px 12px 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: #f7fff9;
  min-width: 0;
}
.prio-land-card.level-red {
  background: rgba(194, 65, 12, 0.28);
  border-color: rgba(255, 200, 160, 0.45);
}
.prio-land-card.level-orange {
  background: rgba(180, 110, 20, 0.26);
  border-color: rgba(255, 220, 160, 0.4);
}
.prio-land-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.prio-rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.22);
  font-size: 11px;
  font-weight: 700;
}
.prio-land-meta { opacity: 0.85; margin-top: 4px; color: inherit; }
.prio-land-why {
  margin: 8px 0 10px;
  font-size: 13px;
  line-height: 1.45;
  opacity: 0.95;
}
.prio-land-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.prio-land-actions .btn {
  height: 30px !important;
  padding: 0 10px !important;
  font-size: 12px !important;
  margin: 0 !important;
}
.prio-land-actions .btn.ghost {
  background: transparent !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
}
.prio-land-actions .btn:not(.ghost) {
  background: #fff !important;
  color: var(--blue-dark) !important;
  border: 0 !important;
}
.cmd-todo-panel {
  padding: 14px 14px 12px;
  background: var(--card);
  border-left: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cmd-todo-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.cmd-todo-head b {
  display: block;
  font-size: 15px;
  color: var(--text);
}
.cmd-todo-head .btn {
  height: 28px !important;
  padding: 0 10px !important;
  font-size: 12px !important;
  margin: 0 !important;
}
.cmd-todo-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.cmd-todo-item {
  display: grid;
  grid-template-columns: 22px 1fr auto;
  gap: 8px;
  align-items: center;
  width: 100%;
  text-align: left;
  padding: 9px 10px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card2);
  color: var(--text);
  font-family: var(--font-ui);
  cursor: pointer;
}
.cmd-todo-item:hover {
  border-color: var(--orange);
  background: color-mix(in srgb, var(--orange) 8%, var(--card));
}
.cmd-todo-item.urgent {
  border-color: color-mix(in srgb, var(--orange) 45%, var(--border));
  background: color-mix(in srgb, var(--orange) 10%, var(--card2));
}
.cmd-todo-item.urgent .cmd-todo-idx {
  background: color-mix(in srgb, var(--orange) 28%, transparent);
}
.cmd-todo-idx {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--orange) 16%, transparent);
  color: var(--orange);
  font-size: 11px;
  font-weight: 700;
}
.cmd-todo-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cmd-todo-body b {
  font-size: 13px;
  line-height: 1.25;
}
.cmd-todo-body em {
  font-style: normal;
  font-size: 11px;
  color: var(--text3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cmd-todo-go {
  font-size: 11px;
  font-weight: 600;
  color: var(--blue-dark);
  white-space: nowrap;
}
.cmd-todo-window {
  padding: 9px 11px;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--blue) 35%, var(--border));
  background: color-mix(in srgb, var(--blue) 6%, var(--card));
}
.cmd-todo-window b {
  display: block;
  margin-top: 3px;
  font-size: 13px;
  color: var(--text);
}
.cmd-todo-window em {
  display: block;
  margin-top: 3px;
  font-style: normal;
  font-size: 11px;
  color: var(--text3);
  line-height: 1.4;
}
.cmd-todo-conflict {
  width: 100%;
  text-align: left;
  padding: 9px 11px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--orange) 40%, var(--border));
  background: color-mix(in srgb, var(--orange) 8%, var(--card));
  color: inherit;
  font-family: var(--font-ui);
  cursor: pointer;
}
.cmd-todo-conflict b { display: block; font-size: 12px; color: var(--orange); margin-bottom: 3px; }
.cmd-todo-conflict span { display: block; font-size: 12px; color: var(--text); line-height: 1.4; }
.cmd-todo-conflict em { display: block; margin-top: 3px; font-style: normal; font-size: 11px; color: var(--text3); }
@media (max-width: 980px) {
  .multi-prio .cmd-body { grid-template-columns: 1fr; }
  .cmd-todo-panel { border-left: 0; border-top: 1px solid var(--border); }
}
@media (max-width: 720px) {
  .prio-land-grid { grid-template-columns: 1fr; }
}

/* ??????/ ?? / ??????????*/
.reason-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0 12px;
}
.reason-card {
  padding: 12px 14px 14px;
  border-radius: 12px;
  background: #fff;
  color: #1a2e24;
  border: 2px solid transparent;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
  min-width: 0;
}
.reason-card.why {
  border-color: #1f7a56;
  background: linear-gradient(180deg, #f3fcf7 0%, #ffffff 55%);
}
.reason-card.delay {
  border-color: #c2410c;
  background: linear-gradient(180deg, #fff4e8 0%, #fffaf4 55%);
  box-shadow: 0 8px 22px rgba(194, 65, 12, 0.22);
}
.reason-card.ready {
  border-color: #0369a1;
  background: linear-gradient(180deg, #eef8ff 0%, #ffffff 55%);
}
.reason-label {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1.2;
}
.reason-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 800;
  font-style: normal;
  color: #fff;
  flex-shrink: 0;
}
.reason-card.why .reason-label { color: #14532d; }
.reason-card.why .reason-ico { background: #1f7a56; }
.reason-card.delay .reason-label { color: #9a3412; }
.reason-card.delay .reason-ico { background: #c2410c; }
.reason-card.ready .reason-label { color: #0c4a6e; }
.reason-card.ready .reason-ico { background: #0369a1; }
.reason-body {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  font-weight: 600;
  color: #1f2937;
}
.reason-card.delay .reason-body {
  color: #9a3412;
  font-size: 15px;
  font-weight: 700;
}
.warn-text { color: #ffd7a8 !important; }
/* ??????*/
.farmer-why { display: contents; }

.wall-reason {
  margin-top: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.wall-reason .reason-card {
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
}
.wall-reason .reason-body {
  font-size: 13px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.trust-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 4px; }
.trust-chip {
  font-size: 11px;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.92);
}
.farmer-cta .btn-xl {
  min-height: 44px;
  padding: 0 22px;
  font-size: 15px;
  font-weight: 700;
}
.today-jobs { margin-bottom: 12px; }
.today-job-list { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.today-job {
  display: grid;
  grid-template-columns: 72px 1fr auto;
  gap: 10px;
  align-items: center;
  text-align: left;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card2);
  color: inherit;
  cursor: pointer;
  font-family: var(--font-ui);
  transition: border-color 0.15s, transform 0.15s;
}
.today-job:hover {
  border-color: color-mix(in srgb, var(--blue) 40%, var(--border));
  transform: translateY(-1px);
}
.today-job.urgent {
  border-color: color-mix(in srgb, var(--orange) 50%, var(--border));
  background: color-mix(in srgb, var(--orange) 8%, var(--card));
}
.tj-status {
  font-size: 12px;
  font-weight: 700;
  color: var(--blue-dark);
  font-family: var(--font-mono);
}
.today-job.urgent .tj-status { color: var(--orange); }
.tj-body b { display: block; font-size: 14px; }
.tj-money { font-size: 12px; color: var(--text3); white-space: nowrap; }
.money-strip {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px;
  margin-bottom: 14px;
}
.money-item {
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--card);
  border: 1px solid var(--border);
}
.money-item .sub { display: block; margin-bottom: 2px; }
.money-item b { font-size: 18px; }
.farmer-hud { grid-template-columns: 1.2fr 1fr 0.9fr; }
.farmer-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.farmer-step {
  min-height: 52px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card2);
  color: var(--text);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  font-family: var(--font-ui);
}
.farmer-step:hover { border-color: var(--blue); color: var(--blue-dark); }
@media (max-width: 1100px) {
  .reason-board, .wall-reason { grid-template-columns: 1fr; }
  .money-strip { grid-template-columns: repeat(3, 1fr); }
  .farmer-hud { grid-template-columns: 1fr; }
  .today-job { grid-template-columns: 64px 1fr; }
  .tj-money { grid-column: 2; }
}
@media (max-width: 720px) {
  .money-strip { grid-template-columns: repeat(2, 1fr); }
  .btn-xl, .farmer-cta .btn { width: 100%; justify-content: center; }
  .farmer-cta { flex-direction: column; align-items: stretch; }
}

/* ===== ???? / ???? ===== */
.seg-tabs {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 4px 0 12px;
  flex-wrap: wrap;
}
.seg {
  height: 32px;
  padding: 0 14px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text2);
  font-size: 13px;
  cursor: pointer;
  font-family: var(--font-ui);
}
.seg.on {
  background: color-mix(in srgb, var(--blue) 14%, var(--card));
  border-color: color-mix(in srgb, var(--blue) 40%, var(--border));
  color: var(--blue-dark);
  font-weight: 600;
}
:root[data-theme="dark"] .seg.on { color: var(--blue-light); }
.hist-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: center;
  margin-bottom: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: linear-gradient(180deg, var(--card) 0%, var(--card2) 140%);
  border: 1px solid var(--border);
}
.year-chips, .land-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.year-chip, .land-chip {
  height: 28px;
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text2);
  font-size: 12px;
  cursor: pointer;
  font-family: var(--font-mono);
}
.year-chip.on, .land-chip.on {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
  font-weight: 600;
}
.hist-kpis { margin-bottom: 4px; }
.hist-main { grid-template-columns: 1.35fr 1fr; }
.hist-land-list { display: flex; flex-direction: column; gap: 10px; max-height: 62vh; overflow: auto; padding-right: 4px; }
.hist-land-card {
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card2);
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.hist-land-card:hover, .hist-land-card.focus {
  border-color: color-mix(in srgb, var(--blue) 45%, var(--border));
  box-shadow: 0 6px 16px color-mix(in srgb, var(--blue) 10%, transparent);
}
.hist-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin: 10px 0;
}
.hist-metrics > div {
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--card);
  border: 1px solid var(--border);
}
.hist-spark-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.spark {
  display: inline-flex;
  align-items: flex-end;
  gap: 3px;
  height: 28px;
  padding: 2px 4px;
  border-radius: 6px;
  background: var(--card);
  border: 1px solid var(--border);
}
.spark i {
  display: block;
  width: 7px;
  border-radius: 2px 2px 0 0;
  background: linear-gradient(180deg, var(--blue-light), var(--blue));
  min-height: 4px;
}
.exec-timeline { display: flex; flex-direction: column; gap: 0; max-height: 58vh; overflow: auto; }
.exec-timeline.compact { max-height: 48vh; }
.exec-item {
  display: grid;
  grid-template-columns: 16px 1fr;
  gap: 10px;
  position: relative;
}
.exec-rail {
  width: 10px;
  margin-left: 3px;
  border-left: 2px solid var(--border2);
  position: relative;
}
.exec-rail:before {
  content: "";
  position: absolute;
  left: -5px;
  top: 14px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green);
  border: 2px solid var(--card);
}
.exec-item.running .exec-rail:before { background: var(--orange); }
.exec-card {
  padding: 10px 12px;
  margin-bottom: 10px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card);
}
.exec-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 6px;
  font-size: 11px;
  color: var(--text3);
  font-family: var(--font-mono);
}
.exec-result {
  margin-top: 6px;
  font-size: 13px;
  color: var(--text2);
  line-height: 1.45;
}
.empty-hint {
  padding: 24px;
  text-align: center;
  color: var(--text3);
  border: 1px dashed var(--border2);
  border-radius: 10px;
}
.dash-task-actions {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
}
.dash-task-actions .btn { justify-content: center; width: 100%; }
.hist-compare { margin-top: 14px; }
.tasks-grid, .hist-exec-grid { margin-top: 4px; }
.tasks-grid {
  grid-template-columns: minmax(720px, 1.75fr) minmax(300px, 0.72fr);
}
.tasks-table { min-width: 720px; }
.tasks-table th:first-child,
.tasks-table td:first-child { min-width: 156px; }
.tasks-table th:nth-child(4),
.tasks-table td:nth-child(4) { min-width: 116px; }
.tasks-table th:last-child,
.tasks-table td:last-child { min-width: 152px; }
.exec-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 6px;
  font-size: 11px;
  color: var(--text3);
  font-family: var(--font-mono);
}

/* UI ???????????? */
#main { background:
  radial-gradient(900px 420px at 12% -10%, color-mix(in srgb, var(--blue) 8%, transparent), transparent 60%),
  radial-gradient(700px 360px at 100% 0%, color-mix(in srgb, var(--cyan) 7%, transparent), transparent 55%),
  var(--bg);
}
.page-title {
  padding-bottom: 6px;
  border-bottom: 1px solid transparent;
  margin-bottom: 2px;
}
.panel {
  box-shadow:
    0 1px 0 color-mix(in srgb, var(--text) 2.5%, transparent),
    0 10px 28px color-mix(in srgb, var(--blue) 5%, transparent);
}
.cmd-board {
  box-shadow: 0 10px 28px color-mix(in srgb, var(--priority-from) 18%, transparent);
}
.mod-head.active {
  background: color-mix(in srgb, var(--blue) 12%, var(--card));
  border-color: color-mix(in srgb, var(--blue) 22%, var(--border));
}
@media (max-width: 1100px) {
  .hist-main, .hist-exec-grid, .tasks-grid { grid-template-columns: 1fr; }
  .hist-metrics { grid-template-columns: repeat(2, 1fr); }
  .dash-task-actions { grid-template-columns: 1fr; }
  .kpis, .hist-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  .kpis, .hist-kpis { grid-template-columns: repeat(2, 1fr); }
}

/* ========== ????????========== */
.wall-role-pill {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  border: 1px solid transparent;
}
.wall-role-pill.farm {
  color: #c8f0d8;
  background: rgba(47, 158, 122, 0.22);
  border-color: rgba(143, 212, 168, 0.35);
}
.wall-role-pill.expert {
  color: #d6e8ff;
  background: rgba(59, 130, 246, 0.22);
  border-color: rgba(147, 197, 253, 0.4);
}
.wall-role-pill.gov {
  color: #ffe8c8;
  background: rgba(196, 120, 38, 0.22);
  border-color: rgba(245, 158, 11, 0.35);
}

/* ????????*/
.wall-screen.wall-role-farm {
  background:
    radial-gradient(1200px 500px at 20% -10%, rgba(47, 158, 122, 0.22), transparent 55%),
    radial-gradient(900px 420px at 90% 10%, rgba(94, 196, 255, 0.1), transparent 50%),
    linear-gradient(180deg, #07140f 0%, #0a1a14 40%, #08120e 100%);
}
.wall-hero-farm {
  flex-shrink: 0;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px 24px;
  align-items: center;
  margin: 8px 14px 0;
  padding: 14px 18px;
  border-radius: 14px;
  border: 1px solid rgba(143, 212, 168, 0.28);
  background:
    linear-gradient(105deg, rgba(31, 122, 86, 0.35), rgba(10, 28, 22, 0.75) 55%, rgba(10, 28, 22, 0.55)),
    rgba(8, 24, 18, 0.9);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
}
.wall-kicker {
  display: block;
  font-size: 11px;
  letter-spacing: 0.14em;
  color: #8fd4a8;
  margin-bottom: 4px;
}
.wall-hero-farm h2 {
  margin: 0;
  font-size: 22px;
  line-height: 1.25;
  color: #f2fbf6;
  font-family: var(--font-display);
}
.wall-hero-farm p {
  margin: 6px 0 0;
  font-size: 13px;
  color: #a8c4b4;
  line-height: 1.45;
  max-width: 52ch;
}
.wall-hero-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 10px;
  font-size: 12px;
  color: #c8e6d4;
}
.wall-hero-facts span {
  padding: 4px 10px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.22);
  border: 1px solid rgba(143, 212, 168, 0.18);
}
.wall-hero-cta {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 140px;
}
.wall-cta-xl {
  height: 44px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  padding: 0 22px !important;
  background: linear-gradient(180deg, #3db88a, #1f7a56) !important;
  border-color: #8fd4a8 !important;
  box-shadow: 0 8px 20px rgba(47, 158, 122, 0.35);
}
.wall-body-farm { margin-top: 10px; }
.wall-job-list { display: flex; flex-direction: column; gap: 6px; }
.wall-job {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 8px;
  align-items: center;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(120, 160, 140, 0.22);
  background: rgba(8, 22, 16, 0.55);
  color: #e2e8f0;
  cursor: pointer;
  font-family: var(--font-ui);
}
.wall-job:hover { border-color: #8fd4a8; background: rgba(47, 158, 122, 0.12); }
.wall-job.urgent { border-color: rgba(245, 158, 11, 0.45); }
.wall-job span { font-size: 11px; color: #8fd4a8; }
.wall-job.urgent span { color: #fbbf24; }
.wall-job b { font-size: 13px; color: #f1f5f9; }
.wall-job em { font-style: normal; font-size: 11px; color: #7a9a88; font-family: var(--font-mono); }
.wall-kpis-2 { grid-template-columns: 1fr 1fr !important; }
.wall-farm-hint {
  margin-top: 6px;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 12px;
  color: #a8c4b4;
  background: rgba(47, 158, 122, 0.1);
  border: 1px dashed rgba(143, 212, 168, 0.3);
}

/* ????????*/
.wall-screen.wall-role-expert {
  background:
    radial-gradient(1100px 480px at 15% -8%, rgba(59, 130, 246, 0.2), transparent 55%),
    radial-gradient(800px 400px at 95% 0%, rgba(14, 165, 233, 0.12), transparent 50%),
    linear-gradient(180deg, #070d18 0%, #0a1220 45%, #081018 100%);
}
.wall-command-expert {
  border-color: rgba(96, 165, 250, 0.3) !important;
  background:
    linear-gradient(100deg, rgba(37, 99, 235, 0.28), rgba(8, 16, 32, 0.85) 50%, rgba(8, 16, 32, 0.7)) !important;
}
.wall-role-expert .wall-hd::before {
  background: linear-gradient(180deg, #3b82f6, #5ec4ff) !important;
}
.wall-role-expert .wall-top h1 {
  text-shadow: 0 0 28px rgba(59, 130, 246, 0.35) !important;
}
.wall-audit-list { display: flex; flex-direction: column; gap: 8px; max-height: 240px; overflow: auto; }
.wall-audit-item {
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(96, 165, 250, 0.25);
  background: rgba(15, 30, 55, 0.55);
}
.wall-audit-item .toolbar { margin-top: 8px; display: flex; gap: 6px; }
.wall-rx-list { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.wall-rx-list .item {
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid rgba(100, 140, 180, 0.2);
  background: rgba(10, 20, 36, 0.5);
}
.wall-focus-card.compact .wall-focus-photo { min-height: 72px; }

/* ????????*/
.wall-screen.wall-role-gov {
  background:
    radial-gradient(1000px 460px at 18% -10%, rgba(196, 120, 38, 0.18), transparent 55%),
    radial-gradient(700px 380px at 90% 5%, rgba(245, 158, 11, 0.1), transparent 50%),
    linear-gradient(180deg, #120e08 0%, #1a140c 42%, #0e0c08 100%);
}
.wall-gov-strip {
  flex-shrink: 0;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
  margin: 8px 14px 0;
}
.wall-gov-kpi {
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(245, 158, 11, 0.28);
  background: rgba(28, 20, 10, 0.72);
  text-align: center;
}
.wall-gov-kpi span { display: block; font-size: 11px; color: #c4a574; margin-bottom: 4px; }
.wall-gov-kpi b { font-size: 22px; color: #fcd34d; }
.wall-gov-kpi small { font-size: 11px; color: #a89068; margin-left: 2px; }
.wall-gov-kpi.warn {
  border-color: rgba(239, 68, 68, 0.45);
  background: rgba(60, 20, 16, 0.65);
}
.wall-gov-kpi.warn b { color: #fca5a5; }
.wall-body-gov { margin-top: 10px; }
.wall-comp {
  padding: 10px 12px;
  margin-bottom: 8px;
  border-radius: 10px;
  border: 1px solid rgba(180, 140, 80, 0.25);
  background: rgba(24, 18, 10, 0.55);
}
.wall-comp.ok { border-color: rgba(47, 158, 122, 0.4); }
.wall-comp.bad { border-color: rgba(245, 158, 11, 0.45); }
.wall-comp-val { margin-top: 6px; font-size: 18px; color: #fde68a; }
.wall-gov-task {
  padding: 10px 12px;
  margin-bottom: 8px;
  border-radius: 10px;
  border: 1px solid rgba(200, 140, 60, 0.28);
  background: rgba(28, 18, 8, 0.55);
}
.wall-gov-task .btn { margin-top: 8px; width: 100%; justify-content: center; }
.wall-gov-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.wall-gov-links .btn { justify-content: center; margin: 0; font-size: 12px; }
.wall-role-gov .wall-hd::before {
  background: linear-gradient(180deg, #d97706, #fbbf24) !important;
}
.wall-role-gov .wall-top h1 {
  color: #fff7e8 !important;
  text-shadow: 0 0 28px rgba(217, 119, 6, 0.35) !important;
}
.wall-role-gov .wall-map-stage {
  border-color: rgba(217, 119, 6, 0.3) !important;
}

/* ????KPI / ???? / ???? */
.wall-status-strip {
  flex-shrink: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
  margin: 8px 14px 0;
}
.wall-status-item {
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(100, 160, 212, 0.28);
  background: rgba(12, 22, 36, 0.72);
  text-align: center;
}
.wall-status-item .wall-status-label,
.wall-status-item > span:first-child {
  display: block;
  font-size: 11px;
  color: #94a3b8;
  margin-bottom: 4px;
}
.wall-status-item b {
  font-size: 22px;
  color: #60a5fa;
}
.wall-status-item small {
  font-size: 11px;
  color: #64748b;
  margin-left: 2px;
}
.wall-status-item .wall-status-note,
.wall-status-item em {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  font-style: normal;
  color: #64748b;
}
.wall-status-item.warn {
  border-color: rgba(239, 68, 68, 0.45);
  background: rgba(60, 20, 16, 0.55);
}
.wall-status-item.warn b { color: #fca5a5; }
.wall-status-item.ok {
  border-color: rgba(47, 158, 122, 0.4);
}
.wall-status-item.ok b { color: #4ade80; }
.wall-role-gov .wall-status-item {
  border-color: rgba(245, 158, 11, 0.28);
  background: rgba(28, 20, 10, 0.72);
}
.wall-role-gov .wall-status-item b { color: #fcd34d; }
.wall-role-gov .wall-status-item .wall-status-label { color: #c4a574; }
.wall-job-view {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 8px;
  align-items: center;
  padding: 10px 12px;
  margin-bottom: 6px;
  border-radius: 10px;
  border: 1px solid rgba(100, 160, 212, 0.22);
  background: rgba(14, 24, 38, 0.55);
  text-align: left;
  width: 100%;
}
.wall-job-view span {
  font-size: 11px;
  color: #94a3b8;
  white-space: nowrap;
}
.wall-job-view b {
  font-size: 13px;
  color: #e2e8f0;
}
.wall-job-view em {
  font-size: 11px;
  font-style: normal;
  color: #64748b;
  white-space: nowrap;
}
.wall-job-view.urgent {
  border-color: rgba(239, 68, 68, 0.4);
  background: rgba(50, 18, 16, 0.55);
}
.wall-job-view.urgent span { color: #fca5a5; }
.wall-mon-note {
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(100, 160, 212, 0.2);
  background: rgba(14, 24, 38, 0.45);
}
.wall-mon-note b {
  display: block;
  font-size: 14px;
  color: #e2e8f0;
  margin-bottom: 6px;
}
.wall-mon-note p {
  margin: 0 0 6px;
  font-size: 12px;
  color: #94a3b8;
  line-height: 1.5;
}
.wall-mon-note p:last-child { margin-bottom: 0; }
.wall-cam { cursor: pointer; }
.wall-rx-item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  margin-bottom: 6px;
  border-radius: 10px;
  border: 1px solid rgba(100, 160, 212, 0.22);
  background: rgba(14, 24, 38, 0.5);
}

@media (max-width: 1100px) {
  .wall-hero-farm { grid-template-columns: 1fr; }
  .wall-hero-cta { flex-direction: row; flex-wrap: wrap; }
  .wall-gov-strip { grid-template-columns: repeat(3, 1fr); }
  .wall-status-strip { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  .wall-gov-strip { grid-template-columns: repeat(2, 1fr); }
  .wall-status-strip { grid-template-columns: repeat(2, 1fr); }
}

/* ???? / AI ?? / ???? */
.role-ribbon .role-tip {
  display: block;
  margin-top: 4px;
  font-style: normal;
  font-size: 11px;
  opacity: 0.85;
  line-height: 1.35;
}
.nav-group {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.nav-group small {
  font-size: 10px;
  font-weight: 500;
  opacity: 0.65;
  letter-spacing: 0.02em;
}
.insight-strip {
  margin: 12px 0;
  padding: 12px 14px;
}
.insight-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.insight-card {
  text-align: left;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card2);
  color: inherit;
  cursor: pointer;
  font-family: var(--font-ui);
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 88px;
}
.insight-card:hover {
  border-color: color-mix(in srgb, var(--blue) 45%, var(--border));
  box-shadow: 0 6px 16px color-mix(in srgb, var(--blue) 12%, transparent);
}
.insight-card b { font-size: 13px; }
.insight-card span { font-size: 12px; color: var(--text2); line-height: 1.4; }
.context-tip-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 4px;
}
.context-tip-strip.compact { margin-top: 10px; }
.context-tip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  cursor: pointer;
  font-size: 12px;
  font-family: var(--font-ui);
}
.context-tip:hover {
  border-color: var(--blue);
  color: var(--blue-dark);
}
.tip-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--blue) 14%, transparent);
  color: var(--blue);
  font-size: 11px;
  font-weight: 700;
}
.ai-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0;
}
.land-photo-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin: 8px 0 10px;
}
.land-photo-chip {
  position: relative;
  height: 48px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background-size: cover;
  background-position: center;
  cursor: pointer;
  overflow: hidden;
}
.land-photo-chip span {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 2px 4px;
  font-size: 10px;
  color: #fff;
  background: linear-gradient(transparent, rgba(0,0,0,0.65));
}
.media-credit { margin: 4px 0 8px; font-size: 11px; }
.wall-rx-item {
  width: 100%;
  text-align: left;
  cursor: pointer;
  background: rgba(10, 20, 36, 0.5);
  border: 1px solid rgba(100, 140, 180, 0.2);
  color: inherit;
  font-family: var(--font-ui);
}
.wall-rx-item:hover { border-color: #60a5fa; }
.wall-comp {
  display: block;
  width: 100%;
  text-align: left;
  cursor: pointer;
  color: inherit;
  font-family: var(--font-ui);
}
.wall-gov-kpi.clickable { cursor: pointer; }
.wall-gov-kpi.clickable:hover { filter: brightness(1.08); }

/* ???????????????????? */
.land-board { margin-bottom: 12px; }
.land-board-head { gap: 12px; align-items: flex-start; }
.land-board-meta { display: flex; gap: 8px; flex-wrap: wrap; }
.land-board-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 12px 0 10px;
}
.land-check-all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--muted);
  cursor: pointer;
}
.land-board-list { display: flex; flex-direction: column; gap: 8px; }
.land-board-row {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--panel) 92%, transparent);
}
.land-board-row.level-red {
  border-color: color-mix(in srgb, #c45c26 45%, var(--border));
  background: color-mix(in srgb, #c45c26 8%, var(--panel));
}
.land-board-row.level-orange {
  border-color: color-mix(in srgb, var(--orange) 40%, var(--border));
  background: color-mix(in srgb, var(--orange) 7%, var(--panel));
}
.land-board-row.level-blue {
  border-color: color-mix(in srgb, var(--blue) 35%, var(--border));
}
.lb-check { display: flex; align-items: center; justify-content: center; }
.lb-title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
.lb-tag {
  display: inline-flex;
  align-items: center;
  padding: 1px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
}
.lb-tag.red { color: #9a3412; background: color-mix(in srgb, #c45c26 18%, transparent); }
.lb-tag.orange { color: #9a5b00; background: color-mix(in srgb, var(--orange) 18%, transparent); }
.lb-tag.blue { color: var(--blue-dark); background: color-mix(in srgb, var(--blue) 14%, transparent); }
.lb-tag.green { color: #166534; background: color-mix(in srgb, #22c55e 16%, transparent); }
.lb-reason { margin-top: 2px; }
.lb-actions { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 720px) {
  .land-board-row { grid-template-columns: 24px 1fr; }
  .lb-actions { grid-column: 1 / -1; justify-content: stretch; }
  .lb-actions .btn { flex: 1; justify-content: center; }
}

@media (max-width: 1100px) {
  .insight-row { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .insight-row { grid-template-columns: 1fr; }
  .land-photo-strip { grid-template-columns: repeat(2, 1fr); }
}

/* ????????????????*/
.wo-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  flex: 1;
  min-width: 0;
}
.wo-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--card) 92%, var(--cyan) 8%);
  text-align: left;
  color: inherit;
  min-width: 0;
  font: inherit;
}
button.wo-card { cursor: pointer; }
button.wo-card:hover { border-color: var(--cyan); }
.wo-card .k {
  font-size: 11px;
  color: var(--text3);
  font-weight: 650;
}
.wo-card strong {
  font-size: 15px;
  font-weight: 750;
  line-height: 1.3;
}
.wo-card-sub {
  font-size: 11px;
  color: var(--text2);
  line-height: 1.35;
}
.wo-card-bar {
  height: 4px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
  margin: 2px 0;
}
.wo-card-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--cyan), color-mix(in srgb, var(--orange) 65%, var(--cyan)));
}
.wo-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  flex: 1;
  min-width: 0;
}
.wo-metric {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--card) 92%, var(--cyan) 8%);
  text-align: left;
  color: inherit;
  min-width: 0;
}
button.wo-metric { cursor: pointer; font: inherit; }
button.wo-metric:hover { border-color: var(--cyan); }
.wo-metric .k {
  font-size: 11px;
  color: var(--text3);
  font-weight: 600;
}
.wo-metric strong {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  word-break: break-word;
}
.wo-metric strong em {
  font-style: normal;
  color: var(--text2);
  font-weight: 600;
  font-size: 12px;
}
.wo-metric.is-risk {
  border-color: color-mix(in srgb, #c45c26 45%, var(--border));
  background: color-mix(in srgb, #c45c26 10%, var(--card));
}
.btn.danger-solid {
  background: #b91c1c;
  border-color: #991b1b;
  color: #fff;
  font-weight: 700;
}
.btn.danger-solid:hover {
  filter: brightness(1.06);
}
.wo-window {
  margin: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--card);
  padding: 0 12px;
}
.wo-window > summary {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
  cursor: pointer;
  list-style: none;
  padding: 10px 0;
}
.wo-window > summary::-webkit-details-marker { display: none; }
.wo-window-k {
  font-size: 11px;
  font-weight: 700;
  color: var(--text3);
  text-transform: none;
}
.wo-window > summary strong { font-size: 13px; font-weight: 700; }
.wo-window-wx {
  margin-left: auto;
  font-size: 12px;
  color: var(--text2);
}
.wo-window-note {
  margin: 0 0 8px;
  font-size: 12px;
  color: var(--text2);
}
.wo-window-hours {
  display: grid;
  gap: 6px;
  padding: 0 0 12px;
  border-top: 1px dashed var(--border);
  padding-top: 10px;
}
.wo-hour {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 8px;
  font-size: 12px;
  padding: 6px 8px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--border) 35%, transparent);
}
.wo-hour.is-ok {
  background: color-mix(in srgb, #22c55e 12%, transparent);
}
.wo-hour.is-off { opacity: 0.72; }
.wo-hour b { font-family: var(--font-mono); font-size: 11px; }
.wo-side {
  margin: 0 0 10px;
  border: 1px solid color-mix(in srgb, #c45c26 40%, var(--border));
  border-radius: 10px;
  background: color-mix(in srgb, #c45c26 6%, var(--card));
  padding: 12px 14px;
}
.wo-side[hidden] { display: none !important; }
.wo-side-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.wo-side-body p {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.45;
}
.wo-side-body em {
  display: inline-block;
  min-width: 4.5em;
  margin-right: 8px;
  font-style: normal;
  color: var(--text3);
  font-weight: 600;
  font-size: 12px;
}
.wo-side-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.wo-panel {
  margin: 0 0 10px;
  border: 1px solid color-mix(in srgb, var(--cyan) 35%, var(--border));
  border-radius: 10px;
  background: color-mix(in srgb, var(--cyan) 6%, var(--card));
  padding: 12px 14px;
}
.wo-panel[hidden] { display: none !important; }
.wo-panel-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 10px;
}
.wo-panel-head .sub { color: var(--text3); font-size: 12px; }
.wo-panel-head .btn { margin-left: auto; }
.wo-suggest {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  border-top: 1px solid var(--border);
}
.wo-suggest:first-child { border-top: 0; padding-top: 0; }
.wo-suggest b { display: block; margin-bottom: 4px; }
.wo-suggest span { font-size: 12px; color: var(--text2); }
.wo-suggest-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.week-ops.is-compact .wq-grid.wq-table-head,
.week-ops.is-compact .wq-row.wq-grid {
  grid-template-columns:
    32px
    minmax(72px, 0.7fr)
    minmax(70px, 0.7fr)
    minmax(64px, 0.6fr)
    minmax(88px, 0.9fr)
    minmax(70px, 0.7fr)
    minmax(52px, 0.5fr)
    minmax(88px, 0.9fr)
    minmax(120px, 1.2fr)
    minmax(186px, 1.4fr);
}
.wq-crop-cell,
.wq-task,
.wq-pri,
.wq-res {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  font-size: 12px;
}
.wq-crop-cell small,
.wq-cmd {
  color: var(--text3);
  font-size: 11px;
}
.wq-name-sub {
  display: block;
  font-size: 11px;
  color: var(--text3);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.wq-res {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text2);
}
.wq-state.st-queue {
  color: var(--blue-dark);
  background: color-mix(in srgb, var(--blue) 14%, transparent);
}
.wq-state.st-accept {
  color: #9a5b00;
  background: color-mix(in srgb, var(--orange) 16%, transparent);
}
.wq-row.has-conflict { box-shadow: inset 2px 0 0 #c45c26; }
.wq-row.is-paused { box-shadow: inset 2px 0 0 #c45c26; background: color-mix(in srgb, #c45c26 5%, var(--card)); }
.wq-row.is-queued { box-shadow: inset 2px 0 0 var(--blue); }
.wq-row.is-accepting { box-shadow: inset 2px 0 0 var(--orange); }
.wo-head {
  flex-wrap: wrap;
  align-items: stretch;
}
.week-ops.is-compact .wo-head {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.week-ops.is-compact .wo-cmds {
  margin-left: 0;
  width: 100%;
  justify-content: flex-start;
}
@media (max-width: 1200px) {
  .wo-board { grid-template-columns: 1fr; }
  .wo-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .wo-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wo-hour { grid-template-columns: 1fr; }
  .week-ops.is-compact .wq-grid.wq-table-head { display: none; }
  .week-ops.is-compact .wq-row.wq-grid {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 6px 8px;
  }
  .week-ops.is-compact .wq-row.wq-grid > :not(.wq-check) {
    grid-column: 2;
  }
  .week-ops.is-compact .wq-row.wq-grid .wq-ops {
    justify-content: flex-start;
  }
}

/* ========== ???????????????? ========== */
.dash-cockpit {
  gap: 10px;
  padding-bottom: 24px;
}
.dc-map,
.dc-wx,
.dc-devs,
.dc-bars {
  padding: 10px 12px 12px;
}
.dc-card-hd {
  margin-bottom: 8px;
}
.dc-wx-grid {
  gap: 6px;
}
.dc-wx-item {
  padding: 8px 10px;
}
.dc-forecast {
  margin-top: 8px;
  gap: 4px;
}
.dc-forecast-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 8px;
  color: var(--text3);
  font-size: 11px;
}
.dc-forecast-meta b { color: var(--text2); font-size: 12px; }
.dc-forecast-meta + .dc-forecast { margin-top: 5px; }
.dc-fc {
  padding: 6px 4px;
}
.dc-dev-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.dc-dev {
  padding: 8px 10px;
  gap: 2px;
}
.dc-dev span {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 11px;
}
.dc-map-status {
  width: 118px;
  padding: 8px 10px;
  font-size: 11px;
}
@media (max-width: 1100px) {
  .dc-dev-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 980px) {
  .dc-map-stage { height: 180px; }
}
.dash-cockpit .card {
  margin: 0;
}
.dc-top {
  display: grid;
  grid-template-columns: minmax(240px, 1.15fr) minmax(0, 1.85fr);
  gap: 12px;
  align-items: stretch;
}
.dc-slogan {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 6px;
  min-height: 108px;
  padding: 14px 16px;
  overflow: hidden;
  color: #f4fff7;
  border: 0;
  background:
    linear-gradient(105deg, rgba(18, 52, 36, 0.82) 8%, rgba(18, 52, 36, 0.35) 48%, rgba(18, 52, 36, 0.15) 100%),
    radial-gradient(120% 80% at 80% 20%, #7ec8a3 0%, transparent 55%),
    linear-gradient(160deg, #1f6b4a 0%, #2f8f5c 42%, #c9e4b8 100%);
  box-shadow: 0 10px 28px color-mix(in srgb, #1f6b4a 18%, transparent);
}
.dc-slogan::after {
  content: "";
  position: absolute;
  inset: auto -10% -40% 35%;
  height: 140%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 40%, rgba(255,255,255,0.22), transparent 42%),
    radial-gradient(circle at 70% 60%, rgba(255, 214, 140, 0.28), transparent 46%);
  pointer-events: none;
}
.dc-slogan > * { position: relative; z-index: 1; }
.dc-kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: rgba(244, 255, 247, 0.78);
}
.dc-slogan h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 22px;
  line-height: 1.25;
  color: #fff;
  text-shadow: 0 1px 10px rgba(0,0,0,0.18);
}
.dc-slogan > p {
  margin: 0;
  font-size: 13px;
  color: rgba(244, 255, 247, 0.88);
  line-height: 1.45;
  max-width: 36em;
}
.dc-slogan-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin-top: 4px;
  font-size: 12px;
  color: rgba(244, 255, 247, 0.82);
}
.dc-slogan-foot b {
  color: #fff;
  font-weight: 750;
}
.dc-slogan-foot .btn {
  margin: 0;
  margin-left: auto;
  height: 28px;
  color: #123424 !important;
  background: rgba(255,255,255,0.9) !important;
  border-color: transparent !important;
}
.dc-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.dc-kpi {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 14px 16px;
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.dc-kpi:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--blue) 35%, var(--border));
  box-shadow: 0 12px 28px color-mix(in srgb, var(--blue) 12%, transparent);
}
.dc-kpi em {
  font-style: normal;
  font-size: 12px;
  font-weight: 650;
  color: var(--text3);
}
.dc-kpi strong {
  font-size: 26px;
  font-weight: 750;
  line-height: 1.1;
  color: var(--text);
}
.dc-kpi strong small {
  margin-left: 4px;
  font-size: 12px;
  font-weight: 650;
  color: var(--text2);
}
.dc-kpi > span {
  font-size: 12px;
  color: var(--text2);
}
.dc-kpi.is-run strong { color: #175CD3; }
.dc-kpi.is-wait strong { color: color-mix(in srgb, var(--orange) 80%, #000); }
.dc-kpi.is-done strong { color: #176B5B; }

.dc-mid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.95fr);
  gap: 12px;
  align-items: stretch;
}
.dc-card-hd {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.dc-card-hd b {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
}
.dc-card-hd span {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--text3);
}
.dc-card-hd .btn {
  margin: 0;
  flex-shrink: 0;
  height: 28px;
}
.dc-map,
.dc-wx,
.dc-devs,
.dc-bars {
  padding: 10px 12px 12px;
}
.dc-map-stage {
  position: relative;
  height: 200px;
  border-radius: 12px;
  overflow: hidden;
  background:
    radial-gradient(420px 220px at 20% 10%, color-mix(in srgb, var(--blue) 10%, transparent), transparent 60%),
    linear-gradient(180deg, #f3f7ef, #e7f0e0);
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.dc-map-svg {
  width: 100%;
  height: 100%;
  display: block;
  transform-origin: center center;
  transition: transform 0.18s ease;
}
.dc-plot-code {
  font-size: 11px;
  font-weight: 700;
  fill: #1f3324;
  pointer-events: none;
}
.dc-plot-sub {
  font-size: 9px;
  fill: #5e7560;
  pointer-events: none;
}
.dc-plot:hover polygon {
  stroke: var(--blue);
  stroke-width: 2.2;
  filter: brightness(1.05);
}
.dc-map-tools {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.dc-map-tools .btn {
  width: 30px;
  height: 30px;
  margin: 0;
  padding: 0;
  justify-content: center;
  background: color-mix(in srgb, var(--card) 92%, transparent);
}
.dc-map-legend {
  position: absolute;
  left: 10px;
  bottom: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  padding: 6px 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--card) 90%, transparent);
  border: 1px solid var(--border);
  font-size: 11px;
  color: var(--text2);
}
.dc-map-legend i {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 4px;
  vertical-align: middle;
}
.dc-map-legend .lg.run { background: #175CD3; }
.dc-map-legend .lg.wait { background: var(--orange); }
.dc-map-legend .lg.done { background: #5cb85c; }
.dc-map-legend .lg.ok { background: #5fad6e; }

.dc-wx {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.dc-wx-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.dc-wx-item {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: 2px 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--card2) 70%, var(--card));
  border: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
}
.dc-wx-item em {
  grid-column: 1;
  font-style: normal;
  font-size: 11px;
  font-weight: 650;
  color: var(--text3);
}
.dc-wx-item strong {
  grid-column: 1;
  font-size: 16px;
  font-weight: 750;
  color: var(--text);
}
.dc-wx-item .dc-spark {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
}
.dc-forecast {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 4px;
  margin-top: 8px;
}
.dc-fc {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 8px;
  border-radius: 12px;
  text-align: center;
  background: color-mix(in srgb, var(--blue) 5%, var(--card));
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.dc-fc em {
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
  color: var(--text3);
}
.dc-fc b {
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
}
.dc-fc span {
  font-size: 12px;
  color: var(--blue-dark);
}
.dc-fc small {
  font-size: 10px;
  color: var(--text3);
}

.dc-bottom {
  display: block;
}
.dc-rail {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.dc-mid-right {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.dc-foot {
  display: block;
}
.dc-bar-chart.is-wide {
  min-height: 120px;
  max-width: 720px;
}
.dc-dev-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.dc-dev {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--card2) 55%, var(--card));
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.dc-dev:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--blue) 35%, var(--border));
}
.dc-dev em {
  font-style: normal;
  font-size: 11px;
  font-weight: 650;
  color: var(--text3);
}
.dc-dev strong {
  font-size: 14px;
  font-weight: 750;
}
.dc-dev span {
  font-size: 11px;
  color: var(--text2);
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.dc-dev.is-on strong { color: #176B5B; }
.dc-dev.is-idle strong { color: color-mix(in srgb, var(--orange) 70%, #000); }
.dc-dev.is-off strong { color: var(--red); }

.dc-bar-chart {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
  align-items: end;
  min-height: 148px;
  padding: 8px 2px 0;
}
.dc-bar {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  min-width: 0;
  height: 140px;
}
.dc-bar i {
  display: block;
  width: 70%;
  max-width: 22px;
  border-radius: 8px 8px 4px 4px;
  background: linear-gradient(180deg, var(--blue-light), var(--blue));
  box-shadow: 0 6px 12px color-mix(in srgb, var(--blue) 18%, transparent);
}
.dc-bar em {
  font-style: normal;
  font-size: 10px;
  font-weight: 650;
  color: var(--text3);
}
.dc-bar b {
  font-size: 11px;
  font-weight: 700;
  color: var(--text2);
}

.dash-cockpit .wo-list-block {
  min-height: 0;
  border-radius: 14px;
  box-shadow:
    0 1px 0 color-mix(in srgb, var(--text) 2.5%, transparent),
    0 10px 28px color-mix(in srgb, var(--blue) 5%, transparent);
}

@media (max-width: 1280px) {
  .dc-top { grid-template-columns: 1fr; }
  .dc-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .dc-mid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 980px) {
  .dc-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dc-mid { grid-template-columns: 1fr; }
  .dc-map-stage { height: 180px; }
  .dc-forecast { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .dc-forecast { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dc-slogan h3 { font-size: 18px; }
}

/* ========== ?????????????????========== */
.page-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-bottom: 64px;
  min-width: 0;
}
.page-shell > .card,
.page-shell > .panel,
.page-shell .pg-card {
  margin: 0;
  border-radius: 14px;
  box-shadow:
    0 1px 0 color-mix(in srgb, var(--text) 2.5%, transparent),
    0 10px 28px color-mix(in srgb, var(--blue) 5%, transparent);
}
.page-shell .panel {
  padding: 14px 16px 16px;
  border-radius: 14px;
  background: var(--card);
  border: 1px solid var(--border);
}
.page-shell .panel > h3 {
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
}
.page-shell .status-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  padding: 12px 14px;
  margin: 0;
  border-radius: 14px;
  background: var(--card);
  border: 1px solid var(--border);
  box-shadow:
    0 1px 0 color-mix(in srgb, var(--text) 2.5%, transparent),
    0 8px 22px color-mix(in srgb, var(--blue) 5%, transparent);
}
.page-shell .status-strip .btn {
  margin: 0;
  height: 28px;
}
.page-shell .status-strip .btn:first-of-type {
  margin-left: auto;
}

.pg-hero {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px 16px;
  padding: 14px 16px;
}
.pg-hero-main {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  flex: 1 1 240px;
}
.pg-kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--text3);
  text-transform: uppercase;
}
.pg-hero-main h3,
.pg-hero-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--text);
}
.pg-hero-sub,
.pg-hero-main > p {
  margin: 0;
  font-size: 13px;
  color: var(--text2);
  line-height: 1.45;
  max-width: 52em;
}
.pg-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}
.pg-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-left: auto;
}
.pg-hero-actions .btn {
  margin: 0;
  height: 30px;
}

.pg-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.pg-kpis.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pg-kpis.cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.pg-kpis.cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.pg-kpi {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 14px 16px;
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: default;
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.pg-kpi.clickable,
button.pg-kpi {
  cursor: pointer;
  width: 100%;
}
.pg-kpi.clickable:hover,
button.pg-kpi:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--blue) 35%, var(--border));
  box-shadow: 0 12px 28px color-mix(in srgb, var(--blue) 12%, transparent);
}
.pg-kpi em {
  font-style: normal;
  font-size: 12px;
  font-weight: 650;
  color: var(--text3);
}
.pg-kpi strong {
  font-size: 24px;
  font-weight: 750;
  line-height: 1.1;
  color: var(--text);
}
.pg-kpi strong small {
  margin-left: 4px;
  font-size: 12px;
  font-weight: 650;
  color: var(--text2);
}
.pg-kpi > span {
  font-size: 12px;
  color: var(--text2);
}
.pg-kpi.is-run strong { color: #175CD3; }
.pg-kpi.is-wait strong { color: color-mix(in srgb, var(--orange) 80%, #000); }
.pg-kpi.is-done strong,
.pg-kpi.is-ok strong { color: #176B5B; }
.pg-kpi.is-warn strong,
.pg-kpi.is-urgent strong { color: var(--red); }

.pg-split {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.9fr);
  gap: 12px;
  align-items: start;
}
.pg-split.equal { grid-template-columns: 1fr 1fr; }
.pg-split.wide-left { grid-template-columns: minmax(0, 1.45fr) minmax(240px, 0.75fr); }
.pg-split.wide-right { grid-template-columns: minmax(240px, 0.85fr) minmax(0, 1.35fr); }
.pg-split.triple {
  grid-template-columns: minmax(220px, 0.85fr) minmax(0, 1.25fr) minmax(220px, 0.9fr);
}
.pg-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.pg-grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pg-grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.pg-card-hd {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.pg-card-hd b,
.pg-card-hd h2 {
  display: block;
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--text);
}
.pg-card-hd span {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--text3);
}
.pg-card-hd .btn {
  margin: 0;
  flex-shrink: 0;
  height: 28px;
}

.pg-table-wrap {
  overflow: auto;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: color-mix(in srgb, var(--card2) 35%, var(--card));
}
.page-shell .pg-table-wrap .table,
.page-shell .table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.page-shell .pg-table-wrap .table th,
.page-shell .table th {
  position: sticky;
  top: 0;
  z-index: 1;
  text-align: left;
  padding: 10px 12px;
  font-size: 12px;
  font-weight: 700;
  color: var(--text2);
  background: color-mix(in srgb, var(--card2) 80%, var(--card));
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.page-shell .pg-table-wrap .table td,
.page-shell .table td {
  padding: 10px 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  vertical-align: middle;
  color: var(--text);
}
.page-shell .pg-table-wrap .table tr:last-child td,
.page-shell .table tr:last-child td {
  border-bottom: 0;
}
.page-shell .pg-table-wrap .table tr:hover td,
.page-shell .table tr.clickable:hover td {
  background: color-mix(in srgb, var(--blue) 5%, transparent);
}
.page-shell .table .btn {
  margin: 0 4px 0 0;
  height: 28px;
  padding: 0 10px;
}
.page-shell .tag,
.pg-pill {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid transparent;
  white-space: nowrap;
}
.pg-pill.is-run,
.page-shell .tag.blue { color: #175CD3; background: color-mix(in srgb, #175CD3 12%, transparent); border-color: color-mix(in srgb, #175CD3 28%, transparent); }
.pg-pill.is-wait,
.page-shell .tag.orange { color: color-mix(in srgb, var(--orange) 85%, #000); background: color-mix(in srgb, var(--orange) 14%, transparent); border-color: color-mix(in srgb, var(--orange) 32%, transparent); }
.pg-pill.is-done,
.pg-pill.is-ok,
.page-shell .tag.green { color: #176B5B; background: color-mix(in srgb, #176B5B 12%, transparent); border-color: color-mix(in srgb, #176B5B 28%, transparent); }
.pg-pill.is-urgent,
.page-shell .tag.red { color: var(--red); background: color-mix(in srgb, var(--red) 12%, transparent); border-color: color-mix(in srgb, var(--red) 30%, transparent); }

.pg-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}
.pg-toolbar .btn { margin: 0; }
.pg-feed {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 420px;
  overflow: auto;
}
.page-shell .item {
  border-radius: 12px;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  background: color-mix(in srgb, var(--card2) 45%, var(--card));
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.page-shell .item.clickable:hover,
.page-shell .item.ok.clickable:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--blue) 32%, var(--border));
}
.page-shell .item.ok {
  border-color: color-mix(in srgb, var(--blue) 22%, var(--border));
  background: color-mix(in srgb, var(--blue) 6%, var(--card));
}
.page-shell .item.warn {
  border-color: color-mix(in srgb, var(--orange) 35%, var(--border));
  background: color-mix(in srgb, var(--orange) 8%, var(--card));
}
.page-shell .form-row,
.page-shell .toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.page-shell input,
.page-shell select,
.page-shell textarea {
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  padding: 8px 10px;
  font: inherit;
}
.page-shell textarea { width: 100%; min-height: 72px; resize: vertical; }

.page-shell .role-cap-bar {
  border-radius: 14px;
  padding: 12px 14px;
  background: color-mix(in srgb, var(--blue) 6%, var(--card));
  border: 1px solid color-mix(in srgb, var(--blue) 18%, var(--border));
}
.page-shell .cmd-board {
  border-radius: 14px;
}
.page-shell .twin-stage {
  gap: 12px;
}
.page-shell .twin-rail .panel,
.page-shell .twin-map-wrap {
  border-radius: 14px;
}

@media (max-width: 1280px) {
  .pg-kpis.cols-5,
  .pg-kpis.cols-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pg-split.triple { grid-template-columns: 1fr 1fr; }
  .pg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .pg-kpis,
  .pg-kpis.cols-3,
  .pg-kpis.cols-5,
  .pg-kpis.cols-6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-split,
  .pg-split.equal,
  .pg-split.wide-left,
  .pg-split.wide-right,
  .pg-split.triple { grid-template-columns: 1fr; }
  .pg-grid,
  .pg-grid.cols-2,
  .pg-grid.cols-4 { grid-template-columns: 1fr; }
  .page-shell .status-strip .btn:first-of-type { margin-left: 0; }
}
/* ===== v76 cockpit polish ===== */
.dc-kpi { position: relative; padding-top: 14px; text-align: left; }
.dc-kpi-ico {
  position: absolute; top: 12px; right: 12px;
  width: 28px; height: 28px; border-radius: 50%;
  background: color-mix(in srgb, var(--blue) 14%, #fff);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--blue) 18%, transparent);
}
.dc-kpi-ico::after {
  content: ""; position: absolute; inset: 7px;
  border-radius: 50%; border: 2px solid currentColor; opacity: 0.7;
}
.dc-kpi-ico.is-all { color: var(--blue); }
.dc-kpi-ico.is-run { color: #175CD3; background: color-mix(in srgb, #175CD3 12%, #fff); }
.dc-kpi-ico.is-wait { color: var(--orange); background: color-mix(in srgb, var(--orange) 12%, #fff); }
.dc-kpi-ico.is-done { color: #8fa390; background: color-mix(in srgb, #8fa390 12%, #fff); }
.dc-kpi-bar {
  height: 4px; border-radius: 999px; margin-top: 8px;
  background: color-mix(in srgb, var(--blue) 12%, #edf3e8); overflow: hidden;
}
.dc-kpi-bar > i { display: block; height: 100%; background: linear-gradient(90deg, var(--blue-light), var(--blue)); border-radius: inherit; }
.dc-kpi-foot { display: block; margin-top: 6px; font-size: 11px; color: var(--text3); }
.dc-card-hd { flex-wrap: wrap; gap: 8px; }
.dc-map-tabs { display: flex; gap: 4px; background: var(--secondary); padding: 3px; border-radius: 10px; }
.dc-map-tab {
  height: 28px; padding: 0 10px; border: 0; border-radius: 8px;
  background: transparent; color: var(--text2); font-size: 12px; font-weight: 650; cursor: pointer; font-family: var(--font-ui);
}
.dc-map-tab.is-on { background: #fff; color: var(--blue-dark); box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
.dc-map-search { position: relative; display: inline-flex; align-items: center; }
.dc-map-search input {
  height: 30px; min-width: 160px; max-width: 220px; border-radius: 8px;
  border: 1px solid var(--border); padding: 0 66px 0 10px; font-size: 12px; background: #fff; color: var(--text);
}
.dc-map-search-status {
  position: absolute;
  right: 8px;
  max-width: 56px;
  overflow: hidden;
  color: var(--text3);
  font-size: 10px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
}
.dc-map-search-status.is-empty { color: var(--red); }
.dc-map-status {
  position: absolute; left: 12px; top: 12px; z-index: 2;
  width: 132px; padding: 10px 12px; border-radius: 12px;
  background: rgba(255,255,255,0.92); border: 1px solid var(--border);
  box-shadow: 0 8px 20px rgba(18,52,36,0.08); backdrop-filter: blur(8px);
}
.dc-map-status b { display: block; font-size: 12px; margin-bottom: 6px; }
.dc-map-status ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.dc-map-status li { display: flex; justify-content: space-between; gap: 8px; font-size: 11px; color: var(--text2); }
.dc-map-status em { font-style: normal; font-weight: 700; color: var(--text); }
.dc-map-status .is-wait { color: var(--orange); }
.dc-map-status .is-run { color: #175CD3; }
.dc-map-status .is-done { color: #176B5B; }
.dc-map-status .is-bad { color: var(--red); }
.dc-map-stage.is-sat {
  background:
    linear-gradient(rgba(15, 61, 44, .12), rgba(15, 61, 44, .18)),
    url("img/farm-real/farm-orthophoto.jpg") center / cover no-repeat;
}
.dc-map-stage.is-sat .dc-map-base { opacity: .08; }
.dc-map-stage.is-sat .dc-plot polygon { fill-opacity: .5; stroke: rgba(255,255,255,.92); stroke-width: 2; }
.dc-map-stage.is-sat .dc-plot text { paint-order: stroke; stroke: rgba(15,61,44,.74); stroke-width: 3px; fill: #fff; }
.dc-slogan {
  background:
    linear-gradient(105deg, rgba(18, 52, 36, 0.78) 8%, rgba(18, 52, 36, 0.35) 48%, rgba(18, 52, 36, 0.18) 100%),
    url("img/farm-real/hero-xinjiang.jpg");
  background-size: cover;
  background-position: center 40%;
}
@media (max-width: 1200px) {
  .tb-weather { display: none; }
}

/* ===== v80 farm-demo layout ===== */
:root {
  --blue: #137c5a;
  --blue-dark: #07553e;
  --blue-light: #1a9470;
  --bg: #f0f6f4;
  --card: #ffffff;
  --card2: #e4f3ed;
  --side: #f7fbf9;
}
.dc-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.95fr) minmax(300px, 1fr);
  gap: 14px;
  align-items: start;
}
.dc-col-main,
.dc-col-side {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.dc-top {
  display: grid;
  grid-template-columns: minmax(280px, 2.8fr) repeat(4, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
  margin-bottom: 2px;
}
.dc-map-stage { height: 260px; }
.dc-map-hd-left {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.dc-map-hd-left b { margin: 0; }
.wo-task-hd {
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  padding: 12px 14px !important;
  margin-bottom: 0 !important;
  border-bottom: 1px solid var(--border);
}
.wo-task-hd .heading-with-meta {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.wo-task-hd .date-range {
  font-size: 12px;
  color: var(--text3);
  font-weight: 600;
}
.wo-task-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-left: auto;
}
.dash-cockpit .wo-list-block {
  min-height: 0;
  overflow: visible;
  padding: 0;
}
.dash-cockpit .wo-list-block .wo-queue {
  max-height: none;
  overflow: visible;
  border-radius: 0;
  box-shadow: none;
}
.wo-table-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-top: 1px solid var(--border);
  font-size: 12px;
  color: var(--text3);
}
.dash-cockpit .wo-dock:not([hidden]) {
  /* superseded by .is-open rules */
  display: none;
}
.dc-dev-grid.is-tiles {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.dc-dev-tile {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--card2) 45%, #fff);
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.dc-dev-tile:hover {
  border-color: color-mix(in srgb, var(--blue) 35%, var(--border));
}
.dc-dev-tile strong {
  font-size: 22px;
  font-weight: 750;
  color: var(--blue-dark);
  line-height: 1;
}
.dc-dev-tile em {
  font-style: normal;
  font-size: 12px;
  color: var(--text2);
  font-weight: 650;
}
.dc-col-side .dc-bar-chart {
  min-height: 140px;
}
.wq-h-check input {
  width: 15px;
  height: 15px;
  accent-color: var(--blue);
}
@media (max-width: 1100px) {
  .dc-grid { grid-template-columns: 1fr; }
  .dc-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dc-top { grid-template-columns: 1fr; }
}

/* ===== v81 task-first layout ===== */
.dc-top.is-slim {
  display: block;
  margin-bottom: 0;
}
.dc-top.is-slim .dc-slogan {
  min-height: 88px;
  padding: 14px 16px;
}
.dc-top.is-slim .dc-slogan > p { max-width: 60em; }
.dc-mid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, 0.9fr);
  gap: 12px;
  align-items: stretch;
}
.dc-map-stage { height: 210px !important; }
.dc-tasks { display: block; }
.dash-cockpit .dc-tasks .wo-list-block .wo-queue {
  max-height: none;
  overflow: visible;
}
.wo-task-hd {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding: 10px 12px;
  margin: 0;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--card2) 40%, #fff);
}
.wo-task-hd .wo-status-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}
.wo-task-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-left: auto;
}
.wo-seg {
  display: inline-flex;
  align-items: stretch;
  padding: 3px;
  gap: 2px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--card2) 80%, #fff);
  border: 1px solid var(--border);
}
.wo-seg-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 30px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text2);
  font: inherit;
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
}
.wo-seg-btn em {
  font-style: normal;
  font-weight: 750;
  font-family: var(--font-mono);
  color: var(--text3);
}
.wo-seg-btn:hover { color: var(--text); background: color-mix(in srgb, #fff 70%, transparent); }
.wo-seg-btn.is-on {
  background: #fff;
  color: var(--blue-dark);
  box-shadow: 0 1px 3px rgba(18, 52, 36, 0.08);
}
.wo-seg-btn.is-on em { color: var(--blue-dark); }
.wo-seg-btn.wo-st-running.is-on { color: #175CD3; }
.wo-seg-btn.wo-st-running.is-on em { color: #175CD3; }
.wo-seg-btn.wo-st-todo.is-on { color: color-mix(in srgb, var(--orange) 85%, #000); }
.wo-sort-wrap { display: inline-flex; }
.wo-find-sort {
  height: 30px !important;
  min-width: 96px;
  padding: 0 8px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
}
.wo-prio-btn {
  height: 30px !important;
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
}
.wo-prio-btn em {
  font-style: normal;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--blue) 14%, #fff);
  color: var(--blue-dark);
  font-size: 11px;
  font-weight: 750;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.wo-dock-hint { font-size: 12px; color: var(--text2); }
.wo-dock-hint b { color: var(--blue-dark); }
.wo-dock-warn { font-size: 12px; color: color-mix(in srgb, var(--orange) 80%, #000); }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}
.wq-h-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.wq-h-check input {
  width: 15px;
  height: 15px;
  accent-color: var(--blue);
  cursor: pointer;
}
.wo-safety {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--red) 22%, var(--border));
  background: color-mix(in srgb, var(--red) 8%, var(--card));
}
.wo-safety[hidden] { display: none !important; }
.wo-safety .sub { font-size: 12px; color: var(--text3); }
.wo-safety .btn.danger-solid {
  color: #fff !important;
  border-color: #8f1b13 !important;
  background: #b42318 !important;
}

/* ===== ???? / ???? ===== */
.eq-catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
}
.eq-card {
  display: flex;
  flex-direction: column;
  text-align: left;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--card2) 40%, #fff);
  overflow: hidden;
  cursor: pointer;
  padding: 0;
  font: inherit;
  color: inherit;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.eq-card:hover,
.eq-card.is-on {
  border-color: color-mix(in srgb, var(--blue) 40%, var(--border));
  box-shadow: 0 8px 20px color-mix(in srgb, var(--blue) 10%, transparent);
}
.eq-card-media {
  height: 96px;
  position: relative;
  background-color: var(--card2);
  background-position: center 52% !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}
.eq-card-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 54%, color-mix(in srgb, var(--card) 26%, transparent) 100%);
}
.eq-card-body { padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 4px; }
.eq-card-top { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.eq-params { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.eq-params em {
  font-style: normal;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--blue) 10%, #fff);
  color: var(--blue-dark);
}
.eq-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.eq-chip-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.eq-chip {
  font-size: 11px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--blue) 22%, var(--border));
  background: color-mix(in srgb, var(--blue) 8%, #fff);
  color: var(--text);
}
.eq-chip.soft {
  background: var(--card2);
  border-color: var(--border);
  color: var(--text2);
}
@media (max-width: 980px) {
  .eq-detail-grid { grid-template-columns: 1fr; }
  .eq-catalog-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
}
.dc-secondary {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) !important;
}
.dc-week-sum-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.dc-week-sum-grid button,
.dc-week-sum-grid .wide {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--card2) 50%, #fff);
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
}
.dc-week-sum-grid .wide {
  grid-column: 1 / -1;
  cursor: default;
}
.dc-week-sum-grid button:hover {
  border-color: color-mix(in srgb, var(--blue) 35%, var(--border));
}
.dc-week-sum-grid em {
  font-style: normal;
  font-size: 11px;
  color: var(--text3);
  font-weight: 650;
}
.dc-week-sum-grid strong {
  font-size: 20px;
  font-weight: 750;
  color: var(--blue-dark);
}
.dc-week-sum-grid .wide span {
  font-size: 12px;
  color: var(--text2);
}
.dc-secondary .dc-dev-grid.is-tiles {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.dc-secondary .dc-bar-chart { min-height: 120px; }
@media (max-width: 1100px) {
  .dc-mid { grid-template-columns: 1fr; }
  .dc-secondary { grid-template-columns: 1fr; }
}

/* v92 · 决策优先驾驶舱层：把“现在该做什么”提到地图与任务之前 */
:root, :root[data-theme="light"] {
  --blue: #1f6b4a;
  --blue-dark: #0f3d2c;
  --blue-light: #2f9e6b;
  --cyan: #3d9b8f;
  --bg: #f3f6f1;
  --card2: #e7f0e4;
  --hover: #e1ece1;
  --border2: #d5ded6;
  --text: #14201a;
  --text2: #5c6b62;
  --text3: #7a8b80;
  --border: rgba(20, 32, 26, .10);
  --glow: rgba(31, 107, 74, .12);
  --grad-primary: linear-gradient(135deg, #2f9e6b, #0f3d2c);
  --side: #f8faf7;
  --priority-from: #0f3d2c;
  --priority-to: #1f6b4a;
  --font-display: "Fraunces", "Noto Sans SC", serif;
}

#topbar { height: 64px; padding-left: 22px; gap: 12px; }
#topbar .logo .mark { width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(145deg, #2f9e6b, #0f3d2c); }
#topbar .logo-text strong { font-size: 15px; }
#topbar .logo-text em { color: var(--blue); }
.farm-select, #g-search { height: 38px; border-radius: 12px; }
#g-search { max-width: 260px; }
.runtime-badge {
  height: 26px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 9px;
  border: 1px solid color-mix(in srgb, var(--orange) 30%, var(--border));
  border-radius: 999px;
  background: color-mix(in srgb, var(--orange) 8%, var(--card));
  color: color-mix(in srgb, var(--orange) 80%, var(--text));
  font-size: 10px;
  font-weight: 750;
  white-space: nowrap;
}
.runtime-badge i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--orange);
}
.runtime-badge.is-checking { opacity: .7; }
#layout { height: calc(100vh - 64px); }
#sidebar { padding-top: 18px; }
.nav-group { margin-top: 18px; color: var(--text3); letter-spacing: .08em; }
.mod-head { border-radius: 12px; margin: 3px 10px; padding: 10px 12px; }
.mod-head.active { background: #e1eee5; color: var(--blue-dark); box-shadow: inset 3px 0 0 var(--blue); }
#main { padding: 24px 28px 36px; }
.page-title h2 { font-size: 28px; letter-spacing: -.03em; }
.command-strip { display: grid; grid-template-columns: minmax(270px, 1.2fr) minmax(290px, 1fr) auto; align-items: center; gap: 20px; margin: 14px 0 18px; padding: 18px 20px; border: 1px solid #cddbd0; border-radius: 18px; background: linear-gradient(115deg, #edf6ed 0%, #fff 62%); box-shadow: 0 10px 30px rgba(22, 65, 41, .07); }
.command-lead { display: grid; gap: 4px; }
.command-eyebrow { color: var(--blue); font: 700 10px/1 var(--font-mono); letter-spacing: .14em; }
.command-lead strong { font-size: 17px; letter-spacing: -.02em; }
.command-lead span:last-child { color: var(--text2); font-size: 12px; }
.command-metrics { display: grid; grid-template-columns: repeat(4, minmax(62px, 1fr)); gap: 8px; }
.command-metric { padding: 8px 10px; border-left: 1px solid var(--border2); display: grid; gap: 2px; }
.command-metric b { color: var(--blue-dark); font-size: 21px; line-height: 1; }
.command-metric b small { margin-left: 3px; font: 650 10px/1 var(--font-ui); color: var(--text2); }
.command-metric span { color: var(--text2); font-size: 11px; white-space: nowrap; }
.command-metric.is-alert b { color: #b5472a; }
.command-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.command-actions .btn { white-space: nowrap; border-radius: 10px; min-height: 34px; }
.command-primary { background: var(--blue-dark); color: #fff; border-color: var(--blue-dark); }
.command-primary:hover { background: var(--blue); }
.cmd-board .cmd-actions .btn.ghost {
  color: rgba(255, 255, 255, .92);
  border-color: rgba(255, 255, 255, .28);
  background: rgba(255, 255, 255, .08);
}
.cmd-board .cmd-actions .btn.ghost:hover {
  color: #fff;
  border-color: rgba(255, 255, 255, .52);
  background: rgba(255, 255, 255, .16);
}
.dc-top { margin-bottom: 16px; }
.dc-slogan { border-radius: 16px; background: linear-gradient(105deg, rgba(10,48,34,.92) 4%, rgba(15,61,44,.7) 48%, rgba(15,61,44,.2) 100%), url("img/farm-real/hero-xinjiang.jpg") center 52% / cover no-repeat; color: #f2fbf3; padding: 18px 22px; box-shadow: 0 12px 30px rgba(15,61,44,.16); }
.dc-slogan .dc-kicker, .dc-slogan p { color: rgba(242,251,243,.72); }
.dc-slogan h3 { font-size: 24px; margin: 5px 0 2px; }
.dc-map, .dc-wx, .wo-list-block, .dc-devs, .dc-bars { border-radius: 16px; box-shadow: 0 5px 18px rgba(20,32,26,.04); }
@media (max-width: 1180px) { .command-strip { grid-template-columns: 1fr; gap: 12px; } .command-actions { justify-content: flex-start; } }
@media (max-width: 1180px) { .runtime-badge { display: none; } }
.week-ops .wo-ask-fab { display: none; }
@media (max-width: 1100px) {
  #sidebar {
    height: 60px;
    min-height: 60px;
    padding: 0 8px;
  }
  .side-head,
  #sidebar .nav-group,
  #sidebar .side-brand { display: none; }
  #nav {
    flex: 0 0 auto;
    min-width: max-content;
    height: 60px;
  }
  #sidebar .mod-head {
    margin: 4px 2px;
    padding: 8px 10px;
  }
}

/* v131 · PC 农事首页重构：决策总览并列、工具栏同轴、任务动作分级。 */
.dc-overview { min-width: 0; }
.wo-task-title { display: none; }

@media (min-width: 1101px) {
  .page-title.is-farm,
  .dash-cockpit {
    width: 100%;
    max-width: none;
    margin-inline: 0;
  }
  .dash-cockpit .dc-secondary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) !important;
    gap: 12px;
    align-items: stretch;
  }
  .dash-cockpit .dc-secondary > .card { height: 100%; }

  .page-title.is-farm { margin-bottom: 10px; }
  .dash-cockpit .dc-overview {
    display: grid;
    grid-template-columns: minmax(300px, .72fr) minmax(0, 1.28fr);
    gap: 10px;
    align-items: stretch;
  }
  .dash-cockpit .dc-overview > .dc-top {
    min-width: 0;
    height: 100%;
    margin: 0;
  }
  .dash-cockpit .dc-overview .dc-slogan,
  .dash-cockpit .dc-overview > .command-strip {
    min-height: 154px;
    height: 100%;
  }
  .dash-cockpit .dc-overview .dc-slogan {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 18px 20px;
    background-position: center 58%;
  }
  .dash-cockpit .dc-overview .dc-slogan h3 {
    margin: 5px 0 2px;
    font-size: 25px;
    letter-spacing: -.025em;
  }
  .dash-cockpit .dc-overview .dc-slogan > p {
    display: -webkit-box;
    overflow: hidden;
    line-height: 1.42;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .dash-cockpit .dc-overview > .command-strip {
    grid-template-columns: minmax(210px, .82fr) minmax(310px, 1.18fr);
    grid-template-areas:
      "lead metrics"
      "actions actions";
    align-content: center;
    gap: 13px 16px;
    margin: 0;
    padding: 16px 18px;
    border-color: color-mix(in srgb, var(--blue) 22%, var(--border));
    background:
      radial-gradient(420px 150px at 100% 0%, color-mix(in srgb, var(--cyan) 11%, transparent), transparent 72%),
      linear-gradient(120deg, color-mix(in srgb, var(--field-a) 70%, #fff), #fff 64%);
  }
  .dash-cockpit .dc-overview > .command-strip.has-conflict {
    border-color: color-mix(in srgb, #c45c26 44%, var(--border));
    background:
      radial-gradient(420px 150px at 100% 0%, color-mix(in srgb, #e8913a 12%, transparent), transparent 72%),
      linear-gradient(120deg, color-mix(in srgb, #fff4e8 74%, var(--card)), var(--card) 64%);
  }
  .dash-cockpit .command-strip.has-conflict .command-eyebrow,
  .dash-cockpit .command-strip.has-conflict .command-metric.is-alert b { color: #a94c22; }
  .dash-cockpit .command-strip.has-conflict .command-primary {
    border-color: #a94c22;
    background: #a94c22;
  }
  .dash-cockpit .dc-overview .command-lead { grid-area: lead; }
  .dash-cockpit .dc-overview .command-lead strong {
    font-size: 18px;
    line-height: 1.35;
  }
  .dash-cockpit .dc-overview .command-metrics {
    grid-area: metrics;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 5px;
  }
  .dash-cockpit .dc-overview .command-metric {
    min-width: 0;
    padding: 8px 9px;
    border: 1px solid color-mix(in srgb, var(--blue) 12%, var(--border));
    border-radius: 10px;
    background: color-mix(in srgb, #fff 88%, var(--field-a));
  }
  .dash-cockpit .dc-overview .command-metric b { font-size: 22px; }
  .dash-cockpit .dc-overview .command-metric span {
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .dash-cockpit .dc-overview .command-actions {
    grid-area: actions;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
    gap: 7px;
    justify-content: stretch;
  }
  .dash-cockpit .dc-overview .command-actions .btn {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    padding-inline: 8px;
    font-size: 13px;
  }

  .dash-cockpit .dc-mid .dc-map-stage {
    height: clamp(300px, 25vw, 420px) !important;
  }

  .dash-cockpit .wo-side {
    position: fixed;
    top: 92px;
    right: 24px;
    z-index: 120;
    width: min(430px, calc(100vw - 328px));
    max-height: calc(100dvh - 116px);
    margin: 0;
    padding: 18px 20px 20px;
    overflow: auto;
    border-radius: 16px;
    background: color-mix(in srgb, var(--card) 97%, #fff4e8);
    box-shadow: 0 24px 64px rgba(24, 40, 31, .24);
  }
  .dash-cockpit .wo-side:focus { outline: 2px solid color-mix(in srgb, var(--orange) 58%, transparent); }
  .dash-cockpit .wo-side-head { margin-bottom: 14px; }
  .dash-cockpit .wo-side-head b { font-size: 20px; }
  .dash-cockpit .wo-side-body p {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 10px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border);
  }
  .dash-cockpit .wo-side-body em { margin: 0; }
  .dash-cockpit .wo-side-opts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .dash-cockpit .wo-side-opts .btn { width: 100%; }

  .dash-cockpit .wo-panel {
    position: fixed;
    top: 92px;
    right: 24px;
    z-index: 121;
    width: min(560px, calc(100vw - 328px));
    max-height: calc(100dvh - 116px);
    margin: 0;
    overflow: auto;
    border-radius: 16px;
    background: color-mix(in srgb, var(--card) 97%, #eefaf5);
    box-shadow: 0 24px 64px rgba(24, 40, 31, .24);
  }
  .dash-cockpit .wo-panel:focus { outline: 2px solid color-mix(in srgb, var(--cyan) 58%, transparent); }
  .dash-cockpit .wo-panel-head { align-items: center; margin-bottom: 14px; }
  .dash-cockpit .wo-panel-head b { font-size: 20px; }
  .dash-cockpit .wo-panel-list { display: flex; flex-direction: column; }
  .dash-cockpit .wo-suggest { align-items: flex-start; }
  .dash-cockpit .wo-suggest > div:first-child { flex: 1 1 260px; min-width: 0; }
  .dash-cockpit .wo-suggest-acts { flex: 0 0 auto; }

  .dash-cockpit .wo-task-hd {
    position: static;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
    min-height: 66px;
    padding: 10px 12px;
    background:
      linear-gradient(90deg, color-mix(in srgb, var(--field-a) 70%, #fff), color-mix(in srgb, var(--card) 96%, var(--field-a)));
    box-shadow: none;
  }
  .dash-cockpit .wo-task-title {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding-right: 12px;
    border-right: 1px solid var(--border);
    line-height: 1.25;
  }
  .dash-cockpit .wo-task-title b {
    overflow: hidden;
    font-size: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dash-cockpit .wo-task-title span {
    display: inline-flex;
    align-items: baseline;
    gap: 3px;
    min-height: 30px;
    padding: 5px 9px;
    border: 1px solid color-mix(in srgb, var(--orange) 20%, var(--border));
    border-radius: 999px;
    background: color-mix(in srgb, var(--orange) 8%, var(--card));
    color: var(--text3);
    font-size: 11px;
    white-space: nowrap;
  }
  .dash-cockpit .wo-task-title span strong {
    color: color-mix(in srgb, var(--orange) 82%, var(--text));
    font-size: 14px;
  }
  .dash-cockpit .wo-task-hd .wo-seg { flex: 0 0 auto; }
  .dash-cockpit .wo-task-hd .wo-task-tools {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: nowrap;
    justify-content: flex-start;
    width: auto;
    min-width: 0;
    gap: 8px;
  }
  .dash-cockpit .wo-task-hd .wo-sort-wrap {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    width: auto;
    height: 44px;
    padding-left: 10px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: color-mix(in srgb, var(--card2) 78%, var(--card));
  }
  .dash-cockpit .wo-task-hd .wo-tool-label {
    color: var(--text3);
    font-size: 12px;
    white-space: nowrap;
  }
  .dash-cockpit .wo-task-hd .wo-find-sort {
    width: auto;
    min-width: 88px;
    height: 42px !important;
    padding-left: 0 !important;
    border: 0 !important;
    background-color: transparent;
  }
  .dash-cockpit .wo-task-hd #woSafetyToggle {
    margin-left: auto !important;
  }

  .dash-cockpit .wq-row.wq-grid {
    min-height: 102px;
    padding-block: 10px;
    scroll-margin-top: 126px;
  }
  .dash-cockpit .wq-table-head {
    position: static;
    background: color-mix(in srgb, var(--card2) 74%, var(--cyan));
    box-shadow: none;
  }
  .dash-cockpit .wq-row:focus-within {
    position: relative;
    z-index: 2;
    outline: 2px solid color-mix(in srgb, var(--cyan) 62%, transparent);
    outline-offset: -2px;
  }
  .dash-cockpit .wq-row.is-located {
    position: relative;
    z-index: 2;
    background: color-mix(in srgb, var(--cyan) 10%, var(--card));
    outline: 3px solid color-mix(in srgb, var(--cyan) 72%, transparent);
    outline-offset: -3px;
  }
  .dash-cockpit .wq-row .wq-tip {
    gap: 2px;
    line-height: 1.35;
  }
  .dash-cockpit .wq-row .wq-tip-text {
    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .dash-cockpit .wq-row .wq-proof {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dash-cockpit .wq-row .wq-ops {
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    min-width: 0;
  }
  .dash-cockpit .wq-row .wq-ops .btn {
    flex: 0 0 auto;
    min-height: 42px;
    height: 42px !important;
    padding-inline: 6px !important;
    font-size: 12px !important;
    white-space: nowrap;
  }
  .dash-cockpit .wq-more {
    position: relative;
    flex: 0 0 auto;
  }
  .dash-cockpit .wq-more > summary {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    list-style: none;
    cursor: pointer;
    white-space: nowrap;
  }
  .dash-cockpit .wq-more > summary::-webkit-details-marker { display: none; }
  .dash-cockpit .wq-more > summary::after {
    content: "⌄";
    margin-left: 4px;
    color: var(--text3);
  }
  .dash-cockpit .wq-more[open] > summary::after { content: "⌃"; }
  .dash-cockpit .wq-more-list { display: none; }
  .dash-cockpit .wq-more[open] > .wq-more-list {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 20;
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
    min-width: 138px;
    padding: 8px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--card);
    box-shadow: 0 14px 34px rgba(20, 46, 31, .16);
  }
  .dash-cockpit .wq-more-list .btn { width: 100%; }
}
@media (max-width: 720px) { #main { padding: 16px 14px 28px; } .farm-select { display: none; } #g-search { display: none; } .command-metrics { grid-template-columns: repeat(2, 1fr); } .command-metric { border-left: 0; border-top: 1px solid var(--border2); } }

/* v97 · 全球农场运营范式：数据可信、标准闭环、可追溯导出 */
.ops-trust-bar {
  display: grid;
  grid-template-columns: auto repeat(4, minmax(0, 1fr));
  align-items: center;
  gap: 0;
  min-height: 42px;
  margin: -6px 0 16px;
  padding: 0 12px;
  border: 1px solid color-mix(in srgb, var(--blue) 18%, var(--border));
  border-radius: 12px;
  background: color-mix(in srgb, var(--card) 92%, var(--field-a));
  box-shadow: 0 4px 14px rgba(20, 46, 31, .035);
  overflow: hidden;
}
.ops-trust-bar > span {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 7px;
  padding: 7px 12px;
  border-left: 1px solid var(--border);
  white-space: nowrap;
}
.ops-trust-bar .ops-trust-title {
  border-left: 0;
  padding-left: 2px;
  padding-right: 16px;
  color: var(--blue-dark);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
}
.ops-trust-bar em {
  color: var(--text3);
  font-size: 10px;
  font-style: normal;
}
.ops-trust-bar b {
  min-width: 0;
  overflow: hidden;
  color: var(--text2);
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
}

.ops-playbook {
  display: grid;
  grid-template-columns: auto minmax(440px, 1fr) auto;
  align-items: center;
  gap: 16px;
  margin: 0 0 16px;
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: linear-gradient(100deg, color-mix(in srgb, var(--card2) 55%, var(--card)), var(--card));
}
.ops-playbook > b {
  color: var(--blue-dark);
  font-size: 12px;
  white-space: nowrap;
}
.ops-playbook-steps {
  display: grid;
  grid-template-columns: repeat(5, minmax(86px, 1fr));
  align-items: center;
}
.ops-step {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 30px;
  padding: 4px 10px;
  border: 0;
  background: transparent;
  color: var(--text3);
  font: inherit;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.ops-step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -8px;
  width: 16px;
  height: 1px;
  background: var(--border2);
}
.ops-step i {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  border: 1px solid var(--border2);
  border-radius: 50%;
  background: var(--card);
  color: var(--text3);
  font: 700 10px/1 var(--font-mono);
  font-style: normal;
}
.ops-step:hover { color: var(--blue); }
.ops-step:hover i { border-color: var(--blue); }
.ops-step.is-locked {
  opacity: .42;
  cursor: not-allowed;
  filter: grayscale(.6);
}
.ops-step.is-locked:hover { color: var(--text3); }
.ops-step.is-locked:hover i { border-color: var(--border2); }
.ops-step.is-done { color: var(--blue); }
.ops-step.is-done i { border-color: color-mix(in srgb, var(--blue) 30%, transparent); background: color-mix(in srgb, var(--blue) 12%, var(--card)); color: var(--blue); }
.ops-step.is-active { color: var(--blue-dark); }
.ops-step.is-active i { border-color: var(--blue); background: var(--blue); color: #fff; box-shadow: 0 0 0 4px color-mix(in srgb, var(--blue) 13%, transparent); }
.ops-playbook-note { color: var(--text3); font-size: 10px; white-space: nowrap; }

.role-readonly {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, var(--amber) 26%, var(--border));
  border-radius: 9px;
  background: color-mix(in srgb, var(--amber) 7%, var(--card));
  color: var(--text2);
  font-size: 11px;
  font-weight: 700;
}
.role-readonly i {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: var(--amber);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--amber) 12%, transparent);
}
.status-strip > .role-readonly:first-of-type { margin-left: auto; }
.pg-toolbar > .role-readonly:first-of-type { margin-right: auto; }

.wall-sync-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid rgba(63, 185, 116, .26);
  border-radius: 999px;
  background: rgba(29, 107, 65, .12);
  color: #9edfb8;
  font-size: 10px;
  white-space: nowrap;
}
.wall-sync-pill i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4ade80;
  box-shadow: 0 0 10px rgba(74, 222, 128, .75);
}
.wall-sync-pill b { color: #d7fbe4; font-size: 10px; }
.wall-top-r { min-width: 0; }
.wall-top-r .btn { flex: 0 0 auto; min-width: 58px; white-space: nowrap; }
.wall-top .btn.ghost { color: #cdebd8; border-color: rgba(143, 212, 168, .28); background: rgba(143, 212, 168, .07); }
.wall-top .btn.ghost:hover { color: #fff; border-color: rgba(143, 212, 168, .55); background: rgba(143, 212, 168, .14); }
.wall-weather { min-width: 0; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 1360px) {
  .wall-top { grid-template-columns: minmax(210px, 1fr) auto minmax(390px, 1fr); padding-inline: 12px; }
  .wall-top-l, .wall-top-r { gap: 6px; }
  .wall-brand-mini, .wall-date { display: none; }
  .wall-weather { max-width: 128px; }
  .wall-top h1 { font-size: 20px; }
  .wall-clock { font-size: 18px; }
}
@media (max-width: 1080px) {
  .wall-top { grid-template-columns: minmax(160px, 1fr) auto minmax(250px, 1fr); }
  .wall-weather { display: none; }
  .wall-sync-pill { padding-inline: 7px; }
}

@media (max-width: 1180px) {
  .ops-trust-bar { grid-template-columns: auto repeat(2, minmax(0, 1fr)); }
  .ops-trust-bar > span:nth-child(4) { border-left: 0; }
  .ops-playbook { grid-template-columns: 1fr; gap: 8px; }
  .ops-playbook-note { display: none; }
}
@media (max-width: 760px) {
  .ops-trust-bar { grid-template-columns: 1fr 1fr; padding: 4px 8px; }
  .ops-trust-bar .ops-trust-title { grid-column: 1 / -1; }
  .ops-trust-bar > span { border-left: 0; border-top: 1px solid var(--border); padding: 6px; }
  .ops-playbook { overflow-x: auto; }
  .ops-playbook-steps { min-width: 560px; }
}

/* v101 · 可访问导航、移动端可达性与安全场景模式 */
:root[data-theme="light"] {
  --text3: #647866;
  --green: #24713d;
  --orange: #a65309;
  --red: #b3261e;
}
:root[data-theme="dark"] {
  --text2: #b4c0cf;
  --text3: #8d9bb0;
}
h1, h2, .disp, .page-title h1, .page-title h2, .brand { font-family: var(--font-display); }
.page-title h1 { margin: 0; font-size: 28px; font-weight: 700; line-height: 1.2; letter-spacing: -.03em; }
.page-title h1:focus { outline: none; }
.mod-head {
  width: calc(100% - 20px);
  background: transparent;
  font: inherit;
  text-align: left;
}
button:focus-visible,
a:focus-visible,
select:focus-visible,
input:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--blue) 72%, #fff);
  outline-offset: 2px;
}
#g-search { font-family: var(--font-ui); text-align: left; }
.item.warn { border-color: color-mix(in srgb, var(--orange) 36%, var(--border)); background: color-mix(in srgb, var(--orange) 7%, var(--card)); }
.pg-table-wrap { max-width: 100%; overscroll-behavior-inline: contain; }
.n-item { display: block; width: 100%; border: 0; background: transparent; color: var(--text); font: inherit; text-align: left; }
.wq-proof { display: block; margin-top: 3px; color: var(--text3); font-size: 10px; white-space: normal; }
.wq-proof-detail { margin-top: 3px; color: var(--text2); font-size: 10px; }
.wq-proof-detail summary { width: fit-content; color: var(--blue-dark); cursor: pointer; font-weight: 700; }
.dash-cockpit .wq-proof-detail summary {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding-block: 4px;
}
.wq-proof-detail span { display: block; margin-top: 3px; white-space: normal; line-height: 1.45; }
.page-shell, .panel, .card, .pg-split, .pg-grid, .dc-grid, .dc-mid, .dc-secondary { min-width: 0; }

@media (max-width: 1366px) {
  .wall-body {
    grid-template-columns: minmax(220px, .72fr) minmax(0, 1.5fr);
    overflow: auto;
    padding-bottom: 14px;
  }
  .wall-body > .wall-col:last-child { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wall-gov-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .wall-panel { font-size: 14px; }
}

@media (max-width: 760px) {
  #topbar {
    height: 104px;
    min-height: 104px;
    display: grid;
    grid-template-columns: minmax(84px, 1fr) 36px 36px 36px 82px;
    grid-template-rows: 48px 44px;
    gap: 4px;
    padding: 4px 8px;
  }
  #topbar .logo { grid-column: 1; grid-row: 1; min-width: 0; overflow: hidden; }
  #topbar .logo-text { min-width: 0; }
  #topbar .logo-text strong { overflow: hidden; text-overflow: ellipsis; }
  #topbar .logo-text em,
  #topbar .sp,
  #topbar .runtime-badge,
  #topbar .tb-weather,
  #topbar .tb-clock,
  #topbar .wall-btn { display: none !important; }
  #refresh-page { grid-column: 2; grid-row: 1; }
  #theme-toggle { grid-column: 3; grid-row: 1; }
  #notif-btn { grid-column: 4; grid-row: 1; }
  #topbar .user-role {
    grid-column: 5;
    grid-row: 1;
    min-width: 0;
    width: 82px;
    max-width: 82px;
    padding: 0;
    border: 0;
    background: transparent;
  }
  #topbar .user-role .avatar,
  #topbar .user-role-meta { display: none; }
  #topbar #roleSelect { display: block; width: 82px; min-width: 82px; max-width: 82px; height: 40px; flex-basis: 82px; padding-inline: 4px; font-size: 12px; }
  .farm-select {
    display: block !important;
    grid-column: 1 / 3;
    grid-row: 2;
    width: 100%;
    max-width: none;
    min-width: 0;
    height: 40px;
    flex-basis: auto;
  }
  #g-search {
    display: flex !important;
    grid-column: 3 / 6;
    grid-row: 2;
    width: 100%;
    max-width: none;
    height: 40px;
  }
  #g-search kbd { display: none; }
  #g-search > span { min-width: 0; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
  #g-search > span::after { content: none; }
  #layout { height: calc(100dvh - 104px); max-width: 100vw; overflow: hidden; }
  #sidebar { height: 54px; min-height: 54px; max-width: 100vw; padding: 0 6px; scroll-padding-inline: 12px; }
  #nav { height: 54px; max-width: none; min-width: max-content; }
  #sidebar .mod-head { width: auto; min-height: 44px; margin: 4px 2px; padding: 8px 11px; }
  #main { width: 100%; max-width: 100vw; padding: 12px 10px 28px; overflow-x: hidden; }
  .page-title { min-width: 0; flex-wrap: wrap; gap: 4px 8px; }
  .page-title h1 { max-width: 100%; font-size: 22px; }
  .page-title .sub-t { max-width: 100%; white-space: normal; }
  .ops-playbook { overflow: visible; padding: 10px; }
  .ops-playbook-steps { min-width: 0; grid-template-columns: 1fr; gap: 4px; }
  .ops-step { justify-content: flex-start; min-height: 40px; }
  .ops-step:not(:last-child)::after { top: auto; right: auto; bottom: -4px; left: 20px; width: 1px; height: 8px; }
  .pg-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .page-shell .pg-table-wrap .table { min-width: 620px; }
  .form-row, .pg-toolbar { max-width: 100%; }
  .form-row > *, .pg-toolbar > * { min-width: 0; }
  .btn, .icon-btn, button, select, input { min-height: 40px; }
  input[type="checkbox"], .land-pick { min-width: 24px; width: 24px; min-height: 24px; height: 24px; }
  #notif-panel { position: fixed; top: 52px; right: 10px; left: 10px; width: auto; max-height: calc(100dvh - 64px); overflow: auto; }
  #cmd-panel .cmd-box { width: calc(100vw - 20px); max-width: none; margin-inline: 10px; }
  #toast-wrap { left: 10px; right: 10px; bottom: max(12px, env(safe-area-inset-bottom)); }
  .toast { width: 100%; }
}

@media (max-width: 720px) {
  .wall-screen { overflow: auto; }
  .wall-top { position: sticky; top: 0; z-index: 3; grid-template-columns: 1fr auto; min-height: 56px; }
  .wall-top h1 { grid-column: 1; text-align: left; font-size: 17px; letter-spacing: .05em; }
  .wall-top-l { display: none; }
  .wall-top-r { grid-column: 2; }
  .wall-body { display: flex; flex-direction: column; overflow: visible; min-height: auto; }
  .wall-body > .wall-col:last-child { display: flex; }
  .wall-gov-strip, .wall-status-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* v102 final cascade: continuous topbar behavior from tablet to desktop. */
@media (min-width: 761px) and (max-width: 1450px) {
  #topbar .tb-weather,
  #topbar .tb-clock { display: none; }
  #g-search {
    display: flex;
    flex: 1 1 190px;
    min-width: 156px;
    max-width: 260px;
  }
  .farm-select { flex: 0 1 180px; min-width: 132px; }
  #topbar .sp { flex: 1 1 4px; min-width: 0; }
}

@media (min-width: 761px) and (max-width: 1100px) {
  #g-search { display: flex; }
  #topbar .wall-btn { display: none; }
  #topbar .user-role { min-width: 176px; }
}

@media (min-width: 761px) and (max-width: 900px) {
  #topbar { gap: 6px; padding-inline: 10px; }
  #topbar .logo-text em,
  #topbar .user-role .avatar,
  #topbar .user-role-meta { display: none; }
  #topbar .logo { min-width: 122px; }
  .farm-select { flex-basis: 142px; max-width: 142px; min-width: 116px; }
  #g-search { min-width: 132px; }
  #topbar .user-role { min-width: 88px; width: 88px; padding: 0; border: 0; background: transparent; }
}

@media (max-width: 340px) {
  #topbar .logo .mark { display: none; }
  #topbar .logo { min-width: 0; }
  #topbar .logo-text strong { font-size: 12px; letter-spacing: -.03em; }
}

/* 320px-class phones: keep weather evidence inside the card instead of
   clipping the second column behind #main's deliberate overflow guard. */
@media (max-width: 360px) {
  .dc-wx-grid { grid-template-columns: 1fr; }
  .dc-wx-item { grid-template-columns: minmax(0, 1fr) 64px; min-width: 0; }
  .dc-wx-item .dc-spark { width: 64px; max-width: 100%; }
  .dc-slogan-foot .btn { margin-left: 0; }
}

@media (max-width: 480px) {
  .page-title.is-farm .sub-t {
    flex: 1 0 100%;
    max-width: 100%;
    margin-top: -2px;
  }
  .wo-toast { flex-wrap: wrap; padding: 8px; }
  .wo-toast-msg { flex: 1 1 calc(100% - 30px); }
  .wo-toast-acts { width: calc(100% - 26px); margin-left: 26px; justify-content: flex-start; }
  .dc-kicker { font-size: 10px; letter-spacing: .08em; }
  .ops-trust-bar > span {
    display: grid;
    align-items: start;
    gap: 2px;
    white-space: normal;
  }
  .ops-trust-bar b {
    overflow: visible;
    white-space: normal;
    text-overflow: clip;
    line-height: 1.35;
  }
}

/* Compact task rows must switch away from the six-column desktop table while
   the app is using its tablet navigation. The earlier generic rule was being
   overridden by the later compact-table declaration between 721–1100px. */
@media (min-width: 721px) and (max-width: 1100px) {
  .week-ops.is-compact .wq-grid.wq-table-head { display: none; }
  .week-ops.is-compact .wq-row.wq-grid {
    grid-template-columns: 24px minmax(0, 1fr) auto;
    grid-template-rows: auto auto auto;
    gap: 4px 6px;
    padding: 8px 10px;
  }
  .week-ops.is-compact .wq-row.wq-grid .wq-main { grid-column: 2; }
  .week-ops.is-compact .wq-row.wq-grid .wq-day { grid-column: 2; flex-direction: row; gap: 6px; align-items: baseline; }
  .week-ops.is-compact .wq-row.wq-grid .wq-st { grid-column: 3; grid-row: 1; justify-content: flex-end; }
  .week-ops.is-compact .wq-row.wq-grid .wq-tip { grid-column: 2 / -1; min-width: 0; }
  .week-ops.is-compact .wq-row.wq-grid .wq-ops { grid-column: 2 / -1; min-width: 0; justify-content: flex-start; }
}

/* v108 · 首页待办工具栏：统一基线、触控高度与手机端两列节奏。 */
.wo-task-hd {
  --task-control-h: 36px;
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: center;
  column-gap: 12px;
  row-gap: 8px;
}
.wo-task-hd .wo-seg {
  min-height: var(--task-control-h);
  padding: 3px;
}
.wo-task-hd .wo-seg-btn,
.wo-task-hd .wo-date,
.wo-task-hd .wo-date-btn,
.wo-task-hd .wo-date-label,
.wo-task-hd .wo-find-sort,
.wo-task-hd .wo-prio-btn,
.wo-task-hd #woSafetyToggle {
  box-sizing: border-box;
  height: var(--task-control-h) !important;
  min-height: var(--task-control-h) !important;
  margin: 0 !important;
}
.wo-task-hd .wo-seg-btn { height: calc(var(--task-control-h) - 6px) !important; min-height: calc(var(--task-control-h) - 6px) !important; }
.wo-task-hd .wo-task-tools {
  display: grid;
  grid-template-columns: max-content minmax(104px, max-content) max-content max-content;
  justify-content: end;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  margin-left: 0;
}
.wo-task-hd .wo-sort-wrap,
.wo-task-hd .wo-find-sort { width: 100%; min-width: 0; }
.wo-task-hd .wo-date-label { min-width: 76px; }
.wo-task-hd .wo-seg-btn span,
.wo-task-hd .wo-seg-btn em { white-space: nowrap; }
.wo-task-hd .wo-prio-btn,
.wo-task-hd #woSafetyToggle { justify-content: center; white-space: nowrap; }

@media (max-width: 520px) {
  .wo-task-hd { grid-template-columns: 1fr; }
  .wo-task-hd .wo-seg { justify-self: start; }
  .wo-task-hd .wo-task-tools {
    grid-template-columns: max-content minmax(108px, 1fr) max-content max-content;
    justify-content: stretch;
  }
}

@media (max-width: 520px) {
  .wo-task-hd { padding: 10px !important; }
  .wo-task-hd .wo-seg {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(84px, 1fr));
    width: 100%;
  }
  .wo-task-hd .wo-seg-btn { width: 100%; justify-content: center; }
  .wo-task-hd .wo-task-tools {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .wo-task-hd .wo-date { width: 100%; }
  .wo-task-hd .wo-date-btn { width: 34px; flex: 0 0 34px; }
  .wo-task-hd .wo-date-label { flex: 1 1 auto; min-width: 0; max-width: none; }
  .wo-task-hd .wo-prio-btn,
  .wo-task-hd #woSafetyToggle { width: 100%; }
}

/* v109 · 100% 缩放可达性：窄屏导航完整换行，不再依赖横向滚动或缩小页面。 */
@media (min-width: 761px) and (max-width: 1100px) {
  #sidebar {
    height: auto;
    min-height: 52px;
    max-height: none;
    padding: 4px 8px;
    overflow: hidden;
  }
  #nav {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(76px, 1fr));
    align-items: stretch;
    gap: 2px;
    width: 100%;
    height: auto;
    min-width: 0;
  }
  #sidebar .mod-head,
  #layout.is-side-collapsed #sidebar .mod-head {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    margin: 0;
    padding: 7px 6px;
    justify-content: center;
    gap: 5px;
    border-radius: 9px;
  }
  #sidebar .mod-name,
  #layout.is-side-collapsed #sidebar .mod-name {
    display: block;
    min-width: 0;
    overflow: hidden;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #sidebar .mod-ico,
  #layout.is-side-collapsed #sidebar .mod-ico {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    font-size: 11px;
  }
}

@media (max-width: 760px) {
  #sidebar {
    height: auto;
    min-height: 100px;
    max-height: none;
    padding: 5px 6px;
    overflow: hidden;
  }
  #nav {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: stretch;
    gap: 2px;
    width: 100%;
    height: auto;
    min-width: 0;
  }
  #sidebar .mod-head,
  #layout.is-side-collapsed #sidebar .mod-head {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    margin: 0;
    padding: 4px 2px;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    border-radius: 8px;
  }
  #sidebar .mod-name,
  #layout.is-side-collapsed #sidebar .mod-name {
    display: block;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    font-size: 10px;
    line-height: 1.2;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #sidebar .mod-ico,
  #layout.is-side-collapsed #sidebar .mod-ico {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    font-size: 10px;
  }
}

/* Segmented control shell matches every neighbouring 36px toolbar control. */
.wo-task-hd .wo-seg {
  box-sizing: border-box;
  height: var(--task-control-h);
}

/* v110 · 专家签核与停机复核共用证据门禁。 */
.evidence-dialog {
  width: min(620px, calc(100vw - 28px));
  max-height: min(760px, calc(100dvh - 28px));
  margin: auto;
  padding: 0;
  overflow: auto;
  color: var(--text);
  background: var(--card);
  border: 1px solid color-mix(in srgb, var(--blue) 24%, var(--border));
  border-radius: 18px;
  box-shadow: 0 24px 80px rgba(12, 34, 24, .26);
}
.evidence-dialog::backdrop {
  background: rgba(10, 24, 17, .48);
  backdrop-filter: blur(4px);
}
.evidence-dialog form { padding: 22px; }
.evidence-dialog-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 6px;
}
.evidence-dialog-head h2 { margin: 2px 0 0; font-size: 21px; }
.evidence-kicker { color: var(--blue); font: 700 10px/1 var(--font-mono); letter-spacing: .12em; }
.evidence-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }
.evidence-field { min-width: 0; display: grid; align-content: start; gap: 5px; }
.evidence-field.is-wide { grid-column: 1 / -1; }
.evidence-field > span { color: var(--text2); font-size: 12px; font-weight: 700; }
.evidence-field input,
.evidence-field select,
.evidence-field textarea {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 9px 11px;
  color: var(--text);
  background: var(--card);
  border: 1px solid var(--border2);
  border-radius: 10px;
  font: inherit;
}
.evidence-field textarea { min-height: 78px; resize: vertical; }
.evidence-check {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: start;
  gap: 9px;
  min-height: 38px;
  padding: 9px 10px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--card2);
  color: var(--text2);
  font-size: 12px;
}
.evidence-check input { width: 20px; height: 20px; margin: 0; }
.evidence-error { min-height: 20px; margin-top: 10px; color: var(--red); font-size: 12px; }
.evidence-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
@media (max-width: 520px) {
  .evidence-dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); border-radius: 14px; }
  .evidence-dialog form { padding: 16px; }
  .evidence-fields { grid-template-columns: 1fr; }
  .evidence-field.is-wide { grid-column: auto; }
  .evidence-dialog-actions .btn { flex: 1; }
}

/* v112 · 150% 舒适密度。组件级放大并重新排版，保持真实视口与滚动边界。 */
body {
  zoom: 1;
  font-size: 17px;
  line-height: 1.55;
}
#topbar {
  height: 72px;
  min-height: 72px;
  gap: 12px;
  padding: 0 22px;
}
#topbar .logo { gap: 12px; }
#topbar .logo .mark { width: 42px; height: 42px; border-radius: 12px; font-size: 16px; }
#topbar .logo-text strong { font-size: 18px; }
#topbar .logo-text em { font-size: 12px; }
.farm-select,
#g-search,
#topbar .wall-btn,
#topbar .icon-btn { height: 44px; min-height: 44px; }
#topbar .icon-btn { width: 44px; }
.farm-select,
#g-search,
#roleSelect { font-size: 14px; }
#topbar .user-role { min-height: 48px; }
#roleSelect { height: 36px; }
#layout { height: calc(100dvh - 72px); }
#sidebar { width: 280px; padding: 15px 14px 20px; }
.side-head { min-height: 46px; }
.side-overview { height: 46px; }
.side-overview-copy strong { font-size: 13px; }
.side-overview-copy small { font-size: 11px; }
.nav-group { padding: 18px 12px 7px; font-size: 13px; }
.nav-group small { font-size: 11px; }
.mod-head { min-height: 46px; padding: 11px 13px; font-size: 15px; }
.mod-ico { width: 27px; height: 27px; font-size: 14px; }
#main { padding: 21px 27px 48px; }
.page-title { margin-bottom: 18px; }
.page-title h1 { font-size: 34px; line-height: 1.22; }
.page-title .sub-t,
.sub,
.status-text,
.t-sub { font-size: 14px; line-height: 1.55; }
.btn,
button,
select,
input,
textarea { font-size: 14px; }
.btn { min-height: 42px; padding-inline: 16px; }
.card { padding: 18px 20px; }
.panel.pg-card { padding: 20px; }
.pg-card-hd h2 { font-size: 19px; }
.status-strip { min-height: 50px; gap: 9px; }
.chip,
.tag { font-size: 12px; }
.pg-kpi strong { font-size: 28px; }
.wo-task-hd { --task-control-h: 44px; column-gap: 14px; row-gap: 10px; }
.wo-task-hd .wo-date-label { min-width: 92px; }
.wo-task-hd .wo-task-tools { gap: 10px; }
.wo-task-hd .wo-seg-btn { font-size: 14px; }

@media (min-width: 761px) and (max-width: 1100px) {
  #layout { height: calc(100dvh - 72px); }
  #topbar .wall-btn {
    display: inline-flex;
    flex: 0 0 48px;
    width: 48px;
    min-width: 48px;
    padding: 0;
    overflow: hidden;
    font-size: 0;
  }
  #topbar .wall-btn::after { content: attr(data-short); display: inline; font-size: 12px; }
  #sidebar { width: 100%; max-width: 100vw; min-height: 62px; padding: 5px 8px; }
  #nav { grid-template-columns: repeat(auto-fit, minmax(88px, 1fr)); gap: 3px; }
  #sidebar .mod-head,
  #layout.is-side-collapsed #sidebar .mod-head { min-height: 50px; padding: 8px 4px; gap: 3px; }
  #sidebar .mod-name,
  #layout.is-side-collapsed #sidebar .mod-name { font-size: 13px; }
  #sidebar .mod-ico,
  #layout.is-side-collapsed #sidebar .mod-ico { width: 20px; height: 20px; flex-basis: 20px; font-size: 11px; }
}

@media (min-width: 761px) and (max-width: 900px) {
  #topbar { gap: 6px; padding-inline: 10px; }
}

@media (max-width: 900px) {
  .wo-task-hd { grid-template-columns: 1fr; }
  .wo-task-hd .wo-seg { justify-self: start; }
  .wo-task-hd .wo-task-tools { justify-content: stretch; grid-template-columns: max-content minmax(130px, 1fr) max-content max-content; }
}

@media (max-width: 760px) {
  #topbar {
    height: 120px;
    min-height: 120px;
    grid-template-columns: minmax(70px, 1fr) 44px 44px 44px 82px;
    grid-template-rows: 54px 50px;
    gap: 4px;
    padding: 8px;
  }
  #topbar .logo .mark { width: 38px; height: 38px; }
  #topbar .logo-text strong { font-size: 16px; }
  #topbar #roleSelect { height: 44px; }
  #topbar .user-role,
  #topbar #roleSelect {
    width: 82px;
    min-width: 82px;
    max-width: 82px;
  }
  .farm-select,
  #g-search { height: 44px; }
  #layout { height: calc(100dvh - 120px); }
  #sidebar { width: 100%; max-width: 100vw; min-height: 116px; padding: 6px; }
  #nav { gap: 3px; }
  #sidebar .mod-head,
  #layout.is-side-collapsed #sidebar .mod-head { min-height: 50px; padding: 5px 2px; }
  #sidebar .mod-name,
  #layout.is-side-collapsed #sidebar .mod-name { font-size: 12px; }
  #sidebar .mod-ico,
  #layout.is-side-collapsed #sidebar .mod-ico { width: 21px; height: 21px; flex-basis: 21px; font-size: 11px; }
  #main { padding: 17px 14px 38px; }
  .page-title h1 { font-size: 30px; }
  .panel.pg-card { padding: 17px; }
}

@media (max-width: 340px) {
  #topbar .logo-text strong { font-size: 11px; }
}

@media (max-width: 520px) {
  .wo-task-hd .wo-task-tools { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wo-task-hd .wo-seg { justify-self: stretch; }
}

/* v114 · 大屏短视口重排：三栏不跨行叠压，窄屏改为连续纵向阅读。 */
.wall-screen .twin-base-btn {
  min-height: 32px;
  padding: 6px 12px;
  font-size: 12px;
}
.wall-panel.grow { overflow-y: auto; }

@media (min-width: 1101px) and (max-width: 1366px) {
  .wall-body,
  .wall-body-farm,
  .wall-body-gov {
    grid-template-columns: minmax(220px, .62fr) minmax(480px, 1.4fr) minmax(220px, .62fr);
    overflow: hidden;
  }
  .wall-body > .wall-col:last-child {
    grid-column: auto;
    display: flex;
  }
}

@media (min-width: 1101px) and (max-height: 800px) {
  .wall-body { min-height: 0; }
  .wall-map-stage { min-height: 140px; }
  .wall-cam .cam-view { height: 44px; }
  .wall-cam .cam-label { padding: 3px 6px; }
  .wall-cam .cam-label span { display: none; }
  .wall-audit-list { max-height: 106px; }
  .wall-rx-list { max-height: 94px; overflow-y: auto; }
  .wall-role-gov .wall-body > .wall-col:last-child > .wall-panel:last-child {
    max-height: 145px;
    overflow-y: auto;
  }
  .wall-panel { padding: 8px 10px; }
  .wall-hd { margin-bottom: 6px; }
  .wall-status-strip { gap: 6px; margin-top: 6px; }
  .wall-status-item { padding: 5px 8px; }
  .wall-status-item .wall-status-label,
  .wall-status-item > span:first-child { margin-bottom: 2px; line-height: 1.2; }
  .wall-status-item b { font-size: 20px; line-height: 1.1; }
  .wall-status-item .wall-status-note,
  .wall-status-item em { margin-top: 2px; line-height: 1.2; }
  .wall-ai-bar { gap: 6px; margin-top: 5px; padding: 0 12px 4px; }
  .wall-ai-item { gap: 1px; padding: 5px 8px; }
  .wall-ai-item b { font-size: 16px; line-height: 1.15; }
  .wall-ai-timeline { gap: 4px; padding: 5px 8px; }
  .wall-ai-tl { gap: 1px; padding-left: 6px; font-size: 10px; }
  .wall-screen > .wall-mon-note {
    margin: 4px 14px 0 !important;
    padding: 6px 10px;
  }
  .wall-screen > .wall-mon-note p {
    margin: 2px 0 0;
    overflow: hidden;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media (min-width: 721px) and (max-width: 1100px) {
  .wall-screen { overflow-y: auto; }
  .wall-body,
  .wall-body-farm,
  .wall-body-gov {
    display: flex;
    flex: none;
    flex-direction: column;
    min-height: auto;
    overflow: visible;
  }
  .wall-body > .wall-col:last-child { display: flex; }
  .wall-center { min-height: 500px; }
  .wall-map-stage { min-height: 330px; }
}

/* v115 · 首页田块与资料影像使用同一坐标系，避免 cover 裁切造成边界偏移。 */
.dc-map-stage.is-sat {
  background: #14261b;
}
.dc-map-photo {
  opacity: .34;
  filter: saturate(.58) brightness(1.16) contrast(.88);
  transition: opacity .2s ease, filter .2s ease;
  pointer-events: none;
}
.dc-map-stage.is-sat .dc-map-photo {
  opacity: 1;
  filter: saturate(1.02) brightness(.96) contrast(1.05);
}
.dc-map-stage.is-sat .dc-map-base { opacity: 0; }
.dc-map-svg .dc-plot-code {
  font-size: 44px;
  font-weight: 800;
  paint-order: stroke;
  stroke: rgba(255,255,255,.86);
  stroke-width: 8px;
  stroke-linejoin: round;
}
.dc-map-svg .dc-plot-sub {
  font-size: 32px;
  font-weight: 700;
  paint-order: stroke;
  stroke: rgba(255,255,255,.9);
  stroke-width: 7px;
  stroke-linejoin: round;
}
.dc-map-stage.is-sat .dc-plot text {
  stroke: rgba(8,34,23,.86);
  stroke-width: 9px;
}
.dc-plot:focus-visible { outline: none; }
.dc-plot:focus-visible polygon,
.dc-plot.is-selected polygon {
  stroke: #175cd3 !important;
  stroke-width: 4px !important;
  filter: brightness(1.08) drop-shadow(0 0 5px rgba(23,92,211,.55));
}
.dc-map-registration {
  position: absolute;
  right: 50px;
  bottom: 10px;
  z-index: 2;
  max-width: calc(100% - 260px);
  padding: 6px 10px;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 999px;
  background: rgba(15,61,44,.84);
  color: #f2fbf3;
  box-shadow: 0 5px 14px rgba(8,34,23,.16);
  font-size: 11px;
  line-height: 1.2;
  white-space: nowrap;
  pointer-events: none;
}
@media (max-width: 640px) {
  .dc-map-registration { display: none; }
}

/* v116 · 首页待办工具条：同一基线、紧凑连续排列，小屏再有序换行。 */
@media (min-width: 641px) {
  .wo-task-hd {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
  }
  .wo-task-hd .wo-seg {
    flex: 0 0 auto;
    justify-self: auto;
  }
  .wo-task-hd .wo-task-tools {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: auto;
    min-width: 0;
    gap: 10px;
    margin: 0;
  }
  .wo-task-hd .wo-sort-wrap,
  .wo-task-hd .wo-find-sort { width: auto; }
}
@media (max-width: 640px) {
  .wo-task-hd {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .wo-task-hd .wo-seg {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }
  .wo-task-hd .wo-task-tools {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 8px;
  }
  .wo-task-hd .wo-date {
    grid-column: 1 / -1;
    width: 100%;
  }
  .wo-task-hd .wo-sort-wrap,
  .wo-task-hd .wo-find-sort,
  .wo-task-hd .wo-prio-btn,
  .wo-task-hd #woSafetyToggle { width: 100%; }
  .wo-task-hd #woSafetyToggle { grid-column: 1 / -1; }

  .dc-map-stage { height: 220px !important; }
  .dc-map-status {
    left: 8px;
    right: 46px;
    top: 8px;
    width: auto;
    padding: 6px 7px;
    border-radius: 9px;
  }
  .dc-map-status b { display: none; }
  .dc-map-status ul {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 3px;
  }
  .dc-map-status li {
    display: grid;
    justify-items: center;
    gap: 0;
    min-width: 0;
    font-size: 9px;
    line-height: 1.15;
    text-align: center;
  }
  .dc-map-status li span { white-space: nowrap; transform: scale(.92); }
  .dc-map-status em { font-size: 10px; }
  .dc-map-svg .dc-plot-code { font-size: 58px; }
  .dc-map-svg .dc-plot-sub { font-size: 42px; }
  .dc-map-legend {
    left: 7px;
    right: 7px;
    bottom: 7px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 3px;
    padding: 5px 7px;
    border-radius: 9px;
    font-size: 9px;
    text-align: center;
  }
  .dc-map-legend span { white-space: nowrap; }
  .dc-map-legend i { width: 6px; height: 6px; margin-right: 2px; }
}

/* v118 · 大屏正射图同坐标配准 + 监控画面放大回放器。 */
.wall-map-photo {
  pointer-events: none;
  filter: saturate(.98) brightness(.96) contrast(1.06);
}
.wall-map-photo-veil {
  fill: rgba(4, 18, 12, .14);
  pointer-events: none;
}
.wall-map-stage.scene-field .wall-map-photo {
  filter: saturate(.5) brightness(1.12) contrast(.92);
}
.wall-map-stage.scene-field .wall-map-photo-veil { fill: rgba(225, 241, 224, .18); }
.wall-map-stage.scene-aerial .wall-map-photo {
  filter: saturate(.8) brightness(.93) contrast(1.16);
}
.wall-map-stage.scene-growth .wall-map-photo {
  filter: saturate(1.65) hue-rotate(18deg) brightness(.9) contrast(1.12);
}
.wall-map-stage.scene-growth .wall-map-photo-veil { fill: rgba(22, 115, 62, .12); }
.wall-field .wall-plot-code {
  font-size: 44px;
  font-weight: 800;
  paint-order: stroke;
  stroke: rgba(5, 25, 16, .88);
  stroke-width: 9px;
  stroke-linejoin: round;
}
.wall-field .wall-plot-metric {
  font-size: 32px;
  font-weight: 750;
  paint-order: stroke;
  stroke: rgba(5, 25, 16, .88);
  stroke-width: 8px;
  stroke-linejoin: round;
}
.wall-field .wall-dev-lab {
  font-size: 28px;
  paint-order: stroke;
  stroke: rgba(5, 25, 16, .88);
  stroke-width: 6px;
}
.wall-plot:focus-visible { outline: none; }
.wall-plot:focus-visible polygon {
  stroke: #fff !important;
  stroke-width: 4px !important;
  filter: brightness(1.1) drop-shadow(0 0 8px rgba(255,255,255,.7));
}
.cam-expand {
  position: absolute;
  right: 6px;
  top: 6px;
  padding: 2px 6px;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 4px;
  background: rgba(4,18,12,.68);
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .06em;
}
.wall-camera-layer {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(1, 9, 6, .86);
  backdrop-filter: blur(10px);
}
.wall-camera-viewer {
  width: min(1120px, calc(100vw - 32px));
  height: min(760px, calc(100dvh - 32px));
  min-height: 420px;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid rgba(143, 212, 168, .34);
  border-radius: 16px;
  background: #07110d;
  box-shadow: 0 28px 80px rgba(0,0,0,.58), 0 0 0 1px rgba(255,255,255,.04) inset;
  color: #edf8f1;
}
.wall-camera-head,
.wall-camera-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  background: rgba(8, 25, 17, .96);
}
.wall-camera-head { border-bottom: 1px solid rgba(143,212,168,.16); }
.wall-camera-head h2 { margin: 3px 0 2px; font-size: 22px; line-height: 1.2; }
.wall-camera-head p { margin: 0; max-width: 760px; color: #92b5a0; font-size: 12px; line-height: 1.4; }
.wall-camera-kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #8fd4a8;
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .08em;
}
.wall-camera-kicker i,
.wall-camera-rec i { width: 7px; height: 7px; border-radius: 50%; background: #ef4444; box-shadow: 0 0 9px rgba(239,68,68,.8); }
.wall-camera-stage {
  position: relative;
  min-height: 0;
  overflow: hidden;
  background: #020704;
}
.wall-camera-frame {
  position: absolute;
  inset: -3%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  animation: wallCameraMotion 16s ease-in-out infinite alternate;
}
.wall-camera-stage.is-paused .wall-camera-frame,
.wall-camera-stage.is-paused .wall-camera-scan { animation-play-state: paused; }
.wall-camera-scan {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 0 48%, rgba(99,255,164,.13) 50%, transparent 52% 100%);
  background-size: 100% 220%;
  mix-blend-mode: screen;
  pointer-events: none;
  animation: wallCameraScan 7s linear infinite;
}
.wall-camera-osd {
  position: absolute;
  left: 14px;
  right: 14px;
  top: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 11px;
  text-shadow: 0 1px 6px #000;
}
.wall-camera-osd .num { margin-left: auto; }
.wall-camera-rec {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 7px;
  border-radius: 5px;
  background: rgba(120,16,16,.72);
  font-weight: 800;
  letter-spacing: .08em;
}
.wall-camera-foot { border-top: 1px solid rgba(143,212,168,.16); }
.wall-camera-meta { display: flex; flex-direction: column; gap: 2px; }
.wall-camera-meta b { font-size: 14px; }
.wall-camera-meta span { color: #84a992; font-size: 11px; }
.wall-camera-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.wall-camera-actions .btn,
#wall-camera-close { min-height: 40px; margin: 0; }
.wall-camera-viewer .btn.ghost {
  color: #dff3e6;
  border-color: rgba(143, 212, 168, .34);
  background: rgba(255, 255, 255, .07);
}
.wall-camera-viewer .btn.ghost:hover,
.wall-camera-viewer .btn.ghost:focus-visible {
  color: #fff;
  border-color: rgba(143, 212, 168, .62);
  background: rgba(143, 212, 168, .16);
}
@keyframes wallCameraMotion {
  from { transform: scale(1.02) translate3d(0, 0, 0); }
  to { transform: scale(1.1) translate3d(-1.6%, -.8%, 0); }
}
@keyframes wallCameraScan {
  from { background-position: 0 -110%; }
  to { background-position: 0 110%; }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

:root[data-theme="dark"] .wq-state.st-pend,
:root[data-theme="dark"] .wq-urgency.u-mid,
:root[data-theme="dark"] .wq-tag.orange {
  color: #fde68a;
  background: #713f12;
}
:root[data-theme="dark"] .wq-urgency.u-hot,
:root[data-theme="dark"] .wq-tag.red {
  color: #fee2e2;
  background: #7f1d1d;
}
:root[data-theme="dark"] .wq-urgency.u-low,
:root[data-theme="dark"] .wq-tag.green {
  color: #bbf7d0;
  background: #14532d;
}
:root[data-theme="dark"] .wq-tag.blue {
  color: #bfdbfe;
  background: #1e3a8a;
}
:root[data-theme="dark"] .wq-ops .btn.wq-primary {
  color: #fff !important;
  border-color: #0f766e !important;
  background: #0f766e !important;
}
@media (max-width: 640px) {
  .wall-camera-layer { padding: 8px; }
  .wall-camera-viewer { width: calc(100vw - 16px); height: calc(100dvh - 16px); min-height: 0; border-radius: 12px; }
  .wall-camera-head,
  .wall-camera-foot { padding: 11px 12px; align-items: flex-start; }
  .wall-camera-head h2 { font-size: 18px; }
  .wall-camera-head p { font-size: 11px; }
  .wall-camera-foot { flex-direction: column; }
  .wall-camera-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
}

/* v121 · 首页任务优先：压缩决策首屏，并把待办置于地图/天气之前。 */
.dash-cockpit > .dc-tasks { order: 1; }
.dash-cockpit > .dc-mid { order: 2; }
.dash-cockpit > .dc-secondary { order: 3; }
.dash-cockpit .dc-top,
.dash-cockpit .command-strip,
.dash-cockpit .ops-trust-bar { margin-block: 0; }
.dash-cockpit .dc-top.is-slim .dc-slogan {
  min-height: 74px;
  padding: 10px 16px;
}
.dash-cockpit .dc-slogan h3 {
  margin: 2px 0 0;
  font-size: 22px;
}
.dash-cockpit .dc-slogan > p { line-height: 1.35; }
.dash-cockpit .command-strip {
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
}
.dash-cockpit .command-actions { gap: 6px; }
.dash-cockpit .command-actions .btn {
  min-height: 38px;
  padding-inline: 13px;
}
.dash-cockpit .ops-trust-bar { min-height: 38px; }

@media (min-width: 721px) and (max-width: 1440px) {
  .dash-cockpit .command-strip {
    grid-template-columns: minmax(280px, .9fr) minmax(360px, 1.1fr);
    grid-template-areas:
      "lead metrics"
      "actions actions";
  }
  .dash-cockpit .command-lead { grid-area: lead; }
  .dash-cockpit .command-metrics { grid-area: metrics; }
  .dash-cockpit .command-actions {
    grid-area: actions;
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .dash-cockpit .dc-top.is-slim .dc-slogan {
    min-height: 82px;
    padding: 11px 13px;
  }
  .dash-cockpit .command-strip {
    padding: 12px;
    gap: 10px;
  }
  .dash-cockpit .ops-trust-bar { margin-block: 0; }
}

/* v123 · 高密点位渐进披露，避免机队编号遮挡地块边界。 */
.wall-field .wall-dev-lab {
  opacity: 0;
  transition: opacity .15s ease;
  pointer-events: none;
}
.wall-field .wall-dev-g:hover .wall-dev-lab,
.wall-field .wall-dev-g:focus .wall-dev-lab {
  opacity: 1;
}
.wall-field .wall-dev-g:focus {
  outline: none;
}
.wall-field .wall-dev-g:focus .wall-dev {
  stroke: #fff;
  stroke-width: 4px;
}

/* v127 · 首页任务表可点击尺寸校准。 */
.dash-cockpit .wq-h-check input,
.dash-cockpit .wq-check input {
  width: 24px;
  min-width: 24px;
  height: 24px;
  margin: 0;
}
.dash-cockpit .wq-h-check,
.dash-cockpit .wq-check {
  min-width: 32px;
  min-height: 32px;
  align-items: center;
}

/* v129 · 手机首屏任务优先：保留决策与可信证据，压缩装饰层和重复换行。 */
@media (max-width: 640px) {
  #main { padding-top: 10px; }
  .page-title.is-farm {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: baseline;
    column-gap: 8px;
    row-gap: 2px;
    margin-bottom: 10px;
    padding-bottom: 2px;
  }
  .page-title.is-farm h1 {
    font-size: 26px;
    line-height: 1.15;
  }
  .page-title.is-farm .sub-t {
    grid-column: 2;
    min-width: 0;
    margin: 0;
    overflow: hidden;
    font-size: 11px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dash-cockpit > .wo-toast,
  .dash-cockpit > .wo-banner { order: -4; }
  .dash-cockpit > .command-strip { order: -3; }
  .dash-cockpit > .ops-trust-bar { order: -2; }
  .dash-cockpit > .dc-tasks { order: -1; }

  .dash-cockpit .wo-toast {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: start;
    gap: 5px 7px;
    min-height: 0;
    padding: 7px 8px;
  }
  .dash-cockpit .wo-toast-ico { margin-top: 1px; }
  .dash-cockpit .wo-toast-msg {
    display: grid;
    gap: 1px;
    font-size: 11px;
    line-height: 1.3;
  }
  .dash-cockpit .wo-toast-msg b,
  .dash-cockpit .wo-toast-msg span,
  .dash-cockpit .wo-toast-msg em {
    max-width: none;
    white-space: normal;
  }
  .dash-cockpit .wo-toast-msg span,
  .dash-cockpit .wo-toast-msg em {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
  }
  .dash-cockpit .wo-toast-acts {
    grid-column: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    margin: 0;
  }
  .dash-cockpit .wo-toast-acts .btn {
    width: 100%;
    min-height: 38px;
    height: 38px !important;
  }

  .dash-cockpit .command-strip {
    gap: 7px;
    padding: 9px 10px 8px;
  }
  .dash-cockpit .command-lead { gap: 2px; }
  .dash-cockpit .command-lead strong {
    font-size: 15px;
    line-height: 1.28;
  }
  .dash-cockpit .command-lead span:last-child {
    overflow: hidden;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dash-cockpit .command-metrics {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
  }
  .dash-cockpit .command-metric {
    min-width: 0;
    min-height: 46px;
    padding: 5px 3px;
    border: 1px solid var(--border2);
    border-radius: 8px;
    text-align: center;
  }
  .dash-cockpit .command-metric b { font-size: 18px; }
  .dash-cockpit .command-metric span {
    overflow: hidden;
    font-size: 10px;
    text-overflow: ellipsis;
  }
  .dash-cockpit .command-actions {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 6px;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    scroll-snap-type: inline proximity;
    padding: 1px 0 3px;
  }
  .dash-cockpit .command-actions .btn {
    flex: 0 0 auto;
    min-height: 42px;
    scroll-snap-align: start;
  }
  .dash-cockpit .command-actions,
  .dash-cockpit .ops-trust-bar { scrollbar-width: none; }
  .dash-cockpit .command-actions::-webkit-scrollbar,
  .dash-cockpit .ops-trust-bar::-webkit-scrollbar { display: none; }

  .dash-cockpit .ops-trust-bar {
    display: flex;
    align-items: center;
    gap: 0;
    min-height: 48px;
    padding: 3px 6px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    scroll-snap-type: inline proximity;
  }
  .dash-cockpit .ops-trust-bar > span,
  .dash-cockpit .ops-trust-bar .ops-trust-title {
    flex: 0 0 auto;
    display: flex;
    grid-column: auto;
    align-items: baseline;
    gap: 6px;
    min-height: 38px;
    padding: 7px 9px;
    border-top: 0;
    border-left: 1px solid var(--border);
    white-space: nowrap;
    scroll-snap-align: start;
  }
  .dash-cockpit .ops-trust-bar .ops-trust-title {
    position: sticky;
    left: 0;
    z-index: 1;
    border-left: 0;
    background: color-mix(in srgb, var(--card) 96%, var(--field-a));
  }
  .dash-cockpit .ops-trust-bar b {
    overflow: visible;
    white-space: nowrap;
    text-overflow: clip;
  }

  .dash-cockpit .dc-top.is-slim .dc-slogan {
    min-height: 74px;
    padding: 9px 12px;
  }
}