.device-control-visual{--dcv-line:#a7b7d24a;--dcv-muted:#aebbd4;box-sizing:border-box;border:1px solid var(--dcv-line);color:#f0f4ff;background:radial-gradient(circle at 21% 36%,#263652 0%,#141e34 43%,#0c1428 100%);border-radius:17px;width:100%;max-width:680px;margin:0;overflow:hidden;box-shadow:0 25px 60px #0007}.device-control-visual *{box-sizing:border-box}.device-control-visual__heading{border-bottom:1px solid var(--dcv-line);justify-content:space-between;align-items:baseline;gap:10px;padding:20px 24px 15px;display:flex}.device-control-visual__eyebrow,.device-control-visual__levels-title,.device-control-visual__session{font-family:var(--font-mono,monospace);letter-spacing:.1em;font-size:9px;line-height:1.4}.device-control-visual__eyebrow{color:#77d9f1;white-space:nowrap}.device-control-visual__heading-line{color:#dce5f6;text-align:right;font-size:12px;line-height:1.5}.device-control-visual__map{grid-template-columns:minmax(126px,210px) minmax(0,1fr);align-items:stretch;gap:8px;padding:10px 24px 13px;display:grid}.device-control-visual__device{width:100%;height:auto;display:block;overflow:visible}.device-control-visual__callouts{min-width:0;margin:0;padding:0;list-style:none;position:relative}.device-control-visual__callout{align-items:flex-start;gap:11px;width:100%;min-width:0;display:flex;position:absolute;left:0;transform:translateY(-50%)}.device-control-visual__callout--power{top:16.7%}.device-control-visual__callout--led{top:33.7%}.device-control-visual__callout--plus{top:58%}.device-control-visual__callout--minus{top:82%}.device-control-visual__callout b{color:#e8f0ff;width:25px;height:25px;font-family:var(--font-mono,monospace);background:#0c1931;border:1px solid #a9bfe466;border-radius:50%;flex:none;place-items:center;font-size:9px;font-weight:400;display:grid}.device-control-visual__callout--led b{border-color:var(--dcv-led);box-shadow:0 0 17px color-mix(in srgb,var(--dcv-led) 40%,transparent)}.device-control-visual__callout span{flex-direction:column;gap:3px;min-width:0;display:flex}.device-control-visual__callout strong{font-family:var(--font-mono,monospace);letter-spacing:.075em;white-space:nowrap;font-size:11px;font-weight:500;line-height:1.25}.device-control-visual__callout small{color:var(--dcv-muted);font-size:11px;line-height:1.3}.device-control-visual__levels{border-top:1px solid var(--dcv-line);background:#07102466;padding:15px 24px 18px}.device-control-visual__levels-title{color:#bac9e5;margin-bottom:12px;display:block}.device-control-visual__level-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;display:grid}.device-control-visual__level{color:#c1cce2;background:#d9e4ff08;border:1px solid #a6b7d136;border-radius:8px;align-items:center;gap:7px;min-width:0;padding:9px 7px;transition:border-color .24s,background-color .24s,color .24s,box-shadow .24s;display:flex}.device-control-visual__level.is-selected{border-color:var(--dcv-led);background:color-mix(in srgb,var(--dcv-led) 12%,#0e192e);color:#fff;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--dcv-led) 30%,transparent),0 0 14px color-mix(in srgb,var(--dcv-led) 24%,transparent)}.device-control-visual__level i{border-radius:5px;flex:none;width:7px;height:14px;box-shadow:0 0 9px}.device-control-visual__level>span{font-family:var(--font-mono,monospace);white-space:nowrap;font-size:10px;line-height:1.15}.device-control-visual__level small{letter-spacing:.025em;margin-top:3px;font-size:8px;display:block}.device-control-visual__session{border-top:1px solid var(--dcv-line);color:#b9c9e5;justify-content:space-between;gap:10px;padding:12px 24px;display:flex}.device-control-visual__session span:first-child{color:#dceeff}.device-control-visual--compact{max-width:390px}.device-control-visual--compact .device-control-visual__heading{padding:16px 18px 12px;display:block}.device-control-visual--compact .device-control-visual__heading-line{text-align:left;margin-top:5px;font-size:11px;display:block}.device-control-visual--compact .device-control-visual__map{grid-template-columns:minmax(106px,34%) minmax(0,1fr);gap:5px;padding:5px 15px 7px}.device-control-visual--compact .device-control-visual__callout{gap:6px}.device-control-visual--compact .device-control-visual__callout b{width:20px;height:20px;font-size:8px}.device-control-visual--compact .device-control-visual__callout strong,.device-control-visual--compact .device-control-visual__callout small{font-size:9px}.device-control-visual--compact .device-control-visual__levels{padding:7px 15px}.device-control-visual--compact .device-control-visual__levels-title{display:none}.device-control-visual--compact .device-control-visual__level-list{gap:4px}.device-control-visual--compact .device-control-visual__level{gap:4px;padding:5px 4px}.device-control-visual--compact .device-control-visual__level i{width:6px;height:13px}.device-control-visual--compact .device-control-visual__level>span{font-size:9px}.device-control-visual--compact .device-control-visual__level small{display:none}.device-control-visual--compact .device-control-visual__session{padding:8px 15px;font-size:8px}@media (max-width:450px){.device-control-visual:not(.device-control-visual--compact) .device-control-visual__heading{padding:16px 17px 12px;display:block}.device-control-visual:not(.device-control-visual--compact) .device-control-visual__heading-line{text-align:left;margin-top:5px;display:block}.device-control-visual:not(.device-control-visual--compact) .device-control-visual__map{grid-template-columns:minmax(106px,40%) minmax(0,1fr);gap:5px;padding:8px 15px 13px}.device-control-visual:not(.device-control-visual--compact) .device-control-visual__levels{padding-inline:15px}.device-control-visual:not(.device-control-visual--compact) .device-control-visual__level-list{gap:4px}.device-control-visual:not(.device-control-visual--compact) .device-control-visual__level{gap:4px;padding:6px 4px}.device-control-visual:not(.device-control-visual--compact) .device-control-visual__level>span{font-size:9px}.device-control-visual:not(.device-control-visual--compact) .device-control-visual__level small{font-size:7px}.device-control-visual:not(.device-control-visual--compact) .device-control-visual__session{padding-inline:15px;font-size:8px}}@media (max-width:355px){.device-control-visual__map,.device-control-visual--compact .device-control-visual__map{grid-template-columns:105px minmax(0,1fr);padding-inline:10px}.device-control-visual__callout small,.device-control-visual__callout strong{font-size:9px}.device-control-visual__callout{gap:5px}.device-control-visual__level small{font-size:7px}}@media (max-width:450px){.device-control-visual__callout--power{top:14%}.device-control-visual__callout--led{top:36%}.device-control-visual__callout span{gap:1px}}@media (prefers-reduced-motion:reduce){.device-control-visual__level{transition:none}}