@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";:root{--bg-primary:#f9fafb;--bg-card:#fff;--bg-elevated:#f3f4f6;--bg-overlay:#ffffffd9;--accent:#4f46e5;--accent-light:#6366f1;--accent-glow:#4f46e540;--accent-muted:#4f46e51a;--text-primary:#111827;--text-secondary:#4b5563;--text-muted:#6b7280;--success:#059669;--warning:#d97706;--danger:#dc2626;--info:#2563eb;--border:#00000014;--border-focus:#4f46e566;--risk-low:#059669;--risk-medium:#d97706;--risk-high:#dc2626;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--shadow-card:0 4px 12px #0000000d;--shadow-glow:0 0 20px var(--accent-glow);--shadow-elevated:0 8px 24px #00000014;--transition:.2s ease;--transition-slow:.35s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-sans);background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100dvh;line-height:1.5;overflow-x:hidden}.container{max-width:430px;padding:0 var(--space-md);margin:0 auto}.sr-only{clip:rect(0,0,0,0);width:1px;height:1px;position:absolute}.text-muted{color:var(--text-muted)}.text-accent{color:var(--accent)}.text-success{color:var(--success)}.btn{justify-content:center;align-items:center;gap:var(--space-sm);padding:14px var(--space-lg);border-radius:var(--radius-full);font-family:var(--font-sans);font-size:var(--text-base);cursor:pointer;transition:all var(--transition);border:none;width:100%;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background:var(--accent);color:#fff;box-shadow:0 4px 16px var(--accent-glow)}.btn-primary:hover{background:var(--accent-light);transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-ghost{background:var(--accent-muted);color:var(--accent-light);border:1px solid var(--border-focus)}.btn-ghost:hover{background:#6c63ff40}.card{background:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border);transition:transform var(--transition), box-shadow var(--transition);overflow:hidden}.card:hover{box-shadow:var(--shadow-glow);border-color:var(--border-focus);transform:translateY(-3px)}.input{width:100%;padding:14px var(--space-md);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-base);transition:border-color var(--transition);outline:none}.input:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--accent-muted)}.input::placeholder{color:var(--text-muted)}.input-label{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--space-xs);font-weight:500;display:block}.select{width:100%;padding:14px var(--space-md);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-base);appearance:none;cursor:pointer;outline:none}.badge{border-radius:var(--radius-full);font-size:var(--text-xs);letter-spacing:.03em;white-space:nowrap;align-items:center;padding:4px 10px;font-weight:600;display:inline-flex}.badge-accent{background:var(--accent-muted);color:var(--accent-light)}.badge-success{color:var(--success);background:#22c55e26}.badge-warning{color:var(--warning);background:#f59e0b26}.badge-danger{color:var(--danger);background:#ef444426}.page{min-height:100dvh;padding-bottom:80px}.progress-bar{background:var(--bg-elevated);border-radius:var(--radius-full);width:100%;height:4px;overflow:hidden}.progress-bar-fill{background:linear-gradient(90deg, var(--accent), var(--accent-light));border-radius:var(--radius-full);height:100%;transition:width .4s}.scroll-row{gap:var(--space-md);padding:var(--space-sm) var(--space-md) var(--space-md);scrollbar-width:none;-ms-overflow-style:none;display:flex;overflow-x:auto}.scroll-row::-webkit-scrollbar{display:none}.career-card{border-radius:var(--radius-md);background:var(--bg-card);border:1px solid var(--border);cursor:pointer;width:160px;transition:transform var(--transition), border-color var(--transition);flex-shrink:0;overflow:hidden}.career-card:hover{border-color:var(--border-focus);transform:scale(1.03)}.career-card-thumb{object-fit:cover;background:var(--bg-elevated);width:100%;height:90px}.career-card-thumb-placeholder{background:linear-gradient(135deg, var(--bg-elevated), var(--bg-card));justify-content:center;align-items:center;width:100%;height:90px;font-size:2rem;display:flex}.career-card-body{padding:var(--space-sm) var(--space-sm) var(--space-md)}.career-card-title{font-size:var(--text-sm);margin-bottom:var(--space-xs);font-weight:600}.career-card-cluster{font-size:var(--text-xs);color:var(--text-muted)}.quiz-option{width:100%;padding:var(--space-md);background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-base);text-align:left;cursor:pointer;transition:all var(--transition)}.quiz-option:hover{border-color:var(--accent);background:var(--accent-muted)}.quiz-option.selected{border-color:var(--accent);background:var(--accent-muted);color:var(--accent-light)}.quiz-option.correct{border-color:var(--success);background:#22c55e1a}.quiz-option.incorrect{border-color:var(--danger);background:#ef44441a}.score-bar-container{margin-bottom:var(--space-md)}.score-bar-header{margin-bottom:var(--space-xs);font-size:var(--text-sm);justify-content:space-between;display:flex}.score-bar{background:var(--bg-elevated);border-radius:var(--radius-full);height:8px;overflow:hidden}.score-bar-fill{border-radius:var(--radius-full);background:linear-gradient(90deg, var(--accent), var(--accent-light));height:100%;transition:width 1s}@keyframes fadeUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-fade-up{animation:.4s forwards fadeUp}.skeleton{background:var(--bg-elevated);border-radius:var(--radius-sm);animation:1.5s infinite pulse}