/* AGRIXON — light tone (default). Clean surfaces, deep-green accent, soft depth.
   Pairs with mission-theme.css (dark tone, ?tone=dark). Only restyles; no behaviour changes. */

html[data-mc="light"] {
  --bg: #f3f6f4;
  --surface: #ffffff;
  --ink: #10261c;
  --muted: #5d6b65;
  --line: #e1e8e4;
  --line-strong: #cfd9d3;
  --green: #0e9f6e;
  --green-ink: #0b7d57;
  --soft: #eaf5ef;
  --side: #10261c;
  --orange: #c47a0a;
  --red: #c2483b;
  --cyan: #1f7fa3;
  --lt-shadow: 0 1px 2px rgba(16, 38, 28, 0.05), 0 10px 30px rgba(16, 38, 28, 0.07);
  --lt-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
  color-scheme: light;
  color: var(--ink);
  background: var(--bg);
}
html[data-mc="light"] body {
  background-color: var(--bg);
  background-image:
    radial-gradient(900px 420px at 85% -10%, rgba(14, 159, 110, 0.08), transparent 70%),
    radial-gradient(800px 420px at -10% 110%, rgba(31, 127, 163, 0.06), transparent 70%);
  background-attachment: fixed;
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
}

/* Typography */
html[data-mc="light"] h1, html[data-mc="light"] h2, html[data-mc="light"] h3 { color: var(--ink); letter-spacing: -0.015em; }
html[data-mc="light"] .page-heading h1 { font-weight: 700; letter-spacing: -0.03em; }
html[data-mc="light"] .page-heading h1 span { color: var(--green); }
html[data-mc="light"] .eyebrow,
html[data-mc="light"] .section-label > span:first-child { color: var(--green-ink); font-family: var(--lt-mono); letter-spacing: 0.12em; }
html[data-mc="light"] .overview-item small, html[data-mc="light"] .image-date small { font-family: var(--lt-mono); letter-spacing: 0.08em; }
html[data-mc="light"] .text-link { color: var(--green-ink); }

/* Top bar */
html[data-mc="light"] .topbar {
  background: rgba(255, 255, 255, 0.86);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px) saturate(1.4);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
}
html[data-mc="light"] .topbar-brand .brand-logo-light { display: block; }
html[data-mc="light"] .topbar-brand .brand-logo-dark { display: none; }
html[data-mc="light"] .brand-logo { height: 38px; }
html[data-mc="light"] .topnav a, html[data-mc="light"] .nav-more-btn { color: var(--muted); }
html[data-mc="light"] .topnav a:hover, html[data-mc="light"] .nav-more-btn:hover { color: var(--ink); background: var(--soft); }
html[data-mc="light"] .topnav a.active, html[data-mc="light"] .topnav a[aria-current="page"],
html[data-mc="light"] .nav-more.active > .nav-more-btn {
  color: #ffffff;
  background: var(--green);
  box-shadow: 0 6px 18px rgba(14, 159, 110, 0.28);
}

/* Surfaces */
html[data-mc="light"] .overview,
html[data-mc="light"] .map-workspace,
html[data-mc="light"] .analysis-panel,
html[data-mc="light"] .card,
html[data-mc="light"] .source-card,
html[data-mc="light"] .table-wrap,
html[data-mc="light"] dialog,
html[data-mc="light"] .fields-popover,
html[data-mc="light"] .map-onboarding,
html[data-mc="light"] .nav-more-menu {
  background: var(--surface);
  border-color: var(--line);
  box-shadow: var(--lt-shadow);
  color: var(--ink);
}
html[data-mc="light"] .metric-icon, html[data-mc="light"] .state-icon { background: var(--soft); border-color: #d3eadf; color: var(--green-ink); }
html[data-mc="light"] .pill, html[data-mc="light"] .tag {
  background: #eaf4f8;
  border: 1px solid #cfe4ee;
  color: #17607d;
  font-family: var(--lt-mono);
  letter-spacing: 0.04em;
}

/* Buttons */
html[data-mc="light"] .btn, html[data-mc="light"] .icon-btn, html[data-mc="light"] .map-button, html[data-mc="light"] .map-tool {
  background: #ffffff;
  color: var(--ink);
  border-color: var(--line-strong);
}
html[data-mc="light"] .btn:hover, html[data-mc="light"] .icon-btn:hover, html[data-mc="light"] .map-button:hover { border-color: var(--green); }
html[data-mc="light"] .btn.primary {
  color: #ffffff;
  background: linear-gradient(180deg, #13b27c, #0e9f6e);
  border-color: transparent;
  box-shadow: 0 6px 18px rgba(14, 159, 110, 0.28);
}
html[data-mc="light"] .btn.primary:hover { background: linear-gradient(180deg, #16c086, #0b8f62); }
html[data-mc="light"] .satellite-button { background: #ffffff; border-color: var(--line-strong); color: var(--ink); }
html[data-mc="light"] .satellite-button:hover { border-color: var(--green); }
html[data-mc="light"] :focus-visible { outline: 2px solid #0e9f6e; outline-offset: 2px; }

/* Map chrome */
html[data-mc="light"] .layer-tabs, html[data-mc="light"] .image-date, html[data-mc="light"] .map-tools, html[data-mc="light"] .drawing-bar {
  background: rgba(255, 255, 255, 0.92);
  border-color: var(--line);
  box-shadow: var(--lt-shadow);
  color: var(--ink);
  backdrop-filter: blur(8px);
}
html[data-mc="light"] .layer-tabs button.active, html[data-mc="light"] .layer-tab.active { background: var(--green); color: #fff; }
html[data-mc="light"] .map-caption { background: rgba(255, 255, 255, 0.85); color: var(--muted); }
html[data-mc="light"] .toast { background: #10261c; color: #f2f6f4; border-color: #10261c; }

/* Tables and tools */
html[data-mc="light"] th { color: var(--muted); font-family: var(--lt-mono); font-weight: 500; letter-spacing: 0.04em; }
html[data-mc="light"] tbody tr:hover { background: #f6faf8; }
html[data-mc="light"] .tools-tab.is-active { background: var(--green); color: #fff; }

/* Earth layout floats and basemap pills */
html[data-mc="light"] .earth-float,
html[data-mc="light"] .agx-basemaps {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--line);
  box-shadow: var(--lt-shadow);
  color: var(--ink);
}
html[data-mc="light"] .agx-basemaps button[aria-pressed="true"],
html[data-mc="light"] .earth-drawtools button[aria-pressed="true"] { background: var(--green); color: #fff; }
html[data-mc="light"] .earth-drawtools button:hover { background: var(--soft); }
html[data-mc="light"][data-earth] #map-page .analysis-panel { background: rgba(255, 255, 255, 0.96); border-color: var(--line); }
html[data-mc="light"][data-earth] #map-page .map-workspace { background: #e9eee9; }

/* 3D twin in the light tone: light instruments over a bright sky. */
html[data-mc="light"] .tw {
  --tw-ink: #10261c;
  --tw-muted: #5d6b65;
  --tw-line: rgba(16, 38, 28, 0.12);
  --tw-panel: rgba(255, 255, 255, 0.9);
  --tw-amber: #c47a0a;
  --tw-mint: #0e9f6e;
  --tw-cyan: #1f7fa3;
  background: #e7eef0;
}
html[data-mc="light"] .tw .tw-canvas .f3d-embed .f3d-canvas { background: linear-gradient(180deg, #d9e7ee 0%, #eef3f1 60%, #e7ece6 100%); }
html[data-mc="light"] .tw .tw-vignette { background: radial-gradient(ellipse at center, transparent 60%, rgba(16, 38, 28, 0.12) 100%); }
html[data-mc="light"] .tw .tw-panel, html[data-mc="light"] .tw .tw-bottom, html[data-mc="light"] .tw .tw-steps,
html[data-mc="light"] .tw .tw-layers button, html[data-mc="light"] .tw .tw-legend, html[data-mc="light"] .tw .tw-btn,
html[data-mc="light"] .tw .tw-seg { box-shadow: var(--lt-shadow); }
html[data-mc="light"] .tw .tw-steps button[aria-current="step"] { color: #fff; }
html[data-mc="light"] .tw .tw-steps button.done { color: var(--green-ink); }
html[data-mc="light"] .tw .tw-steps .sep { color: #b9c6bf; }
html[data-mc="light"] .tw .tw-seg button[aria-pressed="true"],
html[data-mc="light"] .tw .tw-layers button[aria-pressed="true"],
html[data-mc="light"] .tw .tw-tabs button[aria-pressed="true"], html[data-mc="light"] .tw .tw-tabs button[aria-selected="true"],
html[data-mc="light"] .tw .tw-years button[aria-pressed="true"] { background: #fff4e0; border-color: #e8b44a; color: var(--tw-ink); }
html[data-mc="light"] .tw .tw-card { background: #fbfcfb; }
html[data-mc="light"] .tw .tw-decision { background: linear-gradient(180deg, #e6f7ef, #f6fbf8); border-color: #9fdcc2; }
html[data-mc="light"] .tw .tw-tag { background: rgba(255, 255, 255, 0.95); color: var(--tw-ink); border-color: #9cc9dc; box-shadow: var(--lt-shadow); }
html[data-mc="light"] .tw .tw-tag.none { color: var(--tw-muted); border-color: #cdd6d1; }
html[data-mc="light"] .tw .tw-tag.dry { border-color: #e8b44a; }
html[data-mc="light"] .tw .tw-loading { background: radial-gradient(800px 400px at 50% 40%, rgba(14, 159, 110, 0.08), transparent 70%); }
html[data-mc="light"] .tw .tw-dt-live { color: #0a8f60; }
html[data-mc="light"] .tw .tw-dt-local { color: #1f7fa3; }
html[data-mc="light"] .tw .tw-dt-cached { color: #8a6d1c; }
html[data-mc="light"] .tw .tw-dt-sim { color: #6a4fc2; }
html[data-mc="light"] .tw .tw-dt-illus { color: #c25a26; }
html[data-mc="light"] .tw .tw-bar { background: #e6ece9; }
html[data-mc="light"] .tw .tw-error { color: #c2483b; }

/* Icon tiles without an icon (pages that do not paint data-icon) are hidden instead of showing empty squares. */
html[data-mc] .metric-icon:empty { display: none; }

/* Phones: one compact top bar instead of three stacked rows. */
@media (max-width: 700px) {
  html[data-mc] .topbar { height: auto; min-height: 56px; padding: 6px 10px; gap: 6px; flex-wrap: wrap; }
  html[data-mc] .topbar .brand-logo { height: 28px; }
  html[data-mc] .top-actions { gap: 6px; }
  html[data-mc] .top-actions .icon-btn, html[data-mc] .top-actions .toolbar-separator, html[data-mc] .top-actions .connection-pill { display: none; }
  html[data-mc] .topnav { order: 3; width: 100%; justify-content: space-between; }
}