:root{--surface-dim: #0b1326;--surface-bright: #31394d;--surface-container-lowest: #060e20;--surface-container-low: #131b2e;--surface-container: #171f33;--surface-container-high: #222a3d;--surface-container-highest: #2d3449;--surface-variant: #2d3449;--on-surface: #dae2fd;--on-surface-variant: #c2c6d6;--outline: #8c909f;--outline-variant: #424754;--primary: #adc6ff;--on-primary: #002e6a;--primary-container: #4d8eff;--secondary: #c0c1ff;--secondary-container: #3131c0;--on-secondary-container: #b0b2ff;--tertiary: #4edea3;--on-tertiary: #003824;--error: #ffb4ab;--on-error: #690005;--error-container: #93000a;--on-error-container: #ffdad6;--danger: #ffb4ab;color:var(--on-surface);background:var(--surface-dim);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;background:var(--surface-dim)}button,input,select{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;display:grid;grid-template-columns:240px 1fr}.sidebar{background:var(--surface-container-low);border-right:1px solid var(--outline-variant);color:var(--on-surface);padding:24px 16px;display:flex;flex-direction:column;gap:32px}.brand{display:flex;gap:10px;align-items:center;padding:4px 8px}.brand svg{color:var(--primary)}.brand strong,.brand span{display:block}.brand strong{font-size:18px;font-weight:600;letter-spacing:-.01em}.brand span{color:var(--on-surface-variant);font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px;letter-spacing:.02em;margin-top:2px}.nav-list{display:grid;gap:4px}.nav-item{min-height:44px;border:1px solid transparent;background:transparent;color:var(--on-surface-variant);display:inline-flex;align-items:center;gap:12px;border-radius:8px;padding:0 16px;text-align:left;font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px;letter-spacing:.02em;transition:background-color .15s ease,color .15s ease}.nav-item:hover{background:var(--surface-variant);color:var(--on-surface)}.nav-item.active{background:var(--secondary-container);color:var(--on-secondary-container);border-color:transparent}.workspace{min-width:0;padding:24px;display:flex;flex-direction:column;gap:16px;background:var(--surface-dim)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px;border-bottom:1px solid var(--outline-variant);padding-bottom:16px}.eyebrow{margin:0 0 4px;color:var(--on-surface-variant);font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px;letter-spacing:.04em;text-transform:uppercase;font-weight:500}h1,h2,p{margin:0}h1{font-size:30px;line-height:36px;letter-spacing:-.02em;font-weight:600;color:var(--on-surface)}h2{font-size:18px;line-height:24px;font-weight:500;color:var(--on-surface)}.connection-panel{display:flex;align-items:end;gap:8px;flex-wrap:wrap;justify-content:flex-end}label{display:grid;gap:6px;color:var(--on-surface-variant);font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px;letter-spacing:.02em;font-weight:500}input,select{min-height:38px;border:1px solid var(--outline-variant);background:var(--surface-container-low);color:var(--on-surface);border-radius:6px;padding:0 10px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}input::placeholder{color:var(--on-surface-variant);opacity:.6}input:focus,select:focus{border-color:var(--primary);box-shadow:0 0 0 2px #adc6ff40}.connection-panel input{width:min(34vw,280px)}.view-grid,.stack{display:grid;gap:16px}.metric-grid{display:grid;grid-template-columns:repeat(6,minmax(130px,1fr));gap:16px}.metric,.panel{background:#131b2e66;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--outline-variant);border-radius:8px;box-shadow:0 4px 4px #0003}.metric{min-height:86px;padding:16px;display:grid;gap:6px;align-content:start}.metric svg{color:var(--primary)}.metric span{color:var(--on-surface-variant);font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px;letter-spacing:.02em;font-weight:500}.metric strong{min-width:0;font-size:22px;font-weight:600;color:var(--on-surface);overflow-wrap:anywhere}.panel{min-width:0;padding:24px}.wide{grid-column:1 / -1}.panel-header{display:flex;align-items:center;justify-content:space-between;min-height:32px;margin-bottom:16px;padding-bottom:8px;border-bottom:1px solid var(--outline-variant)}.panel-header>div{display:flex;gap:8px;align-items:center}.panel-header svg{color:var(--primary)}.section-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px}.primary-action{border:1px solid rgba(173,198,255,.2);background:#adc6ff1a;color:var(--primary);border-radius:999px;min-height:36px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 16px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px;letter-spacing:.02em;font-weight:500;transition:background-color .15s ease,color .15s ease}.primary-action:hover{background:#adc6ff33;color:var(--on-surface)}.primary-action:disabled{opacity:.5;cursor:not-allowed}.icon-button{border:1px solid var(--outline-variant);background:var(--surface-container-low);color:var(--on-surface-variant);border-radius:6px;min-height:36px;width:36px;padding:0;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;transition:border-color .15s ease,color .15s ease}.icon-button:hover{border-color:var(--primary);color:var(--primary)}.table-wrap{width:100%;overflow-x:auto}table{width:100%;min-width:760px;border-collapse:collapse}th,td{border-bottom:1px solid var(--outline-variant);padding:12px 16px;text-align:left;vertical-align:top;font-size:13px;overflow-wrap:anywhere}tbody td{font-family:JetBrains Mono,ui-monospace,monospace;font-size:13px;line-height:20px;color:var(--on-surface-variant)}tbody td strong,tbody td:first-child{color:var(--on-surface)}th{color:var(--on-surface-variant);background:#131b2e80;font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px;letter-spacing:.04em;font-weight:500;text-transform:uppercase}tbody tr{transition:background-color .2s ease}tbody tr:hover{background:var(--surface-variant)}.metrics-box{margin:0;min-height:180px;max-height:320px;overflow:auto;background:var(--surface-container-lowest);border:1px solid var(--outline-variant);color:var(--on-surface);border-radius:6px;padding:16px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:13px;line-height:20px}.split-view{display:grid;grid-template-columns:minmax(360px,.9fr) minmax(360px,1.1fr);gap:16px;align-items:start}.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.filters input{min-width:150px;flex:1 1 150px}.task-list{display:grid;gap:8px;max-height:620px;overflow:auto}.task-row{min-height:64px;border:1px solid var(--outline-variant);background:var(--surface-container-low);border-radius:6px;padding:12px;display:flex;justify-content:space-between;gap:12px;text-align:left;color:var(--on-surface);transition:border-color .15s ease,background-color .15s ease}.task-row:hover,.task-row.selected{border-color:var(--primary);background:var(--surface-variant)}.task-row span{display:grid;gap:4px;min-width:0}.task-row strong,.task-row small{overflow-wrap:anywhere}.task-row strong{font-family:JetBrains Mono,ui-monospace,monospace;font-size:13px;color:var(--on-surface)}.task-row small{color:var(--on-surface-variant)}.detail-panel{position:sticky;top:18px}.detail-stack{display:grid;gap:16px}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:16px}.text-block{display:grid;gap:6px}.text-block span{color:var(--on-surface-variant);font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px;letter-spacing:.02em;font-weight:500;text-transform:uppercase}.text-block p{min-height:74px;background:var(--surface-container-lowest);border:1px solid var(--outline-variant);border-radius:6px;padding:12px;white-space:pre-wrap;overflow-wrap:anywhere;font-family:JetBrains Mono,ui-monospace,monospace;font-size:13px;line-height:20px;color:var(--on-surface)}.action-strip{display:flex;gap:6px;align-items:center}.action-strip small{color:var(--on-surface-variant)}.pill{display:inline-flex;align-items:center;gap:6px;min-height:24px;border-radius:999px;padding:0 10px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px;letter-spacing:.02em;font-weight:500;border:1px solid transparent}.pill:before{content:"";width:6px;height:6px;border-radius:999px;background:currentColor}.pill.good{background:#4edea31a;color:var(--tertiary);border-color:#4edea333}.pill.muted{background:var(--surface-variant);color:var(--on-surface-variant);border-color:var(--outline-variant)}.loading,.empty,.error-box,.state-banner,.notice{min-height:48px;display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:8px}.empty{justify-content:center;color:var(--on-surface-variant)}.error-box{border:1px solid var(--error-container);background:#93000a33;color:var(--on-error-container)}.state-banner{border:1px solid var(--outline-variant);background:var(--surface-container-low);color:var(--on-surface-variant)}.notice{justify-content:space-between;background:#adc6ff14;border:1px solid rgba(173,198,255,.2);color:var(--on-surface)}.notice button{border:none;background:transparent;color:var(--on-surface-variant);min-height:30px;width:30px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center}.notice button:hover{color:var(--on-surface)}.tool-list{display:grid;gap:4px;max-height:620px;overflow:auto}.tool-card{width:100%;text-align:left;display:flex;align-items:flex-start;gap:12px;padding:12px;border-radius:8px;border:1px solid transparent;background:transparent;color:var(--on-surface);transition:background-color .15s ease,border-color .15s ease}.tool-card:hover,.tool-card.selected{background:var(--surface-variant);border-color:var(--outline-variant)}.tool-card__icon{flex:0 0 auto;width:32px;height:32px;margin-top:2px;border-radius:6px;background:var(--surface-container-high);color:var(--on-surface-variant);display:inline-flex;align-items:center;justify-content:center;transition:color .15s ease}.tool-card:hover .tool-card__icon,.tool-card.selected .tool-card__icon{color:var(--primary)}.tool-card__body{flex:1 1 auto;min-width:0;display:grid;gap:4px}.tool-card__top{display:flex;align-items:center;justify-content:space-between;gap:8px}.tool-card__name{font-family:JetBrains Mono,ui-monospace,monospace;font-size:12px;font-weight:700;color:var(--on-surface);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tool-card__type{margin:0;font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--on-surface-variant)}.tool-card__desc{margin:0;font-size:13px;line-height:18px;color:var(--on-surface-variant);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tool-badge{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:2px 8px;border-radius:999px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;letter-spacing:.02em;font-weight:500}.tool-badge__dot{width:6px;height:6px;border-radius:999px;background:currentColor}.tool-badge.active{background:#4edea31a;color:var(--tertiary)}.tool-badge.inactive{background:#ffb4ab1a;color:var(--error)}.tool-empty{flex:1 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;padding:32px;min-height:280px}.tool-empty__icon{width:64px;height:64px;border-radius:999px;background:var(--surface-container);border:1px solid var(--outline-variant);display:inline-flex;align-items:center;justify-content:center;color:var(--on-surface-variant);margin-bottom:8px}.tool-empty h4{margin:0;font-size:18px;font-weight:500;color:var(--on-surface)}.tool-empty p{max-width:24rem;font-size:14px;line-height:20px;color:var(--on-surface-variant)}.cell-endpoint{color:var(--secondary)!important}.transport-pill{display:inline-flex;align-items:center;padding:2px 8px;border-radius:6px;background:var(--surface-container);border:1px solid var(--outline-variant);font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;color:var(--on-surface)}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1120px){.metric-grid{grid-template-columns:repeat(3,minmax(150px,1fr))}.split-view{grid-template-columns:1fr}.detail-panel{position:static}}@media(max-width:760px){.app-shell{grid-template-columns:1fr}.sidebar{position:sticky;top:0;z-index:10;padding:12px;gap:12px}.brand{display:none}.nav-list{display:flex;overflow-x:auto}.nav-item{min-width:max-content}.workspace{padding:12px}.topbar{align-items:stretch;flex-direction:column}.connection-panel{justify-content:stretch}.connection-panel label,.connection-panel input{width:100%}.metric-grid,.detail-grid{grid-template-columns:1fr}.section-toolbar{align-items:stretch;flex-direction:column}}
