:root { font-family: system-ui, sans-serif; color: #1c2926; background: #f3f5f5; }
* { box-sizing: border-box; }
body { margin: 0; }
header { padding: 20px max(24px, calc((100% - 880px)/2)); background: #fff; border-bottom: 1px solid #d5dede; font-weight: 700; font-size: 24px; }
main { max-width: 880px; margin: 32px auto; padding: 0 24px 48px; }
h1 { font-size: 28px; } h2, legend { font-size: 20px; font-weight: 650; }
fieldset { border: 0; border-top: 1px solid #cbd5d3; padding: 24px 0; margin: 24px 0; }
.fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
label { display: grid; gap: 8px; font-size: 14px; font-weight: 600; }
input { width: 100%; min-height: 44px; border: 1px solid #a5b6b2; border-radius: 4px; padding: 10px; font: inherit; background: #fff; }
input:focus { outline: 2px solid #087f68; outline-offset: 2px; }
.checks { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 20px; font-size: 14px; }
.ok { color: #076d52; } .fail { color: #a42828; }
.notice { border-left: 4px solid #b33030; background: #fff; padding: 16px; overflow-wrap: anywhere; }
button, .action { display: inline-block; border: 0; background: #087f68; color: #fff; border-radius: 4px; padding: 12px 22px; font: inherit; font-weight: 600; text-decoration: none; cursor: pointer; }
button:disabled { background: #6a7472; cursor: not-allowed; }
@media (max-width: 580px) { .fields, .checks { grid-template-columns: minmax(0, 1fr); } main { margin-top: 24px; } }
