.player{display:flex;height:100vh;background:#f8fafc;overflow:hidden}.player-main{flex:1;display:flex;flex-direction:column;max-width:calc(100% - 360px);height:100vh;overflow:hidden}.player-video{background:#000;flex-shrink:0;position:sticky;top:0;z-index:10}.video-container{position:relative;width:100%;padding-top:56.25%;background:#0a0a0f}.video-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.video-error{display:flex;align-items:center;justify-content:center;color:#6b7280}.player-content{flex:1;padding:32px 48px;overflow-y:auto}.lesson-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.lesson-title{font-size:28px;font-weight:700;color:#1a1a2e;letter-spacing:-.5px}.member-badge{font-size:13px;color:#667eea;background:#667eea1a;padding:6px 12px;border-radius:20px;font-weight:500}.complete-btn{background:#f1f5f9;color:#64748b;border:1px solid #e2e8f0;padding:8px 16px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;flex-shrink:0}.complete-btn:hover{background:#e2e8f0;color:#475569}.complete-btn.completed{background:#ecfdf5;color:#10b981;border-color:#a7f3d0}.complete-btn.completed:hover{background:#d1fae5}.lesson-nav{display:flex;justify-content:space-between;margin-bottom:32px;padding-bottom:24px;border-bottom:1px solid #e2e8f0}.nav-btn{background:#667eea1a;color:#667eea;border:none;padding:10px 20px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease}.nav-btn:hover{background:#667eea33}.lesson-content{line-height:1.7;color:#374151}.content-loading,.content-empty{color:#64748b;font-style:italic}.ghost-content h1,.ghost-content h2,.ghost-content h3,.ghost-content h4{color:#1a1a2e;margin:1.5em 0 .5em;font-weight:600}.ghost-content h2{font-size:24px}.ghost-content h3{font-size:20px}.ghost-content p{margin:1em 0}.ghost-content img{max-width:100%;height:auto;border-radius:8px;margin:1.5em 0}.ghost-content pre{background:#1a1a2e;color:#e2e8f0;padding:16px 20px;border-radius:8px;overflow-x:auto;margin:1.5em 0}.ghost-content code{font-family:JetBrains Mono,Fira Code,monospace;font-size:14px}.ghost-content a{color:#667eea;text-decoration:none}.ghost-content a:hover{text-decoration:underline}.ghost-content ul,.ghost-content ol{margin:1em 0;padding-left:1.5em}.ghost-content li{margin:.5em 0}.ghost-content blockquote{border-left:4px solid #667eea;margin:1.5em 0;padding:.5em 0 .5em 1.5em;color:#64748b;font-style:italic}.ghost-content figure{margin:1.5em 0}.ghost-content figcaption{font-size:14px;color:#64748b;text-align:center;margin-top:8px}.ghost-content iframe{max-width:100%;border-radius:8px}.sidebar{width:360px;background:#fff;border-left:1px solid #e2e8f0;display:flex;flex-direction:column;flex-shrink:0;height:100vh;overflow:hidden}.sidebar-header{padding:24px;border-bottom:1px solid #e2e8f0;flex-shrink:0}.course-title{font-size:18px;font-weight:700;color:#1a1a2e;margin-bottom:12px}.progress-summary{display:flex;flex-direction:column;gap:6px}.progress-bar{height:6px;background:#e2e8f0;border-radius:100px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:100px;transition:width .3s ease}.progress-text{font-size:13px;color:#64748b}.sidebar-nav{flex:1;overflow-y:auto;padding:16px 0}.module{margin-bottom:8px}.module-header{display:flex;align-items:center;gap:12px;padding:12px 24px;background:#f8fafc}.module-number{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:8px;font-size:13px;font-weight:700;flex-shrink:0}.module-title{font-size:14px;font-weight:600;color:#1a1a2e}.lesson-list{list-style:none;padding:0;margin:0}.lesson-item{display:flex;align-items:center;gap:8px;width:100%;padding:12px 24px;background:none;border:none;text-align:left;cursor:pointer;transition:all .2s ease;color:#475569}.lesson-item:hover{background:#f1f5f9;color:#1a1a2e}.lesson-current{background:linear-gradient(90deg,rgba(102,126,234,.12) 0%,transparent 100%);border-left:3px solid #667eea;color:#1a1a2e;font-weight:500}.lesson-completed .lesson-name{color:#64748b}.lesson-status{flex-shrink:0;width:18px;text-align:center}.status-complete{color:#10b981;font-weight:700}.status-incomplete{color:#cbd5e1;font-size:10px}.lesson-number{font-size:12px;color:#94a3b8;font-weight:600;min-width:28px}.lesson-name{font-size:14px;line-height:1.4;flex:1}.player-loading,.player-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;text-align:center;padding:48px}.spinner{width:40px;height:40px;border:3px solid #e2e8f0;border-top-color:#667eea;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:16px}@keyframes spin{to{transform:rotate(360deg)}}.player-error h1{font-size:24px;color:#1a1a2e;margin-bottom:8px}.player-error p{color:#64748b;margin-bottom:24px}.access-denied-icon{font-size:48px;margin-bottom:16px}.upgrade-btn{display:inline-block;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:12px 24px;border-radius:8px;font-size:16px;font-weight:600;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}.upgrade-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.lesson-locked{opacity:.7}.lesson-locked:hover{background:#fef2f2}.status-locked{font-size:12px}.lesson-preview-badge{font-size:10px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:2px 6px;border-radius:4px;font-weight:600;margin-left:auto;flex-shrink:0}.preview-tag{font-size:12px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:4px 10px;border-radius:4px;font-weight:600;margin-left:12px;vertical-align:middle}.lesson-locked-view{display:flex;align-items:center;justify-content:center;min-height:400px;background:linear-gradient(135deg,#f8fafc,#f1f5f9)}.locked-overlay{text-align:center;padding:48px;max-width:420px}.locked-icon{font-size:64px;margin-bottom:24px}.locked-overlay h2{font-size:24px;color:#1a1a2e;margin-bottom:12px}.locked-overlay p{color:#64748b;margin-bottom:24px;line-height:1.6}.preview-hint{font-size:14px;color:#94a3b8;margin-top:24px}.preview-hint .preview-badge{display:inline-block;font-size:10px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:2px 6px;border-radius:4px;font-weight:600;vertical-align:middle}.preview-upgrade-cta{margin-top:48px;padding:32px;background:linear-gradient(135deg,#667eea14,#764ba214);border-radius:12px;text-align:center}.preview-upgrade-cta p{color:#1a1a2e;font-size:16px;margin-bottom:16px}.sidebar-nav::-webkit-scrollbar,.player-content::-webkit-scrollbar{width:6px}.sidebar-nav::-webkit-scrollbar-track,.player-content::-webkit-scrollbar-track{background:transparent}.sidebar-nav::-webkit-scrollbar-thumb,.player-content::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:100px}.sidebar-nav::-webkit-scrollbar-thumb:hover,.player-content::-webkit-scrollbar-thumb:hover{background:#94a3b8}@media(max-width:1024px){.player{flex-direction:column;height:auto;overflow:auto}.player-main{max-width:100%;height:auto;overflow:visible}.player-video{position:relative}.player-content{overflow:visible}.sidebar{width:100%;height:auto;border-left:none;border-top:1px solid #e2e8f0}.player-content{padding:24px}}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;font-size:16px;line-height:1.5;color:#1a1a2e;background:#f8fafc;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.error-page{display:flex;align-items:center;justify-content:center;min-height:100vh;font-size:18px;color:#64748b}
