.vmos-intro{position:relative;overflow:hidden;isolation:isolate;min-height:185px;display:flex;align-items:center;margin-bottom:32px;background:linear-gradient(110deg,var(--accent-dim),var(--surface))}.vmos-intro>div{z-index:1;max-width:70%}.vmos-intro .eyebrow{color:var(--accent);margin-bottom:13px}.vmos-intro h2{font-size:calc(23px * var(--text-scale));letter-spacing:-.6px}.vmos-intro p{font-size:calc(11px * var(--text-scale));color:var(--muted);margin-top:11px}.vmos-intro>.motion-scene{position:absolute;right:-20px;top:0;width:38%;height:100%;z-index:0;pointer-events:none}.vmos-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.vmos-loading,.vmos-empty{grid-column:1/-1;padding:30px}.vmos-empty p{color:var(--muted);font-size:calc(12px * var(--text-scale));margin:12px 0 20px}.vmos-device-art{height:220px;background:radial-gradient(ellipse at 50% 75%,var(--accent-dim),var(--surface2));border-radius:13px;display:grid;place-items:center;position:relative;overflow:hidden;margin-bottom:15px}.vmos-device-outline{width:99px;height:170px;border:1px solid color-mix(in srgb,var(--accent) 40%,var(--surface));background:linear-gradient(140deg,var(--accent-dim),var(--surface));border-radius:20px;padding:23px 13px;text-align:center;position:relative;z-index:1;box-shadow:12px 20px 40px #0003;animation:vmos-float 6s ease-in-out infinite}.vmos-device-outline:before{content:'';width:4px;height:4px;border-radius:50%;background:var(--muted);position:absolute;top:9px;left:calc(50% - 2px)}.vmos-device-outline span{font-size:8px;letter-spacing:1.5px;color:var(--soft)}.vmos-device-outline strong{display:block;font-size:43px;line-height:1.4;color:var(--accent);font-weight:500}.vmos-device-outline i{font-size:19px;font-style:normal;color:var(--accent)}.vmos-art-orbit{position:absolute;width:240px;height:100px;border:1px solid var(--border);border-radius:50%;transform:rotate(-24deg)}.vmos-card .device-meta{flex-wrap:wrap;font-size:calc(9px * var(--text-scale))}.vmos-promo{position:relative;overflow:hidden}.vmos-promo>.icon{width:33px;height:33px;color:var(--accent);margin-bottom:14px}.vmos-promo h3{font-size:calc(16px * var(--text-scale));margin-bottom:10px}.vmos-promo p{font-size:calc(11px * var(--text-scale));color:var(--muted);margin-bottom:15px;max-width:260px}.live-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:22px}.live-stage{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;align-items:center;gap:20px;min-height:720px}.live-stage>.motion-scene{position:absolute;inset:0;width:100%;height:100%;opacity:.18;z-index:-1;pointer-events:none}.live-topline{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;font-size:calc(10px * var(--text-scale));color:var(--soft)}.live-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:17px;padding:26px;text-align:center;background:radial-gradient(circle at 50% 25%,#20354c,#090d12 70%);z-index:4;color:#eaf4ff}.live-placeholder[hidden]{display:none}.live-placeholder h2{font-size:calc(20px * var(--text-scale));line-height:1.15}.live-placeholder p{font-size:calc(11px * var(--text-scale));color:#9cabbc}.live-orbit-mark{font-size:58px;color:#9bc6ff;animation:essential-beat 4s infinite}.live-error{padding:13px 16px;border:1px solid var(--border);border-radius:10px;font-size:calc(11px * var(--text-scale));background:var(--surface2);color:var(--red);width:100%}.live-hint{text-align:center;max-width:400px}.live-layout aside .info-row{gap:10px}.live-layout aside .info-row>span:last-child{text-align:right;overflow-wrap:anywhere}.live-layout aside h3{margin-bottom:12px}.live-layout aside .hint{font-size:calc(11px * var(--text-scale))}#live-play[hidden]{display:none}@keyframes vmos-float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-7px) rotate(1deg)}}@media(max-width:1100px){.vmos-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.live-layout{grid-template-columns:minmax(0,1fr) 240px}.live-stage{padding:18px}}@media(max-width:900px){.live-layout{grid-template-columns:1fr}.live-layout>aside{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.live-stage{min-height:0}}@media(max-width:600px){.vmos-grid{grid-template-columns:1fr}.vmos-intro>div{max-width:84%}.vmos-intro h2{font-size:calc(20px * var(--text-scale))}.vmos-intro>.motion-scene{width:60%;opacity:.5}.live-topline{align-items:flex-start;flex-wrap:wrap}.live-layout>aside{display:flex;flex-direction:column}.live-stage{padding:14px}.live-layout aside{min-width:0}}

/* The screen follows the actual stream aspect ratio. The SDK owns video scaling. */
.live-screen-shell{width:min(280px,calc(64svh * .45),100%);height:auto;aspect-ratio:9/20;flex:none;position:relative;display:flex;align-items:center;justify-content:center;border-radius:16px;background:#070a0e;border:1px solid var(--border);overflow:hidden;box-shadow:0 0 0 4px color-mix(in srgb,var(--border) 65%,#070a0e),0 22px 55px #0005}
.live-player{width:100%;min-width:0;display:flex;flex-direction:column;align-items:center;gap:20px}
.live-player:fullscreen{width:100vw;height:100dvh;padding:16px;gap:14px;justify-content:center;background:#070a0e}
.live-player:fullscreen .live-screen-shell{border:0;border-radius:0;box-shadow:none}
.live-mount{width:100%;height:100%;flex:none;max-width:100%;max-height:100%;overflow:hidden;position:relative;touch-action:none}
.live-sdk-view{width:100%!important;height:100%!important;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;touch-action:none}
.live-sdk-view>div{flex-shrink:0}
.live-mount video{display:block}
.live-toolbar{display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;gap:4px;padding:6px;max-width:100%;border:1px solid var(--border);border-radius:999px;background:color-mix(in srgb,var(--surface2) 85%,transparent);box-shadow:0 6px 24px #0002}
.live-control{display:grid;place-items:center;width:44px;height:44px;padding:0;flex-shrink:0;border:1px solid transparent;border-radius:50%;color:var(--text);background:transparent;transition:background .2s,color .2s,transform .2s,border-color .2s}
.live-control svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.live-control:hover:not(:disabled){color:var(--accent);background:var(--accent-dim);border-color:color-mix(in srgb,var(--accent) 30%,transparent)}
.live-control:active:not(:disabled){transform:scale(.92)}
.live-control:disabled{opacity:.32;cursor:not-allowed}
.live-control-disconnect:hover:not(:disabled){color:var(--red);background:color-mix(in srgb,var(--red) 12%,transparent);border-color:color-mix(in srgb,var(--red) 25%,transparent)}
.live-control-divider{width:1px;height:20px;background:var(--border);margin:0 3px;flex:none}
@media(max-width:350px){.live-toolbar{gap:2px;padding:4px}.live-control-divider{margin:0 1px}}