:root{--primary:#10b981;--primary-dark:#059669;--primary-light:#d1fae5;--accent:#f59e0b;--accent-light:#fef3c7;--danger:#ef4444;--danger-light:#fee2e2;--success:#10b981;--bg:#f0fdf4;--surface:#fff;--surface2:#f9fafb;--text:#111827;--text2:#6b7280;--border:#e5e7eb;--radius:14px;--radius-sm:8px;--shadow:0 2px 8px #00000014;--shadow-lg:0 8px 24px #0000001f;--transition:.18s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg);height:100%;color:var(--text);-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:16px;line-height:1.5}button{cursor:pointer;-webkit-tap-highlight-color:transparent;border:none;outline:none;font-family:inherit}button:focus-visible{outline:3px solid var(--primary);outline-offset:2px}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}.btn{border-radius:var(--radius-sm);transition:background var(--transition), transform var(--transition);justify-content:center;align-items:center;gap:6px;min-height:48px;padding:12px 24px;font-size:1rem;font-weight:600;display:inline-flex}.btn:active{transform:scale(.97)}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark)}.btn-secondary{background:var(--surface);color:var(--primary);border:2px solid var(--primary)}.btn-secondary:hover{background:var(--primary-light)}.btn-ghost{color:var(--text2);background:0 0}.btn-ghost:hover{background:var(--surface2)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#dc2626}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}.input{border:2px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);width:100%;color:var(--text);transition:border-color var(--transition);outline:none;min-height:48px;padding:12px 16px;font-family:inherit;font-size:1rem}.input:focus{border-color:var(--primary)}.input::placeholder{color:var(--text2)}.label{color:var(--text2);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;font-size:.875rem;font-weight:600;display:block}.form-group{flex-direction:column;gap:6px;display:flex}.error-msg{color:var(--danger);background:var(--danger-light);border-radius:var(--radius-sm);padding:10px 14px;font-size:.875rem}.success-msg{color:#065f46;background:var(--primary-light);border-radius:var(--radius-sm);padding:10px 14px;font-size:.875rem}.page-container{flex-direction:column;max-width:480px;min-height:100vh;margin:0 auto;padding:16px;display:flex}.spacer{flex:1}.progress-bar{background:var(--border);border-radius:3px;height:6px;overflow:hidden}.progress-fill{background:var(--primary);border-radius:3px;height:100%;transition:width .3s}.chip{background:var(--primary-light);color:var(--primary-dark);border-radius:20px;align-items:center;gap:4px;padding:4px 10px;font-size:.8rem;font-weight:600;display:inline-flex}.chip-accent{background:var(--accent-light);color:#92400e}@keyframes pop-in{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}60%{transform:translate(6px)}}@keyframes slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-pop{animation:.2s pop-in}.animate-shake{animation:.4s shake}.animate-slide{animation:.25s slide-up}.bottom-nav{background:var(--surface);border-top:1px solid var(--border);padding:8px 0 max(8px, env(safe-area-inset-bottom));z-index:100;display:flex;position:fixed;bottom:0;left:0;right:0}.bottom-nav a{color:var(--text2);transition:color var(--transition);flex-direction:column;flex:1;align-items:center;gap:2px;padding:6px 0;font-size:.7rem;font-weight:600;text-decoration:none;display:flex}.bottom-nav a.active{color:var(--primary)}.bottom-nav .nav-icon{font-size:1.4rem}.top-bar{background:var(--surface);border-bottom:1px solid var(--border);z-index:50;justify-content:space-between;align-items:center;padding:12px 16px;display:flex;position:sticky;top:0}.top-bar-title{color:var(--primary);font-size:1.1rem;font-weight:700}