.door-art{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0;opacity:var(--sketch-visibility,1)}.ink-strand{position:absolute;width:32vw;height:32vh;color:#262a22;will-change:transform;transform:translate3d(var(--ix,0px),var(--iy,0px),0) rotate(var(--ir,0deg))}.ink-strand svg{width:100%;height:100%;overflow:visible}.ink-strand path{stroke:currentColor;stroke-width:6.5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.ink-strand .ink-tip{stroke-width:4.5}.left-high{left:-6%;top:9%;transform-origin:left top}.left-mid{left:-7%;top:38%;transform-origin:left center}.left-low{left:-6%;bottom:4%;transform-origin:left bottom}.right-high{right:-6%;top:9%;transform-origin:right top}.right-mid{right:-7%;top:38%;transform-origin:right center}.right-low{right:-6%;bottom:4%;transform-origin:right bottom}.top-left{left:19%;top:-10%;width:22vw;height:29vh;transform-origin:top center}.top-right{right:19%;top:-10%;width:22vw;height:29vh;transform-origin:top center}.bottom-left{left:15%;bottom:-13%;width:23vw;height:31vh;transform-origin:bottom center}.bottom-right{right:15%;bottom:-13%;width:23vw;height:31vh;transform-origin:bottom center}.entry-layer .intro,.entry-layer .threshold,.entry-layer .entrance-foot{z-index:1}@media(max-width:700px){.ink-strand{width:36vw;height:24vh}.ink-strand path{stroke-width:4.5}.ink-strand .ink-tip{stroke-width:3}.left-high{left:-12%;top:17%}.right-high{right:-12%;top:17%}.left-mid{left:-13%;top:40%}.right-mid{right:-13%;top:40%}.left-low{left:-12%;bottom:13%}.right-low{right:-12%;bottom:13%}.top-left{left:1%;top:-9%;width:29vw;height:24vh}.top-right{right:1%;top:-9%;width:29vw;height:24vh}.bottom-left{left:8%;bottom:-8%;width:29vw;height:26vh}.bottom-right{right:8%;bottom:-8%;width:29vw;height:26vh}}@media(prefers-reduced-motion:reduce){.ink-strand{transform:none;will-change:auto}}
.ink-tag{width:clamp(115px,16vw,235px);height:auto;aspect-ratio:240/250;transform-origin:center}.ink-tag path{stroke-width:5}.tag-left{left:9%;top:34%;rotate:-9deg}.tag-right{right:8%;top:36%;rotate:8deg}@media(max-width:700px){.ink-tag{width:22vw;height:auto}.ink-tag path{stroke-width:3.5}.tag-left{left:0;top:36%}.tag-right{right:0;top:39%}}
/* Reference lettering: overlapping, irregular pen strokes, not a font. */
.ink-tag path{stroke-width:6;stroke-linecap:round;stroke-linejoin:round}.tag-left{width:clamp(150px,22vw,320px);aspect-ratio:300/250;left:4%;top:31%;rotate:-7deg}.tag-right{width:clamp(190px,27vw,410px);aspect-ratio:520/170;right:1%;top:45%;rotate:8deg}.ink-tag .tag-swish{stroke-width:3}.ref-crown{left:13%;top:13%;width:100px;height:65px;rotate:-13deg}.ref-heart{right:12%;top:68%;width:90px;height:85px;rotate:12deg}.ref-asterisk{right:15%;top:21%;width:62px;height:62px;rotate:9deg}.ref-crown path,.ref-heart path,.ref-asterisk path{stroke-width:6}@media(max-width:700px){.tag-left{left:-2%;top:34%;width:26vw}.tag-right{right:-5%;top:48%;width:30vw;rotate:72deg}.ink-tag path{stroke-width:3}.ref-crown{left:4%;top:20%;width:51px;height:35px}.ref-heart{right:5%;top:71%;width:47px;height:44px}.ref-asterisk{right:5%;top:26%;width:35px;height:35px}.ref-crown path,.ref-heart path,.ref-asterisk path{stroke-width:4}}
/* Reserve an unobstructed lane for the wordmark between the right-hand strokes. */
.ink-tag.tag-right{right:3%;top:40%;width:29vw;max-width:440px;height:auto;aspect-ratio:650/90;rotate:-5deg}.ink-tag.tag-right path{stroke-width:4.5}.right-mid{display:none}.right-high{top:1%;height:27vh}.right-low{bottom:0%;height:27vh}@media(max-width:700px){.ink-tag.tag-right{right:3%;top:73%;width:43vw;max-width:none;rotate:-4deg}.ink-tag.tag-right path{stroke-width:2.5}.right-high{top:15%;height:22vh}.right-low{bottom:21%;height:19vh}.bottom-right{right:0;bottom:-15%;width:25vw;height:22vh}}
/* Full perimeter restored; the lower-right gap is reserved for the tag. */
.ink-strand:not(.ink-tag) path{stroke-width:10}.right-mid{display:block;right:-7%;top:35%;height:27vh}.right-low{right:-10%;bottom:-4%;width:30vw;height:23vh}.bottom-right{right:23%;bottom:-15%;width:21vw;height:28vh}.ink-tag.tag-right{right:3%;top:auto;bottom:19%;width:28vw;max-width:440px;height:auto;aspect-ratio:1780/570;rotate:-12deg}.ink-tag.tag-right path{stroke-width:29;vector-effect:none}.ink-tag.tag-right svg{overflow:visible}@media(max-width:700px){.ink-strand:not(.ink-tag) path{stroke-width:6.5}.right-mid{right:-13%;top:37%;height:22vh}.right-low{right:-15%;bottom:3%;width:34vw;height:20vh}.bottom-right{right:27%;bottom:-13%;width:23vw;height:25vh}.ink-tag.tag-right{right:2%;bottom:22%;top:auto;width:37vw;max-width:none;rotate:-14deg}.ink-tag.tag-right path{stroke-width:29}}
@media(max-width:700px){.ink-tag.tag-right{position:fixed;left:50%;right:auto;top:calc(27svh + min(82vw,36svh)/.64 + 20px);bottom:auto;width:36vw;max-width:160px;rotate:-5deg;translate:-50% 0;aspect-ratio:1780/570}}
/* Original transparent spray-paint assets retain their grain and overspray. */
.ink-strand .spray-stroke{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none;user-select:none}.left-high .spray-stroke{transform:rotate(18deg)}.left-mid .spray-stroke{transform:rotate(-7deg)}.left-low .spray-stroke{transform:scaleY(-1) rotate(15deg)}.right-high .spray-stroke{transform:scaleX(-1) rotate(18deg)}.right-mid .spray-stroke{transform:scaleX(-1) rotate(-7deg)}.right-low .spray-stroke{transform:scale(-1) rotate(15deg)}.top-left .spray-stroke{transform:rotate(-15deg)}.top-right .spray-stroke{transform:scaleX(-1) rotate(-15deg)}.bottom-left .spray-stroke{transform:scaleY(-1) rotate(-15deg)}.bottom-right .spray-stroke{transform:scale(-1) rotate(-15deg)}
/* Desktop composition from the supplied reference. */
@media(min-width:701px){
 .entry-layer .threshold{top:27%;width:35svh}
 .entry-layer .intro{top:14%}
 .entry-layer .intro h1{font-size:clamp(36px,4.7svh,52px)}
 .entry-layer .intro .eyebrow{font-size:8px;letter-spacing:1.8px;margin-bottom:14px}
 .left-high{left:-6%;top:9%;width:32vw;height:32vh}
 .left-mid{left:-7%;top:38%;width:32vw;height:32vh}
 .left-low{left:-6%;bottom:4%;width:32vw;height:32vh}
 .right-high{right:-6%;top:1%;width:32vw;height:27vh}
 .right-mid{right:-7%;top:35%;width:32vw;height:27vh}
 .right-low{right:-10%;bottom:-4%;width:30vw;height:23vh}
 .top-left{left:19%;top:-10%;width:22vw;height:29vh}
 .top-right{right:19%;top:-10%;width:22vw;height:29vh}
 .bottom-left{left:15%;bottom:-13%;width:23vw;height:31vh}
 .bottom-right{right:23%;bottom:-15%;width:21vw;height:28vh}
 .ink-tag.tag-right{right:4%;bottom:17%;top:auto;width:25vw;max-width:390px;rotate:-12deg}
 .ref-crown{left:13%;top:13%;width:75px;height:49px}
 .entry-layer .door-cue{bottom:-32px;font-size:10px}
}
/* Place the spray marks by the reference's screen-edge entry points. */
@media(min-width:701px){
 .left-high{left:-8%;top:5%;width:31vw;height:33vh}
 .left-mid{left:-8%;top:33%;width:31vw;height:32vh}
 .left-low{left:-9%;top:62%;bottom:auto;width:32vw;height:30vh}
 .right-high{right:-5%;top:3%;width:30vw;height:27vh}
 .right-mid{right:-10%;top:40%;width:34vw;height:20vh}
 .right-low{right:-7%;top:auto;bottom:-9%;width:29vw;height:25vh}
 .top-left{left:17%;top:-13%;width:23vw;height:31vh}
 .top-right{right:20%;top:-17%;width:21vw;height:35vh}
 .bottom-left{left:13%;bottom:-16%;width:25vw;height:30vh}
 .bottom-right{right:24%;bottom:-20%;width:20vw;height:31vh}
 .left-high .spray-stroke{transform:rotate(9deg)}
 .left-mid .spray-stroke{transform:rotate(-13deg)}
 .left-low .spray-stroke{transform:scaleY(-1) rotate(8deg)}
 .right-high .spray-stroke{transform:scaleX(-1) rotate(3deg)}
 .right-mid .spray-stroke{transform:scaleX(-1) rotate(8deg)}
 .top-left .spray-stroke{transform:rotate(-6deg)}
 .top-right .spray-stroke{transform:scaleX(-1) rotate(-24deg)}
 .bottom-left .spray-stroke{transform:scaleY(-1) rotate(-3deg)}
 .bottom-right .spray-stroke{transform:scale(-1) rotate(-25deg)}
}
/* Anchor spray strokes beyond the viewport; only their inward ends enter. */
@media(min-width:701px){
 .left-high{left:-18%;top:5%;width:39vw;height:32vh}
 .left-mid{left:-17%;top:33%;width:36vw;height:31vh}
 .left-low{left:-18%;top:62%;bottom:auto;width:39vw;height:30vh}
 .right-high{right:-17%;top:3%;width:36vw;height:28vh}
 .right-mid{right:-19%;top:38%;width:40vw;height:22vh}
 .right-low{right:-17%;bottom:-9%;top:auto;width:36vw;height:28vh}
 .top-left{left:15%;top:-24%;width:24vw;height:36vh}
 .top-right{right:17%;top:-26%;width:24vw;height:38vh}
 .bottom-left{left:13%;bottom:-25%;width:26vw;height:36vh}
 .bottom-right{right:23%;bottom:-27%;width:23vw;height:37vh}
 .left-high .spray-stroke{transform:rotate(15deg)}
 .left-mid .spray-stroke{transform:rotate(-7deg)}
 .left-low .spray-stroke{transform:scaleY(-1) rotate(15deg)}
 .right-high .spray-stroke{transform:scaleX(-1) rotate(18deg)}
 .right-mid .spray-stroke{transform:scaleX(-1) rotate(-7deg)}
}

/* Preserve the original spray grain instead of stretching it to viewport height. */
.ink-strand .spray-stroke{object-fit:contain}
@media(max-width:700px){
 .left-high,.left-low,.right-mid{width:60vw;height:auto;aspect-ratio:1702/630}
 .left-high,.left-low{left:-40vw}.right-mid{right:-40vw}
 .left-mid,.right-high,.right-low{width:45vw;height:auto;aspect-ratio:848/464}
 .left-mid{left:-26vw}.right-high,.right-low{right:-26vw}
 .top-left,.top-right,.bottom-left,.bottom-right{height:auto;aspect-ratio:395/456}
 .top-left,.top-right{top:-8vw}.bottom-left,.bottom-right{bottom:-14vw}
}
