.workshop-layout { display: flex; gap: 0; min-height: calc(100vh - 200px); }
.sidebar { width: 260px; background: #f8fafc; border-right: 1px solid #e5e7eb; padding: 24px 0; flex-shrink: 0; }
.sidebar-title { font-size: 13px; color: #6b7280; padding: 0 20px 12px; border-bottom: 1px solid #e5e7eb; margin-bottom: 8px; }
.sidebar-nav { list-style: none; padding: 0; margin: 0; }
.sidebar-nav li a { display: block; padding: 12px 20px; color: #374151; text-decoration: none; font-size: 14px; border-left: 3px solid transparent; transition: all 0.2s; }
.sidebar-nav li a:hover { background: #eff6ff; color: #2563eb; border-left-color: #2563eb; }
.sidebar-nav li a.active { background: #eff6ff; color: #2563eb; border-left-color: #2563eb; font-weight: 600; }
.sidebar-nav li a .num { display: inline-block; width: 24px; height: 24px; background: #e5e7eb; border-radius: 50%; text-align: center; line-height: 24px; font-size: 12px; margin-right: 8px; }
.sidebar-nav li a.active .num { background: #2563eb; color: white; }
.sidebar-nav li a.tool { background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%); border-left-color: #f59e0b; }
.sidebar-section { margin-top: 16px; padding-top: 16px; border-top: 1px solid #e5e7eb; }
.sidebar-section-title { font-size: 12px; color: #9ca3af; padding: 0 20px 8px; }
.main-content { flex: 1; padding: 40px; background: white; max-width: 900px; }
.session-header { background: linear-gradient(135deg, #1e3a5f 0%, #0d1b2a 100%); color: white; padding: 32px; border-radius: 12px; margin-bottom: 32px; }
.session-header .session-num { font-size: 14px; opacity: 0.8; margin-bottom: 8px; }
.session-header h1 { font-size: 28px; margin-bottom: 8px; }
.session-header p { font-size: 16px; opacity: 0.9; }
.objectives { background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%); border-radius: 12px; padding: 24px; margin-bottom: 32px; }
.objectives h2 { font-size: 18px; color: #1e3a5f; margin-bottom: 16px; }
.objectives ol { padding-left: 24px; margin: 0; }
.objectives li { margin-bottom: 8px; }
.section { background: #f8fafc; border-radius: 12px; padding: 28px; margin-bottom: 24px; }
.section h2 { font-size: 20px; color: #1e3a5f; margin-bottom: 16px; padding-bottom: 12px; border-bottom: 2px solid #e5e7eb; }
.section h3 { font-size: 17px; color: #1e3a5f; margin: 20px 0 12px; }
.section p { margin-bottom: 14px; color: #374151; }
.section ul, .section ol { padding-left: 24px; margin-bottom: 14px; }
.section li { margin-bottom: 6px; }
.question-box { background: #fef3c7; border-left: 4px solid #f59e0b; padding: 16px 20px; border-radius: 0 8px 8px 0; margin: 20px 0; }
.question-box strong { color: #92400e; }
.point-box { background: #f0fdf4; border-left: 4px solid #22c55e; padding: 16px 20px; border-radius: 0 8px 8px 0; margin: 20px 0; }
.point-box strong { color: #166534; }
.warning-box { background: #fef2f2; border-left: 4px solid #dc2626; padding: 16px 20px; border-radius: 0 8px 8px 0; margin: 20px 0; }
.warning-box strong { color: #991b1b; }
.data-table { width: 100%; border-collapse: collapse; margin: 20px 0; font-size: 14px; }
.data-table th { background: #1e3a5f; color: white; padding: 12px; text-align: left; }
.data-table td { padding: 12px; border-bottom: 1px solid #e5e7eb; }
.data-table tr:nth-child(even) { background: white; }
.data-table tr.highlight { background: #fef3c7; }
.data-table .right { text-align: right; }
.internal-section { background: #fef2f2; border: 2px dashed #f87171; border-radius: 12px; padding: 24px; margin: 32px 0; }
.internal-section h3 { color: #dc2626; margin-bottom: 16px; }
.worksheet { background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%); border-radius: 12px; padding: 24px; margin: 32px 0; }
.worksheet h3 { color: #92400e; margin-bottom: 16px; }
.worksheet ol { padding-left: 24px; margin: 0; }
.worksheet li { margin-bottom: 8px; }
.nav-footer { display: flex; justify-content: space-between; margin-top: 40px; padding-top: 24px; border-top: 1px solid #e5e7eb; }
.nav-footer a { color: #2563eb; text-decoration: none; font-weight: 600; }
@media (max-width: 900px) {
  .workshop-layout { flex-direction: column; }
  .sidebar { width: 100%; border-right: none; border-bottom: 1px solid #e5e7eb; padding: 16px 0; }
  .sidebar-nav { display: flex; flex-wrap: wrap; gap: 4px; padding: 0 16px; }
  .sidebar-nav li a { padding: 8px 12px; border-radius: 6px; border-left: none; font-size: 13px; }
  .sidebar-nav li a .num { width: 20px; height: 20px; line-height: 20px; font-size: 11px; margin-right: 4px; }
  .main-content { padding: 24px 16px; }
  .session-header { padding: 24px; }
  .session-header h1 { font-size: 22px; }
  .data-table { font-size: 12px; }
  .data-table th, .data-table td { padding: 8px 6px; }
}