*{box-sizing:border-box;margin:0;padding:0}html,body{color:#333;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.app-shell{flex-direction:column;height:100vh;display:flex}.top-bar{color:#fff;background:#2c7a2c;flex-shrink:0;align-items:center;height:48px;padding:0 20px;display:flex}.top-bar h1{margin-right:32px;font-size:18px;font-weight:600}.top-bar-tab{color:#fff;cursor:pointer;background:#ffffff26;border:none;border-radius:4px 4px 0 0;padding:8px 16px;font-size:14px}.top-bar-tab.active{background:#ffffff4d}.main-area{flex:1;display:flex;overflow:hidden}.sidebar{background:#f8f8f8;border-right:1px solid #ddd;flex-shrink:0;width:280px;padding:8px 0;overflow-y:auto}.sidebar-course{margin-bottom:4px}.sidebar-course-name{text-align:left;cursor:pointer;color:#333;background:0 0;border:none;width:100%;padding:8px 12px;font-size:13px;font-weight:600;display:block}.sidebar-course-name:hover{background:#eee}.sidebar-module{margin-left:8px}.sidebar-module-name{text-align:left;cursor:pointer;color:#555;background:0 0;border:none;width:100%;padding:6px 12px;font-size:12px;font-weight:500;display:block}.sidebar-module-name:hover{background:#eee}.sidebar-page{text-align:left;cursor:pointer;color:#666;background:0 0;border:none;width:100%;padding:4px 12px 4px 32px;font-size:12px;display:block}.sidebar-page:hover{background:#e8e8e8}.sidebar-page.active{color:#2c7a2c;background:#d4edda;font-weight:500}.content-frame{border:none;flex:1;width:100%;height:100%}.content-placeholder{color:#999;flex:1;justify-content:center;align-items:center;font-size:16px;display:flex}