:root{--primary:#409eff;--primary-hover:#66b1ff;--bg:linear-gradient(#f0f2f5b3, #f0f2f580);--card-bg:#fff;--text-color:#303133;--sub-text:#606266;--border-radius:12px;--transition:.3s ease}*,:before,:after{box-sizing:border-box}*{margin:0;padding:0}html,body,#app{width:100%;max-width:100%;overflow-x:hidden}html{scrollbar-width:none;overflow-y:auto}html::-webkit-scrollbar{width:0;height:0}body{background:var(--bg);color:var(--text-color);font-family:Helvetica Neue,sans-serif}button,input{font:inherit}.main-content{z-index:1;background:0 0;flex:1;min-width:0;max-width:100%;padding:20px;position:relative;overflow:hidden auto}#controls{background:#fff;border-radius:8px;flex-wrap:wrap;align-items:center;gap:12px;margin:20px 0;padding:12px 16px;display:flex;box-shadow:0 2px 8px #0000000d}#controls button,.refresh-btn{background:var(--primary);color:#fff;cursor:pointer;transition:background var(--transition), transform .2s;border:none;border-radius:999px;padding:8px 14px}#controls button:hover,.refresh-btn:hover{background:var(--primary-hover);transform:translateY(-1px)}#controls input[type=text]{border:1px solid #dcdfe6;border-radius:4px;width:160px;padding:6px 10px}#deviceContainer{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));align-items:stretch;gap:20px;display:grid}#deviceContainer>*{min-width:0;height:100%}.device-meta{color:var(--sub-text);margin-bottom:8px;font-size:14px}.section-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.empty-block{color:var(--sub-text);background:#fff;border-radius:12px;padding:24px}.btn-primary,.btn-secondary,.btn-danger{cursor:pointer;border:none;border-radius:10px;padding:8px 14px}.btn-primary{color:#fff;background:#409eff}.btn-secondary{color:#303133;background:#f2f3f5}.btn-danger{color:#fff;background:#f56c6c}.settings-card{background:#fff;border-radius:12px;padding:20px;box-shadow:0 4px 12px #0000000f}@media (width<=768px){.settings-card{border-radius:14px;padding:12px 14px}}.settings-title{margin-bottom:16px;font-size:20px}.form-row{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:14px;display:flex}.form-row label{color:#606266;min-width:90px}.date-input{border:1px solid #dcdfe6;border-radius:8px;min-width:180px;padding:8px 10px}.selector-box{flex-wrap:wrap;align-items:stretch;gap:12px;display:flex}.selector-box>*{min-height:40px}.selector-box .date-input,.selector-box .btn-primary{min-width:160px}.flow-page{gap:20px;display:grid}.chart-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}@media (width<=1279px){.chart-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.chart-card,.info-card{background:#ffffffad;border:1px solid #ffffffb8;border-radius:16px;min-height:320px;padding:18px;box-shadow:0 4px 16px #0f172a0f,0 1px #fff9}.card-title{color:#1e293b;letter-spacing:-.01em;margin-bottom:14px;font-size:17px;font-weight:700}.chart-canvas-wrap{box-sizing:border-box;background:#f8fafc99;border-radius:12px;width:100%;height:240px;padding:8px;position:relative}.info-card p{color:#64748b;border-bottom:1px solid #e2e8f099;justify-content:space-between;align-items:center;margin:0;padding:10px 0;font-size:14px;display:flex}.info-card p:last-child{border-bottom:none}.info-card strong{color:#1e293b;font-size:16px;font-weight:700}body{background:#f5f7fb;margin:0;font-family:Arial,sans-serif}button{cursor:pointer}body:has(.app-container.night-mode) input[type=range]{accent-color:#60a5fa}body:has(.app-container.night-mode) input[type=range]::-webkit-slider-runnable-track{background:#1e293beb;border:1px solid #94a3b838;border-radius:999px;height:6px}body:has(.app-container.night-mode) input[type=range]::-webkit-slider-thumb{background:#60a5fa;border:2px solid #bfdbfef2;border-radius:50%;width:18px;height:18px;margin-top:-7px;box-shadow:0 0 0 4px #2563eb38}body:has(.app-container.night-mode) input[type=range]::-moz-range-track{background:#1e293beb;border:1px solid #94a3b838;border-radius:999px;height:6px}body:has(.app-container.night-mode) input[type=range]::-moz-range-thumb{background:#60a5fa;border:2px solid #bfdbfef2;border-radius:50%;width:18px;height:18px;box-shadow:0 0 0 4px #2563eb38}body:has(.app-container.night-mode) input[type=range]:disabled{opacity:.48}.error-text{color:#e74c3c;margin:0}.dashboard-page{padding:24px}@media (width<=768px){#deviceContainer{grid-template-columns:1fr;align-items:start;gap:10px}#deviceContainer>*{height:auto}.chart-grid{grid-template-columns:1fr;gap:12px}.chart-card,.info-card{border-radius:16px;min-height:0;padding:14px 16px}.card-title{margin-bottom:10px;font-size:15px;font-weight:700}.section-header{margin-bottom:10px}.section-header h2{font-size:18px}.flow-page{gap:12px}.chart-canvas-wrap{border-radius:10px;height:200px;padding:6px}}.login-beam-transition[data-v-b7de8d87]{--lamp-x:50%;--lamp-y:10%;--lamp-angle:0deg;--beam-gradient-angle:180deg;--transition-cover:#ffefcd;z-index:100000;pointer-events:auto;contain:strict;position:fixed;inset:0;overflow:hidden}.beam-grow[data-v-b7de8d87],.beam-glow[data-v-b7de8d87],.beam-halo[data-v-b7de8d87],.beam-rim[data-v-b7de8d87],.beam[data-v-b7de8d87],.swap-shield[data-v-b7de8d87],.lamp-snapshot[data-v-b7de8d87]{pointer-events:none;position:absolute}.beam-grow[data-v-b7de8d87]{transform-origin:var(--beam-origin-x) var(--beam-origin-y);inset:0}.beam-glow[data-v-b7de8d87]{z-index:5;inset:0}.beam-halo--far[data-v-b7de8d87]{z-index:1;--beam-band-1-x:var(--beam-band-far-1-x);--beam-band-1-y:var(--beam-band-far-1-y);--beam-band-2-x:var(--beam-band-far-2-x);--beam-band-2-y:var(--beam-band-far-2-y);--beam-band-3-x:var(--beam-band-far-3-x);--beam-band-3-y:var(--beam-band-far-3-y);--beam-full-1-x:var(--beam-full-far-1-x);--beam-full-1-y:var(--beam-full-far-1-y);--beam-full-2-x:var(--beam-full-far-2-x);--beam-full-2-y:var(--beam-full-far-2-y);--beam-full-3-x:var(--beam-full-far-3-x);--beam-full-3-y:var(--beam-full-far-3-y);background:#ffb26014}.beam-halo--mid[data-v-b7de8d87]{z-index:2;--beam-band-1-x:var(--beam-band-mid-1-x);--beam-band-1-y:var(--beam-band-mid-1-y);--beam-band-2-x:var(--beam-band-mid-2-x);--beam-band-2-y:var(--beam-band-mid-2-y);--beam-band-3-x:var(--beam-band-mid-3-x);--beam-band-3-y:var(--beam-band-mid-3-y);--beam-full-1-x:var(--beam-full-mid-1-x);--beam-full-1-y:var(--beam-full-mid-1-y);--beam-full-2-x:var(--beam-full-mid-2-x);--beam-full-2-y:var(--beam-full-mid-2-y);--beam-full-3-x:var(--beam-full-mid-3-x);--beam-full-3-y:var(--beam-full-mid-3-y);background:#ffd0842e}.beam-halo--near[data-v-b7de8d87]{z-index:3;--beam-band-1-x:var(--beam-band-near-1-x);--beam-band-1-y:var(--beam-band-near-1-y);--beam-band-2-x:var(--beam-band-near-2-x);--beam-band-2-y:var(--beam-band-near-2-y);--beam-band-3-x:var(--beam-band-near-3-x);--beam-band-3-y:var(--beam-band-near-3-y);--beam-full-1-x:var(--beam-full-near-1-x);--beam-full-1-y:var(--beam-full-near-1-y);--beam-full-2-x:var(--beam-full-near-2-x);--beam-full-2-y:var(--beam-full-near-2-y);--beam-full-3-x:var(--beam-full-near-3-x);--beam-full-3-y:var(--beam-full-near-3-y);background:#fffae859}.beam-rim[data-v-b7de8d87]{z-index:4;background:linear-gradient(var(--beam-gradient-angle), #fffbe9, #ffe4ac 60%, #ffd98f);--beam-band-1-x:var(--beam-band-rim-1-x);--beam-band-1-y:var(--beam-band-rim-1-y);--beam-band-2-x:var(--beam-band-rim-2-x);--beam-band-2-y:var(--beam-band-rim-2-y);--beam-band-3-x:var(--beam-band-rim-3-x);--beam-band-3-y:var(--beam-band-rim-3-y);--beam-full-1-x:var(--beam-full-rim-1-x);--beam-full-1-y:var(--beam-full-rim-1-y);--beam-full-2-x:var(--beam-full-rim-2-x);--beam-full-2-y:var(--beam-full-rim-2-y);--beam-full-3-x:var(--beam-full-rim-3-x);--beam-full-3-y:var(--beam-full-rim-3-y)}.beam-halo[data-v-b7de8d87],.beam-rim[data-v-b7de8d87]{clip-path:polygon(var(--beam-band-1-x) var(--beam-band-1-y), var(--beam-band-2-x) var(--beam-band-2-y), var(--beam-band-3-x) var(--beam-band-3-y));animation:1s linear both login-fan-open-b7de8d87,1s linear both login-beam-ignite-b7de8d87}.is-revealing .beam-halo[data-v-b7de8d87],.is-revealing .beam-rim[data-v-b7de8d87]{animation:1.1s linear both login-fan-close-b7de8d87,1.1s linear both login-beam-extinguish-b7de8d87}.beam[data-v-b7de8d87]{z-index:1;background:linear-gradient(var(--beam-gradient-angle), #fff8e8, #ffe0a4 42%, var(--transition-cover) 100%);opacity:0;will-change:clip-path, opacity;clip-path:polygon(var(--beam-band-1-x) var(--beam-band-1-y), var(--beam-band-2-x) var(--beam-band-2-y), var(--beam-band-3-x) var(--beam-band-3-y));animation:1s linear both login-fan-open-b7de8d87,1s linear both login-beam-ignite-b7de8d87;inset:0}.is-revealing .beam[data-v-b7de8d87]{animation:1.1s linear both login-fan-close-b7de8d87,1.1s linear both login-beam-extinguish-b7de8d87}.swap-shield[data-v-b7de8d87]{z-index:3;background:var(--transition-cover);display:none;inset:0}.is-fade .swap-shield[data-v-b7de8d87]{animation:1s linear both login-shield-hold-b7de8d87;display:block}.is-revealing .swap-shield[data-v-b7de8d87]{animation:1.1s linear both login-route-fade-b7de8d87}.is-fade .beam-grow[data-v-b7de8d87],.is-fade .beam-glow[data-v-b7de8d87],.is-fade .lamp-snapshot[data-v-b7de8d87]{display:none}.lamp-snapshot[data-v-b7de8d87]{left:var(--lamp-x);z-index:6;transform-origin:50% 0;width:240px;height:240px;animation:1s linear both login-lamp-ignite-b7de8d87,1s linear both login-lamp-retract-b7de8d87;top:0;transform:translate(-50%)}@keyframes login-fan-open-b7de8d87{0%{clip-path:polygon(var(--beam-band-1-x) var(--beam-band-1-y), var(--beam-band-2-x) var(--beam-band-2-y), var(--beam-band-3-x) var(--beam-band-3-y));animation-timing-function:cubic-bezier(.7,0,.6,.98)}90%,to{clip-path:polygon(var(--beam-full-1-x) var(--beam-full-1-y), var(--beam-full-2-x) var(--beam-full-2-y), var(--beam-full-3-x) var(--beam-full-3-y))}}@keyframes login-beam-ignite-b7de8d87{0%{opacity:0;animation-timing-function:cubic-bezier(.4,0,.6,1)}20%,to{opacity:1}}@keyframes login-lamp-ignite-b7de8d87{0%{opacity:0;animation-timing-function:cubic-bezier(.4,0,.6,1)}20%,to{opacity:1}}@keyframes login-shield-hold-b7de8d87{0%{opacity:0;animation-timing-function:cubic-bezier(.4,0,.6,1)}20%,to{opacity:1}}@keyframes login-fan-close-b7de8d87{0%{clip-path:polygon(var(--beam-full-1-x) var(--beam-full-1-y), var(--beam-full-2-x) var(--beam-full-2-y), var(--beam-full-3-x) var(--beam-full-3-y));animation-timing-function:cubic-bezier(.4,.02,.3,1)}81.82%,to{clip-path:polygon(var(--beam-band-1-x) var(--beam-band-1-y), var(--beam-band-2-x) var(--beam-band-2-y), var(--beam-band-3-x) var(--beam-band-3-y))}}@keyframes login-beam-extinguish-b7de8d87{0%,81.82%{opacity:1;animation-timing-function:cubic-bezier(.4,0,.6,1)}to{opacity:0}}@keyframes login-lamp-retract-b7de8d87{0%,20%{animation-timing-function:cubic-bezier(.55,0,.75,.6);transform:translate(-50%)scale(1)}90%,to{transform:translate(-50%,-14vh)scale(.18)}}@keyframes login-route-fade-b7de8d87{0%,81.82%{opacity:1;animation-timing-function:cubic-bezier(.4,0,.6,1)}to{opacity:0}}.beam-grow[data-v-b7de8d87]{animation:1s linear both login-grow-open-b7de8d87}.is-revealing .beam-grow[data-v-b7de8d87]{animation:1.1s linear both login-grow-close-b7de8d87}@keyframes login-grow-open-b7de8d87{0%{animation-timing-function:cubic-bezier(.4,0,.6,1);transform:scaleY(.12)}20%,to{transform:scaleY(1)}}@keyframes login-grow-close-b7de8d87{0%,81.82%{animation-timing-function:cubic-bezier(.4,0,.6,1);transform:scaleY(1)}to{transform:scaleY(.12)}}.beam-rim[data-v-b7de8d87]{animation:1s linear both login-fan-open-b7de8d87,1s linear both login-beam-ignite-b7de8d87,1s linear both login-rim-open-b7de8d87}.is-revealing .beam-rim[data-v-b7de8d87]{animation:1.1s linear both login-fan-close-b7de8d87,1.1s linear both login-beam-extinguish-b7de8d87,1.1s linear both login-rim-close-b7de8d87}@keyframes login-rim-open-b7de8d87{0%{opacity:0}20%{opacity:.5}52%{opacity:.95}90%,to{opacity:.28}}@keyframes login-rim-close-b7de8d87{0%{opacity:.28}41%{opacity:.95}81.82%{opacity:.5;animation-timing-function:cubic-bezier(.4,0,.6,1)}to{opacity:0}}.flash[data-v-b7de8d87],.settle[data-v-b7de8d87]{pointer-events:none;opacity:0;position:absolute;inset:0}.flash[data-v-b7de8d87]{z-index:8;background:radial-gradient(130% 95% at 50% 42%,#fffdf4f2,#fff0d08c 60%,#ffe2aa40);animation:1s linear both login-flash-open-b7de8d87}.is-revealing .flash[data-v-b7de8d87]{opacity:0;animation:none}@keyframes login-flash-open-b7de8d87{0%,90%{opacity:0;animation-timing-function:cubic-bezier(.2,0,.4,1)}95%{opacity:.16;animation-timing-function:cubic-bezier(.4,0,.6,1)}to{opacity:0}}.settle[data-v-b7de8d87]{z-index:7;background:linear-gradient(#fffaeccc,#fff0d280)}.is-revealing .settle[data-v-b7de8d87]{animation:1.1s linear both login-settle-close-b7de8d87}@keyframes login-settle-close-b7de8d87{0%{opacity:.14;animation-timing-function:cubic-bezier(.3,0,.2,1)}45.45%,to{opacity:0}}@media (width<=760px){.lamp-snapshot[data-v-b7de8d87]{width:187.2px;height:187.2px}}.is-degraded .beam-halo--far[data-v-b7de8d87],.is-degraded .beam-halo--mid[data-v-b7de8d87]{display:none}@media (prefers-reduced-motion:reduce){.beam-grow[data-v-b7de8d87],.flash[data-v-b7de8d87],.settle[data-v-b7de8d87],.lamp-snapshot[data-v-b7de8d87]{display:none}.swap-shield[data-v-b7de8d87]{animation:1s linear both login-shield-hold-b7de8d87;display:block}.is-revealing .swap-shield[data-v-b7de8d87]{animation:1.1s linear both login-route-fade-b7de8d87}}.toast-container{z-index:99999;pointer-events:none;flex-direction:column;align-items:center;gap:10px;max-width:calc(100vw - 32px);display:flex;position:fixed;top:24px;left:50%;transform:translate(-50%)}.toast-item{pointer-events:auto;border:1px solid #0000;border-radius:14px;align-items:center;gap:10px;max-width:420px;padding:10px 18px;font-size:14px;font-weight:700;line-height:1.4;display:flex;box-shadow:0 8px 24px #0f172a1a}.toast-icon{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;font-size:13px;font-weight:900;line-height:1;display:inline-flex}.toast-text{min-width:0}.toast-item.success{color:#15803d;background:#f0fdf4;border-color:#bbf7d0}.toast-item.success .toast-icon{color:#fff;background:#22c55e}.toast-item.error{color:#b91c1c;background:#fff5f5;border-color:#fecaca}.toast-item.error .toast-icon{color:#fff;background:#ef4444}.toast-enter-active{transition:opacity .3s cubic-bezier(.22,1,.36,1),transform .3s cubic-bezier(.22,1,.36,1)}.toast-leave-active{transition:opacity .25s ease-in,transform .25s ease-in}.toast-enter-from{opacity:0;transform:translateY(-16px)}.toast-leave-to{opacity:0;transform:translateY(-12px)}@media (width<=768px){.toast-container{top:calc(env(safe-area-inset-top,0px) + 88px);align-items:stretch;gap:8px;max-width:none;left:16px;right:16px;transform:none}.toast-item{border-radius:12px;width:100%;max-width:none;padding:11px 16px;font-size:13px}}.shake{animation:.4s both shakeX}@keyframes shakeX{0%,to{transform:translate(0)}10%{transform:translate(-4px)}30%{transform:translate(4px)}50%{transform:translate(-4px)}70%{transform:translate(4px)}90%{transform:translate(-2px)}}
