:root {
  color-scheme: dark;
  --rp-bg: #070512;
  --rp-panel: #100a28;
  --rp-panel-2: #171039;
  --rp-text: #f1edfb;
  --rp-muted: #c3bad8;
  --rp-dim: #9d93b7;
  --rp-line: rgba(167, 139, 250, 0.28);
  --rp-accent: #ad93ff;
  --rp-cyan: #79e4f1;
  --rp-warn: #ffd27a;
  --rp-ok: #70e6aa;
  --rp-bad: #ff9aa8;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--rp-bg);
  color: var(--rp-text);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: radial-gradient(55rem 28rem at 70% -10%, rgba(112, 82, 230, 0.2), transparent 65%), var(--rp-bg); color: var(--rp-text); }
body, button, input, select, textarea { font: inherit; }
img, svg { max-width: 100%; }
a { color: var(--rp-cyan); text-underline-offset: 0.18em; }
a:hover { color: #c6f8ff; }

.rp-wrap { width: min(74rem, calc(100% - 2rem)); margin-inline: auto; }
.rp-hero { padding: clamp(3rem, 9vw, 7rem) 0 3rem; }
.rp-eyebrow { margin: 0 0 0.85rem; color: var(--rp-cyan); font: 700 0.76rem/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.13em; text-transform: uppercase; }
h1, h2, h3 { margin-top: 0; color: #fff; line-height: 1.12; text-wrap: balance; }
h1 { max-width: 18ch; margin-bottom: 1.25rem; font-size: clamp(2.35rem, 7vw, 5.4rem); letter-spacing: -0.045em; }
h2 { margin-bottom: 1rem; font-size: clamp(1.55rem, 4vw, 2.5rem); letter-spacing: -0.025em; }
h3 { margin-bottom: 0.55rem; font-size: 1.05rem; }
p, li { color: var(--rp-muted); line-height: 1.7; }
.rp-lede { max-width: 67ch; font-size: clamp(1.02rem, 2.2vw, 1.25rem); }
.rp-claim { max-width: 70rem; margin: 1.25rem 0; padding: 1rem 1.1rem; border: 1px solid rgba(255, 210, 122, 0.44); border-left: 4px solid var(--rp-warn); border-radius: 0.6rem; background: rgba(255, 210, 122, 0.07); color: #f6e9ca; }
.rp-actions { display: flex; flex-wrap: wrap; gap: 0.7rem; margin-top: 1.6rem; }
.rp-button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: 0.7rem 1rem; border: 1px solid var(--rp-accent); border-radius: 0.55rem; background: rgba(124, 92, 255, 0.16); color: #fff; font-weight: 750; text-decoration: none; }
.rp-button.primary { border-color: transparent; background: linear-gradient(105deg, #7554e8, #a649d2); }
.rp-button:hover { color: #fff; background-color: rgba(124, 92, 255, 0.3); }

.rp-section { padding: clamp(2.2rem, 6vw, 4.4rem) 0; border-top: 1px solid var(--rp-line); }
.rp-section-head { max-width: 66ch; margin-bottom: 1.5rem; }
.rp-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.rp-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rp-card { min-width: 0; padding: 1.15rem; border: 1px solid var(--rp-line); border-radius: 0.8rem; background: linear-gradient(145deg, rgba(24, 16, 57, 0.94), rgba(12, 8, 31, 0.94)); }
.rp-card p:last-child, .rp-card ul:last-child { margin-bottom: 0; }
.rp-card .rp-id { display: block; margin-bottom: 0.55rem; color: var(--rp-cyan); font: 700 0.7rem/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.1em; text-transform: uppercase; }
.rp-card .rp-state { display: inline-block; margin: 0.25rem 0 0.65rem; padding: 0.25rem 0.55rem; border: 1px solid rgba(255, 210, 122, 0.45); border-radius: 999px; color: var(--rp-warn); font: 700 0.7rem/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; }
.rp-meta { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 1rem 0; padding: 0; list-style: none; }
.rp-meta li { padding: 0.28rem 0.55rem; border: 1px solid var(--rp-line); border-radius: 999px; color: var(--rp-dim); font: 0.73rem/1.35 ui-monospace, SFMono-Regular, Menlo, monospace; }

.rp-table-wrap { overflow-x: auto; border: 1px solid var(--rp-line); border-radius: 0.75rem; }
.rp-table { width: 100%; min-width: 42rem; border-collapse: collapse; background: rgba(9, 6, 25, 0.7); }
.rp-table th, .rp-table td { padding: 0.8rem; border-bottom: 1px solid var(--rp-line); text-align: left; vertical-align: top; }
.rp-table th { color: #fff; background: rgba(124, 92, 255, 0.12); font-size: 0.82rem; }
.rp-table td { color: var(--rp-muted); font-size: 0.88rem; line-height: 1.55; }
.rp-table tr:last-child td { border-bottom: 0; }

.rp-kicker { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 1rem; align-items: start; }
.rp-list-clean { margin: 0; padding-left: 1.2rem; }
.rp-list-clean li + li { margin-top: 0.55rem; }
.rp-code { padding: 0.12rem 0.35rem; border: 1px solid var(--rp-line); border-radius: 0.3rem; background: #05030e; color: #e7defe; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.88em; overflow-wrap: anywhere; }
.rp-footnotes { font-size: 0.86rem; }
.rp-footer { padding: 2rem 0 3rem; border-top: 1px solid var(--rp-line); color: var(--rp-dim); }
.rp-footer p { color: var(--rp-dim); font-size: 0.85rem; }

details.rp-card > summary { min-height: 44px; cursor: pointer; color: #fff; font-weight: 750; }
details.rp-card[open] > summary { margin-bottom: 0.8rem; }

@media (max-width: 850px) {
  .rp-grid, .rp-grid.two, .rp-kicker { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
  .rp-wrap { width: min(100% - 1rem, 74rem); }
  .rp-card { padding: 0.9rem; }
  h1 { font-size: 2.15rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

@media print {
  :root { color-scheme: light; }
  body { background: #fff; color: #111; }
  p, li, .rp-table td { color: #222; }
  h1, h2, h3, .rp-table th { color: #000; }
  .rp-card, .rp-table { background: #fff; border-color: #888; }
  .rp-actions { display: none; }
}
