.dashboard{position:fixed;top:0;left:0;right:0;bottom:0;overflow:hidden}.dashboard-wrapper{display:flex;height:calc(100vh - 60px);gap:0;overflow:hidden;margin-top:60px;position:relative}.dashboard-sidebar{width:280px;background:var(--light-gray);border-right:1px solid var(--border-gray);padding:0;flex-shrink:0;transition:width var(--transition-normal),margin-left var(--transition-normal);display:flex;flex-direction:column;overflow:hidden;position:relative}.dashboard-sidebar.collapsed{width:0;overflow:hidden;border-right:none}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:10px var(--spacing-md);border-bottom:1px solid var(--border-gray);background:var(--white);flex-shrink:0;min-height:48px;height:48px;position:relative}.dashboard-sidebar h3{margin:0;color:var(--text-dark);font-size:16px;font-weight:600;line-height:1}.sidebar-collapse-btn{background:none;border:none;cursor:pointer;padding:4px;display:inline-flex;align-items:center;justify-content:center;color:var(--text-light);transition:color var(--transition-fast)}.sidebar-collapse-btn svg{transition:transform var(--transition-normal)}.sidebar-collapse-btn:hover{color:var(--text-dark)}.sidebar-menu{display:flex;flex-direction:column;gap:0;padding:var(--spacing-xs) 0;flex:1;overflow-y:auto;overflow-x:hidden;min-height:0}#sidebar-menu{padding:0 10px}.sidebar-module{margin-bottom:8px}.sidebar-module-header{width:100%;padding:12px 12px;margin-top:8px;border:none;background:transparent;border-bottom:2px solid rgba(59,130,246,0.3);cursor:pointer;transition:background-color 0.2s;text-align:left}.sidebar-module-header:hover{background:rgba(59,130,246,0.05)}.sidebar-module-header.expanded{background:rgba(59,130,246,0.08)}.sidebar-module-header:first-child{margin-top:0}.module-title{display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:600;color:#1e40af;text-transform:uppercase;letter-spacing:0.5px;width:100%;line-height:1.3}.module-name{flex:1;font-size:0.85rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.collapse-indicator{font-size:0.65rem;color:#64748b;margin-left:4px;transition:transform 0.2s;flex-shrink:0;align-self:flex-start;margin-top:2px}.sidebar-module-lessons{padding:0;max-height:2000px;overflow:hidden;transition:max-height 0.3s ease-out,opacity 0.3s ease-out;opacity:1}.sidebar-module-lessons.collapsed{max-height:0;opacity:0;padding:0}.loading-lessons,.error-lessons{padding:12px 8px;text-align:center;font-size:0.85rem;color:#64748b;font-style:italic}.error-lessons{color:#dc2626}.sidebar-menu-item{background:transparent;border:none;border-left:3px solid transparent;color:var(--text-dark);padding:8px 10px;cursor:pointer;transition:background-color 0.2s,border-color 0.2s;text-align:left;display:flex;flex-direction:column;gap:4px;margin-bottom:8px;width:100%;position:relative}.sidebar-menu-item:hover{background:var(--border-gray)}.sidebar-menu-item.active{background:var(--bg-green);border-left-color:var(--green);font-weight:700;letter-spacing:-0.02em}.sidebar-menu-item.completed{position:relative}.sidebar-menu-item.active.completed{border-left-color:var(--green)}.sidebar-menu-item.completed::after{content:'✓';position:absolute;top:50%;right:16px;transform:translateY(-50%);color:var(--green);font-size:20px;font-weight:bold;line-height:1;display:flex;align-items:center;justify-content:center;width:20px;height:20px}.sidebar-menu-item:disabled{opacity:0.5;cursor:not-allowed;background:var(--light-gray)}.sidebar-menu-item.trial-locked{opacity:0.42;cursor:default;position:relative}.sidebar-menu-item.trial-locked::after{content:'🔒';position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:0.75rem}.sidebar-menu-item-num{font-size:11px;color:var(--text-light);font-weight:500}.sidebar-menu-item.active .sidebar-menu-item-num{color:var(--text-dark);font-weight:600}.sidebar-menu-item-name{font-size:14px;color:var(--text-dark);font-weight:500;padding-right:30px;line-height:1.4}.sidebar-menu-item.active .sidebar-menu-item-name{color:var(--text-dark);font-weight:600}.sidebar-menu-item-icon{font-size:20px}.sidebar-progress{padding:8px 12px;border-top:1px solid var(--border-gray);background:var(--white);flex-shrink:0;min-height:48px;max-height:48px;display:flex;flex-direction:column;justify-content:center}.progress-label{font-size:12px;color:var(--text-light);margin-bottom:6px;font-weight:500;display:flex;justify-content:space-between;align-items:center}.progress-bar-container{width:100%;height:8px;background:var(--border-gray);border-radius:4px;overflow:hidden}.progress-bar-fill{height:100%;background:linear-gradient(90deg,#4ade80,#22c55e);width:0%;transition:width 0.5s ease;border-radius:4px}.progress-text{font-size:12px;color:var(--text-dark);font-weight:600}.dashboard-content{flex:1;padding:0;background:var(--white);overflow-y:auto;transition:width var(--transition-normal)}.sidebar-toggle-float{position:fixed;left:16px;top:76px;width:40px;height:40px;background:var(--white);border:1px solid var(--border-gray);border-radius:var(--radius-md);display:none;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow-md);z-index:1000;transition:all var(--transition-fast);color:var(--text-dark)}.sidebar-toggle-float:hover{background:var(--light-gray);box-shadow:var(--shadow-lg)}.sidebar-toggle-float svg{transition:transform var(--transition-normal)}.sidebar-toggle-float.show{display:flex}.lesson-panel{background:var(--white);border-left:1px solid var(--border-gray);border-right:none;border-top:none;border-bottom:none;padding:0 var(--spacing-xl) var(--spacing-xl) var(--spacing-xl);min-height:100vh}.lesson-panel-header{margin-bottom:var(--spacing-md);padding:10px 0;border-bottom:1px solid var(--border-gray);min-height:48px;height:48px;display:flex;align-items:center}.lesson-header-row{display:flex;align-items:center;gap:var(--spacing-sm);justify-content:center;width:100%}.lesson-panel-icon{font-size:20px;line-height:1;flex-shrink:0}.lesson-title{margin:0;font-size:20px;line-height:1;color:var(--text-dark)}.lesson-panel-action{display:flex;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.lesson-panel-stats{margin-top:var(--spacing-md);padding:var(--spacing-md);background:var(--light-gray);border-radius:var(--radius-lg);border:2px solid var(--border-gray)}.lesson-panel-stats p{margin:var(--spacing-xs) 0;color:var(--text-dark);font-weight:500}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--spacing-lg);margin-top:var(--spacing-lg)}.dashboard-card{background:var(--white);border:2px solid var(--border-gray);padding:var(--spacing-lg);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm)}.dashboard-card h4{color:var(--blue);margin-bottom:var(--spacing-md);font-weight:700}.progress-bar{width:100%;height:20px;background:var(--light-gray);border-radius:10px;overflow:hidden;border:2px solid var(--border-gray)}.progress-fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--green));width:0%;transition:width 0.3s}.dashboard-card button{margin-right:var(--spacing-xs);margin-top:var(--spacing-xs)}#user-greeting{color:var(--blue);font-weight:700}.course-menu-section{grid-column:1 / -1;background:var(--white);border:2px solid var(--border-gray);padding:var(--spacing-lg);border-radius:var(--radius-xl);margin-bottom:var(--spacing-lg);box-shadow:var(--shadow-sm)}.course-menu-section h3{margin-bottom:var(--spacing-lg);color:var(--blue);font-weight:700}.lessons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--spacing-lg);margin-bottom:var(--spacing-lg)}.lesson-btn{background:var(--white);border:3px solid var(--border-gray);color:var(--text-dark);padding:var(--spacing-md);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-normal);display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);font-size:14px;text-align:center;font-weight:700;box-shadow:0 2px 8px rgba(0,0,0,0.08);min-height:100px;justify-content:center}.lesson-btn:nth-child(1){border-color:var(--purple);background:var(--white)}.lesson-btn:nth-child(1):hover:not(:disabled){box-shadow:0 4px 12px rgba(156,39,176,0.3);transform:translateY(-4px) scale(1.03)}.lesson-btn:nth-child(2){border-color:var(--blue);background:var(--white)}.lesson-btn:nth-child(2):hover:not(:disabled){box-shadow:0 4px 12px rgba(33,150,243,0.3);transform:translateY(-4px) scale(1.03)}.lesson-btn:nth-child(3){border-color:var(--teal);background:var(--white)}.lesson-btn:nth-child(3):hover:not(:disabled){box-shadow:0 4px 12px rgba(0,188,212,0.3);transform:translateY(-4px) scale(1.03)}.lesson-btn:nth-child(4){border-color:var(--green);background:var(--white)}.lesson-btn:nth-child(4):hover:not(:disabled){box-shadow:0 4px 12px rgba(76,175,80,0.3);transform:translateY(-4px) scale(1.03)}.lesson-btn:nth-child(5){border-color:var(--orange);background:var(--white)}.lesson-btn:nth-child(5):hover:not(:disabled){box-shadow:0 4px 12px rgba(255,152,0,0.3);transform:translateY(-4px) scale(1.03)}.lesson-btn:nth-child(6){border-color:var(--pink);background:var(--white)}.lesson-btn:nth-child(6):hover:not(:disabled){box-shadow:0 4px 12px rgba(233,30,99,0.3);transform:translateY(-4px) scale(1.03)}.lesson-btn.current{background:var(--white);border-color:var(--green);border-width:3px;color:var(--text-dark);font-weight:700}.lesson-btn.completed{background:var(--white);position:relative}.lesson-btn.completed::after{content:'✓';position:absolute;top:8px;right:8px;background:var(--green);color:white;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:900}.lesson-btn:disabled{opacity:0.5;cursor:not-allowed}.lesson-icon{font-size:28px}.lesson-label{color:var(--purple);font-weight:900;font-size:13px}.lesson-name{font-size:12px;color:var(--text-gray);max-height:2.4em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-weight:500}.course-stats{padding-top:var(--spacing-md);border-top:2px solid var(--border-gray);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing-md)}.course-stats p{margin:0;color:var(--text-dark);font-weight:600}.course-stats p strong{color:var(--blue);font-size:20px;font-weight:800}.completion-badge{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-md);background:rgba(0,200,83,0.2);border:2px solid var(--green);border-radius:20px;color:var(--green);font-weight:700;margin-top:var(--spacing-md)}