:root { --bg:#f6f5f1; --panel:#fff; --fg:#1d2420; --muted:#66706a; --line:#dcdad2; --brand:#2f6f4f; --brand-fg:#fff; --accent:#b4793a; --bad:#b3261e; --warn:#a66a00; --ok:#2f6f4f; --real:#0b5; --syn:#7a4bd1; --chip:#eceae2; --focus:#1a5fb4; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --bg:#141815; --panel:#1c221e; --fg:#e8ece9; --muted:#9aa49d; --line:#2e3631; --brand:#5aa57c; --brand-fg:#0d140f; --accent:#d9a066; --bad:#ff8a80; --warn:#f0b34d; --ok:#6fcf97; --chip:#262d28; --focus:#7db4ff; } }
:root[data-theme="dark"] { --bg:#141815; --panel:#1c221e; --fg:#e8ece9; --muted:#9aa49d; --line:#2e3631; --brand:#5aa57c; --brand-fg:#0d140f; --accent:#d9a066; --bad:#ff8a80; --warn:#f0b34d; --ok:#6fcf97; --chip:#262d28; --focus:#7db4ff; }
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--fg); font: 15px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
a { color: var(--brand); } a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.env { padding: 4px 16px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-align: center; color: #fff; }
.env.production { background: #0b5a2a; } .env.staging { background: #6b3fb6; } .env.development { background: #8a5a00; }
.top { display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: var(--panel); border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--fg); } .brand strong { display: block; letter-spacing: .12em; font-size: 14px; } .brand small { display: block; letter-spacing: .3em; font-size: 10px; color: var(--muted); }
.mark { width: 28px; height: 28px; border-radius: 7px; background: var(--brand); display: inline-block; position: relative; } .mark::after { content: ""; position: absolute; inset: 6px; border-radius: 3px 14px 3px 14px; background: var(--brand-fg); opacity: .9; }
.who { margin-left: auto; color: var(--muted); font-size: 13px; }
select, input, textarea, button { font: inherit; color: var(--fg); background: var(--panel); border: 1px solid var(--line); border-radius: 6px; padding: 6px 10px; }
button { cursor: pointer; } button.primary { background: var(--brand); color: var(--brand-fg); border-color: var(--brand); } button.danger { background: var(--bad); color: #fff; border-color: var(--bad); } button.link { border: 0; background: none; color: var(--brand); padding: 0; text-decoration: underline; }
.menu { display: none; }
.nav { display: flex; gap: 2px; padding: 0 12px; background: var(--panel); border-bottom: 1px solid var(--line); overflow-x: auto; }
.nav a { padding: 10px 12px; text-decoration: none; color: var(--muted); border-bottom: 3px solid transparent; white-space: nowrap; font-weight: 600; } .nav a[aria-current="page"] { color: var(--fg); border-color: var(--brand); }
main { max-width: 1180px; margin: 0 auto; padding: 16px; } main:focus { outline: none; }
h1 { font-size: 22px; margin: 4px 0 2px; } h2 { font-size: 16px; margin: 0 0 8px; } h3 { font-size: 14px; margin: 12px 0 4px; }
.sub { color: var(--muted); margin: 0 0 14px; } .muted { color: var(--muted); } .small { font-size: 12px; }
.grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 14px; min-width: 0; } .card.wide { grid-column: 1 / -1; }
.big { font-size: 28px; font-weight: 700; line-height: 1.1; } .kv { display: grid; grid-template-columns: auto 1fr; gap: 2px 14px; margin: 6px 0; } .kv dt { color: var(--muted); } .kv dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.chip { display: inline-block; padding: 1px 8px; border-radius: 999px; background: var(--chip); font-size: 12px; font-weight: 600; } .chip.ok { color: var(--ok); } .chip.warn { color: var(--warn); } .chip.bad { color: var(--bad); }
.chip.real { background: #0b5a2a; color: #fff; } .chip.synthetic, .chip.simulated { background: #6b3fb6; color: #fff; } .chip.imported { background: #1a5fb4; color: #fff; }
.k-FACT { color: var(--ok); } .k-CALCULATION { color: var(--focus); } .k-INFERENCE { color: var(--warn); } .k-UNKNOWN { color: var(--bad); }
table { width: 100%; border-collapse: collapse; font-size: 14px; } th, td { padding: 6px 8px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; } th { color: var(--muted); font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; } td.n, th.n { text-align: right; font-variant-numeric: tabular-nums; }
tr.click { cursor: pointer; } tr.click:hover { background: var(--chip); }
.table-wrap { overflow-x: auto; }
ul.plain { list-style: none; margin: 0; padding: 0; } ul.plain li { padding: 6px 0; border-bottom: 1px solid var(--line); } ul.plain li:last-child { border-bottom: 0; }
.alert { border-left: 4px solid var(--warn); padding: 6px 10px; margin: 6px 0; background: var(--chip); border-radius: 4px; } .alert.HIGH { border-color: var(--bad); } .alert.LOW { border-color: var(--muted); }
.split { display: grid; gap: 14px; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); } .twin { width: 100%; height: auto; background: var(--chip); border-radius: 8px; border: 1px solid var(--line); }
.twin .obj { stroke: var(--fg); stroke-opacity: .35; stroke-width: .15; cursor: pointer; } .twin .obj:hover { stroke-opacity: 1; } .twin .sel { stroke: var(--focus); stroke-opacity: 1; stroke-width: .35; } .twin text { font-size: .7px; paint-order: stroke; stroke: var(--bg); stroke-width: .12px; fill: var(--fg); pointer-events: none; }
.twin .boundary { fill: none; stroke: var(--fg); stroke-width: .3; stroke-dasharray: 1 .6; } .twin .sensor { stroke: var(--bg); stroke-width: .2; }
.k-WALL, .k-FENCE { fill: #8a8f89; } .k-POOL, .k-WATER_FEATURE { fill: #5fa8d3; } .k-PAVER_PATIO, .k-HARDSCAPE, .k-DRIVEWAY { fill: #c9b99a; } .k-PLANT { fill: #5aa57c; } .k-PLANTING_BED { fill: #8fbf8a; } .k-TURF { fill: #9fd18a; } .k-LIGHT_FIXTURE { fill: #f0c24d; } .k-IRRIGATION_COMPONENT { fill: #3b73b9; } .twin .other { fill: #b9b2d0; }
.legend { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; } .legend label { display: inline-flex; gap: 4px; align-items: center; font-size: 13px; }
.chat { display: flex; flex-direction: column; gap: 12px; } .msg { padding: 10px 12px; border-radius: 10px; background: var(--panel); border: 1px solid var(--line); } .msg.me { background: var(--chip); align-self: flex-end; max-width: 80%; }
.stmt { padding: 4px 0; } .stmt .tag { font-size: 11px; font-weight: 800; letter-spacing: .05em; margin-right: 6px; } .cite { font-size: 12px; color: var(--muted); }
details { margin: 6px 0; } summary { cursor: pointer; color: var(--brand); }
.pipeline { display: flex; flex-wrap: wrap; gap: 8px; } .step { flex: 1 1 130px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); } .step b { display: block; } .step.COMPLETE { border-color: var(--ok); } .step.IN_PROGRESS { border-color: var(--warn); } .step.NOT_BUILT { opacity: .6; border-style: dashed; }
.day { margin: 16px 0 4px; font-weight: 700; color: var(--muted); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; } .ev { display: grid; grid-template-columns: 56px 1fr; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--line); } .ev time { color: var(--muted); font-variant-numeric: tabular-nums; }
.chain { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; } .chain .st { padding: 3px 8px; border-radius: 6px; border: 1px solid var(--line); background: var(--panel); } .chain .st.none { opacity: .5; border-style: dashed; } .chain .arrow { color: var(--muted); }
form.stack { display: grid; gap: 8px; } form.stack label { display: grid; gap: 2px; font-size: 13px; color: var(--muted); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
@media (max-width: 760px) { .split { grid-template-columns: 1fr; } .menu { display: inline-block; } .nav { display: none; flex-direction: column; } .nav.open { display: flex; } main { padding: 12px; } .who { display: none; } }

.chip.assure-simulated { background: #6b3fb6; color: #fff; } .chip.assure-connected-unverified { background: #8a5a00; color: #fff; } .chip.assure-field-connected { background: #1a5fb4; color: #fff; } .chip.assure-field-verified { background: #0b3d91; color: #fff; } .chip.assure-live-eligible { background: #444; color: #fff; } .chip.assure-not-connected { background: #8c1d18; color: #fff; } .chip.assure-bench-verified { background: #0b5a2a; color: #fff; } 
.grid .card { overflow-x: auto; }
