.remote{grid-template-rows:auto minmax(0,1fr)}
.remote:fullscreen{inset:0;width:100vw;height:100vh}
.remote:fullscreen .screen{background:#030608}
.screen{min-width:0;min-height:0;background:#030608}
.desktop{width:min(100%,calc((100vh - 56px) * var(--remote-aspect,1.7777778)));height:auto;max-height:100%;aspect-ratio:var(--remote-aspect,1.7777778);background-size:cover;background-repeat:no-repeat;background-position:center;flex:none}
.remote.normal .desktop{width:min(100%,calc((84vh - 56px) * var(--remote-aspect,1.7777778)))}
.remote:fullscreen .desktop{width:min(100%,calc((100vh - 56px) * var(--remote-aspect,1.7777778)));height:auto;max-height:100%;background-size:cover;background-repeat:no-repeat;background-position:center}
.desktop>video,.desktop>canvas,.desktop>img.remote-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#030608}
.desktop>video,.desktop>img.remote-frame{image-rendering:auto}
.desktop,.demo-page{-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision}
.quality-select{width:auto;min-width:128px;padding:8px 10px;background:#1b2630}
.desktop{cursor:none;outline:none;user-select:none}
.remote-cursor{position:absolute;left:50%;top:50%;width:14px;height:20px;pointer-events:none;filter:drop-shadow(0 1px 2px #000);z-index:4;transform:translate(-2px,-2px)}
.input-hint{position:absolute;left:24px;bottom:24px;background:#101920e8;border:1px solid #426252;padding:10px 14px;border-radius:10px;color:#d7e5df;font-size:12px}
.demo-desktop{position:absolute;inset:0;padding:28px;color:#eef6ff;background:linear-gradient(145deg,#164a65,#092836);overflow:hidden}
.demo-icon{position:relative;width:78px;padding:8px;border:1px solid transparent;border-radius:8px;text-align:center;color:white;background:transparent;font-size:12px;font-weight:500}
.demo-icon span{display:block;font-size:28px;margin-bottom:4px}.demo-icon.selected{background:#83b9ff35;border-color:#b7d5ff88}
.demo-window{position:absolute;left:22%;top:16%;width:58%;height:58%;border:1px solid #6f8292;border-radius:8px;background:#f7f8fa;color:#15202b;box-shadow:0 16px 40px #0008;overflow:hidden}
.demo-title{height:34px;padding:8px 12px;background:#e5eaf0;font-size:12px;font-weight:700;border-bottom:1px solid #c3ccd5}
.demo-page{height:calc(100% - 34px);padding:16px;white-space:pre-wrap;font:15px/1.5 Consolas,monospace;overflow:auto}.demo-caret{display:inline-block;width:2px;height:17px;background:#18232d;vertical-align:-3px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.remote .input-hint,.remote .consent{display:none!important}