/* Medic design system — see DESIGN-SYSTEM.md. Dark-committed, triage palette. */
:root{
  --ward:#0D1210; --steel:#161D1A; --steel-2:#1C2521; --line:#25332C;
  --gauze:#E9E6DC; --dim:#93A099; --faint:#5C6B63;
  --ok:#1FA878; --ok-text:#4CD9A6;
  --warn:#AC8B22; --warn-text:#E3B84A;
  --down:#CE3A30; --down-text:#F07A6E;
  --act:#3F8FD9; --act-text:#7FB9EC;
  --mono:ui-monospace,'SF Mono',SFMono-Regular,Menlo,monospace;
  --sans:system-ui,-apple-system,'Segoe UI',sans-serif;
  /* Scrollers read as a faint rail over the surface, never as OS chrome. */
  --scroll:rgba(233,230,220,.15);
  --scroll-hover:rgba(233,230,220,.3);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--ward);color:var(--gauze);font-family:var(--sans);
  font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}

/* Scrollbars ---------------------------------------------------------------
   The default macOS bar is a heavy light-grey slab that sits badly on a dark
   surface, and it shows up exactly where it's least wanted — inside modals. The
   track stays fully transparent; the thumb is a low-opacity pill held off the
   edge by a transparent border, so it floats over the surface instead of
   filling a gutter. */
*{scrollbar-width:thin;scrollbar-color:var(--scroll) transparent}
::-webkit-scrollbar{width:10px;height:10px;background:transparent}
::-webkit-scrollbar-track{background:transparent;border:0;box-shadow:none}
::-webkit-scrollbar-thumb{
  background-color:var(--scroll);border-radius:99px;
  border:3px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover,
::-webkit-scrollbar-thumb:active{background-color:var(--scroll-hover)}
::-webkit-scrollbar-corner{background:transparent}
/* Arrow buttons would put the OS look straight back on platforms that draw them. */
::-webkit-scrollbar-button{display:none;width:0;height:0}
a{color:var(--act-text);text-decoration:none}
h1,h2,h3{letter-spacing:-.02em;text-wrap:balance}
.mono{font-family:var(--mono)}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--dim);text-transform:uppercase}
.btn{display:inline-block;font-weight:600;font-size:14.5px;border-radius:7px;padding:11px 20px;
  border:1px solid transparent;cursor:pointer;background:none;color:var(--gauze)}
.btn.primary{background:var(--act);color:#fff}
.btn.ghost{border-color:var(--line)}
.btn:disabled{opacity:.5;cursor:default}
.chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.06em;padding:2px 8px;border-radius:99px;border:1px solid}
.chip.ok{color:var(--ok-text);border-color:rgba(31,168,120,.5);background:rgba(31,168,120,.09)}
.chip.warn{color:var(--warn-text);border-color:rgba(172,139,34,.55);background:rgba(172,139,34,.1)}
.chip.down{color:var(--down-text);border-color:rgba(206,58,48,.55);background:rgba(206,58,48,.1)}
.chip.act{color:var(--act-text);border-color:rgba(63,143,217,.55);background:rgba(63,143,217,.1)}
.card{border:1px solid var(--line);border-radius:9px;background:var(--steel);padding:18px}
input,select,textarea{background:var(--ward);border:1px solid var(--line);border-radius:6px;color:var(--gauze);
  padding:9px 11px;font:inherit;width:100%;max-width:100%}
/* Custom select — no native OS chrome. */
select{-webkit-appearance:none;appearance:none;cursor:pointer;padding-right:34px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2393A099' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center}
select:focus,input:focus,textarea:focus{outline:none;border-color:var(--act)}
select option{background:var(--steel);color:var(--gauze)}
input:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--act);outline-offset:1px}
label{display:block;font-size:12px;color:var(--dim);margin:10px 0 4px}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);
  text-align:left;font-weight:500;padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:9px 8px;border-bottom:1px solid var(--line);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;max-width:240px;vertical-align:middle}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--dim)}
@keyframes medic-draw{to{stroke-dashoffset:0}}
