/* Usage and cost page. Foundation language: hairline rules, mono for values, status as words plus shapes, no gradients. */
.us{--us-surface:var(--bg)}
.us-fresh{font-size:12px;margin:-4px 0 12px;min-height:16px}
.us-hero{padding:6px 0 14px;border-bottom:1px solid var(--bd);margin-bottom:14px;display:grid;gap:4px}
.us-h1{font:600 28px/1.15 var(--mono);letter-spacing:-.01em;text-wrap:balance}
.us-h2{font:500 17px/1.3 var(--mono);color:var(--ink2);display:flex;gap:10px;flex-wrap:wrap;align-items:baseline}
.us-proj{font:600 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);border:1px solid var(--bd2);border-radius:var(--r);padding:0 5px}
.us-plan{display:flex;gap:10px;flex-wrap:wrap;align-items:baseline;border:1px solid var(--bd);border-radius:var(--r);background:var(--sf);padding:8px 12px;margin-bottom:14px}
.us-link{color:var(--acc)}
.us-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:0;border-top:1px solid var(--bd);border-left:1px solid var(--bd);margin-bottom:18px}
.us-card{display:grid;gap:6px;padding:12px 14px;border-right:1px solid var(--bd);border-bottom:1px solid var(--bd);min-width:0;align-content:start;background:var(--sf)}
.us-ct{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.us-big{font:600 22px/1.2 var(--mono)}
.us-big small{font:400 12px var(--font);color:var(--ink3);margin-left:4px}
.us-meta{font-size:12px}
.us-bar{display:grid;grid-template-columns:minmax(60px,1fr) 52px auto;align-items:center;gap:10px;min-height:22px}
.us-bt{position:relative;height:8px;background:var(--sf3);border-radius:2px;display:block}
.us-bf{position:absolute;left:0;top:0;bottom:0;border-radius:2px;display:block}
.us-f-OK{background:var(--acc)} .us-f-WATCH{background:var(--warn)} .us-f-HIGH{background:var(--crit)}
.us-f-OVER{background:repeating-linear-gradient(135deg,var(--crit) 0 3px,color-mix(in srgb,var(--crit) 45%,transparent) 3px 6px)}
.us-mk{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--ink);border-radius:1px;transform:translateX(-1px)}
.us-bp{font:600 13px var(--mono);text-align:right}
.us-w{display:inline-flex;align-items:center;gap:6px;font:600 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.us-w svg{fill:currentColor;flex:none}
.us-OK{color:var(--ink3)} .us-WATCH{color:var(--warn)} .us-HIGH,.us-OVER{color:var(--crit)} .us-NA{color:var(--ink3)}
.us-na .i2{margin:0}
.us-block{margin:0 0 20px}
.us-row{display:grid;grid-template-columns:minmax(0,1.1fr) 76px minmax(0,1.3fr) minmax(0,.8fr);gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--bd);min-height:36px}
.us-row .i3{font-size:12px;overflow-wrap:anywhere}
.us-est{font-weight:600}
.us-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.us-charts > div{min-width:0}
.us-tbl{width:100%}
.us-notes ul{margin:0;padding-left:18px}
.us-setup{border:1px solid var(--bd2);border-radius:var(--r);background:var(--sf);padding:14px 16px;max-width:760px;margin-bottom:20px}
.us-setup h2{margin:0 0 8px;font:600 15px var(--font)}
.us-setup ol{margin:0 0 10px;padding-left:20px;display:grid;gap:8px}
.us-copyrow{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:10px 0}
.us-copyrow code{background:var(--sf3);padding:2px 8px;border-radius:var(--r)}
@media (max-width: 719px){
  .us-h1{font-size:22px}
  .us-h2{font-size:15px}
  .us-cards{grid-template-columns:minmax(0,1fr)}
  .us-charts{grid-template-columns:minmax(0,1fr)}
  .us-row{grid-template-columns:minmax(0,1fr) auto;row-gap:2px}
  .us-row .us-bar{grid-column:1/-1}
  .us-row .i3{grid-column:1/-1}
  .us-bar{grid-template-columns:minmax(40px,1fr) 48px auto}
}
