:root{--olecio-orange: #FF6B35;--olecio-orange-light: #FF8A5B;--olecio-orange-dark: #E55A2B;--white: #FFFFFF;--gray-50: #F9FAFB;--gray-100: #F3F4F6;--gray-200: #E5E7EB;--gray-300: #D1D5DB;--gray-400: #9CA3AF;--gray-500: #6B7280;--gray-600: #4B5563;--gray-700: #374151;--gray-800: #1F2937;--gray-900: #111827;--high-contrast-bg: #000000;--high-contrast-text: #FFFFFF;--high-contrast-primary: #FFD700;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--border-radius-sm: .375rem;--border-radius-md: .5rem;--border-radius-lg: .75rem;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--transition-fast: .15s ease;--transition-normal: .3s ease;--transition-slow: .5s ease}*{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;line-height:1.5}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--gray-50);color:var(--gray-900);transition:all var(--transition-normal)}.dyslexic-font{font-family:Open Dyslexic,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif!important}.high-contrast{background-color:var(--high-contrast-bg)!important;color:var(--high-contrast-text)!important}.high-contrast .card{background-color:var(--gray-800)!important;border:2px solid var(--high-contrast-primary)!important}.high-contrast .btn-primary{background-color:var(--high-contrast-primary)!important;color:var(--high-contrast-bg)!important;border-color:var(--high-contrast-primary)!important}.high-contrast .form-input{background-color:var(--gray-800)!important;color:var(--high-contrast-text)!important;border-color:var(--high-contrast-primary)!important}.high-contrast .form-input::placeholder{color:var(--gray-400)!important;opacity:1}.high-contrast .form-input:focus{outline:2px solid var(--high-contrast-primary)!important;box-shadow:none!important;border-color:var(--high-contrast-primary)!important}.high-contrast .card-title,.high-contrast .card-subtitle,.high-contrast .card-loading-text,.high-contrast .card-footer-text,.high-contrast .form-label{color:var(--high-contrast-text)!important}.high-contrast .form-error{color:#ff8a8a!important;font-size:.875rem;font-weight:500}.high-contrast .link{color:var(--high-contrast-primary)!important}.high-contrast .link:hover,.high-contrast .link:focus{color:var(--high-contrast-text)!important;text-decoration:underline}.high-contrast .card .spinner{color:var(--high-contrast-primary)}.high-contrast .login-error-banner{background-color:var(--gray-800)!important;border:2px solid var(--high-contrast-primary)!important;color:var(--high-contrast-text)!important}.high-contrast .login-error-banner--invalid_credentials{border-color:#ff8a8a!important}.high-contrast .login-error-banner strong{color:var(--high-contrast-primary)}.high-contrast .form-label-required{color:#ff8a8a!important}.high-contrast .form-label-optional{color:var(--gray-400)!important}.high-contrast .password-criteria{background-color:var(--gray-800)!important;border-color:var(--high-contrast-primary)!important}.high-contrast .password-criterion--valid,.high-contrast .password-criterion--valid .password-criterion-icon{color:#86efac!important}.high-contrast .password-criterion--invalid{color:var(--gray-400)!important}.high-contrast .password-criterion--invalid .password-criterion-icon{color:#ff8a8a!important}.app{min-height:100vh;display:flex;flex-direction:column}.main-content{flex:1;display:flex;align-items:center;justify-content:center;padding:var(--spacing-lg)}.card{background:var(--white);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-lg);padding:var(--spacing-2xl);width:100%;max-width:400px;transition:all var(--transition-normal)}.card:hover{box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.card-header{text-align:center;margin-bottom:var(--spacing-xl)}.card-title{font-size:1.875rem;font-weight:700;color:var(--gray-900);margin-bottom:var(--spacing-sm)}.card-subtitle{color:var(--gray-600);font-size:.875rem}.card-loading-text{color:var(--gray-600);font-size:1rem;margin-top:var(--spacing-sm)}.card-footer{text-align:center;margin-top:var(--spacing-lg)}.card-footer-text{color:var(--gray-600);font-size:.875rem}.login-error-banner{padding:var(--spacing-md);margin-bottom:var(--spacing-lg);border-radius:var(--border-radius-md);font-size:.9375rem;line-height:1.5;text-align:center}.login-error-banner p{margin:0}.login-error-banner--account_not_found{background-color:#eff6ff;border:1px solid #BFDBFE;color:#1e40af}.login-error-banner--invalid_credentials{background-color:#fef2f2;border:1px solid #FECACA;color:#991b1b}.login-error-banner--server_error{background-color:#fffbeb;border:1px solid #FDE68A;color:#92400e}.otp-inputs{display:flex;gap:.5rem;justify-content:center;margin-bottom:var(--spacing-md)}.otp-input{width:3rem;height:3rem;text-align:center;font-size:1.25rem;font-weight:700}.form-group{margin-bottom:var(--spacing-lg)}.form-label{display:block;font-weight:500;color:var(--gray-700);margin-bottom:var(--spacing-sm);font-size:.875rem}.form-label-required{color:#dc2626;margin-left:.125rem}.form-label-optional{font-weight:400;color:var(--gray-500);font-size:.8125rem}.form-input{width:100%;padding:var(--spacing-md);border:1px solid var(--gray-300);border-radius:var(--border-radius-md);font-size:1rem;transition:all var(--transition-fast);background-color:var(--white)}.form-input:focus{outline:none;border-color:var(--olecio-orange);box-shadow:0 0 0 3px #ff6b351a}.form-input:invalid{border-color:#ef4444}.form-error{color:#ef4444;font-size:.75rem;margin-top:var(--spacing-xs)}.password-criteria{list-style:none;margin:var(--spacing-sm) 0 0;padding:var(--spacing-sm) var(--spacing-md);background-color:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--border-radius-md)}.password-criterion{display:flex;align-items:center;gap:var(--spacing-sm);font-size:.8125rem;line-height:1.5;padding:.125rem 0}.password-criterion-icon{display:flex;flex-shrink:0;width:1rem;height:1rem}.password-criterion--valid{color:#15803d}.password-criterion--valid .password-criterion-icon{color:#16a34a}.password-criterion--invalid{color:var(--gray-500)}.password-criterion--invalid .password-criterion-icon{color:#dc2626}.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--border-radius-md);font-weight:500;font-size:1rem;text-decoration:none;border:none;cursor:pointer;transition:all var(--transition-fast);min-height:44px}.btn-primary{background-color:var(--olecio-orange);color:var(--white)}.btn-primary:hover{background-color:var(--olecio-orange-dark);transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-secondary{background-color:transparent;color:var(--olecio-orange);border:1px solid var(--olecio-orange)}.btn-secondary:hover{background-color:var(--olecio-orange);color:var(--white)}.btn-full{width:100%}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.link{color:var(--olecio-orange);text-decoration:none;font-weight:500;transition:color var(--transition-fast)}.link:hover{color:var(--olecio-orange-dark);text-decoration:underline}.navbar{background-color:var(--white);border-bottom:1px solid var(--gray-200);padding:var(--spacing-md) var(--spacing-lg);display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow-sm)}.navbar-logo{height:40px;width:auto}.navbar-actions{display:flex;align-items:center;gap:var(--spacing-md)}.accessibility-menu{position:relative}.accessibility-toggle{background:none;border:none;color:var(--gray-600);font-size:1.25rem;cursor:pointer;padding:var(--spacing-sm);border-radius:var(--border-radius-sm);transition:all var(--transition-fast)}.accessibility-toggle:hover{background-color:var(--gray-100);color:var(--olecio-orange)}.accessibility-dropdown{position:absolute;top:100%;right:0;background:var(--white);border:1px solid var(--gray-200);border-radius:var(--border-radius-md);box-shadow:var(--shadow-lg);padding:var(--spacing-md);min-width:200px;z-index:1000}.accessibility-option{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-sm) 0;border-bottom:1px solid var(--gray-100)}.accessibility-option:last-child{border-bottom:none}.accessibility-label{font-size:.875rem;color:var(--gray-700)}.accessibility-switch{position:relative;width:44px;height:24px;background-color:var(--gray-300);border-radius:12px;cursor:pointer;transition:background-color var(--transition-fast)}.accessibility-switch.active{background-color:var(--olecio-orange)}.accessibility-switch:after{content:"";position:absolute;top:0;left:0;width:20px;height:20px;background-color:var(--white);border-radius:50%;transition:transform var(--transition-fast)}.accessibility-switch.active:after{transform:translate(20px)}@media (max-width: 640px){.main-content{padding:var(--spacing-md)}.card{padding:var(--spacing-xl)}.card-title{font-size:1.5rem}.navbar{padding:var(--spacing-sm) var(--spacing-md)}.navbar-logo{height:32px}}@media (max-width: 480px){.card{padding:var(--spacing-lg)}.btn{padding:var(--spacing-sm) var(--spacing-md);font-size:.875rem}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .5s ease-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.shake{animation:shake .5s ease-in-out}.loading{opacity:.6;pointer-events:none}.spinner{display:inline-block;width:20px;height:20px;border:2px solid transparent;border-top:2px solid currentColor;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.client-error-card{text-align:center;max-width:440px}.client-error-icon-wrapper{display:flex;align-items:center;justify-content:center;width:4.5rem;height:4.5rem;margin:0 auto var(--spacing-lg);border-radius:50%;background-color:#fef2f2;color:#b91c1c}.client-error-icon{width:2.25rem;height:2.25rem}.client-error-title{font-size:1.5rem;font-weight:700;color:var(--gray-900);margin-bottom:var(--spacing-md);line-height:1.3}.client-error-description{font-size:1rem;color:var(--gray-700);line-height:1.6;margin-bottom:var(--spacing-md)}.client-error-detail{display:flex;flex-direction:column;gap:var(--spacing-xs);padding:var(--spacing-md);margin-bottom:var(--spacing-md);background-color:var(--gray-100);border-radius:var(--border-radius-md);border:1px solid var(--gray-200)}.client-error-detail-label{font-size:.875rem;font-weight:600;color:var(--gray-600);text-transform:uppercase;letter-spacing:.025em}.client-error-detail-value{font-size:.9375rem;font-family:ui-monospace,Cascadia Code,Source Code Pro,Menlo,monospace;color:var(--gray-800);word-break:break-all;background:none;padding:0}.client-error-hint{display:flex;align-items:flex-start;gap:var(--spacing-sm);padding:var(--spacing-md);background-color:#fffbeb;border:1px solid #FDE68A;border-radius:var(--border-radius-md);text-align:left}.client-error-hint p{font-size:.9375rem;color:#92400e;line-height:1.5;margin:0}.client-error-hint-icon{flex-shrink:0;width:1.25rem;height:1.25rem;color:#d97706;margin-top:.125rem}.client-error-action{margin-top:var(--spacing-lg)}.high-contrast .client-error-icon-wrapper{background-color:var(--gray-800);color:#ff6b6b;border:2px solid var(--high-contrast-primary)}.high-contrast .client-error-title,.high-contrast .client-error-description{color:var(--high-contrast-text)}.high-contrast .client-error-detail{background-color:var(--gray-800);border-color:var(--high-contrast-primary)}.high-contrast .client-error-detail-label{color:var(--high-contrast-primary)}.high-contrast .client-error-detail-value{color:var(--high-contrast-text)}.high-contrast .client-error-hint{background-color:var(--gray-800);border-color:var(--high-contrast-primary)}.high-contrast .client-error-hint p{color:var(--high-contrast-text)}.high-contrast .client-error-hint-icon{color:var(--high-contrast-primary)}.dyslexic-font .client-error-title{font-size:1.625rem;letter-spacing:.02em}.dyslexic-font .client-error-description,.dyslexic-font .client-error-hint p{font-size:1.0625rem;line-height:1.7}@media (max-width: 640px){.client-error-title{font-size:1.375rem}.client-error-description{font-size:1rem}}.account-card{display:flex;align-items:center;gap:var(--spacing-lg);padding:var(--spacing-lg);margin-bottom:var(--spacing-xl);background-color:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--border-radius-lg);transition:border-color var(--transition-fast)}.account-card:hover{border-color:var(--olecio-orange-light)}.account-avatar{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:3.5rem;height:3.5rem;border-radius:50%;background-color:var(--olecio-orange);color:var(--white);font-weight:600;font-size:1.125rem}.account-info{min-width:0}.account-name{font-weight:600;font-size:1.0625rem;color:var(--gray-900);margin-bottom:var(--spacing-xs)}.account-email{font-size:.9375rem;color:var(--gray-600);word-break:break-all}.account-actions{display:flex;flex-direction:column;gap:var(--spacing-md)}.btn-outline{background-color:transparent;color:var(--gray-700);border:1px solid var(--gray-300)}.btn-outline:hover{background-color:var(--gray-100);border-color:var(--gray-400)}.btn-ghost{background-color:transparent;color:var(--gray-500);border:none}.btn-ghost:hover{color:var(--gray-700);background-color:var(--gray-100)}.high-contrast .account-card{background-color:var(--gray-800)!important;border-color:var(--high-contrast-primary)!important}.high-contrast .account-name{color:var(--high-contrast-text)!important}.high-contrast .account-email{color:var(--gray-300)!important}.high-contrast .account-avatar{background-color:var(--high-contrast-primary)!important;color:var(--high-contrast-bg)!important}.high-contrast .btn-outline{color:var(--high-contrast-text)!important;border-color:var(--high-contrast-primary)!important}.high-contrast .btn-ghost{color:var(--gray-300)!important}@media (max-width: 640px){.account-card{flex-direction:column;text-align:center;padding:var(--spacing-md)}.account-avatar{width:3rem;height:3rem;font-size:1rem}}