/* Selected work — scoped under .sw */
.sw{
  --bg:#0E0E0C; --surface:#181815; --ink:#EDE8DE; --muted:#A8A296; --border:#3A3934; --pill:#57534A;
  --lime:#D4F53C; --lime-hover:#C2E52E; --on-lime:#2E3310; --link:#EDE8DE;
  --p-olive:#4F5E08; --p-olive-ink:#2E3310; --p-ink:#0E0E0C; --p-lime:#D4F53C; --p-amber:#C98A1B;
  --p-bone:#EDE8DE; --p-sand:#C9C3B6; --p-muted:#A8A296; --p-ash:#57534A; --p-white:#FFFFFF; --p-line:#3A3934; --p-rust:#A94B3B;
  --ease:cubic-bezier(.2,.7,.2,1);
  background:var(--bg); color:var(--ink); border-top:1px solid var(--border);
}
.sw :focus-visible{outline:2px solid var(--ink);outline-offset:3px}
/* resets against site-wide classes */
.sw .bars{display:block;height:auto;border:0;padding:0;margin:0;gap:0}
.sw .chip{padding:0 10px}
.sw .fit{margin:0}
.sw .label{font-family:var(--mono); font-size:12px; letter-spacing:0.08em; color:var(--muted); margin:0}
.sw .sec{padding-block:clamp(48px, 5vw, 72px)}
.sw .sec-head{display:flex; justify-content:space-between; align-items:baseline; gap:20px; flex-wrap:wrap; margin-bottom:clamp(24px, 3vw, 40px)}
.sw .cards{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:20px}
.sw .card{background:var(--surface); border:0; border-radius:10px; overflow:hidden; display:flex; flex-direction:column; transition:transform .25s ease, box-shadow .25s ease}
.sw .card:hover{transform:translateY(-4px); box-shadow:0 12px 40px rgba(14,14,12,.08), 0 4px 12px rgba(14,14,12,.04)}
.sw .card-body{padding:20px 24px 24px}
.sw .card-body h3{font-family:var(--serif); font-weight:400; font-size:clamp(22px, 1.8vw, 26px); line-height:1.15; margin:8px 0 6px}
.sw .card-body p{margin:0; color:var(--muted); font-size:15px}
.sw .viz{position:relative; display:flex; flex-direction:column; gap:12px; padding:18px 20px 14px; min-height:360px; transition:transform .3s ease}
.sw .card:hover .viz{transform:scale(1.01)}
.sw .v-lime{background:var(--p-lime); color:var(--p-olive-ink)}
.sw .v-rust{background:var(--p-rust); color:var(--p-white)}
.sw .v-amber{background:var(--p-amber); color:var(--p-ink)}
.sw .viz-top{display:flex; justify-content:space-between; align-items:center; gap:8px 14px; flex-wrap:wrap; min-height:36px}
.sw .viz-plot{position:relative; flex:1; min-height:220px}
.sw .viz-foot{display:flex; justify-content:space-between; align-items:center; gap:6px 14px; flex-wrap:wrap; min-height:18px}
.sw .viz-note{margin:0; font-family:var(--mono); font-size:10px; letter-spacing:0.06em}
.sw .v-rust .viz-note{color:var(--p-white)}
.sw .v-lime .viz-note,.sw .v-amber .viz-note{color:inherit}
.sw .viz-status{font-family:var(--mono); font-size:11px; letter-spacing:0.03em}
.sw .viz button{font-family:inherit}
.sw .viz :focus-visible{outline:2px solid currentColor; outline-offset:2px}
.sw .viz-btn{display:inline-flex; align-items:center; gap:6px; min-height:32px; padding:0 12px; border:0; border-radius:5px; font:500 12px/1 var(--sans); cursor:pointer}
.sw .v-amber .viz-btn{background:var(--p-ink); color:var(--p-bone)}
.sw .tip{position:absolute; z-index:3; pointer-events:none; background:var(--p-ink); color:var(--p-bone); font:11px/1.5 var(--mono); padding:8px 10px; border-radius:4px; white-space:nowrap; transform:translate(-50%, calc(-100% - 10px)); opacity:0; transition:opacity .12s ease}
.sw .tip.show{opacity:1}
.sw .tip b{display:block; font-weight:500}
.sw .v-lime .tip{background:var(--p-ink); color:var(--p-bone)}
.sw .key{display:inline-flex; align-items:center; gap:6px; font-family:var(--mono); font-size:10px; letter-spacing:0.04em}
.sw .key i{display:inline-block; width:16px; height:0; border-top:2.5px solid currentColor}
.sw .key i.dash{border-top-style:dashed}
.sw .chips{display:inline-flex; flex-wrap:wrap; gap:5px}
.sw .chip{display:inline-flex; align-items:center; gap:6px; min-height:30px; padding:0 10px; border-radius:999px; border:1px solid var(--p-olive-ink); background:transparent; color:inherit; font:500 11px/1 var(--mono); letter-spacing:0.03em; cursor:pointer; transition:all .15s ease}
.sw .chip .dot{width:8px; height:8px; border-radius:2px; background:var(--c)}
.sw .chip[aria-pressed="true"]{background:var(--p-ink); border-color:var(--p-ink); color:var(--p-lime)}
.sw .bars{position:absolute; inset:0}
.sw .bar{position:absolute; top:0; bottom:0; left:calc(var(--slot, 0) * 10% + 2px); width:calc(10% - 4px); padding:0; margin:0; border:0; background:none; color:inherit; cursor:pointer; transition:left .6s var(--ease)}
.sw .stack{position:absolute; left:0; right:0; top:8px; bottom:18px; display:flex; flex-direction:column-reverse; gap:2px}
.sw .stack span{display:block; flex:none; height:0; border-radius:1px; transition:height .6s var(--ease)}
.sw .c-police{background:var(--p-ink)}
.sw .c-prisons{background:var(--p-olive)}
.sw .c-judiciary{background:var(--p-amber)}
.sw .bar-lab{position:absolute; left:0; right:0; bottom:0; text-align:center; font:10px/1 var(--mono); color:var(--p-olive-ink)}
.sw .bar:hover .stack,.sw .bar.on .stack{outline:1px solid var(--p-ink); outline-offset:3px}
.sw .lag-plot svg{position:absolute; left:0; right:0; top:0; bottom:22px; width:100%; height:calc(100% - 22px); overflow:visible}
.sw .ticks{position:absolute; left:0; right:0; bottom:0; height:14px; font-family:var(--mono); font-size:10px; color:var(--p-white)}
.sw .ticks span{position:absolute; bottom:0; transform:translateX(-50%); white-space:nowrap}
.sw .ticks span:first-child{transform:none}
.sw .ticks span:last-child{transform:translateX(-100%)}
.sw .fires{fill:none; stroke:var(--p-ink); stroke-width:2.5; stroke-linejoin:round; transition:transform .45s var(--ease)}
.sw .aqi{fill:none; stroke:var(--p-white); stroke-width:2; stroke-dasharray:6 5}
.sw .axis{stroke:var(--p-ink)}
.sw .lag-ctl{display:flex; align-items:center; gap:8px; font-family:var(--mono); font-size:11px}
.sw .lag-ctl input{accent-color:var(--p-ink); width:120px; margin:0}
.sw .lag-ctl output{min-width:5em}
.sw .fit{font:500 11px/1 var(--mono); letter-spacing:0.03em; padding:7px 9px; border-radius:4px; border:1px solid var(--p-white); transition:all .2s ease}
.sw .fit.best{background:var(--p-lime); border-color:var(--p-lime); color:var(--p-olive-ink)}
.sw .v-rust .key.k-fires{color:var(--p-ink)}
.sw .v-rust .key.k-aqi{color:var(--p-white)}
.sw .gst-plot{display:flex; flex-direction:column; gap:10px}
.sw .kpis{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:6px}
.sw .kpi{background:var(--p-bone); color:var(--p-ink); border-radius:5px; padding:10px 10px; min-width:0}
.sw .kpi span{display:block; font-family:var(--mono); font-size:10px; letter-spacing:0.02em; color:var(--p-ash); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.sw .kpi b{display:block; margin-top:4px; font:500 clamp(14px, 1.3vw, 17px)/1.15 var(--sans); font-variant-numeric:tabular-nums}
.sw .months{position:relative; flex:1; min-height:140px}
.sw .mbar{position:absolute; top:0; bottom:0; left:calc(var(--i) * (100% / 12) + 2px); width:calc(100% / 12 - 4px); padding:0; margin:0; border:0; background:none; color:inherit; cursor:pointer}
.sw .mbar .fill{position:absolute; left:0; right:0; bottom:18px; height:0; border:1.5px solid var(--p-ink); border-bottom:0; border-radius:3px 3px 0 0; background:transparent; transition:height .55s var(--ease) var(--d, 0s), background-color .2s ease}
.sw .mbar:hover .fill{background:rgba(14,14,12,.18)}
.sw .mbar[aria-pressed="true"] .fill{background:var(--p-ink)}
.sw .mbar .lab{position:absolute; left:-4px; right:-4px; bottom:0; text-align:center; font:10px/1 var(--mono)}
.sw .months::after{content:""; position:absolute; left:0; right:0; bottom:18px; border-top:1.5px solid var(--p-ink)}
@media (prefers-reduced-motion: reduce){
.sw .bar,.sw .stack span,.sw .fires,.sw .mbar .fill,.sw .chip,.sw .fit,.sw .card,.sw .viz{transition:none !important}}
.sw .ba-card{position:relative; min-height:360px; border-radius:10px 10px 0 0; overflow:hidden; user-select:none; -webkit-user-select:none; touch-action:pan-y}
.sw .ba-layer{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:clamp(14px, 2vw, 24px)}
.sw .ba-before{background:var(--p-white); z-index:1}
.sw .ba-after{background:var(--p-lime); z-index:2; clip-path:inset(0 0 0 50%)}
.sw .ba-layer .ba-content{width:100%; height:100%; display:flex; flex-direction:column; gap:12px}
.sw .ba-label{font-family:var(--mono); font-size:12px; letter-spacing:0.08em}
.sw .ba-before .ba-label{color:var(--p-ash)}
.sw .ba-after .ba-label{color:var(--p-olive-ink)}
.sw .ba-lines{flex:1; display:flex; flex-direction:column; justify-content:center; gap:8px}
.sw .ba-line{height:7px; border-radius:2px}
.sw .ba-before .ba-line{background:var(--p-sand)}
.sw .ba-after .ba-line{background:var(--p-olive-ink)}
.sw .ba-table{flex:1; display:flex; flex-direction:column}
.sw .ba-thead{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:4px; padding:8px 0; border-bottom:2px solid var(--p-olive-ink)}
.sw .ba-thead span{font-family:var(--mono); font-size:11px; letter-spacing:0.04em; color:var(--p-olive-ink)}
.sw .ba-trow{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:4px; padding:5px 0; border-bottom:1px solid var(--p-olive); font-size:12px; color:var(--p-olive-ink)}
.sw .ba-trow span:first-child{font-weight:500}
.sw .ba-handle{position:absolute; z-index:3; top:0; bottom:0; left:50%; width:4px; margin-left:-2px; background:var(--p-ink); cursor:ew-resize; touch-action:none}
.sw .ba-handle::after{content:"⟺"; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:34px; height:34px; border-radius:50%; background:var(--p-ink); color:var(--p-bone); display:flex; align-items:center; justify-content:center; font-size:13px; box-shadow:0 2px 8px rgba(0,0,0,.3)}
.sw .ba-hint{position:absolute; z-index:4; bottom:10px; left:50%; transform:translateX(-50%); font:500 9px/1 var(--mono); letter-spacing:0.1em; color:var(--p-ash); background:rgba(255,255,255,.85); padding:4px 10px; border-radius:999px; pointer-events:none}
@media (max-width: 760px){.sw .cards{grid-template-columns:minmax(0, 1fr)}
.sw .viz{padding:16px 14px 12px}
.sw .lag-ctl input{width:100px}
.sw .ba-card{min-height:280px}}

/* match site section heads */
.sw .sec{padding-block:112px}
.sw .sec-head{align-items:flex-end;margin-bottom:56px}
.sw .sec-head p{margin:0;max-width:380px;font-size:17px;color:var(--muted)}
.sw .kicker{color:var(--muted)}