.split-gutter{cursor:col-resize;pointer-events:auto;background:#e0e0e0;justify-content:center;align-items:center;gap:2px;width:2px;height:100%;transition:opacity .2s;display:flex;position:relative}.gutter-arrow{border-top:6px solid #0000;border-bottom:6px solid #0000;width:0;height:0}.gutter-arrow:first-child{border-right:6px solid var(--color-muted)}.gutter-arrow:last-child{border-left:6px solid var(--color-muted)}.split-gutter:hover .gutter-arrow{opacity:1}
@keyframes skeleton-loading{0%{background-position:-200px 0}to{background-position:calc(200px + 100%) 0}}.skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%) 0 0/200px 100%;animation:1.5s infinite skeleton-loading}.loading-sidebar{background:var(--color-surface);border-right:1px solid var(--color-line);z-index:1000;width:300px;height:100vh;padding:20px;position:fixed;top:0;left:0}.loading-course-title.skeleton{border-radius:6px;width:80%;height:32px;margin-bottom:24px}.loading-sections{flex-direction:column;gap:20px;display:flex}.loading-section-title.skeleton{border-radius:4px;width:70%;height:24px;margin-bottom:12px}.loading-lessons{flex-direction:column;gap:8px;padding-left:12px;display:flex}.loading-lesson.skeleton{border-radius:4px;width:90%;height:20px}.loading-lesson-view{background:var(--color-surface-warm-soft);flex-direction:column;height:100vh;margin-left:300px;display:flex}.loading-content{flex-direction:column;flex:1;gap:16px;width:100%;max-width:800px;margin:0 auto;padding:40px;display:flex}.loading-lesson-title.skeleton{border-radius:8px;width:60%;height:40px;margin-bottom:24px}.loading-lesson-text.skeleton{border-radius:4px;width:100%;height:16px}.loading-lesson-text.skeleton.short{width:75%}.loading-code-block.skeleton{border-radius:8px;width:100%;height:120px;margin:20px 0}.loading-navigation{border-top:1px solid var(--color-line);background:var(--color-surface-warm-soft);justify-content:space-between;align-items:center;padding:16px 40px;display:flex}.loading-nav-button.skeleton{border-radius:8px;width:120px;height:40px}.loading-nav-count.skeleton{border-radius:4px;width:60px;height:24px}@media (max-width:992px){.loading-sidebar{width:250px}.loading-lesson-view{margin-left:250px}.loading-content{padding:20px}.loading-navigation{padding:12px 20px}}@media (max-width:768px){.loading-sidebar{align-items:center;width:100%;height:60px;padding:12px 20px;display:flex;position:relative}.loading-lesson-view{height:calc(100vh - 60px);margin-left:0}.loading-sections{display:none}.loading-course-title.skeleton{width:200px;height:24px;margin-bottom:0}}
.feedback-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:9999;background-color:#00000080;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.feedback-modal{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);font-family:var(--font-family);width:100%;max-width:500px;max-height:90vh;overflow-y:auto}.feedback-modal-header{border-bottom:1px solid var(--color-line);grid-template-columns:1fr auto 1fr;align-items:center;padding:1.5rem 1.5rem 1rem;display:grid}.feedback-modal-header h3{color:var(--color-ink);text-align:center;grid-area:1/1/auto/-1;margin:0;font-size:1.25rem;font-weight:600}.feedback-modal-close{color:var(--color-muted);cursor:pointer;z-index:1;background:0 0;border:none;border-radius:6px;grid-area:1/3;justify-content:center;justify-self:end;align-items:center;padding:.5rem;transition:all .2s;display:flex}.feedback-modal-close:hover{background-color:var(--color-surface-alt);color:var(--color-ink)}.feedback-modal-close:disabled{opacity:.5;cursor:not-allowed}.feedback-modal-body{padding:1.5rem}.feedback-rating-section{margin-bottom:1.5rem}.feedback-stars-container{justify-content:center;align-items:center;gap:.5rem;margin-bottom:.75rem;display:flex}.feedback-star{cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:.25rem;transition:all .2s;display:flex}.feedback-star:hover{background-color:var(--color-surface-alt);transform:scale(1.1)}.feedback-star:disabled{cursor:not-allowed;opacity:.5}.feedback-star svg{stroke:#d1d5db;fill:none;width:28px;height:28px;transition:all .2s}.feedback-star.filled svg,.feedback-star:hover svg{stroke:var(--color-amber);fill:var(--color-amber)}.feedback-rating-text{color:var(--color-muted);text-align:center;margin:0;font-size:.875rem;font-style:italic}.feedback-text-section{margin-bottom:1rem}.feedback-label{color:var(--color-ink);margin-bottom:.75rem;font-size:.875rem;font-weight:600;display:block}.feedback-optional{color:var(--color-muted);font-size:.8rem;font-weight:400}.feedback-textarea{border:2px solid var(--color-line);border-radius:var(--radius-sm);resize:vertical;box-sizing:border-box;width:100%;padding:.75rem;font-family:inherit;font-size:.875rem;line-height:1.5;transition:border-color .2s}.feedback-textarea:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #6c4df61f}.feedback-textarea::placeholder{color:var(--color-muted)}.feedback-character-count{text-align:right;color:var(--color-muted);margin-top:.5rem;font-size:.75rem;font-style:italic}.feedback-modal-footer{border-top:1px solid var(--color-line);justify-content:flex-end;gap:.75rem;padding:1rem 1.5rem 1.5rem;display:flex}.feedback-modal-cancel{border:2px solid var(--color-line);background:var(--color-surface);color:var(--color-body);border-radius:var(--radius-pill);font-weight:600;font-family:var(--font-family);cursor:pointer;padding:.75rem 1.5rem;font-size:.875rem;transition:all .2s}.feedback-modal-cancel:hover{background-color:var(--color-surface-alt);border-color:var(--color-line)}.feedback-modal-cancel:disabled{opacity:.5;cursor:not-allowed}.feedback-modal-submit{background:var(--gradient-brand);color:#fff;border-radius:var(--radius-pill);font-weight:600;font-family:var(--font-family);cursor:pointer;border:none;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:.875rem;transition:all .2s;display:flex}.feedback-modal-submit:hover:not(:disabled){box-shadow:var(--shadow-glow)}.feedback-modal-submit:disabled{opacity:.5;cursor:not-allowed;background:var(--color-muted)}.feedback-spinner{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width:640px){.feedback-modal{max-width:95vw;margin:0 .5rem}.feedback-modal-header,.feedback-modal-body,.feedback-modal-footer{padding-left:1rem;padding-right:1rem}.feedback-modal-footer{flex-direction:column-reverse}.feedback-modal-cancel,.feedback-modal-submit{justify-content:center;width:100%}}
.mobile-notification{z-index:9999;background:var(--gradient-brand);color:#fff;padding:12px 16px;animation:.3s ease-out slideDown;position:fixed;top:0;left:0;right:0;box-shadow:0 4px 12px #00000026}@keyframes slideDown{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}.mobile-notification-content{align-items:center;gap:12px;max-width:100%;display:flex}.mobile-notification-icon{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fff3;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.mobile-notification-text{flex:1;min-width:0}.mobile-notification-text h4{color:#fff;margin:0 0 4px;font-size:14px;font-weight:600;line-height:1.2}.mobile-notification-text p{color:#ffffffe6;opacity:.95;margin:0;font-size:12px;line-height:1.3}.mobile-notification-close{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fff3;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;transition:all .2s;display:flex}.mobile-notification-close:hover{background:#ffffff4d;transform:scale(1.05)}.mobile-notification-close:active{transform:scale(.95)}@media (max-width:480px){.mobile-notification{padding:10px 12px}.mobile-notification-content{gap:10px}.mobile-notification-icon{width:28px;height:28px}.mobile-notification-text h4{font-size:13px}.mobile-notification-text p{font-size:11px}.mobile-notification-close{width:24px;height:24px}}@media (prefers-color-scheme:dark){.mobile-notification{background:var(--gradient-brand)}}@media (prefers-reduced-motion:reduce){.mobile-notification{animation:none}.mobile-notification-close:hover,.mobile-notification-close:active{transform:none}}
.lesson-page{height:calc(100vh - 30px);display:flex;overflow:hidden}.lesson-view{background-color:var(--color-surface-warm-soft);flex-direction:column;flex:1;max-width:100%;height:100%;margin-left:300px;transition:all .3s;display:flex;overflow:hidden}.content-wrapper{flex-direction:column;flex:1;height:100%;display:flex;position:relative;overflow:hidden}.content-wrapper>div:first-child{flex:1;padding-bottom:70px;overflow-y:auto}.navigation-wrapper{background-color:var(--color-surface-warm-soft);border-top:1px solid var(--color-line);z-index:10;height:70px;position:fixed;bottom:0;left:300px;right:0}.lesson-navigation{background-color:var(--color-surface-warm-soft)}.lesson-view.sidebar-collapsed{margin-left:30px}.lesson-view.sidebar-collapsed .navigation-wrapper{left:30px}@media (max-width:992px){.lesson-view{margin-left:0;padding:30px;transition:none}.navigation-wrapper{left:0}}@media (max-width:820px){.lesson-page{flex-direction:column;height:calc(100vh - 120px)}.lesson-view{padding:20px 15px}.lesson-view.sidebar-collapsed{margin-left:60px}.lesson-view.sidebar-collapsed .navigation-wrapper{left:60px}}@media (max-width:480px){.lesson-view{padding:15px 10px}.lesson-view.sidebar-collapsed{margin-left:60px}.lesson-view.sidebar-collapsed .navigation-wrapper{left:60px}}.nav-tooltip-wrapper{display:inline-block;position:relative}.nav-tooltip-wrapper[data-tooltip]:before{content:attr(data-tooltip);color:#fff;white-space:nowrap;opacity:0;visibility:hidden;z-index:1000;pointer-events:none;background-color:#000c;border-radius:4px;padding:8px 12px;font-size:12px;transition:opacity .2s,visibility .2s;position:absolute;top:-20px;right:0;transform:translateY(-50%)}.nav-tooltip-wrapper:hover[data-tooltip]:before{opacity:1;visibility:visible}