:root{--bg:#0a0a0a;--surface:#ffffff09;--surface-2:#ffffff05;--border:#ffffff17;--text:#e9e9e9;--muted:#a1a1a1;--purple:#5610e3;--pink:#e31064}.s-root{background:radial-gradient(1100px 700px at 110% -20%,#5610e31a,transparent 60%),radial-gradient(900px 600px at -10% 110%,#e3106414,transparent 60%),var(--bg);min-height:100vh;color:var(--text);display:flex}.s-main{flex:1;min-width:0;padding:20px}.s-topbar{border-bottom:1px solid var(--border);z-index:2;background:#0b0b0b;justify-content:space-between;align-items:center;gap:12px;margin:-6px -6px 16px;padding:10px;display:flex;position:sticky;top:0}.s-search{border:1px solid var(--border);background:#ffffff0a;border-radius:10px;align-items:center;gap:8px;min-width:340px;padding:6px 10px;display:flex}.s-search input{color:#ddd;background:0 0;border:none;outline:none;width:100%;font-size:.92rem}.s-top-actions{align-items:center;gap:8px;display:flex}.s-icon-btn{border:1px solid var(--border);color:#dadada;cursor:pointer;background:#ffffff0a;border-radius:10px;place-items:center;width:34px;height:34px;display:grid}.s-avatar{border:1px solid var(--border);background:#ffffff0f;border-radius:10px;place-items:center;width:34px;height:34px;display:grid}.s-panel{border:1px solid var(--border);background:var(--surface);border-radius:12px;margin-bottom:14px;box-shadow:0 6px 18px #00000040}.s-panel-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:10px 12px;display:flex}.s-title{align-items:center;gap:8px;display:flex}.s-title h2{color:#ffffffd9;letter-spacing:.02em;margin:0;font-size:1rem}.s-panel-body{background:var(--surface-2);border-radius:0 0 12px 12px;padding:12px}.s-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;display:grid}.course-card{border:1px solid var(--border)!important;color:#eaeaea!important;background:#ffffff0a!important}.course-title,.course-info h3{color:#fff!important}.subtitle{color:#bdbdbd!important}.progress-bar{background:#ffffff0f!important}.progress-fill{background:linear-gradient(90deg,var(--purple),var(--pink))!important}.progress-percent{color:#dcdcdc!important}.course-details{color:#c8c8c8!important}.resume-btn{background:var(--purple)!important}.reading-card{color:#fff!important}.reading-card.red{border:1px solid #e3106459;background:linear-gradient(#e3106442,#e310642e)!important}.reading-card.teal{border:1px solid #38bdf859;background:linear-gradient(#38bdf842,#38bdf82e)!important}.reading-card p{color:#eaeaea!important}.recommended-card{border:1px solid var(--border)!important;color:#eaeaea!important;background:#ffffff0a!important}.recommended-thumbnail{background:#ffffff0d!important}.play-icon{color:#eaeaea!important}.recommended-title{color:#fff!important}.recommended-instructor{color:#c8c8c8!important}.role-tag{color:#9ab6ff!important}.recommended-footer{color:#dadada!important}.s-main::-webkit-scrollbar{width:10px}.s-main::-webkit-scrollbar-thumb{background:#ffffff1f padding-box padding-box;border:2px solid #0000;border-radius:10px}@media (max-width:980px){.s-search{min-width:220px}}@media (max-width:760px){.s-root{flex-direction:column}.s-main{padding:14px}.s-topbar{margin:0 0 12px;position:relative}}.s-main{padding-top:max(14px,env(safe-area-inset-top));padding-right:14px;padding-bottom:max(14px,env(safe-area-inset-bottom));padding-left:14px}@media (max-width:900px){.s-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}@media (max-width:640px){.s-grid{grid-template-columns:1fr}.s-panel{border-radius:10px}.s-panel-header{padding:8px 10px}.s-panel-body{padding:10px}.s-search{flex:1;min-width:0;padding:8px}}.s-title svg{filter:drop-shadow(0 0 4px #f6098f40)}.s-title h2{font-size:clamp(.95rem,1.2vw + .7rem,1.15rem)}
.scc.card{cursor:pointer;text-align:left;color:#eee;background:#101010;border:1px solid #222;border-radius:12px;flex-direction:column;gap:8px;padding:12px;transition:transform .18s,box-shadow .18s,border-color .18s;display:flex}.scc.card:hover{border-color:#2a2a2a;transform:translateY(-3px);box-shadow:0 6px 18px #00000047}.scc-thumbWrap{aspect-ratio:16/9;border-radius:10px;width:100%;margin-bottom:2px;position:relative;overflow:hidden}.scc-thumbImg{object-fit:cover;width:100%;height:100%;display:block}.scc-thumb{color:#888;background:#151515;place-items:center;width:100%;height:100%;display:grid}.scc-thumb.fallback span{font-size:1.5rem}.scc-title{color:#fff;margin:2px 0 0;font-size:1rem;font-weight:700;line-height:1.25}.scc-sub{color:#b8b8b8;margin:2px 0 4px;font-size:.9rem;line-height:1.3}.scc-chips{flex-wrap:wrap;gap:6px;display:flex}.scc-chip{color:#ddd;background:#0f0f0f;border:1px solid #2a2a2a;border-radius:999px;align-items:center;gap:6px;padding:4px 8px;font-size:.78rem;display:inline-flex}.scc-row{color:#e5e5e5;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-top:6px;display:flex}.scc-stat{color:#e6e6e6;align-items:center;gap:6px;font-size:.86rem;display:inline-flex}.scc-price{background:linear-gradient(90deg,#5610e3,#e31064);color:#0000;-webkit-background-clip:text;background-clip:text;margin-left:auto;font-weight:800}.scc-progress{background:#0f0f0f;border:1px solid #222;border-radius:999px;height:8px;margin-top:6px;overflow:hidden}.scc-progressFill{background:linear-gradient(90deg,#0fc,#1c99fe);border-radius:999px;height:100%;transition:width .3s}.skeleton .scc-thumb{background:#161616}.skeleton .scc-line{background:#191919;border-radius:6px;height:12px;margin-top:8px;animation:1.4s ease-in-out infinite sccPulse}.skeleton .scc-line.w70{width:70%}.skeleton .scc-line.w90{width:90%}.skeleton .scc-line.w50{width:50%}@keyframes sccPulse{0%{opacity:.9}50%{opacity:.5}to{opacity:.9}}.ico{vertical-align:-2px;margin-right:6px}.ico.pink{color:#f6098f}.ico.blue{color:#1c99fe}.ico.aqua{color:#0fc}.ico.violet{color:#7a4ee0}.scc-chip .ico,.scc-stat .ico{margin-right:6px}.scc-progressWrap{margin-top:8px}.scc-progressMeta{justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px;display:flex}.scc-percentPill{color:#dfe;letter-spacing:.2px;background:linear-gradient(90deg,#00ffcc26,#1c99fe1f);border:1px solid #00ffcc40;border-radius:999px;padding:4px 10px;font-size:.8rem;font-weight:800}.scc-percentPill.done{color:#eaffea;background:linear-gradient(90deg,#44d62c2e,#44d62c1f);border-color:#44d62c59}.scc-ctaPill{color:#000;background:linear-gradient(90deg,#fff,#e9e9e9);border:1px solid #fffc;border-radius:10px;padding:4px 10px;font-size:.8rem;font-weight:800;transition:transform .15s,box-shadow .15s,filter .15s;transform:translateZ(0);box-shadow:0 6px 18px #00000026}.scc.card:hover .scc-ctaPill{filter:brightness(1.02);transform:translateY(-1px)}.scc-ctaPill.new{color:#fff;background:linear-gradient(90deg,#5610e3,#e31064);border:1px solid #ffffff40;box-shadow:0 8px 22px #e3106447}.scc-ctaPill.cont{color:#111;background:linear-gradient(90deg,#fff,#efefef)}.scc-ctaPill.done{color:#06220a;background:linear-gradient(90deg,#35d04b,#8be89b);border-color:#44d62c73;box-shadow:0 8px 22px #44d62c40}.scc-ctaPill .arr{margin-left:6px}.scc-progress{background:#0f0f0f;border:1px solid #222;border-radius:999px;height:10px;margin-top:2px;position:relative;overflow:hidden}.scc-progress:after{content:"";pointer-events:none;background-image:linear-gradient(90deg,#ffffff12 1px,#0000 1px);background-size:25% 100%;position:absolute;inset:0}.scc-progressFill{background:linear-gradient(90deg,#0fc,#1c99fe);border-radius:999px;height:100%;transition:width .3s;box-shadow:inset 0 0 8px #00000040}
.s-rail{border-left:1px solid var(--border);background:#0f0f10;flex-direction:column;gap:12px;width:320px;height:100vh;padding:20px 16px;display:flex;position:sticky;top:0;overflow:hidden}.s-rail-inner{height:100%;position:relative}.s-rail-content{z-index:0;will-change:filter,transform,opacity;transition:filter .25s,transform .25s,opacity .25s;position:relative}@media (hover:hover){.s-rail:hover .s-rail-content{filter:blur(2.5px)brightness(.85);pointer-events:none}}.s-rail-overlay{z-index:1;opacity:0;pointer-events:none;-webkit-backdrop-filter:blur(1px);background:radial-gradient(800px 400px at 70% -10%,#f6098f12,#0000 60%),radial-gradient(700px 500px at 0 110%,#5610e30f,#0000 60%);border-radius:12px;justify-content:center;align-items:flex-start;padding-top:30%;transition:opacity .3s,transform .3s;display:flex;position:absolute;inset:0;transform:translateY(4px)scale(.98)}@media (hover:hover){.s-rail:hover .s-rail-overlay{opacity:1;transform:translateY(0)scale(1)}}.rail-overlay-card{text-align:center;background:linear-gradient(#ffffff0f,#ffffff08);border:1px solid #ffffff1f;border-radius:14px;padding:16px 18px;box-shadow:0 8px 32px #00000059,inset 0 0 0 1px #ffffff0a}.rail-overlay-ico{filter:drop-shadow(0 0 10px #f6098f59);margin-bottom:6px;font-size:1.2rem}.rail-overlay-title{letter-spacing:.02em;color:#fff;font-weight:700}.rail-overlay-sub{color:var(--muted);margin:2px 0 0;font-size:.86rem}.s-card{border:1px solid var(--border);background:var(--surface);border-radius:12px;padding:12px}.s-profile-head{align-items:center;gap:10px;display:flex}.s-profile-avatar{border:1px solid var(--border);background:#ffffff0f;border-radius:10px;place-items:center;width:40px;height:40px;display:grid}.s-profile-info h4{color:#fff;margin:0;font-size:.98rem}.s-profile-info p{color:var(--muted);margin:2px 0 0;font-size:.85rem}.s-profile-stats{gap:10px;margin-top:10px;display:flex}.s-stat{border:1px solid var(--border);text-align:center;background:#ffffff0a;border-radius:10px;flex:1;padding:10px}.s-stat-val{color:#fff;font-weight:700;display:block}.s-stat-key{color:var(--muted);font-size:.85rem}.s-achievements{flex-direction:column;gap:10px;display:flex}.s-ach-row{gap:10px;display:flex}.s-ach{border:1px solid var(--border);background:#ffffff0a;border-radius:10px;flex:1;align-items:center;gap:8px;padding:10px;display:flex}.s-ach-ico{background:#5610e32e;border:1px solid #5610e33d;border-radius:8px;place-items:center;width:28px;height:28px;display:grid}.s-ach-info{flex-direction:column;line-height:1.15;display:flex}.s-ach-info strong{color:#fff;font-size:.92rem}.s-ach-info span{color:var(--muted);font-size:.82rem}.s-watch-head{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.s-watch-title{color:#ffffffd9;font-weight:600}.s-watch-filter{color:var(--muted);font-size:.85rem}.s-watch-chart{color:#cfcfcf;font-size:1.25rem}.s-rail::-webkit-scrollbar{width:10px}.s-rail::-webkit-scrollbar-thumb{background:#ffffff1f padding-box padding-box;border:2px solid #0000;border-radius:10px}@media (max-width:1200px){.s-rail{display:none}}@media (max-width:760px){.s-rail{z-index:50;border-left:1px solid var(--border);width:320px;height:100vh;padding:20px 16px;padding-bottom:calc(20px + env(safe-area-inset-bottom,0));background:#0f0f10;transition:transform .22s,box-shadow .22s;display:block;position:fixed;top:0;right:0;transform:translate(100%);box-shadow:0 6px 24px #00000073}.s-rail.is-open{transform:translate(0)}.s-rail-close{border:1px solid var(--border);color:#ddd;z-index:1;background:#ffffff0f;border-radius:8px;place-items:center;width:32px;height:32px;display:grid;position:absolute;top:10px;right:10px}.s-rail-scrim{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:45;background:#00000073;position:fixed;inset:0}.s-rail-fab{right:14px;bottom:calc(14px + env(safe-area-inset-bottom,0));z-index:46;border:1px solid var(--border);color:#eee;background:#ffffff0f;border-radius:12px;place-items:center;width:44px;height:44px;font-size:20px;line-height:1;display:grid;position:fixed;box-shadow:0 8px 22px #00000059}@media (hover:none){.s-rail:hover .s-rail-content{filter:none;pointer-events:auto}.s-rail .s-rail-overlay{opacity:0}.s-rail.is-open.show-overlay .s-rail-overlay{opacity:1;transition:opacity .3s,transform .3s;transform:translateY(0)scale(1)}}}@media (min-width:761px){.s-rail-fab,.s-rail-scrim,.s-rail-close{display:none!important}}
.s-sidebar{border-right:1px solid var(--border);z-index:3;background:#0e0e0f;flex-direction:column;width:240px;height:100vh;padding:18px 14px;display:flex;position:sticky;top:0}.s-brand{align-items:center;gap:10px;margin-bottom:12px;padding:8px 10px;display:flex}.s-brand-dot{background:linear-gradient(90deg,var(--pink),var(--purple));border-radius:50%;width:8px;height:8px}.s-brand-text{letter-spacing:.08em;color:#fffc;font-family:monospace;font-weight:700}.s-nav{flex-direction:column;align-items:stretch;gap:4px;margin-top:8px;display:flex}.nav-item-wrap{width:100%;position:relative}.s-nav-item{box-sizing:border-box;color:#d7d7d7;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;align-items:center;gap:10px;width:100%;padding:9px 10px;text-decoration:none;transition:background .15s,border-color .15s,color .15s,filter .15s;display:flex}.s-nav-item:hover{border-color:var(--border);background:#ffffff0a}.s-nav-item.active{color:#fff;background:#5610e324;border-color:#5610e33d}.s-nav-wip{isolation:isolate;flex-direction:column;gap:4px;margin-top:4px;display:flex;position:relative}.s-nav-wip .s-nav-item{pointer-events:none}.s-nav-wip:hover .s-nav-item{filter:blur(1.6px)brightness(.9)}.sb-group-overlay{opacity:0;z-index:2;pointer-events:none;justify-content:center;align-items:center;transition:opacity .18s,transform .18s;display:flex;position:absolute;inset:0;transform:translateY(6px)scale(.98)}.s-nav-wip:hover .sb-group-overlay{opacity:1;transform:translateY(-2px)scale(1)}.s-nav-wip.mobile-overlay-active .s-nav-item{filter:blur(1.6px)brightness(.9)}.s-nav-wip.mobile-overlay-active .sb-group-overlay{opacity:1;transform:translateY(-2px)scale(1)}.sb-pill{letter-spacing:.02em;color:#fff;border:1px solid var(--border);-webkit-backdrop-filter:blur(10px)saturate(115%);backdrop-filter:blur(10px)saturate(115%);text-shadow:0 0 10px #f6098f73;background:#0f0f10a6;border-radius:10px;padding:8px 12px;font-size:.82rem;box-shadow:0 4px 16px #00000059,inset 0 0 0 1px #ffffff0a}.s-nav-item svg{transition:transform .15s,filter .2s}.s-nav-item:hover svg{filter:drop-shadow(0 0 6px #f6098f59);transform:translateY(-1px)}.s-logout{color:#ff6fa6;cursor:pointer;background:#e3106414;border:1px solid #e3106438;border-radius:10px;align-items:center;gap:10px;width:100%;margin-top:auto;padding:9px 10px;display:flex}.s-ad{margin-top:12px}.s-ad-inner{border:1px dashed var(--border);text-align:center;color:#cfcfcf;background:#ffffff05;border-radius:10px;padding:12px}@media (max-width:760px){.s-nav-wip:hover .s-nav-item{filter:none}.s-nav-wip:hover .sb-group-overlay{opacity:0;transform:translateY(6px)scale(.98)}.s-sidebar{z-index:40;width:260px;height:100vh;transition:transform .22s,box-shadow .22s;position:fixed;top:0;left:0;transform:translate(-100%);box-shadow:0 6px 24px #00000073}.s-sidebar.is-open{transform:translate(0)}.s-sidebar-close{border:1px solid var(--border);color:#ddd;background:#ffffff0f;border-radius:8px;place-items:center;width:32px;height:32px;display:grid;position:absolute;top:10px;right:10px}.s-nav{flex-flow:column;margin-top:8px}.s-sidebar-scrim{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:35;background:#00000073;position:fixed;inset:0}.s-sidebar-fab{z-index:36;border:1px solid var(--border);color:#eee;background:#ffffff0f;border-radius:12px;place-items:center;width:44px;height:44px;display:grid;position:fixed;bottom:14px;left:14px;box-shadow:0 8px 22px #00000059}}@media (min-width:761px){.s-sidebar-fab,.s-sidebar-scrim,.s-sidebar-close{display:none!important}.s-nav-wip.mobile-overlay-active .s-nav-item{filter:none}.s-nav-wip.mobile-overlay-active .sb-group-overlay{opacity:0;transform:translateY(6px)scale(.98)}}