:root {
  color-scheme: light dark;
  font-family: ui-sans-serif, system-ui, sans-serif;
  background: Canvas;
  color: CanvasText;
}

body { margin: 0; }
.shell { display: grid; min-height: 100vh; place-items: center; padding: 24px; }
.card { width: min(100%, 560px); box-sizing: border-box; padding: 32px; border: 1px solid GrayText; border-radius: 18px; background: Canvas; box-shadow: 0 18px 60px color-mix(in srgb, CanvasText 10%, transparent); }
.eyebrow, dt { color: GrayText; font-size: 0.82rem; font-weight: 650; }
h1 { margin: 8px 0 16px; }
dl { display: grid; gap: 14px; margin: 24px 0; }
dl div { display: grid; grid-template-columns: 120px 1fr; gap: 12px; }
dd { margin: 0; overflow-wrap: anywhere; }
aside { padding: 14px 16px; border-radius: 10px; background: color-mix(in srgb, AccentColor 12%, Canvas); color: CanvasText; }
.actions { display: flex; justify-content: flex-end; margin-top: 24px; }
button { min-height: 42px; padding: 0 18px; border: 0; border-radius: 9px; background: AccentColor; color: AccentColorText; cursor: pointer; font: inherit; font-weight: 650; }
button:disabled { cursor: wait; opacity: 0.6; }