.live-remote{max-width:none!important;padding-inline:clamp(16px,3vw,60px)!important}.live-remote .page-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}.live-remote .page-heading h1{font-size:28px;margin:0}.live-remote .remote-workspace{position:relative;background:var(--bg,#080b10);border-radius:12px;overflow:hidden}.live-remote .remote-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 4px;margin:0}.live-remote .remote-toolbar label,.live-remote .remote-zoom{display:flex;gap:8px;align-items:center}.live-remote button,.live-remote select{font:inherit;font-size:13px;min-height:40px;border:1px solid var(--line,#30343a);border-radius:8px;padding:8px 12px;background:var(--panel,#15191f);color:var(--text,#eee);cursor:pointer}.live-remote button:hover{filter:brightness(1.2)}.live-remote button:focus-visible,.live-remote select:focus-visible,.live-remote textarea:focus-visible,.live-remote .remote-canvas:focus-visible{outline:2px solid var(--accent,#93baff);outline-offset:2px}.live-remote .remote-zoom output{min-width:48px;text-align:center;font-variant-numeric:tabular-nums;font-size:13px}.live-remote .remote-canvas{position:relative;width:100%;height:68dvh;min-height:240px;overflow:hidden;background:#030405;border-radius:8px;touch-action:none;overscroll-behavior:contain;user-select:none;aspect-ratio:auto}.live-remote .remote-canvas[data-mode=pan]{cursor:grab}.live-remote .remote-canvas[data-mode=pan]:active{cursor:grabbing}.live-remote .remote-stage{position:absolute;overflow:hidden;margin:0;min-height:0;pointer-events:none}.live-remote .remote-placeholder{position:absolute;inset:45% 16px auto;text-align:center;color:#a5a9b1;pointer-events:none}.live-remote .remote-statusbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 4px;font-size:12px;color:var(--muted,#a5a9b1)}.live-remote .remote-statusbar button{min-height:30px;padding:4px 10px}.live-remote .remote-options{padding:20px 4px;display:grid;gap:18px}.live-remote .remote-options[hidden]{display:none}.live-remote .remote-shortcuts,.live-remote .remote-function-keys,.live-remote .button-row{display:flex;flex-wrap:wrap;gap:8px}.live-remote .remote-options label{font-size:13px}.live-remote textarea{display:block;width:100%;margin-top:8px;padding:12px;resize:vertical;font:inherit;font-size:16px;background:var(--panel,#15191f);color:var(--text,#eee);border:1px solid var(--line,#30343a);border-radius:8px}.live-remote .remote-help{font-size:12px;max-width:90ch;line-height:1.6;color:var(--muted,#a5a9b1);margin:0}.live-remote .remote-workspace:fullscreen,.live-remote .remote-expanded{background:var(--bg,#080b10);border-radius:0;display:flex;flex-direction:column;height:100dvh;width:100vw}.live-remote .remote-expanded{position:fixed;inset:0;z-index:1000}.live-remote .remote-workspace:fullscreen .remote-canvas,.live-remote .remote-expanded .remote-canvas{flex:1;min-height:100px;height:auto;border-radius:0}.live-remote .remote-workspace:fullscreen .remote-options,.live-remote .remote-expanded .remote-options{position:absolute;right:12px;top:72px;z-index:2;background:var(--bg,#080b10);padding:20px;max-width:600px;width:calc(100% - 24px);max-height:70dvh;overflow:auto;box-shadow:0 12px 60px #0008}.live-remote .remote-idle .remote-toolbar{opacity:0;pointer-events:none}.live-remote .sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0)}
@media(max-width:700px){.live-remote .page-heading h1{font-size:23px}.live-remote .remote-toolbar{gap:8px}.live-remote button,.live-remote select{min-height:44px}.live-remote .remote-canvas{height:60dvh}.live-remote .remote-zoom{gap:4px}.live-remote .remote-toolbar label:first-child{max-width:100%}.live-remote .remote-toolbar select{max-width:180px}.live-remote .page-heading{flex-wrap:wrap}.live-remote .remote-options{padding-bottom:env(safe-area-inset-bottom)}}
@media(max-height:500px) and (orientation:landscape){.live-remote .page-heading{margin-bottom:8px}.live-remote .remote-canvas{height:70dvh}.live-remote .remote-toolbar{padding-block:4px}}

.live-remote .remote-canvas[data-connected=true][data-mode=control]{cursor:none}