:root {
  --bg: #080b12;
  --panel: #111620;
  --panel-2: #151b27;
  --line: rgba(255,255,255,.08);
  --line-strong: rgba(255,255,255,.14);
  --text: #f6f7fb;
  --muted: #8993a6;
  --cyan: #22d3ee;
  --cyan-soft: rgba(34,211,238,.12);
  --violet: #9b87f5;
  --green: #43e6a0;
  --orange: #f5a85b;
  --red: #ff6b7a;
  --sidebar: 248px;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background: var(--bg);
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 80% 5%, rgba(43,87,125,.13), transparent 32%), var(--bg); color: var(--text); }
button,input,select,textarea { font: inherit; }
button { color: inherit; }
.hidden { display: none !important; }
.eyebrow { margin: 0 0 8px; color: var(--cyan); font-size: 10px; font-weight: 800; letter-spacing: .2em; }
.status-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.status-dot.online { background: var(--green); box-shadow: 0 0 12px rgba(67,230,160,.7); }
.status-dot.offline { background: var(--red); }
.status-dot.unchecked { background: #667085; }
.login-screen { position: fixed; inset: 0; display: grid; place-items: center; overflow: hidden; background: #070a10; z-index: 100; }
.login-screen::before { content:""; position:absolute; inset:0; opacity:.22; background-image: linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size: 42px 42px; mask-image: radial-gradient(circle,#000 25%,transparent 72%); }
.login-glow { position:absolute; width:460px; height:460px; border-radius:50%; filter:blur(80px); opacity:.13; }
.login-glow-a { background:var(--cyan); top:-180px; right:-90px; }
.login-glow-b { background:var(--violet); bottom:-220px; left:-100px; }
.login-card { position:relative; width:min(430px,calc(100vw - 32px)); padding:42px; border:1px solid var(--line-strong); background:linear-gradient(145deg,rgba(22,28,40,.94),rgba(11,14,22,.94)); border-radius:24px; box-shadow:0 34px 100px rgba(0,0,0,.5); }
.brand-mark { width:56px; height:56px; display:grid; place-items:center; margin-bottom:24px; border:1px solid rgba(34,211,238,.38); border-radius:17px; background:linear-gradient(145deg,rgba(34,211,238,.18),rgba(155,135,245,.12)); box-shadow:inset 0 0 24px rgba(34,211,238,.08),0 10px 34px rgba(0,0,0,.3); }
.brand-mark span { font-size:27px; font-weight:900; font-style:italic; background:linear-gradient(135deg,#fff,var(--cyan)); -webkit-background-clip:text; color:transparent; }
.login-card h1 { margin:0; font-size:31px; letter-spacing:-.04em; }
.login-copy { color:var(--muted); margin:10px 0 30px; line-height:1.55; }
label { display:flex; flex-direction:column; gap:8px; margin-bottom:16px; color:#c4cad5; font-size:12px; font-weight:650; }
input,select,textarea { width:100%; color:var(--text); background:#0b0f17; border:1px solid var(--line-strong); border-radius:10px; padding:12px 13px; outline:none; transition:.2s border,.2s box-shadow; }
textarea { resize:vertical; line-height:1.5; }
input:focus,select:focus,textarea:focus { border-color:rgba(34,211,238,.6); box-shadow:0 0 0 3px rgba(34,211,238,.09); }
select { cursor:pointer; }
.form-error { min-height:18px; color:#ff8290; font-size:12px; line-height:1.45; }
.button { border:0; border-radius:10px; padding:11px 15px; font-size:12px; font-weight:750; cursor:pointer; transition:.2s transform,.2s background,.2s border; }
.button:hover { transform:translateY(-1px); }
.button:disabled { opacity:.45; cursor:wait; transform:none; }
.button-primary { color:#041014; background:linear-gradient(135deg,#64e9f8,var(--cyan)); box-shadow:0 8px 24px rgba(34,211,238,.14); }
.button-ghost { color:#d8dce5; border:1px solid var(--line-strong); background:rgba(255,255,255,.035); }
.button-wide { width:100%; padding:13px; }
.secure-note { display:flex; gap:8px; justify-content:center; align-items:center; margin-top:22px; color:#6e788a; font-size:11px; }
.app-shell { min-height:100vh; }
.sidebar { position:fixed; inset:0 auto 0 0; z-index:20; width:var(--sidebar); display:flex; flex-direction:column; padding:22px 14px; background:rgba(11,14,22,.96); border-right:1px solid var(--line); backdrop-filter:blur(18px); }
.sidebar-brand { display:flex; align-items:center; gap:11px; padding:0 9px 24px; border-bottom:1px solid var(--line); }
.brand-mark-small { flex:none; width:38px; height:38px; margin:0; border-radius:11px; }
.brand-mark-small span { font-size:19px; }
.sidebar-brand strong { display:block; font-size:16px; letter-spacing:-.02em; }
.sidebar-brand small { display:block; margin-top:3px; color:#647085; font-size:8px; letter-spacing:.16em; }
.nav-list { display:flex; flex-direction:column; gap:5px; margin-top:24px; }
.nav-item { display:flex; align-items:center; gap:11px; width:100%; min-height:43px; padding:0 12px; border:1px solid transparent; border-radius:9px; color:#8e98aa; background:transparent; cursor:pointer; font-size:12px; font-weight:650; text-align:left; }
.nav-item span { width:18px; color:#697487; font-size:17px; text-align:center; }
.nav-item b { margin-left:auto; min-width:22px; padding:3px 6px; border-radius:10px; color:#8d97aa; background:rgba(255,255,255,.06); font-size:9px; text-align:center; }
.nav-item:hover { color:#dce1ea; background:rgba(255,255,255,.035); }
.nav-item.active { color:#f7f9fc; background:linear-gradient(90deg,rgba(34,211,238,.12),rgba(34,211,238,.025)); border-color:rgba(34,211,238,.14); }
.nav-item.active span { color:var(--cyan); }
.sidebar-status { margin-top:auto; padding:15px 12px; border:1px solid var(--line); border-radius:11px; background:rgba(255,255,255,.025); }
.sidebar-status div { display:flex; align-items:center; gap:8px; }
.sidebar-status strong { font-size:10px; }
.sidebar-status small { display:block; margin:6px 0 0 15px; color:#606b7d; font-size:9px; }
.logout-button { margin-top:10px; }
.main-content { margin-left:var(--sidebar); min-height:100vh; }
.topbar { height:83px; display:flex; align-items:center; gap:20px; padding:0 30px; border-bottom:1px solid var(--line); background:rgba(8,11,18,.78); backdrop-filter:blur(16px); position:sticky; top:0; z-index:15; }
.topbar h2 { margin:0; font-size:18px; letter-spacing:-.02em; }
.topbar .eyebrow { margin-bottom:4px; font-size:8px; }
.topbar-right { display:flex; align-items:center; gap:18px; margin-left:auto; }
.live-pill { display:flex; align-items:center; gap:7px; padding:6px 9px; color:#8c96a8; border:1px solid var(--line); border-radius:20px; font-size:9px; font-weight:800; letter-spacing:.1em; }
.admin-chip { display:flex; align-items:center; gap:9px; }
.admin-chip>span { display:grid; place-items:center; width:34px; height:34px; border-radius:10px; color:#071114; background:linear-gradient(135deg,var(--cyan),#67aaf9); font-weight:900; }
.admin-chip strong,.admin-chip small { display:block; }
.admin-chip strong { font-size:11px; }
.admin-chip small { margin-top:2px; color:#637085; font-size:9px; }
.menu-button { display:none; }
.view { display:none; padding:28px 30px 45px; max-width:1600px; margin:0 auto; }
.view.active { display:block; }
.hero-panel { min-height:225px; display:flex; align-items:center; justify-content:space-between; overflow:hidden; position:relative; padding:38px 44px; border:1px solid var(--line); border-radius:18px; background:linear-gradient(105deg,rgba(19,27,39,.98),rgba(12,18,28,.96)); }
.hero-panel::after { content:""; position:absolute; inset:0 0 0 45%; background:radial-gradient(circle at 58% 50%,rgba(34,211,238,.11),transparent 30%),linear-gradient(120deg,transparent,rgba(155,135,245,.055)); }
.hero-panel h3 { position:relative; z-index:1; margin:0; font-size:31px; line-height:1.18; letter-spacing:-.04em; }
.hero-panel h3 span { color:#8590a2; }
.hero-panel p:not(.eyebrow) { position:relative; z-index:1; max-width:500px; margin:14px 0 0; color:var(--muted); font-size:13px; line-height:1.6; }
.hero-orbit { position:relative; z-index:2; width:150px; height:150px; display:grid; place-items:center; margin-right:8%; border:1px solid rgba(34,211,238,.15); border-radius:50%; box-shadow:0 0 60px rgba(34,211,238,.08),inset 0 0 40px rgba(155,135,245,.04); }
.hero-orbit::before,.hero-orbit::after { content:""; position:absolute; border:1px solid rgba(255,255,255,.08); border-radius:50%; }
.hero-orbit::before { width:105px; height:105px; }
.hero-orbit::after { width:195px; height:195px; }
.hero-orbit strong { font-size:48px; font-style:italic; background:linear-gradient(135deg,#fff,var(--cyan)); -webkit-background-clip:text; color:transparent; text-shadow:0 0 35px rgba(34,211,238,.22); }
.hero-orbit i { position:absolute; width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 12px var(--cyan); }
.hero-orbit i:nth-child(1){top:10px;left:32px}.hero-orbit i:nth-child(2){bottom:15px;right:24px;background:var(--violet)}.hero-orbit i:nth-child(3){top:65px;right:-25px;width:5px;height:5px}
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:16px 0; }
.metric-card { display:flex; align-items:center; gap:15px; min-height:116px; padding:19px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(145deg,var(--panel),rgba(14,18,27,.88)); }
.metric-icon { flex:none; width:42px; height:42px; display:grid; place-items:center; border-radius:11px; font-size:20px; background:var(--cyan-soft); color:var(--cyan); }
.metric-icon.violet { color:var(--violet); background:rgba(155,135,245,.11); }.metric-icon.green{color:var(--green);background:rgba(67,230,160,.1)}.metric-icon.orange{color:var(--orange);background:rgba(245,168,91,.1)}
.metric-card small,.metric-card strong,.metric-card span { display:block; }
.metric-card small { color:#687386; font-size:8px; font-weight:800; letter-spacing:.12em; }
.metric-card strong { margin:5px 0 3px; font-size:25px; letter-spacing:-.04em; }
.metric-card span { color:#657083; font-size:10px; }.metric-card em{color:var(--green);font-style:normal}
.dashboard-grid { display:grid; grid-template-columns:1.3fr 1fr; gap:16px; }
.panel { border:1px solid var(--line); border-radius:15px; background:linear-gradient(145deg,var(--panel),rgba(13,17,25,.94)); }
.gateway-panel,.distribution-panel,.api-flow,.management-api-panel { padding:22px; }
.panel-heading { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:17px; }
.panel-heading h3 { margin:0; font-size:15px; }.panel-heading .eyebrow{font-size:8px;margin-bottom:4px}
.health-badge { padding:5px 8px; border:1px solid rgba(67,230,160,.18); border-radius:14px; color:var(--green); background:rgba(67,230,160,.06); font-size:9px; font-weight:700; }
.service-row { display:flex; align-items:center; gap:12px; padding:12px 0; border-top:1px solid var(--line); }
.service-row .status-dot { margin-left:auto; }.service-row strong,.service-row small{display:block}.service-row strong{font-family:ui-monospace,monospace;font-size:11px}.service-row small{margin-top:3px;color:#5f6a7c;font-size:9px}
.service-protocol { width:34px; height:30px; display:grid; place-items:center; border-radius:8px; color:var(--cyan); background:var(--cyan-soft); font-size:9px; font-weight:900; }
.gateway-panel>.button { margin-top:15px; }
.donut-wrap { min-height:156px; display:flex; align-items:center; justify-content:center; gap:30px; }
.donut { --online-angle:0deg; width:122px; height:122px; display:flex; flex-direction:column; align-items:center; justify-content:center; position:relative; border-radius:50%; background:conic-gradient(var(--green) 0 var(--online-angle),#232a36 var(--online-angle) 360deg); }
.donut::after { content:""; position:absolute; inset:9px; border-radius:50%; background:#10151e; }.donut strong,.donut small{position:relative;z-index:1}.donut strong{font-size:24px}.donut small{margin-top:2px;color:#647084;font-size:8px;letter-spacing:.12em}
.legend { display:flex; flex-direction:column; gap:12px; min-width:125px; }.legend span{display:flex;align-items:center;gap:8px;color:#7f899b;font-size:10px}.legend i{width:7px;height:7px;border-radius:2px}.legend b{margin-left:auto;color:#dce0e8}.legend-online{background:var(--green)}.legend-offline{background:var(--red)}.legend-unchecked{background:#4e5869}
.section-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:18px; }.section-copy{margin:0;color:var(--muted);font-size:12px}.toolbar-actions{display:flex;gap:9px;flex-wrap:wrap}.toolbar-actions .button b{display:inline-grid;place-items:center;min-width:19px;height:19px;margin-left:4px;padding:0 5px;border-radius:10px;background:rgba(255,255,255,.09);font-size:9px}
.check-progress{margin:-3px 0 14px;padding:14px 16px;border:1px solid rgba(34,211,238,.19);border-radius:12px;background:linear-gradient(90deg,rgba(34,211,238,.07),rgba(155,135,245,.035))}.check-progress.check-complete{border-color:rgba(67,230,160,.2);background:rgba(67,230,160,.045)}.check-progress.check-failed{border-color:rgba(255,107,122,.24);background:rgba(255,107,122,.045)}.check-progress-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.check-progress-head strong{font-size:12px}.check-progress-head span{margin-left:9px;color:var(--muted);font-size:10px}.check-results{display:flex;align-items:center;gap:16px}.check-results span{display:inline-flex;align-items:center;gap:6px;margin:0}.check-results .online-text b{color:var(--green)}.check-results .offline-text b{color:var(--red)}.progress-track{height:5px;margin-top:11px;overflow:hidden;border-radius:10px;background:rgba(255,255,255,.07)}.progress-track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--cyan),var(--green));transition:width .25s ease}.check-progress .form-error{min-height:0;margin:8px 0 0}
.filter-bar { display:flex; gap:9px; padding:12px; border:1px solid var(--line); border-bottom:0; border-radius:13px 13px 0 0; background:rgba(17,22,32,.82); }.filter-bar input,.filter-bar select{width:auto;margin:0;padding:9px 11px;font-size:11px}.filter-bar .search-input{min-width:250px;margin-right:auto}
.table-panel { overflow:auto; border:1px solid var(--line); border-radius:0 0 13px 13px; background:rgba(14,18,27,.82); }
table { width:100%; border-collapse:collapse; white-space:nowrap; }th,td{padding:14px 15px;border-bottom:1px solid var(--line);font-size:11px;text-align:left}th{color:#667185;background:rgba(255,255,255,.018);font-size:8px;letter-spacing:.1em;text-transform:uppercase}td{color:#bdc4d0}tbody tr:hover{background:rgba(255,255,255,.018)}tbody tr:last-child td{border-bottom:0}.select-column{width:42px;padding-right:4px!important;text-align:center}.table-check{width:15px;height:15px;margin:0;accent-color:var(--cyan);cursor:pointer}
.status-cell { display:inline-flex; align-items:center; gap:7px; text-transform:capitalize; }.protocol-badge,.group-badge,.state-badge{display:inline-flex;padding:5px 8px;border-radius:6px;background:rgba(34,211,238,.08);color:var(--cyan);font-size:9px;font-weight:750;text-transform:uppercase}.group-badge{color:#aeb6c4;background:rgba(255,255,255,.055);text-transform:none}.state-badge.active{color:var(--green);background:rgba(67,230,160,.08)}.state-badge.disabled,.state-badge.expired{color:var(--red);background:rgba(255,107,122,.08)}
.proxy-address { display:block;color:#eef1f6;font-family:ui-monospace,monospace;font-size:11px}.proxy-name{display:block;margin-top:3px;color:#616d80;font-size:9px}.muted{color:#5d687a}.row-actions{display:flex;justify-content:flex-end;gap:5px}.row-button{width:29px;height:29px;border:1px solid var(--line);border-radius:7px;background:rgba(255,255,255,.025);color:#8993a5;cursor:pointer}.row-button:hover{color:var(--cyan);border-color:rgba(34,211,238,.3)}.row-button.danger:hover{color:var(--red);border-color:rgba(255,107,122,.3)}.row-button-check{display:inline-flex;align-items:center;gap:5px;width:auto;padding:0 9px}.row-button-check span{font-size:9px}
.empty-state { padding:70px 20px; color:#657084; text-align:center; }.empty-state div{font-size:34px;color:#3f4959}.empty-state h3{margin:12px 0 6px;color:#aab2c0;font-size:14px}.empty-state p{margin:0;font-size:11px}
.connection-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:15px; }.endpoint-card{padding:23px}.endpoint-card h3{margin:17px 0 9px;font-size:17px}.endpoint-card p{min-height:56px;margin:0;color:var(--muted);font-size:11px;line-height:1.6}.protocol-label{display:inline-flex;padding:5px 8px;border-radius:6px;color:var(--green);background:rgba(67,230,160,.08);font-size:8px;font-weight:850;letter-spacing:.12em}.cyan-label{color:var(--cyan);background:var(--cyan-soft)}.violet-label{color:var(--violet);background:rgba(155,135,245,.1)}.orange-label{color:var(--orange);background:rgba(245,168,91,.1)}
.code-field { display:flex; align-items:center; margin-top:20px; overflow:hidden; border:1px solid var(--line); border-radius:9px; background:#090d14; }.code-field code{overflow:hidden;flex:1;padding:11px;color:#b8c0cd;font-size:10px;text-overflow:ellipsis}.code-field button{align-self:stretch;border:0;border-left:1px solid var(--line);background:rgba(255,255,255,.03);color:#788396;font-size:9px;cursor:pointer}
.api-flow,.management-api-panel{margin-top:16px}.panel-copy{margin:7px 0 0;color:var(--muted);font-size:10px;font-weight:400}.api-key-list{display:grid;gap:8px}.api-key-row{display:flex;align-items:center;gap:14px;padding:12px 13px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.018)}.api-key-row div{flex:1}.api-key-row strong,.api-key-row small{display:block}.api-key-row strong{font-size:11px}.api-key-row small{margin-top:4px;color:#667185;font-family:ui-monospace,monospace;font-size:9px}.empty-inline{padding:18px;border:1px dashed var(--line-strong);border-radius:10px;color:#667185;font-size:10px;text-align:center}.flow-list{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:0;margin:0;list-style:none}.flow-list li{display:flex;gap:10px;padding:15px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.018)}.flow-list b{flex:none;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;color:var(--cyan);background:var(--cyan-soft);font-size:9px}.flow-list strong,.flow-list small{display:block}.flow-list strong{font-family:ui-monospace,monospace;font-size:10px}.flow-list small{margin-top:5px;color:#697487;font-size:9px;line-height:1.45}.audit-copy{margin-bottom:18px}
dialog { width:min(610px,calc(100vw - 24px)); max-height:calc(100vh - 30px); padding:0; color:var(--text); border:1px solid var(--line-strong); border-radius:18px; background:#111620; box-shadow:0 35px 100px rgba(0,0,0,.65); }dialog::backdrop{background:rgba(2,4,8,.77);backdrop-filter:blur(5px)}.dialog-card{padding:26px;overflow:auto}.dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px}.dialog-heading h2{margin:0;font-size:21px}.dialog-close{width:31px;height:31px;border:1px solid var(--line);border-radius:8px;background:transparent;color:#7d8798;font-size:21px;cursor:pointer}.dialog-copy{margin:0 0 20px;color:var(--muted);font-size:11px;line-height:1.6}.dialog-copy code{color:var(--cyan)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}fieldset{display:flex;gap:22px;margin:0 0 16px;padding:14px;border:1px solid var(--line);border-radius:10px}legend{padding:0 6px;color:#778294;font-size:10px}.checkbox-label{display:flex;flex-direction:row;align-items:center;gap:8px;margin:0;color:#9da6b5;font-size:11px}.checkbox-label input{width:15px;height:15px;margin:0;accent-color:var(--cyan)}.enabled-check{margin:8px 0 18px}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.import-dialog{width:min(850px,calc(100vw - 24px))}.upload-dropzone{display:flex;align-items:center;gap:14px;margin:0 0 16px;padding:16px;border:1px dashed rgba(34,211,238,.3);border-radius:12px;background:rgba(34,211,238,.035);cursor:pointer;transition:.2s border,.2s background}.upload-dropzone:hover,.upload-dropzone.dragging{border-color:var(--cyan);background:rgba(34,211,238,.075)}.upload-dropzone.has-file{border-style:solid;border-color:rgba(67,230,160,.3);background:rgba(67,230,160,.04)}.upload-icon{flex:none;width:39px;height:39px;display:grid;place-items:center;border-radius:10px;color:var(--cyan);background:var(--cyan-soft);font-size:20px;font-weight:800}.upload-dropzone>div:nth-child(2){min-width:0;flex:1}.upload-dropzone strong,.upload-dropzone span{display:block}.upload-dropzone strong{font-size:11px}.upload-dropzone span{overflow:hidden;margin-top:4px;color:#6f7a8d;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.import-settings{margin-top:4px}.textarea-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:8px}.textarea-heading label{margin:0}.text-button{padding:0;border:0;color:var(--cyan);background:transparent;font-size:10px;font-weight:700;cursor:pointer}.text-button:disabled{opacity:.5}.import-preview{margin-top:14px;overflow:hidden;border:1px solid var(--line);border-radius:11px;background:rgba(5,8,13,.36)}.preview-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px 14px;border-bottom:1px solid var(--line)}.preview-heading strong,.preview-heading span{display:block}.preview-heading strong{font-size:11px}.preview-heading>div:first-child span{margin-top:3px;color:#637084;font-size:9px}.preview-metrics{display:flex;align-items:center;gap:8px}.preview-metrics span{padding:5px 8px;border-radius:12px;color:#8190a3;background:rgba(255,255,255,.04);font-size:9px}.preview-metrics b{color:var(--green)}.preview-metrics .metric-error b{color:var(--red)}.preview-table{max-height:205px;overflow:auto}.preview-table th,.preview-table td{padding:10px 13px}.import-error-block{max-height:145px;overflow:auto;padding:12px 14px;border-top:1px solid rgba(255,107,122,.16);background:rgba(255,107,122,.035)}.import-error-block>strong{color:#ff8895;font-size:10px}.import-error-block ul{margin:8px 0 0;padding-left:18px;color:#a7767d;font-size:9px;line-height:1.6}.import-error-block code{margin-left:5px;color:#697487}.check-after-import{margin-top:14px}.format-help{margin:12px 0 0;color:#697487;font-size:9px;line-height:1.6}.format-help code{color:#9ba7b8}
.secret-warning{padding:12px;border:1px solid rgba(245,168,91,.25);border-radius:9px;color:#eab779;background:rgba(245,168,91,.07);font-size:11px;line-height:1.5}.secret-output{display:flex;gap:8px}.secret-output input{font-family:ui-monospace,monospace}.secret-output .button{flex:none}.toast-stack { position:fixed; right:20px; bottom:20px; z-index:200; display:flex; flex-direction:column; gap:9px; }.toast{min-width:280px;max-width:410px;padding:13px 15px;border:1px solid var(--line-strong);border-left:3px solid var(--green);border-radius:10px;background:#171d28;box-shadow:0 18px 45px rgba(0,0,0,.4);font-size:11px}.toast.error{border-left-color:var(--red)}
@media (max-width:1100px){.metric-grid{grid-template-columns:repeat(2,1fr)}.connection-grid{grid-template-columns:1fr}.flow-list{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.sidebar{transform:translateX(-100%);transition:.25s transform}.sidebar.open{transform:translateX(0);box-shadow:20px 0 60px rgba(0,0,0,.5)}.main-content{margin-left:0}.menu-button{display:grid}.topbar{height:72px;padding:0 16px}.topbar-right .live-pill{display:none}.view{padding:20px 14px 35px}.hero-panel{padding:27px 23px;min-height:190px}.hero-panel h3{font-size:24px}.hero-orbit{display:none}.metric-grid{grid-template-columns:1fr 1fr}.metric-card{min-height:105px;padding:14px}.dashboard-grid{grid-template-columns:1fr}.section-toolbar{align-items:flex-start;flex-direction:column}.toolbar-actions{width:100%}.toolbar-actions .button{flex:1;min-width:145px}.check-progress-head,.preview-heading{align-items:flex-start;flex-direction:column}.check-results{width:100%;justify-content:space-between}.filter-bar{flex-wrap:wrap}.filter-bar .search-input{width:100%;min-width:0}.filter-bar select{flex:1}.form-row{grid-template-columns:1fr}.flow-list{grid-template-columns:1fr}.admin-chip div{display:none}.upload-dropzone{align-items:flex-start;flex-wrap:wrap}.upload-dropzone .button{width:100%}.preview-metrics{width:100%;justify-content:space-between}.dialog-card{padding:21px 17px}}
@media (max-width:470px){.metric-grid{grid-template-columns:1fr}.login-card{padding:30px 24px}.topbar-right{gap:8px}}