.navbar{display:flex;justify-content:space-between;align-items:center;color:var(--text-color-primary);padding:12px 24px;box-shadow:0 2px 6px var(--shadow-color);position:relative;min-height:64px;background:var(--nav-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;position:fixed;width:100%;top:0;transition:background .5s,color .5s,box-shadow .5s}.logo{font-weight:700;letter-spacing:1px}.nav-links{display:flex;gap:12px;align-items:center}.hamburger-btn{display:none;background:none;border:none;color:var(--text-color-secondary);font-size:1.4rem;cursor:pointer;z-index:101}.mobile-menu{position:fixed;top:0;right:-320px;width:260px;height:100vh;background:var(--nav-bg);box-shadow:-2px 0 12px var(--shadow-color);transition:right .3s cubic-bezier(.4,0,.2,1);z-index:9999;display:flex;flex-direction:column;padding:32px 18px 18px}.mobile-menu.open{right:0}.close-btn{background:none;border:none;color:var(--text-color-secondary);font-size:1.2rem;align-self:flex-end;margin-bottom:18px;margin-right:18px;cursor:pointer}.mobile-menu.open .nav-item{opacity:1;transform:translate(0);transition:opacity .4s,transform .4s}.mobile-menu .nav-item{opacity:0;transform:translate(40px);transition:opacity .4s,transform .4s}.mobile-menu.open .nav-item:nth-child(1){transition-delay:.05s}.mobile-menu.open .nav-item:nth-child(2){transition-delay:.12s}.mobile-menu.open .nav-item:nth-child(3){transition-delay:.19s}.mobile-menu.open .nav-item:nth-child(4){transition-delay:.26s}.mobile-menu.open .nav-item:nth-child(5){transition-delay:.33s}.mobile-nav-links{display:flex;flex-direction:column;gap:32px}.mobile-nav-links .nav-item{font-size:1.18rem;padding:16px 12px}.mobile-nav-links .nav-item:first-child{margin-top:32px}.nav-item{background:transparent;border:none;color:var(--text-color-secondary);padding:8px 12px;border-radius:8px;cursor:pointer;transition:background .4s,color .4s}.nav-item:hover{background:#ffffff08}.nav-item.active{background:var(--nav-item-active-bg);color:var(--nav-item-active-color);font-weight:400}.theme-toggle-btn{background:var(--panel-bg);border-radius:50%;padding:10px;display:flex;align-items:center;gap:8px;color:var(--text-color-primary)}.theme-toggle-btn:hover{background:var(--panel-bg);opacity:.8}.theme-toggle-btn .button-text{display:none}.theme-toggle-btn.mobile{padding:16px 12px;justify-content:center;font-size:1.18rem;border:none;background:var(--text-color);color:var(--text-color-secondary);transform:translate(0)!important;opacity:1!important}.theme-toggle-btn.mobile .button-text{display:inline}@media(min-width:801px){.theme-toggle-btn{padding:8px;width:38px;height:38px;justify-content:center}}@media(max-width:800px){.nav-links{display:none}.hamburger-btn{display:block}}.manual-btn{padding:6px 10px;border-radius:8px;border:none;color:#fff;font-size:14px;cursor:pointer;transition:background .2s,transform .1s;background:var(--btn-primary)}.manual-btn:hover{background:#0056b3;color:#fff;transform:scale(1.05);box-shadow:0 6px 16px #00000040}.manual-btn:active{transform:scale(.98)}.manual-btn:hover:not(:disabled){background:#0056b3}.manual-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;display:flex;justify-content:center;align-items:center;z-index:2000;opacity:0;pointer-events:none;transition:opacity .3s ease}.manual-modal-overlay.fade-in{opacity:1;pointer-events:auto}.manual-modal-overlay.fade-out{opacity:0;pointer-events:none}.manual-modal{background:var(--panel-bg);color:var(--input-text);padding:20px;border-radius:12px;max-width:400px;width:90%;box-shadow:0 4px 20px #0000004d;position:relative;transform:translateY(-20px);transition:transform .3s ease;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-weight:500;font-size:.95rem;text-align:left}.manual-modal-overlay.fade-in .manual-modal{transform:translateY(0)}.manual-modal-overlay.fade-out .manual-modal{transform:translateY(-20px)}.manual-modal h3{margin-top:0;margin-bottom:12px;color:var(--input-text);font-weight:600;font-size:1.1rem}.manual-modal .close-btn{position:absolute;top:8px;right:12px;background:transparent;border:none;font-size:1.5rem;font-weight:600;cursor:pointer;color:var(--input-text)}.manual-modal .close-btn:hover{color:var(--btn-danger)}.manual-modal ul{padding-left:20px;margin-top:10px;color:var(--input-text);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-weight:500;font-size:.95rem}.close-popup{position:absolute;top:12px;right:12px;border:none;background:transparent;font-size:1.2rem;cursor:pointer}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.courses-section{padding:20px;color:var(--text-color-primary);transition:color .5s}.course-input-group{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}.course-input{padding:8px;border-radius:6px;box-sizing:border-box;min-width:160px;background:var(--input-bg);color:var(--input-text);border:1px solid var(--input-border);transition:background .5s,color .5s,border-color .5s}.course-add-btn{padding:8px 12px;border-radius:8px;border:none;color:#fff;cursor:pointer;background:var(--btn-primary);transition:background .5s}.course-description,.no-material-text{margin:6px 0 0;color:var(--text-color-secondary);word-break:break-word;transition:color .5s}.no-material-text{margin:0;font-size:.9em}.small-btn.secondary{background:var(--panel-bg);color:var(--text-color-primary);border:1px solid var(--text-color-secondary)}.small-btn.secondary:hover{background:var(--chat-ai-bg)}.timer-wrapper{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-color-primary);text-align:center;transition:color .5s}.focus-title{font-size:1.2rem;font-weight:600;letter-spacing:2px;margin-bottom:1.5rem}.circle-wrapper{margin-top:50px;position:relative;display:inline-block;border-radius:100%;box-shadow:10px 10px 30px var(--shadow-color),-10px -10px 20px #ffffff17}.progress-ring__background{fill:none;stroke:var(--chat-ai-bg);stroke-width:10;transition:stroke .5s}.progress-ring__circle{fill:none;stroke:url(#gradient);stroke-width:10;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%;stroke-dasharray:722.568;transition:stroke-dashoffset .5s ease}.progress-ring{position:relative}.progress-ring defs linearGradient stop:last-child{stop-color:#33e60f}.progress-ring defs linearGradient stop:nth-child(1){stop-color:#13bee95e}.time-text{position:absolute;top:50%;left:50%;transform:translate(-48%,-60%);font-size:3rem;font-weight:700;letter-spacing:4px;text-shadow:10px 1px 10px var(--shadow-color),-10px -5px 10px rgba(255,255,255,.041)}.button-group{display:flex;justify-content:center;gap:1rem;margin-top:1.5rem}.btn{padding:.8rem;border:none;border-radius:30px;font-weight:500;cursor:pointer;font-size:1rem;transition:.2s;margin:10px}.btn.start{box-shadow:10px 10px 30px var(--shadow-color),-10px -10px 20px #ffffff0d;background-color:#26b426;color:#fff}.btn.pause{box-shadow:10px 10px 30px var(--shadow-color),-10px -10px 20px #ffffff0d;background-color:#727272;color:#fff}.btn.end{box-shadow:10px 10px 30px var(--shadow-color),-10px -10px 20px #ffffff0d;background-color:#b81414;color:#fff}.btn.start:hover{background-color:#1d8d1d;transform:scale(.95)}.btn.pause:hover{background-color:#686868;transform:scale(.95)}.btn.end:hover{background-color:#991010;transform:scale(.95)}.next-break{color:var(--text-color-secondary);margin-top:1.2rem;font-size:1.1rem;transition:color .5s}.timer-settings{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px;justify-content:center}.timer-setting{display:flex;flex-direction:column;gap:4px;margin-top:60px}.timer-setting label{color:var(--text-color-secondary);font-size:14px;transition:color .5s}.timer-setting input{padding:6px 10px;border-radius:8px;border:none;background:var(--input-bg);color:var(--input-text);width:80px;text-align:center;font-size:14px;transition:background .5s,color .5s}.timer-setting .number-wrapper{position:relative;display:inline;padding:20px;border-radius:20px;width:100px;text-align:center}.timer-setting .focus-input{width:50px;padding:8px;border-radius:12px;background-color:var(--input-bg);color:var(--input-text);outline:none;font-size:14px;text-align:center;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;box-shadow:inset 0 0 15px var(--shadow-color);-moz-appearance:textfield}.timer-setting .focus-input::-webkit-inner-spin-button,.timer-setting .focus-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.timer-setting .spinner-buttons{position:absolute;right:5px;top:5px;bottom:5px;display:flex;flex-direction:column;justify-content:center}.timer-setting .spin-btn{background:transparent;border:none;color:var(--text-color-secondary);width:15px;height:20px;font-size:12px;line-height:10px;cursor:pointer;border-radius:4px;padding:0;transition:.15s}.timer-setting .spin-btn:hover{background:var(--panel-bg);opacity:.8}.timer-setting .spin-btn:active{background:var(--panel-bg)}.timer-topic-select-group,.timer-topic-add-group{margin-bottom:12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;width:100%;max-width:400px}.timer-topic-select-group label{color:var(--text-color-secondary);font-size:14px;flex-basis:100%}.timer-topic-select-group select,.timer-topic-add-group .new-topic-input{padding:6px 10px;border-radius:8px;border:1px solid var(--input-border);background:var(--input-bg);color:var(--input-text);cursor:pointer;font-size:14px;transition:background .5s,color .5s,border-color .5s}.timer-topic-select-group select{flex-grow:1}.timer-topic-add-group .new-topic-input{flex-grow:1;border:1px solid var(--input-border);background:var(--input-bg)}.timer-topic-select-group select:disabled,.timer-topic-add-group .new-topic-input:disabled{background:var(--chat-ai-bg);cursor:not-allowed;color:var(--text-color-secondary)}.remove-topic-btn,.add-topic-btn{padding:6px 10px;border-radius:8px;border:none;color:#fff;font-size:14px;cursor:pointer;transition:background .2s,transform .1s}.remove-topic-btn{background:var(--btn-danger)}.remove-topic-btn:hover:not(:disabled){background:#c53030}.add-topic-btn{background:var(--btn-primary)}.add-topic-btn:hover:not(:disabled){background:#0056b3}.remove-topic-btn:disabled,.add-topic-btn:disabled{opacity:.5;cursor:not-allowed}.tippek-btn{padding:6px 10px;border-radius:8px;border:none;color:#fff;font-size:14px;cursor:pointer;transition:background .2s,transform .1s;background:var(--btn-primary)}.tippek-btn:hover{background:#0056b3;color:#fff;transform:scale(1.05);box-shadow:0 6px 16px #00000040}.tippek-btn:active{transform:scale(.98)}.tippek-btn:hover:not(:disabled){background:#0056b3}.tips-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;display:flex;justify-content:center;align-items:center;z-index:2000;opacity:0;pointer-events:none;transition:opacity .3s ease}.tips-modal-overlay.fade-in{opacity:1;pointer-events:auto}.tips-modal-overlay.fade-out{opacity:0;pointer-events:none}.tips-modal{background:var(--panel-bg);color:var(--input-text);padding:20px;border-radius:12px;max-width:400px;width:90%;box-shadow:0 4px 20px #0000004d;position:relative;transform:translateY(-20px);transition:transform .3s ease;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-weight:500;font-size:.95rem;text-align:left}.tips-modal-overlay.fade-in .tips-modal{transform:translateY(0)}.tips-modal-overlay.fade-out .tips-modal{transform:translateY(-20px)}.tips-modal h3{margin-top:0;margin-bottom:12px;color:var(--input-text);font-weight:600;font-size:1.1rem}.tips-modal .close-btn{position:absolute;top:8px;right:12px;background:transparent;border:none;font-size:1.5rem;font-weight:600;cursor:pointer;color:var(--input-text)}.tips-modal .close-btn:hover{color:var(--btn-danger)}.tips-modal ul{padding-left:20px;margin-top:10px;color:var(--input-text);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-weight:500;font-size:.95rem}.chat-wrapper{background-color:var(--panel-bg);width:100%;height:100%;min-height:70vh;display:flex;flex-direction:column;align-items:stretch;justify-content:center;color:var(--text-color-primary);text-align:left;padding:2rem;box-sizing:border-box;border-radius:12px;transition:background-color .5s,color .5s}.chat-title{font-size:1.2rem;font-weight:700;letter-spacing:3px;width:100%;text-align:center;margin-bottom:2rem}.chat-box{width:100%;max-width:none;height:100%;overflow-y:auto;background-color:var(--chat-box-bg);border-radius:12px;padding:2rem;margin-bottom:2rem;display:flex;flex-direction:column;gap:.6rem;box-sizing:border-box;scrollbar-width:thin;scrollbar-color:var(--text-color-secondary) transparent;scroll-snap-stop:always;transition:background-color .5s}.chat-message{padding:.6rem 1rem;border-radius:12px;max-width:85%;word-wrap:break-word;transition:background-color .5s,color .5s}.chat-message.ai{align-self:flex-start;background-color:var(--chat-ai-bg);color:var(--chat-ai-text)}.chat-message.user{align-self:flex-end;background-color:var(--chat-user-bg);color:var(--chat-user-text)}.chat-input-group{display:flex;gap:1rem;width:100%;max-width:none;align-items:center}.chat-input-group input{flex:1;padding:.6rem 1rem;border-radius:12px;font-size:1rem;box-sizing:border-box}.chat-input-group button{padding:10px;border:solid 1px var(--input-border);border-radius:15px;cursor:pointer;font-size:16px;background-color:#fff0;color:var(--input-border);transition:.1s}.chat-input-group button:hover{transform:scale(1.05)}@media(max-width:960px){.chat-box{height:320px}}.send-btn{display:flex;align-items:center;justify-content:center}.chat-input{width:100%;padding:10px 16px;border-radius:20px;border:solid 1px var(--input-border);font-size:16px;outline:none;background:var(--input-bg);transition:border-color .2s,background .2s;color:var(--input-text)}.chat-input:focus{border-color:var(--btn-primary);background:var(--input-bg)}.chat-input::placeholder{color:var(--text-color-secondary);opacity:.6}.chat-model-selector{margin-bottom:10px;display:inline-flex;align-items:center;gap:10px;justify-content:space-between}.chat-model-selector select{padding:4px 8px;border-radius:20px;background-color:var(--panel-bg);color:var(--text-color-primary);border:solid 1px var(--input-border);transition:border-color .2s,background-color .5s}.chat-model-selector select:hover{border-color:var(--btn-primary);transition:.2s}.left-side{display:inline-flex;align-items:left;gap:10px;width:auto}.right-side{display:inline-flex;align-items:right;gap:10px;margin-left:auto}.auth-form{background:var(--panel-bg);border:1px solid var(--input-border);padding:18px;border-radius:12px;width:100%;max-width:420px;box-sizing:border-box;color:var(--text-color-primary);box-shadow:0 6px 18px var(--shadow-color);margin:0 auto;transition:background .5s,color .5s,box-shadow .5s}.auth-form h3{margin:0 0 12px;font-size:1.1rem;color:var(--text-color-primary)}.auth-form .error{background:#7f1d1d1f;color:#fecaca;border:1px solid rgba(127,29,29,.22);padding:8px 10px;border-radius:8px;margin-bottom:10px;font-size:.95rem}.light-mode .auth-form .error{color:#881c1c}.auth-form label{display:block;font-size:.85rem;color:var(--text-color-secondary);margin-top:10px;margin-bottom:6px;transition:color .5s}.auth-form input[type=email],.auth-form input[type=password],.auth-form input[type=text]{display:block;width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--input-border);background:var(--input-bg);color:var(--input-text);box-sizing:border-box;font-size:.95rem;outline:none;transition:box-shadow .12s ease,border-color .12s ease,background .5s,color .5s}.auth-form input:focus{border-color:var(--btn-primary);box-shadow:0 0 0 1px var(--btn-primary),0 6px 18px var(--shadow-color)}.auth-form button[type=submit],.auth-action-btn{margin-top:14px;width:100%;padding:10px 12px;border-radius:10px;border:none;cursor:pointer;background:var(--btn-primary);color:#fff;font-weight:600;font-size:.98rem;transition:transform .08s ease,box-shadow .12s ease,opacity .12s ease,background .5s;box-shadow:0 8px 20px #0b7df029}.light-mode .auth-form button[type=submit],.light-mode .auth-action-btn{box-shadow:0 8px 20px #0000001a}.auth-form button[type=submit]:hover,.auth-action-btn:hover{transform:translateY(-1px);box-shadow:0 12px 28px var(--shadow-color)}.auth-form button[type=submit]:active,.auth-action-btn:active{transform:translateY(0);box-shadow:0 6px 14px var(--shadow-color)}.auth-form button[disabled]{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}.auth-form .secondary{margin-top:10px;background:transparent;color:var(--link-color);width:auto;padding:8px 10px;border-radius:8px;box-shadow:none}@media(max-width:640px){.auth-form{padding:14px;border-radius:10px;max-width:100%}.auth-form h3{font-size:1rem}}.auth-footer{margin-top:14px;display:flex;align-items:center;justify-content:center;gap:12px;color:var(--text-color-secondary);font-size:.95rem;line-height:1}.auth-footer .info-text{color:var(--text-color-secondary);opacity:.95}.auth-footer .register-btn{background:var(--btn-primary);color:#fff;border:none;padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:600;font-size:.92rem;box-shadow:0 8px 20px #0b7df024;transition:transform .08s ease,box-shadow .12s ease,opacity .12s ease,background .5s}.auth-footer .register-btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px var(--shadow-color)}.auth-footer .register-btn:active{transform:translateY(0);box-shadow:0 6px 14px var(--shadow-color)}@media(max-width:520px){.auth-footer{flex-direction:column;gap:8px}}.auth-footer .login-btn{background:transparent;color:var(--link-color);border:1px solid var(--input-border);padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:600;font-size:.92rem;transition:transform .08s ease,box-shadow .12s ease,background .12s ease,color .12s ease,border-color .5s}.auth-footer .login-btn:hover{background:transparent;color:var(--btn-primary);transform:translateY(-2px);box-shadow:0 10px 26px var(--shadow-color)}.auth-footer .login-btn:active{transform:translateY(0);box-shadow:0 6px 14px var(--shadow-color)}.profile p{color:var(--text-color-primary);margin-bottom:8px;transition:color .5s}.profile{background:var(--panel-bg);border:1px solid var(--input-border);padding:18px;border-radius:12px;width:100%;max-width:420px;box-sizing:border-box;color:var(--text-color-primary);box-shadow:0 6px 18px var(--shadow-color);margin:0 auto;transition:background .5s,color .5s,box-shadow .5s;text-align:center}.profile-header{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:10px}.profile-header h3{margin:0;font-size:1.1rem;color:var(--text-color-primary)}.level-pill{padding:3px 10px;border-radius:999px;font-size:.8rem;font-weight:700;background:linear-gradient(90deg,#38bdf8,#a855f7);color:#0f172a;box-shadow:0 0 12px #38bdf873}.profile-avatar{display:flex;flex-direction:column;align-items:center;margin-bottom:10px}.avatar-frame{width:110px;height:110px;border-radius:50%;padding:3px;display:flex;align-items:center;justify-content:center;margin-bottom:6px;box-sizing:border-box}.avatar-frame.bronze{border:3px solid #b45309;box-shadow:0 0 16px #b453098c}.avatar-frame.silver{border:3px solid #9ca3af;box-shadow:0 0 16px #9ca3af8c}.avatar-frame.gold{border:3px solid #eab308;box-shadow:0 0 18px #eab308b3}.avatar-frame.diamond{border:3px solid #95e7fa;box-shadow:0 0 20px #22c55ecc}.profile-img{width:100%;height:100%;border-radius:50%;object-fit:cover}.upload-btn{display:inline-block;background:var(--btn-primary);color:#fff;padding:6px 10px;border-radius:8px;font-size:.85rem;font-weight:600;cursor:pointer;box-shadow:0 8px 18px #2563eb59;transition:transform .08s ease,box-shadow .12s ease,background .5s}.upload-btn:hover{transform:translateY(-1px);box-shadow:0 12px 24px var(--shadow-color)}.upload-btn:active{transform:translateY(0);box-shadow:0 6px 14px var(--shadow-color)}.upload-btn input{display:none}.profile-info p{margin:2px 0;font-size:.95rem}.xp-card{margin-top:12px;padding:12px 14px;border-radius:10px;background:radial-gradient(circle at top,rgba(59,130,246,.22),transparent 60%),var(--panel-bg);border:1px solid rgba(59,130,246,.3);position:relative;overflow:hidden}.xp-card h4{font-size:1rem;margin-bottom:6px;color:var(--text-color-primary)}.xp-line{margin:3px 0;font-size:.9rem;display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center;color:var(--text-color-secondary)}.xp-value{display:inline-flex;align-items:center;justify-content:center;padding:2px 8px;border-radius:999px;background:linear-gradient(90deg,#22c55e,#a3e635);color:#052e16;font-weight:700;font-size:.8rem;box-shadow:0 0 12px #22c55e73}.xp-total{margin-top:6px;font-size:.95rem;font-weight:600;color:var(--text-color-primary)}.xp-total strong{color:#22c55e}.level-progress-text{margin-top:4px;font-size:.85rem;color:var(--text-color-secondary)}.xp-bar{margin-top:10px;width:100%;height:10px;border-radius:999px;background:#94a3b840;overflow:hidden;position:relative}.xp-bar-fill{height:100%;width:0%;border-radius:inherit;background:linear-gradient(90deg,#22c55e,#a3e635);box-shadow:0 0 16px #22c55e8c;transition:width .35s ease-out}.xp-bar-label{margin-top:4px;font-size:.8rem;color:var(--text-color-secondary)}.badges-card{margin-top:14px;padding:12px 14px;border-radius:10px;background:var(--panel-bg);border:1px solid var(--input-border);box-shadow:0 6px 16px var(--shadow-color)}.badges-card h4{font-size:1rem;margin-bottom:6px;color:var(--text-color-primary)}.no-badges{font-size:.85rem;color:var(--text-color-secondary)}.badges-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;justify-content:center}.badge{position:relative;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#0f172ab3;border:1px solid rgba(148,163,184,.5);cursor:default}.light-mode .badge{background:#f8fafcf2}.badge-icon{font-size:1rem}.badge-label{font-size:.9rem;font-weight:600;color:#e5e7eb}.light-mode .badge-label{color:#0f172a}.badge-tooltip{position:absolute;bottom:130%;left:50%;transform:translate(-50%);max-width:220px;padding:6px 8px;border-radius:8px;background:#0f172af2;color:#e5e7eb;font-size:.8rem;line-height:1.3;box-shadow:0 8px 20px #0f172ab3;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s ease,transform .15s ease,visibility .15s ease;z-index:20}.light-mode .badge-tooltip{background:#0f172a;color:#e5e7eb}.badge-tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border-width:6px;border-style:solid;border-color:rgba(15,23,42,.95) transparent transparent transparent}.light-mode .badge-tooltip:after{border-color:#0f172a transparent transparent transparent}.badge:hover .badge-tooltip{opacity:1;visibility:visible;transform:translate(-50%,-4px)}.logout-btn{margin-top:16px;width:100%;padding:10px 14px;border-radius:10px;border:none;cursor:pointer;font-weight:600;font-size:.96rem;background:var(--btn-danger);color:#fff;box-shadow:0 8px 20px var(--shadow-color);transition:transform .08s ease,box-shadow .12s ease,opacity .12s ease,background .5s}.logout-btn:hover{transform:translateY(-1px);box-shadow:0 12px 26px var(--shadow-color)}.logout-btn:active{transform:translateY(0);box-shadow:0 6px 14px var(--shadow-color)}.lifetime-xp-card{margin-top:18px;background:var(--panel-bg);padding:14px;border-radius:12px;border:1px solid var(--input-border);text-align:center;color:var(--text-color-primary);box-shadow:0 6px 18px var(--shadow-color);transition:background .5s,color .5s,box-shadow .5s}.lifetime-xp-card h4{margin-bottom:10px}.lifetime-x{font-size:1.2rem;font-weight:700}.lifetime-xp{font-size:1.1rem;font-weight:600}.lifetime-xp strong{color:#22c55e}.lifetime-desc{font-size:.9rem;opacity:.8}.level-pill.bronze{background:linear-gradient(90deg,#b45309,#d97706);color:#fff7ed;box-shadow:0 0 10px #b4530973}.level-pill.silver{background:linear-gradient(90deg,#9ca3af,#d1d5db);color:#1e293b;box-shadow:0 0 10px #9ca3af8c}.level-pill.gold{background:linear-gradient(90deg,#eab308,#facc15);color:#1f1300;box-shadow:0 0 12px #eab308b3}.level-pill.diamond{background:linear-gradient(90deg,#95e7fa,#5eead4);color:#0e1b17;box-shadow:0 0 14px #22c55ecc}.app{display:flex;flex-direction:column;min-height:100vh;background:var(--app-bg);transition:background .5s}.main-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:80px 30px 30px;flex:1;background:transparent}.main-layout:not(.homepage){display:block;padding:80px 28px 28px}.content-panel{background:var(--panel-bg);border-radius:8px;padding:24px;box-shadow:0 2px 8px var(--shadow-color);color:var(--text-color-primary);transition:background .5s,color .5s,box-shadow .5s}.main-layout:not(.homepage) .content-panel{max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box}.timer-panel{background:var(--panel-bg);border-radius:8px;padding:24px;box-shadow:0 2px 8px var(--shadow-color);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-color-primary);transition:background .5s,color .5s,box-shadow .5s}.chat-panel{display:flex;flex-direction:column;width:100%;min-height:400px;box-sizing:border-box;background:transparent}@media(max-width:960px){.main-layout{grid-template-columns:1fr;padding:80px 30px 30px}.main-layout:not(.homepage){padding-top:80px}.content-panel,.timer-panel{width:100%;margin-bottom:16px}.nav-links{flex-wrap:wrap;gap:12px}}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}:root{--app-bg: #0b1220;--text-color-primary: #ffffff;--text-color-secondary: #9ca3af;--panel-bg: #111836;--nav-bg: #111836;--chat-box-bg: #1a29429a;--chat-ai-bg: #334155;--chat-ai-text: #cbd5e1;--chat-user-bg: #00e0ff;--chat-user-text: #000000;--input-bg: #0b1220;--input-text: #ffffff;--input-border: #4a5568;--shadow-color: rgba(0, 0, 0, .4);--btn-primary: #0b7df0;--btn-danger: #7f1d1d;--nav-item-active-bg: rgba(37,99,235,.16);--nav-item-active-color: #60a5fa;--link-color: #60a5fa}.light-mode{--app-bg: #f5f7fa;--text-color-primary: #111827;--text-color-secondary: #4b5563;--panel-bg: #ffffff;--nav-bg: #ffffff;--chat-box-bg: #e5e7eb;--chat-ai-bg: #f3f4f6;--chat-ai-text: #374151;--chat-user-bg: #3b82f6;--chat-user-text: #ffffff;--input-bg: #ffffff;--input-text: #111827;--input-border: #d1d5db;--shadow-color: rgba(0, 0, 0, .1);--btn-primary: #3b82f6;--btn-danger: #ef4444;--nav-item-active-bg: rgba(30,64,175,.16);--nav-item-active-color: #3b82f6;--link-color: #3b82f6}body{font-family:Inter,Roboto,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--app-bg);color:var(--text-color-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background .5s,color .5s}
