/* GENERATED by scripts/ds-kit — do not hand-edit.
 * Source: DESIGN-SYSTEM.md
 * System: FIIPDrive
 *
 * An unset field emits NO tokens. That is deliberate: code that needs a
 * value the spec has not decided will fail the raw-value gate instead of
 * quietly inventing one.
 * Skipped: none
 */

:root {
  --fiipdrive-bg: #000000;
  --fiipdrive-surface: #0a0a0b;
  --fiipdrive-surface-sunken: #0f0f11;
  --fiipdrive-surface-raised: #1b1b1f;
  --fiipdrive-ink: #fafafa;
  --fiipdrive-ink-2: #8a8a91;
  --fiipdrive-ink-3: #6a6a72;
  --fiipdrive-ink-4: #4e4e55;
  --fiipdrive-edge: #1a1a1e;
  --fiipdrive-edge-strong: #2c2c31;
  --fiipdrive-accent: #ffffff;
  --fiipdrive-accent-hover: #e4e4e7;
  --fiipdrive-accent-active: #c8c8cd;
  --fiipdrive-accent-wash: rgb(255 255 255 / 0.08);
  --fiipdrive-accent-ink: #0a0a0b;
  --fiipdrive-signal-success: #32d74b;
  --fiipdrive-signal-warning: #ff9f0a;
  --fiipdrive-signal-danger: #ff453a;
  --fiipdrive-signal-info: #0a84ff;
  --fiipdrive-residency-online-only: #98989d;
  --fiipdrive-residency-online-only-ink: #98989d;
  --fiipdrive-residency-downloading: #0a84ff;
  --fiipdrive-residency-downloading-ink: #ffffff;
  --fiipdrive-residency-on-this-mac: #98989d;
  --fiipdrive-residency-on-this-mac-ink: #98989d;
  --fiipdrive-residency-kept-offline: #32d74b;
  --fiipdrive-residency-kept-offline-ink: #ffffff;
  --fiipdrive-activity-in-use: #000000;
  --fiipdrive-activity-in-use-ink: #ffffff;
  --fiipdrive-transfer-uploading: #ff9f0a;
  --fiipdrive-transfer-failed: #ff453a;
  --fiipdrive-destructive-surface: #1f0807;
  --fiipdrive-destructive-border: #521613;
  --fiipdrive-destructive-text: #ff6a61;
  --fiipdrive-role-owner: #4b3f27;
  --fiipdrive-role-admin: #3a274b;
  --fiipdrive-role-member: #1f1f22;
  --fiipdrive-role-guest: #121214;
  --fiipdrive-role-ring-owner: #a48a52;
  --fiipdrive-role-ring-admin: #7d55a4;
  --fiipdrive-role-ring-member: #3a3a41;
  --fiipdrive-role-ring-guest: #2c2c31;
  --fiipdrive-drive-pitch: #161616;
  --fiipdrive-drive-obsidian: #242526;
  --fiipdrive-drive-graphite: #3b3c3e;
  --fiipdrive-drive-midnight: #25364f;
  --fiipdrive-drive-forest: #34493f;
  --fiipdrive-drive-aubergine: #43344b;
  --fiipdrive-drive-petrol: #29575f;
  --fiipdrive-drive-celadon: #516565;
  --fiipdrive-drive-burgundy: #66303d;
  --fiipdrive-drive-sage: #616861;
  --fiipdrive-drive-ash: #685f67;
  --fiipdrive-drive-olive: #727656;
  --fiipdrive-drive-mulberry: #764f5d;
  --fiipdrive-drive-slate: #525b66;
  --fiipdrive-drive-pewter: #55606a;
  --fiipdrive-drive-denim: #537291;
  --fiipdrive-drive-emerald: #208161;
  --fiipdrive-drive-azurite: #1a80b4;
  --fiipdrive-drive-carmine: #a73441;
  --fiipdrive-drive-burnt-copper: #a05c3e;
  --fiipdrive-drive-clay: #a0756d;
  --fiipdrive-drive-cobalt: #2f60de;
  --fiipdrive-drive-lilac: #9d89c4;
  --fiipdrive-drive-baby-green: #9cc7b1;
  --fiipdrive-drive-sand: #b2a38d;
  --fiipdrive-drive-light-pink: #c08ea0;
  --fiipdrive-drive-baby-blue: #a9cbe0;
  --fiipdrive-drive-ember: #db782e;
  --fiipdrive-drive-ochre: #dcac36;
  --fiipdrive-drive-terracotta: #dc7763;
  --fiipdrive-drive-chalk: #d5d2cc;
  --fiipdrive-drive-black: #2a2a2a;
  --fiipdrive-r-rule: 4px;
  --fiipdrive-r-tag: 6px;
  --fiipdrive-r-control: 8px;
  --fiipdrive-r-button: 8px;
  --fiipdrive-r-tile: 10px;
  --fiipdrive-r-card: 12px;
  --fiipdrive-r-frame: 16px;
  --fiipdrive-capsule: 9999px;
  --fiipdrive-space-xxs: 2px;
  --fiipdrive-space-xs: 4px;
  --fiipdrive-space-sm: 6px;
  --fiipdrive-space-md: 8px;
  --fiipdrive-space-lg: 12px;
  --fiipdrive-space-xl: 16px;
  --fiipdrive-space-xxl: 24px;
  --fiipdrive-space-section: 32px;
  --fiipdrive-font-display: "Inter", "Inter Variable", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --fiipdrive-font-body: "Inter", "Inter Variable", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --fiipdrive-font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
  --fiipdrive-text-hero-size: 72px;
  --fiipdrive-text-hero-weight: 600;
  --fiipdrive-text-hero-lh: 1.02;
  --fiipdrive-text-hero-track: -0.035em;
  --fiipdrive-text-display-size: 40px;
  --fiipdrive-text-display-weight: 600;
  --fiipdrive-text-display-lh: 1.12;
  --fiipdrive-text-display-track: -0.035em;
  --fiipdrive-text-title-size: 17px;
  --fiipdrive-text-title-weight: 600;
  --fiipdrive-text-title-lh: 1.3;
  --fiipdrive-text-title-track: -0.015em;
  --fiipdrive-text-body-size: 13px;
  --fiipdrive-text-body-weight: 400;
  --fiipdrive-text-body-lh: 1.5;
  --fiipdrive-text-body-track: 0em;
  --fiipdrive-text-small-size: 12px;
  --fiipdrive-text-small-weight: 400;
  --fiipdrive-text-small-lh: 1.4;
  --fiipdrive-text-small-track: 0em;
  --fiipdrive-text-label-size: 12px;
  --fiipdrive-text-label-weight: 500;
  --fiipdrive-text-label-lh: 1.45;
  --fiipdrive-text-label-track: 0.1em;
  --fiipdrive-shadow-md: inset 0 1px 0 rgb(255 255 255 / 0.05);
  --fiipdrive-shadow-lg: 0 16px 48px rgb(0 0 0 / 0.6);
  --fiipdrive-micro-duration: 120ms;
  --fiipdrive-micro-ease: cubic-bezier(0.2, 0, 0, 1);
  --fiipdrive-settle-duration: 180ms;
  --fiipdrive-settle-ease: cubic-bezier(0.2, 0, 0, 1);
  --fiipdrive-enter-duration: 240ms;
  --fiipdrive-enter-ease: cubic-bezier(0.2, 0, 0, 1);
  --fiipdrive-size-sm: 24px;
  --fiipdrive-size-md: 30px;
  --fiipdrive-size-lg: 36px;
  --fiipdrive-hit-target: 24px;
}
/* The update feed's front page (updates.fiipdrive.com, dev-updates.fiipdrive.com).
 *
 * scripts/publish-update.sh serves this appended to tokens.generated.css as one
 * same-origin style.css, because the page's CSP allows style-src 'self' and
 * nothing else: no inline style, no font or stylesheet from another host.
 * Tokens only. Monospace only inside pre.fiip-code (mono law, F4); hashes,
 * signatures and keys are Inter with tabular figures, selectable.
 */

:root { color-scheme: dark; }

*, *::before, *::after { box-sizing: border-box; }

html { background: var(--fiipdrive-bg); }

body {
  margin: 0;
  background: var(--fiipdrive-bg);
  color: var(--fiipdrive-ink);
  font-family: var(--fiipdrive-font-body);
  font-size: var(--fiipdrive-text-body-size);
  font-weight: var(--fiipdrive-text-body-weight);
  line-height: var(--fiipdrive-text-body-lh);
  font-feature-settings: "cv11";
  -webkit-font-smoothing: antialiased;
}

.page {
  max-width: 78ch;
  margin: 0 auto;
  padding: var(--fiipdrive-space-section) var(--fiipdrive-space-xl);
}

.eyebrow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--fiipdrive-space-md);
  margin: 0 0 var(--fiipdrive-space-xl);
  color: var(--fiipdrive-ink-2);
  font-size: var(--fiipdrive-text-label-size);
  font-weight: var(--fiipdrive-text-label-weight);
  line-height: var(--fiipdrive-text-label-lh);
  letter-spacing: var(--fiipdrive-text-label-track);
  text-transform: uppercase;
}

h1 {
  margin: 0 0 var(--fiipdrive-space-xl);
  font-family: var(--fiipdrive-font-display);
  font-size: var(--fiipdrive-text-display-size);
  font-weight: var(--fiipdrive-text-display-weight);
  line-height: var(--fiipdrive-text-display-lh);
  letter-spacing: var(--fiipdrive-text-display-track);
  text-wrap: balance;
}

h2, h3 {
  margin: 0 0 var(--fiipdrive-space-lg);
  font-family: var(--fiipdrive-font-display);
  font-size: var(--fiipdrive-text-title-size);
  font-weight: var(--fiipdrive-text-title-weight);
  line-height: var(--fiipdrive-text-title-lh);
  letter-spacing: var(--fiipdrive-text-title-track);
}

p { margin: 0 0 var(--fiipdrive-space-lg); }

.lede {
  max-width: 62ch;
  color: var(--fiipdrive-ink-2);
  font-size: var(--fiipdrive-text-title-size);
  line-height: var(--fiipdrive-text-body-lh);
  text-wrap: pretty;
}

section { margin-top: var(--fiipdrive-space-section); }

.tag {
  display: inline-flex;
  align-items: center;
  padding: var(--fiipdrive-space-xxs) var(--fiipdrive-space-sm);
  border: 1px solid var(--fiipdrive-edge-strong);
  border-radius: var(--fiipdrive-r-tag);
  color: var(--fiipdrive-ink);
  font-size: var(--fiipdrive-text-label-size);
  font-weight: var(--fiipdrive-text-label-weight);
  letter-spacing: var(--fiipdrive-text-label-track);
  text-transform: uppercase;
}

.card {
  margin-bottom: var(--fiipdrive-space-xl);
  padding: var(--fiipdrive-space-xxl);
  background: var(--fiipdrive-surface);
  border: 1px solid var(--fiipdrive-edge);
  border-radius: var(--fiipdrive-r-card);
  box-shadow: var(--fiipdrive-shadow-md);
}

.card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--fiipdrive-space-md) var(--fiipdrive-space-xl);
  margin-bottom: var(--fiipdrive-space-lg);
}

.card-head h3 { margin: 0; }

.muted { color: var(--fiipdrive-ink-2); }

.empty p:last-child { margin-bottom: 0; }

.notes {
  margin-bottom: var(--fiipdrive-space-xl);
  color: var(--fiipdrive-ink);
}

.facts {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: var(--fiipdrive-space-md) var(--fiipdrive-space-xl);
  margin: 0 0 var(--fiipdrive-space-xl);
}

.facts dt {
  color: var(--fiipdrive-ink-3);
  font-size: var(--fiipdrive-text-small-size);
  line-height: var(--fiipdrive-text-small-lh);
}

.facts dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}

.fiip-num { font-variant-numeric: tabular-nums; }

.fiip-copyable {
  user-select: all;
  font-variant-numeric: tabular-nums;
  color: var(--fiipdrive-ink-2);
  overflow-wrap: anywhere;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--fiipdrive-space-lg);
}

a {
  color: var(--fiipdrive-ink);
  text-decoration: underline;
  text-decoration-color: var(--fiipdrive-ink-4);
  text-underline-offset: 3px;
  transition: text-decoration-color var(--fiipdrive-micro-duration) var(--fiipdrive-micro-ease);
}

a:hover { text-decoration-color: currentColor; }

:where(a, summary):focus-visible {
  outline: 2px solid var(--fiipdrive-accent);
  outline-offset: 2px;
  border-radius: var(--fiipdrive-r-rule);
}

a.button {
  display: inline-flex;
  align-items: center;
  min-height: var(--fiipdrive-size-md);
  padding: var(--fiipdrive-space-sm) var(--fiipdrive-space-xl);
  background: var(--fiipdrive-accent);
  color: var(--fiipdrive-accent-ink);
  border-radius: var(--fiipdrive-r-button);
  font-weight: var(--fiipdrive-text-label-weight);
  text-decoration: none;
  transition: background var(--fiipdrive-micro-duration) var(--fiipdrive-micro-ease);
}

a.button:hover { background: var(--fiipdrive-accent-hover); }
a.button:active { background: var(--fiipdrive-accent-active); }

details {
  margin-top: var(--fiipdrive-space-lg);
  border-top: 1px solid var(--fiipdrive-edge);
  padding-top: var(--fiipdrive-space-lg);
}

summary {
  cursor: pointer;
  color: var(--fiipdrive-ink-2);
  font-weight: var(--fiipdrive-text-label-weight);
}

summary:hover { color: var(--fiipdrive-ink); }

details[open] summary { margin-bottom: var(--fiipdrive-space-lg); }

pre.fiip-code {
  margin: 0 0 var(--fiipdrive-space-lg);
  padding: var(--fiipdrive-space-lg) var(--fiipdrive-space-xl);
  overflow-x: auto;
  background: var(--fiipdrive-surface-sunken);
  border: 1px solid var(--fiipdrive-edge);
  border-radius: var(--fiipdrive-r-control);
  color: var(--fiipdrive-ink);
  font-family: var(--fiipdrive-font-mono);
  font-size: var(--fiipdrive-text-small-size);
  line-height: var(--fiipdrive-text-small-lh);
  user-select: all;
}

code.fiip-code {
  padding: var(--fiipdrive-space-xxs) var(--fiipdrive-space-xs);
  background: var(--fiipdrive-surface-sunken);
  border: 1px solid var(--fiipdrive-edge);
  border-radius: var(--fiipdrive-r-tag);
  font-family: var(--fiipdrive-font-mono);
  font-size: var(--fiipdrive-text-small-size);
}

pre.fiip-code code { font: inherit; }

.steps {
  margin: 0 0 var(--fiipdrive-space-lg);
  padding-left: var(--fiipdrive-space-xxl);
}

.steps li { margin-bottom: var(--fiipdrive-space-md); }

.chain {
  counter-reset: step;
  list-style: none;
  margin: 0 0 var(--fiipdrive-space-xl);
  padding: 0;
}

.chain li {
  position: relative;
  padding: 0 0 var(--fiipdrive-space-lg) var(--fiipdrive-space-section);
}

.chain li::before {
  counter-increment: step;
  content: counter(step);
  position: absolute;
  left: 0;
  top: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--fiipdrive-size-sm);
  height: var(--fiipdrive-size-sm);
  border: 1px solid var(--fiipdrive-edge-strong);
  border-radius: var(--fiipdrive-capsule);
  color: var(--fiipdrive-ink-2);
  font-size: var(--fiipdrive-text-small-size);
  font-variant-numeric: tabular-nums;
}

footer {
  margin-top: var(--fiipdrive-space-section);
  padding-top: var(--fiipdrive-space-xl);
  border-top: 1px solid var(--fiipdrive-edge);
  color: var(--fiipdrive-ink-3);
  font-size: var(--fiipdrive-text-small-size);
}

@media (max-width: 40rem) {
  .page { padding: var(--fiipdrive-space-xxl) var(--fiipdrive-space-xl); }
  .card { padding: var(--fiipdrive-space-xl); }
  .facts { grid-template-columns: minmax(0, 1fr); gap: var(--fiipdrive-space-xs); }
  .facts dd { margin-bottom: var(--fiipdrive-space-md); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 1ms !important; }
}