.courses-page{min-height:100vh;padding:0;background:color-mix(in srgb,var(--background-secondary) 72%,var(--background-primary));color:var(--text-primary)}
.course-social-shell{display:grid;grid-template-columns:220px minmax(0,1fr);width:min(100%,1530px);margin:0 auto;min-height:calc(100vh - 72px)}
.course-browser-sidebar{position:sticky;top:72px;align-self:start;height:calc(100vh - 72px);overflow-y:auto;padding:2rem 1rem 1.5rem;border-right:1px solid var(--border-color);background:var(--background-primary);scrollbar-width:thin}
.course-side-label{margin:.15rem .75rem .65rem;color:var(--text-secondary);font-size:.67rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.course-side-nav,.course-category-nav{display:grid;gap:.25rem}.course-side-nav button,.course-category-nav button{display:flex;align-items:center;gap:.75rem;width:100%;min-height:42px;padding:.62rem .75rem;border:0;border-radius:9px;background:transparent;color:var(--text-primary);font:inherit;font-size:.79rem;font-weight:600;text-align:left;cursor:pointer}.course-side-nav button:hover,.course-category-nav button:hover{background:var(--background-secondary)}.course-side-nav button.active{background:color-mix(in srgb,var(--primary-color) 11%,var(--background-primary));color:var(--primary-color)}.course-side-nav .material-symbols-outlined{font-size:1.12rem}.course-side-divider{height:1px;margin:1rem .65rem;background:var(--border-color)}
.subject-dot{display:grid;flex:0 0 24px;width:24px;height:24px;place-items:center;border-radius:8px;background:var(--background-secondary);color:var(--primary-color);font-style:normal}.subject-dot .material-symbols-outlined{font-size:.95rem}.subject-dot.surgery{color:#14b8a6;background:#e7fbf7}.subject-dot.pediatrics{color:#38bdf8;background:#eaf8ff}.subject-dot.osce{color:#fb7185;background:#fff0f3}.subject-dot.pharmacology{color:#22c55e;background:#edfcef}.subject-dot.revision{color:#8b5cf6;background:#f3efff}
[data-theme="dark"] .subject-dot{background:color-mix(in srgb,currentColor 14%,var(--background-primary))}
.course-creator-cta{margin-top:1.3rem;padding:1.1rem;border:1px solid color-mix(in srgb,var(--primary-color) 24%,var(--border-color));border-radius:15px;background:linear-gradient(145deg,color-mix(in srgb,var(--primary-color) 8%,var(--background-primary)),var(--background-primary))}.course-creator-cta h3{margin:0;color:var(--text-primary);font-size:.95rem;line-height:1.35}.course-creator-cta p{margin:.55rem 0 .8rem;color:var(--text-secondary);font-size:.72rem;line-height:1.5}.course-creator-cta>button{padding:.58rem .75rem;border:0;border-radius:8px;background:var(--primary-color);color:#fff;font:inherit;font-size:.7rem;font-weight:800;cursor:pointer}.course-mini-people{display:flex;margin-top:1rem}.course-mini-people span{display:grid;width:28px;height:28px;place-items:center;margin-left:-5px;border:2px solid var(--background-primary);border-radius:50%;background:var(--text-primary);color:var(--background-primary);font-size:.52rem;font-weight:800}.course-mini-people span:first-child{margin-left:0}.course-mini-people span:last-child{background:var(--primary-color);color:#fff}.course-creator-cta small{display:block;margin-top:.45rem;color:var(--text-secondary);font-size:.63rem}
.course-directory-main{min-width:0;padding:1.35rem 1.5rem 3rem}.courses-card{padding:1.45rem 1.6rem;border:1px solid var(--border-color);border-radius:16px;background:var(--background-primary);box-shadow:0 8px 24px color-mix(in srgb,var(--card-hover-shadow) 70%,transparent)}.courses-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;margin-bottom:1.2rem}.courses-card-header h1{margin:0;color:var(--text-primary);font-size:clamp(1.85rem,3vw,2.4rem);line-height:1.1;letter-spacing:-.04em}.courses-card-header p{margin:.35rem 0 0;color:var(--text-secondary);font-size:.88rem}.courses-card-header .btn{display:inline-flex;align-items:center;gap:.5rem;min-height:46px;padding:.7rem 1.05rem;white-space:nowrap}.courses-card-header .material-symbols-outlined{font-size:1.15rem}
.courses-controls{display:grid;grid-template-columns:minmax(0,1fr) 165px;gap:.75rem}.course-search-wrap{position:relative;display:block}.course-search-wrap>.material-symbols-outlined{position:absolute;top:50%;left:.9rem;z-index:1;transform:translateY(-50%);color:var(--text-secondary);font-size:1.12rem}.courses-input,.courses-select,.courses-textarea{width:100%;border:1px solid var(--border-color);outline:0;background:var(--background-primary);color:var(--text-primary);font:inherit}.courses-input,.courses-select{height:43px;border-radius:11px}.courses-input{padding:.65rem .85rem .65rem 2.65rem}.courses-select{padding:.65rem .8rem;background:var(--background-secondary);font-size:.76rem}.courses-input:focus,.courses-select:focus,.courses-textarea:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 12%,transparent)}
.course-filter-chips{display:flex;gap:.55rem;margin-top:1rem;overflow-x:auto;scrollbar-width:none}.course-filter-chips::-webkit-scrollbar{display:none}.course-filter-chips button{min-width:max-content;padding:.55rem 1rem;border:1px solid var(--border-color);border-radius:999px;background:var(--background-primary);color:var(--text-primary);font:inherit;font-size:.72rem;font-weight:700;cursor:pointer}.course-filter-chips button:hover{border-color:color-mix(in srgb,var(--primary-color) 40%,var(--border-color))}.course-filter-chips button.active{border-color:var(--primary-color);color:var(--primary-color);background:color-mix(in srgb,var(--primary-color) 6%,var(--background-primary))}
.course-directory-content{display:grid;grid-template-columns:minmax(0,1fr) 305px;gap:1.15rem;margin-top:1rem}.course-feed-column{min-width:0}.featured-course-group{position:relative;min-height:260px;overflow:hidden;padding:1.35rem;border-radius:15px;background:#071a2a center/cover no-repeat;color:#fff;box-shadow:0 12px 30px rgba(2,15,28,.16)}.featured-course-group::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,15,28,.96) 0%,rgba(2,15,28,.78) 43%,rgba(2,15,28,.1) 82%)}.featured-course-content{position:relative;z-index:1;display:flex;flex-direction:column;min-height:232px;align-items:flex-start}.featured-course-badge{padding:.32rem .58rem;border-radius:6px;background:var(--primary-color);font-size:.63rem;font-weight:800;letter-spacing:.04em}.featured-course-price{position:absolute;top:-.8rem;right:-.8rem;padding:.55rem .75rem;border-radius:10px;background:#fff;color:#0f172a;font-size:.75rem;font-weight:800}.featured-course-group h2{margin:.85rem 0 .38rem;color:#fff;font-size:1.55rem;letter-spacing:-.03em}.featured-course-group p{max-width:390px;margin:0;color:#e2e8f0;font-size:.82rem;line-height:1.55}.featured-course-tags{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.85rem}.featured-course-tags span{padding:.35rem .65rem;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.14);font-size:.65rem}.featured-course-meta{display:flex;align-items:center;gap:.75rem;margin-top:auto}.featured-course-avatar{display:grid;width:38px;height:38px;overflow:hidden;place-items:center;border:2px solid rgba(255,255,255,.75);border-radius:50%;background:#fff;color:#0f172a;font-weight:800}.featured-course-avatar img{width:100%;height:100%;object-fit:cover}.featured-course-meta strong{display:block;color:#fff;font-size:.72rem}.featured-course-meta small{display:block;margin-top:.15rem;color:#cbd5e1;font-size:.64rem}.featured-open-group{margin-left:auto;padding:.58rem .75rem;border:1px solid rgba(255,255,255,.32);border-radius:9px;background:rgba(255,255,255,.12);color:#fff;font:inherit;font-size:.68rem;font-weight:800;cursor:pointer}
.course-section-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:1rem .5rem .65rem}.course-section-heading h2{margin:0;color:var(--text-primary);font-size:.95rem}.course-section-heading span{color:var(--text-secondary);font-size:.68rem}.course-groups-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.course-group-row{position:relative;display:flex;min-width:0;overflow:hidden;flex-direction:column;border:1px solid var(--border-color);border-radius:13px;background:var(--background-primary);box-shadow:0 6px 18px color-mix(in srgb,var(--card-hover-shadow) 55%,transparent);transition:transform .18s,border-color .18s,box-shadow .18s}.course-group-row:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--primary-color) 34%,var(--border-color));box-shadow:0 13px 26px var(--card-hover-shadow)}.cg-cover{position:relative;height:130px;overflow:hidden;background:var(--background-secondary)}.cg-cover img{width:100%;height:100%;object-fit:cover;transition:transform .35s}.course-group-row:hover .cg-cover img{transform:scale(1.035)}.cg-plan{position:absolute;top:.55rem;left:.55rem;padding:.28rem .5rem;border-radius:5px;background:#dcfce7;color:#15803d;font-size:.58rem;font-weight:900}.cg-plan.paid{background:#e2e8f0;color:#0f172a}.cg-save{position:absolute;top:.5rem;right:.5rem;display:grid;width:30px;height:30px;place-items:center;border:1px solid color-mix(in srgb,var(--primary-color) 45%,#fff);border-radius:8px;background:rgba(255,255,255,.9);color:var(--primary-color);cursor:pointer}.cg-save .material-symbols-outlined{font-size:1.05rem}.cg-save.saved{background:var(--primary-color);color:#fff}.cg-card-body{display:flex;min-height:210px;flex:1;flex-direction:column;padding:.75rem}.cg-author-row{display:flex;align-items:center;gap:.5rem}.cg-avatar{display:grid;flex:0 0 30px;width:30px;height:30px;overflow:hidden;place-items:center;border-radius:50%;background:var(--background-secondary);color:var(--text-primary);font-size:.6rem;font-weight:800}.cg-avatar img{width:100%;height:100%;object-fit:cover}.cg-title{margin:0;color:var(--text-primary);font-size:.8rem;font-weight:800;line-height:1.3}.cg-creator{margin:.13rem 0 0;color:var(--text-secondary);font-size:.61rem}.cg-desc{display:-webkit-box;overflow:hidden;margin:.6rem 0;color:var(--text-secondary);font-size:.68rem;line-height:1.45;-webkit-box-orient:vertical;-webkit-line-clamp:2}.cg-tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:auto}.cg-tags span{padding:.3rem .48rem;border-radius:6px;background:var(--background-secondary);color:var(--text-secondary);font-size:.57rem}.cg-card-footer{display:flex;align-items:center;gap:.65rem;margin-top:.65rem;padding-top:.65rem;border-top:1px solid var(--border-color);color:var(--text-secondary);font-size:.6rem}.cg-card-footer>span{display:flex;align-items:center;gap:.2rem}.cg-card-footer .material-symbols-outlined{font-size:.85rem}.cg-open{margin-left:auto;padding:.45rem .62rem;border:1px solid color-mix(in srgb,var(--primary-color) 56%,var(--border-color));border-radius:8px;background:transparent;color:var(--primary-color);font:inherit;font-size:.6rem;font-weight:800;cursor:pointer}.cg-open.following{background:var(--primary-color);color:#fff}
.courses-empty{display:grid;min-height:260px;place-items:center;padding:2rem;border:1px dashed var(--border-color);border-radius:14px;background:var(--background-primary);color:var(--text-secondary);text-align:center}.courses-empty .material-symbols-outlined{font-size:2.4rem}.courses-empty h3{margin:.5rem 0 0;color:var(--text-primary)}.courses-empty p{margin:.2rem 0}.hidden{display:none!important}
.course-discovery-rail{display:grid;align-content:start;gap:.75rem}.course-rail-card,.course-earn-card{padding:1rem;border:1px solid var(--border-color);border-radius:13px;background:var(--background-primary);box-shadow:0 5px 16px color-mix(in srgb,var(--card-hover-shadow) 48%,transparent)}.course-rail-card>h3,.course-rail-heading h3,.course-earn-card h3{margin:0;color:var(--text-primary);font-size:.78rem}.course-rail-heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.8rem}.course-rail-heading button,.course-rail-heading span{border:0;background:transparent;color:var(--text-secondary);font:inherit;font-size:.6rem;cursor:pointer}.trending-group-list{display:grid;gap:.72rem;margin:0;padding:0;list-style:none;counter-reset:trend}.trending-group-list li{display:grid;grid-template-columns:16px 42px minmax(0,1fr);align-items:center;gap:.55rem;counter-increment:trend;cursor:pointer}.trending-group-list li::before{content:counter(trend);color:var(--text-primary);font-size:.65rem}.trend-thumb{width:42px;height:42px;overflow:hidden;border-radius:9px;background:var(--background-secondary)}.trend-thumb img{width:100%;height:100%;object-fit:cover}.trend-copy{min-width:0}.trend-copy strong{display:block;overflow:hidden;color:var(--text-primary);font-size:.67rem;text-overflow:ellipsis;white-space:nowrap}.trend-copy span,.trend-copy small{display:block;color:var(--text-secondary);font-size:.56rem}.recommended-creators{display:grid;gap:.65rem}.recommended-creator{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:.55rem}.recommended-creator img,.creator-fallback{display:grid;width:32px;height:32px;overflow:hidden;place-items:center;border-radius:50%;background:var(--background-secondary);object-fit:cover;color:var(--text-primary);font-size:.55rem;font-weight:800}.recommended-creator strong{display:block;overflow:hidden;color:var(--text-primary);font-size:.65rem;text-overflow:ellipsis;white-space:nowrap}.recommended-creator small{display:block;color:var(--text-secondary);font-size:.55rem}.recommended-creator button{padding:.35rem .6rem;border:1px solid color-mix(in srgb,var(--primary-color) 35%,var(--border-color));border-radius:7px;background:transparent;color:var(--primary-color);font:inherit;font-size:.56rem;font-weight:800;cursor:pointer}.recommended-creator button.following{background:var(--primary-color);color:#fff}.popular-topic-cloud{display:flex;flex-wrap:wrap;gap:.42rem;margin-top:.75rem}.popular-topic-cloud button{padding:.35rem .5rem;border:0;border-radius:6px;background:var(--background-secondary);color:var(--text-secondary);font:inherit;font-size:.56rem;cursor:pointer}.course-earn-card{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:linear-gradient(135deg,color-mix(in srgb,var(--primary-color) 7%,var(--background-primary)),var(--background-primary))}.course-earn-card p{margin:.35rem 0 .65rem;color:var(--text-secondary);font-size:.62rem}.course-earn-card button{padding:.4rem .65rem;border:1px solid var(--primary-color);border-radius:7px;background:transparent;color:var(--primary-color);font:inherit;font-size:.56rem;font-weight:800;cursor:pointer}.course-earn-card>.material-symbols-outlined{color:var(--primary-color);font-size:2.7rem}
.backdrop{position:fixed;z-index:9998;inset:0;background:rgba(15,23,42,.62);backdrop-filter:blur(4px)}.modal{position:fixed;z-index:9999;top:50%;left:50%;width:min(570px,calc(100% - 2rem));max-height:min(88vh,760px);overflow:auto;transform:translate(-50%,-50%);border:1px solid var(--border-color);border-radius:18px;background:var(--background-primary);box-shadow:0 26px 70px rgba(0,0,0,.32);animation:course-modal-in .18s ease-out}.modalHeader,.modalFooter{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.15rem}.modalHeader{border-bottom:1px solid var(--border-color)}.modalFooter{justify-content:flex-end;border-top:1px solid var(--border-color)}.modalHeader h3{margin:0;color:var(--text-primary)}.modalBody{display:grid;gap:.55rem;padding:1.1rem}.modal-close-btn{display:grid;width:34px;height:34px;place-items:center;border:1px solid var(--border-color);border-radius:9px;background:var(--background-secondary);color:var(--text-primary);font-size:1.25rem;cursor:pointer}.label{margin-top:.35rem;color:var(--text-primary);font-size:.76rem;font-weight:700}.courses-textarea{min-height:110px;padding:.75rem .85rem;border-radius:11px;resize:vertical}.hint{margin:.35rem 0;color:var(--text-secondary);font-size:.7rem;line-height:1.5}.error{padding:.75rem;border:1px solid #fecaca;border-radius:9px;background:#fef2f2;color:#b91c1c;font-size:.72rem}@keyframes course-modal-in{from{opacity:0;transform:translate(-50%,-47%) scale(.98)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media(max-width:1280px){.course-directory-content{grid-template-columns:minmax(0,1fr) 270px}.course-groups-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1050px){.course-social-shell{grid-template-columns:1fr}.course-browser-sidebar{position:static;z-index:2;display:flex;height:auto;overflow-x:auto;padding:.65rem 1rem;border-right:0;border-bottom:1px solid var(--border-color);gap:.55rem}.course-browser-sidebar>.course-side-label,.course-browser-sidebar>.course-side-divider,.course-browser-sidebar>.course-category-nav,.course-browser-sidebar>.course-creator-cta{display:none}.course-side-nav{display:flex;min-width:max-content}.course-side-nav button{width:auto}.course-directory-main{padding:1rem}.course-directory-content{grid-template-columns:minmax(0,1fr) 260px}}
@media(max-width:820px){.course-directory-content{grid-template-columns:1fr}.course-discovery-rail{grid-template-columns:repeat(2,minmax(0,1fr))}.course-discovery-rail .course-earn-card{grid-column:1/-1}.featured-course-group{min-height:240px}.course-groups-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.course-directory-main{padding:.75rem}.courses-card{padding:1rem}.courses-card-header{align-items:stretch;flex-direction:column}.courses-card-header .btn{justify-content:center;width:100%}.courses-controls{grid-template-columns:1fr}.course-filter-chips{margin-inline:-.15rem}.course-directory-content{margin-top:.75rem}.featured-course-group{min-height:300px;padding:1rem}.featured-course-content{min-height:270px}.featured-course-price{top:-.55rem;right:-.55rem}.featured-course-meta{align-items:flex-start;flex-wrap:wrap}.featured-open-group{width:100%;margin-left:0}.course-groups-list{grid-template-columns:1fr}.cg-cover{height:165px}.course-discovery-rail{grid-template-columns:1fr}.course-discovery-rail .course-earn-card{grid-column:auto}.course-section-heading{margin-inline:.15rem}.modalFooter{flex-direction:column}.modalFooter .btn{width:100%}}
.featured-course-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.featured-course-group::before{z-index:1}.featured-course-content{z-index:2}.course-rail-empty{margin:0;color:var(--text-secondary);font-size:.65rem;line-height:1.5}