:root { color-scheme: light; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; color: #172033; background: #f7f8fb; }
* { box-sizing: border-box; } body { margin: 0; line-height: 1.65; } header { display: flex; gap: 2rem; align-items: center; padding: 1rem max(1.25rem, calc((100% - 68rem) / 2)); background: #fff; border-bottom: 1px solid #e5e7eb; } .brand { color: #5038c9; font-size: 1.3rem; font-weight: 800; text-decoration: none; } nav { display: flex; flex-wrap: wrap; gap: .75rem 1rem; } nav a { color: #34405b; font-size: .92rem; text-decoration: none; } main { max-width: 58rem; margin: 2.5rem auto; padding: 0 1.25rem 3rem; } h1 { font-size: clamp(1.8rem, 5vw, 2.5rem); line-height: 1.25; } h2 { margin-top: 2.4rem; line-height: 1.3; } h3 { margin-top: 1.8rem; } a { color: #3f2cb6; } .legal-notice { margin: 1rem 0 1.5rem; padding: .8rem 1rem; border-left: 4px solid #f0a500; border-radius: .25rem; background: #fff6dd; font-weight: 700; } blockquote { margin: 1rem 0; padding: .25rem 1rem; border-left: 3px solid #9ca3af; color: #4b5563; } .table-wrap { overflow-x: auto; } table { width: 100%; border-collapse: collapse; font-size: .92rem; } th, td { border: 1px solid #d8dce6; padding: .65rem; text-align: left; vertical-align: top; } th { background: #eef0f7; } code { padding: .1rem .3rem; border-radius: .25rem; background: #eceef4; } .flow-card { max-width: 38rem; padding: 1.5rem; background: #fff; border: 1px solid #e2e5ed; border-radius: .75rem; box-shadow: 0 2px 10px #1720330d; } label { display: block; margin-top: 1rem; font-weight: 650; } input { width: 100%; margin-top: .35rem; padding: .7rem; border: 1px solid #aeb5c5; border-radius: .4rem; font: inherit; } button { margin-top: 1rem; padding: .7rem 1rem; border: 0; border-radius: .4rem; color: #fff; background: #5038c9; font: inherit; font-weight: 700; cursor: pointer; } button.secondary { margin-left: .5rem; color: #35258f; background: #ede9fe; } button:disabled { cursor: default; opacity: .65; } .status { min-height: 1.5rem; margin-top: 1rem; color: #364152; } .warning { padding: 1rem; border-radius: .4rem; background: #fff6dd; } [hidden] { display: none !important; } @media (max-width: 44rem) { header { align-items: flex-start; flex-direction: column; gap: .65rem; } main { margin-top: 1.5rem; } }
