.avogadro-explorer{display:flex;flex-direction:column;gap:25px}.intro-text{text-align:center}.intro-text h2{font-size:1.6rem;margin-bottom:10px;color:#00d4ff}.intro-text p{color:#aaa;font-size:1rem}.avogadro-explorer .points-display{display:inline-flex;align-items:center;gap:8px;margin-top:15px;padding:10px 20px;background:linear-gradient(135deg,#ffd70033,#fa03);border:1px solid rgba(255,215,0,.4);border-radius:20px;animation:points-appear .3s ease-out}.avogadro-explorer .points-icon{font-size:1.4rem;color:gold}.avogadro-explorer .points-value{font-size:1.1rem;font-weight:700;color:gold}.avogadro-explorer .discovered-count{font-size:.85rem;color:#aaa}.category-tabs{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.category-tab{padding:8px 16px;border:1px solid rgba(255,255,255,.2);border-radius:20px;background:transparent;color:#aaa;font-size:.9rem;cursor:pointer;transition:all .3s ease}.category-tab:hover{border-color:#00d4ff;color:#fff}.category-tab.active{background:#00d4ff33;border-color:#00d4ff;color:#00d4ff}.substance-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}.substance-card{display:flex;flex-direction:column;align-items:center;padding:15px 10px;border:2px solid rgba(255,255,255,.1);border-radius:12px;background:#ffffff08;cursor:pointer;transition:all .3s ease}.substance-card:hover{border-color:#00d4ff80;background:#00d4ff1a;transform:translateY(-2px)}.substance-card.selected{border-color:#00d4ff;background:#00d4ff33;box-shadow:0 0 20px #00d4ff4d}.substance-card .formula{font-size:1.4rem;font-weight:700;color:#fff}.substance-card .name{font-size:.75rem;color:#888;margin-top:4px}.substance-card .mass{font-size:.85rem;color:#00d4ff;margin-top:6px;font-weight:500}.explorer-main{display:flex;flex-direction:column;gap:20px;margin-top:10px}.substance-info{text-align:center}.substance-info h3{display:flex;align-items:baseline;justify-content:center;gap:15px}.big-formula{font-size:2.5rem;color:#fff}.substance-name{font-size:1.2rem;color:#888;font-weight:400}.atomic-mass{color:#aaa;margin-top:8px}.atomic-mass strong{color:#00d4ff}.task-box{background:#7b2cbf33;border:1px solid rgba(123,44,191,.4);border-radius:12px;padding:15px 20px;text-align:center}.task-box strong{color:#d4a5ff}.slider-container{padding:0 10px}.slider-track{position:relative;height:40px;border-radius:20px;background:linear-gradient(90deg,#f44,#f44 65%,#fa0 80%,#4f4 93%,#4f4 97%,#fa0);padding:8px;transition:box-shadow .3s ease}.slider-track.measurable{box-shadow:0 0 15px #fa06}.slider-track.one-mol{box-shadow:0 0 25px #4f49}.slider{width:100%;height:24px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;cursor:pointer}.slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:30px;height:30px;border-radius:50%;background:#fff;box-shadow:0 2px 10px #0000004d;cursor:pointer;transition:transform .2s ease}.slider::-webkit-slider-thumb:hover{transform:scale(1.1)}.slider::-moz-range-thumb{width:30px;height:30px;border-radius:50%;background:#fff;box-shadow:0 2px 10px #0000004d;cursor:pointer;border:none}.slider-labels{display:flex;justify-content:space-between;margin-top:8px;font-size:.85rem;color:#888}.slider-hint{font-weight:700}.current-values{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px}.value-box{display:flex;flex-direction:column;align-items:center;padding:20px;border-radius:12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1)}.value-label{font-size:.85rem;color:#888;margin-bottom:8px}.value{font-size:1.4rem;font-weight:700;color:#fff}.value.mass-u{color:#fa0}.value.highlight{color:#4f4;text-shadow:0 0 10px rgba(68,255,68,.5)}.value.revealed{color:#00d4ff;animation:fadeIn .5s ease}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.reveal-button{padding:12px 24px;border:none;border-radius:8px;background:linear-gradient(135deg,#7b2cbf,#00d4ff);color:#fff;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease}.reveal-button:hover{transform:scale(1.05);box-shadow:0 5px 20px #7b2cbf80}.success-message{background:linear-gradient(135deg,#44ff441a,#00d4ff1a);border:2px solid rgba(68,255,68,.4);border-radius:16px;padding:25px;text-align:center;animation:successPulse 2s ease infinite}@keyframes successPulse{0%,to{box-shadow:0 0 20px #4f43}50%{box-shadow:0 0 30px #4f46}}.success-message h4{font-size:1.5rem;color:#4f4;margin-bottom:15px}.success-message p{color:#ccc;line-height:1.6;margin-bottom:10px}.success-message strong{color:#00d4ff}.success-message em{font-style:normal;color:#d4a5ff}.fun-fact{margin-top:15px;padding-top:15px;border-top:1px solid rgba(255,255,255,.1)}.hint-box{text-align:center;padding:40px;color:#888;font-size:1.1rem}@media (max-width: 768px){.current-values{grid-template-columns:1fr 1fr}.current-values .value-box:last-child{grid-column:1 / -1}}@media (max-width: 600px){.substance-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.current-values{grid-template-columns:1fr}.current-values .value-box:last-child{grid-column:auto}.big-formula{font-size:2rem}.category-tabs{gap:5px}.category-tab{padding:6px 12px;font-size:.8rem}.value{font-size:1.1rem}}.stoichiometry-calculator{display:flex;flex-direction:column;gap:25px}.stoichiometry-calculator .intro-text{text-align:center}.stoichiometry-calculator .intro-text h2{font-size:1.6rem;margin-bottom:10px;color:#00d4ff}.stoichiometry-calculator .intro-text p{color:#aaa;font-size:1rem}.points-display{display:inline-flex;align-items:center;gap:8px;margin-top:15px;padding:10px 20px;background:linear-gradient(135deg,#ffd70033,#fa03);border:1px solid rgba(255,215,0,.4);border-radius:20px;animation:points-appear .3s ease-out}@keyframes points-appear{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.points-icon{font-size:1.4rem;color:gold}.points-value{font-size:1.1rem;font-weight:700;color:gold}.progress-bar{display:flex;justify-content:center;gap:8px;margin-bottom:10px}.progress-step{display:flex;flex-direction:column;align-items:center;padding:10px 15px;border-radius:10px;background:#ffffff0d;opacity:.5;transition:all .3s ease}.progress-step.active{opacity:1;background:#00d4ff26}.progress-step.completed{opacity:.8;cursor:pointer}.progress-step.completed:hover{background:#00d4ff33}.step-number{width:28px;height:28px;border-radius:50%;background:#fff3;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;margin-bottom:5px}.progress-step.active .step-number{background:#00d4ff;color:#1a1a2e}.progress-step.completed .step-number{background:#4f4;color:#1a1a2e}.step-label{font-size:.75rem;color:#888}.progress-step.active .step-label{color:#00d4ff}.step-container{display:flex;flex-direction:column;gap:20px}.step-container h3{color:#00d4ff;font-size:1.3rem;border-bottom:1px solid rgba(0,212,255,.3);padding-bottom:10px}.step-container h4{color:#d4a5ff;font-size:1.1rem;margin-top:15px}.instruction{color:#ccc;font-size:1rem}.hint{color:#888;font-size:.9rem;font-style:italic}.alkane-input-section{display:flex;flex-direction:column;gap:10px}.alkane-input-section label{display:flex;flex-direction:column;gap:8px;color:#ccc;font-size:1rem}.alkane-input-section select{padding:12px 15px;font-size:1.1rem;border:2px solid rgba(255,255,255,.2);border-radius:8px;background:#ffffff1a;color:#fff;cursor:pointer;max-width:300px}.alkane-input-section select:focus{outline:none;border-color:#00d4ff}.alkane-input-section select option{background:#2a2a45;color:#fff}.formula-input-section{display:flex;flex-direction:column;gap:15px;padding:20px;background:#ffffff08;border-radius:12px}.formula-builder{display:flex;align-items:center;justify-content:center;gap:8px;padding:20px;background:#ffffff0d;border-radius:10px}.formula-builder .formula-text{font-size:1.8rem;font-weight:700;color:#fff}.formula-builder input{width:60px;padding:10px;text-align:center;font-size:1.3rem;font-weight:700;border:2px solid rgba(255,255,255,.2);border-radius:8px;background:#ffffff1a;color:#fff}.formula-builder input:focus{outline:none;border-color:#00d4ff}.formula-builder input.correct{border-color:#4f4;background:#44ff441a}.formula-builder input.incorrect{border-color:#f44;background:#ff44441a}.equation-builder{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;padding:25px;background:#ffffff0d;border-radius:12px}.equation-part{display:flex;align-items:center;gap:5px}.equation-part input{width:50px;padding:8px;text-align:center;font-size:1.2rem;font-weight:700;border:2px solid rgba(255,255,255,.2);border-radius:8px;background:#ffffff1a;color:#fff}.equation-part input:focus{outline:none;border-color:#00d4ff}.equation-part input.correct{border-color:#4f4;background:#44ff441a}.equation-part input.incorrect{border-color:#f44;background:#ff44441a}.equation-part .molecule{font-size:1.3rem;font-weight:700;color:#fff}.operator{font-size:1.5rem;color:#888;margin:0 5px}.feedback{padding:15px 20px;border-radius:10px;text-align:center;font-weight:500}.feedback.correct{background:#44ff4426;border:1px solid rgba(68,255,68,.4);color:#4f4}.feedback.incorrect{background:#ff444426;border:1px solid rgba(255,68,68,.4);color:#f66}.feedback.small{padding:10px 15px;font-size:.9rem}.button-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.check-btn,.hint-btn,.back-btn{padding:12px 24px;border:none;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .3s ease}.check-btn{background:linear-gradient(135deg,#00d4ff,#7b2cbf);color:#fff}.check-btn:hover{transform:scale(1.05);box-shadow:0 5px 20px #00d4ff66}.check-btn.small{padding:8px 16px;font-size:.9rem}.hint-btn{background:#fa03;border:1px solid rgba(255,170,0,.4);color:#fa0}.hint-btn:hover{background:#ffaa004d}.back-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#aaa}.back-btn:hover{background:#ffffff26;color:#fff}.units-display{background:#ffffff0d;border-radius:12px;padding:20px}.unit-row{display:flex;align-items:flex-start;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1);flex-wrap:wrap}.unit-row:last-of-type{border-bottom:none}.unit-row.highlight{background:#00d4ff1a;margin:10px -20px;padding:15px 20px;border-radius:8px}.unit-label{width:100px;min-width:100px;font-weight:500;color:#888}.unit-value{color:#fff;font-family:Courier New,monospace;font-size:.95rem;flex:1;line-height:1.6}.mass-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin-top:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1)}.mass-item{display:flex;flex-direction:column;align-items:center;padding:12px;background:#ffffff08;border-radius:8px}.mass-item .formula{font-size:1.2rem;font-weight:700;color:#00d4ff}.mass-item span:last-child{font-size:.85rem;color:#888;margin-top:5px}.task-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}.task-buttons button{padding:15px 20px;border:2px solid rgba(123,44,191,.4);border-radius:10px;background:#7b2cbf1a;color:#d4a5ff;font-size:.95rem;cursor:pointer;transition:all .3s ease}.task-buttons button:hover{border-color:#7b2cbf;background:#7b2cbf33;transform:translateY(-2px)}.dreisatz-container{display:flex;flex-direction:column;gap:20px}.equation-reminder{background:#00d4ff1a;border:1px solid rgba(0,212,255,.3);border-radius:10px;padding:15px;color:#ccc;font-family:Courier New,monospace}.equation-reminder strong{color:#00d4ff}.input-section,.answer-section{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.input-section label,.answer-section label{display:flex;align-items:center;gap:10px;color:#ccc;font-size:1rem}.input-section input,.answer-section input{width:120px;padding:10px 15px;font-size:1.1rem;border:2px solid rgba(255,255,255,.2);border-radius:8px;background:#ffffff1a;color:#fff;text-align:center}.input-section input:focus,.answer-section input:focus{outline:none;border-color:#00d4ff}.answer-section input.correct{border-color:#4f4;background:#44ff441a}.answer-section input.incorrect{border-color:#f44;background:#ff44441a}.question-box{background:#7b2cbf33;border:1px solid rgba(123,44,191,.4);border-radius:12px;padding:20px;font-size:1.1rem;color:#fff}.bonus-question{margin-top:15px;padding:20px;background:#ffaa001a;border:1px solid rgba(255,170,0,.3);border-radius:12px}.bonus-label{color:#fa0;font-size:.9rem;margin-bottom:12px;font-weight:500}.bonus-question .answer-section{margin-bottom:10px}@media (max-width: 768px){.progress-bar{gap:4px}.progress-step{padding:8px 10px}.step-label{font-size:.65rem}.unit-row{flex-direction:column;align-items:flex-start;gap:5px}.unit-label{width:auto}.unit-value{font-size:.85rem}}@media (max-width: 600px){.equation-builder{flex-direction:column;gap:15px}.equation-part input{width:45px;font-size:1rem}.operator{font-size:1.2rem}.task-buttons{grid-template-columns:1fr}.formula-builder{flex-wrap:wrap}.formula-builder .formula-text{font-size:1.5rem}.formula-builder input{width:50px;font-size:1.1rem}}.app{max-width:1000px;margin:0 auto;padding:20px;min-height:100vh}.header{text-align:center;margin-bottom:30px}.header h1{font-size:2.5rem;background:linear-gradient(90deg,#00d4ff,#7b2cbf);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:10px}.subtitle{color:#888;font-size:1.1rem}.tabs{display:flex;justify-content:center;gap:10px;margin-bottom:30px}.tab{padding:12px 24px;border:none;border-radius:8px;background:#ffffff1a;color:#fff;font-size:1rem;cursor:pointer;transition:all .3s ease}.tab:hover:not(:disabled){background:#fff3}.tab.active{background:linear-gradient(135deg,#00d4ff,#7b2cbf);font-weight:700}.tab:disabled{opacity:.4;cursor:not-allowed}.main{background:#c9d1af4d;border-radius:16px;padding:30px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 30px #8cafe033}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#2a2a45,#1e3352);min-height:100vh;color:#fff}#root{min-height:100vh}