html{overflow:auto!important}body{overflow:auto!important;height:auto!important}.app{overflow:auto!important;height:auto!important;min-height:100vh!important}.tutorial-content{width:100%;padding-bottom:2rem}.tutorial-content .help-panel-title{background:linear-gradient(135deg,#6366f1,#8b5cf6,#06b6d4);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.tutorial-content .help-panel-subtitle{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.tutorial-content .help-section{margin-bottom:var(--spacing-xl);background:#ffffff0d;border-radius:var(--radius-lg);padding:var(--spacing-lg);border:1px solid var(--color-border-primary)}.tutorial-content .help-section-title{font-size:1.5rem;font-weight:600;color:var(--color-text-primary);margin-bottom:var(--spacing-lg);display:flex;align-items:center;gap:var(--spacing-sm)}.tutorial-content .help-section-title:before{content:"📖";font-size:1.2rem}.tutorial-content .help-section-content{color:var(--color-text-secondary);line-height:1.6}.tutorial-content .help-steps{display:grid;gap:var(--spacing-lg)}.tutorial-content .help-step{display:flex;flex-direction:row!important;align-items:flex-start;gap:var(--spacing-md);padding:var(--spacing-md);background:#ffffff0d;border-radius:var(--radius-md)}.tutorial-content .step-number{background:var(--color-primary);color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;flex-shrink:0}.tutorial-content .help-step p{margin:0;color:var(--color-text-primary);flex:1}.tutorial-content .mode-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-lg)}.tutorial-content .mode-card{background:#ffffff14;border-radius:var(--radius-lg);padding:var(--spacing-lg);border:1px solid var(--color-border-primary);transition:all .3s ease;text-align:center}.tutorial-content .mode-card:hover{transform:translateY(-4px);background:#ffffff1f;border-color:var(--color-primary)}.tutorial-content .mode-icon{font-size:2.5rem;margin-bottom:var(--spacing-md);display:block}.tutorial-content .mode-card h4{font-size:1.2rem;font-weight:600;color:var(--color-text-primary);margin-bottom:var(--spacing-sm)}.tutorial-content .mode-card p{margin-bottom:var(--spacing-sm);color:var(--color-text-secondary)}.tutorial-content .mode-usage{color:var(--color-primary)!important;font-weight:500}.tutorial-content .mode-params{font-size:.9rem;color:var(--color-text-tertiary)!important}.tutorial-content .effects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--spacing-lg)}.tutorial-content .effect-category{background:#ffffff0d;border-radius:var(--radius-md);padding:var(--spacing-lg)}.tutorial-content .effect-category h4{color:var(--color-text-primary);margin-bottom:var(--spacing-md);font-size:1.1rem;font-weight:600}.tutorial-content .effect-category ul{list-style:none;padding:0;margin:0}.tutorial-content .effect-category li{padding:var(--spacing-sm) 0;border-bottom:1px solid var(--color-border-primary);color:var(--color-text-secondary)}.tutorial-content .effect-category li:last-child{border-bottom:none}.tutorial-content .controls-grid{display:grid;gap:var(--spacing-md)}.tutorial-content .control-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background:#ffffff0d;border-radius:var(--radius-md)}.tutorial-content .control-icon{font-size:1.5rem;flex-shrink:0}.tutorial-content .control-item p{margin:0;color:var(--color-text-primary)}.tutorial-content .keyboard-shortcuts{display:grid;grid-template-columns:1fr;gap:var(--spacing-sm)}.tutorial-content .shortcut-item{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md) var(--spacing-lg);background:#ffffff0d;border-radius:var(--radius-md);min-height:50px}.tutorial-content .shortcut-item span{flex:1;margin-right:var(--spacing-lg);color:var(--color-text-primary);text-align:left}.tutorial-content .shortcut-item kbd{flex-shrink:0;margin-left:auto}.tutorial-content .tips-list{display:grid;gap:var(--spacing-md)}.tutorial-content .tip-item{display:flex;align-items:flex-start;gap:var(--spacing-md);padding:var(--spacing-md);background:#ffffff0d;border-radius:var(--radius-md)}.tutorial-content .tip-icon{font-size:1.2rem;flex-shrink:0}.tutorial-content .tip-item p{margin:0;color:var(--color-text-primary)}.tutorial-content .faq-list{display:grid;gap:var(--spacing-lg)}.tutorial-content .faq-item{background:#ffffff0d;border-radius:var(--radius-md);padding:var(--spacing-lg);border:1px solid var(--color-border-primary)}.tutorial-content .faq-item h4{color:var(--color-primary);margin-bottom:var(--spacing-sm);font-size:1.1rem}.tutorial-content .faq-item p{margin:0;color:var(--color-text-secondary)}@media (max-width: 768px){.tutorial-content .mode-cards{grid-template-columns:1fr;gap:var(--spacing-md)}.tutorial-content .mode-card{padding:var(--spacing-md)}.tutorial-content .effects-grid,.tutorial-content .keyboard-shortcuts{grid-template-columns:1fr}.tutorial-content .help-section{padding:var(--spacing-md);margin-bottom:var(--spacing-lg)}.tutorial-content .help-section-title{font-size:var(--font-size-md)}.tutorial-content .help-step{flex-direction:row!important;align-items:flex-start}}@media (max-width: 480px){.tutorial-content .help-section{padding:var(--spacing-sm)}.tutorial-content .help-step{flex-direction:row!important;align-items:flex-start;gap:var(--spacing-sm)}.tutorial-content .step-number{width:28px;height:28px;font-size:.9rem}}
