:root{--nms-ink: #0B3A53;--nms-teal: #0F6A7A;--nms-mint: #2EC4B6;--nms-bg: #E8F0F2;--nms-panel: #FFFFFF;--nms-line: #C9D8DE;--nms-muted: #5A6F78;--nms-ok: #1B9E6E;--nms-warn: #D4A017;--nms-fault: #D64545;--nms-mono: "IBM Plex Mono", ui-monospace, monospace;--nms-sans: "IBM Plex Sans", "Noto Sans SC", sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;font-family:var(--nms-sans);background:var(--nms-bg);color:#1a2b33}body{background-image:radial-gradient(ellipse 80% 50% at 100% -10%,rgba(46,196,182,.12),transparent 55%),radial-gradient(ellipse 60% 40% at -10% 100%,rgba(15,106,122,.1),transparent 50%),linear-gradient(180deg,#e8f0f2,#dce8ec);background-attachment:fixed}a{color:inherit;text-decoration:none}.mono{font-family:var(--nms-mono)}.page-title{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:16px}.page-title h1{margin:0;font-size:20px;font-weight:700;letter-spacing:.02em}.page-title p{margin:4px 0 0;color:var(--nms-muted);font-size:12px}.stat-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:16px}.stat-card{background:var(--nms-panel);border:1px solid var(--nms-line);border-radius:8px;padding:14px 16px;position:relative;overflow:hidden}.stat-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent, var(--nms-teal))}.stat-card .label{color:var(--nms-muted);font-size:12px}.stat-card .value{margin-top:6px;font-family:var(--nms-mono);font-size:24px;font-weight:600;line-height:1.1}.stat-card .hint{margin-top:4px;font-size:11px;color:var(--nms-muted)}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle}.panel{background:var(--nms-panel);border:1px solid var(--nms-line);border-radius:8px;padding:16px}.panel+.panel{margin-top:12px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:12px}.panel-head h3{margin:0;font-size:14px;font-weight:600}.topology-canvas{position:relative;min-height:420px;background:linear-gradient(rgba(11,58,83,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(11,58,83,.03) 1px,transparent 1px),#f7fbfc;background-size:24px 24px,24px 24px,auto;border:1px solid var(--nms-line);border-radius:8px;overflow:hidden}.topo-node{position:absolute;width:120px;text-align:center;cursor:pointer;transition:transform .2s ease}.topo-node:hover{transform:translateY(-2px)}.topo-node .icon{width:56px;height:56px;margin:0 auto 6px;border-radius:12px;display:grid;place-items:center;color:#fff;font-size:22px;box-shadow:0 8px 20px #0b3a532e}.topo-node .name{font-size:12px;font-weight:600}.topo-node .meta{font-size:11px;color:var(--nms-muted)}.topo-link{position:absolute;height:2px;transform-origin:left center;background:var(--nms-ok);opacity:.85}.topo-link.active{height:3px;background:linear-gradient(90deg,var(--nms-mint),var(--nms-teal));box-shadow:0 0 8px #2ec4b673;animation:pulse-link 2s ease-in-out infinite}.topo-link.warn{background:var(--nms-warn)}.topo-link.fault{background:var(--nms-fault)}.topo-link.idle{background:#a8b8c0;opacity:.45;stroke-dasharray:4 4}@keyframes pulse-link{0%,to{opacity:.7}50%{opacity:1}}.login-page{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr}.login-hero{position:relative;padding:48px;color:#e8f4f2;background:radial-gradient(circle at 20% 20%,rgba(46,196,182,.25),transparent 40%),radial-gradient(circle at 80% 70%,rgba(74,155,176,.2),transparent 35%),linear-gradient(145deg,#072636,#0b3a53 45%,#0f6a7a);overflow:hidden}.login-hero h1{margin:80px 0 12px;font-size:40px;line-height:1.2;max-width:520px}.login-hero p{max-width:460px;color:#e8f4f2c7;font-size:15px;line-height:1.6}.login-form-wrap{display:grid;place-items:center;padding:32px;background:#f4f8f9}.login-card{width:min(400px,100%);background:#fff;border:1px solid var(--nms-line);border-radius:12px;padding:32px 28px;box-shadow:0 16px 40px #0b3a5314}.brand-mark{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.04em}.brand-mark .logo{width:36px;height:36px;border-radius:8px;background:linear-gradient(135deg,#2ec4b6,#0f6a7a);display:grid;place-items:center;color:#fff}.sider-brand{height:56px;display:flex;align-items:center;gap:10px;padding:0 16px;color:#e8f4f2;border-bottom:1px solid rgba(255,255,255,.08)}.sider-brand .logo{width:28px;height:28px;border-radius:6px;background:linear-gradient(135deg,#2ec4b6,#1a7a8c);flex-shrink:0}.sider-brand .text{overflow:hidden}.sider-brand .text strong{display:block;font-size:13px;white-space:nowrap}.sider-brand .text span{font-size:11px;opacity:.65}.app-header{display:flex;align-items:center;justify-content:space-between;padding:0 20px!important;border-bottom:1px solid var(--nms-line);height:56px!important;line-height:56px!important}.header-meta{display:flex;align-items:center;gap:16px;color:var(--nms-muted);font-size:12px}.content-wrap{margin:16px;min-height:calc(100vh - 88px)}.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--nms-muted)}.legend span{display:inline-flex;align-items:center;gap:6px}@media(max-width:960px){.login-page{grid-template-columns:1fr}.login-hero{min-height:220px;padding:28px}.login-hero h1{margin-top:24px;font-size:28px}}