:root {
  --forest: #0b3b2e;
  --forest-2: #062b21;
  --green: #2f8c4d;
  --lime: #79c347;
  --bg: #f3f6f4;
  --ink: #17372d;
  --muted: #708078;
  --line: #dfe7e2;
  --white: #fff;
  --amber: #e6a23c;
  --red: #db5b54;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font:
    400 15px/1.5 Inter,
    Arial,
    sans-serif;
}
button,
select {
  font: inherit;
}
.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: 260px;
  background: var(--forest);
  color: #fff;
  padding: 26px 18px 18px;
  display: flex;
  flex-direction: column;
  z-index: 40;
}
.nav-item[hidden] {
  display: none !important;
}
.brand-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 10px 25px 12px;
}
.brand {
  display: block;
}
.brand img {
  display: block;
  width: 132px;
}
.demo-badge {
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.68);
  padding: 4px 7px;
  font-size: 0.5rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}
.scope-card {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 18px 8px 14px;
}
.scope-card > span,
.sidebar nav > p {
  font-size: 0.63rem;
  letter-spacing: 0.13em;
  color: rgba(255, 255, 255, 0.43);
  font-weight: 700;
}
.scope-card button {
  width: 100%;
  margin-top: 8px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  padding: 11px;
  display: grid;
  grid-template-columns: 9px 1fr auto;
  column-gap: 9px;
  text-align: left;
  cursor: pointer;
}
.scope-card button i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--lime);
  margin-top: 6px;
}
.scope-card b,
.scope-card small {
  grid-column: 2;
  display: block;
}
.scope-card b {
  font-size: 0.77rem;
}
.scope-card small {
  font-size: 0.65rem;
  color: rgba(255, 255, 255, 0.55);
}
.scope-card strong {
  grid-column: 3;
  grid-row: 1/3;
  align-self: center;
  color: rgba(255, 255, 255, 0.55);
}
.sidebar nav {
  overflow: auto;
  padding: 0 3px;
}
.sidebar nav > p {
  margin: 18px 10px 7px;
}
.nav-item {
  width: 100%;
  height: 42px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: rgba(255, 255, 255, 0.7);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 9px;
  cursor: pointer;
  text-align: left;
  font-size: 0.78rem;
  font-weight: 600;
  transition: 0.18s;
}
.nav-item > span {
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  text-align: center;
  color: #a7d97a;
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 7px;
  font-size: 0.9rem;
}
.nav-item:hover,
.nav-item.active {
  background: rgba(121, 195, 71, 0.14);
  color: #fff;
}
.nav-item.active {
  background: linear-gradient(90deg, rgba(121, 195, 71, 0.22), rgba(121, 195, 71, 0.1));
  box-shadow: inset 3px 0 var(--lime), 0 5px 16px rgba(0, 0, 0, 0.08);
}
.nav-item.active > span {
  color: #fff;
  background: rgba(121, 195, 71, 0.25);
  border-color: rgba(155, 210, 92, 0.26);
}
.nav-item:focus-visible,
.scope-card button:focus-visible,
.sidebar-foot button:focus-visible {
  outline: 2px solid var(--lime);
  outline-offset: 2px;
}
.nav-item em {
  margin-left: auto;
  background: #d95750;
  color: #fff;
  font-style: normal;
  font-size: 0.6rem;
  padding: 2px 6px;
  border-radius: 10px;
}
.sidebar-foot {
  margin-top: auto;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 17px 7px 0;
  display: grid;
  grid-template-columns: 34px 1fr auto;
  gap: 10px;
  align-items: center;
}
.sidebar-foot > span {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #74bd47, #2f8c4d);
  font-size: 0.68rem;
  font-weight: 800;
}
.sidebar-foot b,
.sidebar-foot small {
  display: block;
}
.sidebar-foot b {
  font-size: 0.72rem;
}
.sidebar-foot small {
  font-size: 0.61rem;
  color: rgba(255, 255, 255, 0.48);
}
.sidebar-foot button {
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.55);
  cursor: pointer;
  font-size: 1.1rem;
}
.prototype-version {
  display: block;
  margin: 10px 7px 0;
  color: rgba(255, 255, 255, 0.33);
  font-size: 0.53rem;
  letter-spacing: 0.03em;
}
main {
  margin-left: 260px;
  min-height: 100vh;
}
.topbar {
  height: 82px;
  padding: 0 34px;
  background: #fff;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 20;
}
.topbar p {
  margin: 0 0 3px;
  color: var(--muted);
  font-size: 0.66rem;
}
.topbar h1 {
  margin: 0;
  font: 700 1.2rem Montserrat;
}
.top-actions {
  display: flex;
  align-items: center;
  gap: 15px;
}
.demo-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #dbe8de;
  border-radius: 999px;
  background: #f5faf6;
  color: #577064;
  padding: 6px 9px;
  font-size: 0.61rem;
  font-weight: 700;
  white-space: nowrap;
}
.demo-status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--lime);
  box-shadow: 0 0 0 3px rgba(121, 195, 71, 0.15);
}
.role-preview {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--muted);
  font-size: 0.7rem;
}
.role-preview select {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  padding: 9px 31px 9px 10px;
  font-size: 0.72rem;
  font-weight: 600;
}
.locked-role-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 1px solid #d8e6dc;
  border-radius: 999px;
  background: #f4faf5;
  color: var(--muted);
  padding: 7px 10px;
  font-size: 0.62rem;
  white-space: nowrap;
}
.locked-role-badge i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--green);
}
.locked-role-badge b {
  color: var(--forest);
}
.notification {
  position: relative;
  width: 38px;
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  color: var(--forest);
  cursor: pointer;
}
.notification i {
  position: absolute;
  right: 4px;
  top: 2px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--red);
  border: 2px solid #fff;
}
.mobile-menu {
  display: none;
  border: 0;
  background: none;
  font-size: 1.3rem;
}
.demo-strip {
  min-height: 34px;
  padding: 7px 34px;
  display: flex;
  align-items: center;
  gap: 8px;
  background: #eef6ef;
  border-bottom: 1px solid #dbe8de;
  color: #577064;
  font-size: 0.65rem;
}
.demo-strip strong {
  color: var(--forest);
  font-size: 0.63rem;
}
.content {
  padding: 30px 34px 45px;
  max-width: 1540px;
  margin: auto;
}
.welcome-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 22px;
}
.eyebrow,
.panel-head span {
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--green);
}
.welcome-row h2 {
  font: 700 1.55rem Montserrat;
  margin: 5px 0;
}
.welcome-row p {
  margin: 0;
  color: var(--muted);
  font-size: 0.8rem;
}
.period {
  display: flex;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  padding: 3px;
}
.period button {
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--muted);
  padding: 7px 13px;
  font-size: 0.68rem;
  cursor: pointer;
}
.period button.active {
  background: var(--forest);
  color: #fff;
}
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px;
  margin-bottom: 15px;
}
.kpi-grid article,
.panel {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 9px;
  box-shadow: 0 6px 20px rgba(11, 59, 46, 0.035);
}
.kpi-grid article {
  padding: 18px 19px;
  position: relative;
  min-height: 145px;
  overflow: hidden;
}
.kpi-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.kpi-head > span {
  font-size: 0.6rem;
  font-weight: 800;
  color: var(--muted);
  letter-spacing: 0.07em;
}
.kpi-head > i {
  font-style: normal;
  font-size: 0.58rem;
  padding: 3px 6px;
  border-radius: 10px;
}
.positive {
  color: #278349;
  background: #e8f5eb;
}
.neutral {
  color: #47665a;
  background: #edf2ef;
}
.warning {
  color: #9b681c;
  background: #fff4df;
}
.kpi-grid strong {
  display: block;
  font: 700 1.7rem Montserrat;
  margin-top: 14px;
}
.kpi-grid small {
  color: var(--muted);
  font-size: 0.66rem;
}
.spark {
  position: absolute;
  right: 15px;
  bottom: 16px;
  width: 88px;
  height: 36px;
}
.spark.bars {
  display: flex;
  gap: 4px;
  align-items: end;
}
.spark.bars i {
  flex: 1;
  background: #cfe6c8;
  border-radius: 2px 2px 0 0;
}
.spark.bars i:nth-child(1) {
  height: 25%;
}
.spark.bars i:nth-child(2) {
  height: 44%;
}
.spark.bars i:nth-child(3) {
  height: 35%;
}
.spark.bars i:nth-child(4) {
  height: 59%;
}
.spark.bars i:nth-child(5) {
  height: 51%;
}
.spark.bars i:nth-child(6) {
  height: 74%;
}
.spark.bars i:nth-child(7) {
  height: 92%;
  background: var(--green);
}
.mini-progress {
  height: 5px;
  background: #edf2ef;
  border-radius: 5px;
  margin-top: 18px;
  overflow: hidden;
}
.mini-progress i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--green), var(--lime));
}
.spark svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: var(--green);
  stroke-width: 2;
}
.alert-dots {
  display: flex;
  gap: 5px;
  margin-top: 18px;
}
.alert-dots i {
  height: 5px;
  flex: 1;
  border-radius: 4px;
  background: #f0c16e;
}
.alert-dots i:nth-child(-n + 2) {
  background: var(--red);
}
.dashboard-grid {
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  gap: 15px;
}
.panel {
  padding: 21px;
}
.panel-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  margin-bottom: 19px;
}
.panel-head h3 {
  margin: 4px 0 0;
  font: 700 1rem Montserrat;
}
.panel-head button {
  border: 0;
  background: transparent;
  color: var(--green);
  font-size: 0.67rem;
  font-weight: 700;
  cursor: pointer;
}
.chart-area {
  height: 210px;
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 8px;
}
.chart-scale {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: #91a098;
  font-size: 0.55rem;
  padding-bottom: 24px;
}
.region-bars {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: end;
  border-bottom: 1px solid var(--line);
  background: repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent 45px,
    #eef2ef 46px
  );
}
.region-bars > div {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: center;
}
.region-bars i {
  display: flex;
  width: min(48px, 70%);
  background: linear-gradient(180deg, #74bf48, #2f8c4d);
  border-radius: 5px 5px 0 0;
  position: relative;
}
.region-bars b {
  position: absolute;
  top: -20px;
  width: 100%;
  text-align: center;
  font-size: 0.59rem;
  color: var(--ink);
}
.region-bars span {
  height: 24px;
  padding-top: 7px;
  font-size: 0.58rem;
  color: var(--muted);
  white-space: nowrap;
}
.status-list {
  display: grid;
  gap: 14px;
}
.status-list > div {
  display: grid;
  grid-template-columns: 10px 1fr auto;
  gap: 10px;
  align-items: center;
  border-bottom: 1px solid #edf1ee;
  padding-bottom: 11px;
}
.status-list i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.ok {
  background: var(--green);
}
.attention {
  background: var(--amber);
}
.critical {
  background: var(--red);
}
.status-list b,
.status-list small {
  display: block;
}
.status-list b {
  font-size: 0.75rem;
}
.status-list small {
  font-size: 0.6rem;
  color: var(--muted);
}
.status-list strong {
  font-size: 0.72rem;
}
.stacked {
  display: flex;
  height: 7px;
  border-radius: 7px;
  overflow: hidden;
  margin-top: 18px;
}
.stacked i:nth-child(1) {
  width: 83%;
  background: var(--green);
}
.stacked i:nth-child(2) {
  width: 13%;
  background: var(--amber);
}
.stacked i:nth-child(3) {
  width: 4%;
  background: var(--red);
}
.opportunity-list {
  display: grid;
}
.opportunity-list > div {
  display: grid;
  grid-template-columns: 38px 1fr auto auto;
  gap: 10px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid #edf1ee;
}
.opportunity-list > div:last-child {
  border: 0;
}
.crop {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 0.68rem;
}
.strawberry {
  background: #fde8e7;
  color: #bb4841;
}
.lettuce {
  background: #e9f5e7;
  color: #38823c;
}
.herb {
  background: #fff2dc;
  color: #a16d20;
}
.opportunity-list p {
  margin: 0;
}
.opportunity-list b,
.opportunity-list small {
  display: block;
}
.opportunity-list b {
  font-size: 0.72rem;
}
.opportunity-list small {
  font-size: 0.59rem;
  color: var(--muted);
}
.opportunity-list em {
  font-style: normal;
  font-size: 0.58rem;
  color: var(--green);
  background: #edf7eb;
  padding: 4px 7px;
  border-radius: 10px;
}
.opportunity-list strong {
  font-size: 0.69rem;
  color: var(--green);
}
.units-panel {
  grid-column: 1/-1;
}
.unit-table > div {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  align-items: center;
  padding: 11px 10px;
  border-bottom: 1px solid #edf1ee;
  font-size: 0.7rem;
}
.unit-table .table-head {
  color: var(--muted);
  font-size: 0.57rem;
  font-weight: 800;
  background: #f7f9f8;
  border-radius: 5px;
}
.unit-table b,
.unit-table small {
  display: block;
}
.unit-table small {
  font-size: 0.57rem;
  color: var(--muted);
}
.unit-table em {
  font-style: normal;
  width: max-content;
  padding: 4px 8px;
  border-radius: 10px;
  font-size: 0.58rem;
}
.online {
  color: #277c43;
  background: #e8f5eb;
}
.attention-label {
  color: #9b681c;
  background: #fff4df;
}
.module-placeholder {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 36px;
}
.module-placeholder h2 {
  font: 700 1.35rem Montserrat;
  margin: 0 0 8px;
}
.module-placeholder p {
  color: var(--muted);
  max-width: 620px;
}
.module-placeholder .coming-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 25px;
}
.institutional-page {
  display: grid;
  gap: 16px;
}
.institutional-hero {
  min-height: 310px;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, 0.55fr);
  gap: 44px;
  align-items: end;
  padding: 42px;
  border-radius: 14px;
  color: #fff;
  background:
    radial-gradient(circle at 82% 18%, rgba(121, 195, 71, 0.22), transparent 31%),
    linear-gradient(135deg, #062b21, #0b4937);
  overflow: hidden;
}
.institutional-hero span,
.institutional-hero small,
.vertkal-cycle header > span,
.future-roadmap header > span,
.future-statement > span,
.institutional-card small {
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}
.institutional-hero > div > span {
  color: #9bd25c;
}
.institutional-hero h2 {
  max-width: 780px;
  margin: 10px 0 16px;
  font: 700 clamp(1.75rem, 3vw, 2.85rem)/1.12 Montserrat;
}
.institutional-hero > div > p {
  max-width: 720px;
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.92rem;
}
.institutional-hero aside {
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.07);
  backdrop-filter: blur(8px);
}
.institutional-hero aside small {
  color: #9bd25c;
}
.institutional-hero aside strong {
  display: block;
  margin: 9px 0;
  font: 700 1.05rem/1.35 Montserrat;
}
.institutional-hero aside p {
  margin: 0;
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.76rem;
}
.institutional-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.institutional-card {
  min-height: 210px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fff;
}
.institutional-card > span {
  color: #b9c7c0;
  font: 700 1.55rem Montserrat;
}
.institutional-card small,
.vertkal-cycle header > span,
.future-roadmap header > span {
  color: var(--green);
}
.institutional-card h3 {
  margin: 6px 0 8px;
  font: 700 0.94rem/1.3 Montserrat;
}
.institutional-card p {
  margin: 0;
  color: var(--muted);
  font-size: 0.76rem;
}
.vertkal-cycle,
.future-roadmap,
.future-statement {
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fff;
}
.vertkal-cycle header h3,
.future-roadmap header h3 {
  margin: 5px 0;
  font: 700 1.15rem Montserrat;
}
.vertkal-cycle header p {
  margin: 0;
  color: var(--muted);
  font-size: 0.76rem;
}
.cycle-flow {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr auto 1fr;
  align-items: center;
  gap: 10px;
  margin-top: 24px;
}
.cycle-flow > div {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.cycle-flow > div > b {
  width: 33px;
  height: 33px;
  flex: 0 0 33px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #edf6ee;
  color: var(--green);
  font-size: 0.64rem;
}
.cycle-flow strong,
.cycle-flow small {
  display: block;
}
.cycle-flow strong {
  font-size: 0.75rem;
}
.cycle-flow small {
  color: var(--muted);
  font-size: 0.61rem;
}
.cycle-flow > i {
  color: #a9b8b0;
  font-style: normal;
}
.institutional-bottom {
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  gap: 16px;
}
.future-roadmap ol {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin: 24px 0 0;
  padding: 0;
  counter-reset: roadmap;
}
.future-roadmap li {
  position: relative;
  border-top: 3px solid #dce8de;
  padding-top: 14px;
}
.future-roadmap li:first-child {
  border-color: var(--lime);
}
.future-roadmap li b,
.future-roadmap li span {
  display: block;
}
.future-roadmap li b {
  font-size: 0.78rem;
}
.future-roadmap li span {
  margin-top: 5px;
  color: var(--muted);
  font-size: 0.66rem;
}
.future-statement {
  color: #fff;
  background: linear-gradient(145deg, #0b3b2e, #165741);
  border-color: transparent;
}
.future-statement > span {
  color: #9bd25c;
}
.future-statement blockquote {
  margin: 18px 0 34px;
  font: 600 1.08rem/1.48 Montserrat;
}
.future-statement div b,
.future-statement div small {
  display: block;
}
.future-statement div small {
  color: rgba(255, 255, 255, 0.58);
  font-size: 0.65rem;
}
.network-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 20px;
}
.network-heading h2 {
  font: 700 1.55rem Montserrat;
  margin: 5px 0;
}
.network-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 0.8rem;
}
.primary-action {
  border: 0;
  border-radius: 7px;
  background: var(--forest);
  color: #fff;
  padding: 10px 15px;
  font-size: 0.72rem;
  font-weight: 700;
  cursor: pointer;
}
.network-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 15px;
}
.network-stats article {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px 16px;
}
.network-stats span,
.unit-metrics span,
.unit-bottom span {
  display: block;
  color: var(--muted);
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.07em;
}
.network-stats strong {
  display: block;
  font: 700 1.35rem Montserrat;
  margin: 5px 0 1px;
}
.network-stats small {
  color: var(--muted);
  font-size: 0.62rem;
}
.network-layout {
  display: grid;
  grid-template-columns: 330px 1fr;
  gap: 15px;
}
.tree-panel,
.unit-detail {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 9px;
  box-shadow: 0 6px 20px rgba(11, 59, 46, 0.035);
}
.tree-panel {
  padding: 18px;
}
.network-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.network-panel-head span,
.detail-section-head span,
.unit-detail-head > div > span {
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--green);
}
.network-panel-head h3,
.unit-detail-head h3 {
  font: 700 0.92rem Montserrat;
  margin: 3px 0;
}
.network-panel-head button {
  width: 30px;
  height: 30px;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 6px;
  color: var(--forest);
}
.network-tree {
  padding-top: 13px;
}
.tree-root,
.network-tree summary,
.unit-node {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 42px;
}
.tree-root > span,
.network-tree summary > i {
  width: 30px;
  height: 30px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  background: var(--forest);
  color: #fff;
  font-style: normal;
  font-size: 0.6rem;
  font-weight: 800;
}
.tree-root b {
  font-size: 0.74rem;
}
.tree-root em {
  margin-left: auto;
  color: var(--muted);
  font-size: 0.58rem;
  font-style: normal;
}
.network-tree details {
  position: relative;
  margin-left: 14px;
  padding-left: 14px;
  border-left: 1px solid #dfe7e2;
}
.network-tree summary {
  cursor: pointer;
  list-style: none;
}
.network-tree summary::-webkit-details-marker {
  display: none;
}
.network-tree summary > i {
  background: #eaf3e7;
  color: var(--green);
}
.network-tree summary span,
.unit-node span {
  flex: 1;
}
.network-tree summary b,
.network-tree summary small,
.unit-node b,
.unit-node small {
  display: block;
  text-align: left;
}
.network-tree summary b,
.unit-node b {
  font-size: 0.68rem;
}
.network-tree summary small,
.unit-node small {
  font-size: 0.56rem;
  color: var(--muted);
}
.unit-node {
  width: 100%;
  border: 0;
  background: transparent;
  border-radius: 7px;
  padding: 4px 7px;
  color: var(--ink);
  cursor: pointer;
}
.unit-node:hover,
.unit-node.active {
  background: #edf6eb;
}
.unit-node > i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green);
  margin-left: 7px;
}
.unit-node.attention-node > i {
  background: var(--amber);
}
.unit-detail {
  padding: 22px;
}
.unit-detail-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
}
.unit-detail-head h3 {
  font-size: 1.18rem;
  margin-top: 5px;
}
.unit-detail-head p {
  color: var(--muted);
  font-size: 0.68rem;
  margin: 2px 0;
}
.unit-detail-head > em {
  font-style: normal;
  padding: 5px 9px;
  border-radius: 12px;
  font-size: 0.58rem;
}
.unit-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--line);
  margin: 20px 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
}
.unit-metrics div {
  background: #f9fbfa;
  padding: 14px;
}
.unit-metrics strong {
  display: block;
  font: 700 1rem Montserrat;
  margin-top: 5px;
}
.detail-section-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  margin-bottom: 10px;
}
.detail-section-head h4 {
  font: 700 0.88rem Montserrat;
  margin: 3px 0 0;
}
.detail-section-head button {
  border: 0;
  background: transparent;
  color: var(--green);
  font-size: 0.63rem;
  font-weight: 700;
  cursor: pointer;
}
.sector-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 9px;
}
.sector-grid button {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 7px;
  padding: 12px;
  display: grid;
  grid-template-columns: 34px 1fr auto;
  gap: 10px;
  align-items: center;
  color: var(--ink);
  cursor: pointer;
}
.sector-grid button:hover {
  border-color: #a9cca0;
  background: #fbfdfb;
}
.sector-icon {
  width: 34px;
  height: 34px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  background: #eaf3e7;
  color: var(--green);
  font-weight: 800;
}
.sector-grid b,
.sector-grid small {
  display: block;
  text-align: left;
}
.sector-grid b {
  font-size: 0.68rem;
}
.sector-grid small {
  font-size: 0.57rem;
  color: var(--muted);
}
.sector-grid em {
  font-style: normal;
  padding: 4px 7px;
  border-radius: 10px;
  font-size: 0.54rem;
}
.unit-bottom {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr 0.8fr;
  gap: 12px;
  border-top: 1px solid var(--line);
  margin-top: 20px;
  padding-top: 17px;
}
.unit-bottom > div {
  border-right: 1px solid var(--line);
  padding-right: 12px;
}
.unit-bottom > div:last-child {
  border: 0;
}
.unit-bottom strong {
  display: block;
  font: 700 0.85rem Montserrat;
  margin: 6px 0 3px;
}
.unit-bottom small {
  color: var(--muted);
  font-size: 0.57rem;
}
.occupancy {
  height: 5px;
  background: #edf2ef;
  border-radius: 5px;
  margin: 6px 0;
}
.occupancy i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--green), var(--lime));
  border-radius: 5px;
}
.production-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 20px;
}
.production-heading h2 {
  font: 700 1.55rem Montserrat;
  margin: 5px 0;
}
.production-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 0.8rem;
}
.production-filters {
  display: flex;
  gap: 9px;
}
.production-filters label {
  color: var(--muted);
  font-size: 0.6rem;
  font-weight: 700;
}
.production-filters select {
  display: block;
  margin-top: 4px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  padding: 8px 28px 8px 9px;
  font-size: 0.67rem;
  font-weight: 600;
}
.production-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 14px;
}
.production-kpis article {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 15px 17px;
}
.production-kpis span {
  display: block;
  color: var(--muted);
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.07em;
}
.production-kpis strong {
  display: block;
  font: 700 1.35rem Montserrat;
  margin: 5px 0 1px;
}
.production-kpis small {
  color: var(--muted);
  font-size: 0.61rem;
}
.market-guidance {
  display: grid;
  grid-template-columns: 42px 1fr auto;
  gap: 13px;
  align-items: center;
  background: linear-gradient(100deg, #0b3b2e, #15553e);
  color: #fff;
  border-radius: 9px;
  padding: 16px 18px;
  margin-bottom: 14px;
}
.guidance-icon {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: rgba(121, 195, 71, 0.18);
  color: #aee66a;
  font-size: 1.15rem;
}
.market-guidance span {
  font-size: 0.56rem;
  letter-spacing: 0.1em;
  color: #aee66a;
  font-weight: 800;
}
.market-guidance h3 {
  font: 700 0.86rem Montserrat;
  margin: 3px 0;
}
.market-guidance p {
  margin: 0;
  color: rgba(255, 255, 255, 0.65);
  font-size: 0.62rem;
}
.market-guidance button {
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  padding: 8px 12px;
  font-size: 0.62rem;
  font-weight: 700;
  cursor: pointer;
}
.production-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 14px;
}
.crop-board,
.production-aside > article {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 18px;
  box-shadow: 0 6px 20px rgba(11, 59, 46, 0.035);
}
.production-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  margin-bottom: 14px;
}
.production-panel-head span {
  font-size: 0.57rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--green);
}
.production-panel-head h3 {
  font: 700 0.9rem Montserrat;
  margin: 3px 0;
}
.board-tabs {
  display: flex;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 2px;
}
.board-tabs button {
  border: 0;
  background: transparent;
  color: var(--muted);
  border-radius: 4px;
  padding: 5px 8px;
  font-size: 0.58rem;
  cursor: pointer;
}
.board-tabs button.active {
  background: var(--forest);
  color: #fff;
}
.crop-columns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
}
.crop-columns > section {
  background: #f6f8f7;
  border-radius: 7px;
  padding: 10px;
  min-width: 0;
}
.crop-columns > section > header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 9px;
}
.crop-columns header b,
.crop-columns header small {
  display: block;
}
.crop-columns header b {
  font-size: 0.67rem;
}
.crop-columns header small {
  font-size: 0.53rem;
  color: var(--muted);
}
.crop-columns header em {
  width: 21px;
  height: 21px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #e6ede8;
  font-size: 0.57rem;
  font-style: normal;
}
.lot-list {
  display: grid;
  gap: 8px;
}
.lot-card {
  width: 100%;
  border: 1px solid #e2e8e4;
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  padding: 10px;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 3px 9px rgba(11, 59, 46, 0.025);
}
.lot-card:hover {
  border-color: #a9cca0;
  transform: translateY(-1px);
}
.lot-card > div:first-child {
  display: grid;
  grid-template-columns: 30px 1fr auto;
  gap: 8px;
  align-items: center;
}
.lot-card .crop {
  width: 30px;
  height: 30px;
}
.lot-card p {
  margin: 0;
}
.lot-card p b,
.lot-card p small {
  display: block;
}
.lot-card p b {
  font-size: 0.63rem;
}
.lot-card p small {
  font-size: 0.52rem;
  color: var(--muted);
}
.lot-card > div > em {
  font-size: 0.5rem;
  color: var(--muted);
  font-style: normal;
}
.lot-card dl {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 4px;
  margin: 10px 0 8px;
}
.lot-card dl div {
  min-width: 0;
}
.lot-card dt {
  font-size: 0.48rem;
  color: var(--muted);
}
.lot-card dd {
  margin: 1px 0 0;
  font-size: 0.54rem;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lot-progress {
  height: 4px;
  background: #edf1ee;
  border-radius: 4px;
}
.lot-progress i {
  display: block;
  height: 100%;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--green), var(--lime));
}
.lot-card > small {
  font-size: 0.49rem;
  color: var(--muted);
}
.empty-stage {
  padding: 20px 8px;
  text-align: center;
  color: var(--muted);
  font-size: 0.58rem;
}
.production-aside {
  display: grid;
  gap: 14px;
  align-content: start;
}
.harvest-list > div {
  display: grid;
  grid-template-columns: 38px 1fr auto;
  gap: 9px;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid #edf1ee;
}
.harvest-list > div:last-child {
  border: 0;
}
.harvest-list time {
  width: 36px;
  height: 40px;
  border: 1px solid var(--line);
  border-radius: 6px;
  display: grid;
  place-items: center;
  font-size: 0.73rem;
  font-weight: 800;
}
.harvest-list time small {
  display: block;
  font-size: 0.45rem;
  color: var(--green);
  margin-top: -8px;
}
.harvest-list p {
  margin: 0;
}
.harvest-list b,
.harvest-list small {
  display: block;
}
.harvest-list b {
  font-size: 0.62rem;
}
.harvest-list p small {
  font-size: 0.51rem;
  color: var(--muted);
}
.harvest-list em {
  font-size: 0.5rem;
  font-style: normal;
  color: var(--green);
  background: #eaf5e8;
  padding: 4px 6px;
  border-radius: 9px;
}
.harvest-list em.pending {
  color: #9b681c;
  background: #fff4df;
}
.capacity-list {
  display: grid;
  gap: 12px;
}
.capacity-list > div {
  display: grid;
  grid-template-columns: 1fr auto;
  column-gap: 8px;
}
.capacity-list p {
  margin: 0;
}
.capacity-list p b,
.capacity-list p small {
  display: block;
}
.capacity-list p b {
  font-size: 0.62rem;
}
.capacity-list p small {
  font-size: 0.5rem;
  color: var(--muted);
}
.capacity-list strong {
  font-size: 0.59rem;
}
.capacity-list > div > i {
  grid-column: 1/-1;
  height: 5px;
  background: #edf1ee;
  border-radius: 5px;
  margin-top: 5px;
}
.capacity-list > div > i > b {
  display: block;
  height: 100%;
  border-radius: 5px;
  background: linear-gradient(90deg, var(--green), var(--lime));
}
.lot-toast {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 80;
  background: var(--forest);
  color: #fff;
  border-radius: 7px;
  padding: 12px 16px;
  font-size: 0.67rem;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
  transition: 0.2s;
}
.lot-toast.visible {
  opacity: 1;
  transform: none;
}
.towers-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 20px;
}
.towers-heading h2 {
  font: 700 1.55rem Montserrat;
  margin: 5px 0;
}
.towers-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 0.8rem;
}
.tower-filters {
  display: flex;
  gap: 9px;
}
.tower-filters label {
  color: var(--muted);
  font-size: 0.6rem;
  font-weight: 700;
}
.tower-filters select {
  display: block;
  margin-top: 4px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  padding: 8px 28px 8px 9px;
  font-size: 0.67rem;
  font-weight: 600;
}
.tower-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 14px;
}
.tower-kpis article {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 15px 17px;
}
.tower-kpis span,
.tower-detail-head > div > span,
.cycle-card > div > span,
.automation-state > div > span {
  display: block;
  color: var(--muted);
  font-size: 0.57rem;
  font-weight: 800;
  letter-spacing: 0.07em;
}
.tower-kpis strong {
  display: block;
  font: 700 1.35rem Montserrat;
  margin: 5px 0 1px;
}
.tower-kpis small {
  color: var(--muted);
  font-size: 0.61rem;
}
.tower-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 14px;
}
.tower-list-panel,
.tower-detail {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 18px;
  box-shadow: 0 6px 20px rgba(11, 59, 46, 0.035);
}
.tower-list-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  margin-bottom: 14px;
}
.tower-list-head > div > span {
  font-size: 0.57rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--green);
}
.tower-list-head h3 {
  font: 700 0.9rem Montserrat;
  margin: 3px 0;
}
.status-filter {
  display: flex;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 2px;
}
.status-filter button {
  border: 0;
  background: transparent;
  color: var(--muted);
  border-radius: 4px;
  padding: 5px 8px;
  font-size: 0.56rem;
  cursor: pointer;
}
.status-filter button.active {
  background: var(--forest);
  color: #fff;
}
.tower-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 9px;
}
.tower-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  padding: 12px;
  text-align: left;
  cursor: pointer;
}
.tower-card:hover,
.tower-card.selected {
  border-color: #83b979;
  box-shadow: 0 5px 14px rgba(11, 59, 46, 0.08);
}
.tower-card.critical {
  border-left: 3px solid var(--red);
}
.tower-card.attention {
  border-left: 3px solid var(--amber);
}
.tower-card.offline {
  opacity: 0.67;
}
.tower-card > div:first-child {
  display: grid;
  grid-template-columns: 32px 1fr 8px;
  gap: 8px;
  align-items: center;
}
.tower-symbol {
  width: 32px;
  height: 32px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  background: #eaf3e7;
  color: var(--green);
  font-size: 0.66rem;
  font-weight: 800;
}
.tower-card b,
.tower-card small {
  display: block;
}
.tower-card b {
  font-size: 0.67rem;
}
.tower-card small {
  font-size: 0.52rem;
  color: var(--muted);
}
.tower-card > div > i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--green);
}
.tower-card.attention > div > i {
  background: var(--amber);
}
.tower-card.critical > div > i {
  background: var(--red);
}
.tower-card.offline > div > i {
  background: #9aa69f;
}
.tower-card dl {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 11px 0 9px;
  padding: 8px 0;
  border-top: 1px solid #edf1ee;
  border-bottom: 1px solid #edf1ee;
}
.tower-card dt {
  font-size: 0.48rem;
  color: var(--muted);
}
.tower-card dd {
  margin: 1px 0 0;
  font-size: 0.61rem;
  font-weight: 700;
}
.tower-card footer {
  display: flex;
  justify-content: space-between;
  background: transparent;
  padding: 0;
  color: var(--muted);
}
.tower-card footer span {
  font-size: 0.51rem;
}
.tower-card footer em {
  font-size: 0.5rem;
  font-style: normal;
  color: var(--green);
}
.tower-card.attention footer em {
  color: #a56a14;
}
.tower-card.critical footer em {
  color: var(--red);
}
.empty-towers {
  grid-column: 1/-1;
  padding: 45px;
  text-align: center;
  color: var(--muted);
  font-size: 0.67rem;
}
.tower-detail-head {
  display: flex;
  justify-content: space-between;
}
.tower-detail-head h3 {
  font: 700 1.05rem Montserrat;
  margin: 4px 0;
}
.tower-detail-head p {
  margin: 0;
  color: var(--muted);
  font-size: 0.6rem;
}
.tower-status {
  font-style: normal;
  padding: 4px 8px;
  border-radius: 10px;
  font-size: 0.53rem;
  height: max-content;
}
.tower-status.normal {
  color: #277c43;
  background: #e8f5eb;
}
.tower-status.attention {
  color: #9b681c;
  background: #fff4df;
}
.tower-status.critical {
  color: #a33d38;
  background: #fde8e7;
}
.tower-status.offline {
  color: #66736c;
  background: #edf1ee;
}
.cycle-card {
  display: grid;
  grid-template-columns: 76px 1fr;
  gap: 13px;
  align-items: center;
  background: #f6f9f7;
  border-radius: 8px;
  padding: 14px;
  margin: 17px 0;
}
.cycle-ring {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: conic-gradient(var(--green) 0 64%, #dfe8e2 64%);
  position: relative;
}
.cycle-ring:after {
  content: "";
  position: absolute;
  inset: 6px;
  border-radius: 50%;
  background: #f6f9f7;
}
.cycle-ring > span {
  position: relative;
  z-index: 1;
  font: 700 0.82rem Montserrat;
  text-align: center;
}
.cycle-ring small {
  display: block;
  font: 600 0.42rem Inter;
  color: var(--muted);
}
.cycle-card > div > strong,
.cycle-card > div > small {
  display: block;
}
.cycle-card > div > strong {
  font: 700 0.78rem Montserrat;
  margin: 4px 0;
}
.cycle-card > div > small {
  font-size: 0.53rem;
  color: var(--muted);
}
.sensor-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.sensor-grid article {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 11px;
}
.sensor-grid span {
  font-size: 0.5rem;
  color: var(--muted);
  font-weight: 800;
}
.sensor-grid strong,
.sensor-grid small {
  display: block;
}
.sensor-grid strong {
  font: 700 0.85rem Montserrat;
  margin: 3px 0;
}
.sensor-grid small {
  font-size: 0.49rem;
  color: var(--muted);
}
.sensor-grid i {
  position: absolute;
  right: 9px;
  top: 9px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--green);
}
.sensor-grid i.warn {
  background: var(--amber);
}
.automation-state {
  border-top: 1px solid var(--line);
  margin-top: 17px;
  padding-top: 15px;
}
.automation-state h4 {
  font: 700 0.78rem Montserrat;
  margin: 3px 0 8px;
}
.automation-state ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.automation-state li {
  display: flex;
  justify-content: space-between;
  padding: 7px 0;
  border-bottom: 1px solid #edf1ee;
  font-size: 0.57rem;
}
.automation-state li span {
  display: flex;
  align-items: center;
  gap: 6px;
}
.automation-state li i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
}
.automation-state li i.on {
  background: var(--green);
}
.automation-state li i.off {
  background: #a8b2ac;
}
.automation-state li b {
  font-size: 0.54rem;
}
.automation-state > p {
  margin: 11px 0 0;
  color: var(--muted);
  font-size: 0.5rem;
  line-height: 1.45;
}
.climate-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 20px;
}
.climate-heading h2 {
  font: 700 1.55rem Montserrat;
  margin: 5px 0;
}
.climate-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 0.8rem;
}
.climate-heading label {
  color: var(--muted);
  font-size: 0.6rem;
  font-weight: 700;
}
.climate-heading select {
  display: block;
  margin-top: 4px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  padding: 8px 34px 8px 10px;
  font-size: 0.68rem;
  font-weight: 600;
}
.weather-hero {
  display: grid;
  grid-template-columns: 280px 1fr;
  background: linear-gradient(110deg, #0b3b2e, #176042);
  color: #fff;
  border-radius: 10px;
  padding: 22px;
  margin-bottom: 14px;
}
.current-weather {
  border-right: 1px solid rgba(255, 255, 255, 0.14);
  padding-right: 24px;
}
.current-weather > span {
  font-size: 0.56rem;
  letter-spacing: 0.09em;
  color: #b5dd91;
  font-weight: 800;
}
.current-weather > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.current-weather strong {
  font: 700 2.45rem Montserrat;
  margin: 7px 0 0;
}
.current-weather i {
  font-style: normal;
  font-size: 2rem;
  color: #f4c659;
}
.current-weather p {
  margin: 0;
  color: rgba(255, 255, 255, 0.65);
  font-size: 0.62rem;
}
.current-weather em {
  display: inline-block;
  margin-top: 11px;
  font-style: normal;
  padding: 4px 8px;
  border-radius: 10px;
  font-size: 0.53rem;
}
.weather-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: center;
}
.weather-metrics article {
  padding: 10px 20px;
  border-right: 1px solid rgba(255, 255, 255, 0.1);
}
.weather-metrics article:last-child {
  border: 0;
}
.weather-metrics span {
  display: block;
  font-size: 0.52rem;
  color: rgba(255, 255, 255, 0.53);
  font-weight: 800;
}
.weather-metrics strong {
  display: block;
  font: 700 0.95rem Montserrat;
  margin: 5px 0;
}
.weather-metrics small {
  color: #b5dd91;
  font-size: 0.5rem;
}
.climate-v2 {
  display: grid;
  gap: 14px;
}
.climate-v2 button,
.climate-v2 input,
.climate-v2 select {
  font: inherit;
}
.climate-v2-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.climate-v2-heading > div {
  display: flex;
  align-items: center;
  gap: 14px;
}
.climate-cloud {
  color: #29ad60;
  font-size: 2.25rem;
  line-height: 1;
}
.climate-v2-heading h2 {
  margin: 0;
  font: 700 1.7rem Montserrat;
}
.climate-v2-heading p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 0.8rem;
}
.climate-v2-heading time {
  text-align: right;
  color: var(--muted);
  font-size: 0.66rem;
}
.climate-v2-heading time b {
  font-weight: 500;
}
.climate-v2-kpis {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 11px;
}
.climate-v2-kpis article {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
}
.climate-v2-kpis article > i {
  width: 45px;
  height: 45px;
  flex: 0 0 45px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #f2f5f4;
  color: #122c25;
  font-style: normal;
  font-size: 1.35rem;
}
.climate-v2-kpis article > i.green {
  color: #249a54;
  background: #eaf7ee;
}
.climate-v2-kpis article > i.blue {
  color: #3089d4;
  background: #edf6fc;
}
.climate-v2-kpis article > i.orange {
  color: #d27a18;
  background: #fff4e5;
}
.climate-v2-kpis article span,
.climate-v2-kpis article strong,
.climate-v2-kpis article small {
  display: block;
}
.climate-v2-kpis article span {
  min-width: 0;
  color: var(--muted);
  font-size: 0.64rem;
}
.climate-v2-kpis article strong {
  margin: 2px 0;
  color: var(--ink);
  font: 700 0.98rem Montserrat;
}
.climate-v2-kpis article small {
  font-size: 0.56rem;
}
.climate-v2-kpis article small b {
  color: #269754;
}
.climate-v2-kpis article small.down {
  color: #c84a4a;
}
.climate-v2-map-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 13px;
}
.world-stations-map {
  position: relative;
  min-height: 420px;
  border-radius: 10px;
  overflow: hidden;
  background: #183f54;
}
.map-image {
  --zoom: 1;
  position: absolute;
  inset: 0;
  overflow: hidden;
  background-image:
    linear-gradient(rgba(5, 42, 38, 0.16), rgba(2, 28, 31, 0.2)),
    url("https://eoimages.gsfc.nasa.gov/images/imagerecords/57000/57730/land_ocean_ice_2048.jpg");
  background-size: calc(100% * var(--zoom)) calc(100% * var(--zoom));
  background-position: center;
  transition: background-size 0.2s ease, filter 0.2s ease;
}
.map-image.satellite {
  filter: saturate(1.35) contrast(1.08);
}
.map-pin {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: 21px;
  height: 27px;
  padding: 0;
  border: 2px solid #fff;
  border-radius: 13px 13px 13px 2px;
  background: #25ad62;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.38);
  transform: translate(-50%, -100%) rotate(-45deg);
  cursor: pointer;
  z-index: 2;
}
.map-pin span {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #fff;
  transform: translate(-50%, -50%);
}
.map-pin.attention {
  background: #f3ae2d;
}
.map-pin.alert {
  background: #de4b4b;
}
.map-pin.selected {
  box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.35), 0 3px 10px rgba(0, 0, 0, 0.5);
}
.map-tabs,
.map-filter,
.map-zoom {
  position: absolute;
  z-index: 4;
}
.map-tabs {
  top: 12px;
  left: 12px;
  display: flex;
  padding: 3px;
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.16);
}
.map-tabs button {
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--muted);
  padding: 7px 12px;
  font-size: 0.65rem;
  cursor: pointer;
}
.map-tabs button.active {
  background: #edf6ee;
  color: var(--forest);
  font-weight: 700;
}
.map-filter {
  top: 12px;
  right: 12px;
  min-width: 255px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.18);
}
.map-filter select {
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-size: 0.65rem;
}
.map-filter p {
  display: flex;
  gap: 10px;
  align-items: center;
  margin: 8px 0 0;
  font-size: 0.54rem;
  color: var(--muted);
}
.map-filter p span,
.station-status {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #25ad62;
}
.map-filter p span.attention,
.station-status.attention {
  background: #f3ae2d;
}
.map-filter p span.alert,
.station-status.alert {
  background: #de4b4b;
}
.map-filter p span.offline,
.station-status.offline {
  background: #98a3aa;
}
.map-zoom {
  left: 12px;
  bottom: 12px;
  display: grid;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2);
}
.map-zoom button {
  width: 31px;
  height: 31px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  cursor: pointer;
}
.station-directory,
.current-station,
.climate-v2-chart,
.climate-v2-forecast {
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
}
.station-directory {
  min-height: 420px;
  padding: 14px;
  overflow: hidden;
}
.station-directory header,
.current-station header,
.climate-v2-chart header,
.climate-v2-forecast header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.station-directory h3,
.current-station h3,
.climate-v2-chart h3,
.climate-v2-forecast h3 {
  margin: 0;
  font: 700 0.8rem Montserrat;
}
.station-directory h3 span {
  color: var(--muted);
  font-weight: 500;
}
.station-directory header > span,
.climate-v2-chart header > span,
.climate-v2-forecast header > span {
  color: var(--green);
  font-size: 0.6rem;
}
.station-directory > label {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 12px 0 4px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--muted);
}
.station-directory input {
  width: 100%;
  border: 0;
  outline: 0;
  color: var(--ink);
  font-size: 0.65rem;
}
.station-list {
  max-height: 343px;
  overflow: auto;
}
.station-list > button {
  width: 100%;
  display: grid;
  grid-template-columns: 9px minmax(0, 1fr) 20px auto auto;
  gap: 7px;
  align-items: center;
  padding: 9px 4px;
  border: 0;
  border-bottom: 1px solid #edf1ee;
  background: #fff;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}
.station-list > button.selected {
  background: #f2f8f3;
}
.station-list p {
  min-width: 0;
  margin: 0;
}
.station-list b,
.station-list small {
  display: block;
}
.station-list b {
  font-size: 0.66rem;
}
.station-list small {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.53rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.station-list > button > i {
  color: #e7ad25;
  font-style: normal;
  font-size: 1rem;
}
.station-list > button > strong,
.station-list > button > em {
  font-size: 0.6rem;
  white-space: nowrap;
}
.station-list > button > em {
  color: var(--muted);
  font-style: normal;
}
.climate-v2-bottom {
  display: grid;
  grid-template-columns: 1.05fr 1fr 0.88fr;
  gap: 13px;
}
.current-station,
.climate-v2-chart,
.climate-v2-forecast {
  padding: 15px;
}
.current-station header > span {
  padding: 4px 7px;
  border-radius: 10px;
  background: #eaf7ee;
  color: var(--green);
  font-size: 0.52rem;
}
.current-station header > span i {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 4px;
  border-radius: 50%;
  background: var(--green);
}
.current-station-body {
  display: grid;
  grid-template-columns: 0.86fr 1.14fr;
  gap: 15px;
  margin-top: 12px;
}
.current-station-body > div > p {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}
.current-station-body > div > p b,
.current-station-body > div > p small {
  display: block;
}
.current-station-body > div > p b {
  font-size: 0.68rem;
}
.current-station-body > div > p small {
  color: var(--muted);
  font-size: 0.54rem;
}
.weather-now {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 7px;
  margin-top: 15px;
}
.weather-now > i {
  color: #f2b31f;
  font-style: normal;
  font-size: 2rem;
}
.weather-now strong {
  font: 700 1.7rem Montserrat;
}
.weather-now small {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 0.55rem;
}
.current-station dl {
  margin: 0;
}
.current-station dl > div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 0;
  border-bottom: 1px solid #edf1ee;
  font-size: 0.55rem;
}
.current-station dt {
  color: var(--muted);
}
.current-station dd {
  margin: 0;
  text-align: right;
}
.climate-v2-chart > div {
  position: relative;
  margin-top: 13px;
  padding-left: 25px;
}
.climate-v2-chart svg {
  width: 100%;
  height: 155px;
  overflow: visible;
  background: repeating-linear-gradient(to bottom, #edf1ee 0, #edf1ee 1px, transparent 1px, transparent 38px);
}
.climate-v2-chart path.fill {
  fill: url(#climateFill);
}
.climate-v2-chart path.line {
  fill: none;
  stroke: #2da35a;
  stroke-width: 3;
}
.climate-v2-chart circle {
  fill: #2da35a;
  stroke: #fff;
  stroke-width: 3;
}
.chart-axis {
  position: absolute;
  left: 0;
  top: 0;
  height: 155px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: var(--muted);
  font-size: 0.48rem;
}
.chart-hours {
  display: flex;
  justify-content: space-between;
  margin-top: 5px;
  color: var(--muted);
  font-size: 0.47rem;
}
.chart-pop {
  position: absolute;
  left: 66%;
  top: -9px;
  z-index: 2;
  padding: 5px 7px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fff;
  font-size: 0.55rem;
  font-weight: 700;
}
.chart-pop small {
  display: block;
  color: var(--muted);
  font-weight: 400;
}
.climate-v2-forecast > div {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 5px;
  margin-top: 13px;
}
.climate-v2-forecast section {
  display: grid;
  justify-items: center;
  gap: 3px;
  padding: 8px 3px;
  border: 1px solid #edf1ee;
  border-radius: 6px;
}
.climate-v2-forecast section span,
.climate-v2-forecast section small,
.climate-v2-forecast section em {
  color: var(--muted);
  font-size: 0.49rem;
  font-style: normal;
}
.climate-v2-forecast section i {
  font-style: normal;
  font-size: 1.2rem;
}
.climate-v2-forecast section strong {
  font-size: 0.72rem;
}
.climate-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 14px;
}
.climate-main,
.climate-aside {
  display: grid;
  gap: 14px;
  align-content: start;
}
.environment-panel,
.history-panel,
.forecast-panel,
.climate-alerts {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 18px;
  box-shadow: 0 6px 20px rgba(11, 59, 46, 0.035);
}
.climate-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  margin-bottom: 14px;
}
.climate-panel-head span {
  font-size: 0.57rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--green);
}
.climate-panel-head h3 {
  font: 700 0.9rem Montserrat;
  margin: 3px 0;
}
.climate-panel-head > em {
  font-style: normal;
  font-size: 0.5rem;
  color: var(--muted);
}
.environment-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.environment-grid > div {
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 12px;
}
.environment-grid span {
  font-size: 0.49rem;
  color: var(--muted);
  font-weight: 800;
}
.environment-grid strong,
.environment-grid small {
  display: block;
}
.environment-grid strong {
  font: 700 0.92rem Montserrat;
  margin: 5px 0;
}
.environment-grid small {
  font-size: 0.49rem;
  color: var(--muted);
}
.environment-grid i {
  display: block;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--green) var(--value),
    #e8eeea var(--value)
  );
  border-radius: 4px;
  margin-top: 9px;
}
.climate-legend {
  display: flex;
  gap: 8px;
  align-items: center;
  font-size: 0.5rem;
  color: var(--muted);
}
.climate-legend i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--green);
}
.climate-legend i:nth-of-type(2) {
  background: #6fa8d9;
}
.climate-chart {
  display: grid;
  grid-template-columns: 26px 1fr;
  position: relative;
}
.chart-labels {
  height: 180px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: var(--muted);
  font-size: 0.48rem;
}
.climate-chart svg {
  width: 100%;
  height: 180px;
  background: repeating-linear-gradient(
    to bottom,
    #edf1ee 0,
    #edf1ee 1px,
    transparent 1px,
    transparent 45px
  );
}
.temp-area {
  fill: rgba(69, 153, 79, 0.08);
}
.temp-line {
  fill: none;
  stroke: var(--green);
  stroke-width: 3;
}
.humidity-line {
  fill: none;
  stroke: #6fa8d9;
  stroke-width: 2;
  stroke-dasharray: 5 5;
}
.chart-times {
  grid-column: 2;
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font-size: 0.47rem;
  margin-top: 5px;
}
.forecast-list > div {
  display: grid;
  grid-template-columns: 34px 25px 1fr auto;
  align-items: center;
  gap: 7px;
  padding: 9px 0;
  border-bottom: 1px solid #edf1ee;
}
.forecast-list > div:last-child {
  border: 0;
}
.forecast-list > b {
  font-size: 0.58rem;
}
.forecast-list i {
  font-style: normal;
  color: #d9a624;
}
.forecast-list span strong,
.forecast-list span small {
  display: inline;
}
.forecast-list span strong {
  font-size: 0.63rem;
}
.forecast-list span small {
  font-size: 0.52rem;
  color: var(--muted);
  margin-left: 4px;
}
.forecast-list em {
  font-style: normal;
  font-size: 0.49rem;
  color: var(--muted);
}
.climate-alerts > div:not(.climate-panel-head) {
  display: grid;
  grid-template-columns: 8px 1fr;
  gap: 8px;
  padding: 9px 0;
  border-bottom: 1px solid #edf1ee;
}
.climate-alerts > div:last-child {
  border: 0;
}
.climate-alerts i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  margin-top: 5px;
}
.amber-dot {
  background: var(--amber);
}
.blue-dot {
  background: #6fa8d9;
}
.green-dot {
  background: var(--green);
}
.climate-alerts p {
  margin: 0;
}
.climate-alerts b,
.climate-alerts small {
  display: block;
}
.logistics-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 20px;
}
.logistics-heading h2 {
  font: 700 1.55rem Montserrat;
  margin: 5px 0;
}
.logistics-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 0.8rem;
}
.logistics-heading label {
  color: var(--muted);
  font-size: 0.6rem;
  font-weight: 700;
}
.logistics-heading select {
  display: block;
  margin-top: 4px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  padding: 8px 34px 8px 10px;
  font-size: 0.68rem;
  font-weight: 600;
}
.logistics-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 14px;
}
.logistics-kpis article {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 15px 17px;
}
.logistics-kpis span {
  display: block;
  color: var(--muted);
  font-size: 0.57rem;
  font-weight: 800;
  letter-spacing: 0.07em;
}
.logistics-kpis strong {
  display: block;
  font: 700 1.35rem Montserrat;
  margin: 5px 0 1px;
}
.logistics-kpis small {
  color: var(--muted);
  font-size: 0.61rem;
}
.logistics-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 14px;
}
.logistics-main {
  display: grid;
  gap: 14px;
}
.routes-panel,
.shipments-panel,
.route-detail {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 18px;
  box-shadow: 0 6px 20px rgba(11, 59, 46, 0.035);
}
.logistics-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  margin-bottom: 14px;
}
.logistics-panel-head span,
.route-detail-head > div > span,
.route-stops > span,
.cold-chain p > span {
  font-size: 0.57rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--green);
}
.logistics-panel-head h3 {
  font: 700 0.9rem Montserrat;
  margin: 3px 0;
}
.logistics-panel-head > button {
  border: 0;
  background: transparent;
  color: var(--green);
  font-size: 0.62rem;
  font-weight: 700;
  cursor: pointer;
}
.route-filters {
  display: flex;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 2px;
}
.route-filters button {
  border: 0;
  background: transparent;
  color: var(--muted);
  border-radius: 4px;
  padding: 5px 8px;
  font-size: 0.54rem;
  cursor: pointer;
}
.route-filters button.active {
  background: var(--forest);
  color: #fff;
}
.route-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.route-card {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  padding: 11px;
  text-align: left;
  cursor: pointer;
}
.route-card:hover,
.route-card.selected {
  border-color: #83b979;
  box-shadow: 0 5px 14px rgba(11, 59, 46, 0.07);
}
.route-line {
  display: grid;
  grid-template-columns: 1fr 74px 1fr;
  gap: 6px;
  align-items: center;
  font-size: 0.51rem;
}
.route-line span:last-child {
  text-align: right;
}
.route-line > i {
  height: 4px;
  border-radius: 4px;
  background: #e7ece9;
}
.route-line > i > b {
  display: block;
  height: 100%;
  border-radius: 4px;
  background: var(--green);
}
.route-meta {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 10px;
  align-items: end;
  border-top: 1px solid #edf1ee;
  margin-top: 10px;
  padding-top: 8px;
}
.route-meta b,
.route-meta small {
  display: block;
}
.route-meta b {
  font-size: 0.6rem;
}
.route-meta small {
  font-size: 0.49rem;
  color: var(--muted);
}
.route-meta em {
  font-style: normal;
  font-size: 0.48rem;
  color: var(--green);
  background: #eaf5e8;
  padding: 4px 6px;
  border-radius: 9px;
}
.route-card.loading .route-meta em,
.route-card.scheduled .route-meta em {
  color: #91611d;
  background: #fff4df;
}
.route-card.done .route-meta em {
  color: #647169;
  background: #edf1ee;
}
.shipment-table > div {
  display: grid;
  grid-template-columns: 0.8fr 1fr 1.2fr 0.7fr 0.8fr 0.6fr;
  align-items: center;
  padding: 9px 8px;
  border-bottom: 1px solid #edf1ee;
  font-size: 0.58rem;
}
.shipment-head {
  background: #f6f8f7;
  border-radius: 5px;
  color: var(--muted);
  font-size: 0.5rem !important;
  font-weight: 800;
}
.shipment-table em {
  font-style: normal;
  padding: 4px 6px;
  border-radius: 9px;
  font-size: 0.49rem;
}
.shipment-table em.ready {
  color: #277c43;
  background: #e8f5eb;
}
.shipment-table em.checking {
  color: #386b96;
  background: #e7f1f9;
}
.shipment-table em.waiting {
  color: #9b681c;
  background: #fff4df;
}
.route-detail-head {
  display: flex;
  justify-content: space-between;
}
.route-detail-head h3 {
  font: 700 1rem Montserrat;
  margin: 4px 0;
}
.route-detail-head p {
  margin: 0;
  color: var(--muted);
  font-size: 0.54rem;
}
.route-detail-head > em {
  font-style: normal;
  font-size: 0.5rem;
  padding: 4px 7px;
  border-radius: 9px;
  height: max-content;
  color: #277c43;
  background: #e8f5eb;
}
.route-detail-head > em.loading,
.route-detail-head > em.scheduled {
  color: #91611d;
  background: #fff4df;
}
.route-detail-head > em.done {
  color: #647169;
  background: #edf1ee;
}
.route-progress {
  margin: 18px 0;
  padding: 14px;
  background: #f6f8f7;
  border-radius: 8px;
  display: grid;
  grid-template-columns: 55px 1fr auto;
  gap: 10px;
  align-items: center;
}
.route-progress > div strong,
.route-progress > div small {
  display: block;
}
.route-progress > div strong {
  font: 700 0.88rem Montserrat;
}
.route-progress > div small {
  font-size: 0.43rem;
  color: var(--muted);
}
.route-progress > i {
  height: 6px;
  border-radius: 6px;
  background: #dde6e0;
}
.route-progress > i > b {
  display: block;
  height: 100%;
  border-radius: 6px;
  background: linear-gradient(90deg, var(--green), var(--lime));
}
.route-progress > span b,
.route-progress > span em {
  display: block;
}
.route-progress > span b {
  font-size: 0.46rem;
  color: var(--muted);
}
.route-progress > span em {
  font-style: normal;
  font-size: 0.58rem;
  font-weight: 700;
}
.route-detail > dl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0;
}
.route-detail > dl > div {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 9px;
}
.route-detail dt {
  font-size: 0.47rem;
  color: var(--muted);
}
.route-detail dd {
  margin: 2px 0 0;
  font-size: 0.59rem;
  font-weight: 700;
}
.route-stops {
  border-top: 1px solid var(--line);
  margin-top: 16px;
  padding-top: 14px;
}
.route-stops > div {
  display: grid;
  grid-template-columns: 10px 1fr;
  gap: 8px;
  padding: 7px 0;
  position: relative;
}
.route-stops > div > i {
  width: 8px;
  height: 8px;
  border: 2px solid #b8c4bd;
  border-radius: 50%;
  margin-top: 4px;
}
.route-stops > div.complete > i {
  background: var(--green);
  border-color: var(--green);
}
.route-stops > div.current > i {
  border-color: var(--green);
  box-shadow: 0 0 0 3px #e5f1e3;
}
.route-stops p {
  margin: 0;
}
.route-stops b,
.route-stops small {
  display: block;
}
.route-stops b {
  font-size: 0.57rem;
}
.route-stops small {
  font-size: 0.48rem;
  color: var(--muted);
}
.cold-chain {
  display: flex;
  gap: 9px;
  align-items: center;
  background: #eaf3f8;
  border-radius: 7px;
  padding: 10px;
  margin-top: 10px;
}
.cold-chain > i {
  font-style: normal;
}
.cold-chain p {
  margin: 0;
}
.cold-chain p b,
.cold-chain p small {
  display: block;
}
.cold-chain p > span {
  color: #4b83a8;
}
.cold-chain p b {
  font-size: 0.58rem;
}
.cold-chain p small {
  font-size: 0.47rem;
  color: var(--muted);
}
.climate-alerts b {
  font-size: 0.6rem;
}
.climate-alerts small {
  font-size: 0.51rem;
  color: var(--muted);
  margin-top: 2px;
}
.coming-grid div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
}
.coming-grid b,
.coming-grid span {
  display: block;
}
.coming-grid span {
  color: var(--muted);
  font-size: 0.7rem;
  margin-top: 5px;
}
.mobile-backdrop {
  display: none;
}
@media (max-width: 1100px) {
  .climate-v2-kpis {
    grid-template-columns: repeat(4, 1fr);
  }
  .climate-v2-map-row {
    grid-template-columns: minmax(0, 1fr) 270px;
  }
  .climate-v2-bottom {
    grid-template-columns: 1fr 1fr;
  }
  .climate-v2-forecast {
    grid-column: 1 / -1;
  }
  .kpi-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .dashboard-grid {
    grid-template-columns: 1fr;
  }
  .units-panel {
    grid-column: auto;
  }
  .network-layout {
    grid-template-columns: 290px 1fr;
  }
  .unit-metrics {
    grid-template-columns: repeat(2, 1fr);
  }
  .production-layout {
    grid-template-columns: 1fr;
  }
  .production-aside {
    grid-template-columns: 1fr 1fr;
  }
  .tower-layout {
    grid-template-columns: minmax(0, 1fr) 300px;
  }
  .climate-layout {
    grid-template-columns: 1fr;
  }
  .climate-aside {
    grid-template-columns: 1fr 1fr;
  }
  .logistics-layout {
    grid-template-columns: 1fr;
  }
  .route-detail {
    grid-row: 1;
  }
  .route-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 760px) {
  .climate-v2-heading time {
    display: none;
  }
  .climate-v2-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .climate-v2-map-row,
  .climate-v2-bottom {
    grid-template-columns: 1fr;
  }
  .world-stations-map {
    min-height: 360px;
  }
  .station-directory {
    min-height: 0;
  }
  .station-list {
    max-height: 300px;
  }
  .climate-v2-forecast {
    grid-column: auto;
  }
  .sidebar {
    transform: translateX(-100%);
    transition: 0.2s;
  }
  .sidebar.open {
    transform: none;
  }
  .mobile-backdrop.open {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 35;
  }
  main {
    margin-left: 0;
  }
  .topbar {
    padding: 0 16px;
    height: 72px;
  }
  .mobile-menu {
    display: block;
  }
  .topbar > div:first-of-type {
    flex: 1;
    margin-left: 9px;
  }
  .topbar h1 {
    font-size: 1rem;
  }
  .demo-status {
    display: none;
  }
  .demo-strip {
    padding: 7px 16px;
  }
  .role-preview {
    font-size: 0;
  }
  .role-preview select {
    max-width: 138px;
  }
  .notification {
    display: none;
  }
  .content {
    padding: 22px 15px 38px;
  }
  .welcome-row {
    align-items: start;
    gap: 18px;
  }
  .period {
    display: none;
  }
  .kpi-grid {
    grid-template-columns: 1fr 1fr;
  }
  .dashboard-grid {
    grid-template-columns: 1fr;
  }
  .opportunity-list > div {
    grid-template-columns: 38px 1fr auto;
  }
  .opportunity-list em {
    display: none;
  }
  .unit-table > div {
    grid-template-columns: 1.5fr 1fr 1fr;
  }
  .unit-table > div > *:nth-child(3) {
    display: none;
  }
  .module-placeholder .coming-grid {
    grid-template-columns: 1fr;
  }
  .institutional-hero {
    grid-template-columns: 1fr;
    min-height: 0;
    padding: 28px;
  }
  .institutional-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .cycle-flow {
    grid-template-columns: 1fr;
  }
  .cycle-flow > i {
    display: none;
  }
  .institutional-bottom {
    grid-template-columns: 1fr;
  }
  .network-heading {
    align-items: start;
  }
  .network-stats {
    grid-template-columns: repeat(2, 1fr);
  }
  .network-layout {
    grid-template-columns: 1fr;
  }
  .tree-panel {
    max-height: 430px;
    overflow: auto;
  }
  .unit-bottom {
    grid-template-columns: 1fr;
  }
  .unit-bottom > div {
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding-bottom: 10px;
  }
  .sector-grid {
    grid-template-columns: 1fr;
  }
  .production-heading {
    align-items: start;
    gap: 15px;
  }
  .production-filters {
    display: none;
  }
  .production-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .market-guidance {
    grid-template-columns: 38px 1fr;
  }
  .market-guidance button {
    display: none;
  }
  .crop-columns {
    grid-template-columns: 1fr;
    max-height: none;
  }
  .production-aside {
    grid-template-columns: 1fr;
  }
  .towers-heading {
    align-items: start;
  }
  .tower-filters {
    display: none;
  }
  .tower-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .tower-layout {
    grid-template-columns: 1fr;
  }
  .tower-detail {
    grid-row: 1;
  }
  .tower-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .climate-heading {
    align-items: start;
  }
  .weather-hero {
    grid-template-columns: 1fr;
  }
  .current-weather {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    padding: 0 0 16px;
  }
  .weather-metrics {
    margin-top: 9px;
  }
  .weather-metrics article {
    padding: 10px;
  }
  .environment-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .climate-aside {
    grid-template-columns: 1fr;
  }
  .logistics-heading {
    align-items: start;
  }
  .logistics-heading label {
    display: none;
  }
  .logistics-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .shipment-table > div {
    grid-template-columns: 1fr 1fr 1fr 0.8fr;
  }
  .shipment-table > div > *:nth-child(2),
  .shipment-table > div > *:nth-child(6) {
    display: none;
  }
}
@media (max-width: 480px) {
  .climate-v2-heading h2 {
    font-size: 1.35rem;
  }
  .climate-v2-heading p {
    font-size: 0.7rem;
  }
  .climate-v2-kpis {
    grid-template-columns: 1fr;
  }
  .world-stations-map {
    min-height: 330px;
  }
  .map-filter {
    left: 12px;
    right: 12px;
    top: 58px;
    min-width: 0;
  }
  .map-filter p {
    flex-wrap: wrap;
  }
  .current-station-body {
    grid-template-columns: 1fr;
  }
  .climate-v2-forecast > div {
    grid-template-columns: repeat(3, 1fr);
  }
  .kpi-grid {
    grid-template-columns: 1fr;
  }
  .welcome-row h2 {
    font-size: 1.28rem;
  }
  .role-preview {
    display: none;
  }
  .locked-role-badge {
    max-width: 145px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .topbar p {
    display: none;
  }
  .demo-strip {
    display: block;
    line-height: 1.3;
  }
  .demo-strip span {
    display: none;
  }
  .chart-area {
    height: 190px;
  }
  .region-bars {
    gap: 7px;
  }
  .region-bars span {
    font-size: 0.5rem;
  }
  .module-placeholder {
    padding: 24px;
  }
  .institutional-hero {
    padding: 23px;
  }
  .institutional-hero h2 {
    font-size: 1.55rem;
  }
  .institutional-grid,
  .future-roadmap ol {
    grid-template-columns: 1fr;
  }
  .institutional-card {
    min-height: 0;
  }
  .vertkal-cycle,
  .future-roadmap,
  .future-statement {
    padding: 22px;
  }
  .unit-table > div {
    grid-template-columns: 1.4fr 1fr;
  }
  .unit-table > div > *:nth-child(2) {
    display: none;
  }
  .network-heading .primary-action {
    display: none;
  }
  .unit-metrics {
    grid-template-columns: 1fr 1fr;
  }
  .production-kpis {
    grid-template-columns: 1fr;
  }
  .production-heading h2 {
    font-size: 1.3rem;
  }
  .lot-toast {
    left: 15px;
    right: 15px;
    bottom: 15px;
  }
  .tower-kpis {
    grid-template-columns: 1fr;
  }
  .tower-grid {
    grid-template-columns: 1fr;
  }
  .tower-list-head {
    display: block;
  }
  .status-filter {
    width: max-content;
    margin-top: 10px;
  }
  .towers-heading h2 {
    font-size: 1.3rem;
  }
  .climate-heading h2 {
    font-size: 1.3rem;
  }
  .weather-metrics {
    grid-template-columns: 1fr 1fr;
  }
  .weather-metrics article:nth-child(2) {
    border-right: 0;
  }
  .climate-heading label {
    display: none;
  }
  .climate-chart svg,
  .chart-labels {
    height: 150px;
  }
  .logistics-heading h2 {
    font-size: 1.3rem;
  }
  .logistics-kpis {
    grid-template-columns: 1fr;
  }
  .route-list {
    grid-template-columns: 1fr;
  }
  .route-filters {
    margin-top: 10px;
    width: max-content;
  }
  .logistics-panel-head {
    display: block;
  }
  .shipment-table > div {
    grid-template-columns: 1fr 1fr;
  }
  .shipment-table > div > *:nth-child(3),
  .shipment-table > div > *:nth-child(4) {
    display: none;
  }
}

/* Production planning v2 */
.production-v2 { --plan-blue:#2f7fd1; --plan-amber:#d78927; }
.production-v2 .production-heading { align-items:center; }
.production-primary { align-self:end; min-height:34px; border:0; border-radius:7px; padding:0 14px; background:var(--forest); color:#fff; font-weight:700; font-size:.68rem; cursor:pointer; }
.planning-tabs { display:flex; gap:4px; width:max-content; padding:3px; margin:0 0 14px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.planning-tabs button { border:0; border-radius:6px; padding:8px 16px; background:transparent; color:var(--muted); font-size:.68rem; font-weight:700; cursor:pointer; }
.planning-tabs button.active { background:var(--forest); color:#fff; box-shadow:0 2px 8px rgba(11,59,46,.15); }
.production-kpis-v2 { grid-template-columns:repeat(5,1fr); }
.production-kpis .positive { color:#22884b; }
.production-kpis .warning { color:#c5731f; }
.planning-guidance { margin-top:0; }
.planning-insight-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(260px,.7fr); gap:14px; margin-bottom:14px; }
.demand-balance,.crop-allocation,.planning-calendar,.calendar-summary article,.scenario-controls,.scenario-result,.scenario-comparison { background:#fff; border:1px solid var(--line); border-radius:9px; padding:18px; box-shadow:0 6px 20px rgba(11,59,46,.035); }
.production-panel-head > em { color:var(--muted); font-size:.57rem; font-style:normal; }
.balance-chart { display:grid; grid-template-columns:32px 1fr; height:175px; margin-top:3px; }
.balance-axis { display:flex; flex-direction:column; justify-content:space-between; padding-bottom:20px; color:var(--muted); font-size:.5rem; }
.balance-bars { display:grid; grid-template-columns:repeat(8,1fr); align-items:end; gap:12px; padding:0 10px 20px; background:repeating-linear-gradient(to bottom,#edf1ee 0,#edf1ee 1px,transparent 1px,transparent 25%); }
.balance-bars > div { height:100%; display:flex; align-items:end; justify-content:center; gap:3px; position:relative; }
.balance-bars i { width:11px; min-height:5px; border-radius:3px 3px 0 0; }
.balance-bars i.demand { background:#b9c8c0; }
.balance-bars i.offer { background:linear-gradient(#63be70,#25874f); }
.balance-bars span { position:absolute; bottom:-16px; font-size:.49rem; color:var(--muted); }
.chart-legend { display:flex; justify-content:flex-end; gap:14px; color:var(--muted); font-size:.55rem; }
.chart-legend span { display:flex; align-items:center; gap:5px; }
.chart-legend i { width:8px; height:8px; border-radius:2px; background:#b9c8c0; }
.chart-legend i.offer { background:#399b5b; }
.crop-allocation { display:grid; grid-template-columns:120px 1fr; align-content:start; column-gap:16px; }
.crop-allocation .production-panel-head { grid-column:1/-1; }
.allocation-ring { width:112px; height:112px; border-radius:50%; display:grid; place-items:center; background:conic-gradient(#e95c65 0 48%,#52a765 48% 81%,#e3a342 81%); position:relative; }
.allocation-ring:after { content:""; position:absolute; inset:16px; background:#fff; border-radius:50%; }
.allocation-ring div { position:relative; z-index:1; text-align:center; }
.allocation-ring strong,.allocation-ring small { display:block; }
.allocation-ring strong { font:700 1.15rem Montserrat; }
.allocation-ring small { color:var(--muted); font-size:.48rem; }
.crop-allocation ul { list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.crop-allocation li { display:grid; grid-template-columns:8px 1fr auto; gap:7px; align-items:center; }
.crop-allocation li > i { width:7px; height:28px; border-radius:4px; background:#e95c65; }
.crop-allocation li > i.lettuce { background:#52a765; }.crop-allocation li > i.tomato { background:#e3a342; }
.crop-allocation li b,.crop-allocation li small { display:block; font-size:.58rem; }.crop-allocation li small { color:var(--muted); font-size:.5rem; }.crop-allocation li strong { font-size:.66rem; }
.planning-main { grid-template-columns:minmax(0,1fr) 325px; }
.planning-actions > div { display:grid; grid-template-columns:58px 1fr auto; gap:9px; align-items:center; padding:10px 0; border-bottom:1px solid #edf1ee; }
.planning-actions > div:last-child { border:0; }.planning-actions time { font-size:.54rem; font-weight:800; color:var(--green); }.planning-actions time small { display:block; color:var(--muted); font-size:.48rem; margin-top:3px; }.planning-actions p { margin:0; }.planning-actions p b,.planning-actions p small { display:block; font-size:.58rem; }.planning-actions p small { color:var(--muted); font-size:.5rem; }.planning-actions em { font-size:.5rem; font-style:normal; color:#25874f; }.planning-actions em.warning { color:#c5731f; }
.planning-calendar-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:14px; }
.calendar-toolbar { display:flex; justify-content:space-between; align-items:center; margin-bottom:17px; }.calendar-toolbar span { color:var(--green); font-size:.56rem; font-weight:800; letter-spacing:.08em; }.calendar-toolbar h3 { margin:3px 0; font:700 .95rem Montserrat; }.calendar-toolbar button { border:1px solid var(--line); background:#fff; padding:6px 9px; color:var(--ink); font-size:.58rem; cursor:pointer; }.calendar-toolbar button:first-child { border-radius:6px 0 0 6px; }.calendar-toolbar button:last-child { border-radius:0 6px 6px 0; }
.calendar-weeks { overflow:hidden; border:1px solid var(--line); border-radius:7px; }.calendar-labels,.calendar-row { display:grid; grid-template-columns:150px repeat(6,1fr); }.calendar-labels { background:#f3f6f4; }.calendar-labels span { padding:8px 7px; border-right:1px solid var(--line); color:var(--muted); font-size:.49rem; text-align:center; }.calendar-labels span:first-child { text-align:left; font-weight:800; }
.calendar-row { min-height:55px; border-top:1px solid var(--line); }.calendar-row > p { margin:0; padding:10px; }.calendar-row p b,.calendar-row p small { display:block; font-size:.56rem; }.calendar-row p small { margin-top:3px; color:var(--muted); font-size:.47rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.calendar-track { grid-column:2/-1; display:grid; grid-template-columns:repeat(6,1fr); align-items:center; background:repeating-linear-gradient(to right,transparent 0,transparent calc(16.666% - 1px),#edf1ee calc(16.666% - 1px),#edf1ee 16.666%); }.calendar-bar { grid-column:calc(var(--start) + 1)/span var(--span); height:30px; margin:0 4px; border:0; border-radius:5px; padding:0 8px; display:flex; align-items:center; justify-content:space-between; background:#edf8f0; color:#257c48; cursor:pointer; font-size:.49rem; font-weight:700; }.calendar-bar.strawberry { background:#fff0f1; color:#c74e58; }.calendar-bar.herb { background:#fff6e7; color:#b16c16; }.calendar-bar em { font-style:normal; opacity:.7; }
.calendar-summary { display:grid; gap:14px; align-content:start; }.calendar-summary article > span { color:var(--green); font-size:.56rem; font-weight:800; letter-spacing:.08em; }.calendar-summary h3 { margin:4px 0 14px; font:700 .86rem Montserrat; }.calendar-summary dl { margin:0; }.calendar-summary dl div { display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid #edf1ee; }.calendar-summary dt { color:var(--muted); font-size:.57rem; }.calendar-summary dd { margin:0; font-size:.61rem; font-weight:800; }.conflict-item { display:grid; grid-template-columns:26px 1fr; gap:8px; padding:9px; margin-top:8px; border-radius:6px; background:#fff7eb; }.conflict-item i { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:#f2a33d; color:#fff; font-style:normal; font-weight:800; }.conflict-item p { margin:0; }.conflict-item b,.conflict-item small { display:block; font-size:.57rem; }.conflict-item small { margin-top:3px; color:var(--muted); font-size:.49rem; }
.scenario-grid { display:grid; grid-template-columns:280px minmax(0,1fr); gap:14px; }.scenario-controls { align-self:start; }.scenario-controls > label { display:block; margin:0 0 14px; color:var(--muted); font-size:.58rem; font-weight:700; }.scenario-controls select,.scenario-controls input[type=number] { width:100%; margin-top:5px; border:1px solid var(--line); border-radius:6px; padding:9px; background:#fff; color:var(--ink); font-size:.63rem; }.range-row { display:grid; grid-template-columns:1fr 42px; align-items:center; gap:8px; margin-top:6px; }.range-row input { accent-color:var(--green); }.range-row output { color:var(--green); font-size:.68rem; font-weight:800; text-align:right; }.scenario-controls > button,.scenario-result > button { width:100%; border:0; border-radius:7px; padding:10px; background:var(--forest); color:#fff; font-size:.64rem; font-weight:800; cursor:pointer; }
.scenario-score { display:grid; grid-template-columns:90px 1fr; align-items:center; gap:18px; padding:14px; border-radius:8px; background:#f1f8f3; }.scenario-score > div { text-align:center; border-right:1px solid #d6e8da; }.scenario-score strong,.scenario-score small { display:block; }.scenario-score strong { color:var(--green); font:700 1.65rem Montserrat; }.scenario-score small { color:var(--muted); font-size:.47rem; }.scenario-score p { margin:0; color:#466158; font-size:.65rem; line-height:1.5; }.scenario-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin:12px 0; }.scenario-metrics div { padding:10px; border:1px solid var(--line); border-radius:7px; }.scenario-metrics span,.scenario-metrics strong,.scenario-metrics small { display:block; }.scenario-metrics span { color:var(--muted); font-size:.5rem; }.scenario-metrics strong { margin:4px 0; font-size:.76rem; }.scenario-metrics small { color:#22884b; font-size:.49rem; }.scenario-recommendations { margin-bottom:13px; }.scenario-recommendations h4 { font-size:.66rem; }.scenario-recommendations > div { display:grid; grid-template-columns:30px 1fr auto; gap:8px; align-items:center; padding:8px 0; border-top:1px solid #edf1ee; }.scenario-recommendations .crop { width:29px; height:29px; }.scenario-recommendations p { margin:0; }.scenario-recommendations p b,.scenario-recommendations p small { display:block; font-size:.57rem; }.scenario-recommendations p small { color:var(--muted); font-size:.49rem; }.scenario-recommendations > div > strong { font-size:.58rem; }
.scenario-comparison { grid-column:1/-1; }.scenario-table .head,.scenario-table button { width:100%; display:grid; grid-template-columns:1.4fr repeat(4,1fr); align-items:center; gap:8px; text-align:left; }.scenario-table .head { padding:8px 11px; background:#f4f7f5; color:var(--muted); font-size:.5rem; font-weight:800; }.scenario-table button { border:0; border-top:1px solid var(--line); padding:10px 11px; background:#fff; color:var(--ink); cursor:pointer; font-size:.58rem; }.scenario-table button.selected { background:#f0f8f2; box-shadow:inset 3px 0 var(--green); }.scenario-table button b,.scenario-table button small { display:block; }.scenario-table button small { margin-top:2px; color:var(--muted); font-size:.48rem; }.scenario-table button em { width:max-content; }
.plan-modal[hidden] { display:none; }.plan-modal { position:fixed; inset:0; z-index:120; display:grid; place-items:center; padding:20px; background:rgba(3,25,18,.62); backdrop-filter:blur(3px); }.plan-modal form { width:min(590px,100%); background:#fff; border-radius:12px; box-shadow:0 24px 70px rgba(0,0,0,.3); overflow:hidden; }.plan-modal header { display:flex; align-items:center; justify-content:space-between; padding:18px 20px; border-bottom:1px solid var(--line); }.plan-modal header span { color:var(--green); font-size:.55rem; font-weight:800; letter-spacing:.08em; }.plan-modal header h3 { margin:3px 0 0; font:700 1rem Montserrat; }.plan-modal header button { border:0; background:transparent; color:var(--muted); font-size:1.4rem; cursor:pointer; }.plan-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:13px; padding:20px; }.plan-form-grid label { color:var(--muted); font-size:.58rem; font-weight:700; }.plan-form-grid select,.plan-form-grid input { width:100%; margin-top:5px; border:1px solid var(--line); border-radius:6px; padding:10px; color:var(--ink); background:#fff; font-size:.65rem; }.plan-modal aside { margin:0 20px 18px; padding:11px 13px; border-radius:7px; background:#f1f8f3; }.plan-modal aside strong,.plan-modal aside small { display:block; font-size:.61rem; }.plan-modal aside small { margin-top:4px; color:var(--muted); font-size:.53rem; }.plan-modal footer { display:flex; justify-content:flex-end; gap:8px; padding:14px 20px; background:#f7f9f8; border-top:1px solid var(--line); }.plan-modal footer button { border:1px solid var(--line); border-radius:6px; padding:9px 14px; background:#fff; color:var(--ink); font-size:.62rem; font-weight:700; cursor:pointer; }.plan-modal footer button[type=submit] { border-color:var(--forest); background:var(--forest); color:#fff; }.modal-open { overflow:hidden; }
@media (max-width:1200px) { .production-kpis-v2 { grid-template-columns:repeat(3,1fr); }.planning-main { grid-template-columns:1fr; }.production-aside { grid-template-columns:1fr 1fr; } }
@media (max-width:900px) { .planning-insight-grid,.planning-calendar-layout,.scenario-grid { grid-template-columns:1fr; }.scenario-comparison { grid-column:auto; }.calendar-weeks { overflow-x:auto; }.calendar-labels,.calendar-row { min-width:760px; }.crop-allocation { grid-template-columns:120px 1fr; }.production-v2 .production-filters { display:flex; flex-wrap:wrap; }.production-primary { align-self:end; } }
@media (max-width:760px) { .production-v2 .production-heading { align-items:flex-start; }.production-v2 .production-filters { display:grid; grid-template-columns:1fr 1fr; width:100%; }.production-primary { grid-column:1/-1; height:38px; }.production-kpis-v2 { grid-template-columns:1fr 1fr; }.planning-tabs { width:100%; }.planning-tabs button { flex:1; padding:8px 5px; }.production-aside { grid-template-columns:1fr; }.scenario-metrics { grid-template-columns:1fr 1fr; }.scenario-table { overflow-x:auto; }.scenario-table .head,.scenario-table button { min-width:620px; }.plan-form-grid { grid-template-columns:1fr; max-height:55vh; overflow:auto; } }
@media (max-width:480px) { .production-kpis-v2 { grid-template-columns:1fr; }.planning-guidance { grid-template-columns:34px 1fr; }.crop-allocation { grid-template-columns:1fr; }.allocation-ring { margin:0 auto 14px; }.scenario-score { grid-template-columns:1fr; }.scenario-score > div { border-right:0; border-bottom:1px solid #d6e8da; padding-bottom:10px; }.scenario-metrics { grid-template-columns:1fr; } }

/* Complete operational modules */
.module-pro-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:18px}.module-pro-heading h2{font:700 1.55rem Montserrat;margin:5px 0}.module-pro-heading p{margin:0;color:var(--muted);font-size:.8rem}.module-filters{display:flex;align-items:end;gap:8px}.module-filters label{color:var(--muted);font-size:.58rem;font-weight:700}.module-filters select,.compact-filters select,.compact-filters input,.users-list input{display:block;margin-top:4px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);padding:8px 28px 8px 9px;font-size:.63rem}.module-filters button,.pro-primary{height:34px;border:0;border-radius:7px;padding:0 14px;background:var(--forest);color:#fff;font-size:.63rem;font-weight:700;cursor:pointer}.pro-kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:11px;margin-bottom:14px}.pro-kpis article{padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:#fff}.pro-kpis span,.pro-kpis strong,.pro-kpis small{display:block}.pro-kpis span{color:var(--muted);font-size:.54rem;font-weight:800;letter-spacing:.06em}.pro-kpis strong{margin:5px 0 2px;font:700 1.16rem Montserrat}.pro-kpis small{color:var(--muted);font-size:.55rem}.pro-kpis small.up{color:#24874c}.pro-kpis small.down{color:#c54e4e}.pro-card{background:#fff;border:1px solid var(--line);border-radius:9px;padding:17px;box-shadow:0 6px 20px rgba(11,59,46,.035)}.pro-card-head{display:flex;align-items:start;justify-content:space-between;gap:10px;margin-bottom:13px}.pro-card-head span{color:var(--green);font-size:.54rem;font-weight:800;letter-spacing:.08em}.pro-card-head h3{font:700 .86rem Montserrat;margin:3px 0}.pro-card-head small{color:var(--muted);font-size:.52rem}.pro-card-head button{border:0;background:transparent;color:var(--green);font-size:.56rem;font-weight:700;cursor:pointer}.market-pro-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(260px,.7fr);gap:14px}.price-history{min-height:310px}.period-pills{display:flex;padding:2px;border:1px solid var(--line);border-radius:6px}.period-pills button{border:0;border-radius:4px;background:transparent;padding:5px 8px;color:var(--muted);font-size:.52rem;cursor:pointer}.period-pills button.active{background:var(--forest);color:#fff}.market-line-chart{height:205px;display:grid;grid-template-columns:28px 1fr;position:relative}.market-y{display:flex;flex-direction:column;justify-content:space-between;padding-bottom:22px;color:var(--muted);font-size:.49rem}.market-line-chart svg{width:100%;height:180px;background:repeating-linear-gradient(to bottom,#edf1ee 0,#edf1ee 1px,transparent 1px,transparent 25%)}.market-line-chart path.area{fill:url(#marketFill)}.market-line-chart path.line{fill:none;stroke:#299354;stroke-width:3;vector-effect:non-scaling-stroke}.market-x{position:absolute;left:28px;right:0;bottom:0;display:flex;justify-content:space-between;color:var(--muted);font-size:.48rem}.chart-note{display:flex;justify-content:space-between;padding:9px 11px;border-radius:6px;background:#f1f8f3;font-size:.55rem}.chart-note span{color:var(--muted)}.opportunity-ranking{grid-row:span 2}.opportunity-ranking>button{width:100%;display:grid;grid-template-columns:20px 30px 1fr auto;align-items:center;gap:8px;padding:10px 0;border:0;border-bottom:1px solid #edf1ee;background:#fff;color:var(--ink);text-align:left;cursor:pointer}.opportunity-ranking>button>em{color:var(--muted);font-size:.55rem;font-style:normal}.opportunity-ranking .crop{width:29px;height:29px}.opportunity-ranking p{margin:0}.opportunity-ranking p b,.opportunity-ranking p small{display:block;font-size:.58rem}.opportunity-ranking p small{color:var(--muted);font-size:.49rem}.opportunity-ranking>button>strong{font-size:.69rem}.pepper{background:#fff0db;color:#aa6516}.ceasa-table{min-width:0}.pro-table .head,.pro-table>div:not(.head){display:grid;grid-template-columns:1.4fr repeat(3,1fr);align-items:center;gap:8px}.pro-table .head{padding:7px 9px;background:#f4f7f5;color:var(--muted);font-size:.49rem;font-weight:800}.pro-table>div:not(.head){padding:9px;border-bottom:1px solid #edf1ee;font-size:.57rem}.pro-table b,.pro-table small{display:block}.pro-table small{color:var(--muted);font-size:.47rem}.pro-table em{color:#23854a;font-style:normal;font-weight:700}.signal-list>div{display:grid;grid-template-columns:28px 1fr;gap:8px;padding:10px 0;border-top:1px solid #edf1ee}.signal-list>div>i{width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:#edf6fc;color:#2f7fd1;font-style:normal}.signal-list>div>i.high{background:#eaf7ee;color:#23854a}.signal-list>div>i.warn{background:#fff3e4;color:#c27621}.signal-list p{margin:0}.signal-list b,.signal-list small{display:block;font-size:.57rem}.signal-list small{margin-top:3px;color:var(--muted);font-size:.49rem;line-height:1.45}.commercial-pipeline{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}.commercial-pipeline>div{position:relative;overflow:hidden;display:grid;grid-template-columns:1fr auto;gap:2px;padding:13px 15px;border:1px solid var(--line);border-radius:8px;background:#fff}.commercial-pipeline i{position:absolute;left:0;bottom:0;width:var(--pipeline);height:3px;background:linear-gradient(90deg,var(--green),var(--lime))}.commercial-pipeline span,.commercial-pipeline small{color:var(--muted);font-size:.55rem}.commercial-pipeline strong{font-size:.8rem}.commercial-pipeline small{grid-column:1/-1}.commercial-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px}.compact-filters{display:flex;gap:7px}.compact-filters input{width:180px;margin:0}.compact-filters select{margin:0}.orders-table .head,.orders-table>button{width:100%;display:grid;grid-template-columns:1.4fr 1fr .7fr .7fr .8fr;align-items:center;gap:8px;text-align:left}.orders-table .head{padding:8px 10px;background:#f4f7f5;color:var(--muted);font-size:.49rem;font-weight:800}.orders-table>button{border:0;border-bottom:1px solid #edf1ee;padding:10px;background:#fff;color:var(--ink);font-size:.56rem;cursor:pointer}.orders-table>button:hover{background:#f7faf8}.orders-table b,.orders-table small{display:block}.orders-table small{margin-top:2px;color:var(--muted);font-size:.48rem}.orders-table em{width:max-content;border-radius:12px;padding:4px 7px;background:#eaf7ee;color:#22854a;font-size:.49rem;font-style:normal}.orders-table em.negotiation{background:#fff3e4;color:#b96e1d}.orders-table em.risk{background:#fdecec;color:#bc4646}.commercial-side{display:grid;gap:14px;align-content:start}.future-stock>div,.client-health>div{display:grid;grid-template-columns:32px 1fr auto;gap:8px;align-items:center;padding:10px 0;border-top:1px solid #edf1ee}.future-stock .crop{width:30px;height:30px}.future-stock p,.client-health p{margin:0}.future-stock b,.future-stock small,.client-health b,.client-health small{display:block;font-size:.57rem}.future-stock small,.client-health small{color:var(--muted);font-size:.48rem}.future-stock strong{font-size:.58rem}.client-health>div>span{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#edf4ef;color:var(--forest);font-size:.52rem;font-weight:800}.client-health em{color:#23854a;font-size:.49rem;font-style:normal}.client-health em.warn{color:#b96e1d}.simple-modal[hidden]{display:none}.simple-modal{position:fixed;inset:0;z-index:125;display:grid;place-items:center;padding:20px;background:rgba(3,25,18,.62);backdrop-filter:blur(3px)}.simple-modal form{width:min(520px,100%);overflow:hidden;border-radius:11px;background:#fff}.simple-modal header{display:flex;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--line)}.simple-modal header span{color:var(--green);font-size:.54rem;font-weight:800}.simple-modal header h3{margin:3px 0;font:700 .92rem Montserrat}.simple-modal header button{border:0;background:transparent;font-size:1.3rem;cursor:pointer}.simple-modal form>div{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:20px}.simple-modal label{color:var(--muted);font-size:.57rem;font-weight:700}.simple-modal input,.simple-modal select{width:100%;margin-top:5px;padding:9px;border:1px solid var(--line);border-radius:6px;background:#fff}.simple-modal footer{display:flex;justify-content:flex-end;gap:8px;padding:13px 20px;background:#f6f8f7}.simple-modal footer button{padding:8px 12px;border:1px solid var(--line);border-radius:6px;background:#fff;font-size:.59rem;font-weight:700;cursor:pointer}.simple-modal footer button[type=submit]{border-color:var(--forest);background:var(--forest);color:#fff}.alert-filter{display:flex;padding:3px;border:1px solid var(--line);border-radius:7px;background:#fff}.alert-filter button{border:0;border-radius:5px;padding:7px 10px;background:transparent;color:var(--muted);font-size:.57rem;font-weight:700;cursor:pointer}.alert-filter button.active{background:var(--forest);color:#fff}.alerts-layout{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(400px,1.15fr) 260px;gap:14px}.alert-queue{padding:10px}.alert-queue .pro-card-head{padding:7px}.alert-queue>button{width:100%;display:grid;grid-template-columns:7px 1fr auto;gap:9px;align-items:center;padding:11px 8px;border:0;border-top:1px solid #edf1ee;background:#fff;color:var(--ink);text-align:left;cursor:pointer}.alert-queue>button.selected{border-radius:6px;background:#f2f8f4}.alert-queue>button>i{width:7px;height:37px;border-radius:5px;background:#7fa08e}.alert-queue>button>i.critical{background:#dc5555}.alert-queue>button>i.attention{background:#e4a23d}.alert-queue p{margin:0}.alert-queue p b,.alert-queue p small,.alert-queue p em{display:block;font-size:.57rem}.alert-queue p small,.alert-queue p em{margin-top:3px;color:var(--muted);font-size:.48rem;font-style:normal}.alert-queue>button>span{color:var(--muted);font-size:.48rem}.alert-detail header{display:grid;grid-template-columns:1fr auto;gap:10px}.alert-detail header span{color:var(--green);font-size:.54rem;font-weight:800}.alert-detail header h3{margin:5px 0;font:700 .9rem Montserrat}.alert-detail header p{margin:0;color:var(--muted);font-size:.52rem}.alert-detail header>em{height:max-content;border-radius:12px;padding:5px 8px;background:#fdecec;color:#bd4646;font-size:.5rem;font-style:normal}.alert-detail header>em.attention{background:#fff3e4;color:#b96e1d}.alert-detail header>em.service{background:#edf4ef;color:#416a55}.alert-reading{margin:15px 0;padding:12px;border-radius:7px;background:#f6f8f7}.alert-reading span{color:var(--green);font-size:.5rem;font-weight:800}.alert-reading p{margin:6px 0 0;color:#425e54;font-size:.6rem;line-height:1.5}.alert-detail dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0}.alert-detail dl div{padding:9px;border:1px solid var(--line);border-radius:6px}.alert-detail dt{color:var(--muted);font-size:.49rem}.alert-detail dd{margin:4px 0 0;font-size:.58rem;font-weight:700}.alert-timeline h4{font-size:.62rem}.alert-timeline>div{display:grid;grid-template-columns:14px 1fr;gap:8px;padding:5px 0}.alert-timeline i{width:9px;height:9px;margin-top:3px;border-radius:50%;background:#2c9856}.alert-timeline .pending i{background:#e0a03c}.alert-timeline p{margin:0}.alert-timeline b,.alert-timeline small{display:block;font-size:.54rem}.alert-timeline small{color:var(--muted);font-size:.47rem}.alert-detail footer{display:flex;gap:8px;margin-top:14px}.alert-detail footer button{flex:1;border:1px solid var(--forest);border-radius:6px;padding:8px;background:#fff;color:var(--forest);font-size:.56rem;font-weight:700;cursor:pointer}.alert-detail footer button:last-child{background:var(--forest);color:#fff}.alerts-side{display:grid;gap:14px;align-content:start}.alert-area-bars>div{margin:12px 0}.alert-area-bars p{display:flex;justify-content:space-between;margin:0 0 5px;font-size:.54rem}.alert-area-bars>div>i{display:block;height:5px;border-radius:5px;background:#edf1ee}.alert-area-bars>div>i>b{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--green),var(--lime))}.sla-ring{width:118px;height:118px;margin:7px auto;display:grid;place-items:center;border-radius:50%;background:conic-gradient(var(--green) 0 78%,#e9eeeb 78%);position:relative}.sla-ring:after{content:"";position:absolute;inset:14px;border-radius:50%;background:#fff}.sla-ring div{position:relative;z-index:1;text-align:center}.sla-ring strong,.sla-ring small{display:block}.sla-ring strong{font:700 1.1rem Montserrat}.sla-ring small{color:var(--muted);font-size:.47rem}.sla-note{text-align:center;color:var(--muted);font-size:.52rem}.users-layout{display:grid;grid-template-columns:minmax(280px,.7fr) minmax(420px,1.2fr) 280px;gap:14px}.users-list .pro-card-head{align-items:center}.users-list input{width:125px;margin:0}.users-list>button{width:100%;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:9px;padding:10px 6px;border:0;border-top:1px solid #edf1ee;background:#fff;color:var(--ink);text-align:left;cursor:pointer}.users-list>button.selected{border-radius:6px;background:#f1f8f3}.users-list>button>span,.user-detail header>span{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#1b503d,#79c347);color:#fff;font-size:.54rem;font-weight:800}.users-list p{margin:0}.users-list p b,.users-list p small{display:block;font-size:.57rem}.users-list p small{color:var(--muted);font-size:.48rem}.users-list em{font-size:.48rem}.user-detail header{display:grid;grid-template-columns:44px 1fr auto;gap:10px;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--line)}.user-detail header>span{width:44px;height:44px}.user-detail header h3{margin:0;font:700 .88rem Montserrat}.user-detail header p{margin:3px 0;color:var(--muted);font-size:.52rem}.user-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.user-meta div{padding:9px;border-radius:6px;background:#f6f8f7}.user-meta span,.user-meta strong{display:block}.user-meta span{color:var(--muted);font-size:.46rem}.user-meta strong{margin-top:4px;font-size:.56rem}.permission-head{display:flex;align-items:end;justify-content:space-between}.permission-head span{color:var(--green);font-size:.5rem;font-weight:800}.permission-head h4{margin:3px 0;font-size:.66rem}.permission-head button{border:0;background:transparent;color:var(--green);font-size:.54rem;font-weight:700;cursor:pointer}.module-chips{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0 14px}.module-chips span{padding:5px 7px;border-radius:13px;background:#edf7ef;color:#277a49;font-size:.48rem}.access-rule{display:flex;align-items:center;justify-content:center;gap:7px;padding:12px;border-radius:7px;background:#f5f8f6}.access-rule>div{display:flex;align-items:center;gap:6px}.access-rule b{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:var(--forest);color:#fff;font-size:.5rem}.access-rule strong,.access-rule small{display:block;font-size:.51rem}.access-rule small{color:var(--muted);font-size:.44rem}.access-rule>i{color:var(--muted);font-style:normal}.user-detail footer{display:flex;justify-content:flex-end;gap:7px;margin-top:14px}.user-detail footer button{border:1px solid var(--line);border-radius:6px;padding:7px 10px;background:#fff;color:var(--ink);font-size:.53rem;font-weight:700;cursor:pointer}.user-detail footer button.danger{color:#bc4646}.users-side{display:grid;gap:14px;align-content:start}.profile-count>div{display:grid;grid-template-columns:30px 1fr auto;gap:8px;align-items:center;padding:9px 0;border-top:1px solid #edf1ee}.profile-count>div>span{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;background:#edf4ef;color:var(--forest);font-size:.52rem;font-weight:800}.profile-count p,.security-card p{margin:0}.profile-count b,.profile-count small,.security-card b,.security-card small{display:block;font-size:.55rem}.profile-count small,.security-card small{color:var(--muted);font-size:.47rem}.security-card>div:not(.pro-card-head){display:grid;grid-template-columns:25px 1fr;gap:8px;padding:9px 0;border-top:1px solid #edf1ee}.security-card>div>i{width:23px;height:23px;display:grid;place-items:center;border-radius:50%;background:#eaf7ee;color:#24874c;font-size:.54rem;font-style:normal}.security-card>div:last-child>i{background:#fff3e4;color:#b96e1d}
@media(max-width:1200px){.pro-kpis{grid-template-columns:repeat(3,1fr)}.alerts-layout,.users-layout{grid-template-columns:1fr 1fr}.alerts-side,.users-side{grid-column:1/-1;grid-template-columns:1fr 1fr}.commercial-grid{grid-template-columns:1fr}.commercial-side{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.module-pro-heading{align-items:flex-start;flex-direction:column}.module-filters{width:100%;flex-wrap:wrap}.market-pro-grid{grid-template-columns:1fr}.opportunity-ranking{grid-row:auto}.commercial-pipeline{grid-template-columns:1fr 1fr}.alerts-layout,.users-layout{grid-template-columns:1fr}.alerts-side,.users-side{grid-column:auto;grid-template-columns:1fr 1fr}}
@media(max-width:760px){.pro-kpis{grid-template-columns:1fr 1fr}.module-filters label{flex:1}.module-filters select{width:100%}.module-filters button{width:100%}.compact-filters{width:100%;flex-direction:column}.compact-filters input{width:100%}.orders-table{overflow-x:auto}.orders-table .head,.orders-table>button{min-width:650px}.commercial-side,.alerts-side,.users-side{grid-template-columns:1fr}.alert-filter{width:100%;overflow:auto}.alert-filter button{flex:1;white-space:nowrap}.access-rule{align-items:flex-start;flex-direction:column}.access-rule>i{display:none}}
@media(max-width:480px){.pro-kpis{grid-template-columns:1fr}.commercial-pipeline{grid-template-columns:1fr}.pro-table{overflow-x:auto}.pro-table .head,.pro-table>div:not(.head){min-width:500px}.simple-modal form>div{grid-template-columns:1fr}.alert-detail dl,.user-meta{grid-template-columns:1fr}.chart-note{align-items:flex-start;flex-direction:column;gap:4px}}

/* Calendar and integrated schedule */
.calendar-module{display:grid;gap:14px}
.calendar-module-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}
.calendar-module-heading h2{margin:3px 0 4px;font:700 1.25rem Montserrat}
.calendar-module-heading p{margin:0;color:var(--muted);font-size:.68rem}
.calendar-primary{border:0;border-radius:7px;padding:10px 15px;background:var(--forest);color:#fff;font-size:.64rem;font-weight:800;cursor:pointer}
.calendar-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.calendar-kpis article,.calendar-main-card,.calendar-sidebar article,.schedule-card{border:1px solid var(--line);border-radius:9px;background:#fff;box-shadow:0 6px 20px rgba(11,59,46,.035)}
.calendar-kpis article{padding:14px 16px}.calendar-kpis span,.calendar-kpis strong,.calendar-kpis small{display:block}.calendar-kpis span{color:var(--muted);font-size:.49rem;font-weight:800;letter-spacing:.05em}.calendar-kpis strong{margin:5px 0 2px;font:700 1.25rem Montserrat}.calendar-kpis small{color:var(--muted);font-size:.5rem}.calendar-kpis small.warning{color:#bd741e}
.calendar-controlbar{display:flex;align-items:center;gap:10px;padding:9px;border:1px solid var(--line);border-radius:8px;background:#fff}.calendar-views{display:flex;padding:3px;border-radius:6px;background:#edf2ef;margin-right:auto}.calendar-views button{border:0;border-radius:5px;padding:7px 14px;background:transparent;color:var(--muted);font-size:.58rem;font-weight:700;cursor:pointer}.calendar-views button.active{background:var(--forest);color:#fff}.calendar-controlbar label{color:var(--muted);font-size:.52rem;font-weight:700}.calendar-controlbar select{margin-left:6px;border:1px solid var(--line);border-radius:6px;padding:7px 25px 7px 8px;background:#fff;color:var(--ink);font-size:.56rem}
.calendar-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px}.calendar-main-card{padding:15px}.calendar-module-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.calendar-module-toolbar>div{display:flex;align-items:center;gap:10px}.calendar-module-toolbar h3{margin:0;font:700 .88rem Montserrat}.calendar-module-toolbar button{border:1px solid var(--line);border-radius:6px;padding:6px 9px;background:#fff;color:var(--ink);font-size:.57rem;cursor:pointer}.month-weekdays,.month-grid{display:grid;grid-template-columns:repeat(7,1fr)}.month-weekdays{border:1px solid var(--line);border-bottom:0;border-radius:7px 7px 0 0;background:#f5f8f6}.month-weekdays span{padding:7px;text-align:center;color:var(--muted);font-size:.46rem;font-weight:800}
.month-grid{border-left:1px solid var(--line);border-top:1px solid var(--line)}.month-day{min-width:0;min-height:94px;padding:7px;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff;color:var(--ink);text-align:left;cursor:pointer}.month-day:nth-child(7n){border-right:1px solid var(--line)}.month-day>span{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;font-size:.55rem;font-weight:700}.month-day.today>span{background:var(--forest);color:#fff}.month-day.muted{background:#fafbfa;color:#b7c0bb}.month-day>div{display:grid;gap:3px;margin-top:5px}.month-day em{display:block;overflow:hidden;padding:3px 5px;border-left:3px solid;border-radius:3px;background:#eef7f1;color:#267e49;font-size:.43rem;font-style:normal;white-space:nowrap;text-overflow:ellipsis}.month-day em.harvest{border-color:#d85b63;background:#fff0f1;color:#ad434b}.month-day em.maintenance{border-color:#d89432;background:#fff6e7;color:#9e6318}.month-day em.logistics{border-color:#397fc2;background:#edf5fc;color:#28689f}.month-day em.commercial{border-color:#7b63bd;background:#f3effd;color:#654ca5}.month-day small{font-size:.42rem;color:var(--muted)}
.calendar-sidebar{display:grid;align-content:start;gap:14px}.calendar-sidebar article{padding:15px}.calendar-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.calendar-card-head span{color:var(--green);font-size:.48rem;font-weight:800;letter-spacing:.07em}.calendar-card-head h3{margin:3px 0 11px;font:700 .78rem Montserrat}.calendar-card-head>em{border-radius:12px;padding:4px 7px;background:#edf7ef;color:#27804a;font-size:.45rem;font-style:normal}
.daily-agenda{display:grid}.daily-agenda button{display:grid;grid-template-columns:36px 7px 1fr;gap:7px;align-items:start;padding:10px 0;border:0;border-top:1px solid #edf1ee;background:#fff;color:var(--ink);text-align:left;cursor:pointer}.daily-agenda time{font-size:.52rem;font-weight:800}.daily-agenda i{width:7px;height:7px;margin-top:4px;border-radius:50%;background:#3a9b5e}.daily-agenda i.maintenance{background:#d89432}.daily-agenda i.commercial{background:#7b63bd}.daily-agenda p{margin:0}.daily-agenda b,.daily-agenda small{display:block;font-size:.53rem}.daily-agenda small{margin-top:2px;color:var(--muted);font-size:.45rem}.daily-agenda em{grid-column:3;margin-top:3px;color:#27804a;font-size:.44rem;font-style:normal}.daily-agenda em.warning{color:#b66b18}
.milestone-list>div{display:grid;grid-template-columns:34px 1fr;gap:9px;align-items:center;padding:9px 0;border-top:1px solid #edf1ee}.milestone-list time{display:grid;place-items:center;height:34px;border-radius:6px;background:#edf5ef;color:var(--forest);font-size:.7rem;font-weight:800;line-height:1}.milestone-list time small{font-size:.38rem}.milestone-list p{margin:0}.milestone-list b,.milestone-list small{display:block;font-size:.52rem}.milestone-list p small{color:var(--muted);font-size:.44rem}
.schedule-card{padding:16px}.schedule-legend{display:flex;gap:12px}.schedule-legend span{color:var(--muted);font-size:.47rem}.schedule-legend i{display:inline-block;width:7px;height:7px;margin-right:4px;border-radius:2px;background:#3a9b5e}.schedule-legend i.harvest{background:#d85b63}.schedule-legend i.logistics{background:#397fc2}.schedule-scroll{overflow:hidden;border:1px solid var(--line);border-radius:7px}.schedule-head,.schedule-row{display:grid;grid-template-columns:180px repeat(6,1fr)}.schedule-head{background:#f5f8f6}.schedule-head span{padding:8px 6px;border-right:1px solid var(--line);color:var(--muted);font-size:.45rem;text-align:center}.schedule-head span:first-child{text-align:left;font-weight:800}.schedule-row{min-height:55px;border-top:1px solid var(--line)}.schedule-row>p{margin:0;padding:9px}.schedule-row p b,.schedule-row p small{display:block;font-size:.52rem}.schedule-row p small{color:var(--muted);font-size:.44rem}.schedule-track{grid-column:2/-1;display:grid;grid-template-columns:repeat(6,1fr);align-items:center;background:repeating-linear-gradient(to right,transparent 0,transparent calc(16.666% - 1px),#edf1ee calc(16.666% - 1px),#edf1ee 16.666%)}.schedule-bar{grid-column:calc(var(--start) + 1)/span var(--span);height:32px;margin:0 4px;padding:0 8px;border:0;border-radius:5px;background:#e9f6ed;color:#267e49;text-align:left;cursor:pointer}.schedule-bar.harvest{background:#fff0f1;color:#ad434b}.schedule-bar.logistics{background:#edf5fc;color:#28689f}.schedule-bar.maintenance{background:#fff6e7;color:#9e6318}.schedule-bar.commercial{background:#f3effd;color:#654ca5}.schedule-bar b,.schedule-bar small{display:block;overflow:hidden;font-size:.48rem;white-space:nowrap;text-overflow:ellipsis}.schedule-bar small{font-size:.4rem;opacity:.75}.calendar-toast{position:fixed;right:20px;bottom:20px}
@media(max-width:1200px){.calendar-kpis{grid-template-columns:repeat(2,1fr)}.calendar-layout{grid-template-columns:1fr}.calendar-sidebar{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.calendar-controlbar{align-items:stretch;flex-wrap:wrap}.calendar-views{width:100%;margin:0}.calendar-views button{flex:1}.calendar-controlbar label{flex:1}.calendar-controlbar select{width:100%;margin:4px 0 0}.month-grid{overflow-x:auto}.month-weekdays,.month-grid{min-width:720px}.calendar-main-card{overflow:hidden}.schedule-scroll{overflow-x:auto}.schedule-head,.schedule-row{min-width:850px}}
@media(max-width:760px){.calendar-module-heading{align-items:flex-start;flex-direction:column}.calendar-primary{width:100%}.calendar-sidebar{grid-template-columns:1fr}.schedule-legend{display:none}}
@media(max-width:480px){.calendar-kpis{grid-template-columns:1fr}.calendar-module-heading h2{font-size:1.05rem}}

/* Vertical cycle journey */
.vertical-journey{padding:17px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(145deg,#fff 0%,#f7fbf8 100%);box-shadow:0 8px 24px rgba(11,59,46,.045)}
.vertical-journey-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:16px}.vertical-journey-head>div>span{color:var(--green);font-size:.5rem;font-weight:800;letter-spacing:.08em}.vertical-journey-head h3{margin:3px 0;font:700 .9rem Montserrat}.vertical-journey-head p{margin:0;color:var(--muted);font-size:.57rem}.vertical-journey-head label{color:var(--muted);font-size:.5rem;font-weight:700}.vertical-journey-head select{display:block;min-width:240px;margin-top:5px;border:1px solid var(--line);border-radius:6px;padding:8px;background:#fff;color:var(--ink);font-size:.56rem}
.journey-flow{display:grid;grid-template-columns:repeat(7,1fr);gap:9px;position:relative}.journey-flow:before{content:"";position:absolute;left:7%;right:7%;top:19px;height:2px;background:#dfe8e2}.journey-flow button{position:relative;z-index:1;min-width:0;padding:0 4px 10px;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--ink);text-align:center;cursor:pointer}.journey-flow button>i{width:38px;height:38px;display:grid;place-items:center;margin:0 auto 8px;border:3px solid #fff;border-radius:50%;background:#e8eeea;color:#75827b;box-shadow:0 0 0 1px #dce5df;font-size:.52rem;font-style:normal;font-weight:800}.journey-flow button.done>i{background:var(--forest);color:#fff}.journey-flow button.active>i{background:var(--lime);color:#103829;box-shadow:0 0 0 4px rgba(121,195,71,.18)}.journey-flow button.selected{border-color:#cfe1d5;background:#fff;box-shadow:0 4px 14px rgba(11,59,46,.07)}.journey-flow span,.journey-flow span b,.journey-flow span small,.journey-flow button>em{display:block}.journey-flow span b{font-size:.54rem}.journey-flow span small{overflow:hidden;margin-top:2px;color:var(--muted);font-size:.43rem;white-space:nowrap;text-overflow:ellipsis}.journey-flow button>em{margin-top:6px;color:#87948d;font-size:.4rem;font-style:normal}.journey-flow button.done>em{color:#267e49}.journey-flow button.active>em{color:#5c922f;font-weight:800}
.journey-detail{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.8fr) minmax(250px,.7fr);gap:14px;align-items:center;margin-top:14px;padding:14px;border:1px solid #dce8df;border-radius:8px;background:#fff}.journey-stage-copy>span{color:var(--green);font-size:.47rem;font-weight:800;letter-spacing:.07em}.journey-stage-copy h4{margin:4px 0;font:700 .72rem Montserrat}.journey-stage-copy p{margin:0;color:var(--muted);font-size:.52rem}.journey-detail dl{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0}.journey-detail dl>div{padding:7px;border-radius:6px;background:#f4f7f5}.journey-detail dt,.journey-detail dd{font-size:.45rem}.journey-detail dt{color:var(--muted)}.journey-detail dd{margin:2px 0 0;font-weight:800}.journey-detail dd.journey-active{color:#318650}.journey-detail aside{display:grid;grid-template-columns:26px 1fr;gap:8px;padding:10px;border-radius:7px;background:#fff6e8}.journey-detail aside>i{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:#e8a33f;color:#fff;font-style:normal;font-weight:800}.journey-detail aside span,.journey-detail aside b,.journey-detail aside small{display:block}.journey-detail aside span{color:#ae6b16;font-size:.42rem;font-weight:800}.journey-detail aside b{margin:3px 0;font-size:.5rem}.journey-detail aside small{color:#8f7758;font-size:.42rem}
@media(max-width:1100px){.vertical-journey{overflow:hidden}.journey-flow{min-width:820px}.journey-flow-wrap{overflow-x:auto}.journey-detail{grid-template-columns:1fr 1fr}.journey-detail aside{grid-column:1/-1}.journey-flow{overflow-x:auto}}
@media(max-width:760px){.vertical-journey-head{align-items:flex-start;flex-direction:column}.vertical-journey-head label,.vertical-journey-head select{width:100%}.journey-flow{overflow-x:auto;padding-bottom:8px}.journey-detail{grid-template-columns:1fr}.journey-detail aside{grid-column:auto}}
.journey-flow{grid-template-columns:repeat(7,minmax(110px,1fr));overflow-x:auto;min-width:0;padding-bottom:4px}
@media(max-width:1100px){.journey-flow{min-width:0}}

/* Irrigation management and Vertkal controllers */
.irrigation-module{display:grid;gap:14px}.irrigation-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}.irrigation-heading h2{margin:3px 0 4px;font:700 1.25rem Montserrat}.irrigation-heading p{margin:0;color:var(--muted);font-size:.67rem}.irrigation-filters{display:flex;align-items:end;gap:8px}.irrigation-filters label{color:var(--muted);font-size:.52rem;font-weight:700}.irrigation-filters select{display:block;min-width:150px;margin-top:4px;border:1px solid var(--line);border-radius:6px;padding:8px;background:#fff;color:var(--ink);font-size:.57rem}.irrigation-filters button,.management-detail>footer button{border:0;border-radius:7px;padding:9px 13px;background:var(--forest);color:#fff;font-size:.58rem;font-weight:800;cursor:pointer}
.irrigation-kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.irrigation-kpis article,.control-architecture,.management-list,.management-detail,.controller-side article,.irrigation-safety{border:1px solid var(--line);border-radius:9px;background:#fff;box-shadow:0 6px 20px rgba(11,59,46,.035)}.irrigation-kpis article{padding:14px}.irrigation-kpis span,.irrigation-kpis strong,.irrigation-kpis small{display:block}.irrigation-kpis span{color:var(--muted);font-size:.47rem;font-weight:800}.irrigation-kpis strong{margin:5px 0 2px;font:700 1.15rem Montserrat}.irrigation-kpis small{color:var(--muted);font-size:.48rem}.irrigation-kpis small.positive{color:#26804a}.irrigation-kpis small.warning{color:#b46c1c}
.control-architecture{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr 1.2fr;gap:10px;align-items:center;padding:14px;background:linear-gradient(120deg,#f4faf5,#fff)}.control-architecture>div{padding:10px;border-radius:7px;background:#fff}.control-architecture>div span,.control-architecture>div b,.control-architecture>div small{display:block}.control-architecture>div span{color:var(--green);font-size:.43rem;font-weight:800}.control-architecture>div b{margin:3px 0;font-size:.57rem}.control-architecture>div small{color:var(--muted);font-size:.44rem}.control-architecture>i{color:#8da298;font-style:normal}.control-architecture>aside{padding:10px;border-radius:7px;background:var(--forest);color:#fff}.control-architecture>aside b,.control-architecture>aside small{display:block;font-size:.53rem}.control-architecture>aside small{margin-top:3px;color:rgba(255,255,255,.7);font-size:.43rem}
.irrigation-layout{display:grid;grid-template-columns:250px minmax(0,1fr) 280px;gap:14px;align-items:start}.management-list,.management-detail,.controller-side article{padding:15px}.irrigation-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.irrigation-card-head span{color:var(--green);font-size:.46rem;font-weight:800;letter-spacing:.06em}.irrigation-card-head h3{margin:3px 0 11px;font:700 .78rem Montserrat}.irrigation-card-head>em{border-radius:12px;padding:4px 7px;background:#edf7ef;color:#27804a;font-size:.44rem;font-style:normal}
.management-list>button{width:100%;display:grid;grid-template-columns:34px 1fr auto;gap:8px;align-items:center;padding:10px 5px;border:0;border-top:1px solid #edf1ee;background:#fff;color:var(--ink);text-align:left;cursor:pointer}.management-list>button.selected{border-radius:7px;background:#f0f8f2}.management-crop{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#e8f3eb;color:var(--forest);font-size:.58rem;font-weight:800}.management-list p{margin:0}.management-list p b,.management-list p small,.management-list p em{display:block;font-size:.52rem}.management-list p small,.management-list p em{color:var(--muted);font-size:.43rem}.management-list p em{margin-top:3px;font-style:normal}.management-list>button>strong{text-align:right;font-size:.55rem}.management-list>button>strong small{display:block;margin-top:4px;color:#2c864f;font-size:.4rem}.management-list>button>strong small.review{color:#b46c1c}
.management-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.management-meta div,.management-settings label{padding:8px;border-radius:6px;background:#f4f7f5}.management-meta span,.management-meta strong{display:block}.management-meta span{color:var(--muted);font-size:.4rem}.management-meta strong{margin-top:3px;font-size:.5rem}.management-settings{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.management-settings section{padding:11px;border:1px solid var(--line);border-radius:7px}.management-settings header span{color:var(--green);font-size:.42rem;font-weight:800}.management-settings header h4{margin:2px 0 8px;font-size:.6rem}.management-settings section>div{display:grid;grid-template-columns:1fr 1fr;gap:6px}.management-settings label{color:var(--muted);font-size:.42rem}.management-settings label strong{display:block;margin-top:3px;color:var(--ink);font-size:.51rem}
.irrigation-dayline{margin-top:12px;padding:11px;border:1px solid var(--line);border-radius:7px}.irrigation-dayline header span{color:var(--green);font-size:.42rem;font-weight:800}.irrigation-dayline header h4{margin:2px 0 12px;font-size:.6rem}.dayline-track{display:grid;grid-template-columns:repeat(7,1fr);position:relative}.dayline-track:before{content:"";position:absolute;left:5%;right:5%;top:5px;height:2px;background:#cfe1d5}.dayline-track span{position:relative;text-align:center}.dayline-track i{width:11px;height:11px;display:block;margin:0 auto 5px;border:2px solid #fff;border-radius:50%;background:var(--green);box-shadow:0 0 0 1px #9bc4aa}.dayline-track b,.dayline-track small{display:block;font-size:.44rem}.dayline-track small{color:var(--muted);font-size:.38rem}.management-detail>footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-top:11px;border-top:1px solid var(--line)}.management-detail>footer>div{display:flex;align-items:center;gap:7px}.management-detail>footer i{width:8px;height:8px;border-radius:50%;background:#2e9b58}.management-detail>footer b,.management-detail>footer small{display:block;font-size:.5rem}.management-detail>footer small{color:var(--muted);font-size:.42rem}
.controller-side{display:grid;gap:14px}.controller-list button{width:100%;display:grid;grid-template-columns:8px 1fr auto;gap:8px;align-items:center;padding:9px 0;border:0;border-top:1px solid #edf1ee;background:#fff;color:var(--ink);text-align:left;cursor:pointer}.controller-list button>i{width:7px;height:7px;border-radius:50%;background:#2d9a56}.controller-list p{margin:0}.controller-list b,.controller-list small,.controller-list span{display:block;font-size:.5rem}.controller-list small{color:var(--muted);font-size:.42rem}.controller-list>button>span{text-align:right;font-weight:800}.controller-list>button>span small{color:#27804a}.sync-events>div{display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:center;padding:9px 0;border-top:1px solid #edf1ee}.sync-events i{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;font-size:.48rem;font-style:normal}.sync-events i.ok{background:#eaf7ee;color:#26804a}.sync-events i.warn{background:#fff3e3;color:#b56c18}.sync-events p{margin:0}.sync-events b,.sync-events small{display:block;font-size:.5rem}.sync-events small{color:var(--muted);font-size:.42rem}
.irrigation-safety{display:grid;grid-template-columns:270px 1fr;gap:18px;align-items:center;padding:15px}.irrigation-safety>div span{color:var(--green);font-size:.45rem;font-weight:800}.irrigation-safety h3{margin:3px 0;font:700 .75rem Montserrat}.irrigation-safety ol{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:0;padding:0;list-style:none}.irrigation-safety li{display:flex;gap:7px;align-items:center}.irrigation-safety li>b{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--forest);color:#fff;font-size:.46rem}.irrigation-safety strong,.irrigation-safety small{display:block;font-size:.49rem}.irrigation-safety small{color:var(--muted);font-size:.4rem}.irrigation-modal form>aside{margin:0 20px;padding:10px;border-radius:7px;background:#fff6e8}.irrigation-modal form>aside strong,.irrigation-modal form>aside small{display:block;font-size:.54rem}.irrigation-modal form>aside small{margin-top:3px;color:var(--muted);font-size:.45rem}
@media(max-width:1250px){.irrigation-kpis{grid-template-columns:repeat(3,1fr)}.control-architecture{grid-template-columns:1fr auto 1fr auto 1fr}.control-architecture>div:nth-of-type(4),.control-architecture>i:nth-of-type(3){display:none}.control-architecture>aside{grid-column:1/-1}.irrigation-layout{grid-template-columns:230px 1fr}.controller-side{grid-column:1/-1;grid-template-columns:1fr 1fr}}
@media(max-width:900px){.irrigation-heading{align-items:flex-start;flex-direction:column}.irrigation-filters{width:100%}.irrigation-filters label{flex:1}.irrigation-filters select{width:100%}.control-architecture{grid-template-columns:1fr}.control-architecture>i{display:none}.control-architecture>div:nth-of-type(4){display:block}.irrigation-layout{grid-template-columns:1fr}.controller-side{grid-column:auto}.management-settings{grid-template-columns:1fr}.irrigation-safety{grid-template-columns:1fr}.irrigation-safety ol{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.irrigation-kpis{grid-template-columns:1fr 1fr}.irrigation-filters{align-items:stretch;flex-direction:column}.management-meta{grid-template-columns:1fr 1fr}.controller-side{grid-template-columns:1fr}.irrigation-safety ol{grid-template-columns:1fr 1fr}.dayline-track{min-width:620px}.irrigation-dayline{overflow-x:auto}.management-detail>footer{align-items:flex-start;flex-direction:column}.management-detail>footer button{width:100%}}
@media(max-width:420px){.irrigation-kpis{grid-template-columns:1fr}.irrigation-safety ol{grid-template-columns:1fr}}