:root {
  --bg: #f6f7f9;
  --surface: #ffffff;
  --surface-2: #eef0f4;
  --line: #e2e5eb;
  --line-soft: #edeff3;
  --line-strong: #c3c8d2;

  --text: #101426;
  --text-2: #3d4457;
  --muted: #5b6377;
  --faint: #6a7285;

  --accent: #4338ca;
  --accent-2: #3b31b8;
  --on-accent: #ffffff;

  --radius: 8px;
  --radius-lg: 14px;
  --rule-w: 1px;
  --rule-color: #e2e5eb;

  --h1-size: clamp(42px, 6vw, 68px);
  --h1-a: #101426;
  --h1-b: #4338ca;
  --label-tracking: 0.1em;

  --mark-w: 22px;
  --mark-h: 6px;
  --mark-radius: 999px;

  --ours-bg: #eef0fb;
  --ours-fg: #3d4457;
  --ours-strong: #101426;
  --ours-sub: #5b6377;
  --ours-weight: 800;

  --chip-radius: 999px;
  --tag-bg: #e4e2fa;
  --tag-line: #c9c5f3;
  --chip-line: #d8dce6;
  --chip-bg: #ffffff;
  --chip-fg: #3d4457;

  --bullet-w: 7px;
  --bullet-h: 7px;
  --bullet-radius: 999px;


  --bg-route: #9aa3b5;
  --bg-shared: #6b7387;
  --bg-res-fill: #ffffff;
  --bg-dot: #4338ca;
  --bg-pulse: #4338ca;
  --bg-opacity: 0.5;
}

.layers-list,
.legal-row { box-shadow: 0 1px 2px rgb(16 20 38 / 0.05), 0 8px 24px rgb(16 20 38 / 0.05); }
.layers-ours { box-shadow: inset 4px 0 0 var(--accent); }
.spec-row { border-top: 0; --spec-gap: 16px; }
.spec-item,
.spec-note {
  padding: 26px 26px 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: 0 1px 2px rgb(16 20 38 / 0.05), 0 8px 24px rgb(16 20 38 / 0.05);
}
.spec-item + .spec-item { padding-left: 26px; border-left: 1px solid var(--line); }
.kicker { background: #ffffff; }
@media (max-width: 720px) {
  .spec-item + .spec-item { border-top: 1px solid var(--line); }
}