.registration-details { border: 1px solid #d5dce5; border-radius: 8px; padding: 20px; }
.registration-details > summary { cursor: pointer; font-size: 1.25rem; font-weight: 600; color: #124c79; }
.registration-form fieldset { border: 0; border-top: 1px solid #d5dce5; padding: 20px 0; margin: 24px 0 0; min-width: 0; }
.registration-form legend { font-size: 1.1rem; font-weight: 600; padding-right: 10px; }
.registration-field { display: block; margin-bottom: 16px; }
.registration-field > span { display: block; margin-bottom: 6px; }
.registration-field input, .registration-field select { width: 100%; box-sizing: border-box; padding: 12px; border: 1px solid #9ba8b7; border-radius: 4px; background: #fff; color: #172b40; font: inherit; }
.registration-field input:focus, .registration-field select:focus { outline: 2px solid #176aa4; outline-offset: 2px; }
.registration-form button { background: #124c79; color: #fff; border: 0; border-radius: 4px; padding: 14px 20px; cursor: pointer; font: inherit; }
.registration-form [hidden] { display: none !important; }
#login_page { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 40px; align-items: start; }
#login_page .login-left, #login_page .login-right { float: none; width: auto; display: block; min-width: 0; }
#login_page .login-left > div { width: 100%; max-width: 400px; }
#reg_form input, #reg_form select { height: auto; min-height: 44px; padding: 10px 12px; line-height: 1.4; }
.registration-form fieldset, .registration-form fieldset > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.registration-form fieldset > div, .registration-form fieldset > p { grid-column: 1 / -1; }
@media (max-width: 800px) {
    #login_page { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .registration-form fieldset, .registration-form fieldset > div { grid-template-columns: minmax(0, 1fr); }
}