:root{color-scheme:light;font-family:Segoe UI,HarmonyOS Sans SC,Microsoft YaHei UI,PingFang SC,system-ui,-apple-system,sans-serif;--page: #dbe8f4;--page-deep: #bfd0df;--surface: rgba(255, 255, 255, .9);--surface-solid: #ffffff;--text: #07101f;--muted: #4d5a69;--muted-soft: #8b96a3;--brand: #1f69d8;--brand-dark: #0d2d6d;--green: #078c6f;--red: #e65a55;--usage-fill: rgba(187, 238, 247, .342);--chip-usage-bg: rgba(220, 252, 231, .486);--chip-usage-text: #047857d8;--chip-open-bg: rgba(237, 233, 254, .486);--chip-open-text: #5a21b6d5;--chip-ping-bg: rgba(207, 250, 254, .459);--chip-ping-text: #0e7490d7;--chart-green: #10b981;--chart-blue: #2563eb;--chart-purple: #8b5cf6;--chart-cyan: #06b6d4;--chart-amber: #f59e0b;--chart-rose: #f43f5e;--line: rgba(111, 132, 154, .18);--shadow: 0 12px 28px rgba(57, 83, 111, .16), inset 0 1px 0 rgba(255, 255, 255, .86);--shadow-strong: 0 16px 34px rgba(47, 73, 101, .24), inset 0 1px 0 rgba(255, 255, 255, .92);background:var(--page);color:var(--text);-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html{min-width:320px;background:radial-gradient(circle at 18% 0%,rgba(255,255,255,.84),transparent 28rem),linear-gradient(180deg,#cfe0ef,#eaf1f8 42%,#dbe8f4)}body{min-width:320px;min-height:100svh;margin:0;background:transparent}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}button:disabled{cursor:not-allowed}:focus-visible{outline:none;box-shadow:0 0 0 4px #1f69d82e,var(--shadow)}.app-shell{position:relative;width:min(100%,520px);min-height:100svh;margin:0 auto;padding:calc(12px + env(safe-area-inset-top)) 12px calc(76px + env(safe-area-inset-bottom));overflow:visible}.auth-shell{display:grid;min-height:100svh;place-items:center;padding:18px}.auth-card{width:min(420px,100%);padding:22px;border:1px solid rgba(255,255,255,.78);border-radius:18px;background:linear-gradient(145deg,#fffffff2,#eff7ffdb);box-shadow:var(--shadow-strong)}.auth-brand{display:flex;gap:14px;align-items:center;margin-bottom:18px}.auth-brand>span{display:grid;width:52px;height:52px;place-items:center;border-radius:14px;background:#e7f0ff;color:var(--brand);font-size:26px}.auth-card h1{margin:0;color:var(--text);font-size:26px;line-height:1.1;font-weight:950}.auth-card p{margin:7px 0 0;color:var(--muted);font-size:13px;line-height:1.45}.auth-form{display:grid;gap:12px}.app-shell:before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(180deg,#bfd3e5f2,#f1f6fbc7 52%,#d6e3efeb),var(--page)}.topbar{display:grid;grid-template-columns:52px minmax(0,1fr) 52px;gap:12px;align-items:center;margin-bottom:14px}.topbar-spacer{display:block;width:52px;height:1px}.topbar-title{min-width:0;text-align:center}.topbar-title h1{margin:0;overflow:hidden;color:var(--text);font-size:24px;line-height:1.12;font-weight:900;letter-spacing:0;text-overflow:ellipsis;white-space:nowrap}.icon-button{display:grid;width:50px;height:50px;place-items:center;border:1px solid rgba(255,255,255,.78);border-radius:16px;background:linear-gradient(145deg,#ffffffeb,#e0ebf6e0);color:var(--text);cursor:pointer;box-shadow:var(--shadow);transition:transform .12s ease,box-shadow .16s ease}.lucide-icon{display:block;width:1em;height:1em;flex:0 0 auto;stroke-width:2.15}.icon-button:hover{box-shadow:var(--shadow-strong)}.icon-button:active{transform:translateY(1px)}.refresh-button .lucide-icon{margin-top:2px;font-size:22px}.refresh-button small{margin-top:-5px;font-size:12px;font-weight:800}.screen{display:grid;gap:8px}.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.summary-card,.town-card,.ip-row,.village-card,.settings-block,.empty-state{border:1px solid rgba(255,255,255,.74);border-radius:12px;background:linear-gradient(145deg,#fffffff0,#f6faffd1);box-shadow:var(--shadow)}.summary-card{min-height:126px;padding:12px;text-align:left}.ip-summary-card{width:100%;color:inherit;cursor:pointer}.summary-card h2{margin:0 0 12px;color:var(--text);font-size:16px;line-height:1.2;font-weight:900}.summary-line{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}.summary-line+.summary-line{margin-top:7px}.summary-line strong{display:block;color:var(--brand);font-size:25px;line-height:.95;font-weight:950;letter-spacing:0}.ip-summary-card .summary-line:first-of-type strong{color:var(--green)}.ip-summary-card .summary-line:last-of-type strong{color:var(--red)}.summary-line small{display:block;margin-top:3px;color:var(--text);font-size:13px;line-height:1.15}.summary-icon,.cloud-icon{flex:0 0 auto;color:var(--brand-dark);font-size:27px;line-height:1;filter:drop-shadow(0 5px 6px rgba(7,28,69,.16))}.home-icon{font-size:29px}.free-icon{color:var(--green)}.used-icon{color:var(--red)}.list-block,.ip-list{display:grid;gap:8px}.ip-list .ip-row{min-height:74px;padding:11px 12px}.ip-detail-sticky{position:sticky;top:0;z-index:14;display:grid;align-self:start;gap:8px;margin:-2px -2px 0;padding:2px 2px 8px;background:linear-gradient(180deg,#e8f0f8fa,#e8f0f8eb 78%,#e8f0f800);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.town-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.town-hero{position:relative;display:flex;min-height:82px;align-items:flex-start;justify-content:space-between;gap:12px;padding:14px;overflow:hidden;border:1px solid rgba(255,255,255,.74);border-radius:18px;background:radial-gradient(circle at 82% 16%,rgba(47,128,237,.16),transparent 8rem),linear-gradient(135deg,#ffffffe6,#daeaffc7)}.town-hero-copy{position:relative;z-index:1}.town-hero h1{margin:0;color:#061224;font-size:32px;line-height:1.05;font-weight:950}.town-hero p{display:flex;align-items:center;gap:8px;margin:11px 0 0;color:#0b57d0;font-size:14px;line-height:1.25;font-weight:900}.town-hero p .lucide-icon{font-size:18px}.town-hero p b{color:var(--muted-soft);font-weight:950}.town-detail-hero{min-height:82px;margin:0;padding:14px;border:1px solid rgba(255,255,255,.74);border-radius:18px;background:radial-gradient(circle at 82% 16%,rgba(47,128,237,.16),transparent 8rem),linear-gradient(135deg,#ffffffe6,#daeaffc7);box-shadow:var(--shadow)}.town-detail-hero h1{max-width:100%;font-size:32px}.town-detail-hero p{margin-top:11px;font-size:14px}.hero-edit-button{position:relative;z-index:1;flex:0 0 auto;align-self:flex-start;min-height:30px;padding:0 12px;border:1px solid rgba(31,105,216,.16);border-radius:999px;background:#ffffffdb;color:var(--brand);font-size:12px;font-weight:950;cursor:pointer;box-shadow:0 7px 14px #39536f1a}.hero-edit-button:active{transform:translateY(1px)}.result-limit-note{margin:2px 0 0;padding:10px 12px;border-radius:10px;background:#ffffffad;color:var(--muted);font-size:12px;line-height:1.45;font-weight:750}.town-card,.ip-row{display:grid;gap:9px;align-items:center;width:100%;min-height:58px;padding:10px 12px;color:inherit;text-align:left;cursor:pointer;transition:transform .12s ease,box-shadow .16s ease}.town-card{grid-template-columns:minmax(0,1fr);align-content:space-between;min-height:158px;padding:10px 9px;border-radius:12px}.ip-row{grid-template-columns:minmax(0,1fr) auto auto}.ip-row.is-readonly{cursor:default}.ip-row.is-readonly:hover{box-shadow:var(--shadow)}.town-card:hover,.ip-row:hover,.village-card:hover,.summary-card:hover{box-shadow:var(--shadow-strong)}.town-card:active,.ip-row:active,.village-card:active{transform:translateY(1px)}.town-card-head{display:grid;grid-template-columns:36px minmax(0,1fr);gap:7px;align-items:center}.town-icon{display:grid;width:36px;height:36px;place-items:center;border-radius:50%;background:linear-gradient(145deg,#2f80ed,#0b57d0);color:#fff;font-size:17px;box-shadow:0 8px 16px #1f69d829}.town-icon.is-county{background:linear-gradient(145deg,#2f80ed,#0b57d0)}.town-card strong,.ip-row strong{display:block;overflow-wrap:anywhere;color:var(--text);font-size:20px;line-height:1.18;font-weight:950}.town-card small,.ip-row small{display:block;margin-top:3px;color:#1f2937;font-size:11px;line-height:1.25;overflow-wrap:anywhere}.town-metrics{display:grid;gap:5px}.town-metrics small{display:grid;grid-template-columns:auto minmax(0,1fr);gap:5px;align-items:center;margin:0;min-height:25px;padding:3px 7px;border-radius:8px;background:#e7f0ffeb;color:#1852aa;font-size:10px;line-height:1.1;font-weight:900;white-space:nowrap}.town-metrics .lucide-icon{font-size:13px}.town-metrics b{font-size:10px;font-weight:950}.metric-pair{grid-template-columns:minmax(0,1fr) 14px minmax(0,1fr);align-items:center;width:100%;min-width:0;gap:2px;white-space:nowrap}.metric-side{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.metric-left{text-align:left}.metric-divider{justify-self:center;color:currentColor;font-style:normal;opacity:.72}.metric-right{text-align:right}.ip-camera-name{max-width:100%;color:#435267;font-weight:760}.pill,.status{flex:0 0 auto;max-width:min(46vw,220px);overflow:visible;padding:5px 9px;border-radius:999px;background:linear-gradient(145deg,#9da6b1,#77828f);color:#fff;font-size:12px;line-height:1.1;font-weight:900;overflow-wrap:anywhere;white-space:normal;box-shadow:inset 0 1px #ffffff52}.ip-row{position:relative;grid-template-columns:minmax(0,1fr) auto;align-items:start;border-radius:12px;background:radial-gradient(circle at 92% 14%,rgba(255,255,255,.86),transparent 5rem),linear-gradient(145deg,#fffffff5,#f6faffe0)}.ip-row.is-selecting{grid-template-columns:34px minmax(0,1fr) auto}.ip-row.is-selected{border-color:#2563eb75;box-shadow:0 0 0 2px #2563eb1f,var(--shadow)}.ip-select-button{display:grid;width:32px;height:32px;place-items:center;align-self:center;border:0;border-radius:9px;background:#2563eb14;color:#2563eb;cursor:pointer}.ip-select-button .lucide-icon{width:19px;height:19px;stroke-width:2.4}.ip-row.is-ping-offline{border-color:#dc262647;background:#fef2f2fa}.ip-row.is-ping-offline strong{color:#8f1f1f}.ip-row.is-ping-online{border-color:#05966947;background:#ecfdf5fa}.ip-row.is-ping-online strong{color:#065f46}.ip-edit-time{position:absolute;right:10px;bottom:5px;display:inline-flex;align-items:center;gap:4px;color:#4d5a69a8;font-size:10px;line-height:1;font-weight:750}.ip-time-edit-button{display:inline-grid;width:17px;height:17px;padding:0;place-items:center;border:0;border-radius:50%;background:#3b82f61a;color:#2563eb;cursor:pointer}.ip-time-edit-button .lucide-icon{width:11px;height:11px;stroke-width:2.6}.ip-time-edit-button:hover{background:#2563eb2e}.ip-time-edit-button:active{transform:translateY(1px)}.ip-tags{display:flex;max-width:min(48vw,280px);flex-wrap:wrap;justify-content:flex-end;gap:5px}.ip-bulk-toolbar{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-height:40px}.ip-bulk-toolbar.is-active{align-items:start;justify-content:space-between;gap:8px;padding:10px;border:1px solid rgba(203,213,225,.72);border-radius:12px;background:#ffffffdb;box-shadow:0 8px 18px #4755690f}.ip-bulk-toggle{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;gap:5px;min-height:36px;padding-inline:12px;white-space:nowrap}.ip-bulk-toggle .lucide-icon,.ip-bulk-actions .lucide-icon{width:16px;height:16px}.ip-bulk-summary{display:grid;gap:2px;align-content:center;min-width:110px}.ip-bulk-summary strong{color:var(--text);font-size:14px;font-weight:950}.ip-bulk-summary span{color:var(--muted);font-size:12px;font-weight:780}.ip-bulk-actions{display:grid;min-width:0;justify-items:end;justify-content:flex-end;gap:8px}.ip-bulk-buttons{display:flex;justify-content:flex-end;max-width:100%;gap:6px;overflow-x:auto;scrollbar-width:none}.ip-bulk-buttons::-webkit-scrollbar{display:none}.ip-bulk-buttons .primary-action,.ip-bulk-buttons .secondary-action{flex:0 0 auto;min-height:34px;padding-inline:11px;border-radius:10px;font-size:13px;white-space:nowrap}.ip-bulk-actions input{width:min(100%,210px);min-height:38px;min-width:210px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--text);font-size:13px;font-weight:760}.pill-used,.status.used{background:linear-gradient(145deg,#3b82f6,#1d4ed8)}.status.pending{background:linear-gradient(145deg,#fbbf24,#d97706)}.status.online{background:linear-gradient(145deg,#34d399,#059669)}.status.offline{background:linear-gradient(145deg,#fb7185,#e11d48)}.status.tone-ping-online,.ping-switch-option[data-ping-value="1"].is-active{background:linear-gradient(145deg,#10b981,#047857)}.status.tone-ping-offline,.ping-switch-option[data-ping-value="0"].is-active{background:linear-gradient(145deg,#fb7185,#e11d48)}.status.tone-point-pending,.ping-switch-option[data-switch-value=未加].is-active{background:linear-gradient(145deg,#3b82f6,#1d4ed8)}.status.tone-point-added,.ping-switch-option[data-switch-value=已加].is-active{background:linear-gradient(145deg,#14b8a6,#0f766e)}.status.tone-monitor-replace,.ping-switch-option[data-switch-value=新结构化设备替换].is-active{background:linear-gradient(145deg,#475569,#1e293b)}.status.tone-monitor-add,.ping-switch-option[data-switch-value=新结构化新增].is-active{background:linear-gradient(145deg,#06b6d4,#0e7490)}.status.tone-monitor-old-ip,.ping-switch-option[data-switch-value=老设备更换ip].is-active{background:linear-gradient(145deg,#f59e0b,#b45309)}.status.tone-device-uniview,.ping-switch-option[data-switch-value=宇视].is-active{background:linear-gradient(145deg,#2563eb,#1e40af)}.status.tone-device-hikvision,.ping-switch-option[data-switch-value=海康].is-active{background:linear-gradient(145deg,#ef4444,#b91c1c)}.status.tone-device-old-hikvision,.ping-switch-option[data-switch-value=老海康].is-active{background:linear-gradient(145deg,#8b5cf6,#6d28d9)}.status.tone-device-dahua,.ping-switch-option[data-switch-value=大华].is-active{background:linear-gradient(145deg,#f97316,#c2410c)}.pill-empty{background:linear-gradient(145deg,#9da6b1,#77828f)}.pill-edit{background:linear-gradient(145deg,#23b995,#078c6f)}.status.free{background:linear-gradient(145deg,#94a3b8,#64748b)}.chevron{color:#9aa3ad;font-size:20px;line-height:1}.village-card,.settings-block,.empty-state{padding:14px}.village-card{position:relative;isolation:isolate;overflow:hidden;--usage-progress: 0%}.village-card:before{content:"";position:absolute;inset:0 auto 0 0;z-index:0;width:var(--usage-progress);background:linear-gradient(90deg,#00d9ff57,#e2ffec57);pointer-events:none}.village-card>*{position:relative;z-index:1}.village-list{gap:8px}.village-list .village-card{min-height:158px;padding:10px 9px;border-radius:12px;background:radial-gradient(circle at 92% 18%,rgba(255,255,255,.9),transparent 6rem),linear-gradient(145deg,#fffffff7,#f6faffe6);box-shadow:var(--shadow)}.village-head{display:block}.village-copy{min-width:0}.village-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:7px}.village-head h2,.settings-block h2,.empty-state h2{margin:0 0 6px;color:var(--text);font-size:18px;line-height:1.25;font-weight:950}.village-title-row h2{min-width:0;margin-bottom:5px;overflow-wrap:anywhere;font-size:20px;line-height:1.18}.village-head p,.settings-block p,.empty-state p,.muted{margin:0 0 10px;color:var(--muted);font-size:13px;line-height:1.45}.village-head .village-detail-line{margin:1px 0 0;color:#a9a9a9;font-size:12px;line-height:1.25;font-weight:750}.village-metrics{display:grid;grid-auto-flow:column}.village-metrics>span{display:grid;grid-template-columns:auto minmax(0,1fr);min-width:0;min-height:25px;align-items:center;gap:5px;padding:3px 7px;border-radius:8px;background:#e7f0ffeb;color:#0b57d0;font-size:10px;line-height:1.1;font-weight:900;white-space:nowrap}.village-metrics .lucide-icon{font-size:13px}.metric-chip.metric-usage{background:var(--chip-usage-bg);color:var(--chip-usage-text)}.metric-chip.metric-open{background:var(--chip-open-bg);color:var(--chip-open-text)}.metric-chip.metric-ping{background:var(--chip-ping-bg);color:var(--chip-ping-text)}.village-metrics b{flex:0 0 auto;font-size:10px;font-weight:950}.village-metrics em{min-width:0;overflow:hidden;font-style:normal;text-overflow:ellipsis}.info-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;margin:10px 0 0}.segment-cell{grid-column:span 5}.mask-cell{grid-column:span 3}.gateway-cell{grid-column:span 4}.vlan-cell{grid-column:span 3}.info-grid div,.settings-stats div{min-width:0;padding:7px;border:1px solid var(--line);border-radius:8px;background:#eff6fdb8}.info-grid dt,.info-grid dd,.settings-stats dt,.settings-stats dd{margin:0}.info-grid dt,.settings-stats dt{color:var(--muted);font-size:12px;font-weight:750}.info-grid dd,.settings-stats dd{overflow:visible;margin-top:4px;color:var(--text);font-size:13px;font-weight:900;overflow-wrap:anywhere;white-space:normal}.search-panel{display:flex;align-items:center;gap:8px}.village-ip-hero{min-height:86px}.village-ip-tools{align-items:center}.filter-popover{position:relative;z-index:8;flex:0 0 auto}.filter-popover>summary{list-style:none}.filter-popover>summary::-webkit-details-marker{display:none}.filter-trigger{display:inline-flex;min-width:42px;min-height:38px;align-items:center;justify-content:center;gap:6px;padding:0 11px;border:1px solid rgba(255,255,255,.78);border-radius:12px;background:#fffffff0;color:var(--brand-dark);font-size:16px;font-weight:950;cursor:pointer;box-shadow:var(--shadow)}.filter-trigger span{max-width:92px;overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.filter-menu{position:absolute;top:calc(100% + 8px);right:0;display:grid;width:min(312px,calc(100vw - 28px));gap:10px;padding:12px;border:1px solid rgba(255,255,255,.82);border-radius:14px;background:#fffffffa;box-shadow:0 18px 36px #39536f38}.filter-menu-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.filter-menu-head strong{color:var(--text);font-size:14px;font-weight:950}.filter-clear{min-height:28px;padding:0 9px;border-radius:9px;font-size:12px}.filter-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.filter-option{display:flex;min-height:38px;align-items:center;justify-content:space-between;gap:8px;padding:0 10px;border:1px solid rgba(148,163,184,.22);border-radius:10px;background:#f7fbff;color:#334155;font-size:12px;font-weight:900;cursor:pointer}.filter-option span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filter-option b{flex:0 0 auto;color:var(--brand);font-size:13px;font-weight:950}.filter-option.is-active{border-color:#1f69d85c;background:#e8f1ff;color:#1455bd}.search-input{flex:1 1 auto;min-width:0;width:100%;min-height:38px;padding:0 12px;border:1px solid rgba(255,255,255,.78);border-radius:12px;outline:none;background:#ffffffeb;color:var(--text);font-size:13px;font-weight:800;box-shadow:var(--shadow)}.search-input::placeholder{color:#8b96a3}.range-note{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 2px;padding:0 2px;color:var(--muted);font-size:12px;font-weight:750}.stats-section{display:grid;gap:8px}.stats-section-grid{display:grid;align-items:start;gap:14px}.stats-section h2{margin:2px 2px 0;color:var(--text);font-size:18px;line-height:1.25;font-weight:950}.stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.stat-card{display:flex;min-height:78px;height:78px;align-items:center;justify-content:space-between;gap:10px;padding:12px;border:1px solid rgba(255,255,255,.74);border-radius:12px;background:linear-gradient(145deg,#fffffff0,#f6faffd1);color:inherit;text-align:left;cursor:pointer;box-shadow:var(--shadow)}.stat-card:disabled{opacity:.55}.stat-card span{display:grid;min-width:0;gap:5px}.stat-card strong,.stat-card small{overflow-wrap:anywhere}.stat-card strong{color:var(--text);font-size:16px;line-height:1.2;font-weight:950}.stat-card small{color:var(--muted);font-size:12px;line-height:1.3;font-weight:750}.stat-card b{flex:0 0 auto;color:var(--brand);font-size:26px;line-height:1;font-weight:950}.stats-filter-panel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:10px;border:1px solid rgba(255,255,255,.78);border-radius:12px;background:#ffffffdb;box-shadow:var(--shadow)}.stats-filter-panel>label,.stats-checkbox-field{display:grid;min-width:0;gap:6px}.stats-checkbox-field{align-content:start}.stats-filter-panel>label>span,.stats-checkbox-field>span{display:flex;min-width:0;align-items:center;gap:5px;color:var(--muted);font-size:11px;font-weight:900}.stats-filter-panel>label>span .lucide-icon,.stats-checkbox-field>span .lucide-icon{flex:0 0 auto;font-size:14px}.stats-filter-panel select,.stats-filter-panel input{width:100%;min-width:0;height:34px;border:1px solid rgba(148,163,184,.28);border-radius:9px;background:#f8fbff;color:var(--text);font-size:12px;font-weight:850}.stats-filter-panel p{grid-column:1 / -1;margin:0;color:var(--muted);font-size:11px;font-weight:800}.stats-inline-check{display:flex;align-items:center;gap:8px;min-height:34px;padding:0 10px;border:1px solid rgba(148,163,184,.28);border-radius:9px;background:#f8fbff;font-size:12px}.stats-inline-check input{width:16px;height:16px;flex:0 0 auto}.stats-inline-check span{display:block;color:var(--text);font-size:12px;font-weight:850}.stats-time-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.stats-time-shortcuts button{min-width:0;min-height:28px;padding:0 6px;border:1px solid rgba(148,163,184,.22);border-radius:8px;background:#fff;color:var(--brand-dark);font-size:11px;font-weight:900;cursor:pointer}.import-count-chip{display:inline-flex;min-height:42px;align-items:center;justify-content:center;padding:0 12px;border:1px solid rgba(148,163,184,.22);border-radius:10px;background:#f8fbff;color:var(--muted);font-size:13px;font-weight:900}.analytics-hero{display:grid;grid-template-columns:minmax(0,1fr) 96px;gap:12px;align-items:center;padding:16px;border:1px solid rgba(255,255,255,.82);border-radius:14px;background:linear-gradient(135deg,#fffffff5,#ecf8ffe0 52%,#f4faf5e0);box-shadow:var(--shadow-strong)}.analytics-eyebrow{display:flex;min-width:0;align-items:center;gap:6px;color:#0f766e;font-size:12px;font-weight:950}.analytics-eyebrow .lucide-icon{flex:0 0 auto;font-size:15px}.analytics-hero h2{margin:8px 0 0;color:var(--text);font-size:24px;line-height:1.1;font-weight:950}.analytics-hero p{margin:8px 0 0;color:var(--muted);font-size:12px;line-height:1.45;font-weight:750}.analytics-ring{display:grid;width:88px;height:88px;place-items:center;align-content:center;border-radius:50%;background:radial-gradient(circle at center,#ffffff 0 55%,transparent 56%),conic-gradient(#0f9f7a 0 calc(var(--ring) * 1%),#dbeafe 0 100%);box-shadow:inset 0 0 0 1px #0f766e1a,0 10px 20px #0f766e1f}.analytics-ring strong{color:#0f766e;font-size:22px;line-height:1;font-weight:950}.analytics-ring span{margin-top:4px;color:var(--muted);font-size:11px;font-weight:900}.analytics-kpi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.analytics-kpi{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;min-width:0;padding:11px;border:1px solid rgba(255,255,255,.78);border-radius:12px;background:#ffffffe0;box-shadow:var(--shadow)}.analytics-kpi>span{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;background:#eef6ff;color:var(--brand)}.analytics-kpi:nth-child(2)>span,.analytics-kpi:nth-child(5)>span{background:#ecfdf5;color:#078c6f}.analytics-kpi:nth-child(3)>span{background:#f3e8ff;color:#7e22ce}.analytics-kpi:nth-child(4)>span{background:#ecfeff;color:#0e7490}.analytics-kpi:nth-child(6)>span{background:#fff7ed;color:#c2410c}.analytics-kpi .lucide-icon{font-size:18px}.analytics-kpi strong{display:block;color:var(--text);font-size:22px;line-height:1;font-weight:950}.analytics-kpi small{display:block;margin-top:4px;color:var(--muted);font-size:11px;font-weight:850}.analytics-kpi p{grid-column:1 / -1;margin:0;color:var(--muted-soft);font-size:11px;line-height:1.25;font-weight:800}.analytics-grid{display:grid;gap:10px}.analytics-split,.analytics-column{display:grid;min-width:0;gap:12px}.analytics-panel{display:grid;min-width:0;gap:12px;padding:13px;border:1px solid rgba(255,255,255,.78);border-radius:12px;background:#ffffffe6;box-shadow:var(--shadow)}.analytics-panel header{display:grid;grid-template-columns:34px minmax(0,1fr);gap:9px;align-items:center}.analytics-panel header>span{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;background:#f1f5f9;color:#334155}.analytics-panel header h3,.analytics-panel header p{margin:0}.analytics-panel header h3{color:var(--text);font-size:16px;line-height:1.15;font-weight:950}.analytics-panel header p{margin-top:4px;color:var(--muted);font-size:11px;line-height:1.35;font-weight:750}.progress-list,.bar-chart,.rank-chart{display:grid;gap:9px}.progress-row,.bar-row,.rank-row{display:grid;grid-template-columns:minmax(84px,1fr) minmax(80px,1.35fr) auto;gap:8px;align-items:center;min-width:0}.progress-row{grid-template-columns:minmax(72px,.65fr) 92px minmax(80px,1.35fr) auto}.progress-row span,.rank-row span{display:grid;min-width:0;gap:2px}.progress-row b,.rank-row span{overflow:hidden;color:var(--text);font-size:12px;font-weight:900;text-overflow:ellipsis;white-space:nowrap}.progress-row em,.rank-row em,.bar-row span,.bar-row em,.bar-row b{color:var(--muted);font-size:11px;font-style:normal;font-weight:850}.progress-row em{text-align:right;white-space:nowrap}.progress-row i,.bar-row i,.rank-row i{position:relative;height:9px;overflow:hidden;border-radius:999px;background:#e5edf5}.progress-row i:before,.bar-row i:before,.rank-row i:before{content:"";position:absolute;inset:0 auto 0 0;width:var(--bar);min-width:3px;border-radius:inherit;background:var(--brand)}.progress-row.tone-green i:before{background:var(--chart-green)}.progress-row.tone-blue i:before{background:var(--chart-blue)}.progress-row.tone-purple i:before{background:var(--chart-purple)}.progress-row.tone-cyan i:before{background:var(--chart-cyan)}.progress-row.tone-amber i:before{background:var(--chart-amber)}.progress-row strong{color:var(--text);font-size:12px;font-weight:950}.bar-row{grid-template-columns:minmax(72px,.85fr) 42px minmax(86px,1.4fr) 48px}.bar-row span{overflow:hidden;color:var(--text);text-overflow:ellipsis;white-space:nowrap}.bar-row em{text-align:right;white-space:nowrap}.bar-row.tone-blue i:before{background:var(--chart-blue)}.bar-row.tone-green i:before{background:var(--chart-green)}.bar-row.tone-cyan i:before{background:var(--chart-cyan)}.bar-row.tone-purple i:before{background:var(--chart-purple)}.bar-row.tone-amber i:before{background:var(--chart-amber)}.bar-row.tone-rose i:before{background:var(--chart-rose)}.bar-row b{color:var(--text);text-align:right}.inline-stat-group{display:grid;gap:8px;padding-top:10px;border-top:1px solid rgba(148,163,184,.16)}.inline-stat-group h4{margin:0;color:var(--text);font-size:13px;line-height:1.2;font-weight:950}.rank-row span{display:flex;gap:6px;align-items:center}.rank-row span b{display:grid;flex:0 0 auto;width:20px;height:20px;place-items:center;border-radius:7px;background:#eff6ff;color:var(--brand);font-size:11px}.rank-row i:before{background:linear-gradient(90deg,#0f9f7a,#f59e0b)}.line-chart{display:grid;gap:4px}.line-chart svg{width:100%;height:auto;min-height:126px}.line-grid,.line-path,.line-fill{fill:none;stroke-linecap:round;stroke-linejoin:round}.line-grid{stroke:#94a3b842;stroke-width:1}.line-fill{fill:#1f69d81a;stroke:none}.line-path{stroke:#1f69d8;stroke-width:3}.line-chart circle{fill:#fff;stroke:#1f69d8;stroke-width:2}.line-axis{display:flex;justify-content:space-between;gap:4px;color:var(--muted-soft);font-size:10px;font-weight:800}.line-axis span{min-width:0;overflow:hidden;text-overflow:clip;white-space:nowrap}.subnav-row{display:flex;position:relative;z-index:2}.back-chip{display:inline-flex;align-items:center;gap:2px;min-height:46px;padding:0 18px 0 14px;border:1px solid rgba(255,255,255,.72);border-radius:999px;background:#ffffffe6;color:var(--brand-dark);font-size:18px;font-weight:950;cursor:pointer;box-shadow:0 10px 22px #39536f24}.back-chip .lucide-icon{margin-left:-6px;font-size:24px}.home-brand-row{align-items:center;justify-content:center;min-height:46px}.home-brand-title{align-items:center;color:#000;font-family:auto;font-weight:1000}.action-grid,.settings-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mine-profile{padding:14px 4px 8px}.mine-page,.user-manager-page{display:grid;gap:8px}.mine-identity{display:flex;align-items:center;gap:14px}.mine-avatar{display:grid;width:74px;height:74px;flex:0 0 auto;place-items:center;border:3px solid rgba(255,255,255,.92);border-radius:50%;background:linear-gradient(145deg,#2f80ed,#078c6f);color:#fff;font-size:31px;font-weight:950;box-shadow:0 12px 24px #39536f2e}.mine-name{display:grid;min-width:0;gap:6px}.mine-name strong{overflow-wrap:anywhere;color:var(--text);font-size:26px;line-height:1.12;font-weight:950}.mine-name small{color:var(--muted);font-size:14px;line-height:1.3;font-weight:800}.mine-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:20px 0 0}.mine-stats div{min-width:0;text-align:center}.mine-stats dt,.mine-stats dd{margin:0}.mine-stats dt{color:var(--text);font-size:22px;line-height:1.1;font-weight:950}.mine-stats dd{margin-top:5px;color:var(--muted);font-size:12px;font-weight:800}.mine-actions{display:grid;gap:8px}.mine-action{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;min-height:64px;padding:10px 12px;border:1px solid rgba(255,255,255,.76);border-radius:12px;background:#ffffffd1;color:inherit;text-align:left;cursor:pointer;box-shadow:var(--shadow)}.mine-action strong,.mine-action small{display:block;overflow-wrap:anywhere}.mine-action strong{color:var(--text);font-size:16px;line-height:1.25;font-weight:950}.mine-action small{margin-top:3px;color:var(--muted);font-size:12px;line-height:1.3;font-weight:750}.mine-action-danger{background:#ffe4e2;color:#b42318;font-size:26px;line-height:1;font-weight:500}.primary-action,.secondary-action,.text-button{min-height:38px;border:1px solid transparent;border-radius:12px;font-weight:900;cursor:pointer;transition:transform .12s ease,box-shadow .16s ease}.primary-action{padding:0 15px;background:linear-gradient(145deg,#2f80ed,#1b5fc8);color:#fff;box-shadow:0 12px 22px #195bc642}.primary-action.is-loading,.primary-action:disabled{opacity:.72;box-shadow:0 8px 16px #195bc629}.secondary-action{padding:0 15px;border-color:#1f69d82e;background:#e7f0ff;color:#1852aa}.secondary-action:disabled{opacity:.48}.text-button{flex:0 0 auto;padding:0 12px;background:#fff1d6;color:#a35a00}.primary-action:active,.secondary-action:active,.text-button:active{transform:translateY(1px)}.wide{width:100%;margin-top:14px}.hidden-file{display:none}.profile-block .settings-stats{margin-bottom:10px}.settings-link-card{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;min-height:58px;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer}.settings-link-icon{display:grid;width:42px;height:42px;place-items:center;border-radius:10px;background:#e7f0ff;color:var(--brand);font-size:22px}.settings-link-card strong,.settings-link-card small{display:block;overflow-wrap:anywhere}.settings-link-card strong{color:var(--text);font-size:17px;line-height:1.2;font-weight:950}.settings-link-card small{margin-top:4px;color:var(--muted);font-size:13px;line-height:1.3;font-weight:750}.user-create-bar,.user-table{display:grid;gap:9px}.user-create-bar{grid-template-columns:minmax(0,1fr);margin-bottom:12px}.user-create-bar label{display:grid;gap:6px}.user-create-bar label>span,.user-table-head{color:var(--muted);font-size:12px;font-weight:850}.user-create-bar input,.user-table-row input{width:100%;min-height:38px;padding:0 10px;border:1px solid var(--line);border-radius:10px;outline:none;background:#fff;color:var(--text)}.user-table-head{display:none}.check-field{display:flex;min-height:38px;align-items:center;gap:8px;color:#263242;font-size:13px;font-weight:850}.check-field input{width:16px;height:16px}.user-card{padding:10px;border:1px solid var(--line);border-radius:10px;background:#eff6fdb8}.user-card form{display:grid;gap:9px}.user-card-head,.user-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}.user-card-head{margin-bottom:9px}.user-card-head strong{min-width:0;overflow-wrap:anywhere;font-size:16px}.user-actions{justify-content:flex-end;margin-top:9px}.danger-button{background:#ffe4e2;color:#b42318}.tabbar{position:fixed;right:max(0px,calc((100% - 520px)/2));bottom:0;left:max(0px,calc((100% - 520px)/2));z-index:20;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:7px 12px calc(7px + env(safe-area-inset-bottom));border-top:1px solid rgba(255,255,255,.86);background:#ffffffdb;box-shadow:0 -14px 26px #2f496524;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.tab{display:grid;grid-template-rows:20px auto;align-content:center;justify-items:center;gap:3px;min-width:0;min-height:50px;border:1px solid transparent;border-radius:22px;background:transparent;color:#293849;cursor:pointer;transition:background-color .16s ease,color .16s ease,transform .12s ease}.tab-icon,.tab strong{display:block}.tab-icon{height:18px;color:#566575;font-size:21px;line-height:1;font-weight:900}.tab strong{margin-top:0;font-size:16px;line-height:1;font-weight:950}.tab.active{background:linear-gradient(145deg,#e2ebfff5,#cdddfce6);color:var(--brand-dark);box-shadow:inset 0 1px #ffffffd1}.tab.active .tab-icon{color:var(--brand)}.toast-layer{position:fixed;top:calc(18px + env(safe-area-inset-top));right:max(16px,calc((100% - 520px)/2 + 16px));z-index:50;width:min(360px,calc(100% - 32px));pointer-events:none}.toast{display:grid;grid-template-columns:10px 1fr auto;gap:10px;align-items:center;padding:12px 10px 12px 14px;border:1px solid rgba(255,255,255,.78);border-radius:14px;background:#fffffff5;color:var(--text);box-shadow:var(--shadow-strong);pointer-events:auto}.toast p{margin:0;font-size:13px;font-weight:800;line-height:1.45}.toast-dot{width:10px;height:10px;border-radius:999px;background:var(--brand)}.toast-success .toast-dot{background:var(--green)}.toast-error{border-color:#dc262647;background:#fff1f2}.toast-error p{color:#991b1b}.toast-error .toast-dot{background:var(--red)}.toast-close{display:grid;width:30px;height:30px;place-items:center;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:17px;line-height:1;cursor:pointer}.toast-copy{min-width:48px;height:30px;padding:0 10px;border:1px solid rgba(220,38,38,.22);border-radius:8px;background:#ffffffb8;color:#991b1b;font-size:13px;font-weight:900;cursor:pointer;white-space:nowrap}.match-line{margin:14px 0 0;padding:10px 12px;border-radius:10px;background:#e7f0ffd1;color:#1852aa;font-size:13px;line-height:1.5}.dialog-layer{position:fixed;inset:0;z-index:30;display:grid;align-items:end;background:#07101f61;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.dialog-panel{max-height:min(82svh,720px);overflow:auto;padding:18px;border:1px solid rgba(255,255,255,.76);border-radius:22px 22px 0 0;background:#eef6fd;box-shadow:var(--shadow-strong)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.dialog-actions{display:flex;flex:0 0 auto;align-items:center;gap:8px}.dialog-title{min-width:0}.dialog-head h2{margin:0;color:var(--text);font-size:22px;font-weight:950}.dialog-title small{display:block;margin-top:5px;color:#637287;font-size:11px;line-height:1.2;font-weight:800}.form-grid{display:grid;gap:10px}.field{position:relative;display:grid;gap:6px}.field-row{display:grid;gap:8px}.field-row.two-columns{grid-template-columns:repeat(2,minmax(0,1fr))}.field span{color:#263242;font-size:13px;font-weight:850}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:12px;outline:none;background:#fff;color:var(--text)}.field input,.field select{min-height:45px;padding:0 12px}.field textarea{min-height:92px;padding:11px 12px;resize:vertical;line-height:1.45}.field input:disabled{background:#eff6fdb8;color:var(--muted-soft)}.field input.is-readonly{background:#eff6fdb8;color:var(--muted-soft);cursor:not-allowed}.field select{cursor:pointer}.field small{color:var(--muted);font-size:12px}.camera-name-suggestions{display:grid;max-height:210px;overflow:auto;padding:6px;border:1px solid rgba(148,163,184,.22);border-radius:12px;background:#fff;box-shadow:0 12px 24px #39536f24}.camera-name-suggestions[hidden]{display:none}.camera-name-suggestions button{min-width:0;min-height:34px;padding:0 9px;overflow:hidden;border:0;border-radius:8px;background:transparent;color:var(--text);text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.camera-name-suggestions button:hover{background:#eef6ff;color:var(--brand-dark)}.ping-switch{position:relative;display:grid;grid-template-columns:1fr 1fr;width:min(220px,100%);min-height:45px;padding:4px;overflow:hidden;border:2px solid #344054;border-radius:3px;background:#f8fafc;box-shadow:0 7px #3440542e}.option-switch-2{grid-template-columns:repeat(2,minmax(0,1fr))}.option-switch-3{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;min-height:52px}.option-switch-4{grid-template-columns:repeat(4,minmax(0,1fr));width:100%;min-height:52px}.ping-switch-option{position:relative;z-index:1;min-height:33px;padding:0 8px;border:0;border-radius:2px;background:transparent;color:#98a2b3;font-size:14px;font-weight:950;cursor:pointer}.ping-switch-option:disabled{color:#a8b1bd;cursor:not-allowed;opacity:.62}.option-switch-3 .ping-switch-option{min-height:40px;padding:0 4px;font-size:12px;line-height:1.2;white-space:normal}.option-switch-4 .ping-switch-option{min-height:40px;padding:0 3px;font-size:12px;line-height:1.2;white-space:normal}.ping-switch-option.is-active{background:#344054;color:#fff}@media(min-width:760px){body{padding:0}.app-shell{width:min(1180px,100%);min-height:100svh;padding:24px 28px 104px;overflow:visible;border:0;border-radius:0;box-shadow:none}.app-shell:before{position:fixed;background:linear-gradient(180deg,#dde9f4f5,#f6f9fcf2 42%,#e8f0f8fa),var(--page)}.topbar{grid-template-columns:92px minmax(0,1fr) 92px;margin-bottom:20px;padding:16px 18px;border:1px solid rgba(255,255,255,.74);border-radius:14px;background:#ffffffbd;box-shadow:0 10px 28px #39536f1a}.topbar-title h1{font-size:28px}.topbar .icon-button{width:auto;min-width:92px;height:44px;grid-auto-flow:column;grid-template-columns:auto auto;gap:6px;padding:0 14px;border-radius:12px}.topbar-spacer{width:92px}.refresh-button span{margin:0;font-size:22px}.refresh-button .lucide-icon{margin:0;font-size:19px}.refresh-button small{margin:0;font-size:14px}.screen{gap:12px}.dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.summary-card{min-height:156px;padding:18px 20px}.summary-card h2{margin-bottom:18px;font-size:16px}.summary-card{display:flex;flex-direction:column;justify-content:space-between}.summary-card .summary-line{display:flex}.summary-line+.summary-line{margin-top:12px}.summary-line span:first-child{display:block}.summary-line strong{font-size:34px}.summary-line small{font-size:13px}.summary-icon,.cloud-icon{position:static;font-size:32px;opacity:.9}.summary-card{position:relative}.home-icon,.used-icon{display:block}.list-block{gap:7px;padding:7px;border:1px solid rgba(255,255,255,.7);border-radius:14px;background:#ffffff8f;box-shadow:0 10px 28px #39536f14}.town-card,.ip-row{min-height:54px;padding:10px 14px;border-radius:9px;box-shadow:none;background:#ffffffdb}.town-card{min-height:158px;padding:10px 9px;border-radius:12px}.town-card strong,.ip-row strong{font-size:20px}.town-card small,.ip-row small{margin-top:3px;font-size:12px}.village-card,.settings-block,.empty-state{border-radius:12px;box-shadow:0 10px 24px #39536f14}.info-grid{grid-template-columns:repeat(18,minmax(0,1fr))}.segment-cell{grid-column:span 6}.mask-cell{grid-column:span 4}.gateway-cell{grid-column:span 5}.vlan-cell{grid-column:span 3}.settings-stats{grid-template-columns:repeat(5,minmax(0,1fr))}.profile-block .settings-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.user-create-bar{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 120px 108px;align-items:center}.settings-block{max-width:none}.tabbar{right:28px;bottom:18px;left:28px;width:min(720px,calc(100% - 56px));margin:0 auto;padding:8px;border:1px solid rgba(255,255,255,.78);border-radius:14px;background:#ffffffdb;box-shadow:0 12px 28px #39536f24}.tab{grid-template-rows:18px auto;gap:3px;min-height:44px;border-radius:10px}.tab-icon{height:17px;font-size:18px}.tab strong{margin-top:0;font-size:15px}.dialog-layer{align-items:center;padding:24px}.dialog-panel{width:min(760px,100%);max-height:calc(100svh - 48px);margin:0 auto;border-radius:22px}.dialog-panel .form-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.dialog-panel .camera-name-field,.dialog-panel .field-row,.dialog-panel .field:has(textarea),.dialog-panel .field:has(.option-switch-3),.dialog-panel .field:has(.option-switch-4){grid-column:1 / -1}}@media(min-width:900px){html{min-height:100%;background:radial-gradient(circle at 7% 8%,rgba(59,130,246,.12),transparent 24rem),radial-gradient(circle at 95% 0%,rgba(20,184,166,.1),transparent 28rem),linear-gradient(180deg,#eef4f9,#f7fafc 42%,#edf3f8)}body{min-height:100vh;padding:0}.app-shell{display:grid;grid-template-columns:248px minmax(0,1fr);gap:0;width:100%;max-width:none;min-height:100vh;margin:0;padding:0;overflow:visible}.app-shell:before{background:linear-gradient(90deg,rgba(222,233,244,.98) 0 248px,transparent 248px),linear-gradient(180deg,#f5f8fcfa,#ebf3fafa)}.screen{grid-row:1;grid-column:2;align-content:start;gap:18px;min-width:0;min-height:100vh;padding:28px 34px 34px}.tabbar{position:sticky;inset:0 auto auto;z-index:20;grid-row:1;grid-column:1;display:flex;flex-direction:column;gap:8px;width:248px;height:100vh;margin:0;padding:28px 18px;border:0;border-right:1px solid rgba(148,163,184,.22);border-radius:0;background:#ffffffb8;box-shadow:16px 0 36px #4d5f7514;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.tabbar:before{content:"监控 IP 管理平台";display:block;margin:0 4px 24px;color:#0f172a;font-size:20px;line-height:1.25;font-weight:950}.tabbar:after{content:"IPAM Console";display:block;margin:auto 4px 0;padding-top:18px;border-top:1px solid rgba(148,163,184,.22);color:#94a3b8;font-size:12px;font-weight:850}.tab{display:grid;grid-template-columns:34px minmax(0,1fr);grid-template-rows:none;justify-items:start;align-items:center;gap:12px;min-height:46px;padding:0 12px;border-radius:10px;color:#475569}.tab-icon{display:grid;width:34px;height:34px;place-items:center;border-radius:8px;background:#f1f5f9e6;color:#64748b;font-size:19px}.tab strong{margin:0;color:inherit;font-size:14px;line-height:1.2;font-weight:900}.tab.active{background:#e8f1ff;color:#1455bd;box-shadow:none}.tab.active .tab-icon{background:#1f69d8;color:#fff}.home-brand-row{min-height:auto;justify-content:flex-start;padding:0}.home-brand-title{display:block;min-height:auto;color:#334155;font-family:inherit;font-size:13px;line-height:1.2;font-weight:850}.town-hero,.town-detail-hero{min-height:112px;align-items:center;padding:22px 24px;border:1px solid rgba(203,213,225,.72);border-radius:14px;background:radial-gradient(circle at 86% 28%,rgba(31,105,216,.16),transparent 13rem),linear-gradient(135deg,#fffffffa,#e8f1fceb);box-shadow:0 16px 36px #4755691a}.town-hero h1,.town-detail-hero h1{font-size:30px;line-height:1.15}.town-hero p,.town-detail-hero p{margin-top:9px;color:#2563eb;font-size:14px}.subnav-row{min-height:38px;align-items:center}.back-chip{min-height:38px;padding:0 14px 0 11px;border:1px solid rgba(203,213,225,.84);border-radius:10px;background:#fff;color:#334155;font-size:13px;box-shadow:0 8px 18px #47556914}.back-chip:hover,.hero-edit-button:hover,.town-card:hover,.village-card:hover,.ip-row:hover,.stat-card:hover{transform:translateY(-1px);box-shadow:0 16px 30px #4755691f}.back-chip .lucide-icon{font-size:18px}.hero-edit-button{min-height:34px;padding:0 16px;border-radius:9px;background:#1f69d8;color:#fff;font-size:13px;box-shadow:0 10px 20px #1f69d82e}.list-block,.ip-list{gap:12px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}.town-grid{grid-template-columns:repeat(auto-fill,minmax(238px,1fr));gap:14px}.town-card{min-height:168px;padding:16px;border:1px solid rgba(203,213,225,.7);border-radius:12px;background:#fff;box-shadow:0 10px 24px #47556914}.town-card-head{grid-template-columns:42px minmax(0,1fr);gap:10px}.town-icon{width:42px;height:42px;border-radius:10px;font-size:20px;box-shadow:none}.town-card strong{font-size:20px}.town-card small{color:#64748b;font-size:12px}.town-metrics{gap:7px}.town-metrics small{min-height:30px;padding:5px 8px;border-radius:8px;font-size:11px}.town-metrics b{font-size:11px}.village-list{grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:14px}.village-list .village-card,.search-result-card{min-height:172px;padding:16px;border:1px solid rgba(203,213,225,.7);border-radius:12px;background:#fff;box-shadow:0 10px 24px #47556914}.village-title-row{align-items:center}.village-title-row h2{margin-bottom:4px;font-size:20px}.village-head .village-detail-line{color:#475569;font-size:13px;line-height:1.42}.pill,.status{max-width:none;padding:5px 10px;border-radius:999px;font-size:12px}.village-metrics{grid-auto-flow:initial;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}.village-metrics>span{min-height:34px;padding:6px 9px;border-radius:8px;font-size:11px}.village-metrics b{font-size:11px}.search-panel{max-width:760px}.ip-detail-sticky{gap:10px;margin:-8px -8px 0;padding:8px 8px 12px}.ip-detail-sticky .search-panel{max-width:none}.ip-bulk-toolbar.is-active{align-items:center}.ip-bulk-actions{display:flex;flex:1 1 auto;align-items:center}.ip-bulk-buttons{order:2}.ip-bulk-actions input{order:1;width:210px}.search-input{min-height:42px;border:1px solid rgba(203,213,225,.86);border-radius:10px;background:#fff;font-size:14px;box-shadow:0 8px 18px #4755690f}.range-note{margin:0;padding:0;font-size:13px}.ip-list{grid-template-columns:1fr}.ip-list .ip-row,.ip-row{grid-template-columns:minmax(190px,1.3fr) minmax(190px,1fr) auto;gap:14px;min-height:76px;padding:13px 16px;border:1px solid rgba(203,213,225,.74);border-radius:10px;background:#fff;box-shadow:0 8px 20px #47556912}.ip-row>span:first-of-type{display:grid;grid-template-columns:minmax(132px,.8fr) minmax(150px,1fr);gap:3px 12px;align-items:center}.ip-row.is-selecting{grid-template-columns:40px minmax(190px,1.3fr) minmax(190px,1fr) auto}.ip-row strong{grid-row:span 3;color:#0f172a;font-size:17px}.ip-row small{margin-top:0;color:#475569;font-size:12px}.ip-camera-name{color:#334155}.ip-tags{align-self:center;max-width:none;justify-content:flex-end}.ip-edit-time{right:12px;bottom:5px;font-size:10px}.ip-row.is-ping-offline{border-color:#dc262647;background:#fef2f2fa}.ip-row.is-ping-online{border-color:#05966947;background:#ecfdf5fa}.stats-section{gap:10px}.stats-section-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:18px 14px}.stats-section h2{margin:0;font-size:18px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.stat-card{min-height:96px;height:96px;padding:16px;border:1px solid rgba(203,213,225,.7);border-radius:12px;background:#fff;box-shadow:0 10px 24px #47556914}.stat-card b{font-size:34px}.stats-filter-panel,.analytics-hero,.analytics-kpi-grid,.analytics-grid{max-width:none}.analytics-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.analytics-grid{grid-template-columns:minmax(0,1fr);gap:14px}.analytics-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}.stats-filter-panel,.analytics-panel,.analytics-kpi{border:1px solid rgba(203,213,225,.7);background:#fff;box-shadow:0 10px 24px #47556914}.mine-profile,.settings-block,.empty-state,.mine-action,.user-card{border:1px solid rgba(203,213,225,.7);border-radius:12px;background:#fff;box-shadow:0 10px 24px #47556914}.mine-page,.user-manager-page{justify-self:start;width:100%;max-width:1320px;gap:16px}.mine-page{grid-template-columns:1fr}.mine-profile{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:24px;align-items:center;width:100%;min-height:124px;padding:22px 24px}.mine-stats{margin:0}.mine-tools-panel{padding:0;overflow:hidden}.mine-tools-head{padding:18px 24px;border-bottom:1px solid rgba(203,213,225,.72)}.mine-tools-head h2{margin:0;font-size:20px}.mine-actions{grid-template-columns:1fr;width:100%;gap:0}.action-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}.mine-action{min-height:64px;padding:0 24px;border:0;border-radius:0;background:#fff;box-shadow:none}.mine-action+.mine-action{border-top:1px solid rgba(203,213,225,.72)}.mine-action:hover{background:#f8fafc}.settings-block{padding:18px}.settings-link-card{min-height:66px;grid-template-columns:44px minmax(0,1fr) 28px}.user-manager-block{width:100%;padding:0;overflow:hidden}.user-manager-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 24px;border-bottom:1px solid rgba(203,213,225,.72)}.user-manager-head h2{margin:0;font-size:20px}.user-manager-head p{margin:6px 0 0}.user-create-bar{grid-template-columns:minmax(180px,1fr) minmax(180px,1fr) auto 128px;gap:12px;align-items:end;margin:0;padding:16px 24px;border-bottom:1px solid rgba(203,213,225,.72);background:#f8fafc}.user-create-bar input,.user-table-row input{min-height:44px;border-radius:10px}.user-table{gap:0}.user-table-head{display:grid;grid-template-columns:190px minmax(180px,1fr) minmax(180px,1fr) 124px 150px;gap:14px;align-items:center;min-height:42px;padding:0 24px;border-bottom:1px solid rgba(203,213,225,.72);background:#fff}.user-card{padding:0;border:0;border-radius:0;background:#fff;box-shadow:none}.user-card+.user-card{border-top:1px solid rgba(203,213,225,.72)}.user-card form{display:grid;grid-template-columns:190px minmax(180px,1fr) minmax(180px,1fr) 124px 150px;gap:14px;align-items:center;min-height:70px;padding:12px 24px}.user-card-head{margin:0;justify-content:flex-start}.check-field{white-space:nowrap}.user-actions{min-width:132px;margin:0;justify-content:flex-end}.user-actions .secondary-action{min-width:86px}.dialog-panel{width:min(760px,calc(100vw - 72px));max-height:calc(100svh - 56px);border-radius:16px;background:#f8fafc}.toast-layer{right:28px}}@media(min-width:900px)and (max-width:1120px){.mine-profile{grid-template-columns:1fr}.mine-stats{max-width:460px}.user-create-bar{grid-template-columns:1fr 1fr}.user-create-bar .check-field,.user-create-bar .primary-action{grid-column:span 1}.user-table-head{display:none}.user-card form{grid-template-columns:1fr 1fr}.user-card-head,.user-actions{grid-column:span 2}.user-actions{justify-content:flex-start}}@media(max-width:420px){.app-shell{padding-right:14px;padding-left:14px}.stats-filter-panel{grid-template-columns:1fr}.analytics-hero{grid-template-columns:minmax(0,1fr) 78px;padding:13px}.analytics-hero h2{font-size:21px}.analytics-ring{width:74px;height:74px}.analytics-ring strong{font-size:18px}.analytics-kpi-grid{grid-template-columns:1fr}.progress-row,.bar-row,.rank-row{grid-template-columns:minmax(74px,.95fr) minmax(76px,1.15fr) auto;gap:6px}.progress-row{grid-template-columns:minmax(58px,.8fr) 92px minmax(72px,1.15fr) auto}.bar-row{grid-template-columns:minmax(58px,.8fr) 34px minmax(72px,1.15fr) 42px}.town-detail-hero{min-height:82px;padding:14px}.town-detail-hero h1{max-width:100%;padding-right:0;font-size:32px}.town-detail-hero p{margin-top:11px;font-size:14px}.back-chip{min-height:36px;padding:0 13px 0 10px;font-size:14px}.back-chip .lucide-icon{font-size:19px}.home-brand-row,.home-brand-title{min-height:36px}.home-brand-title{font-size:14px}.topbar{grid-template-columns:48px minmax(0,1fr) 48px;gap:10px}.topbar-spacer{width:48px}.icon-button{width:48px;height:48px}.topbar-title h1{font-size:22px}.dashboard-grid{gap:8px}.summary-card{min-height:120px;padding:11px}.summary-line strong{font-size:25px}.summary-line small{font-size:12px}.town-card,.ip-row{min-height:58px;padding:10px 11px}.village-list .village-card{min-height:128px;padding:12px 12x}.village-head{display:block}.village-title-row{gap:6px}.village-title-row h2{font-size:16px}.village-title-row .pill{padding:5px 8px;font-size:11px}.village-head .village-detail-line{font-size:12px}.village-metrics{gap:4px;margin:4px 0 0}.village-metrics>span{min-height:24px;gap:4px;padding:3px 6px;font-size:9px}.village-metrics .lucide-icon{font-size:12px}.village-metrics b{font-size:9px}.town-card{min-height:158px;padding:10px 8px}.town-card strong,.ip-row strong{font-size:18px}.town-card small,.ip-row small{font-size:12px}.town-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.town-card-head{grid-template-columns:34px minmax(0,1fr);gap:6px}.town-icon{width:34px;height:34px;border-width:5px;font-size:16px}.town-metrics{gap:6px}.town-metrics small{min-height:24px;padding:3px 6px;gap:4px;font-size:9px;white-space:nowrap}.town-metrics small span{min-width:0;overflow:hidden;text-overflow:clip}.town-metrics .lucide-icon{font-size:12px}.town-metrics b{font-size:9px}.pill,.status{font-size:12px}}@media(max-width:350px){.dashboard-grid,.info-grid,.action-grid,.stats-grid,.settings-stats{grid-template-columns:1fr}.segment-cell,.mask-cell,.gateway-cell,.vlan-cell{grid-column:auto}.summary-card{min-height:auto}.tab strong{font-size:18px}}