:root {
  color-scheme: light;
  --ink: #19211c;
  --muted: #69736c;
  --line: #dce2dd;
  --paper: #f6f5ef;
  --card: #fffefa;
  --accent: #d9472b;
  --accent-soft: #fff0e9;
  --warn: #8b5d12;
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.65 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
main { width: min(760px, calc(100% - 32px)); margin: 0 auto; padding: 48px 0 72px; }
h1, h2 { line-height: 1.2; letter-spacing: -.02em; }
h1 { margin: 0 0 8px; font-size: clamp(30px, 7vw, 46px); }
h2 { margin-top: 36px; font-size: 22px; }
p, li { color: var(--muted); }
a { color: var(--accent); }
.eyebrow { margin: 0 0 6px; color: var(--accent); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.lede { max-width: 62ch; font-size: 18px; }
.card { margin-top: 20px; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--card); }
.card h2 { margin-top: 0; }
.warning { border-color: #e5bd79; background: #fff9e8; }
.warning strong { color: var(--warn); }
.field { display: grid; gap: 5px; margin: 14px 0; }
.field span { font-size: 13px; font-weight: 750; }
textarea, input { width: 100%; border: 1px solid var(--line); border-radius: 9px; padding: 10px; background: white; color: var(--ink); font: inherit; }
textarea { min-height: 82px; resize: vertical; }
.actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 14px; }
button, .button { display: inline-block; border: 1px solid var(--accent); border-radius: 9px; padding: 9px 12px; background: var(--accent); color: white; font: inherit; font-weight: 750; text-decoration: none; cursor: pointer; }
button.secondary, .button.secondary { border-color: var(--line); background: var(--card); color: var(--ink); }
button:disabled, .button[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }
.status { margin: 10px 0 0; font-size: 14px; }
.identifier { overflow-wrap: anywhere; padding: 9px; border-radius: 8px; background: #eef1ed; color: var(--ink); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
footer { margin-top: 48px; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }
