@property --court-bearing{syntax: "<angle>"; inherits: false; initial-value: 0deg;}.living-goal>div,.living-hoop-base,.living-hoop-upright>div,.living-hoop-rim,.living-hoop-net,.living-center-net-panel,.living-padel-glass{animation:living-fixture-enter .8s ease both}@keyframes living-fixture-enter{0%{opacity:0}to{opacity:1}}.living-court-mesh{border:1px solid hsl(var(--brand-white) / .32);background:repeating-linear-gradient(0deg,hsl(var(--brand-white) / .25) 0 1px,transparent 1px 7px),repeating-linear-gradient(90deg,hsl(var(--brand-white) / .25) 0 1px,transparent 1px 7px)}.living-goal,.living-hoop,.living-center-net{position:absolute;width:0;height:0;transform-style:preserve-3d}.living-goal{--goal-width: calc(var(--court-unit) * 160);--goal-height: calc(var(--court-unit) * 76);--goal-depth: calc(var(--court-unit) * 54);left:4%;top:calc(50% - var(--court-unit) * 80);transform:rotate(90deg)}.living-goal[data-end=end]{left:96%;top:calc(50% + var(--court-unit) * 80);transform:rotate(-90deg)}.living-goal-mouth,.living-goal-back{position:absolute;bottom:0;width:var(--goal-width);height:var(--goal-height);transform-origin:0 100%;transform:rotateX(-90deg)}.living-goal-mouth{border:4px solid hsl(var(--brand-white) / .82);border-bottom:0;border-radius:4px 4px 0 0;box-shadow:0 -2px 12px hsl(var(--brand-white) / .06)}.living-goal-back{bottom:calc(-1 * var(--goal-depth))}.living-goal-side{position:absolute;bottom:0;width:var(--goal-depth);height:var(--goal-height);transform-origin:0 100%;transform:rotate(90deg) rotateX(-90deg)}.living-goal-side[data-side=far]{left:var(--goal-width)}.living-goal-roof{position:absolute;width:var(--goal-width);height:var(--goal-depth);transform:translateZ(var(--goal-height))}.living-goal-shadow{position:absolute;width:var(--goal-width);height:calc(var(--goal-depth) * 1.8);background:linear-gradient(hsl(var(--brand-black) / .4),transparent);transform:skew(-25deg) translateZ(1px)}.living-center-net{left:50%;top:calc(var(--court-unit) * 20)}.living-center-net-panel{position:absolute;bottom:0;width:calc(var(--court-unit) * 560);height:calc(var(--court-unit) * 90);overflow:visible;transform-origin:0 100%;transform:rotate(90deg) rotateX(-90deg)}.living-net-body{fill:hsl(var(--brand-black) / .55)}.living-net-weave{stroke:hsl(var(--brand-white) / .42);stroke-width:1}.living-net-band{stroke:hsl(var(--brand-white) / .9);stroke-width:6}.living-net-posts{stroke:hsl(var(--brand-white) / .75);stroke-width:5;stroke-linecap:round}.living-net-feet{stroke:hsl(var(--brand-white) / .55);stroke-width:3}.living-court[data-court=padel] .living-center-net{top:calc(var(--court-unit) * 40)}.living-court[data-court=padel] .living-center-net-panel{width:calc(var(--court-unit) * 520)}.living-hoop{left:6%;top:50%;transform:rotate(90deg)}.living-hoop[data-end=end]{left:94%;transform:rotate(-90deg)}.living-hoop-base{position:absolute;left:calc(var(--court-unit) * -15);top:calc(var(--court-unit) * -12);width:calc(var(--court-unit) * 30);height:calc(var(--court-unit) * 45);border-radius:4px;background:color-mix(in srgb,var(--sport-accent) 65%,var(--living-ink))}.living-hoop-upright{position:absolute;bottom:0;width:calc(var(--court-unit) * 90);height:calc(var(--court-unit) * 160);transform-origin:0 100%;transform:rotateX(-90deg)}.living-hoop-pole{position:absolute;bottom:0;left:calc(var(--court-unit) * -4);width:calc(var(--court-unit) * 8);height:100%;background:hsl(var(--brand-white) / .55)}.living-hoop-board{position:absolute;left:-50%;top:0;width:100%;height:calc(var(--court-unit) * 60);border:3px solid hsl(var(--brand-white) / .8);border-radius:3px;background:hsl(var(--brand-white) / .1)}.living-hoop-board span{position:absolute;left:30%;top:33%;width:40%;height:50%;border:2px solid hsl(var(--brand-white) / .65)}.living-hoop-rim{position:absolute;left:calc(var(--court-unit) * -19);top:calc(var(--court-unit) * -38);width:calc(var(--court-unit) * 38);height:calc(var(--court-unit) * 38);border:4px solid var(--sport-accent);border-radius:50%;transform:translateZ(calc(var(--court-unit) * 116))}.living-hoop-net{position:absolute;bottom:calc(var(--court-unit) * 19);left:calc(var(--court-unit) * -19);width:calc(var(--court-unit) * 38);height:calc(var(--court-unit) * 38);clip-path:polygon(0 0,100% 0,75% 100%,25% 100%);transform-origin:50% 100%;transform:translateZ(calc(var(--court-unit) * 78)) rotateX(-90deg)}.living-padel-glass{position:absolute;width:calc(var(--court-unit) * 520);height:calc(var(--court-unit) * 120);transform-origin:0 100%;border:2px solid hsl(var(--brand-white) / .28);background:repeating-linear-gradient(90deg,transparent 0 calc(var(--court-unit) * 103),hsl(var(--brand-white) / .2) calc(var(--court-unit) * 103) calc(var(--court-unit) * 104)),linear-gradient(115deg,hsl(var(--brand-white) / .015) 15%,hsl(var(--brand-white) / .11) 45%,transparent 60%)}.living-padel-glass[data-wall=start],.living-padel-glass[data-wall=end]{top:calc(var(--court-unit) * -80);transform:rotate(90deg) rotateX(-90deg)}.living-padel-glass[data-wall=start]{left:4%}.living-padel-glass[data-wall=end]{left:96%}.living-padel-glass[data-wall=far],.living-padel-glass[data-wall=near]{left:4%;width:calc(var(--court-unit) * 920);transform:rotateX(-90deg)}.living-padel-glass[data-wall=far]{top:calc(var(--court-unit) * -80)}.living-padel-glass[data-wall=near]{top:calc(var(--court-unit) * 440)}