:root {
  --bg: #08090a;
  --text: #f7f8f8;
  --muted: #8a8f98;
  --line: rgba(255, 255, 255, 0.08);
  --card: rgba(255, 255, 255, 0.02);
  --win: #d6ff4a;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "IBM Plex Sans", system-ui, sans-serif;
  font-feature-settings: "ss03";
}
.num { font-family: "IBM Plex Mono", ui-monospace, monospace; font-variant-numeric: tabular-nums; }
#verdict .plan { color: var(--win); }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 8px; }

/* Layout only: no colour beyond the tokens above. */
header, main, footer { max-width: 960px; margin: 0 auto; padding: 24px; }
h1, h2, h3 { font-weight: 500; margin: 0 0 8px; }
h1 { font-size: 20px; }
h2 { font-size: 14px; color: var(--muted); }
h3 { font-size: 16px; }
p { margin: 4px 0; }
section { padding: 24px 0; border-top: 1px solid var(--line); }
#verdict .plan { font-size: 28px; font-weight: 500; }
#verdict ul { list-style: none; padding: 0; margin: 12px 0; }
#verdict li { display: grid; grid-template-columns: 140px 140px 1fr; padding: 4px 0; }
.label, .effort, .meter, .ratio, header p, footer a { color: var(--muted); }
.columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.card { padding: 16px; margin-bottom: 12px; }
footer a { display: block; font-size: 13px; margin: 4px 0; }