.x2-night{--x2-ready:1;position:absolute;inset:0;overflow:clip}.x2-dusk{background:linear-gradient(180deg, color-mix(in oklab, var(--room-p1) 68%, var(--vault-ink)) 0%, var(--room-p1) 48%, color-mix(in oklab, var(--room-p1) 92%, var(--room-p6)) 86%, color-mix(in oklab, var(--room-p1) 88%, var(--room-p6)) 100%);position:absolute;inset:0}.x2-stars{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='260'%3E%3Cg fill='%23F4F6FA'%3E%3Ccircle cx='14' cy='22' r='0.5' opacity='.59'/%3E%3Ccircle cx='52' cy='88' r='0.37' opacity='.42'/%3E%3Ccircle cx='97' cy='31' r='0.68' opacity='.65'/%3E%3Ccircle cx='131' cy='142' r='0.43' opacity='.47'/%3E%3Ccircle cx='168' cy='64' r='0.31' opacity='.38'/%3E%3Ccircle cx='205' cy='17' r='0.56' opacity='.64'/%3E%3Ccircle cx='238' cy='118' r='0.37' opacity='.42'/%3E%3Ccircle cx='276' cy='52' r='0.62' opacity='.59'/%3E%3Ccircle cx='318' cy='96' r='0.43' opacity='.51'/%3E%3Ccircle cx='344' cy='186' r='0.31' opacity='.38'/%3E%3Ccircle cx='24' cy='166' r='0.37' opacity='.42'/%3E%3Ccircle cx='76' cy='214' r='0.5' opacity='.51'/%3E%3Ccircle cx='118' cy='246' r='0.31' opacity='.34'/%3E%3Ccircle cx='186' cy='198' r='0.43' opacity='.47'/%3E%3Ccircle cx='226' cy='236' r='0.37' opacity='.38'/%3E%3Ccircle cx='294' cy='224' r='0.5' opacity='.51'/%3E%3Ccircle cx='150' cy='108' r='0.25' opacity='.34'/%3E%3Ccircle cx='330' cy='14' r='0.31' opacity='.42'/%3E%3C/g%3E%3C/svg%3E");background-size:360px 260px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 34%,#0000 84%);mask-image:linear-gradient(#000 0 34%,#0000 84%)}.x2-twinkle{top:var(--y);left:var(--x);background:var(--room-p3);width:1.6px;height:1.6px;box-shadow:0 0 3px color-mix(in oklab, var(--room-p3) 50%, transparent);opacity:.3;animation:x2-twinkle var(--dur) var(--ease-museum) var(--delay) infinite alternate;will-change:opacity;border-radius:50%;position:absolute}@keyframes x2-twinkle{0%{opacity:.22}to{opacity:.88}}.x2-glow{background:radial-gradient(90% 36% at 50% 100%, color-mix(in oklab, var(--room-p6) 6%, transparent), transparent 72%);position:absolute;inset:0}.x2-skyline{width:100%;height:clamp(80px,13vh,132px);position:absolute;bottom:0;left:0;right:0}.x2-skyline-body{fill:color-mix(in oklab, var(--room-p1) 52%, var(--vault-ink))}.x2-skyline-snow{fill:none;stroke:color-mix(in oklab, var(--room-p3) 9%, transparent);stroke-width:1.2px;stroke-linecap:round;stroke-linejoin:round}.x2-entrance{--x2-ready:1;z-index:0;pointer-events:none;height:100lvh;position:absolute;top:0;left:0;right:0}.room-shell[data-threshold=run] .x2-entrance{animation:x2-in .9s var(--ease-museum) .8s both}@keyframes x2-in{0%{opacity:0}to{opacity:1}}.x2-star-field{--sx:87%;--sy:42px;--r:120px;top:calc(var(--sy) - var(--r));left:calc(var(--sx) - var(--r));width:calc(var(--r) * 2);height:calc(var(--r) * 2);position:absolute}.x2-star{--k:1;width:0;height:0;position:absolute;top:50%;left:50%}.x2-star-lift{width:0;height:0;transform:scale(calc(1 + .14 * max(var(--f-in,0), var(--f-tap,0))));position:absolute;top:0;left:0}.x2-star-lift>span{position:absolute;top:0;left:0}.x2-star-flare{width:calc(var(--k) * 200px);height:calc(var(--k) * 200px);margin:calc(var(--k) * -100px) 0 0 calc(var(--k) * -100px);background:radial-gradient(closest-side, color-mix(in oklab, var(--room-p3) 30%, transparent), color-mix(in oklab, var(--room-p6) 11%, transparent) 46%, transparent 100%);opacity:max(calc(var(--f-in,0) * .75), var(--f-tap,0));border-radius:50%}.x2-star-halo{width:calc(var(--k) * 160px);height:calc(var(--k) * 160px);margin:calc(var(--k) * -80px) 0 0 calc(var(--k) * -80px);background:radial-gradient(closest-side, color-mix(in oklab, var(--room-p3) 20%, transparent), color-mix(in oklab, var(--room-p6) 9%, transparent) 42%, transparent 100%);animation:x2-halo 6.2s var(--ease-museum) infinite alternate;border-radius:50%}@keyframes x2-halo{0%{opacity:.72}to{opacity:1}}.x2-star-rays{width:0;height:0;animation:x2-rays 4.2s var(--ease-museum) infinite alternate}@keyframes x2-rays{0%{transform:rotate(-1.4deg)scale(.92)}to{transform:rotate(1.2deg)scale(1.04)}}.x2-ray{position:absolute;top:0;left:0}.x2-ray--n,.x2-ray--s{width:2px;margin-left:-1px}.x2-ray--n{top:calc(var(--k) * -72px);height:calc(var(--k) * 72px);background:linear-gradient(0deg, var(--room-p3), color-mix(in oklab, var(--room-p3) 30%, transparent) 55%, transparent)}.x2-ray--s{height:calc(var(--k) * 150px);background:linear-gradient(180deg, var(--room-p3), color-mix(in oklab, var(--room-p3) 30%, transparent) 50%, transparent)}.x2-ray--e,.x2-ray--w{height:2px;width:calc(var(--k) * 66px);margin-top:-1px}.x2-ray--e{background:linear-gradient(90deg, var(--room-p3), color-mix(in oklab, var(--room-p3) 30%, transparent) 50%, transparent)}.x2-ray--w{left:calc(var(--k) * -66px);background:linear-gradient(270deg, var(--room-p3), color-mix(in oklab, var(--room-p3) 30%, transparent) 50%, transparent)}.x2-ray--d1,.x2-ray--d2{top:calc(var(--k) * -26px);width:1px;height:calc(var(--k) * 52px);background:linear-gradient(180deg, transparent, color-mix(in oklab, var(--room-p3) 70%, transparent) 50%, transparent);transform:rotate(45deg)}.x2-ray--d2{transform:rotate(-45deg)}.x2-star-core{background:radial-gradient(circle closest-side, var(--room-p3) 0 40%, color-mix(in oklab, var(--room-p6) 50%, var(--room-p3)) 70%, transparent 100%);width:10px;height:10px;box-shadow:0 0 12px 3px color-mix(in oklab, var(--room-p3) 45%, transparent);animation:x2-core 3.3s var(--ease-museum) infinite alternate;border-radius:50%;margin:-5px 0 0 -5px}@keyframes x2-core{0%{opacity:.8}to{opacity:1}}.x2-entrance:not([data-awake]) :is(.x2-star-halo,.x2-star-rays,.x2-star-core){animation-play-state:paused}.x2-string{--u:1px;position:absolute}.x2-string--swag{width:46vw;height:100px;top:4px;left:max(400px,27.5vw)}.x2-wire{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.x2-wire path{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round}.x2-wire-lead{stroke:color-mix(in oklab, var(--vault-ink) 72%, var(--room-p1));stroke-width:1.6px}.x2-wire-frost{stroke:color-mix(in oklab, var(--room-p3) 24%, transparent);stroke-width:.6px}.x2-bulb{--bulb-color:var(--x2-c);width:calc(var(--u) * 8);height:calc(var(--u) * 17);margin-left:calc(var(--u) * -4);transform:rotate(var(--tilt,0deg));transform-origin:50% 0;position:absolute}.x2-bulb--gold{--x2-c:var(--room-p4)}.x2-bulb--green{--x2-c:var(--room-p5)}.x2-bulb--blue{--x2-c:var(--room-p6)}.x2-bulb--ruby{--x2-c:var(--room-p2)}.x2-bulb-glow{top:calc(var(--u) * 4);left:calc(var(--u) * -1);width:calc(var(--u) * 10);height:calc(var(--u) * 13);background:color-mix(in oklab, var(--x2-c) 40%, transparent);box-shadow:0 0 calc(var(--u) * 6) calc(var(--u) * 2) color-mix(in oklab, var(--x2-c) 58%, transparent), 0 0 calc(var(--u) * 18) calc(var(--u) * 6) color-mix(in oklab, var(--x2-c) 26%, transparent), 0 0 calc(var(--u) * 34) calc(var(--u) * 10) color-mix(in oklab, var(--x2-c) 11%, transparent);border-radius:50%;position:absolute}.x2-bulb-cap{top:0;left:calc(var(--u) * 2);width:calc(var(--u) * 4);height:calc(var(--u) * 5);border-radius:calc(var(--u) * 1) calc(var(--u) * 1) calc(var(--u) * .6) calc(var(--u) * .6);background:linear-gradient(90deg, color-mix(in oklab, var(--vault-ink) 78%, var(--room-p5)), color-mix(in oklab, var(--vault-ink) 55%, var(--room-p5)) 45%, var(--vault-ink));position:absolute}.x2-bulb-glass{top:calc(var(--u) * 4.5);left:calc(var(--u) * 1);width:calc(var(--u) * 6);height:calc(var(--u) * 12);background:radial-gradient(70% 50% at 45% 38%, color-mix(in oklab, var(--x2-c) 34%, white) 0%, var(--x2-c) 48%, color-mix(in oklab, var(--x2-c) 70%, var(--vault-ink)) 100%);border-radius:50%/38% 38% 62% 62%;position:absolute}.x2-roof{--x2-ready:1;--x2-chimney:clamp(46px, 5.2vw, 78px);pointer-events:none;position:absolute;inset:0;overflow:clip}.x2-ridge{width:100%;height:30%;position:absolute;bottom:0;left:0;right:0;-webkit-mask-image:linear-gradient(#000 0 42%,#0000 100%);mask-image:linear-gradient(#000 0 42%,#0000 100%)}.x2-ridge-roof{fill:color-mix(in oklab, var(--room-p1) 48%, var(--vault-ink))}.x2-ridge-snow{fill:color-mix(in oklab, var(--room-p3) 30%, transparent)}.x2-ridge-courses{fill:none;stroke:color-mix(in oklab, var(--room-p3) 5%, transparent);stroke-width:1px;vector-effect:non-scaling-stroke}.x2-chimney{width:var(--x2-chimney);background:repeating-linear-gradient(180deg, transparent 0 9px, color-mix(in oklab, var(--vault-ink) 45%, transparent) 9px 10px), linear-gradient(90deg, color-mix(in oklab, var(--room-p2) 30%, var(--room-p1)), color-mix(in oklab, var(--room-p2) 18%, var(--room-p1)) 64%, color-mix(in oklab, var(--room-p2) 12%, var(--vault-ink)));position:absolute;bottom:24%}.x2-chimney:before{content:"";background:color-mix(in oklab, var(--room-p1) 40%, var(--vault-ink));height:7px;position:absolute;top:0;left:-7%;right:-7%}.x2-chimney--left{height:38%;left:12%}.x2-chimney--right{height:26%;bottom:25%;left:83%}.x2-chimney-snow{background:color-mix(in oklab, var(--room-p3) 44%, var(--room-p1));border-radius:50% 50% 30% 30%/90% 90% 10% 10%;height:10px;position:absolute;top:-6px;left:-10%;right:-10%}.x2-string--roof{--u:1.15px;top:39%;right:17%;left:calc(12% + var(--x2-chimney));height:30%}.x2-ember-field{z-index:4;pointer-events:none;position:absolute;inset:0}.x2-ember-gate{opacity:0;transition:opacity .55s var(--ease-museum);position:absolute;inset:0}.album-gem-display[data-gem=on] .x2-ember-gate{opacity:1}.x2-ember-stone{mix-blend-mode:multiply;width:40.2%;height:46.6%;position:absolute;top:15.5%;left:29.9%}.x2-ember-follow{transform:translate3d(calc((var(--fx-lag,.5) - .5) * 56%), calc((var(--fy-lag,.5) - .5) * 50%), 0);position:absolute;inset:0}.x2-ember-follow>span{border-radius:50%;position:absolute;top:50%;left:50%}.x2-ember-glow{aspect-ratio:1;background:radial-gradient(closest-side, color-mix(in oklab, var(--room-p2) 62%, transparent), color-mix(in oklab, var(--room-p2) 24%, transparent) 46%, transparent 100%);width:70%;opacity:min(1, calc(.5 + .4 * var(--f-in,0) + .3 * var(--f-tap,0)));animation:x2-ember 2.8s var(--ease-museum) infinite alternate;margin:-35% 0 0 -35%}.x2-ember-core{aspect-ratio:1;background:radial-gradient(closest-side, color-mix(in oklab, var(--room-p2) 30%, var(--room-p4)) 0 24%, var(--room-p2) 62%, transparent 100%);width:22%;opacity:min(1, calc(.78 + .22 * var(--f-in,0) + .2 * var(--f-tap,0)));animation:x2-ember 2.1s var(--ease-museum) -.8s infinite alternate;margin:-11% 0 0 -11%}@keyframes x2-ember{0%{transform:scale(.9)}to{transform:scale(1.08)}}.album-gem-display:not([data-gem=on]) :is(.x2-ember-glow,.x2-ember-core){animation-play-state:paused}@media (width>=768px) and (width<=1023.98px){.x2-star-field{--sx:92%}.x2-string--swag{width:auto;left:400px;right:calc(8% + 80px)}}@media (width<=767.98px){.x2-star-field{--sx:88%;--sy:100px;--r:100px}.x2-star{--k:.62}.x2-roof{--x2-chimney:40px}.x2-chimney--left{height:34%;left:5%}.x2-chimney--right{height:24%;left:80%}.x2-string--roof{--u:1.1px;right:20%;left:calc(5% + var(--x2-chimney))}}@media (prefers-reduced-motion:reduce){.x2-twinkle{opacity:.6;will-change:auto;animation:none!important}.x2-star-rays,.x2-star-core,.x2-ember-glow,.x2-ember-core{animation:none!important}.x2-star-halo{animation:x2-rm-breath 7s var(--ease-museum) infinite!important}.room-shell[data-threshold=run] .x2-entrance{animation:none}.x2-ember-gate{transition:none}}@keyframes x2-rm-breath{0%,to{opacity:1}50%{opacity:.96}}
