/* Ideas C and A + C: the cube on the seam */
.cube-canvas{position:fixed;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.gate.cube-studio .cube-canvas{z-index:0}
.gate.cube-studio .half{z-index:1}
.gate.cube-overlay .cube-canvas{z-index:2}
/* the line between the worlds */
.seamline{position:absolute;z-index:2;top:0;bottom:0;left:calc(var(--s)*100%);width:2px;transform:translateX(-1px);pointer-events:none;
 background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.85) 18%,rgba(255,255,255,.85) 82%,rgba(255,255,255,0));box-shadow:-6px 0 18px rgba(120,220,255,.55),6px 0 18px rgba(255,190,110,.55)}
.gate.v .seamline{top:calc(var(--s)*100%);bottom:auto;left:0;right:0;width:auto;height:2px;transform:translateY(-1px);background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.85) 15%,rgba(255,255,255,.85) 85%,rgba(255,255,255,0));box-shadow:0 -6px 18px rgba(120,220,255,.55),0 6px 18px rgba(255,190,110,.55)}
.gate.entering .seamline{opacity:0;transition:opacity .3s}

/* C: both titles sit at the top, the cube owns the middle */
.cube-studio .labcard{top:clamp(16px,3vh,32px);bottom:auto;width:min(400px,calc(100cqw - 110px))}
.cube-studio .labcard h2{font-size:clamp(24px,2.8vw,38px)}
.cube-studio .kp-sign.flat{top:clamp(16px,3vh,32px);right:clamp(16px,4cqw,56px);width:min(380px,calc(100cqw - 110px));padding-top:0;transform:rotate(1.2deg)}
.kp-sign.flat::before,.kp-sign.flat::after{display:none}
.cube-studio .kp-big{font-size:min(clamp(28px,3.1vw,44px),14.5cqi)}
@container half (max-width:470px){.cube-studio .labcard p,.cube-studio .kp-sign p{display:none}.cube-studio .labcard,.cube-studio .kp-sign.flat{width:calc(100cqw - 100px)}}
.gate.v.cube-studio .labcard{top:10px;left:10px;width:auto;max-width:calc(100% - 76px)}
.gate.v.cube-studio .kp-sign.flat{top:auto;bottom:52px;left:12px;right:12px;width:auto;transform:rotate(-1deg)}

/* A + C: the cube stands at the foot of the line, so the lab card keeps clear of it; on phones the brand disc gives way to the cube */
.gate:not(.v).cube-overlay .labcard{width:min(440px,calc(100cqw - 150px))}
.gate.v.cube-overlay .brandmark,.gate.v.cube-studio .brandmark{display:none}
