:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f5f7fb;background:#080a0f;font-synthesis:none}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0}body{overflow:hidden;background:radial-gradient(circle at 50% -20%,#1c2c47 0,transparent 45%),#080a0f}button,input,textarea{font:inherit}button{color:inherit}.topbar{position:relative;z-index:5;display:flex;min-height:68px;align-items:center;gap:24px;padding:10px 18px;border-bottom:1px solid #232733;background:#0a0c12f0;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.brand{display:flex;min-width:220px;align-items:center;gap:11px}.brand-mark{display:grid;width:38px;height:38px;place-items:center;border-radius:11px;background:linear-gradient(140deg,#87f3c6,#5d85ff);color:#07100d;font-weight:900}.brand strong,.brand span{display:block}.status{margin-top:2px;color:#89909f;font-size:12px}.status[data-state=connected]{color:#7de5b8}.status[data-state=error]{color:#ff958d}.transport{display:flex;min-width:0;align-items:center;gap:8px;color:#a6adba;font-size:13px}.transport-dot{width:8px;height:8px;flex:none;border-radius:50%;background:#555d6d}.transport-dot.active{background:#69dca9;box-shadow:0 0 0 4px #69dca91f}.toolbar{display:flex;margin-left:auto;gap:8px}.button{min-height:38px;padding:0 14px;border:1px solid transparent;border-radius:9px;cursor:pointer;font-weight:650;transition:background .15s,border-color .15s,opacity .15s}.button:disabled{cursor:not-allowed;opacity:.38}.button.primary{background:#78e6b7;color:#07110d}.button.primary:hover:not(:disabled){background:#96efc8}.button.subtle{border-color:#303644;background:#171a22}.button.subtle:hover:not(:disabled){border-color:#495162;background:#20242e}.button.danger{border-color:#4a3032;background:#251719;color:#ffaaa4}main{height:calc(100% - 68px)}.setup-card{width:min(620px,calc(100% - 32px));max-height:calc(100vh - 104px);margin:36px auto;padding:32px;overflow:auto;border:1px solid #292f3c;border-radius:18px;background:#12151de5;box-shadow:0 28px 90px #0000005c}.eyebrow{margin-bottom:8px;color:#78e6b7;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}h1{margin:0;font-size:clamp(28px,5vw,40px);letter-spacing:-.035em}.lede{max-width:54ch;margin:12px 0 26px;color:#a5acba;line-height:1.55}label{display:block;margin-bottom:8px;color:#d9dde6;font-size:13px;font-weight:700}input,textarea{width:100%;border:1px solid #343a48;border-radius:10px;outline:none;background:#0e1117;color:#f5f7fb}input{height:44px;padding:0 12px}textarea{padding:11px 12px;resize:vertical;line-height:1.45}input:focus,textarea:focus{border-color:#68dbaa;box-shadow:0 0 0 3px #68dbaa1f}.hint{margin:7px 0 20px;color:#818998;font-size:12px}.hint.warning{color:#c9ae75}.field-grid{display:grid;grid-template-columns:1fr 140px;gap:14px}.option-row{display:flex;gap:24px;margin:20px 0}.check{display:flex;align-items:center;gap:8px;margin:0;cursor:pointer;font-weight:550}.check input{width:16px;height:16px;accent-color:#78e6b7}.error{margin-bottom:15px;padding:11px 13px;border:1px solid #5c3436;border-radius:9px;background:#281719;color:#ffaaa4;font-size:13px;line-height:1.4}#connect{width:100%;min-height:46px}.viewer-shell{position:relative;width:100%;height:100%;overflow:hidden;background:#111318}.screen{width:100%;height:100%}.empty-state{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;color:#a3aab7}[hidden]{display:none!important}.empty-state strong{color:#eef1f7}.spinner{width:28px;height:28px;margin-bottom:8px;border:3px solid #343a47;border-top-color:#78e6b7;border-radius:50%;animation:spin .85s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}dialog{width:min(520px,calc(100% - 32px));padding:0;border:1px solid #353b49;border-radius:14px;background:#151820;color:#f5f7fb;box-shadow:0 30px 90px #000a}dialog::backdrop{background:#000000a6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}dialog form{padding:22px}dialog p{color:#9ba3b1}.dialog-head,.dialog-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}.dialog-head h2{margin:0;font-size:20px}.dialog-actions{justify-content:flex-end;margin-top:16px}.icon-button{border:0;background:transparent;color:#a9afbb;cursor:pointer;font-size:24px}@media(max-width:800px){.topbar{gap:12px}.brand{min-width:0}.transport{display:none}.button{padding:0 10px}#scale,#clipboard{display:none}}
