:root{--font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI Variable Display", "Segoe UI", Inter, system-ui, sans-serif;--font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, "Cascadia Mono", "Roboto Mono", monospace;--t-nameplate: 24px;--lh-nameplate: 28px;--tr-nameplate: -.01em;--t-nameplate-fit-1: 21px;--lh-nameplate-fit-1: 25px;--t-nameplate-fit-2: 16px;--lh-nameplate-fit-2: 20px;--t-portal-address: 48px;--lh-portal-address: 52px;--tr-portal-address: -.025em;--t-section: 17px;--lh-section: 22px;--tr-section: -.01em;--t-body: 13px;--lh-body: 18px;--t-caption: 11px;--lh-caption: 15px;--t-label: 11px;--lh-label: 14px;--tr-label: .06em;--t-mono: 13px;--lh-mono: 18px;--t-pairing-code: 32px;--lh-pairing-code: 38px;--tr-pairing-code: .12em;--w-regular: 400;--w-mono: 500;--w-emphasis: 590;--w-semibold: 600;--bg-base: #f5f5f7;--bg-surface: #ffffff;--bg-surface-raised: #ffffff;--bg-inset: #f5f5f7;--bg-hover: rgba(0, 0, 0, .04);--bg-active: rgba(0, 0, 0, .08);--bg-selected: rgba(0, 113, 227, .1);--text-primary: #1d1d1f;--text-secondary: #6e6e73;--text-tertiary: #8e8e93;--text-on-accent: #ffffff;--line: #d2d2d7;--line-strong: #c7c7cc;--accent: #0071e3;--accent-hover: #0077ed;--accent-active: #006acd;--accent-tint: rgba(0, 113, 227, .1);--state-live: #34c759;--state-stale: #ff9500;--state-error: #ff3b30;--state-idle: #c7c7cc;--state-unknown: transparent;--state-unknown-ring: #c7c7cc;--state-stale-tint: rgba(255, 149, 0, .1);--state-error-tint: rgba(255, 59, 48, .1);--shadow-card: none;--shadow-popover: 0 4px 16px rgba(0, 0, 0, .08), 0 0 0 .5px rgba(0, 0, 0, .04);--shadow-modal: 0 16px 48px rgba(0, 0, 0, .16), 0 0 0 .5px rgba(0, 0, 0, .06);--scrim: rgba(0, 0, 0, .2);--scrim-blur: 20px;--r-input: 4px;--r-button: 6px;--r-card: 10px;--r-modal: 12px;--r-pill: 980px;--sp-base: 4px;--sp-card: 16px;--sp-section: 24px;--row-h: 36px;--row-h-caption: 44px;--hairline-inset: 16px;--toggle-off: #e9e9eb;--toggle-knob-shadow: 0 1px 3px rgba(0, 0, 0, .15);--focus-ring: 0 0 0 3px var(--accent-tint);--breathe: 2s}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font-ui);font-size:var(--t-body);line-height:var(--lh-body);background:var(--bg-base);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}.label{font-family:var(--font-ui);font-size:var(--t-label);line-height:var(--lh-label);font-weight:var(--w-semibold);letter-spacing:var(--tr-label);text-transform:uppercase;color:var(--text-secondary)}.caption{font-size:var(--t-caption);line-height:var(--lh-caption);color:var(--text-secondary)}.section-heading{font-size:var(--t-section);line-height:var(--lh-section);font-weight:var(--w-semibold);letter-spacing:var(--tr-section);color:var(--text-primary)}.mono{font-family:var(--font-mono)}.nameplate{font-family:var(--font-ui);font-weight:var(--w-semibold);font-size:var(--t-nameplate);line-height:var(--lh-nameplate);letter-spacing:var(--tr-nameplate);color:var(--text-primary);word-break:normal;overflow-wrap:break-word}.nameplate-fit-1{font-size:var(--t-nameplate-fit-1);line-height:var(--lh-nameplate-fit-1)}.nameplate-fit-2{font-size:var(--t-nameplate-fit-2);line-height:var(--lh-nameplate-fit-2)}.pairing-code{font-family:var(--font-mono);font-size:var(--t-pairing-code);line-height:var(--lh-pairing-code);letter-spacing:var(--tr-pairing-code);font-weight:var(--w-mono);font-variant-numeric:tabular-nums;color:var(--text-primary);margin-right:calc(-1 * var(--tr-pairing-code))}.identifier{font-family:var(--font-mono);font-size:var(--t-mono);line-height:var(--lh-mono);font-weight:var(--w-mono);color:var(--text-primary)}.panel{background:var(--bg-surface);border:1px solid var(--line);border-radius:var(--r-card)}.panel-raised{background:var(--bg-surface-raised);border-radius:var(--r-card);box-shadow:var(--shadow-popover)}.inset{background:var(--bg-inset);border-radius:var(--r-input)}.hairline-b{border-bottom:1px solid var(--line)}.hairline-r{border-right:1px solid var(--line-strong)}.group{background:var(--bg-surface);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden}.group-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:var(--row-h);padding:8px var(--sp-card);position:relative}.group-row-tall{min-height:var(--row-h-caption)}.group-row+.group-row:before{content:"";position:absolute;top:0;left:var(--hairline-inset);right:0;height:1px;background:var(--line)}.group-row:hover{background:var(--bg-hover)}.btn,.btn-primary,.btn-secondary,.btn-plain,.btn-destructive{font-family:var(--font-ui);font-size:var(--t-body);font-weight:var(--w-emphasis);line-height:1;height:32px;padding:0 16px;border-radius:var(--r-button);border:1px solid transparent;cursor:pointer;transition:background .12s,color .12s,border-color .12s}.btn-primary{background:var(--accent);color:var(--text-on-accent)}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-primary:active:not(:disabled){background:var(--accent-active)}.btn-secondary{background:var(--accent-tint);color:var(--accent)}.btn-secondary:hover:not(:disabled){background:var(--bg-selected)}.btn,.btn-plain{background:transparent;color:var(--accent)}.btn:hover:not(:disabled),.btn-plain:hover:not(:disabled){background:var(--bg-hover)}.btn-destructive{background:transparent;color:var(--state-error)}.btn-destructive:hover:not(:disabled){background:var(--bg-hover)}.btn:disabled,.btn-primary:disabled,.btn-secondary:disabled,.btn-plain:disabled,.btn-destructive:disabled{opacity:.4;cursor:not-allowed}.btn-icon{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--text-secondary);cursor:pointer;padding:6px;border-radius:var(--r-input)}.btn-icon:hover{color:var(--text-primary);background:var(--bg-hover)}.input{font-family:var(--font-ui);font-size:var(--t-body);height:28px;padding:0 8px;background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--line);border-radius:var(--r-input);outline:none}.input::placeholder{color:var(--text-tertiary)}.input:focus{border-color:var(--accent);box-shadow:var(--focus-ring)}:where(button,a,input,select,textarea,[tabindex]):focus-visible{outline:none;border-color:var(--accent);box-shadow:var(--focus-ring)}.segmented{display:inline-flex;background:var(--bg-base);border-radius:9px;padding:2px;gap:2px}.segmented-item{font-family:var(--font-ui);font-size:var(--t-body);font-weight:var(--w-emphasis);color:var(--text-primary);background:transparent;border:none;border-radius:7px;padding:4px 12px;cursor:pointer}.segmented-item[aria-selected=true]{background:var(--bg-surface);box-shadow:var(--shadow-popover)}.switch{appearance:none;position:relative;width:38px;height:24px;flex:0 0 38px;border-radius:var(--r-pill);background:var(--toggle-off);border:none;cursor:pointer;transition:background .18s}.switch-lg{width:51px;height:31px;flex:0 0 51px}.switch:after{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:var(--bg-surface);box-shadow:var(--toggle-knob-shadow);transition:transform .18s}.switch-lg:after{width:27px;height:27px}.switch:checked{background:var(--state-live)}.switch:checked:after{transform:translate(14px)}.switch-lg:checked:after{transform:translate(20px)}.switch:disabled{opacity:.4;cursor:not-allowed}.select{font-family:var(--font-ui);font-size:var(--t-body);height:28px;padding:0 24px 0 8px;background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--line);border-radius:var(--r-input);outline:none;cursor:pointer}.wordmark{font-family:var(--font-ui);font-weight:var(--w-semibold);font-size:16px;letter-spacing:var(--tr-section);color:var(--text-primary);-webkit-user-select:none;user-select:none}.wordmark-dot{color:var(--accent)}.lamp{width:8px;height:8px;border-radius:50%;flex:0 0 8px;display:inline-block;box-sizing:border-box}.lamp-sm{width:6px;height:6px;flex:0 0 6px}.lamp-live{background:var(--state-live)}.lamp-stale{background:var(--state-stale)}.lamp-offline{background:var(--state-idle)}.lamp-unknown{background:var(--state-unknown);border:1px solid var(--state-unknown-ring)}.lamp-breathe{animation:breathe var(--breathe) ease-in-out infinite}@keyframes breathe{0%,to{opacity:1}50%{opacity:.45}}@media(prefers-reduced-motion:reduce){.lamp-breathe{animation:none}}.drag-active{border:2px dashed var(--accent);background:var(--accent-tint)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:5px;border:3px solid transparent;background-clip:content-box}::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary);background-clip:content-box}.spin{animation:spin 1.1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spin{animation:none}}[data-surface=portal]{--t-body: 15px;--lh-body: 21px;--t-caption: 12px;--lh-caption: 16px}
