:root{--canvas:#f5f7fa;--surface:#f9fafc;--ink:#111827;--muted:#667085;--line:#dfe4ea;--blue:#0071e3;--green:#0a7f42;--amber:#b26a00;--red:#b42318;color:var(--ink);background:var(--canvas);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,Roboto,Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}input[type=checkbox]{width:16px;height:16px;accent-color:var(--blue)}.login-page,.app-shell{min-height:100vh}.login-page{background:linear-gradient(#ffffffe0,#f6f8fbf5),#f5f7fa;grid-template-columns:minmax(320px,420px) minmax(420px,720px);justify-content:center;align-items:center;gap:32px;padding:40px;display:grid}.login-panel,.login-snapshot,.panel,.device-panel,.health-tile,.metric{border:1px solid var(--line);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffffeb;box-shadow:0 18px 45px #19202c14}.login-panel{border-radius:18px;padding:28px}.brand-row{align-items:center;gap:14px;margin-bottom:26px;display:flex}.brand-mark{color:#fff;background:#111827;border-radius:14px;justify-content:center;align-items:center;width:48px;height:48px;display:inline-flex;box-shadow:inset 0 1px #ffffff38}.brand-mark.small{border-radius:10px;width:34px;height:34px}.eyebrow{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin:0 0 4px;font-size:12px;font-weight:700}.login-panel h1,.topbar h2{color:var(--ink);letter-spacing:0;margin:0}.login-panel h1{font-size:30px}.login-panel label{color:var(--muted);margin-top:16px;font-size:13px;font-weight:600;display:block}.login-panel input,.input-with-icon input{width:100%;min-width:0;color:var(--ink);background:0 0;border:0;outline:none}.login-panel label input{border:1px solid var(--line);background:var(--surface);border-radius:10px;margin-top:7px;padding:11px 12px;display:block}.segmented{border:1px solid var(--line);background:#eef1f6;border-radius:10px;grid-auto-flow:column;gap:3px;padding:3px;display:inline-grid}.segmented button{color:var(--muted);background:0 0;border:0;border-radius:7px;padding:8px 14px;font-weight:650}.segmented button.active{color:var(--ink);background:#fff;box-shadow:0 4px 12px #19202c1f}.portal-chip{border:1px solid var(--line);width:100%;color:var(--ink);background:#eef6ff;border-radius:11px;justify-content:space-between;gap:10px;padding:10px 12px;font-weight:700}.portal-chip svg{color:#0b63ce}.portal-chip span{margin-right:auto}.portal-chip strong{color:var(--muted);font-size:12px;font-weight:750}.segmented.compact{flex-wrap:wrap;display:flex}.segmented.compact button{padding:6px 10px;font-size:12px}.primary-action,.secondary-action,.role-switch,.nav-item,.icon-button,.account-button{font:inherit;cursor:pointer;border:0}.primary-action{color:#fff;background:#0071e3;border-radius:11px;justify-content:center;align-items:center;gap:8px;width:100%;margin-top:22px;padding:12px 16px;font-weight:700;display:inline-flex;box-shadow:0 10px 24px #0071e342}.primary-action:disabled{cursor:wait;opacity:.72}.login-error{color:#b42318;background:#fff1f0;border:1px solid #ffd2cf;border-radius:10px;margin:12px 0 -6px;padding:9px 10px;font-size:13px;font-weight:650}.login-snapshot{border-radius:22px;padding:24px}.snapshot-header,.portal-chip,.portal-domain,.panel-header,.device-header,.topbar,.device-title,.device-metrics,.topbar-actions,.search-pill,.account-button,.role-switch,.nav-item,.metric,.sync-row,.cap-line{align-items:center;display:flex}.snapshot-header{color:var(--muted);justify-content:space-between;margin-bottom:18px;font-size:13px}.snapshot-grid,.metric-strip{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.app-shell{background:var(--canvas);grid-template-columns:248px minmax(0,1fr);display:grid}.sidebar{border-right:1px solid var(--line);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:#fbfcfee6;flex-direction:column;height:100vh;display:flex;position:sticky;top:0}.sidebar-brand{align-items:center;gap:12px;padding:20px;display:flex}.sidebar-brand strong,.sidebar-brand span{display:block}.sidebar-brand strong{color:var(--ink)}.sidebar-brand span{color:var(--muted);font-size:12px}.sidebar nav{gap:4px;padding:8px 12px;display:grid}.nav-item{color:#4b5563;text-align:left;background:0 0;border-radius:10px;gap:10px;padding:10px 12px;font-weight:650}.nav-item.active{color:#0b63ce;background:#eaf2ff}.sidebar-footer{margin-top:auto;padding:14px}.role-switch{width:100%;color:var(--ink);border:1px solid var(--line);background:#fff;border-radius:10px;gap:8px;padding:10px}.portal-domain{border:1px solid var(--line);background:#fff;border-radius:10px;flex-direction:column;align-items:flex-start;gap:4px;padding:10px 12px}.portal-domain span{color:var(--muted);font-size:12px}.portal-domain strong{color:var(--ink);letter-spacing:0;font-size:13px}.workspace{min-width:0;padding:22px}.topbar{z-index:3;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#f6f8fbdb;justify-content:space-between;gap:18px;margin:-22px -22px 22px;padding:18px 22px;position:sticky;top:0}.topbar h2{font-size:24px}.topbar-actions{gap:10px}.search-pill{border:1px solid var(--line);min-width:260px;color:var(--muted);background:#ffffffb8;border-radius:999px;gap:8px;padding:9px 13px;font-size:13px}.icon-button,.account-button{border:1px solid var(--line);height:38px;color:var(--ink);background:#ffffffd1;border-radius:999px}.icon-button{place-items:center;width:38px;display:inline-grid}.account-button{gap:7px;padding:0 12px;font-weight:650}.page-grid{gap:16px;display:grid}.metric-strip{align-items:stretch}.metric{border-radius:14px;gap:12px;min-height:92px;padding:16px}.metric-icon{color:#fff;background:#111827;border-radius:11px;flex:none;place-items:center;width:38px;height:38px;display:inline-grid}.metric.blue .metric-icon{background:#0071e3}.metric.green .metric-icon{background:#0a7f42}.metric.amber .metric-icon{background:#b26a00}.metric.dark .metric-icon,.metric-icon.dark{background:#111827}.metric span,.health-tile span,.sync-row span,.subtle{color:var(--muted);font-size:12px}.metric strong{color:var(--ink);letter-spacing:0;margin-top:4px;font-size:24px;display:block}.content-grid{gap:16px;display:grid}.two-columns{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}.three-columns{grid-template-columns:repeat(3,minmax(0,1fr))}.panel,.device-panel,.health-tile{border-radius:14px}.panel{min-width:0;padding:16px}.panel-header{justify-content:space-between;gap:12px;margin-bottom:14px}.panel h3{color:var(--ink);letter-spacing:0;margin:0;font-size:16px}.secondary-action{color:#0b63ce;background:#eaf2ff;border-radius:999px;padding:7px 11px;font-weight:700}.list-stack{gap:10px;display:grid}.sync-row{border:1px solid var(--line);background:var(--surface);border-radius:12px;gap:12px;padding:12px}.sync-row>div:nth-child(2){min-width:0}.sync-row strong,.sync-row span{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.sync-row time{color:var(--muted);margin-left:auto;font-size:12px}.file-icon{color:#0b63ce;background:#eaf2ff;border-radius:10px;flex:none;place-items:center;width:34px;height:34px;display:inline-grid}.toolbar{justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.input-with-icon{border:1px solid var(--line);width:min(420px,100%);color:var(--muted);background:var(--surface);border-radius:11px;align-items:center;gap:9px;padding:9px 11px;display:flex}.data-table,.compact-table{border-collapse:collapse;width:100%;font-size:13px}.data-table th,.data-table td,.compact-table th,.compact-table td{border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;padding:11px 10px}.data-table th,.compact-table th{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-size:11px;font-weight:800}.data-table td strong,.data-table td .subtle{display:block}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.status-badge{white-space:nowrap;border-radius:999px;align-items:center;padding:4px 8px;font-size:12px;font-weight:750;display:inline-flex}.status-badge.green{color:#0b6b38;background:#e8f7ee}.status-badge.amber{color:#8a5200;background:#fff2d5}.status-badge.red{color:#b42318;background:#feeceb}.status-badge.blue{color:#0b63ce;background:#eaf2ff}.status-badge.neutral{color:#4b5563;background:#eef1f5}.health-tile{padding:16px}.health-tile .metric-icon{margin-bottom:14px}.health-tile strong{color:var(--ink);margin-top:7px;font-size:18px;display:block}.health-tile p{color:var(--muted);margin:6px 0 0;font-size:13px}.gateway-list{gap:14px;display:grid}.device-panel{padding:0;overflow:hidden}.device-header{border-bottom:1px solid var(--line);justify-content:space-between;gap:16px;padding:16px}.device-title{color:var(--ink);gap:9px}.device-title strong{font-size:16px}.device-metrics{flex-wrap:wrap;justify-content:flex-end;gap:8px}.device-metrics span{border:1px solid var(--line);color:var(--muted);background:var(--surface);border-radius:999px;align-items:center;gap:5px;padding:6px 9px;font-size:12px;font-weight:650;display:inline-flex}.sim-table th,.sim-table td{padding-inline:16px}.cap-line{gap:8px;min-width:180px}.cap-line progress{background:#eef1f5;border:0;border-radius:999px;width:92px;height:7px;overflow:hidden}.cap-line progress::-webkit-progress-bar{background:#eef1f5}.cap-line progress::-webkit-progress-value{background:#0071e3;border-radius:999px}@media (width<=1080px){.login-page,.app-shell,.two-columns,.three-columns,.metric-strip,.snapshot-grid{grid-template-columns:1fr}.sidebar{height:auto;position:static}.sidebar nav{grid-template-columns:repeat(3,minmax(0,1fr))}.nav-item{justify-content:center}.topbar{flex-direction:column;align-items:flex-start}.topbar-actions,.toolbar,.device-header{flex-direction:column;align-items:stretch}.search-pill,.input-with-icon{width:100%;min-width:0}.data-table,.compact-table{white-space:nowrap;display:block;overflow-x:auto}}.inline-notice{border:1px solid var(--line);color:var(--muted);background:#ffffffd1;border-radius:12px;padding:12px 14px;font-size:13px;font-weight:650}.inline-notice.red{color:#b42318;background:#fff1f0;border-color:#ffd2cf}.empty-state,.empty-cell{color:var(--muted);text-align:center;font-size:13px}.empty-state{border:1px dashed var(--line);background:var(--surface);border-radius:12px;padding:18px}.empty-cell{padding:22px 10px}
