.action-buttons-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}@media(max-width:576px){.action-buttons-grid{grid-template-columns:1fr}}.ph-scale-container{position:relative;margin:20px 0;padding:15px}.ph-scale{background:linear-gradient(to right,#f00 0%,#ff7f00 21%,#ff0 50%,#0f0 71%,#00f 100%);height:40px;border-radius:8px;position:relative;box-shadow:0 2px 8px rgba(0,0,0,.15)}.ph-scale-labels{display:flex;justify-content:space-between;margin-top:8px;font-size:.85rem;color:#4a5568}.ph-indicator{position:absolute;top:-10px;width:3px;height:60px;background:#000;transition:left .3s ease;z-index:2}.ph-indicator::before{content:'';position:absolute;top:-8px;left:-6px;width:0;height:0;border-left:7.5px solid transparent;border-right:7.5px solid transparent;border-top:10px solid #000}.ph-value-display{position:absolute;top:-35px;left:-20px;background:#000;color:#fff;padding:4px 8px;border-radius:4px;font-weight:600;font-size:.9rem;white-space:nowrap}.chem-formula{font-family:'Courier New',monospace;background:#f7fafc;padding:8px 12px;border-radius:4px;display:inline-block;border:1px solid #e2e8f0;margin:4px 0}.chem-formula sub{font-size:.75em;vertical-align:sub}.chem-formula sup{font-size:.7em;vertical-align:super}.titration-curve-container{background:#fff;padding:20px;border-radius:12px;margin:15px 0;box-shadow:0 2px 8px rgba(0,0,0,.08)}.chart-container{position:relative;height:350px;width:100%}@media(max-width:768px){.chart-container{height:280px}}.indicator-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px;margin-top:15px}.indicator-item{display:flex;align-items:center;padding:12px;background:#f7fafc;border-radius:8px;border:1px solid #e2e8f0}.indicator-sample{width:30px;height:30px;border-radius:50%;display:inline-block;border:2px solid #cbd5e0;margin-right:12px;flex-shrink:0}.indicator-info{flex-grow:1}.indicator-name{font-weight:600;color:#2d3748;margin-bottom:4px}.indicator-range{font-size:.85rem;color:#718096}.indicator-phenolphthalein{background:linear-gradient(to right,transparent 50%,#ff69b4 50%)}.indicator-methyl-orange{background:linear-gradient(to right,#f00 50%,#ff8c00 50%)}.indicator-bromothymol-blue{background:linear-gradient(to right,#ff0 50%,#00f 50%)}.indicator-litmus{background:linear-gradient(to right,#f00 50%,#00f 50%)}.steps-container{margin-top:20px}.step-item{background:#f7fafc;border-left:4px solid #667eea;padding:15px;margin-bottom:12px;border-radius:4px;transition:all .2s ease}.step-item:hover{background:#edf2f7;box-shadow:0 2px 4px rgba(0,0,0,.05)}.step-title{font-weight:600;color:#2d3748;margin-bottom:8px;display:flex;align-items:center}.step-number{display:inline-block;width:28px;height:28px;background:#667eea;color:#fff;border-radius:50%;text-align:center;line-height:28px;margin-right:10px;font-size:.9rem;font-weight:600}.step-formula{font-size:1.05rem;margin:10px 0;padding:10px;background:#fff;border-radius:4px;overflow-x:auto}.step-result{color:#48bb78;font-weight:600;margin-top:8px;padding:8px 12px;background:#f0fff4;border-radius:4px;border-left:3px solid #48bb78}.result-item{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;padding:20px;border-radius:12px;margin-bottom:15px;box-shadow:0 4px 12px rgba(102,126,234,.2)}.result-label{font-size:.9rem;opacity:.9;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.result-value{font-size:2rem;font-weight:700;margin-bottom:5px}.result-unit{font-size:.95rem;opacity:.85}.result-secondary{background:rgba(255,255,255,.15);padding:12px 15px;border-radius:8px;margin-top:10px;font-size:.9rem}.acid-base-selector{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin:15px 0}.type-option{padding:12px;background:#fff;border:2px solid #e2e8f0;border-radius:8px;text-align:center;cursor:pointer;transition:all .2s ease}.type-option:hover{border-color:#667eea;background:#f7fafc}.type-option.active{border-color:#667eea;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-weight:600}.buffer-zone-indicator{margin-top:15px;padding:12px;border-radius:8px;border-left:4px solid #48bb78;background:#f0fff4}.buffer-zone-indicator.poor{border-left-color:#f56565;background:#fff5f5}.buffer-zone-indicator.optimal{border-left-color:#48bb78;background:#f0fff4}.buffer-zone-text{font-size:.9rem;color:#2d3748}.ice-table{width:100%;border-collapse:collapse;margin:15px 0;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.08)}.ice-table th,.ice-table td{padding:12px;text-align:center;border:1px solid #e2e8f0}.ice-table th{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-weight:600}.ice-table tr:nth-child(even){background:#f7fafc}.ice-table .row-label{font-weight:600;background:#edf2f7;color:#2d3748}.preset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin:15px 0}.preset-button{padding:10px 12px;background:#fff;border:2px solid #e2e8f0;border-radius:6px;cursor:pointer;transition:all .2s ease;text-align:left;font-size:.9rem}.preset-button:hover{border-color:#667eea;background:#f7fafc;transform:translateY(-2px)}.preset-button .chem-name{font-weight:600;color:#2d3748;display:block;margin-bottom:4px}.preset-button .chem-pka{font-size:.8rem;color:#718096}.warning-box{padding:12px 15px;margin:15px 0;border-radius:8px;border-left:4px solid #f59e0b;background:#fffbeb;display:flex;align-items:flex-start}.warning-box i{margin-right:10px;color:#f59e0b;margin-top:2px}.error-box{padding:12px 15px;margin:15px 0;border-radius:8px;border-left:4px solid #f56565;background:#fff5f5;display:flex;align-items:flex-start}.error-box i{margin-right:10px;color:#f56565;margin-top:2px}@media(max-width:768px){.result-value{font-size:1.5rem}.preset-grid{grid-template-columns:1fr}.indicator-list{grid-template-columns:1fr}.ice-table{font-size:.85rem}.ice-table th,.ice-table td{padding:8px 6px}}.toggle-steps-btn{width:100%;padding:12px;background:#fff;border:2px solid #667eea;border-radius:8px;color:#667eea;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.toggle-steps-btn:hover{background:#667eea;color:#fff}.toggle-steps-btn i{margin-left:8px;transition:transform .2s ease}.toggle-steps-btn.active i{transform:rotate(180deg)}.equivalence-point-info{display:flex;align-items:center;justify-content:space-between;padding:15px;background:linear-gradient(135deg,#f59e0b 0%,#f97316 100%);color:#fff;border-radius:8px;margin-top:15px}.equivalence-label{font-weight:600;font-size:1.1rem}.equivalence-values{text-align:right}.equivalence-volume,.equivalence-ph{display:block;font-size:.9rem}.keyboard-shortcuts{display:none;position:fixed;bottom:20px;right:20px;background:rgba(0,0,0,.9);color:#fff;padding:15px 20px;border-radius:8px;font-size:.85rem;z-index:1000;box-shadow:0 4px 12px rgba(0,0,0,.3)}.keyboard-shortcuts.show{display:block}.shortcut-item{margin:5px 0}.shortcut-key{background:#4a5568;padding:2px 6px;border-radius:3px;margin-right:8px;font-family:monospace}.calculation-spinner{display:none;text-align:center;padding:20px}.calculation-spinner.active{display:block}.spinner{border:4px solid #f3f4f6;border-top:4px solid #667eea;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:0 auto}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}