.function-plotter{max-width:1000px;margin:0 auto;padding:20px;font-family:Arial,sans-serif}@media (max-width:768px){.function-plotter{padding:10px}}h1{text-align:center;color:#333;margin-bottom:30px;font-size:2.5em;font-weight:700}@media (max-width:768px){h1{font-size:1.8em;margin-bottom:20px}}.input-form{margin-bottom:20px}.input-group{display:flex;align-items:center;gap:10px;margin-bottom:10px}.input-group label{font-weight:700;min-width:120px;margin-right:10px}.input-group input{flex:1;padding:8px 12px;border:2px solid #ddd;border-radius:4px;font-size:16px;min-width:100px}.input-group input:focus{outline:none;border-color:#007bff}.input-group button{padding:8px 16px;background-color:#007bff;color:white;border:none;border-radius:4px;cursor:pointer;font-size:16px}.input-group button:hover{background-color:#0056b3}.error{color:#dc3545;font-weight:700;padding:10px;background-color:#f8d7da;border:1px solid #f5c6cb;border-radius:4px}.canvas-container{display:flex;justify-content:center;margin:20px 0;border:2px solid #ddd;border-radius:8px;overflow:hidden}@media (max-width:768px){.canvas-container{margin:15px 0;overflow-x:auto;-webkit-overflow-scrolling:touch}}canvas{display:block;background-color:white;max-width:100%;height:auto}@media (max-width:768px){canvas{min-width:600px}}.examples{margin-top:30px}.examples h3{margin-bottom:15px;color:#333}.example-buttons{display:flex;flex-wrap:wrap;gap:10px}.example-buttons button{padding:8px 12px;background-color:#6c757d;color:white;border:none;border-radius:4px;cursor:pointer;font-size:14px}.example-buttons button:hover{background-color:#545b62}.functions-list{margin:20px 0;padding:15px;border:2px solid #ddd;border-radius:8px;background-color:#f8f9fa}.functions-list h3{margin-top:0;margin-bottom:15px;color:#333}.function-item{display:flex;align-items:center;gap:10px;margin-bottom:10px;padding:10px;background-color:white;border:1px solid #ddd;border-radius:4px}.function-checkbox{width:18px;height:18px;cursor:pointer}.color-picker{width:40px;height:30px;border:none;border-radius:4px;cursor:pointer;padding:0}.function-input{flex:1;padding:8px 12px;border:2px solid #ddd;border-radius:4px;font-size:14px;min-width:200px}.function-input:focus{outline:none;border-color:#007bff}.remove-button{padding:6px 12px;background-color:#dc3545;color:white;border:none;border-radius:4px;cursor:pointer;font-size:14px;min-width:60px}.remove-button:hover:not(:disabled){background-color:#c82333}.remove-button:disabled{background-color:#6c757d;cursor:not-allowed;opacity:.6}.axis-controls{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:15px}.axis-group{margin-bottom:0}@media (max-width:768px){.axis-controls{grid-template-columns:1fr;gap:10px}.input-group{flex-direction:column;align-items:stretch;gap:8px}.input-group label{min-width:auto;margin-bottom:5px;margin-right:0;font-size:14px}.input-group input{font-size:16px;min-width:auto}.input-group button{font-size:16px;padding:12px 16px;margin-top:5px}.example-buttons{justify-content:center}.example-buttons button{padding:10px 15px;font-size:16px}.function-item{flex-direction:column;align-items:stretch;padding:15px}.function-input{min-width:auto;font-size:16px}.color-picker{align-self:flex-start;width:50px;height:40px}.remove-button{padding:10px 15px;font-size:16px}.functions-list{margin:15px 0;padding:10px}.function-checkbox{width:20px;height:20px}.function-item{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;gap:10px;align-items:center}.function-checkbox{grid-row:1/3;justify-self:start}.function-input{grid-column:2;grid-row:1}.color-picker{grid-column:2;grid-row:2;justify-self:start}.remove-button{grid-column:3;grid-row:1/3}.example-buttons button:active,.input-group button:active,.remove-button:active{transform:scale(.98);transition:transform .1s}}@media (max-width:768px){.canvas-container::-webkit-scrollbar{height:8px}.canvas-container::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.canvas-container::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.canvas-container::-webkit-scrollbar-thumb:hover{background:#555}}