.error-page-shell {
    --error-ink: #102a43;
    --error-muted: #627d98;
    --error-border: #e1eaf1;
    --error-canvas: #edf4f8;
    --error-teal: #0e7490;
    --error-teal-deep: #0b5870;
    --error-warning: #b97918;
    --error-danger: #b45353;
    min-height: 100vh;
    margin: 0;
    padding: 2.6rem 1.25rem;
    color: var(--error-ink);
    background:
        radial-gradient(circle at 14% 12%, rgba(14,116,144,.13), transparent 27%),
        radial-gradient(circle at 87% 86%, rgba(16,42,67,.1), transparent 31%),
        var(--error-canvas);
}
.error-page-shell .particles { opacity: .18; }
.error-page-shell .particle { background: var(--error-teal) !important; }
.error-page-shell .error-container { max-width: 600px; padding: 0; }
.error-page-shell .error-card {
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.85);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 20px 48px rgba(16,42,67,.13), 0 2px 0 rgba(255,255,255,.7) inset;
    animation: none;
}
.error-page-shell .error-card:hover { transform: none; }
.error-page-shell .error-card::before { display: none; }
.error-page-shell .error-header {
    position: relative;
    overflow: hidden;
    padding: 1.65rem 2rem 1.45rem;
    text-align: left;
    background: linear-gradient(132deg, #102a43 0%, #0e7490 100%);
}
.error-page-shell .error-header::before { content: ''; position: absolute; right: -3rem; bottom: -5.2rem; width: 220px; height: 220px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; opacity: 1; transform: none; }
.error-page-shell .error-header::after { content: ''; position: absolute; right: 2.2rem; bottom: 1.5rem; width: 88px; height: 88px; border: 1px solid rgba(255,255,255,.11); border-radius: 50%; }
.error-page-shell .error-logo { position: relative; z-index: 1; width: 52px; height: 52px; margin: 0 0 .95rem; border: 1px solid rgba(255,255,255,.28); border-radius: 13px; background: rgba(255,255,255,.12); box-shadow: 0 8px 18px rgba(0,0,0,.12); }
.error-page-shell .error-logo:hover { transform: none; background: rgba(255,255,255,.15); }
.error-page-shell .error-logo i { font-size: 1.75rem; }
.error-page-shell .error-eyebrow { position: relative; z-index: 1; margin: 0 0 .35rem; color: rgba(255,255,255,.7); font-size: .59rem; font-weight: 750; letter-spacing: .15em; text-transform: uppercase; }
.error-page-shell .error-header h3 { position: relative; z-index: 1; max-width: 360px; margin: 0; color: #fff; font-size: 1.28rem; font-weight: 780; letter-spacing: -.035em; line-height: 1.2; }
.error-page-shell .error-header .subtitle { position: relative; z-index: 1; margin-top: .4rem; color: rgba(255,255,255,.9); font-size: .75rem; font-weight: 600; }
.error-page-shell .user-greeting { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: .3rem; margin-top: .7rem; padding: .32rem .55rem; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; color: rgba(255,255,255,.82); background: rgba(255,255,255,.1); font-size: .59rem; font-weight: 650; }
.error-page-shell .hospital-info { position: relative; z-index: 1; max-width: 430px; margin-top: .55rem; color: rgba(255,255,255,.66); font-size: .59rem; line-height: 1.4; }
.error-page-shell .error-body { padding: 1.7rem 2rem 1.65rem; text-align: center; }
.error-page-shell .error-type-badge { display: inline-flex; align-items: center; gap: .32rem; margin-bottom: .9rem; padding: .35rem .62rem; border: 1px solid var(--error-border); border-radius: 999px; color: var(--error-muted); background: #f7fafc; font-size: .58rem; font-weight: 780; letter-spacing: .07em; text-transform: uppercase; }
.error-page-shell .error-type-badge.server { color: var(--error-danger); border-color: #f0d2d2; background: #fff6f6; }
.error-page-shell .error-type-badge.client { color: var(--error-warning); border-color: #f1dfba; background: #fffaf0; }
.error-page-shell .error-type-badge.auth { color: var(--error-teal-deep); border-color: #cfe8ed; background: #eff9fa; }
.error-page-shell .error-icon-container { margin: 0 0 .85rem; }
.error-page-shell .error-icon-wrapper { position: relative; width: 86px; height: 86px; margin: 0 auto; }
.error-page-shell .error-icon-ring { display: none; }
.error-page-shell .error-icon-circle { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; border: 1px solid #cfe8ed; border-radius: 50%; color: var(--error-teal); background: #eff9fa; box-shadow: 0 8px 20px rgba(14,116,144,.1); animation: none !important; }
.error-page-shell .error-icon-circle i { font-size: 2.05rem; }
.error-page-shell .error-icon-circle:hover i { transform: none; }
.error-page-shell .error-code { margin: 0; color: var(--error-ink); font-size: 2.6rem; font-weight: 800; letter-spacing: -.06em; line-height: 1; }
.error-page-shell .error-title { margin-top: .55rem; color: var(--error-ink); font-size: .88rem; font-weight: 780; letter-spacing: .035em; text-transform: uppercase; }
.error-page-shell .error-message { margin-top: .5rem; color: var(--error-ink); font-size: 1rem; font-weight: 650; line-height: 1.35; }
.error-page-shell .error-description { max-width: 480px; margin: .5rem auto 0; color: var(--error-muted); font-size: .69rem; line-height: 1.55; }
.error-page-shell .suggestions { margin: 1.15rem 0 0; padding: .8rem .95rem; border: 1px solid #dcecf3; border-left: 3px solid var(--error-teal); border-radius: 10px; color: var(--error-muted); background: #f5fbfc; text-align: left; }
.error-page-shell .suggestions:hover { transform: none; background: #f5fbfc; }
.error-page-shell .suggestions h6 { margin: 0 0 .45rem; color: var(--error-teal-deep); font-size: .64rem; font-weight: 780; letter-spacing: .08em; text-transform: uppercase; }
.error-page-shell .suggestions h6 i { color: var(--error-warning); }
.error-page-shell .suggestions ul { margin: 0; padding-left: 1rem; font-size: .64rem; line-height: 1.55; }
.error-page-shell .suggestions ul li { padding-left: .1rem; }
.error-page-shell .suggestions ul li::marker { color: var(--error-teal); }
.error-page-shell .error-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; margin-top: 1.25rem; }
.error-page-shell .btn-error-primary, .error-page-shell .btn-error-secondary { min-height: 40px; padding: .62rem .8rem; border-radius: 8px; font-size: .63rem; font-weight: 780; letter-spacing: .05em; line-height: 1; text-transform: uppercase; }
.error-page-shell .btn-error-primary { color: #fff; background: var(--error-teal); box-shadow: 0 7px 14px rgba(14,116,144,.16); }
.error-page-shell .btn-error-primary::before { display: none; }
.error-page-shell .btn-error-primary:hover { color: #fff; background: var(--error-teal-deep); transform: translateY(-1px); box-shadow: 0 9px 18px rgba(14,116,144,.21); }
.error-page-shell .btn-error-secondary { color: var(--error-teal); border: 1px solid #b9dfe5; background: #fff; }
.error-page-shell .btn-error-secondary:hover { color: #fff; border-color: var(--error-teal); background: var(--error-teal); transform: translateY(-1px); box-shadow: 0 8px 16px rgba(14,116,144,.12); }
.error-page-shell .error-footer { padding: 1rem 1.35rem .9rem; border-top: 1px solid var(--error-border); background: #f7fafc; text-align: center; }
.error-page-shell .error-footer small { color: var(--error-muted); font-size: .52rem; }
.error-page-shell .footer-attribution { display: flex; align-items: center; justify-content: center; gap: .55rem; flex-wrap: wrap; margin-top: .55rem; color: var(--error-muted); font-size: .53rem; }
.error-page-shell .footer-attribution-item { display: inline-flex; align-items: center; gap: .28rem; }
.error-page-shell .footer-attribution-item i { color: var(--error-teal); font-size: .6rem; }
.error-page-shell .footer-attribution-item strong { color: var(--error-ink); font-weight: 750; }
.error-page-shell .footer-attribution-separator { color: #a8bac8; }
.error-page-shell .error-footer .footer-links { margin-top: .6rem; }
.error-page-shell .error-footer .footer-links a { color: var(--error-muted); font-size: .52rem; font-weight: 650; }
.error-page-shell .error-footer .footer-links a:hover { color: var(--error-teal); text-decoration: none; }
.error-page-shell .footer-divider { color: #a8bac8; font-size: .52rem; }
.error-page-shell .home-link, .error-page-shell .version-badge { position: fixed; bottom: 1rem; z-index: 100; display: inline-flex; align-items: center; gap: .32rem; padding: .4rem .62rem; border: 1px solid rgba(255,255,255,.75); border-radius: 999px; color: var(--error-muted); background: rgba(255,255,255,.72); box-shadow: 0 6px 18px rgba(16,42,67,.08); backdrop-filter: blur(8px); font-size: .55rem; font-weight: 750; letter-spacing: .04em; }
.error-page-shell .home-link { left: 1rem; }
.error-page-shell .version-badge { right: 1rem; }
.error-page-shell .home-link:hover, .error-page-shell .version-badge:hover { color: var(--error-teal-deep); background: #fff; transform: translateY(-1px); }
.error-page-shell .loading-overlay { background: rgba(237,244,248,.98) !important; }
.error-page-shell .loading-container { color: var(--error-ink) !important; }
@media (max-width: 600px) {
    .error-page-shell { padding: 1rem .7rem 4rem; }
    .error-page-shell .error-header { padding: 1.35rem 1.25rem 1.2rem; }
    .error-page-shell .error-body { padding: 1.35rem 1.25rem 1.25rem; }
    .error-page-shell .error-header h3 { font-size: 1.1rem; }
    .error-page-shell .error-icon-wrapper { width: 74px; height: 74px; }
    .error-page-shell .error-icon-circle i { font-size: 1.75rem; }
    .error-page-shell .error-code { font-size: 2.25rem; }
    .error-page-shell .error-message { font-size: .9rem; }
    .error-page-shell .error-actions { grid-template-columns: 1fr; }
    .error-page-shell .error-footer { padding: .85rem 1rem .8rem; }
    .error-page-shell .home-link, .error-page-shell .version-badge { bottom: .65rem; font-size: .5rem; }
    .error-page-shell .home-link { left: .65rem; }
    .error-page-shell .version-badge { right: .65rem; }
}
@media (max-width: 400px) {
    .error-page-shell .error-header { padding: 1.15rem 1rem 1rem; }
    .error-page-shell .error-body { padding: 1.15rem 1rem 1rem; }
    .error-page-shell .error-footer { padding-inline: .8rem; }
    .error-page-shell .footer-attribution { flex-direction: column; gap: .25rem; }
    .error-page-shell .footer-attribution-separator { display: none; }
}