@property --rx{syntax:"<number>";inherits:true;initial-value:0}@property --ry{syntax:"<number>";inherits:true;initial-value:0}.ev-room{padding-block:clamp(56px, 7vw, 112px) calc(clamp(72px, 8vw, 128px) + var(--band-h));background:linear-gradient(to bottom, var(--color-white) 0%, var(--color-blue-50) 16%, var(--color-blue-75) 62%, var(--color-white) calc(100% - var(--band-h)));margin-block-start:calc(-1*clamp(40px,5vw,80px));position:relative;overflow:clip}.ev-room__sprite{block-size:0;inline-size:0;position:absolute;overflow:hidden}.ev-room__field{z-index:1;pointer-events:none;opacity:0;position:absolute;inset:0}.ev-room[data-light=playing] .ev-room__field{opacity:1}.ev-note{inline-size:var(--s);block-size:var(--s);color:var(--c,var(--color-blue-100));opacity:.62;transform:translate(var(--dx,0px), var(--dy,0px)) rotate(calc(var(--a,0deg) + var(--r,0deg))) scale(var(--k,1));position:absolute;inset-block-start:var(--y,0px);inset-inline-start:var(--x,0px)}.ev-note svg{fill:currentColor;block-size:100%;inline-size:100%;display:block}.ev-note--mark{--mark-dark:color-mix(in srgb, currentColor 62%, var(--color-ink));opacity:.8}.ev-room__mark-deep{fill:var(--mark-dark,currentColor)}.ev-note__ring{opacity:0;pointer-events:none;border:2px solid;border-radius:50%;position:absolute;inset:0}@media (max-width:1319px){.ev-note:is(.ev-note--s,.ev-note--e){display:none}}.ev-room__head{margin-block-end:clamp(32px,4vw,56px);position:relative}.ev-room__head .ev-h2{z-index:1;position:relative}.ev-room__glyph{z-index:0;block-size:auto;inline-size:clamp(8.5rem,5rem + 9vw,15rem);fill:var(--color-blue-100);pointer-events:none;position:absolute;inset-block-start:50%;inset-inline-start:-.3em;translate:0 -54%}.ev-room__fig{margin:0}.ev-room__stage{isolation:isolate;perspective:1600px;position:relative}.ev-room__stage:after{content:"";z-index:1;filter:blur(14px);pointer-events:none;background:radial-gradient(closest-side,#06285a52,#0000);border-radius:50%;block-size:12%;position:absolute;inset-block-end:-7%;inset-inline:10%}.ev-room .ev-room__plate{block-size:130%;inline-size:calc(50vw - 4%);fill:var(--color-blue-100);z-index:0;inset:auto;inset-block-start:-15%;inset-inline-end:calc(-50vw + 50%)}.ev-room__glow{z-index:1;opacity:0;pointer-events:none;position:absolute;inset-block:-6% -12%;inset-inline:-5%}.ev-room__light{filter:blur(64px)saturate(2.2)brightness(1.4);block-size:100%;inline-size:100%;position:absolute;inset:0}.ev-room__light--b{opacity:.6;scale:-1 1}.ev-room[data-light] .ev-room__glow{opacity:.62}.ev-room[data-light=playing] .ev-room__glow{opacity:.9}.ev-room[data-light=paused] .ev-room__glow{opacity:.45}.ev-room[data-light=ended] .ev-room__glow{opacity:0}.ev-room__screen{--disc:clamp(68px, 6.4vw, 100px);z-index:2;aspect-ratio:16/9;border-radius:var(--radius-card);isolation:isolate;background:var(--color-blue-900);box-shadow:0 0 0 1px var(--color-line), 0 2px 4px #06285a1a, 0 14px 28px -10px #06285a38, 0 56px 110px -34px #06285a80;position:relative;overflow:hidden}.ev-room__screen:after{content:"";z-index:3;border-radius:inherit;box-shadow:inset 0 1px 0 color-mix(in srgb, var(--color-white) 40%, transparent);pointer-events:none;position:absolute;inset:0}.ev-room__screen:has(.yt-cover:focus-visible){outline:3px solid var(--color-blue-500);outline-offset:3px}html.a11y-focus .ev-room__screen:has(.yt-cover:focus){outline:4px solid var(--color-red);outline-offset:2px}.yt-cover{border-radius:inherit;background:var(--color-blue-900);block-size:100%;inline-size:100%;color:inherit;cursor:pointer;text-decoration:none;display:block;position:relative;overflow:hidden}.yt-cover[hidden]{display:none}:where(.yt-cover):focus-visible{outline:none}.yt-cover__img{object-fit:cover;block-size:100%;inline-size:100%;display:block}.yt-play{pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.yt-play>*{grid-area:1/1}.yt-play__disc{inline-size:var(--disc);block-size:var(--disc);background:var(--color-red);border-radius:50%;place-items:center;display:grid;position:relative;box-shadow:0 18px 40px -16px #06285aa6}.yt-play__disc svg{block-size:44%;inline-size:44%;fill:var(--color-white);translate:6%}.yt-play__ring{inline-size:var(--disc);block-size:var(--disc);border:2px solid color-mix(in srgb, var(--color-white) 85%, transparent);opacity:0;border-radius:50%}.yt-play__disc:after{content:"";border:3px solid #0000;border-block-start-color:var(--color-white);opacity:0;border-radius:50%;position:absolute;inset:-7px}.yt-cover[data-player=loading] .yt-play__disc:after{opacity:1}.yt-cover[data-player] .yt-play__ring{display:none}.ev-room__screen iframe{z-index:2;opacity:0;border:0;block-size:100%;inline-size:100%;position:absolute;inset:0}.ev-room__screen.is-playing iframe{opacity:1}.ev-room__screen.is-playing .yt-cover{pointer-events:none}.ev-room__screen.is-playing :is(.yt-cover__img,.yt-play){opacity:0}.ev-room__cap{z-index:3;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:4px 24px;margin-block-start:var(--spacing-s3);display:flex;position:relative}.ev-room__title{font-family:var(--font-display);letter-spacing:-.02em;color:var(--color-ink);text-wrap:balance;margin:0;font-size:clamp(1.375rem,1.1rem + .9vw,1.75rem);font-weight:900;line-height:1.2}.ev-room__mask{padding-block:.08em;display:block;overflow:hidden}.ev-room__mask>span{display:block}.yt-src{isolation:isolate;background:var(--color-white);min-block-size:44px;box-shadow:0 0 0 1px var(--color-line), 0 10px 24px -16px #06285a73;font-family:var(--font-display);color:var(--color-blue);white-space:nowrap;border-radius:999px;align-items:center;gap:10px;padding-inline:14px 16px;font-size:.9375rem;font-weight:700;text-decoration:none;display:inline-flex;position:relative;overflow:hidden}.yt-src__fill{z-index:-1;background:var(--color-blue);position:absolute;inset:0;transform:translate(-101%)}.yt-src__icon{flex:none;block-size:20px;inline-size:28px}.yt-src__go{fill:none;stroke:currentColor;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;block-size:18px;inline-size:18px}[dir=rtl] .yt-src__go{scale:-1 1}.yt-src:hover,.yt-src:focus-visible{color:var(--color-white);background:var(--color-blue)}.ev-room:has(.yt-cover[data-player=playing]) .yt-src:not(:hover,:focus-visible){box-shadow:none;color:var(--color-ink);background-color:#0000}@media (max-width:620px){.ev-room .ev-room__plate{block-size:128%;inline-size:calc(50vw + 5%);inset-block-start:-14%}.ev-room__glow{inset-block:-10% -18%;inset-inline:-6%}.ev-room__light{filter:blur(40px)saturate(2.2)brightness(1.4)}}.ev-room--tall .ev-room__grid{grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr) clamp(260px,26vw,340px);column-gap:clamp(32px,6vw,96px);display:grid}.ev-room--tall .ev-room__fig{display:contents}.ev-room--tall .ev-room__head{align-self:end}.ev-room--tall .ev-room__stage{grid-area:1/2/span 2}.ev-room--portrait .ev-room__screen{aspect-ratio:9/16}.ev-room--square .ev-room__screen{aspect-ratio:1}.ev-room--tall .ev-room__plate{block-size:112%;inline-size:calc(50vw + 12%);inset-block-start:-6%}.ev-room--tall .ev-room__cap{flex-direction:column;grid-area:2/1;align-self:start;align-items:flex-start;margin:0}.ev-room--tall .ev-room__title{font-size:clamp(1.5rem,1.1rem + 1.4vw,2.25rem);line-height:1.15}@media (max-width:760px){.ev-room--tall .ev-room__grid{grid-template-rows:auto;grid-template-columns:minmax(0,1fr)}.ev-room--tall .ev-room__stage{grid-area:2/1;justify-self:center;inline-size:min(100%,78vw,340px)}.ev-room--tall .ev-room__cap{grid-row:3;margin-block-start:var(--spacing-s3)}}@keyframes room-plate-in{0%{opacity:0;transform:translate(-12%)}}@keyframes room-rise{0%{opacity:0;transform:translateY(28px)scale(.92)}}@keyframes room-title-rise{0%{transform:translateY(105%)}}@keyframes room-sonar{0%{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(1.85)}}@keyframes room-turn{to{rotate:1turn}}@keyframes room-drift{25%{transform:translate(3%,-2%)rotate(1.5deg)scale(1.04)}50%{transform:translate(-1%,2.5%)rotate(-1deg)scale(1.02)}75%{transform:translate(-3%,-1%)rotate(2deg)scale(1.06)}}@keyframes room-drift-b{33%{transform:translate(-6%,3%)rotate(-3deg)scale(1.08)}66%{transform:translate(5%,-2.5%)rotate(2.5deg)scale(.96)}}@keyframes room-ripple{0%{opacity:.6;transform:scale(.6)}to{opacity:0;transform:scale(2)}}@media (prefers-reduced-motion:no-preference){:where(html:not(.a11y-still)) .ev-room.in .ev-room__plate{animation:room-plate-in 1.2s var(--ease-land) backwards}:where(html:not(.a11y-still)) .ev-room.in .ev-room__glyph{animation:room-rise 1.1s var(--ease-land) .15s backwards}:where(html:not(.a11y-still)) .ev-room.in .ev-room__mask>span{animation:room-title-rise 1s var(--ease-land) .3s backwards}:where(html:not(.a11y-still)) .yt-play__ring{animation:room-sonar 2.8s var(--ease-land) -.6s infinite}:where(html:not(.a11y-still)) .yt-play__ring+.yt-play__ring{animation-delay:-2s}:where(html:not(.a11y-still)) .ev-room__stage{transition:--rx .9s var(--ease-land), --ry .9s var(--ease-land)}:where(html:not(.a11y-still)) .ev-room__screen{transform:rotateX(calc(var(--rx) * -3deg)) rotateY(calc(var(--ry) * 4deg))}:where(html:not(.a11y-still)) .ev-room .ev-room__plate{translate:calc(var(--ry) * -8px) calc(var(--rx) * -6px)}:where(html:not(.a11y-still)) .ev-room__stage:after{translate:calc(var(--ry) * -10px) 0}:where(html:not(.a11y-still)) .ev-room__glow{scale:.88;translate:calc(var(--ry) * -18px) calc(var(--rx) * -12px);transition:opacity 1.4s var(--ease-land), scale 1.4s var(--ease-land), translate .9s var(--ease-land)}:where(html:not(.a11y-still)) .ev-room[data-light] .ev-room__glow{scale:1}:where(html:not(.a11y-still)) .ev-room[data-light=ended] .ev-room__glow{transition-duration:2.4s}:where(html:not(.a11y-still)) .ev-room[data-light] .ev-room__light{animation:18s ease-in-out infinite room-drift}:where(html:not(.a11y-still)) .ev-room[data-light] .ev-room__light--b{animation-name:room-drift-b;animation-duration:11s}:where(html:not(.a11y-still)) .ev-room[data-light=paused] .ev-room__light,:where(html:not(.a11y-still)) .ev-room[data-light=ended] .ev-room__light{animation-play-state:paused}:where(html:not(.a11y-still)) .ev-room__field{transition:opacity 1.2s var(--ease-land)}:where(html:not(.a11y-still)) .ev-room[data-light=ended] .ev-room__field{transition-duration:2.4s}:where(html:not(.a11y-still)) .ev-note{transition:color .8s linear}:where(html:not(.a11y-still)) .ev-note__ring{animation:room-ripple 2.2s var(--ease-land) forwards}:where(html:not(.a11y-still)) .yt-play{transition:opacity .3s, transform .35s var(--ease-land)}:where(html:not(.a11y-still)) .yt-play__disc{transition:transform .4s var(--ease-land)}:where(html:not(.a11y-still)) .yt-cover[data-player=loading] .yt-play__disc:after{animation:.8s linear infinite room-turn}:where(html:not(.a11y-still)) .yt-cover__img{transition:transform .9s var(--ease-land), opacity .6s var(--ease-land)}:where(html:not(.a11y-still)) .ev-room__screen iframe{transition:opacity .5s var(--ease-land) .12s}:where(html:not(.a11y-still)) .ev-room__screen.is-playing .yt-cover__img{transform:scale(1.06)}:where(html:not(.a11y-still)) .ev-room__screen.is-playing .yt-play{transform:scale(.6)}:where(html:not(.a11y-still)) .yt-src{transition:color .3s var(--ease-land), background-color .6s var(--ease-land), box-shadow .6s var(--ease-land), transform .1s}:where(html:not(.a11y-still)) .yt-src:hover,:where(html:not(.a11y-still)) .yt-src:focus-visible{background:var(--color-white);box-shadow:0 0 0 1px var(--color-blue), 0 16px 30px -16px #06285a8c}:where(html:not(.a11y-still)) .yt-src__fill{transition:transform .45s var(--ease-land)}:where(html:not(.a11y-still)) .yt-src:hover .yt-src__fill,:where(html:not(.a11y-still)) .yt-src:focus-visible .yt-src__fill{transform:none}:where(html:not(.a11y-still)) .yt-src__go{transition:translate .45s var(--ease-land)}:where(html:not(.a11y-still)) .yt-src:hover .yt-src__go,:where(html:not(.a11y-still)) .yt-src:focus-visible .yt-src__go{translate:-3px -3px}:where(html:not(.a11y-still)) .yt-src__icon{transition:transform .45s var(--ease-land)}:where(html:not(.a11y-still)) .yt-src:active{transform:scale(.97)}}@media (prefers-reduced-motion:no-preference) and (hover:hover){:where(html:not(.a11y-still)) .yt-cover:hover .yt-play__disc{transform:scale(1.1)}:where(html:not(.a11y-still)) .yt-cover:hover .yt-cover__img{transform:scale(1.04)}:where(html:not(.a11y-still)) .yt-cover:hover .yt-play__ring{animation-duration:1.6s}:where(html:not(.a11y-still)) .yt-src:hover .yt-src__icon{transform:scale(1.12)rotate(-6deg)}}@media (prefers-reduced-motion:no-preference){:where(html:not(.a11y-still)) .yt-cover:active .yt-play__disc{transition-duration:.1s;transform:scale(.94)}}
