@layer components{.card{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-ambient)}.card[data-padding=sm]{padding:clamp(28px,3vw,40px)}.card[data-padding=md]{padding:clamp(32px,4vw,48px)}.card[data-padding=lg]{padding:clamp(32px,4vw,56px)}.card[data-tone=ink]{background:var(--ink);color:var(--surface)}.card[data-interactive=tonal]{transition:background .4s var(--ease)}.card[data-interactive=tonal]:hover{background:var(--primary-soft)}.card[data-interactive=lift]{transition:transform .35s var(--ease), box-shadow .4s var(--ease)}.card[data-interactive=lift]:hover{box-shadow:var(--shadow-lifted);transform:translateY(-2px)}}
@layer components{.health-ring{--health-ring-size:64px;--health-ring-thickness:6px;--health-ring-tone:var(--warn);--health-ring-pct:0;width:var(--health-ring-size);height:var(--health-ring-size);background:conic-gradient(var(--health-ring-tone) calc(var(--health-ring-pct) * 1%), #19171514 0);border-radius:50%;flex:none;place-items:center;display:grid;position:relative}.health-ring:before{content:"";inset:var(--health-ring-thickness);background:var(--surface);border-radius:50%;position:absolute}.health-ring__pct{letter-spacing:-.015em;color:var(--ink);font-feature-settings:"tnum";align-items:baseline;font-size:16px;font-weight:700;display:inline-flex;position:relative}.health-ring__num{text-align:right;min-width:1ch;display:inline-block}.health-ring__unit{color:var(--ink-4);margin-left:1px;font-size:10px;font-style:normal;font-weight:600}}
@layer components{.pill{letter-spacing:.18em;text-transform:uppercase;border-radius:var(--r-sm);flex:none;padding:4px 8px;font-size:9px;font-weight:700;display:inline-block}.pill--missing{background:var(--danger-soft);color:var(--danger)}.pill--outdated{background:var(--warn-soft);color:#a66e00}.pill--good{background:var(--good-soft);color:var(--good)}.pill--neutral{background:var(--ghost);color:var(--ink-3)}}
@layer components{.status{color:var(--ink-3);margin-top:2px;font-size:12px;display:block}.status--good{color:var(--good)}.status--warn{color:#a66e00}}
@layer components{.health-card{flex-direction:column;gap:20px;display:flex}.health-card__top{align-items:center;gap:18px;display:flex}.health-card__meta{flex-direction:column;gap:4px;min-width:0;display:flex}.health-card__label{letter-spacing:-.01em;color:var(--ink);font-size:15px;font-weight:700}.health-card__issues{border-top:1px solid var(--ghost);flex-direction:column;gap:10px;margin:0;padding:16px 0 0;list-style:none;display:flex}.health-card__issues li{color:var(--ink);align-items:center;gap:12px;font-size:14px;display:flex}.health-card .health-card__issues li{opacity:0;transition:opacity .5s var(--ease), transform .5s var(--ease);transform:translateY(6px)}.health-card.is-animated .health-card__issues li{opacity:1;transform:translateY(0)}.health-card.is-animated .health-card__issues li:first-child{transition-delay:.75s}.health-card.is-animated .health-card__issues li:nth-child(2){transition-delay:.9s}}
@layer components{.acc__list{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-ambient);flex-direction:column;display:flex;overflow:hidden}.acc__item+.acc__item{box-shadow:inset 0 1px 0 var(--ghost)}.acc__header{font:inherit;font-weight:inherit;margin:0}.acc__trigger{width:100%;font:inherit;letter-spacing:-.015em;text-align:left;color:var(--ink);cursor:pointer;transition:background .25s var(--ease);background:0 0;border:0;grid-template-columns:1fr auto;align-items:center;gap:24px;padding:28px clamp(24px,3vw,40px);font-size:clamp(18px,1.75vw,22px);font-weight:600;display:grid}.acc__trigger:hover{background:var(--surface-low)}.acc__icon{width:18px;height:18px;transition:transform .35s var(--ease);display:block;position:relative}.acc__icon:before,.acc__icon:after{content:"";background:var(--ink);border-radius:1px;position:absolute}.acc__icon:before{height:1.5px;top:50%;left:0;right:0;transform:translateY(-50%)}.acc__icon:after{width:1.5px;transition:transform .35s var(--ease);top:0;bottom:0;left:50%;transform:translate(-50%)}.acc__trigger[data-panel-open] .acc__icon:after{transform:translate(-50%)scaleY(0)}.acc__body{color:var(--ink-2);max-width:80ch;padding:0 clamp(24px,3vw,40px) 28px;font-size:16px;font-weight:400;line-height:1.65}.acc__body em{color:var(--ink);font-style:italic}}
