/* Beet Root Hollar — shared brand tokens and portal shell */
:root{
  --bg:#111a14;
  --surface:#18241c;
  --surface-2:#203026;
  --line:rgba(246,240,225,.10);
  --line-strong:rgba(232,179,60,.32);
  --text:#F6F0E1;
  --muted:rgba(246,240,225,.62);
  --faint:rgba(246,240,225,.38);

  --beet:#A3305E;
  --beet-bright:#C9467A;
  --beet-deep:#6B1A3E;
  --monarch:#E07A1F;
  --honey:#E8B33C;
  --leaf:#7FA352;
  --forest:#2F5D3A;
  --cream:#F6F0E1;

  --ok:#8CC56F;
  --warn:#E8B33C;
  --bad:#E0614F;

  --serif:Georgia,'Iowan Old Style','Times New Roman',serif;
  --sans:'Avenir Next','Segoe UI',system-ui,-apple-system,sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,monospace;
  --radius:12px;
  color-scheme:dark;
}
*{box-sizing:border-box;}
[hidden]{display:none !important;}
html,body{margin:0;}
body{
  background:
    radial-gradient(1200px 500px at 85% -10%, rgba(163,48,94,.16), transparent 60%),
    radial-gradient(900px 420px at -5% 0%, rgba(232,179,60,.08), transparent 60%),
    var(--bg);
  color:var(--text); font:400 15px/1.5 var(--sans);
  min-height:100vh; display:flex; flex-direction:column;
}
a{color:var(--honey);}
h1,h2,h3{font-family:var(--serif); font-weight:600; letter-spacing:.2px;}

/* ---------- top bar ---------- */
.topbar{
  position:sticky; top:0; z-index:40;
  display:flex; align-items:center; gap:clamp(12px,3vw,32px); flex-wrap:wrap;
  padding:10px clamp(16px,3.5vw,40px);
  background:rgba(14,21,17,.88); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.brandlink{display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--text);}
.brandlink img{width:42px; height:42px;}
.brandlink .name{font:600 19px/1.05 var(--serif);}
.brandlink .sub{display:block; font:600 9.5px/1 var(--sans); letter-spacing:2.4px; text-transform:uppercase; color:var(--honey); margin-top:4px;}
.nav{display:flex; gap:4px; flex-wrap:wrap; margin-left:auto;}
.nav a{
  text-decoration:none; color:var(--muted); font:600 13px/1 var(--sans); letter-spacing:.3px;
  padding:10px 14px; border-radius:8px; transition:background .15s,color .15s;
}
.nav a:hover{color:var(--text); background:rgba(255,255,255,.06);}
.nav a[aria-current="page"]{color:var(--bg); background:var(--honey);}
.nav button{margin-left:6px;}

/* ---------- layout ---------- */
.page{width:100%; max-width:1480px; margin:0 auto; padding:clamp(16px,2.6vw,32px) clamp(16px,3.5vw,40px) 48px; flex:1;}
.section{margin-top:34px;}
.section-head{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; margin-bottom:14px;}
.section-head h2{margin:0; font-size:22px;}
.section-head .hint{color:var(--faint); font-size:13px;}
.section-head .spacer{flex:1;}
.kicker{font:600 11px/1 var(--sans); letter-spacing:2.4px; text-transform:uppercase; color:var(--honey);}

.card{
  background:linear-gradient(180deg,var(--surface-2),var(--surface));
  border:1px solid var(--line); border-radius:var(--radius); padding:18px;
}
.grid{display:grid; gap:16px; grid-template-columns:repeat(auto-fill,minmax(280px,1fr));}

/* ---------- controls ---------- */
.btn{
  display:inline-flex; align-items:center; gap:7px; justify-content:center;
  background:rgba(255,255,255,.06); border:1px solid var(--line-strong); color:var(--text);
  font:600 12.5px/1 var(--sans); letter-spacing:.3px;
  padding:9px 14px; border-radius:8px; cursor:pointer; transition:background .12s,border-color .12s,color .12s;
  text-decoration:none; white-space:nowrap;
}
.btn:hover{background:rgba(255,255,255,.13);}
.btn:disabled{opacity:.45; cursor:not-allowed;}
.btn.primary{background:var(--honey); color:#1b140a; border-color:var(--honey);}
.btn.primary:hover{background:#f1c254;}
.btn.beet{background:var(--beet); border-color:var(--beet-bright);}
.btn.beet:hover{background:var(--beet-bright);}
.btn.danger{border-color:rgba(224,97,79,.6); color:#ffb3a8;}
.btn.confirm{background:var(--bad); border-color:var(--bad); color:#fff; animation:pulse 1s infinite;}
.btn.sm{padding:6px 10px; font-size:11.5px;}
@keyframes pulse{50%{box-shadow:0 0 0 4px rgba(224,97,79,.25);}}

.pill{
  display:inline-flex; align-items:center; gap:6px; font:600 10.5px/1 var(--sans);
  letter-spacing:1px; text-transform:uppercase; padding:5px 8px; border-radius:999px;
  background:rgba(255,255,255,.07); color:var(--muted);
}
.pill::before{content:''; width:6px; height:6px; border-radius:50%; background:currentColor;}
.pill.ok{color:var(--ok); background:rgba(140,197,111,.12);}
.pill.warn{color:var(--warn); background:rgba(232,179,60,.12);}
.pill.bad{color:var(--bad); background:rgba(224,97,79,.12);}
.pill.live{color:#fff; background:var(--bad);}
.pill.sim{color:var(--monarch); background:rgba(224,122,31,.12);}
.pill.sim::before{display:none;}

select,input[type=password],input[type=text],input:not([type]){
  background:#0c130f; color:var(--text); border:1px solid var(--line-strong); border-radius:8px;
  font:500 13px/1 var(--sans); padding:9px 11px;
}

.footer{text-align:center; font-size:11.5px; color:var(--faint); padding:18px 16px 26px;}
.footer img{width:18px; vertical-align:-4px; margin-right:6px; opacity:.8;}

.empty{
  border:1px dashed var(--line-strong); border-radius:var(--radius); padding:22px;
  color:var(--muted); background:rgba(255,255,255,.02);
}
.empty h3{margin:0 0 6px; color:var(--text); font-size:17px;}
.empty code{font:12.5px var(--mono); background:rgba(0,0,0,.35); padding:2px 6px; border-radius:4px; color:#e7dcc0;}
.empty ol{margin:10px 0 0; padding-left:20px;} .empty li{margin:5px 0;}

@media (max-width:720px){
  .nav{margin-left:0; width:100%;}
  .nav a{padding:9px 10px;}
}

/* ---------- land-use categories (validated: dark surface, CVD-safe adjacent pairs) ---------- */
:root{
  --c-boundary:#f2d675;
  --c-woodland:#5d9960;
  --c-pollinator:#a87ad6;
  --c-crop:#d6457f;
  --c-pasture:#a38a28;
  --c-infra:#4c8fc2;
  --c-open:#4a5a4f;
}