:root { color-scheme: light; font-family: system-ui, "Microsoft YaHei", sans-serif; color: #18232d; background: #f3f6f7; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
.page { width: min(100% - 32px, 520px); margin: 32px auto; padding: 24px; background: #fff; border: 1px solid #d9e1e3; border-radius: 6px; }
h1 { margin: 0 0 20px; font-size: 22px; line-height: 1.4; }
#status { min-height: 24px; margin: 0 0 12px; color: #9c2f22; }
form { display: grid; gap: 14px; }
label { display: grid; gap: 6px; color: #34434d; font-size: 14px; }
input, textarea { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid #aab8bd; border-radius: 4px; color: #18232d; background: #fff; font: inherit; }
input:focus, textarea:focus { outline: 2px solid #168477; outline-offset: 1px; border-color: #168477; }
button { min-height: 44px; border: 0; border-radius: 4px; padding: 0 16px; background: #087e72; color: #fff; font: inherit; font-weight: 600; cursor: pointer; }
button:disabled { opacity: .55; cursor: wait; }
.address-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
[hidden] { display: none !important; }
@media (max-width: 480px) { .page { width: 100%; min-height: 100vh; margin: 0; padding: 22px 18px; border: 0; border-radius: 0; } }