/* Device artwork has its own high-resolution source. Interface text, original
   brand and avatar assets stay sharp at every scale. These are inert demos. */
.phone-device,.web-device{position:relative;container-type:inline-size;isolation:isolate;pointer-events:none;user-select:none}
.phone-device{width:82%;max-width:280px;aspect-ratio:1696/2528;margin-top:-100px;margin-bottom:-20px}
.phone-hardware{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 1.7cqw 1.5cqw #13233124)}
.phone-screen{position:absolute;left:24.2%;top:12.75%;width:51.4%;height:74.35%;overflow:hidden;border-radius:5.5cqw;background:#12191f;padding:3cqw;display:flex;flex-direction:column;gap:1.1cqw}
.device-demo{color:#e7f0f5;font-family:Inter,Arial,sans-serif;font-size:3.4cqw;line-height:1.3;text-align:left;letter-spacing:0}
.device-demo img{flex:none;object-fit:contain}
.device-demo b{font-weight:600}
.device-demo em{font-style:normal;color:#96a9b4}
.device-demo .demo-icon{width:4cqw;height:4cqw;filter:invert(82%) sepia(15%) saturate(400%) hue-rotate(153deg)}
.phone-status{display:flex;justify-content:space-between;color:#bfcbd3;font-size:2.3cqw;padding:0 .7cqw .4cqw}
.device-demo-brand{display:flex;align-items:center;gap:1.6cqw;padding-bottom:2cqw;border-bottom:.25cqw solid #30404a}
.device-demo-brand>img:first-child{width:6cqw;height:6cqw}
.device-demo-brand>b{font-size:4cqw;letter-spacing:.045em}
.device-demo-brand>.demo-icon{margin-left:auto}
.device-demo-player{display:flex;align-items:center;gap:1.8cqw;padding:2cqw;background:#1c2832;border:.25cqw solid #344851;border-radius:2cqw}
.device-demo-player>span{font-size:2.7cqw;font-weight:650;color:#6dddec}
.device-demo-player em{display:block;font-size:2.35cqw;font-weight:400;margin-top:.5cqw}
.device-demo-player>.demo-icon:last-child{margin-left:auto;width:3.5cqw;height:3.5cqw}
.device-room-title{display:flex;flex-direction:column;gap:.7cqw;padding:1.1cqw 0}
.device-room-title>b{font-size:4cqw;white-space:nowrap}
.device-room-title>span{display:flex;align-items:center;gap:2cqw;color:#91a6b4;font-size:2.5cqw}
.device-room-title i,.web-connected i{width:1.3cqw;height:1.3cqw;border-radius:50%;background:#68e5c6}
.device-members{display:grid;gap:1.65cqw}
.device-member{display:flex;align-items:center;gap:1.8cqw;min-width:0;padding:1.55cqw;background:#1b252e;border:.25cqw solid #33424e;border-radius:2cqw}
.device-member>img:first-child{width:9cqw;height:9cqw;border-radius:50%;background:#0b1015}
.device-member>span{display:flex;flex-direction:column;gap:.45cqw;min-width:0}
.device-member b{font-size:3.3cqw;white-space:nowrap}
.device-member em{font-size:2.35cqw;white-space:nowrap}
.device-member>.demo-icon{margin-left:auto;width:3cqw;height:3cqw;opacity:.65}
.device-member.is-talking{border-color:#4ab9c8;background:linear-gradient(110deg,#183541,#1a282e)}
.device-member.is-talking em{color:#6bd6d7}
.demo-level{display:flex;align-items:center;gap:.55cqw;margin-left:auto;height:4cqw}
.demo-level>i{width:.65cqw;background:#61d9d9;border-radius:1cqw;height:50%}
.demo-level>i:nth-child(2){height:100%}
.demo-level>i:nth-child(3){height:75%}
.phone-controls{display:flex;justify-content:center;align-items:center;gap:3.5cqw;margin-top:auto;padding-top:1.6cqw}
.phone-controls>span{width:8cqw;height:8cqw;display:grid;place-items:center;border-radius:50%;border:.25cqw solid #384550;background:#202c36}
.phone-controls>.mic-active{width:11cqw;height:11cqw;background:linear-gradient(145deg,#42c7e0,#1379b4);border-color:#6ed9ee;box-shadow:0 1cqw 4cqw #08758c30}
.phone-controls>.mic-active img{width:5cqw;height:5cqw;filter:invert(100%)}
.phone-gesture{width:14cqw;height:.9cqw;flex:none;align-self:center;background:#b8c1c6;border-radius:1cqw;margin-top:1cqw}
.phone-screen .device-demo-brand{padding-bottom:1.3cqw}
.phone-screen .device-demo-player{padding:1.5cqw}
.phone-screen .device-room-title{padding:.8cqw 0}
.phone-screen .device-member{padding:1.25cqw}
.phone-screen .device-member>img:first-child{width:7.5cqw;height:7.5cqw}
.web-device{width:100%;aspect-ratio:1.5;margin-block:8px 9px;display:flex;align-items:center}
.web-window{width:100%;padding:.55cqw;border-radius:3cqw;background:linear-gradient(145deg,#68737d,#171e26 48%,#3f4f5d);box-shadow:0 3cqw 5cqw #101d2b28,0 .5cqw 1cqw #121a292e}
.web-chrome{display:flex;align-items:center;gap:4cqw;height:9cqw;padding:1.5cqw 3cqw;border-radius:2.5cqw 2.5cqw 0 0;background:linear-gradient(#33404c,#27333e);border-bottom:.3cqw solid #465360;color:#bfd0db}
.web-window-dots{display:flex;gap:1cqw}
.web-window-dots i{width:1.5cqw;height:1.5cqw;border-radius:50%;background:#df827b}
.web-window-dots i:nth-child(2){background:#d8bb77}
.web-window-dots i:nth-child(3){background:#73bca0}
.web-address{display:flex;align-items:center;justify-content:center;gap:1.4cqw;flex:1;background:#17222d;border:.25cqw solid #44515f;border-radius:1.3cqw;font-size:2.8cqw;line-height:1.3;padding:1cqw}
.web-chrome img{width:2.7cqw;height:2.7cqw;filter:invert(80%)}
.web-screen{padding:3cqw;background:radial-gradient(ellipse at top left,#21313c,#111920 80%);border-radius:0 0 2.5cqw 2.5cqw}
.web-screen .device-demo-brand{gap:2cqw;padding-bottom:1.5cqw}
.web-screen .device-demo-brand>img:first-child{width:5.5cqw;height:5.5cqw}
.web-screen .device-demo-brand>b{font-size:4.5cqw}
.web-connected{display:flex;align-items:center;gap:1.3cqw;font-size:2.45cqw;color:#9eb6bd;margin-left:auto;white-space:nowrap}
.web-screen .device-room-title{padding:1.4cqw 0 1.8cqw;flex-direction:row;align-items:baseline;justify-content:space-between;gap:1cqw}
.web-screen .device-room-title>b{font-size:4.3cqw}
.web-screen .device-room-title>span{font-size:2.6cqw;white-space:nowrap}
.web-screen .device-members{grid-template-columns:1fr 1fr;gap:2cqw}
.web-screen .device-member{padding:1.3cqw;gap:2cqw;border-radius:1.8cqw}
.web-screen .device-member>img:first-child{width:8cqw;height:8cqw}
.web-screen .device-member b{font-size:3.3cqw}
.web-screen .device-member em{font-size:2.4cqw}
.web-controls{display:flex;align-items:center;gap:3cqw;margin-top:2cqw;padding-top:1.5cqw;border-top:.25cqw solid #30404c;font-size:2.8cqw;color:#b4c7d2}
.web-controls>span{display:flex;align-items:center;gap:1.5cqw}
.web-controls .web-mic{padding:1.3cqw 2cqw;background:#164354;border:.25cqw solid #3b7b88;border-radius:1.3cqw;color:#a3e4ed}
.web-controls>.demo-icon{margin-left:auto}
@media(max-width:1100px){.phone-device{margin-top:-80px;margin-bottom:-16px}}
@media(max-width:800px){.phone-device{width:94%;margin-top:-58px;margin-bottom:-12px}.web-device{margin-top:4px}}
@media(max-width:560px){.phone-device{width:100%;max-width:340px;margin:-28px auto -22px}.web-device{max-width:420px;margin:8px auto 18px}}
/* No animation or focusable controls: the device UI is a labelled illustration. */
@media(prefers-reduced-motion:reduce){.phone-device,.web-device{animation:none}}
/* Keyboard focus stays on the real platform download/open links below. */
.platform>a:focus-visible{outline-offset:5px}
