:root {
  --card-width: 3.3in;
  --card-height: 1.8in;
  --surface: linear-gradient(180deg, var(--theme-surface-strong) 0%, var(--theme-surface) 100%);
  --border: var(--theme-border-strong);
  --ink: var(--theme-text);
  --muted: var(--theme-text-muted);
  --accent: var(--theme-accent);
  --range-low: var(--theme-surface-muted);
  --range-mid: #d6ccc0;
  --range-high: #b9afa4;
  --measure: linear-gradient(90deg, var(--theme-neutral-strong) 0%, var(--theme-accent) 100%);
  --target: var(--theme-surface-strong);
}

html[data-theme="dark"] {
  --range-mid: #2a2325;
  --range-high: #383032;
}

body {
  margin: 0;
}

.bullet-card {
  width: var(--card-width);
  min-height: var(--card-height);
  padding: 0.22in;
  border-radius: var(--theme-radius-md);
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--ink);
  box-shadow: var(--theme-shadow-xs);
}

.card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.18in;
}

.eyebrow {
  margin: 0 0 0.08in;
  font-size: 0.11in;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent);
}

h1 {
  margin: 0;
  font-size: 0.28in;
  line-height: 1.02;
  letter-spacing: -0.04em;
  font-weight: 600;
}

.headline {
  font-size: 0.3in;
  font-weight: 600;
  letter-spacing: -0.04em;
}

.bullet-scale {
  position: relative;
  display: grid;
  grid-template-columns: 0.28fr 0.36fr 0.36fr;
  height: 0.26in;
  margin-top: 0.22in;
  border-radius: var(--theme-radius-pill);
  overflow: hidden;
}

.range { display: block; height: 100%; }
.range-low { background: var(--range-low); }
.range-mid { background: var(--range-mid); }
.range-high { background: var(--range-high); }

.measure {
  position: absolute;
  top: 0.04in;
  left: 0.14in;
  width: 76%;
  height: 0.18in;
  border-radius: var(--theme-radius-pill);
  background: var(--measure);
}

.target {
  position: absolute;
  top: -0.02in;
  left: 82%;
  width: 0.03in;
  height: 0.32in;
  border-radius: var(--theme-radius-pill);
  background: var(--target);
}

.scale-labels {
  display: flex;
  justify-content: space-between;
  margin-top: 0.08in;
  font-size: 0.11in;
  color: var(--muted);
}

.footnote {
  margin: 0.16in 0 0;
  font-size: 0.14in;
  line-height: 1.55;
  color: var(--muted);
}