* { box-sizing: border-box; }
html { min-height: 100%; background: #bedfdf; }
body {
    min-height: 100vh;
    margin: 0;
    padding: 32px 20px;
    display: flex;
    background: #bedfdf;
    font-family: Arial, Helvetica, sans-serif;
}
.error_shell {
    width: 100%;
    min-width: 0;
    max-width: 820px;
    margin: auto;
    padding: 20px 16px;
    border: 1px solid #abd1d1;
    border-top: 6px solid #fcb813;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 12px 36px rgba(35, 55, 55, .10);
}
.error_brand {
    display: block;
    width: fit-content;
    max-width: 100%;
    margin: 0 auto 16px;
}
.error_brand img { display: block; width: 220px; max-width: 100%; height: auto; }
.error_recovery_actions { width: 100%; max-width: 900px; margin: 18px auto 0; padding: 0 18px; }
.error_shell--compact { max-width: 625px; }
.error_shell--compact .error_container { font-size: 20px; line-height: 1.5; }
.error_home_button,
.error_home_button:visited {
    display: inline-block;
    min-width: 174px;
    padding: 13px 20px;
    border: 1px solid #231f20;
    background: #231f20;
    color: #ffffff;
    font-family: "nevis-bold", Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
}
.error_home_button:hover,
.error_home_button:focus { background: #000000; color: #ffffff; text-decoration: none; }
.error_shell .error_container { width: 100% !important; max-width: 900px; margin: 10px auto; padding: 0 10px; }
.error_shell .error_notice { border-top-color: #9bd5d2; padding: 16px; }
.error_shell .error_header { gap: 18px; margin-bottom: 20px; }
.error_shell .error_icon { flex-basis: 72px; width: 72px; height: 72px; }
.error_shell .error_icon i { font-size: 36px; }
.error_shell .error_container h1 { font-size: 36px; }
.error_shell .error_title_message { font-size: 28px; }
.error_shell .error_reason_box { margin: 20px 0; padding: 18px; }
.error_shell .error_header,
.error_shell .error_actions,
.error_shell .error_reasons li { min-width: 0; }
.error_shell .error_container h1,
.error_shell .error_reason_text,
.error_shell .error_support_text { min-width: 0; overflow-wrap: anywhere; }
.error_unexpected_card { padding: 28px; }
.error_unexpected_card .error_brand { margin-bottom: 24px; }
.error_unexpected_heading { text-align: center; }
.error_unexpected_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
    border-radius: 50%;
    background: #fff3cd;
    color: #946300;
    font-size: 30px;
    font-weight: bold;
}
.error_unexpected_heading h1 { margin: 0; color: #231f20; font-size: 25px; line-height: 1.3; }
.error_unexpected_details {
    margin-top: 22px;
    padding: 18px 20px;
    border: 1px solid #d8eeee;
    border-left: 3px solid #9bd5d2;
    border-radius: 8px;
    background: #f7fbfb;
    color: #4b5563;
    font-size: 16px;
    line-height: 1.6;
    overflow-wrap: anywhere;
}
.error_unexpected_details p { margin: 0; }
.error_unexpected_details p + p { margin-top: 12px; }
.error_unexpected_details a { color: #285e62; font-weight: bold; text-decoration: underline; }
.error_unexpected_card .error_recovery_actions { margin-top: 24px; padding: 0; text-align: center; }
.error_unexpected_card a:focus-visible { outline: 3px solid #fcb813; outline-offset: 4px; }
@media (max-width: 767px) {
    body { padding: 20px 12px; }
    .error_shell { padding: 18px 0 12px; border-radius: 12px; }
    .error_brand { margin-bottom: 12px; }
    .error_brand img { width: 200px; }
    .error_shell .error_container { margin: 10px auto; }
    .error_shell .error_notice { padding: 18px 12px; }
    .error_shell .error_header { flex-direction: column; }
    .error_shell .error_container h1 { text-align: center; }
    .error_shell .error_title_message { font-size: 28px; }
    .error_shell .error_reason_box { padding: 16px 12px; }
    .error_shell .error_home_button { min-width: 0; width: 100%; }
    .error_unexpected_card { padding: 24px 20px; }
    .error_unexpected_card .error_brand { margin-bottom: 20px; }
    .error_unexpected_heading h1 { font-size: 23px; }
    .error_unexpected_details { padding: 16px; }
}