:root{--bay-raised-accent:#306aff;--bay-raised-empty:#0000000d}.hp4-bays[data-appearance=raised]{--bay-raised-scale:1}.hp4-bay-raised{--bay-raised-radius:calc(6px * var(--bay-raised-scale));--bay-raised-highlight:calc(10px * var(--bay-raised-scale));--bay-raised-shadow:0 calc(2px * var(--bay-raised-scale)) calc(3px * var(--bay-raised-scale)) #306aff4a, 0 calc(6px * var(--bay-raised-scale)) calc(6px * var(--bay-raised-scale)) #306aff40, 0 calc(14px * var(--bay-raised-scale)) calc(8px * var(--bay-raised-scale)) #306aff26, 0 calc(24px * var(--bay-raised-scale)) calc(10px * var(--bay-raised-scale)) #306aff0a, 0 calc(38px * var(--bay-raised-scale)) calc(11px * var(--bay-raised-scale)) #306aff03;--bay-raised-duration:calc(var(--hp4-duration-exit) * 2);border-radius:var(--bay-raised-radius);background:var(--bay-raised-empty);height:92px;display:block;position:relative;container-type:inline-size}.hp4-bay-raised:has(>i[data-fill]){background:0 0}.hp4-bay-raised:has(>i[data-fill]):after{content:"";border-radius:inherit;background:var(--bay-raised-empty);clip-path:inset(0 0 var(--bay-used) 0);transition:clip-path var(--bay-raised-duration) ease-in-out;transition-delay:calc(var(--bay-delay,0s) + var(--rung-delay,0s) + var(--node-delay,0s));position:absolute;inset:0}.hp4-bay-raised:before{content:"";border-radius:inherit;box-shadow:var(--bay-raised-shadow);opacity:0;pointer-events:none;transition:opacity var(--bay-raised-duration) ease-in-out, height var(--bay-raised-duration) ease-in-out;transition-delay:calc(var(--bay-delay,0s) + var(--rung-delay,0s) + var(--node-delay,0s));position:absolute;inset:0}.hp4-bay-raised:has(>i[data-fill]):before{height:var(--bay-used);border-radius:0 0 var(--bay-raised-radius) var(--bay-raised-radius);top:auto}.hp4-bay-raised>i{border-radius:inherit;background:var(--bay-raised-accent);clip-path:inset(100% 0 0 round var(--bay-raised-radius));transition:clip-path var(--bay-raised-duration) ease-in-out;transition-delay:calc(var(--bay-delay,0s) + var(--rung-delay,0s) + var(--node-delay,0s));position:absolute;inset:0;overflow:hidden}.hp4-bay-raised>i:before{content:"";width:max(calc(302px * var(--bay-raised-scale)), 419.444cqw);height:max(calc(78px * var(--bay-raised-scale)), 108.333cqw);background:url(/machines/gpu-bay-stripes.svg) 50%/100% 100% no-repeat;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)matrix(0,1,1,0,0,0)}.hp4-bay-raised>i:after{content:"";border-radius:inherit;box-shadow:inset 0 var(--bay-raised-highlight) 0 #fff3;position:absolute;inset:0}.hp4-bay-slot[data-on] .hp4-bay-raised{--bay-raised-duration:calc(var(--hp4-duration-enter) * 2)}.hp4-bay-slot[data-on] .hp4-bay-raised:before{opacity:var(--bay-shadow-opacity,1)}.hp4-bay-slot[data-on] .hp4-bay-raised>i{clip-path:inset(0 0 0 round var(--bay-raised-radius))}.hp4-bay-slot .hp4-bay-raised>i[data-fill]{clip-path:inset(calc(100% - var(--h)) 0 0)}.hp4-bay-raised>i[data-fill]{z-index:2}.hp4-bay-raised>i[data-fill]:before{background-image:url(/machines/gpu-bay-fill-stripes.svg)}.hp4-bay-raised>i[data-fill]:after{display:none}.hp4-bays[data-appearance=raised] .hp4-bay-slot:focus-visible{border-radius:var(--bay-raised-radius)}@media (hover:hover) and (pointer:fine){button.hp4-bay-slot:hover .hp4-bay-raised{outline:1px solid var(--hp4-line-strong);outline-offset:2px}}.hp4-bays[data-appearance=raised][data-size=sm]{--bay-raised-scale:.5}:where(.hp4-bays[data-size=sm]) .hp4-bay-raised{height:48px}@media (width<=560px){:where(.hp4-bays[data-size=lg]) .hp4-bay-raised{height:72px}}@media (width<=480px){.md-node-bays .hp4-bay-raised{height:56px}}@media (prefers-reduced-motion:reduce){.hp4-bay-raised:before,.hp4-bay-raised:after,.hp4-bay-raised>i{transition:none}}@media (forced-colors:active){.hp4-bay-raised{outline:1px solid canvastext}.hp4-bay-slot[data-on] .hp4-bay-raised>i{forced-color-adjust:none;background:highlight}}