:root{--font: Inter, "Segoe UI", "Microsoft YaHei", system-ui, sans-serif;--mono: "Cascadia Code", Consolas, "Microsoft YaHei", monospace;--bg: #f3f6fb;--surface: #ffffff;--surface-soft: #f8fafc;--surface-muted: #f1f5f9;--ink: #0f1f33;--ink-soft: #334155;--muted: #64748b;--faint: #94a3b8;--line: #e2e8f0;--line-soft: #eef2f7;--accent: #2563eb;--accent-strong: #1d4ed8;--accent-2: #06b6d4;--accent-rgb: 37, 99, 235;--accent-soft: #eff6ff;--accent-line: #bfd4f7;--cyan: #0891b2;--success: #059669;--success-soft: #ecfdf5;--success-ink: #176b50;--warning: #b45309;--warning-soft: #fffbeb;--warning-ink: #8a5514;--danger: #dc2626;--danger-soft: #fef2f2;--danger-ink: #a12222;--info-soft: #f1f6ff;--info-ink: #31527a;--info-line: #dbe7fb;--success-line: #d3f0e3;--warning-line: #f6e3bf;--danger-line: #f4d2d2;--lock-bg: rgba(248, 250, 252, .64);--on-accent: #ffffff;--topbar-bg: rgba(243, 246, 251, .86);--glow-1: #e8f0ff;--glow-2: #e6fbfb;--sidebar-start: #0a182b;--sidebar-mid: #0c1f38;--sidebar-end: #081625;--sidebar-glow: rgba(37, 99, 235, .38);--sidebar-glow-2: rgba(6, 182, 212, .18);--hero-start: #163b66;--hero-mid: #0c213b;--hero-end: #081729;--hero-glow: rgba(34, 211, 238, .18);--hero-border: rgba(59, 130, 246, .25);--chart-grid: #edf1f6;--chart-label: #94a2b7;--chart-line: #3164e8;--sidebar-width: 276px;--radius: 18px;--shadow: 0 14px 34px rgba(15, 23, 42, .05);color:var(--ink);background:var(--bg);font-family:var(--font);font-synthesis:none}:root[data-mode=dark]{--bg: #08111f;--surface: #0f1b2d;--surface-soft: #0c1626;--surface-muted: #13213a;--ink: #e2e8f0;--ink-soft: #cbd5e1;--muted: #94a3b8;--faint: #64748b;--line: #22304a;--line-soft: #1a2740;--accent: #60a5fa;--accent-strong: #93c5fd;--accent-2: #22d3ee;--accent-rgb: 96, 165, 250;--accent-soft: #12233f;--accent-line: #1e3a66;--success: #34d399;--success-soft: #0f2a22;--success-ink: #6ee7b7;--warning: #fbbf24;--warning-soft: #2a2113;--warning-ink: #fcd34d;--danger: #f87171;--danger-soft: #2a1418;--danger-ink: #fca5a5;--info-soft: #0f2138;--info-ink: #93c5fd;--info-line: #1e3a66;--success-line: #1f5b4a;--warning-line: #5c4a1f;--danger-line: #6b2a30;--lock-bg: rgba(8, 17, 31, .58);--on-accent: #06111f;--topbar-bg: rgba(8, 17, 31, .86);--glow-1: rgba(37, 99, 235, .16);--glow-2: rgba(6, 182, 212, .1);--sidebar-start: #050d18;--sidebar-mid: #071426;--sidebar-end: #040a12;--sidebar-glow: rgba(37, 99, 235, .28);--sidebar-glow-2: rgba(6, 182, 212, .12);--hero-start: #0f2a4a;--hero-mid: #081a2e;--hero-end: #050f1b;--hero-glow: rgba(34, 211, 238, .14);--hero-border: rgba(59, 130, 246, .2);--chart-grid: #1b2b44;--chart-label: #7d8fa9;--chart-line: #60a5fa;--shadow: 0 18px 40px rgba(0, 0, 0, .35)}:root[data-theme=teal]{--bg: #eef8f5;--surface: #ffffff;--surface-soft: #f2fbf8;--surface-muted: #e4f3ee;--ink: #0d2b28;--ink-soft: #2f4f4a;--muted: #5f7772;--faint: #8aa39d;--line: #d6e9e3;--line-soft: #e6f3ef;--accent: #0f766e;--accent-strong: #115e59;--accent-2: #22d3ee;--accent-rgb: 15, 118, 110;--accent-soft: #ecfeff;--accent-line: #99f6e4;--glow-1: #dff7ef;--glow-2: #e6fbf7;--topbar-bg: rgba(238, 248, 245, .88);--sidebar-start: #06201e;--sidebar-mid: #0a2d2a;--sidebar-end: #051614;--sidebar-glow: rgba(13, 148, 136, .42);--sidebar-glow-2: rgba(34, 211, 238, .16);--hero-start: #0b3a35;--hero-mid: #072724;--hero-end: #041a18;--hero-glow: rgba(45, 212, 191, .2);--hero-border: rgba(45, 212, 191, .28);--chart-grid: #e3f2ed;--chart-label: #7d9b94;--chart-line: #0f766e;--info-soft: #eefaf6;--info-ink: #245c52;--info-line: #cfeee4;--lock-bg: rgba(242, 251, 248, .64)}:root[data-theme=graphite]{--bg: #f2f3f5;--surface: #ffffff;--surface-soft: #f7f8fa;--surface-muted: #e9ebef;--ink: #1b1f27;--ink-soft: #3c4350;--muted: #667080;--faint: #98a1af;--line: #dde0e5;--line-soft: #eceff3;--accent: #475569;--accent-strong: #334155;--accent-2: #94a3b8;--accent-rgb: 71, 85, 105;--accent-soft: #f1f5f9;--accent-line: #cbd5e1;--glow-1: #eaecf0;--glow-2: #f0f2f5;--topbar-bg: rgba(242, 243, 245, .88);--sidebar-start: #14171c;--sidebar-mid: #1b1f26;--sidebar-end: #101318;--sidebar-glow: rgba(100, 116, 139, .35);--sidebar-glow-2: rgba(148, 163, 184, .12);--hero-start: #2a303a;--hero-mid: #181c22;--hero-end: #0d1014;--hero-glow: rgba(148, 163, 184, .18);--hero-border: rgba(148, 163, 184, .28);--chart-grid: #e8eaee;--chart-label: #8a94a3;--chart-line: #475569;--lock-bg: rgba(247, 248, 250, .64)}:root[data-theme=sand]{--bg: #f8f4ec;--surface: #fffdf9;--surface-soft: #fbf7f0;--surface-muted: #f2ece0;--ink: #2b241c;--ink-soft: #4a4035;--muted: #75695b;--faint: #a39787;--line: #e8dfd0;--line-soft: #f2ebe0;--accent: #b45309;--accent-strong: #92400e;--accent-2: #f59e0b;--accent-rgb: 180, 83, 9;--accent-soft: #fffbeb;--accent-line: #fde68a;--glow-1: #f7e8cf;--glow-2: #fbf1e4;--topbar-bg: rgba(248, 244, 236, .9);--sidebar-start: #2a1e14;--sidebar-mid: #33251a;--sidebar-end: #1e150e;--sidebar-glow: rgba(180, 83, 9, .35);--sidebar-glow-2: rgba(245, 158, 11, .14);--hero-start: #4a3020;--hero-mid: #2e1e14;--hero-end: #1c120b;--hero-glow: rgba(245, 158, 11, .18);--hero-border: rgba(245, 158, 11, .26);--chart-grid: #f0e6d8;--chart-label: #9b8d7b;--chart-line: #b45309;--info-soft: #fff8ec;--info-ink: #7a4b12;--info-line: #f3e2c4;--lock-bg: rgba(251, 247, 240, .64)}:root[data-mode=dark][data-theme=teal]{--bg: #051412;--surface: #0b211e;--surface-soft: #081a17;--surface-muted: #0f2b27;--ink: #e2f5ef;--ink-soft: #c5e5dc;--muted: #8fb5ac;--faint: #63857d;--line: #1d3c36;--line-soft: #15302a;--accent: #2dd4bf;--accent-strong: #5eead4;--accent-rgb: 45, 212, 191;--accent-soft: #0f2a28;--accent-line: #1f5b54;--glow-1: rgba(13, 148, 136, .18);--glow-2: rgba(34, 211, 238, .08);--topbar-bg: rgba(5, 20, 18, .88);--sidebar-start: #03110f;--sidebar-mid: #06201d;--sidebar-end: #020b09;--sidebar-glow: rgba(13, 148, 136, .3);--sidebar-glow-2: rgba(34, 211, 238, .1);--hero-start: #0a2f2b;--hero-mid: #061f1c;--hero-end: #031411;--hero-glow: rgba(45, 212, 191, .14);--hero-border: rgba(45, 212, 191, .22);--chart-grid: #123028;--chart-label: #7d9b94;--chart-line: #2dd4bf;--info-soft: #0c2522;--info-ink: #9adfd3;--info-line: #1f5b54;--lock-bg: rgba(5, 20, 18, .58)}:root[data-mode=dark][data-theme=graphite]{--bg: #0c0e11;--surface: #16191e;--surface-soft: #111317;--surface-muted: #1d222a;--ink: #e8eaee;--ink-soft: #c9ced6;--muted: #8f98a6;--faint: #646e7d;--line: #2a2f37;--line-soft: #1f242b;--accent: #cbd5e1;--accent-strong: #e2e8f0;--accent-rgb: 203, 213, 225;--accent-soft: #1e293b;--accent-line: #334155;--glow-1: rgba(148, 163, 184, .08);--glow-2: rgba(148, 163, 184, .05);--topbar-bg: rgba(12, 14, 17, .9);--sidebar-start: #090b0e;--sidebar-mid: #12151a;--sidebar-end: #07090c;--sidebar-glow: rgba(148, 163, 184, .18);--sidebar-glow-2: rgba(148, 163, 184, .06);--hero-start: #242a32;--hero-mid: #14181e;--hero-end: #0a0d11;--hero-glow: rgba(148, 163, 184, .1);--hero-border: rgba(148, 163, 184, .22);--chart-grid: #20252d;--chart-label: #7f8998;--chart-line: #cbd5e1;--lock-bg: rgba(12, 14, 17, .58)}:root[data-mode=dark][data-theme=sand]{--bg: #140f0b;--surface: #211a14;--surface-soft: #1a140f;--surface-muted: #2a2119;--ink: #f3e9dc;--ink-soft: #dccdb9;--muted: #b3a08a;--faint: #7d6d5c;--line: #3a2e22;--line-soft: #2c231a;--accent: #fbbf24;--accent-strong: #fde68a;--accent-rgb: 251, 191, 36;--accent-soft: #2a2113;--accent-line: #6b4a16;--glow-1: rgba(180, 83, 9, .16);--glow-2: rgba(245, 158, 11, .07);--topbar-bg: rgba(20, 15, 11, .9);--sidebar-start: #1a120c;--sidebar-mid: #24180f;--sidebar-end: #120c08;--sidebar-glow: rgba(180, 83, 9, .25);--sidebar-glow-2: rgba(245, 158, 11, .08);--hero-start: #3e2a18;--hero-mid: #24170d;--hero-end: #150d07;--hero-glow: rgba(245, 158, 11, .12);--hero-border: rgba(245, 158, 11, .2);--chart-grid: #2c2117;--chart-label: #9b8d7b;--chart-line: #fbbf24;--info-soft: #2a2113;--info-ink: #fcd34d;--info-line: #5c4a1f;--lock-bg: rgba(20, 15, 11, .58)}*{box-sizing:border-box}html,body,#app{min-height:100%}body{margin:0;min-width:320px;font-size:14px;background:radial-gradient(1100px 520px at 6% -14%,var(--glow-1) 0,transparent 62%),radial-gradient(900px 480px at 100% 0,var(--glow-2) 0,transparent 55%),var(--bg)}button,input,select{font:inherit}button{cursor:pointer;color:var(--ink-soft);background:var(--surface);border:1px solid #dbe4ef;border-radius:10px;padding:9px 14px;transition:border-color .16s,background .16s,color .16s,transform .16s,box-shadow .16s}button:hover:not(:disabled){border-color:#a9c2ef;color:var(--accent-strong);transform:translateY(-1px)}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #a8c2ff;outline-offset:3px}.primary{color:var(--on-accent);background:linear-gradient(135deg,var(--accent),var(--accent-strong));border-color:transparent;font-weight:650;box-shadow:0 8px 18px rgba(var(--accent-rgb),.22)}.primary:hover:not(:disabled){color:var(--on-accent);background:linear-gradient(135deg,var(--accent-strong),var(--accent))}.ghost{background:var(--surface);border-color:var(--line);color:var(--ink-soft)}.ghost:hover:not(:disabled){background:#f8fafc;border-color:#bfd4f7;color:var(--accent-strong)}button.small{padding:7px 11px;font-size:11px}button.wide{width:100%}svg{display:block}.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}.nav-icon,.btn-icon,.chip-icon{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.update-banner{position:fixed;top:20px;right:20px;z-index:100;display:flex;align-items:center;gap:14px;padding:12px 14px 12px 16px;color:#e2e8f0;background:#0f172a;border:1px solid rgba(148,163,184,.2);border-radius:14px;box-shadow:0 20px 40px #02061752;font-size:12px}.console-shell{display:grid;grid-template-columns:var(--sidebar-width) minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;display:flex;flex-direction:column;gap:18px;height:100vh;padding:22px 18px 18px;overflow-y:auto;color:#dbe7f5;background:radial-gradient(120% 60% at 20% 0%,var(--sidebar-glow),transparent 55%),radial-gradient(90% 50% at 100% 10%,var(--sidebar-glow-2),transparent 60%),linear-gradient(180deg,var(--sidebar-start) 0%,var(--sidebar-mid) 55%,var(--sidebar-end) 100%);border-right:1px solid rgba(148,163,184,.12)}.sidebar:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(148,163,184,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.07) 1px,transparent 1px);background-size:32px 32px;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.9),transparent 75%);mask-image:linear-gradient(180deg,rgba(0,0,0,.9),transparent 75%);pointer-events:none}.sidebar>*{position:relative;z-index:1}.brand{display:flex;align-items:center;gap:12px;padding:4px 6px 10px;color:#f8fafc;text-decoration:none}.brand-mark{width:42px;height:42px;border-radius:12px;box-shadow:0 8px 22px #02061780}.brand-copy{display:flex;flex-direction:column;line-height:1.1}.brand-copy strong{font-size:22px;font-weight:800;letter-spacing:-.4px}.brand-copy small{display:flex;align-items:center;gap:6px;margin-top:4px;color:#8fa7c4;font-size:11px}.brand-copy b{padding:2px 6px;color:#93c5fd;background:#3b82f62e;border:1px solid rgba(96,165,250,.24);border-radius:5px;font-size:9px;font-weight:800;letter-spacing:.06em}.session-card{padding:14px;background:#ffffff0e;border:1px solid rgba(148,163,184,.16);border-radius:14px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.session-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.session-label{color:#8fa7c4;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.session-card .badge{background:#94a3b829;color:#cbd5e1}.session-card .badge:before{background:#94a3b8}.session-card .badge.online{background:#10b9812e;color:#6ee7b7}.session-card .badge.online:before{background:#34d399;box-shadow:0 0 0 3px #34d39929}.connect-btn{width:100%;height:40px}.session-meta{margin:10px 0 0;color:#7d93ad;font-size:10px;line-height:1.6}.nav{display:flex;flex:1;flex-direction:column;gap:16px}.nav-group{display:flex;flex-direction:column;gap:3px}.nav-label{margin:0 0 6px;padding:0 10px;color:#6f86a3;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.nav-item{position:relative;display:flex;align-items:center;gap:11px;width:100%;padding:10px 12px;color:#a9bcd3;background:transparent;border:0;border-radius:10px;font-size:13px;text-align:left}.nav-item:hover:not(:disabled){color:#eaf2ff;background:#ffffff0f;border-color:transparent;transform:none}.nav-item.active{color:#fff;background:linear-gradient(90deg,rgba(var(--accent-rgb),.32),rgba(var(--accent-rgb),.08));box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.28)}.nav-item.active:before{content:"";position:absolute;top:50%;left:0;width:3px;height:18px;border-radius:3px;background:linear-gradient(var(--accent-2),var(--accent));transform:translateY(-50%)}.nav-icon{flex:none;width:18px;height:18px}.nav-arrow{margin-left:auto;color:#5f7490;font-size:15px;line-height:1}.nav-item.active .nav-arrow{color:#93c5fd}.sidebar-foot{margin-top:auto;padding:12px 10px 2px;color:#6f86a3;border-top:1px solid rgba(148,163,184,.13);font-size:10px;line-height:1.7}.sidebar-foot p{margin:0}.dev-tag{display:inline-flex;margin-bottom:6px;padding:2px 7px;color:#fcd34d;background:#f59e0b29;border-radius:999px;font-size:9px;font-weight:800;letter-spacing:.1em}.workspace{display:flex;flex-direction:column;min-width:0;min-height:100vh}.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:22px 32px 18px;background:var(--topbar-bg);border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%)}.eyebrow{margin:0;color:var(--faint);font-size:10px;font-weight:800;letter-spacing:.18em}.page-title h1{margin:4px 0;color:var(--ink);font-size:24px;letter-spacing:-.6px;line-height:1.2}.page-sub{margin:0;color:var(--muted);font-size:12px}.top-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.chip{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;color:var(--muted);background:var(--surface);border:1px solid var(--line);border-radius:999px;box-shadow:0 2px 8px #0f172a08;font-size:11px;font-weight:600;white-space:nowrap}.chip-icon{width:14px;height:14px}.refresh-btn{display:inline-flex;align-items:center;gap:7px}.btn-icon{width:14px;height:14px}.content{flex:1;width:100%;max-width:1520px;margin:0 auto;padding:22px 32px 20px}.notice{position:relative;margin-bottom:10px;padding:12px 15px 12px 42px;color:var(--info-ink);background:var(--info-soft);border:1px solid var(--info-line);border-radius:12px;font-size:12px;line-height:1.65}.notice:before{content:"";position:absolute;top:15px;left:16px;width:8px;height:8px;background:#60a5fa;border-radius:50%;box-shadow:0 0 0 4px #60a5fa29}.notice.ok{color:var(--success-ink);background:var(--success-soft);border-color:var(--success-line)}.notice.ok:before{background:#10b981;box-shadow:0 0 0 4px #10b98129}.notice.warn{color:var(--warning-ink);background:var(--warning-soft);border-color:var(--warning-line)}.notice.warn:before{background:#f59e0b;box-shadow:0 0 0 4px #f59e0b29}.notice.danger{color:var(--danger-ink);background:var(--danger-soft);border-color:var(--danger-line)}.notice.danger:before{background:#ef4444;box-shadow:0 0 0 4px #ef444429}#fault{margin-bottom:20px}#fault.idle{display:none}.view{display:flex;flex-direction:column;gap:18px;animation:view-in .26s ease}@keyframes view-in{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}.panel{padding:22px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.panel-head h2{margin:2px 0 0;color:var(--ink);font-size:17px;letter-spacing:-.2px}.panel-eyebrow{margin:0;color:var(--faint);font-size:10px;font-weight:800;letter-spacing:.17em}.panel-sub{margin:8px 0 0;color:#7c8ba1;font-size:11.5px;line-height:1.65}.panel-note{margin:12px 0 0;color:#8a99ad;font-size:11px;line-height:1.65}.panel-actions{display:flex;align-items:center;gap:12px}.badge{display:inline-flex;align-items:center;gap:6px;min-height:24px;padding:3px 10px;color:var(--muted);background:var(--surface-muted);border-radius:999px;font-size:10px;font-weight:650;white-space:nowrap}.badge:before{content:"";flex:none;width:6px;height:6px;background:#94a3b8;border-radius:50%}.badge.online{color:var(--success);background:var(--success-soft)}.badge.online:before{background:#10b981;box-shadow:0 0 0 3px #10b98124}.badge.hold{color:var(--warning);background:var(--warning-soft)}.badge.hold:before{background:#f59e0b}.hero-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,.95fr);gap:16px}.distance-card{position:relative;display:flex;flex-direction:column;overflow:hidden;color:#e2e8f0;background:radial-gradient(120% 120% at 0% 0%,var(--hero-start) 0%,var(--hero-mid) 55%,var(--hero-end) 100%);border-color:var(--hero-border);box-shadow:0 22px 48px #08172938}.distance-card:after{content:"";position:absolute;right:-80px;bottom:-120px;width:300px;height:300px;background:radial-gradient(circle,var(--hero-glow),transparent 65%);pointer-events:none}.distance-card>*{position:relative;z-index:1}.distance-card .panel-eyebrow{color:#94a3b8}.distance-card h2{color:#f8fafc}.distance-card .badge{background:#94a3b829;color:#cbd5e1}.distance-card .badge:before{background:#94a3b8}.distance-card .badge.online{background:#10b98133;color:#6ee7b7}.distance-card .badge.online:before{background:#34d399;box-shadow:0 0 0 3px #34d39929}.distance-card .badge.hold{background:#f59e0b33;color:#fcd34d}.distance-card .badge.hold:before{background:#fbbf24}.distance-value{display:flex;align-items:baseline;gap:10px;margin:18px 0 6px;line-height:1;font-variant-numeric:tabular-nums}.distance-value #distance{color:transparent;background:linear-gradient(180deg,#fff,#dbe4f0);-webkit-background-clip:text;background-clip:text;font-size:clamp(64px,8vw,104px);font-weight:750;letter-spacing:-.05em}.distance-value #distance.empty{color:#e2e8f052;background:none;-webkit-text-fill-color:currentColor}.distance-value small{color:#94a3b8;font-size:14px;font-weight:600}.distance-card .panel-note{color:#cbd5e1}.distance-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:auto;padding-top:16px;color:#94a3b8;border-top:1px solid rgba(148,163,184,.16);font-size:10.5px}.distance-foot span{display:inline-flex;align-items:center;gap:6px}.metric-stack{display:grid;grid-template-rows:repeat(3,1fr);gap:12px}.metric{display:flex;flex-direction:column;gap:6px;padding:16px 18px}.metric-head{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:11.5px;font-weight:650}.metric-icon{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;color:var(--accent);background:var(--accent-soft);border-radius:9px}.metric-icon svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.metric-icon.cyan{color:var(--cyan);background:#ecfeff}.metric-icon.green{color:var(--success);background:#ecfdf5}.metric-value{display:flex;align-items:baseline;gap:5px;margin-top:2px;color:var(--ink);font-size:30px;font-weight:750;letter-spacing:-1px;line-height:1.05;font-variant-numeric:tabular-nums}.metric-value small{color:var(--faint);font-size:11px;font-weight:600;letter-spacing:0}.metric p{margin:0;color:var(--faint);font-size:10.5px;line-height:1.55}.chart-panel{padding-bottom:18px}.legend{display:inline-flex;align-items:center;gap:6px;color:var(--faint);font-size:10.5px}.legend i{width:14px;height:3px;background:linear-gradient(90deg,#22d3ee,#3164e8);border-radius:2px}canvas{display:block;width:100%;height:260px;margin-top:14px}.chart-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:4px;color:#9aa8bb;font-size:10.5px}.split-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:16px}.device-model{display:block;margin:18px 0 14px;color:var(--ink);font-size:24px;font-weight:750;letter-spacing:-.5px}.device-dl{display:grid;grid-template-columns:1fr 1.35fr;gap:0;margin:0;font-size:12px}.device-dl dt{padding:8px 0;color:var(--faint);border-bottom:1px dashed var(--line-soft)}.device-dl dd{padding:8px 0;margin:0;color:var(--ink-soft);border-bottom:1px dashed var(--line-soft);text-align:right;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.device-dl dt:last-of-type,.device-dl dd:last-of-type{border-bottom:0}.code-block{min-height:94px;margin:14px 0 0;padding:15px 16px;color:#a9c4e4;background:#0c1b2e;border:1px solid rgba(59,130,246,.18);border-radius:12px;font:11px/1.85 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere}.data-table{width:100%;margin-top:12px;border-collapse:collapse;font-size:12px}.data-table th{padding:9px 10px;color:var(--faint);border-bottom:1px solid var(--line-soft);font-size:10.5px;font-weight:700;letter-spacing:.06em;text-align:left;text-transform:uppercase}.data-table td{padding:9px 10px;color:var(--ink-soft);border-bottom:1px solid var(--line-soft)}.data-table th:last-child,.data-table td:last-child{text-align:right}.data-table tr:last-child td{border-bottom:0}.section-intro p{max-width:900px;margin:0;padding:0 4px;color:#7c8ba1;font-size:12px;line-height:1.7}.presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.preset{position:relative;display:flex;flex-direction:column;padding:18px;color:var(--ink-soft);background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:0 10px 24px #0f172a0a;text-align:left;white-space:normal}.preset:before{content:"";position:absolute;top:0;right:18px;left:18px;height:3px;background:linear-gradient(90deg,#22d3ee,#3b82f6);border-radius:0 0 3px 3px;opacity:.55}.preset:nth-child(2):before{background:linear-gradient(90deg,#34d399,#0ea5e9)}.preset:nth-child(3):before{background:linear-gradient(90deg,#fbbf24,#f97316)}.preset:nth-child(4):before{background:linear-gradient(90deg,#a78bfa,#6366f1)}.preset:hover:not(:disabled){border-color:var(--accent-line);box-shadow:0 18px 36px rgba(var(--accent-rgb),.1);transform:translateY(-3px)}.preset.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 18px 36px rgba(var(--accent-rgb),.14)}.preset.current:after{content:"当前读回";position:absolute;top:12px;right:12px;padding:2px 7px;color:var(--success);background:#ecfdf5;border-radius:999px;font-size:9px;font-weight:700}.preset h3{margin:4px 0 8px;padding-right:56px;color:var(--ink);font-size:16px;letter-spacing:-.2px}.preset .lead{color:var(--accent);font-size:10px;font-weight:650}.preset p{min-height:34px;margin:7px 0 10px;color:var(--muted);font-size:10.5px;line-height:1.65}.preset .trade{padding-top:9px;color:var(--faint);border-top:1px solid var(--line-soft);font-size:9.5px;line-height:1.6}.apply-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 20px;color:var(--muted);background:linear-gradient(135deg,var(--surface),var(--surface-soft));font-size:12px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}.can-form{grid-template-columns:repeat(2,minmax(0,1fr))}.advanced-form{grid-template-columns:1fr 1fr auto;align-items:end}.field{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:11px;font-weight:600}.field input,.field select{height:38px;padding:0 12px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:10px;font:12px var(--font);outline:none;transition:border-color .16s,box-shadow .16s}.field input:focus,.field select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.13)}.field input:disabled,.field select:disabled{color:var(--faint);background:var(--surface-muted)}.field input[type=file]{height:auto;padding:7px 8px;font-size:11px}.field input[type=file]::file-selector-button{margin-right:10px;padding:6px 11px;color:var(--ink-soft);background:var(--surface-muted);border:1px solid var(--line);border-radius:8px;font:11px var(--font);font-weight:650;cursor:pointer}.field input[type=file]::file-selector-button:hover{color:var(--accent-strong);background:var(--accent-soft);border-color:var(--accent-line)}.field.readonly strong{display:flex;align-items:center;height:38px;padding:0 12px;color:var(--ink);background:var(--surface-soft);border:1px dashed var(--line);border-radius:10px;font:13px var(--mono)}.field-list{display:flex;flex-direction:column;margin-top:14px}.field-list div{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px dashed var(--line-soft);font-size:12px}.field-list span{color:var(--faint)}.field-list strong{color:var(--ink-soft);font-weight:650;text-align:right}.help{margin-top:14px;color:#7c8ba1;font-size:11px;line-height:1.7}.help summary{color:var(--ink-soft);cursor:pointer;font-weight:650}.help p{margin:8px 0 0}.security-state{padding:14px 16px;color:var(--ink-soft);background:var(--surface-soft);border:1px solid var(--line-soft);border-radius:12px;font-size:12px;line-height:1.8;overflow-wrap:anywhere}.update-box{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;padding:16px;background:linear-gradient(135deg,var(--accent-soft),var(--surface));border:1px solid var(--accent-line);border-radius:12px}.update-box h3{margin:0 0 4px;color:var(--accent-strong);font-size:13px}.update-box p{margin:0;color:var(--muted);font-size:11px;line-height:1.6}.activation-panel{background:linear-gradient(160deg,var(--surface),var(--surface-soft))}.pro-mark{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;color:#7dd3fc;background:linear-gradient(135deg,#0f172a,#1e3a8a);border:1px solid rgba(125,211,252,.3);border-radius:13px;font-size:11px;font-weight:800;letter-spacing:.08em}.activation-panel .field{margin-top:16px}.activation-panel .primary{margin-top:14px}.checklist{display:flex;flex-direction:column;gap:8px;margin:16px 0 0;padding:0;list-style:none}.checklist li{position:relative;padding-left:18px;color:var(--muted);font-size:11px;line-height:1.6}.checklist li:before{content:"";position:absolute;top:6px;left:2px;width:6px;height:6px;background:#93c5fd;border-radius:50%}.steps{margin:14px 0 16px;padding:0 0 0 22px;color:var(--muted);font-size:12px;line-height:1.8}.steps li{margin-bottom:4px;padding-left:4px}.check{display:flex;align-items:flex-start;gap:9px;margin:10px 0;color:var(--ink-soft);font-size:11.5px;line-height:1.6;cursor:pointer}.check input{width:15px;height:15px;margin-top:2px;accent-color:var(--accent)}.progress-box{margin-top:16px;padding:14px 16px;background:var(--surface-soft);border:1px solid var(--line-soft);border-radius:12px}.progress-box p{margin:0 0 9px;color:var(--ink-soft);font-size:11.5px;line-height:1.6}progress{width:100%;height:8px;overflow:hidden;background:var(--surface-muted);border:0;border-radius:999px;appearance:none}progress::-webkit-progress-bar{background:var(--surface-muted)}progress::-webkit-progress-value{background:linear-gradient(90deg,var(--accent-2),var(--accent));border-radius:999px}.param-help{position:relative;display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;margin-left:5px;color:var(--accent-strong);background:var(--accent-soft);border-radius:50%;font-size:10px;font-weight:750;cursor:help;-webkit-user-select:none;user-select:none;outline:none;vertical-align:middle}.param-help:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 9px);left:50%;z-index:120;width:235px;max-width:70vw;padding:9px 11px;color:#fff;background:#122844;border-radius:8px;box-shadow:0 12px 26px #0a193040;font-size:10px;font-weight:400;line-height:1.7;text-align:left;white-space:pre-line;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%);transition:opacity .12s}.param-help:before{content:"";position:absolute;bottom:calc(100% + 3px);left:50%;z-index:121;border:6px solid transparent;border-top-color:#122844;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%);transition:opacity .12s}.param-help:hover:after,.param-help:hover:before,.param-help:focus-visible:after,.param-help:focus-visible:before{opacity:1;visibility:visible}.event-log{max-height:min(60vh,620px);margin-top:12px;overflow:auto;background:var(--surface-soft);border:1px solid var(--line-soft);border-radius:12px}.event-log:empty:after{content:"暂无记录";display:block;padding:30px;color:var(--faint);font-size:12px;text-align:center}.event-log div{padding:10px 14px;color:var(--ink-soft);border-bottom:1px solid var(--line-soft);font:11px/1.65 var(--mono)}.event-log div:last-child{border-bottom:0}.app-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;max-width:1520px;margin:0 auto;padding:4px 32px 20px;color:var(--faint);font-size:10px}@media(max-width:1200px){.hero-grid{grid-template-columns:minmax(0,1fr) 340px}.presets,.can-form{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:1000px){.console-shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto;padding:16px 18px;overflow:visible;border-right:0;border-bottom:1px solid rgba(148,163,184,.15)}.sidebar:before{display:none}.nav{flex-direction:row;flex-wrap:nowrap;gap:10px;padding-bottom:2px;overflow-x:auto}.nav-group{flex-direction:row;align-items:center;gap:4px}.nav-label{display:none}.nav-item{width:auto;padding:8px 11px;white-space:nowrap}.nav-arrow,.sidebar-foot{display:none}.session-card{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:10px 12px}.session-row{margin-bottom:0}.connect-btn{width:auto;height:34px;padding:7px 14px}.session-meta{margin:0 0 0 auto}.topbar{position:static;padding:18px 22px}.content{padding:18px 22px}.app-footer{padding:4px 22px 18px}.hero-grid{grid-template-columns:1fr}.metric-stack{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none}}@media(max-width:760px){.metric-stack,.split-grid,.presets,.can-form,.advanced-form{grid-template-columns:1fr}.page-sub{display:none}.topbar{flex-direction:column;align-items:flex-start;gap:12px}.update-box{flex-direction:column;align-items:stretch}}@media(max-width:560px){.content{padding:14px}.panel{padding:17px}.distance-value #distance{font-size:70px}.apply-bar{flex-direction:column;align-items:stretch}.chart-panel .panel-head{flex-direction:column}.app-footer{flex-direction:column;gap:4px;align-items:flex-start;padding:0 14px 16px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.pro-badge{display:inline-flex;align-items:center;justify-content:center;padding:2px 8px;color:#fff;background:linear-gradient(135deg,#0ea5e9,#2563eb);border-radius:999px;box-shadow:0 4px 10px #2563eb40;font-size:9px;font-weight:800;letter-spacing:.08em;white-space:nowrap}.sidebar-pro{padding:13px;background:linear-gradient(135deg,rgba(var(--accent-rgb),.18),#06b6d414);border:1px solid rgba(var(--accent-rgb),.22);border-radius:14px}.sidebar-pro-head{display:flex;align-items:center;gap:8px;color:#f8fafc;font-size:12px}.sidebar-pro p{margin:7px 0 10px;color:#8fa7c4;font-size:10px;line-height:1.65}.sidebar-pro button{color:#dbe7f5;background:#ffffff14;border-color:#94a3b838}.panel-head-tags{display:flex;align-items:center;gap:8px}.base-notice{display:flex;align-items:center;gap:12px;padding:14px 18px;background:linear-gradient(135deg,var(--accent-soft),var(--surface));border-color:var(--accent-line)}.base-notice>div{flex:1}.base-notice strong{display:block;color:var(--ink);font-size:12.5px}.base-notice p{margin:3px 0 0;color:var(--muted);font-size:11px;line-height:1.6}.lock-wrap{position:relative;margin-top:14px}.lock-overlay{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;padding:14px;color:var(--ink);background:var(--lock-bg);border:1px dashed var(--accent-line);border-radius:14px;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);text-align:center}.lock-overlay:hover:not(:disabled){color:var(--ink);background:var(--lock-bg);border-color:var(--accent);transform:none}.lock-overlay strong{font-size:12px}.lock-overlay small{color:var(--muted);font-size:10.5px}.preset-pro{align-self:flex-start;margin:0 0 6px;padding:2px 8px;color:var(--accent-strong);background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:999px;font-size:9px;font-weight:800;letter-spacing:.08em}.preset.pro-locked{cursor:pointer}.activation-contact{display:flex;align-items:center;gap:8px;margin:12px 0 0;padding:10px 12px;color:var(--muted);background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:10px;font-size:11px;line-height:1.6}.theme-menu{position:relative}.theme-btn{display:inline-flex;align-items:center;gap:7px}.theme-popover{position:absolute;top:calc(100% + 10px);right:0;z-index:60;width:300px;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 50px #0f172a2e}.theme-label{margin:0 0 8px;color:var(--faint);font-size:10px;font-weight:800;letter-spacing:.12em}.segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;background:var(--surface-muted);border-radius:10px}.segmented button{display:flex;align-items:center;justify-content:center;gap:5px;padding:7px 5px;color:var(--muted);background:transparent;border:0;border-radius:8px;font-size:10.5px}.segmented button:hover:not(:disabled){color:var(--accent-strong);transform:none}.segmented button.active{color:var(--accent-strong);background:var(--surface);box-shadow:0 2px 8px #0f172a14}.theme-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}.theme-choice{display:flex;align-items:center;gap:8px;padding:8px;color:var(--muted);background:transparent;border:1px solid var(--line);border-radius:9px;font-size:11px;text-align:left}.theme-choice:hover:not(:disabled){color:var(--ink);border-color:var(--accent-line);transform:none}.theme-choice.active{color:var(--ink);background:var(--accent-soft);border-color:var(--accent)}.theme-choice i{flex:none;width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 2px #ffffff9e}.welcome{display:flex;flex-direction:column;gap:18px}.welcome-hero{position:relative;display:flex;align-items:center;justify-content:space-between;gap:28px;padding:36px;overflow:hidden;color:#e2e8f0;background:radial-gradient(120% 120% at 0% 0%,var(--hero-start) 0%,var(--hero-mid) 55%,var(--hero-end) 100%);border:1px solid var(--hero-border);border-radius:22px;box-shadow:0 22px 48px #08172938}.welcome-hero:after{content:"";position:absolute;right:-100px;bottom:-160px;width:380px;height:380px;background:radial-gradient(circle,var(--hero-glow),transparent 65%);pointer-events:none}.welcome-hero>*{position:relative;z-index:1}.welcome-hero .eyebrow{color:#94a3b8}.welcome-hero h2{margin:8px 0 10px;color:#f8fafc;font-size:clamp(26px,3vw,36px);letter-spacing:-.8px}.welcome-hero p{max-width:620px;margin:0;color:#cbd5e1;font-size:13px;line-height:1.8}.welcome-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.welcome-actions button{display:inline-flex;align-items:center;gap:7px}.welcome-actions .ghost{color:#dbe7f5;background:#ffffff14;border-color:#94a3b838}.welcome-actions .ghost:hover:not(:disabled){color:#fff;background:#ffffff1f;border-color:#94a3b859}.welcome-badge{display:flex;flex:none;flex-direction:column;min-width:190px;padding:18px;background:#ffffff12;border:1px solid rgba(148,163,184,.18);border-radius:16px}.welcome-badge span{color:#94a3b8;font-size:10px;font-weight:700;letter-spacing:.1em}.welcome-badge strong{margin:6px 0 4px;color:#fff;font-size:20px}.welcome-badge small{color:#cbd5e1;font-size:10px}.welcome-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.welcome-features .panel{padding:18px}.welcome-features h3{margin:10px 0 6px;font-size:14px}.welcome-features p{margin:0;color:var(--muted);font-size:11.5px;line-height:1.65}.feature-icon{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;color:var(--accent);background:var(--accent-soft);border-radius:10px}.feature-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.feature-icon.cyan{color:var(--cyan);background:#ecfeff}.feature-icon.green{color:var(--success);background:var(--success-soft)}.overview-live{display:flex;flex-direction:column;gap:18px}.guide-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;background:linear-gradient(135deg,var(--surface),var(--accent-soft));border-color:var(--accent-line)}.guide-hero h2{margin:6px 0 8px;font-size:24px;letter-spacing:-.5px}.guide-hero p{max-width:700px;margin:0;color:var(--muted);font-size:12px;line-height:1.7}.guide-progress{flex:none;min-width:150px;padding:14px 18px;text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:14px}.guide-progress strong{display:block;color:var(--accent);font-size:28px;line-height:1.1}.guide-progress span{color:var(--muted);font-size:10px}.guide-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.guide-step{display:flex;align-items:flex-start;gap:14px;padding:18px}.step-index{display:inline-flex;flex:none;align-items:center;justify-content:center;width:28px;height:28px;color:var(--muted);background:var(--surface-muted);border-radius:50%;font-size:11px;font-weight:800}.guide-step.done .step-index{color:var(--success);background:var(--success-soft)}.guide-step h3{margin:2px 0 5px;font-size:13px}.guide-step p{margin:0;color:var(--muted);font-size:11px;line-height:1.65}.guide-step button{flex:none;margin-left:auto}.compare-table{width:100%;margin-top:14px;border-collapse:collapse;font-size:11.5px}.compare-table th,.compare-table td{padding:8px 10px;border-bottom:1px solid var(--line-soft);text-align:left}.compare-table th{color:var(--faint);font-size:10px;font-weight:700;letter-spacing:.05em}.compare-table td{color:var(--ink-soft)}.compare-table td:first-child{color:var(--muted)}.help-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.help-grid .panel{height:100%}.help-grid .help{margin-top:10px}.modal-backdrop{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:24px;background:#030a159e;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.pro-modal{position:relative;width:min(480px,100%);padding:28px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:22px;box-shadow:0 30px 80px #02061773}.pro-modal h2{margin:10px 0 8px;font-size:24px;letter-spacing:-.5px}.pro-modal p{color:var(--muted);font-size:12px;line-height:1.7}.pro-benefits{display:flex;flex-direction:column;gap:8px;margin:16px 0;padding:0;list-style:none}.pro-benefits li{position:relative;padding-left:20px;color:var(--ink-soft);font-size:12px;line-height:1.6}.pro-benefits li:before{content:"";position:absolute;top:6px;left:2px;width:7px;height:7px;background:linear-gradient(135deg,var(--accent-2),var(--accent));border-radius:50%}.pro-contact{padding:10px 12px;background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:10px}.modal-actions{display:flex;gap:10px;margin-top:18px}.modal-close{position:absolute;top:14px;right:14px;width:30px;height:30px;padding:0;color:var(--faint);background:transparent;border:0;font-size:20px;line-height:1}.modal-close:hover:not(:disabled){color:var(--ink);background:var(--surface-muted);border-color:transparent;transform:none}:root[data-mode=dark] .chip,:root[data-mode=dark] .ghost,:root[data-mode=dark] .theme-choice,:root[data-mode=dark] .segmented button.active{background:var(--surface);border-color:var(--line)}:root[data-mode=dark] .metric-icon.cyan,:root[data-mode=dark] .feature-icon.cyan{color:#67e8f9;background:#0b2f36}:root[data-mode=dark] .metric-icon.green{color:#6ee7b7;background:#0f2a22}:root[data-mode=dark] .welcome-actions .ghost{color:#dbe7f5;background:#ffffff14;border-color:#94a3b838}:root[data-mode=dark] .code-block{color:#b8d4f2;background:#07111f;border-color:var(--line)}:root[data-mode=dark] progress{background:var(--surface-muted)}:root[data-mode=dark] progress::-webkit-progress-bar{background:var(--surface-muted)}:root[data-mode=dark] .theme-choice i{box-shadow:inset 0 0 0 2px #00000059}@media(max-width:900px){.welcome-hero{flex-direction:column;align-items:flex-start;padding:26px}.welcome-badge{width:100%}.welcome-features,.help-grid,.guide-steps{grid-template-columns:1fr}.guide-hero{flex-direction:column;align-items:flex-start}.guide-progress{width:100%}}@media(max-width:560px){.base-notice{align-items:flex-start;flex-direction:column}.base-notice button{width:100%}.theme-popover{right:auto;left:0;width:min(300px,calc(100vw - 28px))}.welcome-actions{flex-direction:column;align-items:stretch}.guide-step{flex-wrap:wrap}.guide-step button{width:100%;margin-left:42px}.modal-actions{flex-direction:column}.pro-modal{padding:22px}}@media(max-width:760px){.theme-btn-text{display:none}}.tip{position:relative;display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;margin-left:5px;color:var(--muted);background:var(--surface-muted);border:1px solid var(--line);border-radius:50%;font-size:9px;font-weight:800;font-style:normal;line-height:1;cursor:help;-webkit-user-select:none;user-select:none;outline:none;vertical-align:middle}.tip:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 9px);left:50%;z-index:140;width:220px;max-width:70vw;padding:8px 10px;color:#fff;background:#122844;border-radius:8px;box-shadow:0 12px 26px #0a193040;font-size:10px;font-weight:400;line-height:1.65;text-align:left;white-space:pre-line;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%);transition:opacity .12s}.tip:before{content:"";position:absolute;bottom:calc(100% + 3px);left:50%;z-index:141;border:6px solid transparent;border-top-color:#122844;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%);transition:opacity .12s}.tip:hover:after,.tip:hover:before,.tip:focus-visible:after,.tip:focus-visible:before{opacity:1;visibility:visible}.can-frame-panel .badge:before{display:none}.can-byte-map{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px;margin-top:14px}.byte-field{display:flex;flex-direction:column;justify-content:center;min-height:72px;padding:10px;border:1px solid var(--line);border-radius:10px}.byte-field span{color:var(--faint);font-size:9px;font-weight:700;letter-spacing:.05em}.byte-field strong{margin:2px 0;font-size:13px;line-height:1.2}.byte-field small{color:var(--muted);font-size:9.5px;line-height:1.3}.byte-field.distance{grid-column:span 2;color:var(--accent-strong);background:var(--accent-soft);border-color:var(--accent-line)}.byte-field.voltage{grid-column:span 2;color:var(--warning-ink);background:var(--warning-soft);border-color:var(--warning-line)}.byte-field.status{grid-column:span 4;color:var(--ink-soft);background:var(--surface-muted)}.byte-field.distance span,.byte-field.voltage span{color:currentColor;opacity:.68}.can-valid-rule{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;padding:10px 12px;color:var(--success-ink);background:var(--success-soft);border:1px solid var(--success-line);border-radius:10px;font-size:10.5px}.can-valid-rule strong{font-size:11.5px}.valid-dot{width:8px;height:8px;background:var(--success);border-radius:50%;box-shadow:0 0 0 3px #10b98124}.can-bit-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.can-bit{padding:4px 8px;border:1px solid transparent;border-radius:999px;font-size:9.5px;font-weight:650;white-space:nowrap}.can-bit.valid{color:var(--success-ink);background:var(--success-soft);border-color:var(--success-line)}.can-bit.info{color:var(--info-ink);background:var(--info-soft);border-color:var(--info-line)}.can-bit.warn{color:var(--warning-ink);background:var(--warning-soft);border-color:var(--warning-line)}.can-bit.danger{color:var(--danger-ink);background:var(--danger-soft);border-color:var(--danger-line)}.can-example{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px;padding:10px 12px;color:var(--muted);background:var(--surface-soft);border:1px dashed var(--line);border-radius:10px;font-size:10px}.can-example code{color:var(--ink-soft);font:10px var(--mono)}.can-example small{color:var(--faint)}@media(max-width:760px){.can-byte-map{grid-template-columns:repeat(4,minmax(0,1fr))}.byte-field.distance,.byte-field.voltage{grid-column:span 2}.byte-field.status{grid-column:span 4}}