*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.App{width:100%;min-height:100vh}.integral-solver{min-height:100vh;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);padding:40px 20px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.solver-header{text-align:center;color:#fff;margin-bottom:40px;animation:slideDown .6s ease-out}.solver-header h1{font-size:2.5em;margin:0 0 15px;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.problem-title{font-size:1.8em;font-weight:600;background:rgba(255,255,255,.2);padding:15px 30px;border-radius:10px;display:inline-block;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.solver-content{max-width:1000px;margin:0 auto}.steps-section{margin-bottom:40px}.steps-section h2,.verification-section h2,.key-concepts-section h2{color:#fff;font-size:1.8em;margin-bottom:25px;text-shadow:1px 1px 2px rgba(0,0,0,.2)}.steps-container{display:flex;flex-direction:column;gap:15px}.step{background:white;border-radius:12px;overflow:hidden;box-shadow:0 4px 15px #0003;transition:all .3s ease;cursor:pointer;animation:fadeInUp .5s ease-out}.step:hover{transform:translateY(-5px);box-shadow:0 8px 25px #0000004d}.step.final-answer{background:linear-gradient(135deg,#84fab0 0%,#8fd3f4 100%);border:3px solid #667eea}.step.final-answer .step-header{background:rgba(0,0,0,.1)}.step-header{display:flex;align-items:center;gap:15px;padding:20px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;transition:background .3s ease}.step:hover .step-header{background:linear-gradient(135deg,#764ba2 0%,#667eea 100%)}.step-number{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:rgba(255,255,255,.3);border-radius:50%;font-weight:700;font-size:1.1em;flex-shrink:0}.step-header h3{flex-grow:1;margin:0;font-size:1.2em}.toggle-icon{font-size:1.2em;transition:transform .3s ease}.step.expanded .toggle-icon{transform:rotate(180deg)}.step-content{padding:20px;background:white}.formula{background:#f8f9fa;padding:20px;border-left:4px solid #667eea;font-size:1.1em;font-family:Courier New,monospace;border-radius:5px;overflow-x:auto;white-space:pre-wrap;word-break:break-word}.explanation{margin-top:15px;padding:15px;background:#e8f4f8;border-radius:5px;border-left:4px solid #8fd3f4;animation:slideDown .3s ease-out}.explanation p{margin:0;color:#333;line-height:1.6}.verification-section{margin-bottom:40px}.verification-box{background:white;padding:30px;border-radius:12px;box-shadow:0 4px 15px #0003;border-left:5px solid #84fab0}.verification-box h3{color:#667eea;margin-top:0;font-size:1.3em}.verification-steps{background:#f8f9fa;padding:20px;border-radius:8px;margin:20px 0;font-family:Courier New,monospace;font-size:1em}.verification-step{margin:10px 0;background:white;border-left:3px solid #667eea;padding:10px 10px 10px 15px}.verification-step.final-check{background:#e8f5e9;border-left-color:#84fab0;font-weight:700;color:#2e7d32}.verification-explanation{color:#555;font-style:italic;margin-top:15px;padding-top:15px;border-top:2px solid #e0e0e0}.key-concepts-section{margin-bottom:40px}.concepts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.concept-card{background:white;padding:25px;border-radius:12px;box-shadow:0 4px 15px #0003;transition:all .3s ease;animation:fadeInUp .6s ease-out}.concept-card:hover{transform:translateY(-8px);box-shadow:0 8px 25px #0000004d}.concept-card h4{color:#667eea;margin:0 0 10px;font-size:1.1em}.concept-card p{margin:0;color:#555;font-family:Courier New,monospace;font-size:.95em;line-height:1.6}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.integral-solver{padding:20px 10px}.solver-header h1{font-size:1.8em}.problem-title{font-size:1.3em;padding:10px 20px}.step-header{flex-wrap:wrap;gap:10px}.step-header h3{flex-basis:100%;font-size:1em}.concepts-grid{grid-template-columns:1fr}}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}