.logo-link{width:85px;margin:10px 0 0 -120px;opacity: 1;}

.logo-link img{width:100%;}

.logo{font-family:'Space Grotesk',sans-serif;font-weight:800;font-size:1.8rem;letter-spacing:-1px}

.logo a {display:flex;height:65px;line-height:65px;align-items:center}

.logo img{max-height:45px;width:auto; margin-top:5px;}



        *{margin:0;padding:0;box-sizing:border-box}
        :root{--primary-gradient:linear-gradient(135deg,#7C3AED 0%,#6366F1 50%,#8B5CF6 100%);--accent-primary:#7C3AED;--accent-secondary:#6366F1;--accent-coral:#7C3AED;--accent-orange:#8B5CF6;--accent-pink:#A78BFA;--accent-purple:#7C3AED;--dark-bg:#0D0D0F;--dark-surface:#151518;--dark-card:#1A1A1F;--dark-border:#2A2A30;--text-primary:#FFFFFF;--text-secondary:#A0A0A8;--success:#4ECDC4;--warning:#FFE66D;--info:#45B7D1;--header-height:65px;--progress-height:50px}
        body{font-family:'Outfit',sans-serif;background:var(--dark-bg);color:var(--text-primary);min-height:100vh}

        .loading-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--dark-bg);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:9999;transition:opacity 0.3s ease}
        .loading-overlay.hidden{opacity:0;pointer-events:none}
        .loading-spinner{width:50px;height:50px;border:3px solid var(--dark-border);border-top-color:var(--accent-primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}
        .loading-text{color:var(--text-secondary);font-size:1rem}
        @keyframes spin{to{transform:rotate(360deg)}}

        .toast{position:fixed;bottom:2rem;right:2rem;background:var(--success);color:var(--dark-bg);padding:0.75rem 1.5rem;border-radius:10px;display:flex;align-items:center;gap:0.5rem;font-weight:500;transform:translateY(100px);opacity:0;transition:all 0.3s ease;z-index:1000}
        .toast.visible{transform:translateY(0);opacity:1}
        .toast-icon{font-size:1.2rem}

        .app-container{min-height:100vh;display:flex;flex-direction:column}
        .header{padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--dark-border);position:fixed;top:0;left:0;right:0;height:var(--header-height);z-index:100;  backdrop-filter: blur(4px);background: #15151866;}
        .logo{font-family:'Space Grotesk',sans-serif;font-weight:800;font-size:1.8rem;letter-spacing:-1px;text-decoration:none}
        .logo-unity{color:var(--text-primary)}.logo-2b3{background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

        .header-right{display:flex;align-items:center;gap:1rem}
        .preview-badge{padding:0.4rem 0.8rem;background:rgba(124,58,237,0.2);border:1px solid rgba(124,58,237,0.4);border-radius:20px;font-size:0.8rem;color:var(--accent-primary)}
        .login-btn{padding:0.5rem 1rem;border:1px solid var(--dark-border);border-radius:8px;background:transparent;color:var(--text-secondary);font-family:'Outfit',sans-serif;font-size:0.85rem;text-decoration:none;transition:all 0.3s ease}
        .login-btn:hover{border-color:var(--accent-primary);color:var(--accent-primary)}

        .progress-bar-container{padding:0.75rem 2rem;background:var(--dark-surface);border-bottom:1px solid var(--dark-border);position:fixed;top:var(--header-height);left:280px;right:0;height:var(--progress-height);z-index:99;display:none}
        .progress-bar-container.visible{display:block}
        .progress-bar-header{display:flex;justify-content:space-between;margin-bottom:0.5rem;font-size:0.8rem;color:var(--text-secondary)}
        .progress-bar{height:5px;background:var(--dark-card);border-radius:3px;overflow:hidden}
        .progress-fill{height:100%;background:var(--primary-gradient);transition:width 0.5s ease;border-radius:3px}
        .main-content{flex:1;display:flex;margin-top:var(--header-height)}
        .sidebar{width:265px;background:#15151866;border-right:1px solid var(--dark-border);padding:2rem 1rem;overflow-y:auto;position:fixed;top:var(--header-height);left:0;bottom:0;z-index:98; backdrop-filter: blur(5px);}
        .sidebar-title{font-size:0.75rem;text-transform:uppercase;letter-spacing:2px;color:var(--text-secondary);margin-bottom:1.5rem;padding:0 0.5rem}
        .nav-item{display:flex;align-items:center;gap:0.75rem;padding:0.75rem 1rem;border-radius:12px;cursor:pointer;transition:all 0.3s ease;margin-bottom:0.5rem;position:relative}
        .nav-item:hover{background:var(--dark-card)}.nav-item.active{background:var(--dark-card)}
        .nav-item.active::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:60%;background:var(--primary-gradient);border-radius:0 2px 2px 0}
        .nav-item.completed .nav-icon{background:var(--success)!important}
        .nav-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;background:var(--dark-border);transition:all 0.3s ease;flex-shrink:0}
        .nav-text{flex:1;min-width:0}.nav-title{font-weight:500;font-size:0.9rem;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
        .nav-subtitle{font-size:0.7rem;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
        .nav-check{color:var(--success);font-size:1rem;flex-shrink:0}
        .nav-remove{width:24px;height:24px;border-radius:6px;background:transparent;border:1px solid transparent;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:0.9rem;opacity:0;transition:all 0.3s ease;flex-shrink:0}
        .nav-item:hover .nav-remove{opacity:1}.nav-remove:hover{background:rgba(124,58,237,0.2);border-color:var(--accent-primary);color:var(--accent-primary)}
        .content-wrapper{flex:1;margin-left:280px;display:flex;flex-direction:column;min-height:calc(100vh - var(--header-height))}
        .content-area{flex:1;padding:2rem 3rem;max-width:1100px;margin:0 auto;width:100%;padding-top:calc(var(--progress-height) + 2rem)}
        .content-area.no-progress{padding-top:1rem}
        .gradient-text{background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
        .section-transition{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--dark-bg);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:200;opacity:0;pointer-events:none;transition:opacity 0.3s ease}
        .section-transition.active{opacity:1;pointer-events:all}
        .transition-icon{width:120px;height:120px;border-radius:30px;display:flex;align-items:center;justify-content:center;font-size:3.5rem;margin-bottom:2rem;animation:bounceIn 0.6s ease;position:relative}
        .transition-icon::after{content:'';position:absolute;inset:-8px;border-radius:38px;border:2px solid;border-color:inherit;opacity:0.3;animation:pulseRing 1.5s ease-in-out infinite}
        @keyframes bounceIn{0%{transform:scale(0);opacity:0}50%{transform:scale(1.2)}100%{transform:scale(1);opacity:1}}
        @keyframes pulseRing{0%{transform:scale(1);opacity:0.3}50%{transform:scale(1.15);opacity:0.1}100%{transform:scale(1);opacity:0.3}}
        .transition-title{font-family:'Space Grotesk',sans-serif;font-size:2rem;font-weight:700;margin-bottom:0.5rem;animation:slideUp 0.5s ease 0.2s both}
        .transition-subtitle{color:var(--text-secondary);font-size:1.1rem;animation:slideUp 0.5s ease 0.3s both;text-align:center;max-width:400px;padding:0 1rem}
        .transition-loader{margin-top:2rem;display:flex;gap:0.5rem;animation:slideUp 0.5s ease 0.4s both}
        .transition-dot{width:10px;height:10px;border-radius:50%;background:var(--accent-primary);animation:dotPulse 1.4s ease-in-out infinite}
        .transition-dot:nth-child(2){animation-delay:0.2s}.transition-dot:nth-child(3){animation-delay:0.4s}
        @keyframes slideUp{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}
        @keyframes dotPulse{0%,80%,100%{transform:scale(0.6);opacity:0.5}40%{transform:scale(1);opacity:1}}
        @keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
        @keyframes slideIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}
        .confirm-modal,.info-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.85);display:none;align-items:center;justify-content:center;z-index:300;padding:2rem}
        .confirm-modal.visible,.info-modal.visible{display:flex}
        .confirm-box,.info-box{background:var(--dark-surface);border:1px solid var(--dark-border);border-radius:20px;padding:2rem;max-width:400px;width:100%;text-align:center;animation:modalIn 0.3s ease}
        .info-box{max-width:500px;text-align:left;position:relative}
        @keyframes modalIn{from{transform:scale(0.9);opacity:0}to{transform:scale(1);opacity:1}}
        .confirm-icon,.info-icon{width:70px;height:70px;border-radius:50%;background:rgba(124,58,237,0.2);display:flex;align-items:center;justify-content:center;font-size:2rem;margin:0 auto 1.5rem}
        .info-icon{background:rgba(69,183,209,0.2)}
        .confirm-title,.info-title{font-family:'Space Grotesk',sans-serif;font-size:1.4rem;font-weight:600;margin-bottom:0.75rem;text-align:center}
        .confirm-text{color:var(--text-secondary);margin-bottom:1.5rem;line-height:1.6}
        .confirm-area-name{color:var(--accent-primary);font-weight:600}
        .confirm-buttons{display:flex;gap:1rem}
        .confirm-btn{flex:1;padding:0.875rem 1.5rem;border-radius:10px;font-family:'Outfit',sans-serif;font-size:0.95rem;font-weight:500;cursor:pointer;transition:all 0.3s ease}
        .confirm-btn.cancel{background:transparent;border:1px solid var(--dark-border);color:var(--text-secondary)}
        .confirm-btn.cancel:hover{border-color:var(--text-primary);color:var(--text-primary)}
        .confirm-btn.danger{background:var(--accent-primary);border:none;color:white}
        .confirm-btn.danger:hover{background:var(--accent-secondary);transform:translateY(-2px)}
        .confirm-step-2{display:none}.confirm-box.step-2 .confirm-step-1{display:none}.confirm-box.step-2 .confirm-step-2{display:block}
        .confirm-warning{background:rgba(124,58,237,0.1);border:1px solid rgba(124,58,237,0.3);border-radius:10px;padding:1rem;margin-bottom:1.5rem;font-size:0.9rem;color:var(--accent-primary)}
        .info-close{position:absolute;top:1rem;right:1rem;width:32px;height:32px;border-radius:8px;background:transparent;border:1px solid var(--dark-border);color:var(--text-secondary);cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center;transition:all 0.3s ease}
        .info-close:hover{border-color:var(--accent-primary);color:var(--accent-primary)}
        .info-content{margin:1.5rem 0}
        .info-item{display:flex;gap:0.75rem;padding:0.75rem 0;border-bottom:1px solid var(--dark-border);font-size:0.9rem;color:var(--text-secondary)}
        .info-item:last-child{border-bottom:none}
        .info-bullet{font-size:1.1rem}
        .info-item strong{color:var(--text-primary)}
        .info-got-it{width:100%;padding:0.875rem;background:var(--primary-gradient);border:none;border-radius:10px;color:white;font-family:'Outfit',sans-serif;font-size:1rem;font-weight:600;cursor:pointer;transition:all 0.3s ease}
        .info-got-it:hover{transform:translateY(-2px);box-shadow:0 4px 20px rgba(124,58,237,0.3)}

        /* Registration Modal */
        .reg-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.85);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;z-index:400;padding:20px}
        .reg-modal-overlay.visible{display:flex}
        .reg-modal{background:var(--dark-surface);border:1px solid var(--dark-border);border-radius:24px;padding:40px;max-width:500px;width:100%;text-align:center;position:relative;animation:modalIn 0.3s ease}
        .reg-modal-close{position:absolute;top:16px;right:16px;width:36px;height:36px;background:var(--dark-card);border:none;border-radius:50%;color:var(--text-secondary);font-size:20px;cursor:pointer}
        .reg-modal-close:hover{background:var(--accent-primary);color:#fff}
        .reg-modal-icon{font-size:64px;margin-bottom:20px}
        .reg-modal-title{font-family:'Space Grotesk',sans-serif;font-size:1.75rem;font-weight:700;margin-bottom:12px}
        .reg-modal-subtitle{color:var(--text-secondary);margin-bottom:28px;line-height:1.6}
        .reg-benefits{text-align:left;background:var(--dark-card);border-radius:16px;padding:20px;margin-bottom:28px}
        .reg-benefit{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--dark-border)}
        .reg-benefit:last-child{border-bottom:none}
        .reg-benefit-icon{font-size:1.25rem}
        .reg-modal-btns{display:flex;flex-direction:column;gap:12px}
        .reg-modal-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 24px;border-radius:12px;font-size:1rem;font-weight:600;text-decoration:none;cursor:pointer;transition:all 0.3s}
        .reg-modal-btn.primary{background:var(--primary-gradient);border:none;color:#fff}
        .reg-modal-btn.primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(124,58,237,0.4)}
        .reg-modal-btn.secondary{background:transparent;border:1px solid var(--dark-border);color:var(--text-secondary)}
        .reg-modal-btn.secondary:hover{border-color:var(--accent-primary);color:var(--accent-primary)}

        .welcome-section{text-align:center;padding:1rem 2rem;animation:fadeIn 0.6s ease}
        .welcome-badge{display:inline-flex;align-items:center;gap:0.5rem;padding:0.5rem 1rem;background:var(--dark-card);border:1px solid var(--dark-border);border-radius:50px;font-size:0.85rem;color:var(--text-secondary);margin-bottom:1.5rem}
        .welcome-badge span{background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:600}
        .welcome-title{font-family:'Space Grotesk',sans-serif;font-size:2.8rem;font-weight:700;line-height:1.1;margin-bottom:1.5rem}
        .welcome-description{font-size:1.1rem;color:var(--text-secondary);max-width:750px;margin:0 auto 2rem;line-height:1.7; font-weight: 100;}
        .welcome-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:0.75rem;margin-bottom:2.5rem;max-width:700px;margin-left:auto;margin-right:auto}
        .welcome-card{background:var(--dark-card);border:1px solid var(--dark-border);border-radius:14px;padding:1.25rem 1rem;text-align:center;transition:all 0.3s ease}
        .welcome-card:hover{transform:translateY(-4px);border-color:var(--accent-primary)}
        .welcome-card-icon{font-size:1.75rem;margin-bottom:0.5rem}.welcome-card-title{font-size:0.8rem;font-weight:500}
        .start-button{display:inline-flex;align-items:center;gap:0.75rem;padding:1rem 2.5rem;background:var(--primary-gradient);border:none;border-radius:50px;color:white;font-family:'Outfit',sans-serif;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all 0.3s ease;box-shadow:0 4px 20px rgba(124,58,237,0.3)}
        .start-button:hover{transform:translateY(-2px);box-shadow:0 6px 30px rgba(124,58,237,0.4)}
        .interests-section{animation:fadeIn 0.6s ease;padding:1rem 0}
        .interests-title{font-family:'Space Grotesk',sans-serif;font-size:2.2rem;font-weight:700;text-align:center;margin-bottom:0.75rem}
        .interests-subtitle{text-align:center;color:var(--text-secondary);font-size:1rem;margin-bottom:2rem;max-width:500px;margin-left:auto;margin-right:auto}
        .interests-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:1.5rem}
        .interest-card{position:relative;background:var(--dark-card);border:2px solid var(--dark-border);border-radius:18px;padding:1.5rem 1.25rem;cursor:pointer;transition:all 0.3s ease;text-align:center;overflow:hidden}
        .interest-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;opacity:0;transition:opacity 0.3s ease}
        .interest-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,0.3)}
        .interest-card:hover::before{opacity:0.5}
        .interest-card.selected{border-color:var(--accent-primary);background:rgba(124,58,237,0.08)}
        .interest-card.selected::before{opacity:1;background:var(--primary-gradient)}
        .interest-checkbox{position:absolute;top:0.875rem;right:0.875rem;width:24px;height:24px;border:2px solid var(--dark-border);border-radius:7px;display:flex;align-items:center;justify-content:center;transition:all 0.3s ease;font-size:12px;color:white}
        .interest-card.selected .interest-checkbox{background:var(--accent-primary);border-color:var(--accent-primary)}
        .interest-icon{width:60px;height:60px;margin:0 auto 0.875rem;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:1.75rem;transition:transform 0.3s ease}
        .interest-card:hover .interest-icon,.interest-card.selected .interest-icon{transform:scale(1.1)}
        .interest-title{font-weight:600;font-size:0.95rem;margin-bottom:0.4rem}
        .interest-description{font-size:0.75rem;color:var(--text-secondary);line-height:1.4}
        .interests-footer{text-align:center;margin-top:1rem}
        .interests-count{font-size:0.9rem;color:var(--text-secondary);margin-bottom:1rem}
        .interests-count span{color:var(--accent-primary);font-weight:600}
        .section-header{margin-bottom:2rem;animation:fadeIn 0.5s ease}
        .section-meta{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}
        .section-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.6rem}
        .section-progress{font-size:0.85rem;color:var(--text-secondary)}
        .section-title{font-family:'Space Grotesk',sans-serif;font-size:2rem;font-weight:700;margin-bottom:0.5rem}
        .section-description{color:var(--text-secondary);font-size:1rem;line-height:1.6;max-width:550px}
        .question-container{animation:slideIn 0.4s ease}
        .question-number{font-size:0.85rem;color:var(--text-secondary);margin-bottom:0.5rem}
        .question-text{font-size:1.3rem;font-weight:600;margin-bottom:1.5rem;line-height:1.4}
        .options-grid{display:flex;flex-direction:column;gap:0.625rem}
        .option-button{display:flex;align-items:center;gap:1rem;padding:1.125rem 1.25rem;background:var(--dark-card);border:2px solid var(--dark-border);border-radius:12px;color:var(--text-primary);font-family:'Outfit',sans-serif;font-size:0.95rem;text-align:left;cursor:pointer;transition:all 0.3s ease}
        .option-button:hover{border-color:var(--accent-primary);background:rgba(124,58,237,0.1)}
        .option-button.selected{border-color:var(--accent-primary);background:rgba(124,58,237,0.15)}
        .option-radio{width:22px;height:22px;border:2px solid var(--dark-border);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all 0.3s ease}
        .option-button.selected .option-radio{border-color:var(--accent-primary);background:var(--accent-primary)}
        .option-radio-inner{width:8px;height:8px;background:white;border-radius:50%;opacity:0;transition:opacity 0.3s ease}
        .option-button.selected .option-radio-inner{opacity:1}
        .option-checkbox{width:22px;height:22px;border:2px solid var(--dark-border);border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all 0.3s ease}
        .option-button.selected .option-checkbox{border-color:var(--accent-primary);background:var(--accent-primary)}
        .checkbox-icon{color:white;font-size:12px;opacity:0;transition:opacity 0.3s ease}
        .option-button.selected .checkbox-icon{opacity:1}
        .scale-container{padding:1.5rem 0}
        .scale-value{text-align:center;font-size:2.5rem;font-weight:700;background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:1rem}
        .scale-track{position:relative;height:8px;background:var(--dark-card);border-radius:4px;margin-bottom:0.5rem}
        .scale-fill{position:absolute;left:0;top:0;height:100%;background:var(--primary-gradient);border-radius:4px;transition:width 0.3s ease;pointer-events:none}
        .scale-input{width:100%;height:8px;-webkit-appearance:none;background:transparent;position:relative;z-index:2;cursor:pointer;margin-top:-8px}
        .scale-input::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;background:var(--accent-primary);border-radius:50%;cursor:pointer;box-shadow:0 2px 10px rgba(124,58,237,0.4)}
        .scale-labels{display:flex;justify-content:space-between;margin-top:0.75rem}
        .scale-label{font-size:0.8rem;color:var(--text-secondary)}
        .nav-buttons{display:flex;justify-content:space-between;margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--dark-border)}
        .nav-btn{display:flex;align-items:center;gap:0.75rem;padding:0.875rem 1.75rem;border-radius:12px;font-family:'Outfit',sans-serif;font-size:1rem;font-weight:500;cursor:pointer;transition:all 0.3s ease}
        .nav-btn.back{background:transparent;border:1px solid var(--dark-border);color:var(--text-secondary)}
        .nav-btn.back:hover{border-color:var(--text-primary);color:var(--text-primary)}
        .nav-btn.next{background:var(--primary-gradient);border:none;color:white;margin-left:auto}
        .nav-btn.next:hover{transform:translateY(-2px);box-shadow:0 4px 20px rgba(124,58,237,0.3)}
        .nav-btn.next:disabled{opacity:0.5;cursor:not-allowed;transform:none;box-shadow:none}
        .results-container{animation:fadeIn 0.6s ease}
        .results-header{text-align:center;margin-bottom:2rem}
        .results-title{font-family:'Space Grotesk',sans-serif;font-size:2.2rem;font-weight:700;margin-bottom:0.75rem}
        .results-subtitle{color:var(--text-secondary);font-size:1rem}
        .score-card{background:linear-gradient(135deg,rgba(124,58,237,0.15) 0%,rgba(99,102,241,0.15) 100%);border:1px solid rgba(124,58,237,0.3);border-radius:20px;padding:1.5rem 2rem;margin-bottom:2rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem}
        .score-left{display:flex;align-items:center;gap:1rem}
        .score-icon{width:60px;height:60px;background:var(--primary-gradient);border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:1.8rem}
        .score-info h3{font-size:1.1rem;font-weight:600;margin-bottom:0.25rem}
        .score-info p{font-size:0.85rem;color:var(--text-secondary)}
        .score-value{font-family:'Space Grotesk',sans-serif;font-size:2.5rem;font-weight:700;background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
        .score-max{font-size:1rem;color:var(--text-secondary);font-weight:400}
        .summary-card{background:var(--dark-card);border:1px solid var(--dark-border);border-radius:20px;padding:1.75rem;margin-bottom:2rem;position:relative;overflow:hidden}
        .summary-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--primary-gradient)}
        .summary-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem;flex-wrap:wrap;gap:1rem}
        .summary-title{font-size:1.1rem;font-weight:600;display:flex;align-items:center;gap:0.5rem}
        .summary-text{color:var(--text-secondary);line-height:1.7;font-size:0.95rem}
        .action-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem;padding:1rem;background:var(--dark-card);border-radius:14px;border:1px solid var(--dark-border)}
        .toolbar-left{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
        .toolbar-stats{display:flex;gap:1.5rem}
        .stat-item{text-align:center}
        .stat-value{font-size:1.25rem;font-weight:700}
        .stat-value.todo{color:var(--text-secondary)}
        .stat-value.progress{color:var(--warning)}
        .stat-value.done{color:var(--success)}
        .stat-label{font-size:0.7rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:0.5px}
        .toolbar-right{display:flex;gap:0.5rem;flex-wrap:wrap}
        .toolbar-btn{padding:0.6rem 1rem;border-radius:8px;font-family:'Outfit',sans-serif;font-size:0.85rem;font-weight:500;cursor:pointer;transition:all 0.3s ease;display:flex;align-items:center;gap:0.5rem;border:none}
        .toolbar-btn.info{background:rgba(69,183,209,0.2);border:1px solid rgba(69,183,209,0.3);color:var(--info);width:36px;height:36px;padding:0;justify-content:center;border-radius:50%}
        .toolbar-btn.info:hover{background:rgba(69,183,209,0.3);transform:scale(1.1)}
        .action-card{background:var(--dark-card);border:1px solid var(--dark-border);border-radius:18px;padding:1.75rem;margin-bottom:1.25rem;transition:all 0.3s ease}
        .action-card:hover{border-color:rgba(124,58,237,0.5)}
        .action-card-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:1rem;flex-wrap:wrap;gap:0.5rem}
        .action-card-meta{display:flex;align-items:center;gap:0.75rem;flex-wrap:wrap}
        .action-category{padding:0.3rem 0.7rem;background:var(--dark-border);border-radius:6px;font-size:0.7rem;font-weight:500;text-transform:uppercase;letter-spacing:1px}
        .action-priority{padding:0.3rem 0.7rem;border-radius:6px;font-size:0.7rem;font-weight:600;text-transform:uppercase;letter-spacing:1px}
        .action-priority.high{background:rgba(124,58,237,0.2);color:var(--accent-primary)}
        .action-priority.medium{background:rgba(255,230,109,0.2);color:var(--warning)}
        .action-timeframe{font-size:0.8rem;color:var(--text-secondary);display:flex;align-items:center;gap:0.5rem}
        .action-title{font-size:1.25rem;font-weight:600;margin-bottom:0.5rem}
        .action-description{color:var(--text-secondary);line-height:1.6;margin-bottom:1.25rem;font-size:0.95rem}
        .action-list{display:flex;flex-direction:column;gap:0.75rem}
        .action-item{display:flex;align-items:center;gap:0.875rem;padding:1rem 1.25rem;background:var(--dark-surface);border-radius:12px;transition:all 0.3s ease;border:1px solid transparent}
        .action-item:hover{background:var(--dark-bg);border-color:var(--dark-border)}
        .action-item.in-progress{border-color:rgba(255,230,109,0.3);background:rgba(255,230,109,0.05)}
        .action-item.done{border-color:rgba(78,205,196,0.3);background:rgba(78,205,196,0.05)}
        .action-item.done .action-item-text{text-decoration:line-through;opacity:0.7}
        .action-number{width:28px;height:28px;background:var(--dark-border);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:0.8rem;font-weight:600;flex-shrink:0}
        .action-item.in-progress .action-number{background:var(--warning);color:var(--dark-bg)}
        .action-item.done .action-number{background:var(--success);color:var(--dark-bg)}
        .action-status{position:relative}
        .status-btn{width:32px;height:32px;border-radius:8px;border:2px solid var(--dark-border);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:0.9rem;transition:all 0.3s ease;color:var(--text-secondary)}
        .status-btn:hover{border-color:var(--accent-primary)}
        .status-btn.todo{border-color:var(--dark-border);color:var(--text-secondary)}
        .status-btn.in-progress{border-color:var(--warning);background:var(--warning);color:var(--dark-bg)}
        .status-btn.done{border-color:var(--success);background:var(--success);color:var(--dark-bg)}
        .status-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:0.5rem;background:var(--dark-surface);border:1px solid var(--dark-border);border-radius:10px;padding:0.4rem;min-width:130px;display:none;z-index:50;box-shadow:0 10px 30px rgba(0,0,0,0.3)}
        .status-menu.visible{display:block}
        .status-option{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.75rem;border-radius:6px;cursor:pointer;transition:all 0.2s ease;font-size:0.85rem}
        .status-option:hover{background:var(--dark-card)}
        .status-option.todo{color:var(--text-secondary)}
        .status-option.in-progress{color:var(--warning)}
        .status-option.done{color:var(--success)}
        .action-item-text{flex:1;font-size:0.9rem}
        .action-item-link{padding:0.5rem 1rem;background:var(--primary-gradient);border:none;border-radius:8px;color:white;font-family:'Outfit',sans-serif;font-size:0.8rem;font-weight:500;cursor:pointer;text-decoration:none;transition:all 0.3s ease;flex-shrink:0}
        .action-item-link:hover{transform:translateY(-2px);box-shadow:0 4px 15px rgba(124,58,237,0.3)}
        .results-footer{text-align:center;padding:2.5rem 0 1rem;margin-top:1.5rem;border-top:1px solid var(--dark-border)}
        .results-footer p{color:var(--text-secondary);margin-bottom:1.25rem}
        .dashboard-btn{display:inline-flex;align-items:center;gap:0.75rem;padding:1rem 2.5rem;background:var(--primary-gradient);border:none;border-radius:50px;color:white;font-family:'Outfit',sans-serif;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all 0.3s ease;box-shadow:0 4px 20px rgba(124,58,237,0.3)}
        .dashboard-btn:hover{transform:translateY(-2px);box-shadow:0 6px 30px rgba(124,58,237,0.4)}
        .restart-btn{display:inline-flex;align-items:center;gap:0.5rem;padding:0.875rem 1.75rem;background:transparent;border:1px solid var(--dark-border);border-radius:10px;color:var(--text-primary);font-family:'Outfit',sans-serif;font-size:0.95rem;cursor:pointer;transition:all 0.3s ease;margin-top:1rem}
        .restart-btn:hover{border-color:var(--accent-primary);color:var(--accent-primary)}

        @media(max-width:1024px){.sidebar{display:none}.content-wrapper{margin-left:0}.progress-bar-container{left:0}}
        @media(max-width:768px){.welcome-title{font-size:2.2rem}.welcome-grid{grid-template-columns:repeat(2,1fr)}.content-area{padding:1.5rem}.question-text{font-size:1.15rem}.results-title{font-size:1.8rem}.interests-title{font-size:1.8rem}.interests-grid{grid-template-columns:repeat(2,1fr)}.action-item{flex-wrap:wrap}.action-item-link{width:100%;text-align:center;margin-top:0.5rem}.score-card{flex-direction:column;text-align:center}.toolbar-stats{justify-content:center}}

     /* =============================================
           ANIMATED BACKGROUND
           ============================================= */
        .hero-ring {
            position: fixed;
            width: 800px;
            height: 800px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(124, 58, 237, 0.15) 0%, transparent 70%);
            top: -400px;
            right: -400px;
            z-index: 0;
            animation: pulse-ring 8s ease-in-out infinite;
            pointer-events: none;
        }

        .hero-ring2 {
            position: fixed;
            width: 600px;
            height: 600px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(236, 72, 153, 0.1) 0%, transparent 70%);
            bottom: -300px;
            left: -300px;
            z-index: 0;
            animation: pulse-ring 10s ease-in-out infinite reverse;
            pointer-events: none;
        }

        @keyframes pulse-ring {
            0%, 100% { transform: scale(1); opacity: 0.5; }
            50% { transform: scale(1.1); opacity: 0.8; }
        }
 .hero-ring,
 .hero-ring2 {
    position: fixed;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.hero-ring {
    bottom: -200px;
    left: 20px;
    width: 500px;
    height: 500px;
    border: 2px solid rgba(139, 92, 246, 0.3);
    border-radius: 50%;
    z-index: -1;
    opacity: 0.25;
}

.hero-ring2 {
    top: -200px;
    right: -120px;
    width: 500px;
    height: 500px;
    border: 2px solid rgba(139, 92, 246, 0.3);
    border-radius: 50%;
    z-index: -1;
    opacity: 0.25;
}