/* IZ4 brand tokens and components */
:root {
  --iz4-ink: #1c1a17;
  --iz4-paper: #f5f1e8;
  --iz4-green: #1f9156;
  --iz4-phi: 1.618;
  --iz4-font: "Inter Tight", Inter, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
/* mark: never stretch; clear space = one corner loop ≈ 9% of the rendered size */
.iz4-mark { display: inline-block; height: auto; aspect-ratio: 1 / 1; }
.iz4-mark img, .iz4-mark svg { width: 100%; height: 100%; padding: 9%; box-sizing: border-box; }
.iz4-mark--hero { width: min(60vw, 360px); }
.iz4-mark--footer { width: 96px; }
/* header lockup: mark + wordmark, wordmark height = mark / φ */
.iz4-lockup { display: inline-flex; align-items: center; gap: calc(var(--iz4-size, 72px) / 2.618); }
.iz4-lockup .iz4-lockup__mark { width: var(--iz4-size, 72px); height: var(--iz4-size, 72px); }
.iz4-lockup .iz4-lockup__word { height: calc(var(--iz4-size, 72px) / 1.618); width: auto; }
/* README / status pill */
.iz4-pill { display: inline-flex; align-items: center; height: 32px; border-radius: 5px; background: var(--iz4-paper);
  border: 1px solid rgba(28,26,23,.35); font: 600 16px/1 var(--iz4-font); color: var(--iz4-ink); overflow: hidden; }
.iz4-pill__plate { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 100%; background: var(--iz4-ink); }
.iz4-pill__plate::before { content: ""; width: 14px; height: 14px; background: var(--iz4-green); transform: rotate(45deg); }
.iz4-pill__text { padding: 0 10px; }
.iz4-pill__sub { padding-right: 10px; font-weight: 400; opacity: .6; }
/* live badge: never below 280px */
.iz4-badge-qr { display: inline-block; width: clamp(280px, 30vw, 480px); line-height: 0; }
/* dark surfaces: reverse ink and paper, keep green */
.iz4-dark { --iz4-ink: #f5f1e8; --iz4-paper: #1c1a17; }
.iz4-dark .iz4-mark img, .iz4-dark .iz4-mark svg { color: var(--iz4-ink); }