/* Brick.sg portal components — editorial dashboard layer (complements style.css) */
:root{
  --pos:#1a7a43; --pos-bg:#eaf5ee;
  --warn:#b8860b; --warn-bg:#fbf4e3;
  --neg:#c0563a; --neg-bg:#fbeee9;
  --ink:#123E2D; --line:#e6e3da; --muted:#5b6b60;
}
.portal-hero{padding:40px 0 8px}
.portal-hero h1{font-family:var(--serif,'Playfair Display',serif);font-size:2.4rem;line-height:1.1;color:var(--ink);margin:0 0 12px;max-width:20ch}
.portal-hero p.lede{font-size:1.12rem;color:#33413a;max-width:60ch;margin:0 0 20px}
.cta-row{display:flex;flex-wrap:wrap;gap:10px}
.btn-primary,.btn-ghost{display:inline-block;padding:11px 18px;border-radius:10px;font-weight:600;text-decoration:none;font-size:.95rem}
.btn-primary{background:var(--ink);color:#fff}
.btn-ghost{background:#fff;color:var(--ink);border:1px solid var(--ink)}
.eyebrow{text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;font-weight:700;color:var(--muted);margin:34px 0 10px}
h2.sec{font-family:var(--serif,serif);font-size:1.5rem;color:var(--ink);margin:6px 0 4px}
.sec-sub{color:var(--muted);margin:0 0 16px;font-size:.95rem}

/* Snapshot tiles */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.tile{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.tile .lbl{font-size:.78rem;color:var(--muted);font-weight:600;line-height:1.3}
.tile .val{font-family:var(--serif,serif);font-size:1.5rem;color:var(--ink);margin:4px 0 2px}
.tile .meta{font-size:.72rem;color:var(--muted)}
.arrow.up{color:var(--pos)} .arrow.down{color:var(--neg)} .arrow.flat{color:var(--muted)}
.tile a{color:var(--muted);text-decoration:underline}

/* Signal boxes / badges */
.signals{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.sigbox{border:1px solid var(--line);border-radius:12px;padding:14px 16px;background:#fff}
.sigbox .lbl{font-size:.8rem;color:var(--muted);font-weight:600}
.badge-sig{display:inline-block;padding:3px 11px;border-radius:999px;font-weight:700;font-size:.82rem;margin-top:8px}
.badge-sig.pos{background:var(--pos-bg);color:var(--pos)}
.badge-sig.warn{background:var(--warn-bg);color:var(--warn)}
.badge-sig.neg{background:var(--neg-bg);color:var(--neg)}
.sigbox p{font-size:.82rem;color:#3a463d;margin:8px 0 0;line-height:1.5}

/* Tables */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:#fff}
table.data{width:100%;border-collapse:collapse;font-size:.9rem;min-width:720px}
table.data th,table.data td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line)}
table.data th{background:#f6f4ee;font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);cursor:pointer;white-space:nowrap}
table.data th[data-sort]:after{content:" ⇅";opacity:.4}
table.data td.num{text-align:right;font-variant-numeric:tabular-nums}
table.data tr:hover td{background:#fbfaf7}
.pill{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.76rem;font-weight:600}
.pill.pos{background:var(--pos-bg);color:var(--pos)} .pill.warn{background:var(--warn-bg);color:var(--warn)} .pill.neg{background:var(--neg-bg);color:var(--neg)}
.src{font-size:.75rem;color:var(--muted);margin:10px 2px 0}

/* Filter chips */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 13px;font-size:.82rem;cursor:pointer;color:var(--ink)}
.chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}

/* Cards grid */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.city-card{border:1px solid var(--line);border-radius:12px;padding:16px;background:#fff;display:flex;flex-direction:column}
.city-card h3{margin:0 0 4px;font-family:var(--serif,serif);color:var(--ink);font-size:1.2rem}
.city-card .thesis{font-size:.9rem;color:#3a463d;line-height:1.5;margin:6px 0}
.kv{display:flex;justify-content:space-between;font-size:.84rem;padding:3px 0;border-bottom:1px dotted var(--line)}
.kv span:first-child{color:var(--muted)}
.city-card a.more{margin-top:auto;padding-top:10px;font-weight:600;color:var(--ink)}

/* Tool cards */
.tools{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.tool{border:1px solid var(--line);border-radius:12px;padding:14px 16px;background:#fff;text-decoration:none;color:var(--ink);display:block}
.tool b{display:block;color:var(--ink)} .tool span{font-size:.82rem;color:var(--muted)}

/* Journey timeline */
.journey{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;counter-reset:step}
.jstep{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:#fff;position:relative}
.jstep b{display:block;color:var(--ink);font-size:.92rem;margin-top:4px}
.jstep .n{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--ink);color:#fff;font-size:.78rem;font-weight:700}
.jstep a{font-size:.8rem;color:var(--muted)}

/* Policy timeline */
.policy{border-left:2px solid var(--line);margin-left:6px}
.pol{position:relative;padding:0 0 20px 22px}
.pol:before{content:"";position:absolute;left:-7px;top:4px;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--ink)}
.pol .date{font-size:.78rem;color:var(--muted);font-weight:600}
.pol h4{margin:2px 0 4px;font-size:1rem;color:var(--ink)}
.pol .st{display:inline-block;padding:1px 9px;border-radius:999px;font-size:.72rem;font-weight:700;margin-left:6px;vertical-align:middle}
.st.inforce{background:var(--pos-bg);color:var(--pos)} .st.legislated{background:var(--warn-bg);color:var(--warn)} .st.announced{background:#eef2ef;color:var(--muted)}
.pol p{margin:4px 0;font-size:.86rem;color:#3a463d;line-height:1.5}

/* Next dates strip */
.nextdates{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 0}
.nextdates .nd{background:#f6f4ee;border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-size:.82rem}
.nextdates .nd b{color:var(--ink)}

/* Disclaimer */
.disclaimer{margin:34px 0 10px;padding:12px 16px;background:#f6f4ee;border:1px solid var(--line);border-radius:10px;font-size:.8rem;color:#4a564d;line-height:1.55}

/* Verdict / area blocks (city pages) */
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.vbox{border:1px solid var(--line);border-radius:12px;padding:14px 16px;background:#fff}
.vbox h4{margin:0 0 6px;font-size:.82rem;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.vbox p,.vbox li{font-size:.88rem;color:#3a463d;line-height:1.5}
@media(max-width:640px){ table.data{min-width:560px} .portal-hero h1{font-size:1.9rem} }