:root{--primary:#005596;--primary-container:#004881;--on-primary:#fff;--secondary:#00a650;--background:#f9f9ff;--surface:#fff;--surface-dim:#f0f3ff;--outline:#727781;--outline-variant:#c1c7d2;--text-primary:#111c2d;--text-secondary:#414750;--error:#ba1a1a;--font-sans:"Hanken Grotesk", sans-serif;--font-mono:"JetBrains Mono", monospace;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-full:9999px}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}body{font-family:var(--font-sans);background-color:var(--background);color:var(--text-primary);-webkit-font-smoothing:antialiased;flex-direction:column;line-height:1.5;display:flex}#app{flex-direction:column;flex:1;display:flex;overflow:hidden}.view{-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;display:none;overflow-y:auto}.view.active{display:flex}.app-bar{background-color:var(--primary);color:var(--on-primary);padding:var(--spacing-md);flex-shrink:0;justify-content:space-between;align-items:center;gap:8px;min-height:56px;display:flex;box-shadow:0 2px 4px #0000001a}.app-bar h1{text-overflow:ellipsis;white-space:nowrap;flex:1;margin:0;font-size:18px;font-weight:600;overflow:hidden}.icon-button{color:inherit;cursor:pointer;padding:var(--spacing-xs);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.content-wrapper{-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;padding-bottom:72px;display:flex;overflow-y:auto}.login-container{padding:var(--spacing-lg);background:radial-gradient(circle at top, var(--surface-dim) 0%, var(--background) 100%);flex-direction:column;flex:1;justify-content:center;display:flex}.login-card{background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--outline-variant);overflow:hidden;box-shadow:0 4px 12px #0000000d}.login-header{padding:var(--spacing-xl) var(--spacing-lg);text-align:center;border-bottom:1px solid var(--outline-variant);background-color:var(--surface-dim)}.login-logo-container{background-color:var(--background);border-radius:var(--radius-full);width:80px;height:80px;margin:0 auto var(--spacing-md);border:2px solid var(--primary);justify-content:center;align-items:center;display:flex;overflow:hidden}.login-title{color:var(--primary);margin-bottom:4px;font-size:24px;font-weight:700}.login-subtitle{color:var(--outline);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:1px;font-size:12px}.login-form{padding:var(--spacing-lg);gap:var(--spacing-md);flex-direction:column;display:flex}.input-group{gap:var(--spacing-xs);flex-direction:column;display:flex}.input-label{font-family:var(--font-mono);color:var(--text-secondary);text-transform:uppercase;justify-content:space-between;font-size:12px;font-weight:700;display:flex}.input-wrapper{align-items:center;display:flex;position:relative}.input-icon{left:var(--spacing-md);color:var(--outline);position:absolute}.input-field{width:100%;height:48px;padding:0 var(--spacing-md) 0 44px;border:none;border-bottom:1px solid var(--outline-variant);background:var(--surface);font-family:var(--font-sans);color:var(--text-primary);outline:none;font-size:16px;transition:border-color .2s}.input-field:focus{border-bottom-color:var(--primary)}.input-wrapper:focus-within .input-icon{color:var(--primary)}.btn-primary{background-color:var(--primary);height:48px;color:var(--on-primary);border-radius:var(--radius-sm);font-family:var(--font-mono);text-transform:uppercase;justify-content:center;align-items:center;gap:var(--spacing-sm);cursor:pointer;margin-top:var(--spacing-sm);border:none;font-size:14px;font-weight:700;display:flex}.btn-primary:active{background-color:var(--primary-container);transform:scale(.98)}.list-container{padding:var(--spacing-md);gap:var(--spacing-md);flex-direction:column;display:flex}.card{background:var(--surface);border:1px solid var(--outline-variant);border-radius:var(--radius-md);padding:var(--spacing-md);box-shadow:0 1px 3px #0000000d}.material-symbols-outlined{font-variation-settings:"FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24}.bottom-nav{width:100%;height:calc(56px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);background-color:var(--surface);border-top:1px solid var(--outline-variant);z-index:9000;justify-content:space-around;align-items:flex-start;display:flex;position:fixed;bottom:0;left:0;box-shadow:0 -2px 10px #0000000d}.nav-item{color:var(--outline);cursor:pointer;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;height:56px;padding-top:6px;transition:color .2s;display:flex}.nav-item span:last-child{font-size:11px;font-family:var(--font-mono);text-transform:uppercase;font-weight:600}.nav-item.active{color:var(--primary)}.dropdown-backdrop{z-index:9500;display:none;position:fixed;inset:0}.dropdown-backdrop.open{display:block}.dropdown-menu{background:var(--surface);border:1px solid var(--outline-variant);border-radius:var(--radius-md);z-index:9600;opacity:0;pointer-events:none;transform-origin:100% 0;min-width:220px;transition:opacity .2s,transform .2s;position:fixed;top:56px;right:12px;transform:translateY(-8px)scale(.95);box-shadow:0 8px 24px #0000002e}.dropdown-menu.open{opacity:1;pointer-events:auto;transform:translateY(0)scale(1)}.dropdown-item{cursor:pointer;width:100%;font-family:var(--font-sans);color:var(--text-primary);background:0 0;border:none;align-items:center;gap:12px;padding:14px 16px;font-size:15px;transition:background .15s;display:flex}.dropdown-item:active{background:var(--surface-dim)}.dropdown-item .material-symbols-outlined{color:var(--outline);font-size:20px}.dropdown-divider{background:var(--outline-variant);height:1px;margin:0}.modal-overlay{z-index:8000;opacity:0;pointer-events:none;background:#111c2d99;align-items:flex-end;width:100%;height:100%;transition:opacity .3s;display:flex;position:fixed;top:0;left:0}.modal-overlay.show{opacity:1;pointer-events:auto}.modal-content{background:var(--surface);width:100%;padding:var(--spacing-md);border-radius:16px 16px 0 0;transition:transform .3s cubic-bezier(.1,.9,.2,1);transform:translateY(100%)}.modal-overlay.show .modal-content{transform:translateY(0)}.modal-header{margin-bottom:var(--spacing-md);border-bottom:1px solid var(--outline-variant);padding-bottom:var(--spacing-sm);justify-content:space-between;align-items:center;display:flex}.pruebas-grid{gap:var(--spacing-sm);grid-template-columns:1fr 1fr;display:grid}.prueba-item{cursor:pointer;display:block}.prueba-item input{display:none}.prueba-card{border:1px solid var(--outline-variant);border-radius:var(--radius-md);padding:var(--spacing-sm);text-align:center;font-family:var(--font-mono);color:var(--text-secondary);background:var(--background);font-size:14px;transition:all .2s}.prueba-item input:checked+.prueba-card{background:var(--surface-dim);border-color:var(--primary);color:var(--primary);font-weight:700}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin;display:inline-block}.fixed-action-bar{bottom:calc(56px + env(safe-area-inset-bottom,0px));width:100%;padding:var(--spacing-md);background:linear-gradient(to top, var(--surface) 60%, transparent);z-index:90;position:fixed;left:0}
