body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{background:linear-gradient(135deg,#0f1419,#1e3c72 50%,#2a5298);color:#fff;min-height:100vh;overflow-x:hidden;position:relative}.App:after,.App:before{content:"";height:100%;left:0;pointer-events:none;position:fixed;top:0;width:100%;z-index:-1}.App:before{animation:aurora-wave 20s ease-in-out infinite,aurora-dance 25s ease-in-out infinite;background:linear-gradient(45deg,rgba(0,255,136,.3),rgba(136,0,255,.2) 25%,rgba(0,136,255,.25) 50%,rgba(255,0,136,.2) 75%,rgba(0,255,136,.3)),radial-gradient(ellipse 600px 300px at 20% 30%,rgba(0,255,136,.25) 0,transparent 70%),radial-gradient(ellipse 500px 250px at 80% 20%,rgba(136,0,255,.2) 0,transparent 70%);background-size:200% 200%,100% 100%,100% 100%}.App:after{animation:aurora-wave 25s ease-in-out infinite reverse,aurora-dance 30s ease-in-out infinite reverse;background:linear-gradient(-45deg,rgba(255,0,136,.2),rgba(0,136,255,.25) 25%,rgba(136,0,255,.2) 50%,rgba(0,255,136,.15) 75%,rgba(255,0,136,.2)),radial-gradient(ellipse 700px 350px at 70% 60%,rgba(0,136,255,.2) 0,transparent 70%),radial-gradient(ellipse 400px 200px at 30% 80%,rgba(255,0,136,.18) 0,transparent 70%);background-size:200% 200%,100% 100%,100% 100%}.main-content{min-height:calc(100vh - 80px);padding:2rem 0}.content-container{align-items:flex-start;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.2);border-radius:15px;box-shadow:0 8px 32px rgba(0,0,0,.1);display:flex;gap:2rem;margin:0 auto 3rem;max-width:1200px;padding:2rem;transition:transform .3s ease,box-shadow .3s ease}.content-container:hover{box-shadow:0 12px 40px rgba(0,0,0,.2);transform:translateY(-5px)}.side-image{border:2px solid hsla(0,0%,100%,.2);border-radius:12px;box-shadow:0 8px 25px rgba(0,0,0,.3);height:auto;object-fit:cover;transition:transform .3s ease,box-shadow .3s ease;width:50%}.side-image:hover{box-shadow:0 12px 35px rgba(0,0,0,.4);transform:scale(1.02)}.fullscreen-image{display:block;height:80vh;object-fit:cover;width:100vw}.description-text{color:#f0f0f0;flex:1 1;font-size:1.1rem;line-height:1.8;margin:0;text-align:justify}.gif-container{align-items:center;display:flex;justify-content:center;width:50%}.magnetic-field-gif{border:2px solid hsla(0,0%,100%,.2);border-radius:12px;box-shadow:0 8px 25px rgba(0,0,0,.3);height:auto;max-width:100%;transition:transform .3s ease,box-shadow .3s ease;width:100%}.magnetic-field-gif:hover{box-shadow:0 12px 35px rgba(0,0,0,.4);transform:scale(1.02)}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media (max-width:768px){.content-container{flex-direction:column;margin:0 1rem 2rem;padding:1.5rem}.gif-container,.side-image{width:100%}.description-text{font-size:1rem;text-align:left}}@media (max-width:480px){.content-container{margin:0 .5rem 1.5rem;padding:1rem}.description-text{font-size:.95rem}}.navbar{background:linear-gradient(135deg,#1e3c72,#2a5298);box-shadow:0 2px 10px rgba(0,0,0,.1);padding:0;position:fixed;top:0;width:100%;z-index:1000}.navbar-container{align-items:center;display:flex;height:70px;justify-content:space-between;margin:0 auto;max-width:1200px;padding:0 20px}.navbar-brand h2{color:#fff;font-size:1.5rem;font-weight:600;letter-spacing:.5px;margin:0}.navbar-menu{display:flex;gap:2rem;list-style:none;margin:0;padding:0}.navbar-item{align-items:center;display:flex}.dropdown,.navbar-item{position:relative}.dropdown-toggle{cursor:pointer}.dropdown-menu{background:linear-gradient(135deg,#1e3c72,#2a5298);border-radius:4px;box-shadow:0 4px 6px rgba(0,0,0,.1);left:0;list-style:none;margin:0;min-width:200px;opacity:0;padding:.5rem 0;position:absolute;top:100%;transform:translateY(-10px);transition:all .3s ease;visibility:hidden;z-index:1001}.dropdown-menu.active{opacity:1;transform:translateY(0);visibility:visible}.dropdown-item{margin:0}.dropdown-link{border-radius:0;color:#fff;display:block;font-size:.9rem;font-weight:400;padding:.75rem 1rem;text-decoration:none;transition:all .3s ease}.dropdown-link:hover{background-color:hsla(0,0%,100%,.1);color:#64b5f6;transform:none}.dropdown-link:after{display:none}.navbar-link{border-radius:4px;color:#fff;font-size:1rem;font-weight:500;padding:.5rem 1rem;position:relative;text-decoration:none;transition:all .3s ease}.navbar-link:hover{background-color:hsla(0,0%,100%,.1);color:#64b5f6;transform:translateY(-2px)}.navbar-link:after{background:linear-gradient(90deg,#64b5f6,#42a5f5);bottom:0;content:"";height:2px;left:50%;position:absolute;transform:translateX(-50%);transition:all .3s ease;width:0}.navbar-link:hover:after{width:80%}.navbar-toggle{cursor:pointer;display:none;flex-direction:column;gap:4px}.bar{background-color:#fff;border-radius:2px;height:3px;transition:.3s;width:25px}@media screen and (max-width:768px){.navbar-menu{background:linear-gradient(135deg,#1e3c72,#2a5298);box-shadow:0 10px 27px rgba(0,0,0,.05);flex-direction:column;gap:0;left:-100%;padding:2rem 0;position:fixed;text-align:center;top:70px;transition:.3s;width:100%}.navbar-menu.active{left:0}.navbar-item{flex-direction:column;margin:1rem 0}.navbar-link{display:block;padding:1rem;width:100%}.dropdown-menu{background:hsla(0,0%,100%,.1);box-shadow:inset 0 2px 4px rgba(0,0,0,.1);margin-top:.5rem;position:static;transform:none;width:90%}.dropdown-menu.active{transform:none}.dropdown-link{font-size:.85rem;padding:.5rem 1rem}.navbar-toggle{display:flex}.navbar-toggle.active .bar:nth-child(2){opacity:0}.navbar-toggle.active .bar:first-child{transform:translateY(7px) rotate(45deg)}.navbar-toggle.active .bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}}body{margin-top:70px}html{scroll-behavior:smooth}.topic1-page{background:linear-gradient(135deg,#0f1419,#1e3c72 50%,#2a5298);color:#fff;min-height:100vh;overflow-x:hidden;position:relative}.topic1-page:after,.topic1-page:before{content:"";height:100%;left:0;pointer-events:none;position:fixed;top:0;width:100%;z-index:-1}.topic1-page:before{animation:aurora-wave 20s ease-in-out infinite,aurora-dance 25s ease-in-out infinite;background:linear-gradient(45deg,rgba(0,255,136,.3),rgba(136,0,255,.2) 25%,rgba(0,136,255,.25) 50%,rgba(255,0,136,.2) 75%,rgba(0,255,136,.3)),radial-gradient(ellipse 600px 300px at 20% 30%,rgba(0,255,136,.25) 0,transparent 70%),radial-gradient(ellipse 500px 250px at 80% 20%,rgba(136,0,255,.2) 0,transparent 70%);background-size:200% 200%,100% 100%,100% 100%}.topic1-page:after{animation:aurora-wave 25s ease-in-out infinite reverse,aurora-dance 30s ease-in-out infinite reverse;background:linear-gradient(-45deg,rgba(255,0,136,.2),rgba(0,136,255,.25) 25%,rgba(136,0,255,.2) 50%,rgba(0,255,136,.15) 75%,rgba(255,0,136,.2)),radial-gradient(ellipse 700px 350px at 70% 60%,rgba(0,136,255,.2) 0,transparent 70%),radial-gradient(ellipse 400px 200px at 30% 80%,rgba(255,0,136,.18) 0,transparent 70%);background-size:200% 200%,100% 100%,100% 100%}@keyframes aurora-wave{0%,to{background-position:0 50%,0 0,0 0}25%{background-position:50% 25%,20% 10%,10% 20%}50%{background-position:100% 50%,40% 30%,30% 40%}75%{background-position:50% 75%,60% 50%,50% 60%}}@keyframes aurora-dance{0%,to{opacity:.6;transform:translateX(-30px) translateY(-20px) rotate(0deg) scale(1)}20%{opacity:.9;transform:translateX(40px) translateY(30px) rotate(2deg) scale(1.1)}40%{opacity:.7;transform:translateX(-20px) translateY(-40px) rotate(-1deg) scale(.95)}60%{opacity:.85;transform:translateX(50px) translateY(20px) rotate(1.5deg) scale(1.05)}80%{opacity:.75;transform:translateX(-10px) translateY(-30px) rotate(-.5deg) scale(1)}}.topic1-content{min-height:calc(100vh - 80px);padding:2rem 0}.topic1-container{margin:0 auto;max-width:1200px;padding:0 2rem}.back-button-container{margin-bottom:2rem}.back-to-home-btn{align-items:center;background:linear-gradient(135deg,#4caf50,#45a049);border:none;border-radius:25px;box-shadow:0 4px 15px rgba(76,175,80,.3);color:#fff;cursor:pointer;display:flex;font-size:1rem;font-weight:500;gap:.5rem;padding:.8rem 1.5rem;transition:all .3s ease}.back-to-home-btn:hover{background:linear-gradient(135deg,#45a049,#4caf50);box-shadow:0 6px 20px rgba(76,175,80,.4);transform:translateY(-2px)}.back-to-home-btn:active{box-shadow:0 2px 10px rgba(76,175,80,.3);transform:translateY(0)}.topic1-header{margin-bottom:3rem;padding:2rem 0;text-align:center}.topic1-header h1{-webkit-text-fill-color:transparent;background:linear-gradient(45deg,#fff,#e0e0e0);-webkit-background-clip:text;background-clip:text;font-size:3rem;margin-bottom:1rem;text-shadow:0 2px 4px rgba(0,0,0,.3)}.topic1-subtitle{color:#e0e0e0;font-size:1.3rem;line-height:1.6;margin:0 auto;max-width:800px}.topic1-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.2);border-radius:15px;box-shadow:0 8px 32px rgba(0,0,0,.1);margin-bottom:3rem;padding:2rem;transition:transform .3s ease,box-shadow .3s ease}.topic1-section:hover{box-shadow:0 12px 40px rgba(0,0,0,.2);transform:translateY(-5px)}.topic1-section h2{border-bottom:3px solid #4caf50;color:#fff;display:inline-block;font-size:2.2rem;margin-bottom:1.5rem;padding-bottom:.5rem}.topic1-section h3{color:#4caf50;font-size:1.5rem;margin-bottom:1rem}.topic1-section h4{color:#81c784;font-size:1.3rem;margin-bottom:1rem}.section-content p{color:#f0f0f0;font-size:1.1rem;line-height:1.8;margin-bottom:1.5rem}.intro-text{background:hsla(0,0%,100%,.05);border-left:4px solid #4caf50;font-size:1.2rem!important;font-weight:300;text-align:justify}.highlight-box,.intro-text{border-radius:10px;padding:1.5rem}.highlight-box{background:linear-gradient(135deg,rgba(76,175,80,.2),rgba(129,199,132,.2));border:1px solid rgba(76,175,80,.3);margin:1rem 0}.highlight-box p{font-size:1.15rem;margin:0}.mechanisms-grid{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));margin-top:2rem}.mechanism-card{background:hsla(0,0%,100%,.08);border:1px solid hsla(0,0%,100%,.15);border-radius:12px;overflow:hidden;padding:1.5rem;position:relative;transition:all .3s ease}.mechanism-card:before{background:linear-gradient(90deg,#4caf50,#81c784);content:"";height:3px;left:0;position:absolute;right:0;top:0}.mechanism-card:hover{background:hsla(0,0%,100%,.12);box-shadow:0 8px 25px rgba(0,0,0,.2);transform:translateY(-3px)}.mechanism-card h3{color:#4caf50;margin-bottom:1rem;margin-top:0}.mechanism-card p{line-height:1.7;margin:0;text-align:justify}.formula-box{background:linear-gradient(135deg,rgba(33,150,243,.2),rgba(100,181,246,.2));border:1px solid rgba(33,150,243,.3);border-radius:10px;margin:1.5rem 0;padding:1.5rem}.structure-info ul{list-style:none;padding:0}.structure-info li{background:hsla(0,0%,100%,.08);border-left:4px solid #4caf50;border-radius:8px;font-size:1.1rem;margin-bottom:.8rem;padding:1rem;transition:background .3s ease}.structure-info li:hover{background:hsla(0,0%,100%,.12)}.structure-info strong{color:#4caf50;display:inline-block;min-width:140px}.conclusion{background:linear-gradient(135deg,rgba(76,175,80,.15),rgba(129,199,132,.15));border:2px solid rgba(76,175,80,.3)}.conclusion h2{color:#4caf50}.dynamics-list,.magnetosphere-list ul{list-style:none;margin:.8rem 0 0;padding:0}.dynamics-list li,.magnetosphere-list li{background:hsla(0,0%,100%,.04);border-radius:8px;line-height:1.6;margin-bottom:.6rem;padding:.8rem 1rem}.measurement-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-top:1rem}.measurement-card{background:hsla(0,0%,100%,.06);border-left:4px solid rgba(33,150,243,.8);border-radius:10px;padding:1rem}.measurement-card h3{color:#2196f3;font-size:1.05rem;margin:0 0 .5rem}.measurement-card p{font-size:.98rem;margin:0}.clickable-heading{transition:color .3s ease,transform .2s ease;-webkit-user-select:none;user-select:none}.clickable-heading:hover{color:#81c784!important;transform:translateX(5px)}.clickable-heading:active{transform:translateX(2px)}.core-image-container{background:hsla(0,0%,100%,.05);border:1px solid hsla(0,0%,100%,.1);border-radius:12px;margin:1.5rem 0;padding:1rem;text-align:center}.core-image{border:2px solid hsla(0,0%,100%,.2);border-radius:12px;box-shadow:0 8px 25px rgba(0,0,0,.3);height:auto;max-width:100%;transition:transform .3s ease,box-shadow .3s ease}.core-image:hover{box-shadow:0 12px 35px rgba(0,0,0,.4);transform:scale(1.02)}.magnetosphere-image-container{margin:1.5rem 0;text-align:center}.magnetosphere-image{border:2px solid hsla(0,0%,100%,.2);border-radius:12px;box-shadow:0 8px 25px rgba(0,0,0,.3);height:auto;max-width:100%;transition:transform .3s ease,box-shadow .3s ease}.magnetosphere-image:hover{box-shadow:0 12px 35px rgba(0,0,0,.4);transform:scale(1.02)}@media (max-width:768px){.topic1-container{padding:0 1rem}.topic1-header h1{font-size:2.2rem}.topic1-subtitle{font-size:1.1rem}.topic1-section{padding:1.5rem}.topic1-section h2{font-size:1.8rem}.mechanisms-grid{gap:1.5rem;grid-template-columns:1fr}.mechanism-card{padding:1.2rem}}.test-progress{margin-bottom:2rem;text-align:center}.progress-bar{background:hsla(0,0%,100%,.2);border-radius:4px;height:8px;margin-bottom:1rem;overflow:hidden;width:100%}.progress-fill{background:linear-gradient(90deg,#4caf50,#81c784);height:100%;transition:width .3s ease}.progress-text{color:#e0e0e0;font-size:1.1rem;margin:0}.question-container,.question-title{text-align:center}.question-title{color:#fff;font-size:1.8rem;line-height:1.4;margin-bottom:2rem}.answers-container{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem;margin-left:auto;margin-right:auto;max-width:800px}.answer-option{align-items:center;background:hsla(0,0%,100%,.08);border:2px solid hsla(0,0%,100%,.2);border-radius:12px;color:#fff;cursor:pointer;display:flex;font-size:1.1rem;gap:1rem;min-height:60px;padding:1rem 1.5rem;text-align:left;transition:all .3s ease}.answer-option:hover{background:hsla(0,0%,100%,.12);border-color:rgba(76,175,80,.5);box-shadow:0 4px 15px rgba(0,0,0,.2);transform:translateY(-2px)}.answer-option.selected{background:rgba(76,175,80,.2);border-color:#4caf50;box-shadow:0 4px 15px rgba(76,175,80,.3)}.option-letter{align-items:center;background:rgba(76,175,80,.8);border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-weight:700;height:32px;justify-content:center;width:32px}.option-text{flex:1 1;line-height:1.4}.navigation-buttons{display:flex;gap:1rem;justify-content:space-between;margin:0 auto;max-width:400px}.nav-button{background:linear-gradient(135deg,#4caf50,#45a049);border:none;border-radius:25px;box-shadow:0 4px 15px rgba(76,175,80,.3);color:#fff;cursor:pointer;font-size:1rem;font-weight:500;padding:.8rem 1.5rem;transition:all .3s ease}.nav-button:hover{background:linear-gradient(135deg,#45a049,#4caf50);box-shadow:0 6px 20px rgba(76,175,80,.4);transform:translateY(-2px)}.nav-button:active{box-shadow:0 2px 10px rgba(76,175,80,.3);transform:translateY(0)}.prev-button{background:linear-gradient(135deg,#757575,#616161);box-shadow:0 4px 15px hsla(0,0%,46%,.3)}.prev-button:hover{background:linear-gradient(135deg,#616161,#757575);box-shadow:0 6px 20px hsla(0,0%,46%,.4)}.results-container{text-align:center}.results-title{color:#4caf50;font-size:2.5rem;margin-bottom:2rem}.score-display{margin:2rem 0}.score-circle{align-items:center;background:hsla(0,0%,100%,.05);border:8px solid;border-radius:50%;display:flex;flex-direction:column;height:150px;justify-content:center;margin:0 auto 1rem;width:150px}.score-text{font-size:2rem;font-weight:700;line-height:1}.score-percentage{font-size:1.2rem;opacity:.8}.score-message{font-size:1.3rem;font-weight:500;margin:1rem 0 2rem}.results-details{background:hsla(0,0%,100%,.05);border-radius:12px;margin:2rem 0;padding:1.5rem;text-align:left}.results-details h3{color:#4caf50;margin-bottom:1.5rem;text-align:center}.result-item{background:hsla(0,0%,100%,.05);border-left:4px solid hsla(0,0%,100%,.2);border-radius:8px;margin-bottom:1.5rem;padding:1rem}.result-question{color:#e0e0e0;margin-bottom:.5rem}.result-answer{display:flex;flex-direction:column;gap:.5rem}.result-answer .correct{color:#4caf50}.result-answer .incorrect{color:#f44336}.correct-answer{color:#4caf50;font-weight:500}.results-actions{display:flex;gap:1rem;justify-content:center;margin-top:2rem}.home-button,.restart-button{background:linear-gradient(135deg,#4caf50,#45a049);border:none;border-radius:25px;box-shadow:0 4px 15px rgba(76,175,80,.3);color:#fff;cursor:pointer;font-size:1.1rem;font-weight:500;padding:1rem 2rem;transition:all .3s ease}.home-button{background:linear-gradient(135deg,#2196f3,#1976d2);box-shadow:0 4px 15px rgba(33,150,243,.3)}.home-button:hover,.restart-button:hover{transform:translateY(-2px)}.restart-button:hover{background:linear-gradient(135deg,#45a049,#4caf50);box-shadow:0 6px 20px rgba(76,175,80,.4)}.home-button:hover{background:linear-gradient(135deg,#1976d2,#2196f3);box-shadow:0 6px 20px rgba(33,150,243,.4)}.loading-message{color:#e0e0e0;font-size:1.5rem;padding:3rem;text-align:center}@media (max-width:480px){.topic1-header h1{font-size:1.8rem}.section-content p,.topic1-subtitle{font-size:1rem}.intro-text{font-size:1.1rem!important}.question-title{font-size:1.5rem}.answers-container{gap:.8rem}.answer-option{font-size:1rem;min-height:50px;padding:.8rem 1rem}.navigation-buttons{flex-direction:column;max-width:250px}.results-actions{align-items:center;flex-direction:column}.home-button,.restart-button{width:200px}.score-circle{height:120px;width:120px}.score-text{font-size:1.6rem}.score-percentage{font-size:1rem}.results-title{font-size:2rem}}.flip-card{cursor:pointer;height:200px;perspective:1000px;transition:transform .3s ease}.flip-card:hover{transform:translateY(-5px)}.flip-card-inner{height:100%;position:relative;text-align:center;transform-style:preserve-3d;transition:transform .6s;width:100%}.flip-card.flipped .flip-card-inner{transform:rotateY(180deg)}.flip-card-back,.flip-card-front{-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:12px;box-sizing:border-box;height:100%;padding:1rem;position:absolute;width:100%}.flip-card-front{background:hsla(0,0%,100%,.08);border:1px solid hsla(0,0%,100%,.15);border-left:4px solid #4caf50;display:flex;flex-direction:column;justify-content:center}.flip-card-front h3{color:#4caf50;font-size:1.2rem;margin:0 0 1rem}.flip-card-front p{color:#f0f0f0;font-size:1rem;line-height:1.5;margin:.4rem 0}.flip-card-back{align-items:center;background:rgba(76,175,80,.1);border:1px solid rgba(76,175,80,.3);display:flex;flex-direction:column;justify-content:center;text-align:center;transform:rotateY(180deg)}.measurement-image{border-radius:8px;box-shadow:0 4px 15px rgba(0,0,0,.3);margin-bottom:1rem;max-height:130px;max-width:90%;object-fit:contain}.placeholder-image{align-items:center;color:#e0e0e0;display:flex;flex-direction:column;height:100%;justify-content:center}.placeholder-icon{font-size:4rem;margin-bottom:1rem;opacity:.8}.placeholder-image p{color:#4caf50;font-size:1.1rem;font-weight:500;margin:0}.flip-hint{background:rgba(0,0,0,.4);border-radius:8px;bottom:8px;color:hsla(0,0%,100%,.6);font-size:.8rem;opacity:0;padding:4px 8px;pointer-events:none;position:absolute;right:8px;transition:opacity .3s ease}.flip-card:hover .flip-hint{opacity:1}@media (max-width:768px){.flip-card{height:180px}.flip-card-back,.flip-card-front{padding:.8rem}.flip-card-front h3{font-size:1.1rem}.flip-card-front p{font-size:.9rem}.measurement-image{max-height:110px}.placeholder-icon{font-size:3rem}}@media (max-width:480px){.flip-card{height:160px}.flip-card-back,.flip-card-front{padding:.6rem}.flip-card-front h3{font-size:1rem;margin-bottom:.6rem}.flip-card-front p{font-size:.85rem;margin:.2rem 0}.measurement-image{max-height:90px}.placeholder-icon{font-size:2.5rem;margin-bottom:.8rem}.placeholder-image p{font-size:.95rem}}.calculator-container{background:hsla(0,0%,100%,.05);border:1px solid hsla(0,0%,100%,.1);border-radius:15px;margin-top:1rem;padding:2rem}.input-group{margin-bottom:2rem}.input-label{color:#4caf50;display:block;font-size:1.2rem;font-weight:500;margin-bottom:.8rem}.height-input{background:hsla(0,0%,100%,.08);border:2px solid hsla(0,0%,100%,.2);border-radius:10px;box-shadow:0 4px 15px rgba(0,0,0,.1);color:#fff;font-size:1.1rem;max-width:400px;padding:1rem 1.5rem;transition:all .3s ease;width:100%}.height-input:focus{background:hsla(0,0%,100%,.12);border-color:#4caf50;box-shadow:0 4px 20px rgba(76,175,80,.3);outline:none}.height-input::placeholder{color:hsla(0,0%,100%,.5)}.button-group{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:2rem}.calculate-btn,.clear-btn{border:none;border-radius:25px;box-shadow:0 4px 15px rgba(0,0,0,.2);cursor:pointer;font-size:1.1rem;font-weight:500;padding:1rem 2rem;transition:all .3s ease}.calculate-btn{background:linear-gradient(135deg,#4caf50,#45a049);box-shadow:0 4px 15px rgba(76,175,80,.3);color:#fff}.calculate-btn:hover{background:linear-gradient(135deg,#45a049,#4caf50);box-shadow:0 6px 20px rgba(76,175,80,.4);transform:translateY(-2px)}.clear-btn{background:linear-gradient(135deg,#757575,#616161);box-shadow:0 4px 15px hsla(0,0%,46%,.3);color:#fff}.clear-btn:hover{background:linear-gradient(135deg,#616161,#757575);box-shadow:0 6px 20px hsla(0,0%,46%,.4);transform:translateY(-2px)}.result-container{animation:fadeIn .5s ease-in-out;background:linear-gradient(135deg,rgba(76,175,80,.2),rgba(129,199,132,.2));border:2px solid rgba(76,175,80,.4);border-radius:15px;margin-top:2rem;padding:2rem;text-align:center}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.result-container h3{color:#4caf50;font-size:1.5rem;margin-bottom:1.5rem;margin-top:0}.result-value{margin-bottom:2rem}.distance-value{color:#4caf50;display:block;font-size:3rem;font-weight:700;margin-bottom:1rem;text-shadow:0 2px 4px rgba(0,0,0,.3)}.result-description{color:#f0f0f0;font-size:1.2rem;line-height:1.6;margin:0}.calculation-details{background:hsla(0,0%,100%,.05);border-radius:10px;margin-top:1.5rem;padding:1.5rem;text-align:left}.calculation-details h4{color:#81c784;margin-bottom:1rem;margin-top:0;text-align:center}.formula-steps{background:rgba(0,0,0,.2);border-left:4px solid #4caf50;border-radius:8px;font-family:Courier New,monospace;padding:1rem}.formula-steps p{color:#e0e0e0;font-size:1rem;margin:.5rem 0}.formula-steps ul{margin:.5rem 0 1rem;padding-left:1.5rem}.formula-steps li{color:#f0f0f0;margin-bottom:.3rem}.formula-steps strong{color:#4caf50}@media (max-width:768px){.calculator-container{padding:1.5rem}.height-input{max-width:100%}.button-group{align-items:stretch;flex-direction:column}.calculate-btn,.clear-btn{padding:1rem;width:100%}.distance-value{font-size:2.5rem}.result-description{font-size:1.1rem}.calculation-details{padding:1rem}.formula-steps{font-size:.9rem;padding:.8rem}}@media (max-width:480px){.calculator-container{padding:1rem}.input-label{font-size:1.1rem}.height-input{font-size:1rem;padding:.8rem 1rem}.calculate-btn,.clear-btn{font-size:1rem;padding:.8rem}.distance-value{font-size:2rem}.result-description{font-size:1rem}.result-container{padding:1.5rem}}
/*# sourceMappingURL=main.b34c0bba.css.map*/