:root { --bg:#f6f5f2; --card:#fff; --ink:#1f2328; --muted:#6b6f76; --line:#e3e1dc; --accent:#bf5700; --good:#2f7d4f; }
* { box-sizing: border-box; }
body { margin:0; font:14px/1.5 system-ui, sans-serif; background:var(--bg); color:var(--ink); }
header { position:relative; z-index:2; display:flex; gap:24px; align-items:center; padding:12px 24px; background:var(--ink); color:#fff; }
.brand { color:var(--accent); font-size:18px; }
nav { display:flex; gap:16px; flex:1; }
nav a { color:#ccc; text-decoration:none; } nav a.active { color:#fff; border-bottom:2px solid var(--accent); }
main { padding:24px; max-width:1200px; margin:auto; }
h1 { margin:0 0 4px; } .muted { color:var(--muted); } .error { color:#b42318; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:12px 16px; margin-bottom:12px; }
.login { max-width:340px; margin:80px auto; display:grid; gap:10px; }
input, select, textarea, button { font:inherit; padding:6px 8px; border:1px solid var(--line); border-radius:6px; }
button { background:var(--accent); color:#fff; border:none; cursor:pointer; } button:disabled { opacity:.5; cursor:not-allowed; }
button.link { background:none; color:#ccc; text-decoration:underline; padding:0; }
.filters, details form { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:12px 0; }
table { width:100%; border-collapse:collapse; background:var(--card); }
th, td { text-align:left; padding:8px; border-bottom:1px solid var(--line); }
.click { cursor:pointer; } tr.click:hover { background:#faf7f2; }
.chip { display:inline-block; font-size:11px; padding:1px 8px; border-radius:10px; margin:1px; background:#eee; }
.seg-rising { background:#e6f4ea; } .seg-popular { background:#fff4e0; } .seg-anchor { background:#e8eefc; }
.tier { font-weight:600; padding:1px 8px; border-radius:6px; }
.tier-A { background:var(--good); color:#fff; } .tier-B { background:#8bbf6a; } .tier-C { background:#f2d27a; } .tier-D { background:#ddd; }
#drawer { z-index:1; position:fixed; top:50px; right:0; width:min(520px,100%); height:calc(100% - 50px); overflow:auto; background:var(--card); border-left:1px solid var(--line); padding:20px; box-shadow:-4px 0 20px #0002; }
.close { position:absolute; top:12px; right:12px; }
.factor { margin:6px 0; } .row { display:flex; justify-content:space-between; }
.bar { height:6px; background:#eee; border-radius:3px; } .fill { height:100%; background:var(--accent); border-radius:3px; }
.pitch { font-style:italic; border-left:3px solid var(--accent); padding-left:10px; }
textarea { width:100%; min-height:60px; display:block; margin:8px 0; }
.board { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-top:12px; } .col h3 { text-transform:capitalize; margin:0; }
.kpis { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin:12px 0; } .big { font-size:24px; font-weight:600; }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:12px; }
.activity { list-style:none; padding:0; } .activity li { border-bottom:1px solid var(--line); padding:6px 0; }
@media (max-width:900px) { .board, .kpis { grid-template-columns:1fr 1fr; } }
.small { font-size:12px; }
.log { white-space:pre-wrap; font-size:12px; background:#faf7f2; padding:8px; border-radius:6px; max-height:260px; overflow:auto; }
.log:empty { display:none; }
.source { display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:10px 0; border-bottom:1px solid var(--line); }
.counties { display:flex; flex-wrap:wrap; gap:4px 10px; width:100%; font-size:12px; }
.facts { margin:8px 0; } .facts th { width:150px; color:var(--muted); font-weight:500; vertical-align:top; } .facts th, .facts td { padding:4px 6px; }
.fill.unknown { background:#ccc; }
.activity pre { margin:2px 0 0; white-space:pre-wrap; font:inherit; }
.kpis { grid-template-columns:repeat(6,1fr); }

.demo { border-top:1px solid var(--line); padding-top:12px; margin-top:4px; }
.demo-buttons { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
button.ghost { background:none; color:var(--ink); border:1px solid var(--line); font-size:13px; padding:4px 10px; }
button.ghost:hover { border-color:var(--accent); color:var(--accent); }
.error:empty { display:none; }