.water-calculator-wrapper{--water-primary: #0ea5e9;--water-primary-dark: #0284c7;--water-primary-light: #38bdf8;--water-secondary: #06b6d4;--water-gradient: linear-gradient(135deg, #0ea5e9 0%, #06b6d4 50%, #22d3ee 100%);--water-card-bg: #ffffff;--water-border: #e5e7eb;--water-text: #1f2937;--water-text-muted: #6b7280;font-family:system-ui,-apple-system,sans-serif;max-width:900px;margin:0 auto}.water-header{text-align:center;margin-bottom:2rem}.water-title{font-size:2.25rem;font-weight:800;background:var(--water-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.75rem}.water-description{font-size:1.1rem;color:var(--water-text-muted);max-width:600px;margin:0 auto}.water-formula-section{background:linear-gradient(135deg,#e0f2fe,#cffafe);border-radius:16px;padding:1.5rem;margin-bottom:2rem;border:1px solid #7dd3fc}.water-formula-title{font-size:1.1rem;font-weight:700;color:var(--water-primary-dark);margin-bottom:1rem;text-align:center}.water-formula-grid{display:flex;flex-direction:column;gap:1rem}.water-formula-card{background:#fff;border-radius:12px;padding:1.25rem;box-shadow:0 2px 8px #0ea5e91a;border:1px solid #7dd3fc}.water-formula-label{font-size:.9rem;font-weight:700;color:var(--water-primary);margin-bottom:.75rem;text-align:center}.water-formula-display{min-height:5rem;display:flex;align-items:center;justify-content:center;overflow-x:auto;overflow-y:hidden;padding:.5rem}.water-calculator-container{background:var(--water-card-bg);border-radius:20px;padding:2rem;box-shadow:0 10px 40px #0ea5e926;border:1px solid var(--water-border);margin-bottom:2rem}.water-unit-toggle{display:flex;gap:.5rem;margin-bottom:1.5rem;background:#f3f4f6;padding:.375rem;border-radius:12px}.water-unit-btn{flex:1;padding:.75rem 1rem;border:none;background:transparent;border-radius:10px;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;align-items:center;gap:.125rem}.water-unit-btn:hover{background:#0ea5e91a}.water-unit-btn.active{background:var(--water-gradient);box-shadow:0 4px 12px #0ea5e94d}.water-unit-label{font-weight:700;font-size:.95rem;color:var(--water-text)}.water-unit-btn.active .water-unit-label{color:#fff}.water-unit-detail{font-size:.75rem;color:var(--water-text-muted)}.water-unit-btn.active .water-unit-detail{color:#ffffffd9}.water-form{display:flex;flex-direction:column;gap:1.25rem}.water-form-group{display:flex;flex-direction:column;gap:.5rem}.water-label{font-weight:600;font-size:.9rem;color:var(--water-text)}.water-input-wrapper{display:flex;align-items:center;background:#f9fafb;border:2px solid var(--water-border);border-radius:12px;padding:0 1rem;transition:all .2s}.water-input-wrapper:focus-within{border-color:var(--water-primary);box-shadow:0 0 0 3px #0ea5e91a;background:#fff}.water-input{flex:1;padding:.875rem 0;border:none;background:transparent;font-size:1.25rem;font-weight:700;color:var(--water-text);outline:none}.water-input::-moz-placeholder{color:#9ca3af;font-weight:400}.water-input::placeholder{color:#9ca3af;font-weight:400}.water-input-unit{font-size:1rem;font-weight:600;color:var(--water-text-muted);margin-left:.5rem}.water-activity-buttons{display:grid;grid-template-columns:repeat(5,1fr);gap:.5rem}.water-activity-btn{padding:.875rem .5rem;border:2px solid var(--water-border);background:#fff;border-radius:10px;cursor:pointer;transition:all .2s;text-align:center}.water-activity-btn:hover{border-color:var(--water-primary-light)}.water-activity-btn.active{border-color:var(--water-primary);background:linear-gradient(135deg,#e0f2fe,#cffafe)}.water-activity-label{display:block;font-weight:700;font-size:.75rem;color:var(--water-text)}.water-activity-btn.active .water-activity-label{color:var(--water-primary)}.water-climate-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}.water-climate-btn{padding:1rem;border:2px solid var(--water-border);background:#fff;border-radius:12px;cursor:pointer;transition:all .2s;text-align:center}.water-climate-btn:hover{border-color:var(--water-primary-light)}.water-climate-btn.active{border-color:var(--water-primary);background:linear-gradient(135deg,#e0f2fe,#cffafe)}.water-climate-label{display:block;font-weight:700;font-size:.9rem;color:var(--water-text);margin-bottom:.25rem}.water-climate-btn.active .water-climate-label{color:var(--water-primary)}.water-climate-desc{font-size:.75rem;color:var(--water-text-muted)}.water-actions{display:flex;gap:.75rem;margin-top:.5rem}.water-calculate-btn{flex:2;padding:1rem 2rem;background:var(--water-gradient);color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s;box-shadow:0 4px 15px #0ea5e94d}.water-calculate-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0ea5e966}.water-reset-btn{flex:1;padding:1rem;background:#f3f4f6;color:var(--water-text-muted);border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.water-reset-btn:hover{background:#e5e7eb;color:var(--water-text)}.water-results{margin-top:2rem;padding-top:2rem;border-top:2px solid var(--water-border)}.water-results-title{font-size:1.25rem;font-weight:700;color:var(--water-text);margin-bottom:1.25rem;text-align:center}.water-primary-result{background:var(--water-gradient);border-radius:16px;padding:2rem;text-align:center;color:#fff;margin-bottom:1.5rem;position:relative}.water-drop-icon{font-size:3rem;margin-bottom:.5rem}.water-primary-label{display:block;font-size:.9rem;font-weight:600;opacity:.9;margin-bottom:.5rem}.water-primary-value{display:block;font-size:3.5rem;font-weight:800;margin-bottom:.25rem}.water-primary-desc{display:block;font-size:.85rem;opacity:.8}.water-conversions-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.5rem}.water-conversion-card{background:#f0f9ff;border-radius:12px;padding:1.25rem;text-align:center;border:1px solid #7dd3fc}.water-conversion-value{display:block;font-size:1.75rem;font-weight:800;color:var(--water-primary);margin-bottom:.25rem}.water-conversion-label{font-size:.8rem;color:var(--water-text-muted);font-weight:600}.water-visual{background:#f9fafb;border-radius:12px;padding:1.25rem;margin-bottom:1rem}.water-visual-title{font-size:.9rem;font-weight:700;color:var(--water-text);margin-bottom:1rem;text-align:center}.water-glasses{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.water-glass{font-size:1.5rem;animation:waterPop .3s ease forwards;opacity:0;transform:scale(0)}@keyframes waterPop{to{opacity:1;transform:scale(1)}}.water-more{font-size:1rem;font-weight:700;color:var(--water-primary);align-self:center;margin-left:.5rem}.water-hourly{background:linear-gradient(135deg,#e0f2fe,#cffafe);border-radius:12px;padding:1rem;text-align:center;border:1px solid #7dd3fc}.water-hourly-label{font-size:.85rem;color:var(--water-text-muted)}.water-hourly-value{display:block;font-size:1.5rem;font-weight:800;color:var(--water-primary);margin:.25rem 0}.water-hourly-desc{font-size:.8rem;color:var(--water-text-muted)}.water-content{margin-top:3rem}.water-content-section{margin-bottom:2.5rem}.water-section-title{font-size:1.5rem;font-weight:700;color:var(--water-text);margin-bottom:1rem;padding-bottom:.5rem;border-bottom:3px solid var(--water-primary);display:inline-block}.water-paragraph{color:var(--water-text);line-height:1.7;margin-bottom:1rem}.water-features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-top:1.5rem}.water-feature-card{background:linear-gradient(135deg,#e0f2fe,#cffafe);border-radius:12px;padding:1.25rem;text-align:center;border:1px solid #7dd3fc}.water-feature-icon{font-size:2rem;display:block;margin-bottom:.75rem}.water-feature-title{font-size:1rem;font-weight:700;color:var(--water-primary-dark);margin-bottom:.5rem}.water-feature-desc{font-size:.85rem;color:var(--water-text-muted);line-height:1.5}.water-tips-list{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}.water-tip-card{display:flex;gap:1rem;background:#f9fafb;padding:1.25rem;border-radius:12px;border-left:4px solid var(--water-primary)}.water-tip-icon{font-size:1.5rem;flex-shrink:0}.water-tip-title{font-size:1rem;font-weight:700;color:var(--water-text);margin-bottom:.25rem}.water-tip-text{font-size:.9rem;color:var(--water-text-muted);line-height:1.5}.water-table-wrapper{overflow-x:auto;margin-top:1rem;border-radius:12px;border:1px solid var(--water-border)}.water-table{width:100%;border-collapse:collapse;font-size:.9rem}.water-table th,.water-table td{padding:.875rem 1rem;text-align:left;border-bottom:1px solid var(--water-border)}.water-table th{background:var(--water-primary);color:#fff;font-weight:600}.water-table th:first-child{border-top-left-radius:11px}.water-table th:last-child{border-top-right-radius:11px}.water-table tbody tr:hover{background:#f9fafb}.water-row-mild td:first-child{border-left:4px solid #fbbf24}.water-row-moderate td:first-child{border-left:4px solid #f97316}.water-row-severe td:first-child{border-left:4px solid #ef4444}.water-faq-list{display:flex;flex-direction:column;gap:.75rem;margin-top:1rem}.water-faq-item{background:#f9fafb;border-radius:12px;border:1px solid var(--water-border);overflow:hidden}.water-faq-question{padding:1rem 1.25rem;font-weight:600;color:var(--water-text);cursor:pointer;display:flex;justify-content:space-between;align-items:center;list-style:none}.water-faq-question::-webkit-details-marker{display:none}.water-faq-question:after{content:"+";font-size:1.25rem;font-weight:300;color:var(--water-primary);transition:transform .2s}.water-faq-item[open] .water-faq-question:after{transform:rotate(45deg)}.water-faq-item[open] .water-faq-question{background:linear-gradient(135deg,#e0f2fe,#cffafe);border-bottom:1px solid var(--water-border)}.water-faq-answer{padding:1rem 1.25rem;color:var(--water-text-muted);line-height:1.6}@media (max-width: 640px){.water-calculator-container{padding:1.25rem}.water-title{font-size:1.75rem}.water-activity-buttons{grid-template-columns:repeat(3,1fr)}.water-climate-buttons,.water-conversions-grid{grid-template-columns:1fr}.water-actions{flex-direction:column}.water-calculate-btn,.water-reset-btn{flex:none}.water-features-grid{grid-template-columns:1fr}.water-formula-display{min-height:4rem}.water-primary-value{font-size:2.5rem}}