:root{--primary: #0b57d0;--on-primary: #ffffff;--primary-container: #d3e3fd;--on-primary-container: #041e49;--secondary-container: #d5e3ff;--on-secondary-container: #001b39;--surface: #ffffff;--surface-dim: #eef1f4;--surface-variant: #e7e1ec;--on-surface: #1a1a1a;--on-surface-variant: #444746;--outline: #74777a;--outline-variant: #c5c8cb;--error: #b3261e;--error-container: #f2dede;--on-error-container: #410002;--success: #1e8e3e;--success-container: #d9f4e3;--on-success-container: #06381c;--warning: #8a5300;--warning-container: #ffdfa1;--on-warning-container: #2b1500;--disabled: rgba(28, 27, 31, .12);--on-disabled: rgba(28, 27, 31, .38);--radius: 2px;--radius-sm: 2px;--radius-lg: 4px;--font: "Inter", Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--ease: cubic-bezier(.2, 0, 0, 1)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);background:var(--surface-dim);color:var(--on-surface);-webkit-font-smoothing:antialiased;font-size:14px}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;position:relative;overflow:hidden}input,textarea{font-family:inherit}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--outline-variant);border-radius:8px}.ripple-ink{position:absolute;border-radius:50%;background:#00000029;pointer-events:none;transform:scale(0);opacity:1;animation:ripple .55s var(--ease)}@keyframes ripple{to{transform:scale(1);opacity:0}}.chip:not(:disabled):active,.btn:not(:disabled):active,.icon-btn:not(:disabled):active,.nav-item:active,.card:active{background-image:linear-gradient(#0000000f,#0000000f)}.app{display:flex;height:100%}.sidebar{width:244px;min-width:244px;background:var(--surface);border-right:1px solid var(--outline-variant);padding:18px 14px;display:flex;flex-direction:column;gap:4px}.main{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden}.brand{display:flex;align-items:center;gap:11px;padding:6px 8px 18px}.brand-mark{width:34px;height:34px;border-radius:var(--radius);background:var(--primary);display:grid;place-items:center;color:var(--on-primary);flex-shrink:0}.brand-name{font-weight:600;font-size:16px;letter-spacing:-.01em}.brand-sub{font-size:11px;color:var(--on-surface-variant);font-weight:500}.nav{display:flex;flex-direction:column;gap:2px}.nav-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--radius);color:var(--on-surface-variant);font-weight:500;font-size:13.5px;text-align:left;width:100%;transition:background .14s var(--ease),color .14s var(--ease)}.nav-item:hover{background:var(--surface-dim)}.nav-item.active{background:var(--primary-container);color:var(--on-primary-container);font-weight:600}.nav-item .tag{margin-left:auto;background:var(--primary-container);color:var(--on-primary-container);font-size:11px;font-weight:600;padding:1px 8px;border-radius:var(--radius)}.nav-item.active .tag{background:var(--primary);color:var(--on-primary)}.sidebar-foot{margin-top:auto;padding:10px 12px;background:var(--surface-dim);border-radius:var(--radius);font-size:12px;color:var(--on-surface-variant);display:flex;align-items:center;gap:10px}.conn-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;background:var(--error)}.conn-dot.on{background:var(--success)}.sidebar-foot b{color:var(--on-surface);font-weight:600}.appbar{display:flex;align-items:center;gap:20px;padding:14px 26px;background:var(--surface);border-bottom:1px solid var(--outline-variant)}.appbar-title h1{font-size:20px;font-weight:600;letter-spacing:-.01em;margin:0}.appbar-sub{font-size:12.5px;color:var(--on-surface-variant)}.appbar-actions{margin-left:auto;display:flex;align-items:center;gap:12px}.search{display:flex;align-items:center;gap:8px;background:var(--surface-dim);border:1px solid transparent;border-radius:var(--radius);padding:9px 14px;width:240px;color:var(--on-surface-variant);transition:background .14s var(--ease),border-color .14s var(--ease)}.search:focus-within{background:var(--surface);border-color:var(--primary)}.search input{border:none;outline:none;background:transparent;font-size:13.5px;color:var(--on-surface);width:100%}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 18px;border-radius:var(--radius);font-weight:600;font-size:13px;transition:background .14s var(--ease),color .14s var(--ease),box-shadow .14s var(--ease)}.btn:disabled{background:var(--disabled);color:var(--on-disabled);cursor:not-allowed}.btn.filled{background:var(--primary);color:var(--on-primary)}.btn.filled:hover:not(:disabled){background:#0b52b9}.btn.tonal{background:var(--secondary-container);color:var(--on-secondary-container)}.btn.tonal:hover:not(:disabled){background:#c6d8ff}.btn.text{color:var(--primary)}.btn.text:hover:not(:disabled){background:#0b57d014}.btn.error{background:var(--error-container);color:var(--on-error-container)}.btn.error:hover:not(:disabled){background:#eacaca}.content{padding:22px 26px 32px;overflow-y:auto}.grid-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.grid-head .title{font-size:13px;font-weight:600;color:var(--on-surface-variant)}.grid-head .title b{color:var(--on-surface)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}.grid.empty-hint{display:block;text-align:center;color:var(--on-surface-variant);padding:60px 0;font-size:13.5px}.card{position:relative;overflow:hidden;background:var(--surface);border:1px solid var(--outline-variant);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;gap:12px;cursor:pointer;transition:border-color .14s var(--ease),box-shadow .14s var(--ease)}.card:hover{border-color:var(--primary)}.card.selected,.card.taken{border-color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary)}.card-head{display:flex;align-items:center;gap:11px}.avatar{width:38px;height:38px;border-radius:var(--radius);display:grid;place-items:center;font-weight:600;font-size:15px;color:#fff;flex-shrink:0}.card-id{min-width:0;flex:1}.card-title{font-weight:600;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-sub{color:var(--on-surface-variant);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pill{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;padding:3px 8px;border-radius:var(--radius);flex-shrink:0}.pill .dot{width:6px;height:6px;border-radius:50%}.pill.online{background:var(--success-container);color:var(--on-success-container)}.pill.online .dot{background:var(--success)}.pill.locked{background:var(--warning-container);color:var(--on-warning-container)}.pill.locked .dot{background:var(--warning)}.pill.offline{background:var(--surface-variant);color:var(--on-surface-variant)}.pill.offline .dot{background:var(--outline)}.screen-preview{position:relative;aspect-ratio:16 / 10;border-radius:var(--radius);background:var(--surface-dim);border:1px solid var(--outline-variant);overflow:hidden}.screen-preview img{width:100%;height:100%;object-fit:cover;display:block}.empty-preview{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:var(--on-surface-variant);font-size:11.5px}.live-badge{position:absolute;top:6px;left:6px;background:var(--on-surface);color:#fff;font-size:9.5px;font-weight:700;padding:3px 7px;border-radius:var(--radius);display:flex;align-items:center;gap:4px}.live-badge .dot{width:6px;height:6px;border-radius:50%;background:var(--primary)}.actions{display:flex;gap:6px}.icon-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:5px;padding:8px 0;border-radius:var(--radius);background:var(--surface-variant);font-weight:600;font-size:12px;color:var(--on-surface-variant)}.icon-btn:disabled{background:var(--disabled);color:var(--on-disabled);cursor:not-allowed}.icon-btn:hover:not(:disabled){background:#dcd8e0}.icon-btn.accent,.icon-btn.filled{background:var(--primary);color:var(--on-primary)}.icon-btn.accent:hover:not(:disabled),.icon-btn.filled:hover:not(:disabled){background:#0b52b9}.icon-btn.tonal{background:var(--secondary-container);color:var(--on-secondary-container)}.icon-btn.tonal:hover:not(:disabled){background:#c6d8ff}.icon-btn.error{background:var(--error-container);color:var(--on-error-container)}.icon-btn.error:hover:not(:disabled){background:#eacaca}.icon-btn.small,.micro-btn{flex:0 0 auto;padding:7px 9px}.selbar{position:fixed;bottom:22px;left:50%;transform:translate(-50%);background:var(--surface);border:1px solid var(--outline-variant);border-radius:var(--radius);padding:8px 10px;display:flex;gap:6px;align-items:center;z-index:60}.selbar .count{font-weight:600;font-size:13px;padding:0 8px;color:var(--on-surface)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:grid;place-items:center;z-index:100;animation:fade .14s var(--ease)}@keyframes fade{0%{opacity:0}}.modal{width:440px;max-width:92vw;background:var(--surface);border:1px solid var(--outline-variant);border-radius:var(--radius-lg);padding:24px;animation:pop .16s var(--ease)}@keyframes pop{0%{transform:scale(.98);opacity:0}}.modal h3{margin:0 0 8px;font-size:18px;font-weight:600}.modal .muted{color:var(--on-surface-variant);margin:0 0 18px;font-size:13px;line-height:1.5}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.field label{font-size:12px;font-weight:600;color:var(--on-surface-variant)}.text-input,.textarea{width:100%;padding:11px 13px;border:1px solid var(--outline);border-radius:var(--radius);font-size:13.5px;background:var(--surface);outline:none;transition:border-color .14s var(--ease),box-shadow .14s var(--ease);resize:vertical}.text-input:focus,.textarea:focus{border-color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary)}.error-text{margin:0 0 6px;font-size:12.5px;color:var(--error)}.provision-box{margin-top:6px}.cmd-block{display:flex;gap:8px;align-items:center;background:var(--surface-container-low);background:#141414;color:#e6e6e6;border:1px solid var(--outline);border-radius:var(--radius);padding:10px 12px}.cmd-block code{flex:1;min-width:0;font-family:ui-monospace,Consolas,monospace;font-size:12px;line-height:1.5;word-break:break-all;white-space:pre-wrap}.modal select.text-input{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;height:42px;padding:0 10px}.takeover{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;background:var(--surface-dim);display:flex;flex-direction:column}.takeover-toolbar{display:flex;align-items:center;gap:14px;padding:12px 20px;background:var(--surface);border-bottom:1px solid var(--outline-variant);color:var(--on-surface)}.takeover-toolbar .meta{color:var(--on-surface-variant);font-size:13px}.takeover-screen{flex:1;display:grid;place-items:center;overflow:hidden;padding:18px}.takeover-screen img{max-width:100%;max-height:100%;border-radius:var(--radius);cursor:crosshair;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.remote-coords{font-size:11px;color:var(--on-surface-variant);font-variant-numeric:tabular-nums}.chat{position:absolute;right:18px;bottom:18px;width:300px;background:var(--surface);border:1px solid var(--outline-variant);border-radius:var(--radius);overflow:hidden}.chat .head{padding:12px 14px;font-weight:600;border-bottom:1px solid var(--outline-variant)}.chat .body{padding:12px;display:flex;gap:8px}.chat-thread{max-height:200px;overflow-y:auto;padding:8px 12px;display:flex;flex-direction:column;gap:8px}.chat-bubble{background:var(--secondary-container);color:var(--on-secondary-container);border-radius:var(--radius);padding:8px 10px;display:flex;flex-direction:column;gap:2px;font-size:13px}.chat-bubble .chat-sender{font-size:11px;font-weight:600;opacity:.75}.toasts{position:fixed;bottom:22px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;z-index:200;width:max-content;max-width:92vw}.toast{background:var(--on-surface);color:#fff;border-radius:var(--radius);padding:12px 18px;font-weight:500;display:flex;align-items:center;gap:10px;animation:slid .16s var(--ease)}.toast .bar{width:3px;align-self:stretch;border-radius:2px}.toast.info .bar{background:var(--primary)}.toast.success .bar{background:#34d072}.toast.warn .bar{background:#ffb84d}.toast.error .bar{background:#ff6b6b}@keyframes slid{0%{transform:translateY(8px);opacity:0}}@media (max-width: 860px){.sidebar{display:none}}.hidden{display:none!important}
