.showroom{--gut:max(16px, 4vw);--booth:#0b0c10;--booth-ink:#f3f4f9;--booth-mute:#9ea3b5;--lite:255, 236, 210;background:var(--booth);color:var(--booth-ink);padding-block:clamp(56px,7vw,110px);position:relative;overflow:hidden}.showroom .lbl{color:var(--booth-ink)}.booth[data-tone=cool]{--lite:214, 236, 255}.booth[data-tone=rose]{--lite:255, 214, 226}.booth[data-tone=violet]{--lite:214, 200, 255}.sh-head{grid-template-columns:260px minmax(0,1fr);gap:40px;margin-bottom:22px;display:grid}.sh-head>div{min-width:0}.sh-h{letter-spacing:-.03em;text-wrap:balance;font-size:clamp(28px,3.6vw,52px);line-height:1.04}.sh-h .acc{color:#8094ff}.sh-info[hidden],.clip[hidden]{display:none}.sh-chips{flex-wrap:wrap;gap:10px;margin-bottom:clamp(22px,3vw,34px);display:flex}.sh-chips button{font:500 15px var(--sans);cursor:pointer;height:44px;color:var(--booth-ink);background:0 0;border:1px solid #ffffff2e;border-radius:999px;padding:0 20px;transition:background .25s,color .25s,border-color .25s,box-shadow .25s}.sh-chips button:hover{border-color:#ffffff80}.sh-chips button[aria-selected=true]{background:var(--booth-ink);color:var(--booth);border-color:var(--booth-ink);box-shadow:0 0 24px rgba(var(--lite), .35)}.sr{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;margin:0;position:absolute;overflow:hidden}.booth{padding-top:34px;position:relative}.tubes{height:2px;display:flex;position:absolute;inset:22px 14px auto}.tubes i{background:rgba(var(--lite), .16);width:20%;height:2px;box-shadow:0 0 0 rgba(var(--lite), 0);border-radius:0;transition:background .4s,box-shadow .4s}.booth .tubes i{background:rgba(var(--lite), .55);box-shadow:0 0 14px 1px rgba(var(--lite), .22)}.win{box-shadow:0 50px 90px -40px #000000e6, 0 0 0 1px #0009, 0 0 80px -20px rgba(var(--lite), .18);background:#15161c;border:1px solid #ffffff1a;border-radius:14px;position:relative;overflow:hidden}.leds{z-index:3;justify-content:space-between;height:2px;display:flex;position:absolute;inset:0 14px auto}.leds i{background:rgba(var(--lite), .25);border-radius:2px;width:3px;height:2px}.chrome{background:#1b1c23;border-bottom:1px solid #ffffff0f;align-items:center;gap:7px;height:34px;padding-inline:14px;display:flex}.chrome b{background:#3a3c47;border-radius:50%;width:10px;height:10px}.chrome .tag{font:600 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#c9cdda;border:1px solid #ffffff38;border-radius:999px;margin-inline-start:auto;padding:2px 9px}.screen{aspect-ratio:1280/548;background:#000;position:relative}.clip{position:absolute;inset:0}.clip video{object-fit:cover;background:#000;width:100%;height:100%;display:block}.sweep,.glint{pointer-events:none;opacity:0;z-index:2;position:absolute}.sweep{background:linear-gradient(90deg, transparent, rgba(var(--lite), .25) 30%, rgba(var(--lite), .7) 48%, rgba(var(--lite), .85) 50%, rgba(var(--lite), .7) 52%, rgba(var(--lite), .25) 70%, transparent);mix-blend-mode:screen;width:18%;filter:drop-shadow(0 0 16px rgba(var(--lite), .7));inset:-10% auto -10% 0;transform:translate(-120%)skew(-12deg)}.glint{mix-blend-mode:screen;background:linear-gradient(90deg,#0000,#ffffff59,#0000);width:6%;inset:0 auto 0 0;transform:translate(-200%)skew(-12deg)}.floor{background:radial-gradient(50% 100% at 50% 0, rgba(var(--lite), .16), transparent 70%);height:36px;margin:0 6%;transition:opacity .4s}.pp{z-index:4;inset-inline-end:8px;cursor:pointer;background:0 0;border:1px solid #ffffff38;border-radius:50%;place-items:center;width:44px;height:44px;display:grid;position:absolute;bottom:-2px}.pp span{border-inline:3px solid #fff;width:10px;height:12px}.pp.is-paused span{border:0;border-block:6px solid #0000;border-inline-start:10px solid #fff;width:0;height:0;margin-inline-start:3px}.switch .clip.out{z-index:0;animation:.65s ease-in .12s forwards fadeOut}@keyframes fadeOut{to{opacity:0}}.switch .clip.in{z-index:1;animation:.65s cubic-bezier(.6,0,.2,1) .12s both reveal}@keyframes reveal{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}.switch .sweep{animation:.65s cubic-bezier(.6,0,.2,1) .12s both sweep}@keyframes sweep{0%{opacity:1;transform:translate(-50%)skew(-12deg)}92%{opacity:1}to{opacity:0;transform:translate(560%)skew(-12deg)}}.switch .glint{animation:.3s ease-out .5s both glint}@keyframes glint{0%{opacity:1;transform:translate(-200%)skew(-12deg)}to{opacity:0;transform:translate(1800%)skew(-12deg)}}.switch .leds i{animation:led .5s calc(var(--i) * 14ms) ease-out both}@keyframes led{30%{background:rgba(var(--lite), 1);box-shadow:0 0 8px rgba(var(--lite), .9)}}.switch .tubes i{animation:.7s ease-out both tube}.switch .tubes i:nth-child(2){animation-delay:50ms}.switch .tubes i:nth-child(3){animation-delay:.1s}.switch .tubes i:nth-child(4){animation-delay:.15s}.switch .tubes i:nth-child(5){animation-delay:.2s}@keyframes tube{0%{background:rgba(var(--lite), .1);box-shadow:none}20%{background:rgba(var(--lite), .9)}30%{background:rgba(var(--lite), .3)}50%,to{background:rgba(var(--lite), .95);box-shadow:0 0 26px 4px rgba(var(--lite), .45)}}.switch .win{animation:.7s ease-out dim}@keyframes dim{15%{filter:brightness(.85)}}.switch .floor{animation:.9s ease-out floor}@keyframes floor{60%{opacity:1.8;transform:scaleX(1.06)}}.sh-info{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px 40px;margin-top:8px;display:grid}.sh-info ol{counter-reset:i;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:0;padding:0;list-style:none;display:grid}.sh-info li{counter-increment:i;color:#c9cdda;border-top:1px solid #ffffff24;padding-top:12px;font-size:15px;animation:.5s backwards shUp}.sh-info li:nth-child(2){animation-delay:60ms}.sh-info li:nth-child(3){animation-delay:.12s}.sh-info li:before{content:"0" counter(i);font:500 12px var(--mono);color:rgb(var(--lite));margin-bottom:6px;display:block}@keyframes shUp{0%{opacity:0;transform:translateY(8px)}}.showroom .btn{background:var(--booth-ink);color:var(--booth);border-color:var(--booth-ink)}.showroom .btn.ghost{color:var(--booth-ink);background:0 0;border-color:#ffffff40}.showroom .btn:hover{color:var(--booth);background:#8094ff;border-color:#8094ff}@media (width<=1000px){.sh-info{grid-template-columns:1fr}}@media (width<=860px){.sh-head{grid-template-columns:minmax(0,1fr);gap:12px}}@media (width<=700px){.win{border-width:6px;border-color:#24252d;border-radius:26px;max-width:380px;margin-inline:auto}.chrome{height:28px}.screen{aspect-ratio:4/5}.sh-info ol{grid-template-columns:1fr;gap:12px}.sh-chips{scroll-snap-type:x proximity;margin-inline:calc(var(--gut,16px) * -1);padding-inline:var(--gut,16px);scrollbar-width:none;flex-wrap:nowrap;padding-bottom:6px;overflow-x:auto}.sh-chips::-webkit-scrollbar{display:none}.sh-chips button{scroll-snap-align:start;white-space:nowrap;flex:none}.switch .clip.in{animation-name:revealV}@keyframes revealV{0%{clip-path:inset(0 0 100%)}to{clip-path:inset(0)}}.sweep{background:linear-gradient(180deg, transparent, rgba(var(--lite), .22) 40%, rgba(var(--lite), .55) 50%, rgba(var(--lite), .22) 60%, transparent);width:auto;height:26%;inset:0 -10% auto;transform:translateY(-120%)}.switch .sweep{animation-name:sweepV}@keyframes sweepV{0%{opacity:1;transform:translateY(-60%)}90%{opacity:1}to{opacity:0;transform:translateY(420%)}}}[dir=rtl] .chrome .tag{letter-spacing:0;text-transform:none;font-family:inherit}@media (prefers-reduced-motion:reduce){.showroom *,.showroom :before{transition:none!important;animation:none!important}}
