*{margin:0;padding:0;box-sizing:border-box}.container{max-width:1240px;margin:0 auto;padding:20px}header{text-align:center;background:linear-gradient(135deg,#9CA1E2 0%,#4b85e6 50%,#9CA1E2 100%);color:white!important;padding:20px;border-radius:15px;margin-bottom:30px;box-shadow:0 10px 30px rgb(30 58 138 / .2)}header h1{font-size:45px!important;font-weight:700;margin-bottom:10px;text-shadow:2px 2px 4px rgb(0 0 0 / .3)}header p{font-size:1.1rem;color:white!important}.main-content{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start}.controls-panel{background:#f8fafc!important;border:1px solid #e5e7eb!important;border-radius:12px!important;padding:25px!important;box-shadow:0 1px 3px rgb(0 0 0 / .1)}.input-section{margin-bottom:25px;padding-bottom:20px;border-bottom:1px solid #e5e7eb!important}.input-section:last-of-type{border-bottom:none!important;margin-bottom:20px}.input-section h3{font-size:1.3rem;font-weight:600;color:#1e40af!important;margin-bottom:15px;display:flex;align-items:center}.points-grid{display:grid;gap:15px}.point-input{background:white!important;padding:15px!important;border-radius:8px!important;border:1px solid #d1d5db!important;transition:border-color 0.3s ease}.point-input:hover{border-color:#3b82f6}.point-input label{display:block;font-weight:500;color:#374151;margin-bottom:8px;font-size:.9rem}.coordinate-input{display:grid;grid-template-columns:1fr 1fr;gap:10px}.axis-inputs,.label-inputs{display:grid;gap:15px}.input-group{display:flex;flex-direction:column}.input-group label{font-weight:500;color:#374151;margin-bottom:5px;font-size:.9rem}input[type="number"],input[type="text"]{padding:10px 12px!important;border:1px solid #d1d5db!important;border-radius:6px!important;font-size:.9rem;transition:all 0.3s ease;background:white!important}input[type="number"]:focus,input[type="text"]:focus{outline:none!important;border-color:#3b82f6!important;box-shadow:0 0 0 3px rgb(59 130 246 / .1)}.button-group{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.btn{padding:12px 20px!important;border-radius:8px!important;font-weight:600;font-size:.95rem;cursor:pointer!important;transition:all 0.3s ease;border:none!important;text-align:center;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:44px}.btn-primary{background:#3b82f6!important;color:white!important;box-shadow:0 2px 4px rgb(59 130 246 / .3)}.btn-primary:hover{background:#2563eb!important;transform:translateY(-1px);box-shadow:0 4px 8px rgb(59 130 246 / .4)}.btn-secondary{background:#e0f2fe!important;color:#0369a1!important;border:1px solid #bae6fd!important}.btn-secondary:hover{background:#bae6fd!important;transform:translateY(-1px)!important}.btn-outline{background:white!important;color:#3b82f6!important;border:1px solid #3b82f6!important}.btn-outline:hover:not(:disabled){background:#3b82f6!important;color:white!important;transform:translateY(-1px)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.equilibrium-panel{background:#ecfdf5!important;border:1px solid #a7f3d0!important;border-radius:8px!important;padding:20px!important;margin-top:20px}.equilibrium-panel h3{color:#065f46;font-size:1.2rem;margin-bottom:15px}.equilibrium-details{display:grid;gap:10px}.equilibrium-value{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.equilibrium-value .label{font-weight:500;color:#065f46}.equilibrium-value span:last-child{font-weight:700;color:#047857;font-family:'Courier New',monospace}.graph-panel{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:25px;box-shadow:0 1px 3px rgb(0 0 0 / .1);display:flex;flex-direction:column;align-items:center}.canvas-container{border:2px solid #e5e7eb!important;border-radius:8px!important;overflow:hidden;margin-bottom:20px;background:white!important}#graphCanvas{display:block;max-width:100%;height:auto}.download-controls{display:flex;gap:12px;width:100%;justify-content:center}.download-controls .btn{flex:1;max-width:150px}@media (max-width:1024px){.main-content{grid-template-columns:1fr;gap:25px}.graph-panel{order:-1}header h1{font-size:2rem}}@media (max-width:768px){.container{padding:0px!important}.controls-panel{padding:20px}.coordinate-input{grid-template-columns:1fr}.button-group{grid-template-columns:1fr}.download-controls{flex-direction:column}.download-controls .btn{max-width:none}header h1{font-size:35px!important}header p{font-size:1rem}}@media (max-width:480px){.axis-inputs,.label-inputs{gap:12px}.input-section{margin-bottom:20px}.point-input{padding:12px}.graph-panel{padding:10px!important}#graphCanvas{width:100%;height:auto}}.loading{opacity:.6;pointer-events:none}.error-message{color:#dc2626!important;font-size:.9rem;margin-top:5px;padding:8px 12px!important;background:#fef2f2!important;border:1px solid #fecaca!important;border-radius:4px!important}