*{box-sizing:border-box;margin:0;padding:0}:root,[data-theme=green]{--primary:#2e211c;--primary-light:#984619;--bg-gradient:#eae0c7;--nav-bg:#2e211c;--card-bg:#fff;--item-bg:#eae0c7;--item-border:#c06226;--section-bg:linear-gradient(135deg, #eae0c7 0%, #2e211c 90%);--level-group-bg:#fff;--text-primary:#2e211c;--text-muted:#984619;--text-on-nav:#eae0c7;--btn-bg:#c06226;--btn-color:#fff;--nav-text:#eae0c7;--underline:#c06226}[data-theme=purple]{--primary:#022e4c;--primary-light:#517493;--bg-gradient:#e2d9cb;--nav-bg:#022e4c;--card-bg:#fff;--item-bg:#e2d9cb;--item-border:#517493;--section-bg:linear-gradient(135deg, snow 0%, #517493 100%);--level-group-bg:#fff;--text-primary:#022e4c;--text-muted:#517493;--text-on-nav:#e2d9cb;--btn-bg:#56061d;--btn-color:#fff;--nav-text:#e2d9cb;--underline:#56061d}[data-theme=sage]{--primary:#2f332b;--primary-light:#818875;--bg-gradient:linear-gradient(135deg, #dcddd2 0%, #b2b2a1 100%);--nav-bg:#2f332b;--card-bg:#fff;--item-bg:#dcddd2;--item-border:#b2b2a1;--section-bg:#dcddd2;--level-group-bg:#eaeae0;--text-primary:#2f332b;--text-muted:#818875;--text-on-nav:#dcddd2;--btn-bg:#2f332b;--btn-color:#dcddd2;--nav-text:#dcddd2;--underline:#818875}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#333;background-color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.6}#root{min-height:100vh}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}button{cursor:pointer;border:none;outline:none;font-family:inherit}input,select{font-family:inherit}ul,ol{list-style:none}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}*,:before,:after{box-sizing:border-box}html,body{max-width:100%;margin:0;padding:0;overflow-x:hidden}#root{width:100%;overflow-x:hidden}.home-container{background:var(--bg-gradient);width:100%;min-height:calc(100vh - 60px);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;transition:background .4s}.content{flex-direction:column;gap:20px;padding:20px;display:flex}.main-content{background:var(--card-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;flex-direction:column;gap:20px;padding:20px;transition:background .4s;display:flex;box-shadow:0 8px 32px #0000001a}.left-section{flex-direction:column;gap:20px;display:flex}.right-section{flex:1}.skills-section h2,.levels-section h2{color:var(--text-primary);margin:0 0 12px;font-size:1.1rem;font-weight:600;transition:color .4s}.skills-row{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;align-items:center;gap:8px;padding-bottom:4px;display:flex;overflow-x:auto}.skills-row::-webkit-scrollbar{display:none}.skill-item{background:var(--item-bg);border:1px solid var(--item-border);white-space:nowrap;scroll-snap-align:start;cursor:pointer;border-radius:8px;flex-shrink:0;align-items:center;gap:6px;padding:6px 12px;font-size:.78rem;transition:all .2s;display:flex}.skill-item:hover{background:var(--primary-light);color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px #0003}.skill-item input[type=checkbox]{cursor:pointer;width:14px;height:14px;accent-color:var(--primary);flex-shrink:0}.skill-item label{cursor:pointer;color:inherit;-webkit-user-select:none;user-select:none;font-weight:500}.levels-row{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;align-items:center;gap:8px;padding-bottom:4px;display:flex;overflow-x:auto}.levels-row::-webkit-scrollbar{display:none}.level-item{background:var(--item-bg);border:1px solid var(--item-border);white-space:nowrap;scroll-snap-align:start;cursor:pointer;border-radius:8px;flex-shrink:0;align-items:center;gap:6px;padding:6px 12px;font-size:.78rem;transition:all .2s;display:flex}.level-item:hover{background:var(--primary-light);color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px #0003}.level-item input[type=checkbox]{cursor:pointer;width:14px;height:14px;accent-color:var(--primary);flex-shrink:0}.level-item label{cursor:pointer;color:inherit;-webkit-user-select:none;user-select:none;font-weight:500}.skill-sections{background:var(--card-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:20px;transition:background .4s;box-shadow:0 8px 32px #0000001a}.skill-sections h2{color:var(--text-primary);text-align:center;margin:0 0 20px;padding-bottom:10px;font-size:1.2rem;font-weight:600;position:relative}.skill-sections h2:after{content:"";background:var(--underline);border-radius:2px;width:60px;height:2px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.sections-container{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:15px;display:grid}.skill-section{background:var(--section-bg);border:2px solid var(--item-border);color:var(--text-primary);border-radius:12px;padding:20px;transition:all .3s}.skill-section:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:0 8px 20px #00000026}.skill-header{margin-bottom:15px}.skill-header h3{color:var(--text-primary);margin:0;font-size:1.05rem;font-weight:600}.skill-content,.skill-details{flex-direction:column;gap:10px;display:flex}.skill-levels-list{margin:0}.skill-level-item{background:#0000000a;border:1px solid #00000014;border-radius:8px;margin-bottom:8px;padding:10px;transition:all .2s}.skill-level-item:last-child{background-color:#fff;margin-bottom:0}.skill-level-item:hover{background:#00000014;border-color:#00000026}.sublevel-name{color:var(--text-primary);font-size:.85rem;font-weight:600;display:block}.sublevel-description{color:var(--text-muted);margin:4px 0 0;font-size:.8rem;line-height:1.4}.all-levels-list h4{color:var(--text-primary);margin:0 0 12px;font-size:.9rem;font-weight:600}.level-group{background:var(--level-group-bg);border:1px solid var(--item-border);border-radius:10px;margin-bottom:12px;padding:14px;transition:all .2s}.level-group:hover{border-color:var(--primary)}.level-title{color:var(--text-primary);align-items:center;gap:8px;margin:0 0 10px;font-size:.95rem;font-weight:600;display:flex}.level-title:before{content:"";background:var(--primary);border-radius:50%;flex-shrink:0;width:7px;height:7px}.level-group .skill-level-item{background:var(--card-bg);border-color:var(--item-border)}.loading-container{flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:40vh;display:flex}.loading-spinner{border:4px solid var(--item-border);border-top:4px solid var(--primary);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-container p{color:#fff;margin:0;font-size:1rem;font-weight:500}.error-container{flex-direction:column;align-items:center;gap:10px;display:flex}.error-message{color:var(--accent);text-align:center;background:#b8860b1a;border:1px solid #b8860b4d;border-radius:8px;width:100%;max-width:600px;padding:12px 20px;font-size:.9rem;font-weight:500;line-height:1.4}.retry-button{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:8px 16px;font-size:.9rem;font-weight:600;transition:all .2s}.retry-button:hover:not(:disabled){background:var(--primary-light);transform:translateY(-1px)}.retry-button:disabled{cursor:not-allowed;background:#ccc}.popup-overlay{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.popup-modal{background:#fff;border-radius:12px;width:100%;max-width:400px;animation:.25s ease-out popupSlideIn;overflow:hidden;box-shadow:0 20px 60px #0000004d}@keyframes popupSlideIn{0%{opacity:0;transform:scale(.92)translateY(-16px)}to{opacity:1;transform:scale(1)translateY(0)}}.popup-header{background:var(--primary);color:#fff;text-align:center;padding:16px 20px}.popup-header h3{margin:0;font-size:1.05rem;font-weight:600}.popup-content{text-align:center;padding:20px}.popup-content p{color:#333;margin:0;font-size:.95rem;line-height:1.5}.popup-actions{justify-content:center;padding:0 20px 20px;display:flex}.popup-ok-btn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:8px;min-width:80px;padding:10px 28px;font-size:.95rem;font-weight:600;transition:all .2s}.popup-ok-btn:hover{background:var(--primary-light);transform:translateY(-1px)}.popup-ok-btn:active{transform:translateY(0)}.skill-description{color:var(--text-muted);margin:4px 0 0;font-size:.8rem;line-height:1.3}.theme-switcher{align-items:center;gap:8px;display:flex}.theme-dot{cursor:pointer;border:2px solid #0000;border-radius:50%;flex-shrink:0;width:22px;height:22px;transition:all .2s}.theme-dot:hover{transform:scale(1.2)}.theme-dot.active{border-color:#fff;transform:scale(1.15);box-shadow:0 0 0 2px #00000040}.theme-dot-green{background:linear-gradient(135deg,#2e211c,#c06226)}.theme-dot-purple{background:linear-gradient(135deg,#022e4c,#56061d)}.theme-dot-sage{background:linear-gradient(135deg,#dcddd2,#2f332b)}.nav-user-mobile{cursor:pointer;border-radius:50%;padding:4px;transition:background .2s;display:none;position:relative}.nav-user-mobile:hover{background:#0000000f}.nav-tooltip{background:var(--primary);color:#fff;white-space:nowrap;z-index:100;border-radius:6px;padding:6px 10px;font-size:.75rem;display:none;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 4px 12px #00000026}.nav-tooltip:before{content:"";border-left:5px solid #0000;border-right:5px solid #0000;border-bottom:5px solid var(--primary);position:absolute;top:-5px;right:10px}.nav-user-mobile:hover .nav-tooltip{display:block}.nav-logout-mobile{cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px;line-height:0;transition:background .2s;display:none}.nav-logout-mobile:hover{background:#b8860b1a}@media (width<=1024px){.nav-email-desktop,.nav-logout-desktop{display:none!important}.nav-user-mobile,.nav-logout-mobile{justify-content:center;align-items:center;display:flex}}@media (width<=768px){.content{gap:12px;padding:12px}.main-content{gap:16px;padding:16px}.skills-section h2,.levels-section h2{font-size:1rem}.sections-container{grid-template-columns:1fr}.skill-section,.skill-sections{padding:14px}.level-group{padding:12px}.level-title{font-size:.9rem}}@media (width<=480px){.content{gap:10px;padding:8px}.main-content{border-radius:10px;gap:14px;padding:12px}.skills-row,.levels-row{gap:6px}.skill-item,.level-item{padding:5px 9px;font-size:.75rem}.skill-item input[type=checkbox],.level-item input[type=checkbox]{width:12px;height:12px}.skill-sections{border-radius:10px;padding:12px}.sections-container{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;gap:12px;padding-bottom:8px;display:flex;overflow-x:auto}.sections-container::-webkit-scrollbar{display:none}.skill-section{scroll-snap-align:start;flex:0 0 85vw;min-width:0;padding:12px}.skill-level-item{padding:8px}.sublevel-name{font-size:.8rem}.sublevel-description{font-size:.75rem}.level-group{margin-bottom:10px;padding:10px}.level-title{font-size:.85rem}.loading-container{min-height:30vh}.loading-spinner{border-width:3px;width:32px;height:32px}.popup-content{padding:16px}.popup-actions{padding:0 16px 16px}}@media (width<=360px){.content{padding:6px}.main-content{padding:10px}.skill-item,.level-item{padding:4px 8px;font-size:.72rem}.skill-sections,.skill-section{padding:10px}}.level-group-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.take-test-btn{background:var(--btn-bg,#b8860b);color:var(--btn-color,#fff);cursor:pointer;white-space:nowrap;border:none;border-radius:6px;padding:5px 14px;font-size:.78rem;font-weight:600;transition:opacity .2s}.take-test-btn:hover{opacity:.85}.skill-group-inline{flex-shrink:0;align-items:center;gap:8px;display:flex}.group-divider-vertical{background:var(--item-border);opacity:1;border-radius:2px;flex-shrink:0;width:3px;height:36px;margin:0 10px}.take-test-buttons{flex-wrap:wrap;gap:6px;display:flex}.login-container{background:linear-gradient(135deg,#2d5a27 0%,#8b9a6b 50%,beige 100%);justify-content:center;align-items:center;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex;position:relative}.login-container:before{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);background:linear-gradient(45deg,#2d5a271a 0%,#8b9a6b33 25%,#f5f5dc1a 50%,#b8860b33 75%,#2d5a271a 100%);position:absolute;inset:0}.login-left{display:none}.login-right{z-index:1;justify-content:center;align-items:center;padding:40px;display:flex}.login-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#f5f5dcf2;border:1px solid #8b9a6b4d;border-radius:20px;width:100%;max-width:380px;padding:40px 35px;box-shadow:0 20px 40px #2d5a274d}.login-card h1{color:#2d5a27;text-align:center;letter-spacing:-.5px;margin:0 0 30px;font-size:2.2rem;font-weight:700}.login-form{flex-direction:column;gap:20px;display:flex}.form-group{flex-direction:column;gap:8px;display:flex}.input-wrapper{align-items:center;display:flex;position:relative}.input-icon{color:#8b9a6b;z-index:1;font-size:1.1rem;position:absolute;left:15px}.form-group input{color:#2d5a27;box-sizing:border-box;background:#ffffffe6;border:2px solid #e6d7a3;border-radius:12px;width:100%;padding:15px 15px 15px 45px;font-size:1rem;transition:all .3s}.form-group input:focus{background:#fff;border-color:#2d5a27;outline:none;box-shadow:0 0 0 3px #2d5a271a}.form-group input.error{border-color:#b8860b;box-shadow:0 0 0 3px #b8860b33}.form-group input:disabled{cursor:not-allowed;opacity:.7;background:#f0f0f0cc}.form-group input::placeholder{color:#8b9a6b}.error-message{color:#b8860b;margin-left:15px;font-size:.875rem;font-weight:500}.remember-me{align-items:center;gap:8px;margin:10px 0;display:flex}.remember-me input[type=checkbox]{accent-color:#2d5a27;width:16px;height:16px}.remember-me label{color:#2d5a27;cursor:pointer;font-size:.9rem;font-weight:500}.login-button{color:#fff;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;background:linear-gradient(135deg,#b8860b 0%,#daa520 100%);border:none;border-radius:12px;margin-top:10px;padding:15px 24px;font-size:1rem;font-weight:700;transition:all .3s}.login-button:hover:not(:disabled){background:linear-gradient(135deg,#daa520 0%,#b8860b 100%);transform:translateY(-2px);box-shadow:0 8px 25px #b8860b66}.login-button:active:not(:disabled){transform:translateY(0)}.login-button:disabled{cursor:not-allowed;opacity:.7;transform:none}.login-footer{text-align:center;border-top:1px solid #8b9a6b4d;margin-top:25px;padding-top:20px}.login-footer p{color:#8b9a6b;margin:0;font-size:.9rem}.login-footer a{color:#2d5a27;font-weight:600;text-decoration:none;transition:color .2s}.login-footer a:hover{color:#b8860b;text-decoration:underline}@media (width<=768px){.login-container{flex-direction:column}.login-left{flex:0 0 200px}.login-right{flex:1;padding:30px 20px}.login-card{padding:30px 25px}}@media (width<=480px){.login-left{display:none}.login-right{background:linear-gradient(135deg,#2d5a27 0%,#8b9a6b 100%);flex:1;padding:20px}.login-card{border-radius:15px;padding:25px 20px}.login-card h1{font-size:1.8rem}.form-group input{padding:12px 12px 12px 40px;font-size:.95rem}.login-button{padding:12px 20px;font-size:.95rem}}.domain-info{background:#2d5a271a;border:1px solid #2d5a2733;border-radius:8px;margin-bottom:10px;padding:12px 16px}.domain-info p{color:#2d5a27;text-align:center;margin:0;font-size:.85rem;font-weight:500}.form-group input[type=email]:valid{border-color:#2d5a27}.form-group input[type=email]:invalid:not(:placeholder-shown){border-color:#b8860b}@media (width<=480px){.domain-info{padding:10px 12px}.domain-info p{font-size:.8rem}}.otp-info{text-align:center;margin-bottom:20px}.otp-info p{color:#2d5a27;margin:5px 0;font-size:.9rem}.email-display{font-weight:600;color:#b8860b!important}.otp-container{justify-content:center;gap:10px;margin:20px 0;display:flex}.otp-input{text-align:center;color:#2d5a27;background:#ffffffe6;border:2px solid #e6d7a3;border-radius:8px;width:45px;height:45px;font-size:1.2rem;font-weight:600;transition:all .3s}.otp-input:focus{background:#fff;border-color:#2d5a27;outline:none;box-shadow:0 0 0 3px #2d5a271a}.otp-input:disabled{cursor:not-allowed;opacity:.7;background:#f0f0f0cc}.otp-actions{flex-direction:column;gap:10px;margin-top:20px;display:flex}.back-button{color:#8b9a6b;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;background:0 0;border:2px solid #8b9a6b;border-radius:12px;padding:12px 24px;font-size:.9rem;font-weight:600;transition:all .3s}.back-button:hover:not(:disabled){color:#fff;background:#8b9a6b;transform:translateY(-1px)}.back-button:disabled{cursor:not-allowed;opacity:.5;transform:none}@media (width<=480px){.otp-container{gap:8px}.otp-input{width:40px;height:40px;font-size:1.1rem}.otp-info p{font-size:.85rem}.back-button{padding:10px 20px;font-size:.85rem}}.otp-hint{text-align:center;color:#2d5a27;margin:0;font-size:.85rem}