.menu-tree-container{width:100%;height:100%;overflow-y:auto;background-color:#fff;border-radius:8px;padding:12px}.menu-tree{width:92%}.menu-item{margin-bottom:4px}.menu-item.level-0{padding-left:0}.menu-item.level-1{padding-left:10px}.menu-item.level-2{padding-left:20px}.menu-label{display:flex;align-items:center;padding:10px 12px;cursor:pointer;border-radius:6px;transition:all .2s ease;-webkit-user-select:none;user-select:none;background-color:#f8f9fa}.menu-label:hover{background-color:#e9ecef}.menu-label.selected{background-color:var(--primary-color, #1976d2);color:#fff;font-weight:600;box-shadow:0 4px 8px #0000001a}.menu-label.inactive{opacity:.5;cursor:not-allowed}.menu-label.inactive:hover{background-color:#f8f9fa}.expand-icon{display:inline-block;width:16px;height:16px;margin-right:8px;font-size:10px;transition:transform .2s ease;color:#6c757d}.expand-icon.expanded{transform:rotate(90deg)}.menu-label.selected .expand-icon{color:#fff}.menu-name{flex:1;font-size:14px}.menu-description{font-size:12px;color:#6c757d;margin-left:8px}.menu-label.selected .menu-description{color:#000000b3}.menu-children{margin-top:4px;padding-left:8px;border-left:2px solid #e9ecef}.loading,.error,.empty{padding:20px;text-align:center;color:#6c757d;font-size:14px}.error{color:#dc3545}.retry-btn{margin-top:12px;padding:8px 16px;background-color:var(--primary-color, #1976d2);color:#fff;border:none;border-radius:15px;cursor:pointer;font-size:14px;box-shadow:0 4px 8px #0000001a;transition:all .3s ease}.retry-btn:hover{background-color:var(--secondary-color, #dc004e);transform:translateY(-2px);box-shadow:0 8px 16px #0003}.menu-tree-container::-webkit-scrollbar{width:8px}.menu-tree-container::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.menu-tree-container::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.menu-tree-container::-webkit-scrollbar-thumb:hover{background:#555}@media (max-width: 768px){.menu-tree-container{padding:8px}.menu-label{padding:8px 10px;font-size:13px}.menu-item.level-1{padding-left:16px}.menu-item.level-2{padding-left:32px}}.video-player-container{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#000;border-radius:8px;overflow:hidden;position:relative;aspect-ratio:16 / 9;max-width:100%}.video-element{aspect-ratio:16 / 9;width:auto;height:auto;max-width:100%;max-height:calc(100% - 50px);object-fit:contain;cursor:pointer}.video-controls{height:50px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;background-color:#000c;color:#fff}.play-pause-btn{width:40px;height:40px;background-color:gold;color:#000;border:none;border-radius:50%;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:all .3s ease;flex-shrink:0;box-shadow:0 4px 8px #0000001a}.play-pause-btn:hover:not(:disabled){background-color:orange;transform:scale(1.1);box-shadow:0 8px 16px #0003}.play-pause-btn:disabled{opacity:.5;cursor:not-allowed}.time-display{font-size:14px;font-weight:600;white-space:nowrap;flex-shrink:0}.progress-bar{flex:1;height:6px;background-color:#ffffff4d;border-radius:3px;cursor:pointer;position:relative;overflow:hidden}.progress-filled{height:100%;background-color:gold;border-radius:3px;transition:width .1s linear}.progress-bar:hover{height:8px}.playback-rate-display{font-size:13px;font-weight:600;width:40px;text-align:right;flex-shrink:0}.video-loading,.video-error,.video-empty{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:16px;text-align:center;padding:20px}.video-error{color:#dc3545;background-color:#000c;border-radius:8px}.video-empty{color:#6c757d}@media (max-width: 768px){.video-controls{padding:10px 12px;gap:8px}.play-pause-btn{width:36px;height:36px;font-size:16px}.time-display{font-size:12px}.playback-rate-display{font-size:12px;width:35px}}.video-player-container:fullscreen{background-color:#000}.video-player-container:-webkit-full-screen{background-color:#000}.video-player-container:-moz-full-screen{background-color:#000}.video-player-container:-ms-fullscreen{background-color:#000}.video-controls-panel{display:flex;flex-direction:column;gap:20px;padding:20px;background-color:#fff;border-radius:8px;height:100%;overflow-y:auto}.control-section{border-bottom:1px solid #e9ecef;padding-bottom:16px}.control-section:last-child{border-bottom:none;padding-bottom:0}.control-title{margin:0 0 12px;font-size:14px;font-weight:600;color:#212529}.speed-controls{display:flex;align-items:center;gap:12px;justify-content:center}.speed-btn{width:40px;height:40px;background-color:var(--primary-color, #1976d2);color:#fff;border:none;border-radius:15px;font-size:20px;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 8px #0000001a}.speed-btn:hover:not(:disabled){background-color:var(--secondary-color, #dc004e);transform:translateY(-2px);box-shadow:0 8px 16px #0003}.speed-btn:disabled{background-color:#6c757d;cursor:not-allowed;opacity:.5}.speed-display{min-width:60px;padding:10px 16px;background-color:var(--background-color, #f5f5f5);border:2px solid var(--primary-color, #1976d2);border-radius:15px;font-size:18px;font-weight:700;text-align:center;color:var(--primary-color, #1976d2);cursor:pointer;transition:all .3s ease}.speed-display:hover{background-color:var(--primary-color, #1976d2);border-color:var(--secondary-color, #dc004e);color:#fff;transform:scale(1.05)}.speed-info{margin-top:8px;font-size:12px;color:#6c757d;text-align:center}.subtitle-controls{display:flex;flex-direction:column;gap:12px}.subtitle-toggle{display:flex;align-items:center;gap:10px;padding:12px;background-color:#f8f9fa;border-radius:6px;cursor:pointer;transition:background-color .2s ease}.subtitle-toggle:hover{background-color:#e9ecef}.subtitle-toggle input[type=checkbox],.subtitle-toggle input[type=radio]{width:20px;height:20px;cursor:pointer;accent-color:var(--primary-color, #1976d2)}.toggle-label{font-size:14px;font-weight:500;color:#212529;-webkit-user-select:none;user-select:none}.subtitle-info{margin-top:8px;font-size:12px;color:#6c757d}.combined-controls{display:flex;flex-direction:column;gap:20px}.subtitle-language-controls{display:flex;gap:12px;justify-content:center}.subtitle-row-layout{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:10px}.control-section.tips{background-color:#f0f8ff;padding:16px;border-radius:6px;border:none}.tips-list{margin:0;padding-left:20px;font-size:13px;color:#495057;line-height:1.8}.tips-list li{margin-bottom:6px}.tips-list li:last-child{margin-bottom:0}.tip-section{margin-top:12px;text-align:center}.tip-toggle{padding:6px 12px;background-color:var(--primary-color, #1976d2);color:#fff;border:none;border-radius:15px;cursor:pointer;font-size:14px;box-shadow:0 4px 8px #0000001a;transition:all .3s ease}.tip-toggle:hover{background-color:var(--secondary-color, #dc004e);transform:translateY(-2px);box-shadow:0 8px 16px #0003}.tip-content{margin-top:8px;padding:8px 12px;background-color:#000c;color:#fff;border-radius:4px;font-size:12px}.video-controls-panel::-webkit-scrollbar{width:8px}.video-controls-panel::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.video-controls-panel::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.video-controls-panel::-webkit-scrollbar-thumb:hover{background:#555}@media (max-width: 768px){.video-controls-panel{padding:16px;gap:16px}.speed-controls{gap:10px}.speed-btn{width:36px;height:36px;font-size:18px}.speed-display{min-width:50px;padding:8px 12px;font-size:16px}.subtitle-toggle{padding:10px}.control-section.tips{padding:12px}.tips-list{font-size:12px}}.row-layout{display:flex;align-items:center;justify-content:space-between;gap:16px}.speed-controls.compact,.subtitle-controls.compact,.subtitle-language-controls.compact{display:flex;align-items:center;gap:8px}.speed-btn.compact{width:30px;height:30px;font-size:14px}.speed-display.compact{min-width:50px;padding:6px 10px;font-size:14px}.subtitle-toggle.compact .toggle-label{font-size:12px}.subtitle-display{width:100%;height:100%;overflow-y:auto;background-color:#fff;border-radius:8px;padding:16px}.subtitle-list{display:flex;flex-direction:column;gap:12px}.subtitle-item{display:flex;gap:12px;padding:12px;border-radius:6px;background-color:#f8f9fa;cursor:pointer;transition:all .2s ease}.subtitle-item:hover{background-color:#e9ecef;transform:translate(4px)}.subtitle-item.active{background:linear-gradient(135deg,var(--primary-color, #1976d2),var(--secondary-color, #dc004e));border-left:4px solid var(--secondary-color, #dc004e);font-weight:500;box-shadow:0 4px 8px #0000001a}.subtitle-time{flex-shrink:0;width:50px;font-size:12px;color:#6c757d;font-weight:600;line-height:1.6}.subtitle-item.active .subtitle-time{color:#fff;font-weight:700}.subtitle-content{flex:1;display:flex;flex-direction:column;gap:6px}.subtitle-line{font-size:14px;line-height:1.6;word-break:break-word}.subtitle-line.english{color:#212529}.subtitle-line.korean{color:#495057;font-size:13px}.subtitle-item.active .subtitle-line.english{color:#fff}.subtitle-item.active .subtitle-line.korean{color:#ffffffe6}.subtitle-empty{padding:40px 20px;text-align:center;color:#6c757d;font-size:14px}.subtitle-display::-webkit-scrollbar{width:8px}.subtitle-display::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.subtitle-display::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.subtitle-display::-webkit-scrollbar-thumb:hover{background:#555}@media (max-width: 768px){.subtitle-display{padding:12px}.subtitle-item{padding:10px;gap:10px}.subtitle-time{width:45px;font-size:11px}.subtitle-line{font-size:13px}.subtitle-line.korean{font-size:12px}}.video-learning-container{display:flex;flex-direction:column;height:100%;background:linear-gradient(135deg,var(--primary-color, #1976d2),var(--secondary-color, #dc004e))}.learning-content{display:grid;grid-template-columns:300px 1fr;gap:16px;padding:16px;flex:1;overflow:hidden}.menu-sidebar{display:flex;flex-direction:column;background-color:#fff;border-radius:20px;box-shadow:0 10px 30px #0003;overflow:hidden}.menu-sidebar h3{margin:0;padding:16px;background-color:var(--primary-color, #1976d2);color:#fff;font-size:16px;font-weight:600}.video-area{display:flex;flex-direction:column;background-color:#fff;border-radius:20px;box-shadow:0 10px 30px #0003;overflow:hidden}.content-header{padding:20px;border-bottom:1px solid #e9ecef;flex-shrink:0}.content-header h2{margin:0 0 8px;font-size:20px;color:#212529}.content-header p{margin:0;font-size:14px;color:#6c757d}.content-body{display:grid;grid-template-columns:1fr 400px;gap:0;flex:1;overflow:hidden}.left-column{display:flex;flex-direction:column;overflow:hidden;border-right:1px solid #e9ecef}.video-player-wrapper{flex:1;padding:16px;display:flex;align-items:center;justify-content:center;background-color:#000;min-height:300px}.controller-area{flex-shrink:0;border-top:1px solid #e9ecef;border-bottom:1px solid #e9ecef;background-color:#fff}.use-tip-area{flex-shrink:0;background-color:#f8f9fa;padding:16px}.use-tip-area .control-section.tips{padding:0}.use-tip-area .control-title{margin:0 0 12px;font-size:14px;font-weight:600;color:#212529}.use-tip-area .tips-list{margin:0;padding-left:20px;list-style-type:disc}.use-tip-area .tips-list li{font-size:13px;color:#495057;margin-bottom:6px;line-height:1.5}.subtitle-area{display:flex;flex-direction:column;overflow:hidden;background-color:#f8f9fa}.content-list-area{padding:20px;overflow-y:auto}.content-list-area h3{margin:0 0 20px;font-size:18px;color:#212529}.content-list{display:flex;flex-direction:column;gap:16px}.content-item{display:flex;gap:16px;padding:16px;background-color:var(--background-color, #f5f5f5);border-radius:15px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 8px #0000001a}.content-item:hover{background:linear-gradient(135deg,var(--primary-color, #1976d2),var(--secondary-color, #dc004e));color:#fff;transform:translateY(-5px);box-shadow:0 8px 16px #0003}.content-item:hover h4,.content-item:hover p,.content-item:hover .content-meta{color:#fff}.content-thumbnail{width:120px;height:80px;flex-shrink:0;border-radius:6px;overflow:hidden;background-color:#dee2e6;display:flex;align-items:center;justify-content:center}.content-thumbnail img{width:100%;height:100%;object-fit:cover}.no-thumbnail{font-size:32px}.content-info{flex:1;display:flex;flex-direction:column;gap:6px}.content-info h4{margin:0;font-size:16px;color:#212529;font-weight:600}.content-info p{margin:0;font-size:14px;color:#6c757d;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.content-meta{display:flex;gap:12px;font-size:12px;color:#868e96}.empty-state{display:flex;align-items:center;justify-content:center;height:100%;color:#6c757d}.empty-state h3{font-size:18px;font-weight:500}.loading,.empty{padding:40px;text-align:center;color:#6c757d;font-size:14px}.subtitle-section{flex:1;background-color:#fff;display:flex;flex-direction:column;overflow:hidden;min-height:0}.subtitle-section h4{margin:0;padding:16px;background-color:#e9ecef;border-bottom:1px solid #dee2e6;font-size:14px;font-weight:600;color:#212529;flex-shrink:0}.subtitle-section>div{flex:1;min-height:0;overflow-y:auto}.footer{padding:16px;background-color:#fff;border-top:1px solid #dee2e6;text-align:center;flex-shrink:0}.footer p{margin:0;font-size:13px;color:#6c757d}.content-list-area::-webkit-scrollbar,.subtitle-section>div::-webkit-scrollbar{width:8px}.content-list-area::-webkit-scrollbar-track,.subtitle-section>div::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.content-list-area::-webkit-scrollbar-thumb,.subtitle-section>div::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.content-list-area::-webkit-scrollbar-thumb:hover,.subtitle-section>div::-webkit-scrollbar-thumb:hover{background:#555}@media (max-width: 1200px){.learning-content{grid-template-columns:250px 1fr}.content-body{grid-template-columns:1fr 350px}}@media (max-width: 992px){.learning-content{grid-template-columns:1fr;grid-template-rows:auto 1fr}.menu-sidebar{max-height:300px;overflow-y:auto}.content-body{grid-template-columns:1fr;grid-template-rows:auto 1fr}.left-column{border-right:none;border-bottom:1px solid #e9ecef}}@media (max-width: 768px){.header{padding:12px 16px}.header-left h1{font-size:20px}.header-right{gap:8px}.btn-header{padding:6px 12px;font-size:13px}.user-info{display:none}.learning-content{padding:12px;gap:12px}.content-header{padding:16px}.content-header h2{font-size:18px}.content-list-area{padding:16px}.content-thumbnail{width:100px;height:70px}}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box}@media print{@page{margin:0!important;size:A4 portrait}nav,header,footer,.sidebar,.navigation,.menu,.nav,.header,.footer,.controls,button,input[type=button],input[type=submit],.no-print,.MuiDrawer-root,.MuiAppBar-root{display:none!important;visibility:hidden!important}.print-content,.print-preview,.print-area{width:100%!important;margin:0!important;padding:0!important;display:block!important}*{page-break-inside:avoid;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;box-sizing:border-box!important}html,body,#root,#root>div{margin:0!important;padding:0!important;width:100%!important;height:auto!important;overflow:visible!important;background:#fff!important}html::-webkit-scrollbar,body::-webkit-scrollbar,*::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}.print-page{page-break-after:always;page-break-inside:avoid;margin:0!important;padding:0!important}.print-page:last-child{page-break-after:auto}.MuiBox-root:not(.print-area),.MuiContainer-root:not(.print-area){all:unset!important}}