:root{--xbg:#020817;--xpanel:#071426;--xpanel2:#0a1a31;--xsoft:#0d203a;--xline:rgba(107,155,255,.14);--xtext:#f8fbff;--xmuted:#8ea6c2;--xblue:#0b63f6;--xblue2:#1677ff;--xgreen:#1fbd6b;--xorange:#ff7a1a;--xred:#ef4444}
*{box-sizing:border-box}body.xui-page{margin:0;background:radial-gradient(900px 520px at 85% -5%,rgba(20,99,246,.13),transparent 60%),linear-gradient(180deg,#020817,#03101d);color:var(--xtext);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;min-height:100vh}.xui-sidebar{position:fixed;left:0;top:0;bottom:0;width:228px;background:#03101d;border-right:1px solid var(--xline);padding:16px 12px;display:flex;flex-direction:column;z-index:1000}.xui-brand{display:flex;align-items:center;gap:10px;padding:4px 8px 18px;text-decoration:none;color:#fff;border-bottom:1px solid rgba(255,255,255,.06)}.xui-brand img{width:38px;height:38px;object-fit:contain}.xui-brand strong{font-size:15px}.xui-brand small{display:block;color:#7890aa;font-size:9px;letter-spacing:1.7px;margin-top:2px}.xui-label{font-size:9px;font-weight:900;letter-spacing:1px;color:#66809b;text-transform:uppercase;padding:18px 9px 7px}.xui-nav{display:flex;flex-direction:column;gap:4px}.xui-nav a{display:flex;align-items:center;gap:10px;padding:10px 11px;border-radius:9px;text-decoration:none;color:#b9cbe0;font-size:12px;font-weight:750}.xui-nav a i{width:18px;text-align:center;color:#7f9ab7}.xui-nav a:hover,.xui-nav a.active{background:linear-gradient(135deg,#0b58e6,#147cff);color:#fff}.xui-nav a.active i{color:#fff}.xui-side-bottom{margin-top:auto}.xui-help{border:1px solid var(--xline);background:#07172a;border-radius:13px;padding:12px;margin-top:12px}.xui-help strong{font-size:11px}.xui-help p{font-size:9px;color:#8198b2;line-height:1.45;margin:5px 0 9px}.xui-help a{display:flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;background:#0b63f6;color:#fff;border-radius:8px;padding:8px;font-size:9px;font-weight:900}.xui-main{margin-left:228px;min-height:100vh}.xui-topbar{height:68px;position:sticky;top:0;z-index:900;display:flex;align-items:center;gap:18px;padding:0 24px;background:rgba(2,8,23,.92);backdrop-filter:blur(16px);border-bottom:1px solid var(--xline)}.xui-search{max-width:360px;width:100%;height:38px;background:#071426;border:1px solid var(--xline);border-radius:10px;display:flex;align-items:center;gap:9px;padding:0 12px;color:#7188a4}.xui-search input{border:0;outline:0;background:transparent;color:#fff;width:100%;font-size:11px}.xui-spacer{flex:1}.xui-top-action{display:inline-flex;align-items:center;gap:7px;text-decoration:none;color:#c8d8e9;border:1px solid var(--xline);background:#071426;border-radius:9px;padding:9px 11px;font-size:10px;font-weight:850}.xui-top-action.primary{background:#0b63f6;color:#fff;border-color:#0b63f6}.xui-avatar{width:34px;height:34px;border-radius:50%;background:#125eea;display:grid;place-items:center;font-weight:900;color:#fff}.xui-content{padding:18px 24px 44px;max-width:1540px;margin:0 auto}.xui-welcome{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:20px;min-height:260px;background:linear-gradient(115deg,#061326 0%,#071a36 58%,#09255b 100%);border:1px solid rgba(47,111,255,.42);border-radius:18px;padding:30px;overflow:hidden;position:relative}.xui-welcome:after{content:"";position:absolute;width:430px;height:430px;border-radius:50%;right:-170px;top:-170px;background:rgba(20,99,246,.14);filter:blur(2px)}.xui-welcome-copy{position:relative;z-index:2}.xui-eyebrow{font-size:9px;color:#67a5ff;font-weight:900;text-transform:uppercase;letter-spacing:.8px}.xui-welcome h1{font-size:clamp(30px,3.2vw,48px);line-height:1.03;margin:12px 0 11px;letter-spacing:-1.2px}.xui-welcome h1 span{color:#4e8fff}.xui-welcome p{max-width:650px;margin:0 0 20px;color:#9eb3ca;font-size:13px;line-height:1.6}.xui-hero-actions{display:flex;gap:10px;flex-wrap:wrap}.xui-btn{display:inline-flex;align-items:center;gap:8px;text-decoration:none;border-radius:9px;padding:10px 13px;background:#0b63f6;color:#fff;font-size:10px;font-weight:900}.xui-btn.secondary{background:#071426;border:1px solid var(--xline);color:#dbe9f8}.xui-preview-box{position:relative;z-index:2;align-self:center;background:#030a15;border:1px solid rgba(57,119,255,.36);border-radius:14px;padding:9px;min-height:170px;display:flex;align-items:center;justify-content:center}.xui-preview-box iframe,.xui-preview-box img{width:100%;aspect-ratio:16/9;border:0;border-radius:9px;object-fit:contain;background:#020711}.xui-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:14px}.xui-stat{background:#071426;border:1px solid var(--xline);border-radius:12px;padding:15px;display:flex;gap:12px;align-items:center;min-height:80px}.xui-stat-icon{width:38px;height:38px;border-radius:10px;background:rgba(20,99,246,.13);display:grid;place-items:center;color:#4e8fff}.xui-stat b{display:block;font-size:16px}.xui-stat small{display:block;color:#839ab5;font-size:9px;margin-top:3px}.xui-section{margin-top:22px}.xui-section-head{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:10px}.xui-section h2{font-size:19px;margin:0}.xui-section p{font-size:10px;color:#7f96b0;margin:4px 0 0}.xui-count{font-size:9px;color:#9db8d6;background:#071426;border:1px solid var(--xline);border-radius:999px;padding:6px 9px}.xui-course-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.xui-card{background:#071426;border:1px solid var(--xline);border-radius:13px;overflow:hidden;display:flex;flex-direction:column;min-width:0}.xui-cover{position:relative;aspect-ratio:16/9;background:#020711 center/contain no-repeat;border-bottom:1px solid var(--xline)}.xui-card-tags{position:absolute;left:8px;top:8px;display:flex;gap:5px;flex-wrap:wrap;z-index:2}.xui-tag{font-size:8px;font-weight:900;padding:5px 7px;border-radius:999px;background:#0b63f6;color:#fff}.xui-tag.soon{background:#475569}.xui-tag.best{background:#e11d48}.xui-tag.promo{background:#ff6a1a}.xui-price{position:absolute;right:8px;top:8px;background:#ff7417;color:#fff;border-radius:999px;padding:5px 8px;font-size:9px;font-weight:900}.xui-card-body{padding:11px 12px 12px;display:flex;flex-direction:column;flex:1}.xui-card h3{font-size:13px;margin:0 0 5px}.xui-card-desc{font-size:9px;color:#89a0ba;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:28px}.xui-card-meta{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.xui-chip{font-size:8px;color:#9fc0e8;background:#0a1a31;border:1px solid var(--xline);border-radius:999px;padding:4px 6px}.xui-card-action{margin-top:auto;display:flex;align-items:center;justify-content:space-between;text-decoration:none;color:#77aaff;font-size:9px;font-weight:900;padding-top:7px}.xui-empty{background:#071426;border:1px dashed var(--xline);border-radius:13px;padding:28px;text-align:center;color:#8096af}.xui-mobile{display:none}.xui-menu-btn{display:none}.xui-progress{height:6px;background:#12243a;border-radius:999px;overflow:hidden;margin-top:10px}.xui-progress span{display:block;height:100%;background:#0b63f6;border-radius:999px}
@media(max-width:1150px){.xui-course-grid{grid-template-columns:repeat(3,1fr)}.xui-welcome{grid-template-columns:1fr}.xui-preview-box{display:none}}
@media(max-width:820px){.xui-sidebar{transform:translateX(-102%);transition:.22s;width:240px}.xui-sidebar.open{transform:translateX(0)}.xui-main{margin-left:0}.xui-topbar{padding:0 12px;height:60px}.xui-content{padding:12px 10px 86px}.xui-search{display:none}.xui-menu-btn{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--xline);border-radius:9px;background:#071426;color:#fff}.xui-welcome{padding:20px;border-radius:14px;min-height:auto}.xui-welcome h1{font-size:29px}.xui-stats{grid-template-columns:repeat(2,1fr)}.xui-course-grid{grid-template-columns:repeat(2,1fr)}.xui-mobile{position:fixed;display:grid;grid-template-columns:repeat(4,1fr);left:8px;right:8px;bottom:8px;z-index:990;background:rgba(2,8,23,.96);border:1px solid var(--xline);border-radius:15px;padding:6px;backdrop-filter:blur(16px)}.xui-mobile a{display:flex;flex-direction:column;align-items:center;gap:3px;color:#8098b5;text-decoration:none;font-size:8px;padding:5px}.xui-mobile i{font-size:15px;color:#6f9fff}}
@media(max-width:560px){.xui-course-grid{grid-template-columns:1fr}.xui-stats{grid-template-columns:1fr 1fr}.xui-stat{padding:11px;min-height:68px}.xui-top-action .txt{display:none}}