:root { color-scheme: light; font-family: Inter, system-ui, sans-serif; background: #eef3f5; color: #17333e; }
body { margin: 0; }
main { width: min(960px, calc(100% - 2rem)); margin: 2rem auto; }
header, section, footer { background: white; border: 1px solid #d5e0e4; border-radius: 12px; padding: 1.4rem; margin-bottom: 1rem; box-shadow: 0 4px 18px #17333e10; }
h1, h2 { margin-top: 0; }
h1 { font-size: clamp(1.7rem, 4vw, 2.5rem); }
.eyebrow { color: #56747f; font-size: .85rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.status { display: inline-block; border-radius: 999px; padding: .35rem .7rem; font-weight: 700; }
.ok { background: #dcfce7; color: #166534; }
.pending { background: #fef3c7; color: #92400e; }
.warning { background: #fff7ed; border-left: 4px solid #ea580c; color: #9a3412; padding: .8rem 1rem; }
.actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1rem; }
a.button, button { appearance: none; border: 0; border-radius: 8px; background: #175d72; color: white; cursor: pointer; display: inline-block; font: inherit; font-weight: 700; padding: .75rem 1rem; text-decoration: none; }
a.secondary, button.secondary { background: #e5eef1; color: #17333e; }
dl { display: grid; grid-template-columns: minmax(9rem, 14rem) 1fr; gap: .55rem 1rem; }
dt { font-weight: 700; }
dd { margin: 0; overflow-wrap: anywhere; }
pre { background: #102a34; color: #eef9fc; border-radius: 8px; overflow: auto; padding: 1rem; white-space: pre-wrap; word-break: break-word; }
code { overflow-wrap: anywhere; }
footer { color: #56747f; font-size: .85rem; text-align: center; }
@media (max-width: 620px) { dl { grid-template-columns: 1fr; } dd { margin-bottom: .4rem; } }