body{font-family:"Inter",sans-serif;background-color:#1a1a1a}.chart-container{position:relative;width:100%;max-width:600px;margin-left:auto;margin-right:auto;height:300px;max-height:400px}@media (min-width:768px){.chart-container{height:350px}}.gradient-text{background:linear-gradient(90deg,#00f0b5,#00e0ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.flowchart-step{background-color:#2c2c2c;border:2px solid #6100ff;color:#fff;padding:1rem;border-radius:.5rem;text-align:center;width:100%;box-shadow:0 4px 15px rgba(97,0,255,.2)}.flowchart-arrow{display:flex;align-items:center;justify-content:center;color:#00e0ff;font-size:2rem;margin:.5rem 0;transform:rotate(90deg)}@media (min-width:768px){.flowchart-arrow{transform:rotate(0deg);margin:0 1rem}}.section-header{border-bottom:2px solid #6100ff;padding-bottom:.5rem}.info-card{background-color:#2c2c2c;border-radius:.75rem;box-shadow:0 6px 20px rgba(0,0,0,.3);padding:1.5rem;transition:transform .2s ease-in-out,box-shadow .2s ease-in-out;cursor:pointer}.info-card.active{box-shadow:0 0 20px rgba(0,240,181,.4);transform:translateY(-5px)}.info-card:not(.active):hover{transform:translateY(-5px);box-shadow:0 8px 25px rgba(0,240,181,.1)}.nav-button.active{background-color:#6100ff;color:#fff}