@import"https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;900&display=swap";:root,[data-theme=light]{--bg-base: #f5f6ff;--bg-surface: #ffffff;--bg-elevated: #f8f8ff;--bg-hover: #f0f0fa;--border: #e8e8f5;--border-strong: #d0d0e8;--text-primary: #1a1a2e;--text-secondary:#4a4a6a;--text-muted: #8888aa;--text-inverse: #ffffff;--brand: #6C63FF;--brand-2: #4ECDC4;--brand-gradient:linear-gradient(135deg, #6C63FF, #4ECDC4);--success: #2DC08D;--success-bg: #E8F8F2;--warning: #FFA726;--warning-bg: #FFF5E6;--danger: #FF6B6B;--danger-bg: #FFEEEE;--info: #6C63FF;--info-bg: #EEF0FF;--shadow-sm: 0 2px 8px rgba(108,99,255,.06);--shadow-md: 0 4px 20px rgba(108,99,255,.1);--shadow-lg: 0 8px 40px rgba(108,99,255,.15);--sidebar-w: 230px;--sidebar-collapsed: 64px;--topbar-h: 60px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 9999px}[data-theme=dark]{--bg-base: #0d0b1e;--bg-surface: #13102a;--bg-elevated: #1a1635;--bg-hover: #1e1a3a;--border: #2a2550;--border-strong: #3a3565;--text-primary: #f0eeff;--text-secondary:#c0b8e8;--text-muted: #6b7aaa;--text-inverse: #1a1a2e;--brand: #8B84FF;--brand-2: #5EDDD4;--brand-gradient:linear-gradient(135deg, #8B84FF, #5EDDD4);--success: #3DD9A0;--success-bg: #0d2a1f;--warning: #FFB74D;--warning-bg: #2a1f0d;--danger: #FF8A8A;--danger-bg: #2a0d0d;--info: #8B84FF;--info-bg: #1a1635;--shadow-sm: 0 2px 8px rgba(0,0,0,.3);--shadow-md: 0 4px 20px rgba(0,0,0,.4);--shadow-lg: 0 8px 40px rgba(0,0,0,.5)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{font-family:Cairo,sans-serif;direction:rtl;background:var(--bg-base);color:var(--text-primary);min-height:100vh;transition:background .3s,color .3s;-webkit-font-smoothing:antialiased}.app-shell{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-w);background:var(--bg-surface);border-left:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;position:fixed;top:0;right:0;height:100vh;z-index:100;overflow-y:auto;overflow-x:hidden;transition:width .3s ease;box-shadow:var(--shadow-sm)}.sidebar.closed{width:var(--sidebar-collapsed)}.sidebar::-webkit-scrollbar{width:4px}.sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.sb-header{padding:16px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);flex-shrink:0}.sb-logo{display:flex;align-items:center;gap:10px;overflow:hidden}.logo-orb{width:40px;height:40px;border-radius:13px;background:var(--brand-gradient);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}.logo-orb svg{width:22px;height:22px}.logo-text{overflow:hidden}.logo-text h2{font-size:15px;font-weight:900;color:var(--text-primary);white-space:nowrap}.logo-text p{font-size:10px;color:var(--text-muted);white-space:nowrap}.sb-toggle{width:30px;height:30px;border-radius:8px;border:1px solid var(--border);background:var(--bg-elevated);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);flex-shrink:0;transition:all .2s}.sb-toggle:hover{background:var(--bg-hover);color:var(--brand)}.sb-toggle svg{width:14px;height:14px}.sb-user{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--border);background:var(--bg-elevated)}.sb-avatar{width:36px;height:36px;border-radius:12px;background:var(--brand-gradient);display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;font-weight:700;flex-shrink:0}.sb-name{display:block;font-size:12px;font-weight:700;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sb-role{display:block;font-size:10px;color:var(--text-muted)}.sb-nav{flex:1;padding:10px 8px;display:flex;flex-direction:column;gap:2px;overflow-y:auto}.sb-nav::-webkit-scrollbar{display:none}.nav-item{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:var(--radius-md);border:1px solid transparent;background:none;cursor:pointer;color:var(--text-muted);font-family:Cairo,sans-serif;font-size:12px;font-weight:600;width:100%;text-align:right;transition:all .15s;white-space:nowrap;overflow:hidden}.nav-item:hover{background:var(--bg-hover);color:var(--text-secondary)}.nav-item.active{background:color-mix(in srgb,var(--brand) 12%,transparent);border-color:color-mix(in srgb,var(--brand) 25%,transparent);color:var(--brand)}.nav-icon{width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--bg-elevated);transition:all .15s}.nav-item.active .nav-icon{background:var(--brand-gradient);color:#fff}.nav-icon svg{width:15px;height:15px}.nav-label{flex:1}.nav-badge{background:var(--danger);color:#fff;font-size:9px;font-weight:700;padding:2px 6px;border-radius:var(--radius-full)}.sb-points{margin:8px 10px;background:var(--brand-gradient);border-radius:var(--radius-lg);padding:12px 14px}.pts-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.pts-label{font-size:10px;color:#fffc}.pts-val{font-size:14px;font-weight:900;color:#fff}.pts-bar-bg{background:#ffffff40;border-radius:4px;height:5px}.pts-bar-fill{background:#fff;height:5px;border-radius:4px;transition:width .4s}.pts-sub{font-size:9px;color:#ffffffbf;margin-top:4px;display:block}.sb-logout{display:flex;align-items:center;gap:8px;padding:10px 14px;margin:6px 8px 10px;border-radius:var(--radius-md);border:1px solid var(--danger-bg);background:var(--danger-bg);color:var(--danger);cursor:pointer;font-family:Cairo,sans-serif;font-size:12px;font-weight:700;transition:all .2s;white-space:nowrap;overflow:hidden}.sb-logout:hover{background:var(--danger);color:#fff}.sb-logout svg{width:16px;height:16px;flex-shrink:0}.main-area{margin-right:var(--sidebar-w);flex:1;display:flex;flex-direction:column;min-height:100vh;transition:margin-right .3s ease}.main-area.sidebar-collapsed{margin-right:var(--sidebar-collapsed)}.topbar{height:var(--topbar-h);background:var(--bg-surface);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:50;box-shadow:var(--shadow-sm)}.topbar-title{font-size:17px;font-weight:800;color:var(--text-primary)}.topbar-sub{font-size:11px;color:var(--text-muted);margin-top:1px}.topbar-right{display:flex;align-items:center;gap:10px}.search-box{display:flex;align-items:center;gap:8px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);padding:8px 13px}.search-box svg{color:var(--text-muted);flex-shrink:0}.search-box input{border:none;background:none;outline:none;font-size:12px;color:var(--text-primary);font-family:Cairo,sans-serif;width:140px}.search-box input::placeholder{color:var(--text-muted)}.icon-btn{width:36px;height:36px;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-elevated);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);transition:all .2s;position:relative}.icon-btn:hover{border-color:var(--brand);color:var(--brand)}.notif-dot{position:absolute;top:7px;right:7px;width:7px;height:7px;border-radius:50%;background:var(--danger);border:2px solid var(--bg-surface)}.page-content{flex:1;padding:22px 24px;overflow-y:auto}.card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:18px 20px;box-shadow:var(--shadow-sm)}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.card-header h3{font-size:14px;font-weight:700;color:var(--text-primary)}.card-link{font-size:11px;color:var(--brand);cursor:pointer;background:none;border:none;font-family:Cairo,sans-serif;font-weight:600;padding:4px 8px;border-radius:var(--radius-sm);transition:background .2s}.card-link:hover{background:var(--info-bg)}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:18px}.grid-21{display:grid;grid-template-columns:1.5fr 1fr;gap:14px;margin-bottom:18px}@media (max-width: 1100px){.grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}.grid-21{grid-template-columns:1fr}}@media (max-width: 700px){.grid-4,.grid-3,.grid-2,.grid-21{grid-template-columns:1fr}.main-area{margin-right:var(--sidebar-collapsed)}.topbar{padding:0 14px}.search-box{display:none}.page-content{padding:14px}}.stat-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:16px;display:flex;align-items:center;gap:13px;box-shadow:var(--shadow-sm);transition:box-shadow .2s}.stat-card:hover{box-shadow:var(--shadow-md)}.stat-icon{width:48px;height:48px;border-radius:15px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.stat-icon svg{width:22px;height:22px}.stat-val{font-size:22px;font-weight:900;color:var(--text-primary)}.stat-lbl{font-size:11px;color:var(--text-muted);margin-top:2px}.stat-chg{font-size:10px;font-weight:700;margin-top:3px}.hero-banner{border-radius:var(--radius-xl);background:var(--brand-gradient);padding:26px 30px;display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;position:relative;overflow:hidden}.hero-banner:before,.hero-banner:after{content:"";position:absolute;border-radius:50%;background:#ffffff12}.hero-banner:before{width:260px;height:260px;top:-80px;left:-50px}.hero-banner:after{width:160px;height:160px;bottom:-50px;left:130px}.hero-content{position:relative;z-index:1}.hero-content h2{color:#fff;font-size:21px;font-weight:900;line-height:1.4}.hero-content p{color:#ffffffd1;font-size:13px;margin-top:5px}.hero-btn{margin-top:16px;background:#fff;color:var(--brand);border:none;padding:10px 24px;border-radius:var(--radius-full);font-size:13px;font-weight:700;cursor:pointer;font-family:Cairo,sans-serif;box-shadow:0 4px 14px #00000026;transition:all .2s}.hero-btn:hover{transform:translateY(-1px);box-shadow:0 6px 18px #0003}.hero-stats{display:flex;gap:10px;position:relative;z-index:1}.hero-stat{background:#ffffff26;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);border-radius:16px;padding:14px 18px;text-align:center}.hero-stat h3{color:#fff;font-size:22px;font-weight:900}.hero-stat p{color:#fffc;font-size:10px;margin-top:3px}.sched-item{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:8px;transition:all .15s}.sched-item:last-child{margin-bottom:0}.sched-item:hover{border-color:var(--border-strong)}.sched-icon{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.sched-icon svg{width:17px;height:17px}.sched-info{flex:1}.sched-info h4{font-size:12px;font-weight:700;color:var(--text-primary)}.sched-info p{font-size:10px;color:var(--text-muted)}.badge{font-size:10px;padding:3px 10px;border-radius:var(--radius-full);font-weight:700;white-space:nowrap}.badge-success{background:var(--success-bg);color:var(--success)}.badge-info{background:var(--info-bg);color:var(--info)}.badge-warning{background:var(--warning-bg);color:var(--warning)}.badge-muted{background:var(--bg-elevated);color:var(--text-muted);border:1px solid var(--border)}.prog-bg{background:var(--bg-elevated);border-radius:4px;height:7px;overflow:hidden;border:1px solid var(--border)}.prog-fill{height:7px;border-radius:4px;background:var(--brand-gradient);transition:width .4s ease}.form-input{width:100%;padding:10px 38px 10px 12px;border:1.5px solid var(--border);border-radius:var(--radius-md);background:var(--bg-elevated);color:var(--text-primary);font-family:Cairo,sans-serif;font-size:13px;outline:none;transition:all .2s}.form-input:focus{border-color:var(--brand);background:var(--bg-surface);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 10%,transparent)}.form-input::placeholder{color:var(--text-muted)}.form-input.error{border-color:var(--danger);background:var(--danger-bg)}.form-select{width:100%;padding:10px 12px;border:1.5px solid var(--border);border-radius:var(--radius-md);background:var(--bg-elevated);color:var(--text-primary);font-family:Cairo,sans-serif;font-size:12px;outline:none;cursor:pointer;transition:all .2s}.form-select:focus{border-color:var(--brand)}.form-label{display:block;font-size:11px;font-weight:700;color:var(--text-secondary);margin-bottom:5px}.form-label .required{color:var(--danger)}.form-group{margin-bottom:14px}.btn-primary{background:var(--brand-gradient);color:#fff;border:none;padding:11px 24px;border-radius:var(--radius-md);font-size:13px;font-weight:700;cursor:pointer;font-family:Cairo,sans-serif;box-shadow:0 4px 14px color-mix(in srgb,var(--brand) 30%,transparent);transition:all .2s;display:inline-flex;align-items:center;gap:7px}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 18px color-mix(in srgb,var(--brand) 40%,transparent)}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-primary.full{width:100%;justify-content:center}.btn-secondary{background:var(--bg-elevated);color:var(--brand);border:1.5px solid var(--border);padding:10px 20px;border-radius:var(--radius-md);font-size:12px;font-weight:700;cursor:pointer;font-family:Cairo,sans-serif;transition:all .2s;display:inline-flex;align-items:center;gap:6px}.btn-secondary:hover{border-color:var(--brand);background:var(--info-bg)}.btn-danger{background:var(--danger-bg);color:var(--danger);border:1.5px solid color-mix(in srgb,var(--danger) 20%,transparent);padding:8px 16px;border-radius:var(--radius-md);font-size:12px;font-weight:700;cursor:pointer;font-family:Cairo,sans-serif;transition:all .2s}.btn-danger:hover{background:var(--danger);color:#fff}.planet-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:13px 15px;background:var(--bg-elevated);border:1.5px solid var(--border);border-radius:16px;cursor:pointer;transition:all .2s;min-width:85px}.planet-card:hover,.planet-card.active{border-color:var(--brand);background:var(--info-bg)}.planet-icon{width:50px;height:50px;border-radius:16px;display:flex;align-items:center;justify-content:center}.planet-icon svg{width:24px;height:24px}.planet-name{font-size:11px;font-weight:700;color:var(--text-primary)}.planet-pct{font-size:10px;color:var(--text-muted)}.planet-bar{width:50px;height:4px;background:var(--border);border-radius:2px}.planet-bar-fill{height:4px;border-radius:2px;transition:width .3s}.challenge-item{display:flex;align-items:center;gap:10px;padding:12px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:8px;transition:all .15s}.challenge-item:last-child{margin-bottom:0}.challenge-item:hover{border-color:var(--border-strong)}.challenge-icon{width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:20px}.challenge-info{flex:1}.challenge-info h4{font-size:12px;font-weight:700;color:var(--text-primary)}.challenge-info p{font-size:10px;color:var(--text-muted);margin-top:2px}.challenge-pts{font-size:12px;font-weight:700;color:var(--warning);white-space:nowrap}.track-item{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:8px;transition:all .15s}.track-art{width:42px;height:42px;border-radius:13px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px}.track-info{flex:1}.track-info h4{font-size:12px;font-weight:700;color:var(--text-primary)}.track-info p{font-size:10px;color:var(--text-muted)}.play-btn{width:32px;height:32px;border-radius:10px;background:var(--brand-gradient);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}.play-btn:hover{transform:scale(1.05)}.play-btn svg{width:13px;height:13px;fill:#fff}.play-btn.off{background:var(--bg-hover);border:1px solid var(--border)}.play-btn.off svg{fill:var(--brand)}.file-item{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:8px}.file-icon{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.file-icon svg{width:18px;height:18px}.file-info{flex:1}.file-info h4{font-size:12px;font-weight:700;color:var(--text-primary)}.file-info p,.file-size{font-size:10px;color:var(--text-muted)}.timer-wrap{text-align:center;padding:8px 0}.timer-ring{width:150px;height:150px;position:relative;margin:0 auto 14px}.timer-ring svg{width:150px;height:150px;transform:rotate(-90deg)}.timer-center{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.timer-center h1{font-size:30px;font-weight:900;color:var(--text-primary);line-height:1}.timer-center p{font-size:10px;color:var(--text-muted)}.sec-badge{display:flex;align-items:center;gap:7px;background:var(--success-bg);border-radius:var(--radius-md);padding:8px 12px;border:1px solid color-mix(in srgb,var(--success) 20%,transparent)}.sec-badge svg{width:14px;height:14px;color:var(--success);flex-shrink:0}.sec-badge p{font-size:10px;color:var(--success);font-weight:600}.empty-state{text-align:center;padding:40px 20px;color:var(--text-muted)}.empty-state svg{width:48px;height:48px;stroke:var(--border-strong);stroke-width:1.5;fill:none;margin:0 auto 12px;display:block}.empty-state p{font-size:13px}.tele-box{background:color-mix(in srgb,#0088cc 8%,var(--bg-elevated));border:1.5px solid color-mix(in srgb,#0088cc 20%,transparent);border-radius:var(--radius-md);padding:12px 14px;display:flex;align-items:center;gap:10px}.tele-ico{width:36px;height:36px;border-radius:11px;background:linear-gradient(135deg,#08c,#069);display:flex;align-items:center;justify-content:center;flex-shrink:0}.tele-ico svg{width:18px;height:18px;fill:#fff}.tele-info h4{font-size:12px;font-weight:700;color:var(--text-primary)}.tele-info p{font-size:10px;color:var(--text-muted)}.tele-info a{color:#08c;font-weight:700;text-decoration:none}.section-title{font-size:15px;font-weight:800;color:var(--text-primary);margin-bottom:14px}.section-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.section-row h3{font-size:14px;font-weight:700;color:var(--text-primary)}.profile-hero{background:linear-gradient(135deg,#764ba2,#667eea);border-radius:var(--radius-xl);padding:24px 28px;display:flex;align-items:center;gap:18px;margin-bottom:18px;position:relative;overflow:hidden}.profile-hero:before{content:"";position:absolute;width:180px;height:180px;border-radius:50%;background:#ffffff12;top:-50px;left:-30px}.profile-avatar{width:64px;height:64px;border-radius:20px;background:#fff3;border:2px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0;position:relative;z-index:1}.profile-info{position:relative;z-index:1}.profile-info h2{color:#fff;font-size:18px;font-weight:900}.profile-info p{color:#ffffffbf;font-size:11px}.profile-level{display:inline-block;background:#fff3;color:#fff;font-size:10px;padding:3px 10px;border-radius:var(--radius-full);margin-top:6px}.profile-nums{display:flex;gap:18px;margin-right:auto;position:relative;z-index:1}.pnum{text-align:center}.pnum h3{color:#fff;font-size:20px;font-weight:900}.pnum p{color:#ffffffb3;font-size:9px}.pnum-div{width:1px;background:#fff3;align-self:stretch}.settings-item{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--border);cursor:pointer;transition:background .15s}.settings-item:last-child{border-bottom:none}.settings-item:hover{background:var(--bg-hover)}.settings-ico{width:36px;height:36px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.settings-ico svg{width:17px;height:17px}.settings-item-info{flex:1}.settings-item-info h4{font-size:13px;font-weight:700;color:var(--text-primary)}.settings-item-info p{font-size:11px;color:var(--text-muted)}.settings-arr{color:var(--text-muted);font-size:16px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-base)}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}*,*:before,*:after{transition:background-color .2s,border-color .2s,color .2s}button,a,input,select{transition:all .2s}