.opening.opening-reel{background:#181b18;animation:reel-exit .7s cubic-bezier(.76,0,.24,1) 1.75s both;pointer-events:auto}.opening-art{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;overflow:hidden}.opening-reel .opening-label{position:relative;z-index:1;font-size:12px;margin-bottom:30px;animation:reel-label .7s ease both}.reel-title{position:relative;z-index:1;display:flex;flex-direction:column;font:800 clamp(85px,16vw,225px)/.79 var(--display);letter-spacing:-.025em}.reel-title>span{animation:reel-type .85s cubic-bezier(.18,.8,.25,1) both}.reel-title>span:last-child{color:#b7aa80;animation-delay:.17s;margin-left:15%}.reel-orbit{position:absolute;left:50%;top:50%;width:min(67vw,620px);aspect-ratio:1;border:1px solid #b2a47a80;border-radius:50%;animation:orbit-arrive 1.6s cubic-bezier(.15,.7,.3,1) both;transform:translate(-50%,-50%)}.reel-orbit.second{width:min(57vw,525px);border-style:dashed;border-color:#c8bf9838;animation-delay:.12s}.opening-reel .opening-rule{margin-top:40px;animation:rule-arrive 1.3s .2s ease both;width:220px}.opening-reel .opening-note{font-size:12px;letter-spacing:.25em;animation:reel-label .8s .5s both}.skip-intro{position:absolute;bottom:32px;right:var(--gutter);border:1px solid #777d68;background:#252a22;color:#dedecd;padding:12px 17px;font:12px var(--mono);cursor:pointer}.replay-intro{display:block;padding:8px 0;margin-top:14px;color:#bcb69c;background:none;border:0;font:12px var(--mono);cursor:pointer;letter-spacing:.04em;transition:color .2s}.replay-intro:hover{color:#e5d5a7}.replay-intro:disabled{opacity:.4}.hero-art{border-top:1px solid #4c5545;isolation:isolate}.hero-art:after{content:'';position:absolute;width:80%;height:60%;left:10%;top:14%;border:1px solid #a899652a;border-radius:50%;transform:rotate(-25deg);pointer-events:none;animation:stage-halo 12s ease-in-out infinite;z-index:-1}.hero-art>svg{opacity:.52;transition:opacity .5s}.hero-clothes{z-index:2}.hero-hood,.hero-pants{cursor:pointer;transition:filter .45s,scale .45s,opacity .45s;outline-offset:0;border-radius:8px}.hero-hood:focus-visible,.hero-pants:focus-visible{outline:1px dashed #d6c899}.hero-hood .drawing{animation:hood-adventure 7s ease-in-out infinite;filter:drop-shadow(6px 18px 6px #10151070)}.hero-pants .drawing{animation:pants-adventure 8s ease-in-out infinite;filter:drop-shadow(6px 18px 6px #10151070)}.piece-active .hero-hood:not(.piece-selected),.piece-active .hero-pants:not(.piece-selected){opacity:.42;filter:blur(1px)}.piece-selected{scale:1.09;z-index:4}.piece-selected .drawing{animation-play-state:paused;filter:drop-shadow(0 0 15px #cdbd7940)}.stage-hint{position:absolute;bottom:14px;left:12px;right:12px;text-align:center;z-index:4;color:#d2c9ac;font:11px/1.5 var(--mono);letter-spacing:.055em;pointer-events:none}.sketch-caption{display:none}.ink-motes{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}.ink-motes i{position:absolute;width:3px;height:3px;background:#d6c695;border-radius:50%;animation:ink-drift var(--duration) var(--delay) linear infinite;box-shadow:0 0 8px #c7b77b88}.hero-foot a span{animation:scroll-nudge 1.8s ease-in-out infinite}.ticker{transform:rotate(-.6deg);position:relative;z-index:3}.ticker div{animation-duration:28s}.product-art:before{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 25%,#c9bd7c12 48%,transparent 65%);transform:translateX(-110%);transition:transform .7s;pointer-events:none;z-index:2}.product:hover .product-art:before,.product:focus-visible .product-art:before{transform:translateX(110%)}.product:hover .garment{transform:translateY(-10px) rotate(-3deg)}.product-arrow{transition:transform .35s,background .35s}.product:hover .product-arrow{transform:rotate(45deg);background:#b7a77a;color:#171c14}.button.primary:hover{box-shadow:0 0 25px #baac7330;transform:translateY(-3px)}.closing{overflow:hidden}.closing p{transition:letter-spacing .7s,color .7s}.closing:hover p{letter-spacing:.015em;color:#cfc199}
@keyframes reel-exit{0%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 100% 0);visibility:hidden}}@keyframes reel-type{from{opacity:0;transform:translateY(100px) rotate(5deg);filter:blur(8px)}to{opacity:1;transform:translateY(0) rotate(0);filter:blur(0)}}@keyframes reel-label{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes orbit-arrive{from{opacity:0;transform:translate(-50%,-50%) scale(.3) rotate(-90deg)}to{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0)}}@keyframes hood-adventure{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-11px) rotate(1.4deg)}}@keyframes pants-adventure{0%,100%{transform:translateY(0) rotate(.7deg)}50%{transform:translateY(9px) rotate(-1.2deg)}}@keyframes stage-halo{0%,100%{transform:rotate(-25deg) scale(1);opacity:.3}50%{transform:rotate(25deg) scale(1.1);opacity:.8}}@keyframes ink-drift{0%{translate:0 35px;opacity:0}20%{opacity:.6}80%{opacity:.3}100%{translate:25px -100px;opacity:0}}@keyframes scroll-nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.motion-off .opening,.motion-off .ink-motes{display:none}.motion-off .piece-selected{scale:1}.motion-off .hero-clothes{transform:none}
@media(max-width:700px){.reel-orbit{width:90vw}.reel-orbit.second{width:76vw}.reel-title{font-size:26vw}.opening-reel .opening-label{font-size:10px}.skip-intro{bottom:24px}.stage-hint{font-size:10px;bottom:11px}.replay-intro{margin-top:10px}.hero-art{margin-top:0}.piece-active .hero-hood:not(.piece-selected),.piece-active .hero-pants:not(.piece-selected){opacity:.75;filter:none}}
@media(prefers-reduced-motion:reduce){.opening.opening-reel,.ink-motes{display:none}*,*::before,*::after{animation:none!important;transition:none!important}.piece-selected{scale:1}}
