.triangle-container{display:flex;flex-direction:column;align-items:center;background:#fff;padding:1rem;border-radius:12px;box-shadow:0 4px 10px #00000014;animation:fadeInUp .8s ease forwards}.triangle-svg{width:100%;max-width:400px;height:auto;background:#f3f4f6;border-radius:12px;box-shadow:inset 0 0 10px #0000000d;cursor:grab}.triangle-grid-line{stroke:#e5e7eb;stroke-width:1}.triangle-polygon{fill:#60a5fa33;stroke:#2563eb;stroke-width:3;transition:all .3s ease}.triangle-polygon:hover{fill:#60a5fa59;stroke-width:4}.triangle-point{fill:#2563eb;stroke:#fff;stroke-width:2;cursor:pointer;transition:transform .2s ease,fill .3s ease}.triangle-point:hover{fill:#1d4ed8;transform:scale(1.3)}.drag-hint{margin-top:.5rem;font-size:.9rem;color:#6b7280}.fade-in{opacity:0;transform:translateY(20px);animation:fadeInUp .8s ease forwards}@media (max-width: 768px){.triangle-svg{max-width:90%}}.formula-container{background:#f9fafb;padding:16px;border-radius:12px;margin-top:16px;box-shadow:0 2px 8px #0000000d;transition:transform .3s ease,box-shadow .3s ease}.formula-container:hover{transform:translateY(-3px);box-shadow:0 4px 14px #0000001a}.formula-title{font-size:1.2rem;font-weight:600;margin-bottom:8px;color:#1f2937}.formula-text{font-size:1rem;line-height:1.5;color:#374151}.controls-panel{background:#fff;border-radius:12px;padding:1rem 1.5rem;margin-top:1rem;box-shadow:0 4px 10px #00000014;display:flex;flex-direction:column;gap:1rem;animation:fadeInUp .8s ease forwards}.panel-title{font-size:1.2rem;font-weight:600;color:#2563eb;margin-bottom:.5rem}.point-row{display:flex;flex-direction:column;background:#f9fafb;padding:.75rem;border-radius:10px;box-shadow:inset 0 1px 3px #0000000d;gap:.5rem}.point-label{font-weight:500;color:#374151}.slider-group{display:flex;align-items:center;gap:.5rem}.slider-group label{font-size:.9rem;color:#6b7280}input[type=range]{flex:1;-webkit-appearance:none;height:6px;background:linear-gradient(90deg,#60a5fa,#2563eb);border-radius:10px;outline:none;transition:background .3s ease}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;background:#2563eb;border-radius:50%;cursor:pointer;transition:transform .2s ease}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2);background:#1d4ed8}.reset-button{margin-top:1rem;padding:.75rem;background:#2563eb;color:#fff;font-weight:700;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease;font-size:1rem}.reset-button:hover{background:#1d4ed8;transform:scale(1.05)}.fade-in{opacity:0;transform:translateY(15px);animation:fadeInUp .8s ease forwards}@media (max-width: 768px){.point-row{flex-direction:column;align-items:flex-start}.slider-group{width:100%}}.challenges-container{background:#fff;padding:1.5rem;border-radius:12px;box-shadow:0 4px 10px #00000014;margin-top:1.5rem}.challenges-title{font-size:1.4rem;font-weight:700;color:#2563eb;margin-bottom:1rem}.challenge-list{list-style:none;padding:0;margin:0}.challenge-item{background:#f9fafb;padding:1rem;margin-bottom:1rem;border-radius:10px;border-left:5px solid #2563eb;transition:background .3s ease,transform .3s ease}.challenge-item.completed{background:#e0f2fe}.challenge-item:hover{transform:translateY(-2px);background:#eef2ff}.challenge-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}.challenge-question{font-weight:500;color:#374151;margin-bottom:.5rem}.challenge-actions{display:flex;gap:.5rem}.hint-btn,.check-btn{padding:.4rem .8rem;border:none;border-radius:8px;cursor:pointer;font-weight:600;transition:background .3s ease,transform .2s ease}.hint-btn{background:#f3f4f6;color:#374151}.hint-btn:hover{background:#e5e7eb;transform:scale(1.05)}.check-btn{background:#2563eb;color:#fff}.check-btn:hover{background:#1e40af;transform:scale(1.05)}.hint-text{margin-top:.5rem;color:#1e3a8a;font-style:italic;font-size:.95rem}.completed-text{margin-top:1rem;font-weight:700;color:#065f46}.success-popup{position:fixed;bottom:20px;right:20px;background:#10b981;color:#fff;padding:.8rem 1.2rem;border-radius:8px;font-weight:700;box-shadow:0 4px 10px #0003;z-index:1000}@media (max-width: 768px){.challenge-row{flex-direction:column;align-items:flex-start}.challenge-actions{margin-top:.5rem}}.quiz-container{background:#fff;padding:1.5rem;border-radius:12px;box-shadow:0 4px 10px #00000014;margin-top:1.5rem}.quiz-title{font-size:1.4rem;font-weight:700;color:#2563eb;margin-bottom:1rem}.quiz-question-card{background:#f9fafb;border-radius:10px;padding:1rem;margin-bottom:1rem;border-left:5px solid #2563eb}.quiz-question-text{font-weight:500;color:#374151;margin-bottom:.8rem}.quiz-options{display:flex;flex-direction:column;gap:.5rem}.quiz-option{display:flex;align-items:center;background:#f3f4f6;padding:.6rem .8rem;border-radius:8px;cursor:pointer;transition:background .3s ease,transform .2s ease;font-weight:500}.quiz-option input{margin-right:10px}.quiz-option:hover{background:#e5e7eb;transform:translate(4px)}.quiz-option.selected{background:#dbeafe;color:#1e40af;font-weight:700}.quiz-submit-btn{background:#2563eb;color:#fff;border:none;padding:.7rem 1.2rem;border-radius:8px;cursor:pointer;font-size:1rem;font-weight:600;margin-top:1rem;transition:background .3s ease,transform .2s ease}.quiz-submit-btn:hover{background:#1e40af;transform:scale(1.05)}.quiz-score{margin-top:1rem;font-weight:700;font-size:1.2rem;color:#065f46;text-align:center}@media (max-width: 768px){.quiz-option{font-size:.95rem}}*{margin:0;padding:0;box-sizing:border-box;font-family:Segoe UI,Tahoma,sans-serif}.app-container{background:#f9fafb;min-height:100vh;padding:1rem;display:flex;flex-direction:column}.app-header{text-align:center;margin-bottom:1.5rem}.app-title{font-size:2rem;font-weight:700;color:#1f2937}.subtitle{font-size:1rem;color:#6b7280;margin-top:.3rem}.layout-grid{display:grid;grid-template-columns:2fr 1fr;gap:1.5rem}.left-column,.right-column{background:#fff;padding:1rem;border-radius:12px;box-shadow:0 4px 10px #0000000d}.area-display{text-align:center;margin-top:1rem;font-size:1.1rem;font-weight:600}.area-display span{color:#2563eb}.bottom-section{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:1.5rem}.app-footer{text-align:center;font-size:.9rem;color:#6b7280;margin-top:2rem}.fade-in{opacity:0;transform:translateY(15px);animation:fadeInUp .7s ease forwards}@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}@media (max-width: 1024px){.layout-grid,.bottom-section{grid-template-columns:1fr}}
