*{margin:0;padding:0;box-sizing:border-box}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f7f8fa;color:#333;min-height:100vh}#root{min-height:100vh}.tank-liquid{background:linear-gradient(180deg,#3498db,#2980b9)}.tank-liquid.low{background:linear-gradient(180deg,#e74c3c,#c0392b)}.tank-liquid.medium{background:linear-gradient(180deg,#f39c12,#e67e22)}.tank-liquid.high{background:linear-gradient(180deg,#2ecc71,#27ae60)}.tank-liquid:before{content:"";position:absolute;top:-8px;left:-50%;width:200%;height:16px;background:radial-gradient(ellipse at center,transparent 0%,transparent 40%,currentColor 40%,currentColor 100%);background-size:20px 16px;animation:wave 1.5s linear infinite;opacity:.5}.tank-liquid.low:before{color:#e74c3c}.tank-liquid.medium:before{color:#f39c12}.tank-liquid.high:before{color:#2ecc71}@keyframes wave{0%{transform:translate(0)}to{transform:translate(20px)}}.app-layout{display:flex;min-height:100vh}.sidebar{position:sticky;top:0;width:240px;min-width:240px;height:100vh;background:#fff;border-right:1px solid #e5e7eb;display:flex;flex-direction:column;z-index:100;overflow-y:auto}.sidebar-brand{display:flex;align-items:center;gap:10px;padding:20px 20px 16px;border-bottom:1px solid #e5e7eb}.brand-icon{flex-shrink:0}.brand-text{font-size:1.15rem;font-weight:700;color:#3498db;letter-spacing:-.3px}.sidebar-nav{flex:1;padding:12px 0;overflow-y:auto}.nav-item{display:flex;align-items:center;gap:10px;padding:10px 20px;margin:2px 8px;border-radius:6px;text-decoration:none;color:#4b5563;font-size:.9rem;font-weight:500;transition:background-color .15s,color .15s;position:relative}.nav-item:hover{background-color:#eff6ff;color:#2980b9}.nav-item.active{background-color:#eff6ff;color:#3498db;font-weight:600}.nav-item.active:before{content:"";position:absolute;left:-8px;top:4px;bottom:4px;width:3px;background:#3498db;border-radius:0 3px 3px 0}.nav-item svg{flex-shrink:0}.sidebar-footer{padding:16px 20px;border-top:1px solid #e5e7eb}.main-wrapper{flex:1;display:flex;flex-direction:column;min-width:0}.main-header{display:flex;align-items:center;gap:12px;min-height:64px;padding:0 2rem;background:#fff;border-bottom:1px solid #e5e7eb;position:sticky;top:0;z-index:50}.menu-toggle{display:none;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:none;border-radius:6px;cursor:pointer;color:#4b5563;transition:background-color .15s}.menu-toggle:hover{background-color:#f3f4f6}.page-title{font-size:1.25rem;font-weight:600;color:#111827}.content-area{flex:1;padding:1.75rem 2rem}.sidebar-backdrop{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;z-index:90}@media (max-width: 1024px){.content-area{padding:1.25rem 1.5rem}.main-header{padding:0 1.5rem}}@media (max-width: 768px){.sidebar{position:fixed;left:-260px;transition:left .3s ease}.sidebar.open{left:0}.sidebar-backdrop{display:block}.menu-toggle{display:flex}.content-area{padding:1rem}.main-header{padding:0 1rem}.page-title{font-size:1.1rem}}