.unit-category{margin-bottom:2rem}.unit-category h3{font-size:1.125rem;font-weight:600;color:#374151;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px solid #e5e7eb;display:flex;align-items:center}.unit-category h3:before{content:"";width:4px;height:1.125rem;background-color:#3b82f6;margin-right:.75rem;border-radius:2px}.unit-grid{display:grid;grid-template-columns:1fr;gap:1rem}@media (min-width: 640px){.unit-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.unit-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width: 1280px){.unit-grid{grid-template-columns:repeat(4,1fr)}}.input-group{display:flex;flex-direction:column;gap:.5rem}.input-group label{font-weight:600;color:#374151;font-size:.875rem;margin-bottom:.25rem}.input-group input{padding:.75rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:.875rem;transition:all .2s ease;background-color:#fff}.input-group input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.input-group input:hover{border-color:#9ca3af}.input-group input::placeholder{color:#9ca3af}.input-group input:not(:placeholder-shown){border-color:#facc15;font-weight:500}.button-container{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:1.5rem}.button-container button{padding:.75rem 1.5rem;border:none;border-radius:.5rem;font-weight:600;font-size:.875rem;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center;min-width:100px}.clear-button{background-color:#ef4444;color:#fff}.clear-button:hover{background-color:#dc2626;transform:translateY(-1px);box-shadow:0 4px 12px #ef44444d}.clear-button:active{transform:translateY(0);box-shadow:0 2px 4px #ef44444d}.tips{margin-top:2rem;padding:1.5rem;background-color:#f8fafc;border-radius:.75rem;border-left:4px solid #3b82f6}.tips h3{color:#1e293b;font-size:1rem;font-weight:600;margin-bottom:1rem}.tips ul{list-style:none;padding:0;margin:0}.tips li{color:#64748b;font-size:.875rem;line-height:1.6;margin-bottom:.5rem;padding-left:1.5rem;position:relative}.tips li:before{content:"•";color:#3b82f6;font-weight:700;position:absolute;left:0}@media (max-width: 768px){.unit-grid{grid-template-columns:1fr}.button-container{flex-direction:column;align-items:stretch}.button-container button{min-width:auto;width:100%}.tips{margin-top:1.5rem;padding:1rem}.input-group{padding:1rem}.input-group label{font-size:1rem}.input-group input{font-size:1rem;padding:.75rem}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.calculator-card,.input-group{animation:fadeIn .3s ease-out}.input-group input.error{border-color:#ef4444;box-shadow:0 0 0 3px #ef44441a;background-color:#fef2f2}.input-group input.success{border-color:#10b981;box-shadow:0 0 0 3px #10b9811a}.input-group input.loading{background-color:#f3f4f6;color:#9ca3af;cursor:wait}