@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap";:root{--gradient-primary:linear-gradient(135deg, #6c63ff 0%, #9d93ff 100%);--gradient-secondary:linear-gradient(135deg, #ff6584 0%, #ff8fa3 100%);--gradient-success:linear-gradient(135deg, #43b97f 0%, #6dd9a3 100%);--gradient-dark-bg:linear-gradient(135deg, #0a0a1a 0%, #12122a 50%, #0a0a1a 100%);--gradient-light-bg:linear-gradient(135deg, #f5f6fa 0%, #e8eaff 50%, #f5f6fa 100%);--glass-dark:#ffffff08;--glass-light:#ffffffb3;--glass-border-dark:#ffffff0f;--glass-border-light:#00000014;--shadow-dark:0 8px 32px #0006;--shadow-light:0 8px 32px #6c63ff14;--shadow-glow:0 0 40px #6c63ff26}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Plus Jakarta Sans,Inter,-apple-system,BlinkMacSystemFont,sans-serif;overflow-x:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#6c63ff4d;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#6c63ff80}.glass-card{-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border-dark);background:var(--glass-dark);border-radius:20px;transition:all .4s cubic-bezier(.4,0,.2,1)}[data-theme=light] .glass-card{background:var(--glass-light);border-color:var(--glass-border-light);box-shadow:var(--shadow-light)}.glass-card:hover{box-shadow:var(--shadow-glow);border-color:#6c63ff4d;transform:translateY(-4px)}.animated-bg{z-index:-1;width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}.animated-bg .orb{filter:blur(80px);opacity:.15;border-radius:50%;animation:20s ease-in-out infinite float;position:absolute}.animated-bg .orb:first-child{background:#6c63ff;width:500px;height:500px;animation-delay:0s;top:-100px;left:-100px}.animated-bg .orb:nth-child(2){background:#ff6584;width:400px;height:400px;animation-delay:-5s;top:50%;right:-100px}.animated-bg .orb:nth-child(3){background:#43b97f;width:350px;height:350px;animation-delay:-10s;bottom:-50px;left:30%}.animated-bg .orb:nth-child(4){background:#ffb347;width:300px;height:300px;animation-delay:-15s;top:30%;left:20%}@keyframes float{0%,to{transform:translate(0)scale(1)}25%{transform:translate(40px,-40px)scale(1.05)}50%{transform:translate(-20px,30px)scale(.95)}75%{transform:translate(30px,20px)scale(1.02)}}.particles-container{pointer-events:none;z-index:0;width:100%;height:100%;position:fixed;top:0;left:0}.particle{background:#6c63ff4d;border-radius:50%;width:3px;height:3px;animation:linear infinite particleFloat;position:absolute}@keyframes particleFloat{0%{opacity:0;transform:translateY(100vh)rotate(0)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(-100px)rotate(720deg)}}.hero-section{text-align:center;z-index:1;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:40px 20px;display:flex;position:relative}.hero-title{background:linear-gradient(135deg,#6c63ff 0%,#ff6584 50%,#ffb347 100%) 0 0/200%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:20px;font-size:clamp(2.5rem,6vw,4.5rem);font-weight:800;line-height:1.1;animation:4s ease-in-out infinite gradientShift}@keyframes gradientShift{0%,to{background-position:0%}50%{background-position:100%}}.hero-subtitle{max-width:600px;margin-bottom:40px;font-size:clamp(1rem,2.5vw,1.4rem);line-height:1.6}.hero-cta{position:relative;overflow:hidden}.hero-cta:before{content:"";z-index:-1;background:linear-gradient(135deg,#6c63ff,#ff6584,#ffb347,#43b97f,#6c63ff) 0 0/300% 300%;border-radius:14px;animation:3s ease-in-out infinite borderGlow;position:absolute;inset:-2px}@keyframes borderGlow{0%,to{background-position:0%}50%{background-position:100%}}.stats-bar{flex-wrap:wrap;justify-content:center;gap:40px;margin-top:60px;display:flex}.stat-item{text-align:center}.stat-number{background:var(--gradient-primary);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:2rem;font-weight:800}.stat-label{opacity:.7;margin-top:4px;font-size:.85rem}.quiz-container{z-index:1;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:40px 20px;display:flex;position:relative}.quiz-progress{width:100%;max-width:600px;margin-bottom:40px}.quiz-card{width:100%;max-width:800px;animation:.5s cubic-bezier(.4,0,.2,1) slideUp}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.quiz-option{cursor:pointer;border:2px solid #0000;transition:all .3s cubic-bezier(.4,0,.2,1);border-radius:16px!important;padding:20px!important}.quiz-option:hover{border-color:#6c63ff4d;transform:translateY(-2px)}.quiz-option.selected{background:#6c63ff14!important;border-color:#6c63ff!important}.tree-container{z-index:1;padding:20px;position:relative}.tree-node{margin:4px 0;padding-left:24px;position:relative}.tree-node:before{content:"";background:#6c63ff26;border-radius:2px;width:2px;position:absolute;top:0;bottom:0;left:8px}.tree-node:after{content:"";background:#6c63ff26;width:16px;height:2px;position:absolute;top:20px;left:8px}.tree-item{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:12px;align-items:center;gap:12px;padding:10px 16px;transition:all .25s;display:flex}.tree-item:hover{background:#6c63ff14}.tree-item.active{background:#6c63ff1f}.tree-item .expand-icon{font-size:1.2rem;transition:transform .3s}.tree-item .expand-icon.expanded{transform:rotate(90deg)}.tree-children{transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .3s;overflow:hidden}.tree-children.collapsed{opacity:0;max-height:0}.tree-children.expanded{opacity:1;max-height:5000px}.career-grid{z-index:1;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:24px;padding:20px;display:grid;position:relative}.career-card{cursor:pointer;border-radius:20px;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.career-card:before{content:"";background:var(--card-accent,var(--gradient-primary));opacity:0;height:4px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.career-card:hover:before{opacity:1}.career-card:hover{transform:translateY(-6px);box-shadow:0 20px 40px #6c63ff26}.match-badge{letter-spacing:.02em;border-radius:20px;align-items:center;gap:4px;padding:4px 12px;font-size:.75rem;font-weight:700;display:inline-flex}.match-badge.high{color:#43b97f;background:#43b97f26}.match-badge.medium{color:#ffb347;background:#ffb34726}.match-badge.low{color:#ff5252;background:#ff525226}.detail-panel{animation:.4s cubic-bezier(.4,0,.2,1) slideInRight}@keyframes slideInRight{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}.income-bar{background:#6c63ff1a;border-radius:4px;height:8px;margin:8px 0;overflow:hidden}.income-bar-fill{background:var(--gradient-primary);border-radius:4px;height:100%;transition:width 1s cubic-bezier(.4,0,.2,1)}.growth-meter{gap:4px;display:flex}.growth-dot{border-radius:50%;width:12px;height:12px;transition:all .3s}.growth-dot.active{background:var(--gradient-success);box-shadow:0 0 8px #43b97f66}.growth-dot.inactive{background:#ffffff1a}.view-toggle{border:1px solid #6c63ff33;border-radius:12px;display:inline-flex;overflow:hidden}.view-toggle-btn{cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding:8px 20px;font-size:.85rem;font-weight:600;transition:all .3s;display:flex}.view-toggle-btn.active{color:#6c63ff;background:#6c63ff26}.theme-toggle{cursor:pointer;border:none;border-radius:14px;outline:none;width:56px;height:28px;transition:all .4s;position:relative}.theme-toggle.dark{background:linear-gradient(135deg,#1a1a3e 0%,#2a2a5e 100%)}.theme-toggle.light{background:linear-gradient(135deg,#87ceeb 0%,gold 100%)}.theme-toggle-indicator{border-radius:50%;width:22px;height:22px;transition:all .4s cubic-bezier(.4,0,.2,1);position:absolute;top:3px}.theme-toggle.dark .theme-toggle-indicator{background:#e8e8f0;left:31px;box-shadow:inset -3px -2px #1a1a3e}.theme-toggle.light .theme-toggle-indicator{background:gold;left:3px;box-shadow:0 0 8px #ffd70066}.skill-chip{color:#7c6fff;background:#6c63ff14;border:1px solid #6c63ff26;border-radius:8px;align-items:center;padding:6px 14px;font-size:.78rem;font-weight:600;transition:all .25s;display:inline-flex}.skill-chip:hover{background:#6c63ff26;transform:translateY(-1px)}.fade-enter{opacity:0;transform:translateY(20px)}.fade-enter-active{opacity:1;transition:all .4s cubic-bezier(.4,0,.2,1);transform:translateY(0)}.page-transition{animation:.6s cubic-bezier(.4,0,.2,1) pageIn}@keyframes pageIn{0%{opacity:0;transform:scale(.98)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}@media (width<=768px){.career-grid{grid-template-columns:1fr;padding:12px}.stats-bar{gap:20px}.hero-title{font-size:2.2rem}}@media (width<=480px){.quiz-option{padding:14px!important}}@keyframes pulse{0%,to{box-shadow:0 0 #6c63ff66}50%{box-shadow:0 0 0 12px #6c63ff00}}.pulse-animation{animation:2s ease-in-out infinite pulse}.stagger-1{animation-delay:50ms}.stagger-2{animation-delay:.1s}.stagger-3{animation-delay:.15s}.stagger-4{animation-delay:.2s}.stagger-5{animation-delay:.25s}.stagger-6{animation-delay:.3s}.stagger-7{animation-delay:.35s}.stagger-8{animation-delay:.4s}.search-bar{position:relative}.search-bar input{width:100%;color:inherit;background:#6c63ff0a;border:1px solid #6c63ff26;border-radius:14px;outline:none;padding:14px 20px 14px 48px;font-family:Plus Jakarta Sans,sans-serif;font-size:.95rem;transition:all .3s}.search-bar input:focus{border-color:#6c63ff;box-shadow:0 0 0 3px #6c63ff1a}.search-bar .search-icon{opacity:.5;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.navbar{z-index:1000;-webkit-backdrop-filter:blur(20px);border-bottom:1px solid #6c63ff14;transition:all .3s;position:fixed;top:0;left:0;right:0}.navbar.scrolled{box-shadow:0 4px 20px #0000001a}.breadcrumb-nav{flex-wrap:wrap;align-items:center;gap:8px;padding:12px 0;font-size:.85rem;display:flex}.breadcrumb-item{cursor:pointer;opacity:.7;transition:color .2s}.breadcrumb-item:hover{opacity:1;color:#6c63ff}.breadcrumb-separator{opacity:.3;font-size:.7rem}.course-link{color:inherit;border:1px solid #6c63ff1a;border-radius:14px;align-items:center;gap:12px;padding:14px 18px;text-decoration:none;transition:all .3s;display:flex}.course-link:hover{background:#6c63ff0f;border-color:#6c63ff40;transform:translate(4px)}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:80px 20px;display:flex}.empty-state-icon{opacity:.2;margin-bottom:20px;font-size:4rem!important}
