/* Articulated objects: shared light direction, independent surfaces and hinges. */
.studio-object .articulated{position:relative;background:none;clip-path:none;overflow:visible;filter:none;transform:perspective(900px) rotateX(var(--pitch,0deg)) rotateY(var(--yaw,0deg));animation:none!important;transition:none;container-type:inline-size}
.studio-object:is(:hover,:focus-visible) .articulated{transform:perspective(900px) rotateX(var(--pitch,0deg)) rotateY(var(--yaw,0deg));filter:none}
.articulated span{position:absolute;display:block;box-sizing:border-box}.articulated img{width:100%;height:100%;object-fit:cover;display:block}
.object-phone::before,.object-phone::after,.object-camera::after{display:none}
.object-tooltip{bottom:-4%;z-index:20}
.object-portfolio{--x:17%;--y:27%;--size:min(22vw,30vh);--rotate:-18deg;--pitch:18deg;--yaw:-14deg}
.object-camera{--x:85%;--y:30%;--size:min(18vw,26vh);--rotate:13deg;--pitch:12deg;--yaw:-12deg}
.object-basketball{--x:69%;--y:16%;--size:min(9vw,13vh);--rotate:0deg}
.object-phone{--x:15%;--y:76%;--size:min(21vw,27vh);--rotate:-17deg;--pitch:20deg;--yaw:8deg}
.object-envelope{--x:68%;--y:81%;--size:min(18vw,23vh);--rotate:21deg;--pitch:16deg}
.object-resume{--x:38%;--y:87%;--size:min(12vw,17vh);--rotate:9deg}
.object-moodboard{--x:92%;--y:72%;--size:min(11vw,16vh);--rotate:-12deg}
.object-keycap{--x:34%;--y:16%;--size:min(5vw,7vh);--rotate:20deg}
.object-acrylic{--x:53%;--y:89%;--size:min(5vw,7vh);--rotate:-15deg}
.object-badge{--x:8%;--y:47%;--size:min(8vw,12vh);--rotate:25deg}
.book-spine{left:12%;top:10%;width:78%;height:78%;border-radius:5% 3% 3% 5%;background:#0a1a48;box-shadow:6px 12px 11px #48151155}
.book-pages{left:17%;top:12%;width:72%;height:73%;background:repeating-linear-gradient(#fff8e9 0 2px,#c9c1ac 2px 3px);border-radius:2%;box-shadow:2px 3px 1px #fff0c9}
.project-print{left:5%;top:5%;width:90%;height:88%;padding:6% 6% 18%;background:#f8f5ec;box-shadow:1px 3px 5px #09112c55;transform-origin:10% 85%}
.print-a{transform:rotate(-3deg)}.print-b{transform:rotate(3deg)}.print-c{transform:rotate(-1deg)}
.book-cover{left:12%;top:9%;width:78%;height:76%;border-radius:4% 3% 3% 4%;background:repeating-linear-gradient(90deg,#ffffff05 0 1px,transparent 1px 3px),linear-gradient(120deg,#285eb2,#10295b);border:1px solid #7393c466;box-shadow:inset 4px 0 4px #071b58, inset 0 2px 1px #9bb5df88,2px 3px 2px #07122580;transform-origin:3% 50%;transform-style:preserve-3d}
.book-cover>img{position:absolute;left:26%;top:36%;width:46%;height:30%;object-fit:contain}.book-rule{left:9%;top:0;height:100%;width:1px;background:#030e3c55}.book-elastic{right:9%;height:100%;width:4%;background:linear-gradient(90deg,#061435,#213561,#05102e);box-shadow:1px 0 2px #0006}
.is-playing .book-cover{animation:book-open 4.2s both}.is-playing .print-a{animation:print-a 4.2s both}.is-playing .print-b{animation:print-b 4.2s both}
@keyframes book-open{0%,100%{transform:perspective(700px) rotateY(0)}20%,72%{transform:perspective(700px) rotateY(-112deg)}}
@keyframes print-a{0%,100%{transform:rotate(-3deg)}28%,70%{transform:translate(20%,-32%) rotate(-18deg)}}
@keyframes print-b{0%,100%{transform:rotate(3deg)}35%,65%{transform:translate(44%,-13%) rotate(17deg)}}
.camera-body{left:6%;top:12%;width:88%;height:70%;border-radius:15% 15% 9% 9%;background:linear-gradient(145deg,#fff8e6,#d9d1be 68%,#b4a68e);box-shadow:inset 2px 3px 3px #fff, inset -4px -6px 4px #978773,5px 9px 0 #a59a88,8px 18px 13px #48151155;z-index:2}
.camera-top{inset:0 0 auto;height:21%;border-radius:20% 20% 0 0;background:linear-gradient(#e9a3a6,#bc747b)}
.camera-viewfinder{left:13%;top:27%;width:15%;height:14%;border:3px solid #74685b;background:linear-gradient(135deg,#111a21,#3d4b49);border-radius:23%;box-shadow:0 1px 1px #fff}
.camera-flash-panel{right:9%;top:24%;width:20%;height:18%;border-radius:15%;background:repeating-linear-gradient(90deg,#b6b3a6 0 2px,#eeede6 2px 4px);border:3px solid #c1bcab}
.camera-lens{left:31%;top:30%;width:42%;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,#222 0 2px,#45433d 3px 4px);box-shadow:2px 5px 5px #0008,0 0 0 3px #e8dfcb;z-index:3}
.lens-glass{inset:17%;border-radius:50%;background:radial-gradient(ellipse at 65% 30%,#beb3ff 0 4%,#48516e 8%,#101b24 29%,#020609 52%,#305a51 70%,#0b151e 85%);box-shadow:inset 0 0 8px #000}.lens-glint{left:25%;top:23%;width:22%;height:10%;border-radius:50%;background:#fff8;transform:rotate(-30deg)}
.camera-button{left:12%;top:57%;width:15%;aspect-ratio:1;background:linear-gradient(135deg,#f8adad,#aa555f);border-radius:50%;box-shadow:1px 3px 0 #854851}
.camera-stripe{left:43%;bottom:5%;height:34%;width:17%;background:linear-gradient(90deg,#ee6771 0 25%,#f5c366 25% 50%,#7baa9d 50% 75%,#6986bd 75%)}
.camera-slot{left:10%;bottom:5%;width:80%;height:8%;background:#211e20;border-radius:5px;box-shadow:0 -2px 0 #94867b,0 2px 0 #ffedd9}
.camera-print{left:20%;top:51%;width:62%;height:55%;padding:5% 5% 15%;background:#faf6e9;box-shadow:1px 3px 3px #48151150;transform:translateY(-60%);z-index:1}
.camera-flare{right:5%;top:17%;width:30%;height:30%;background:radial-gradient(#fff,#fff0 70%);opacity:0;z-index:4}
.is-playing .camera-print{animation:photo-print 4.2s both}.is-playing .camera-flare{animation:exposure 4.2s both}
@keyframes photo-print{0%,14%,100%{transform:translateY(-60%)}57%{transform:translateY(65%)}72%,88%{transform:translate(7%,78%) rotate(7deg)}}
@keyframes exposure{0%,8%,16%,100%{opacity:0;scale:1}11%{opacity:1;scale:5}}
.mail-shell{inset:18% 5%;filter:drop-shadow(4px 9px 5px #48151144);perspective:600px}
.mail-back{inset:0;background:#bba685;border-radius:4%}
.mail-front{inset:0;background:conic-gradient(from 55deg at 50% 60%,#e9dfcb 0 70deg,#f4ead7 70deg 180deg,#dacbb0 180deg 250deg,#f0e7d5 250deg);clip-path:polygon(0 0,50% 55%,100% 0,100% 100%,0 100%);z-index:3}
.mail-flap{inset:0;background:linear-gradient(#fff7e4,#d7c6a8);clip-path:polygon(0 0,100% 0,50% 62%);transform-origin:50% 0;z-index:4}
.mail-seal{left:42%;top:44%;width:17%;aspect-ratio:1;border-radius:50%;background:radial-gradient(#b72f2a,#8d191b 60%,#cb4b37 65%,#851b18);box-shadow:1px 2px 2px #53251f77;z-index:5}
.mail-letter{left:8%;top:5%;width:84%;height:85%;padding:12%;background:#fff8e9;z-index:2}.letter-line{position:relative!important;width:100%;height:2%;margin:10% 0;background:#b9aa91}
.paper-flight{left:11%;top:20%;width:78%;height:60%;perspective:500px;opacity:0;z-index:6;filter:drop-shadow(3px 8px 4px #48151144)}
.plane-wing{inset:0;background:linear-gradient(135deg,#fffef7,#d6d0bb);transform-origin:50% 50%}.wing-left{clip-path:polygon(0 0,100% 42%,30% 53%)}.wing-right{clip-path:polygon(100% 42%,30% 53%,10% 100%);background:#fff5dc}.plane-keel{inset:0;clip-path:polygon(30% 53%,100% 42%,37% 72%);background:#a89d85}
.is-playing .mail-flap{animation:flap-fold 4.2s both}.is-playing .mail-seal{animation:seal-release 4.2s both}.is-playing .mail-letter{animation:letter-rise 4.2s both}.is-playing .mail-shell{animation:envelope-rest 4.2s both}.is-playing .paper-flight{animation:plane-launch 4.2s both}.is-playing .wing-left{animation:wing-fold 4.2s both}
@keyframes flap-fold{0%,100%{transform:rotateX(0)}15%,80%{transform:rotateX(180deg);z-index:1}}
@keyframes seal-release{0%,100%{opacity:1}8%,90%{opacity:0}}
@keyframes letter-rise{0%,100%{transform:translateY(0);opacity:1}25%{transform:translateY(-65%);opacity:1}36%,90%{transform:translateY(-65%);opacity:0}}
@keyframes envelope-rest{0%,100%{opacity:1}38%,82%{opacity:.45}}
@keyframes wing-fold{0%,27%{transform:rotateX(-90deg)}42%,100%{transform:rotateX(0)}}
@keyframes plane-launch{0%,25%{opacity:0;transform:translateY(-45%) rotate(-12deg) scale(.9)}36%,46%{opacity:1;transform:translateY(-45%) rotate(-12deg) scale(1)}72%{opacity:1;transform:translate(120%,-150%) rotate(-22deg) scale(.75)}85%,100%{opacity:0;transform:translate(260%,-230%) rotate(-30deg) scale(.45)}}
.ball-sphere{left:9%;top:7%;width:82%;height:82%;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 30% 20%,#f4a0a0,#cc737a 50%,#93414f 85%);box-shadow:inset -5px -7px 10px #57233766,inset 2px 2px 4px #ffccbf88;transform-origin:50% 100%}
.ball-seam{border:2px solid #532c38;border-radius:50%;box-shadow:1px 1px 0 #f4ae9a66}.seam-a{left:37%;top:-10%;width:26%;height:120%;transform:rotate(-24deg)}.seam-b{left:-10%;top:37%;width:120%;height:25%;transform:rotate(-24deg)}.seam-c{left:-28%;top:-2%;width:157%;height:105%;transform:rotate(36deg)}
.ball-grain{inset:0;border-radius:50%;background:radial-gradient(#542b382e .6px,transparent 1px);background-size:3px 3px;mix-blend-mode:multiply}.ball-shadow{left:12%;bottom:2%;width:78%;height:12%;border-radius:50%;background:#531b25;filter:blur(5px);opacity:.32}
.phone-base{left:5%;top:40%;width:90%;height:45%;border-radius:40% 40% 20% 20%;background:linear-gradient(140deg,#b7d2b2,#6e9679 60%,#3b604c);box-shadow:inset 2px 3px 2px #d7e7bf,3px 7px 0 #345944,6px 13px 9px #48151144}
.phone-dial{left:32%;top:15%;width:37%;aspect-ratio:1;border-radius:50%;background:radial-gradient(#e8d9aa 0 27%,#6f7d60 28% 38%,#b3c5a4 39% 70%,#566d54 72%);border:2px solid #547658;box-shadow:1px 3px 3px #213f35}
.dial-hole{left:43%;top:43%;width:14%;height:14%;border-radius:50%;background:#354f3d;transform:rotate(calc(var(--n)*32deg)) translateY(-215%);box-shadow:inset 1px 1px 1px #102a20}
.phone-cradle{top:-14%;width:12%;height:27%;border-radius:20%;background:linear-gradient(90deg,#486d51,#adc69c,#50785a)}.cradle-left{left:14%}.cradle-right{right:14%}
.phone-receiver{left:1%;top:24%;width:98%;height:28%;transform-origin:20% 60%;filter:drop-shadow(2px 4px 2px #24473577);z-index:3}.receiver-bridge{left:15%;top:0;width:70%;height:48%;border-radius:45% 45% 10% 10%;background:linear-gradient(#cee0b8,#69916f 65%,#3d644e)}
.receiver-ear{top:10%;width:28%;height:90%;border-radius:38% 38% 22% 22%;background:linear-gradient(110deg,#c3dbb0,#719b78 50%,#365d47);box-shadow:inset 1px 2px 2px #e3edc8,0 3px 0 #244d3a}.ear-left{left:0;rotate:12deg}.ear-right{right:0;rotate:-12deg}.ear-grille{inset:25% 22%;border-radius:50%;background:radial-gradient(#2b573a 1px,transparent 1.8px);background-size:5px 5px}
.phone-cord{left:-5%;top:42%;width:30%;height:50%;border:7px dotted #486d52;border-right-color:transparent;border-radius:50%;transform:rotate(12deg)}
.is-playing .phone-receiver{animation:receiver-ring 4.2s both}.is-playing .phone-cord{animation:cord-tug 4.2s both}
@keyframes receiver-ring{0%,100%,40%,80%{transform:none}8%,18%,28%,55%,65%{transform:translateY(-18%) rotate(-7deg)}13%,23%,33%,60%,70%{transform:translateY(-8%) rotate(5deg)}}
@keyframes cord-tug{0%,100%,40%,80%{transform:rotate(12deg)}10%,25%,58%,68%{transform:rotate(4deg) scaleY(1.12)}}
.badge-strap{left:38%;top:0;width:28%;height:48%;border:7px solid #d5cbb5;border-radius:50%;box-shadow:1px 2px 2px #49191155}.badge-card{left:17%;top:38%;width:66%;height:56%;border-radius:10%;background:linear-gradient(130deg,#3a71ae,#143461);border:2px solid #719bc5;box-shadow:3px 5px 4px #48151144;transform-origin:50% 0}.badge-in{inset:15%;background:#eee9d9;color:#224372;font:bold 32cqw Arial;text-align:center;line-height:1.2}.badge-clip{left:42%;top:-15%;width:16%;height:25%;border:3px solid #b9b8aa;border-radius:4px}.is-playing .badge-card{animation:tag-rock 4.2s both}
.cv-sheet{left:14%;top:14%;width:73%;height:76%;background:#f6efdf;box-shadow:2px 3px 3px #48151144;padding:8%}.cv-back{rotate:-8deg}.cv-front{rotate:3deg;transform-origin:50% 0}.cv-heading{position:relative!important;font:25cqw Georgia;color:#484136}.cv-line{position:relative!important;height:2px;background:#a39a85;margin-top:12%;width:85%}.cv-line:nth-child(even){width:60%}.cv-clip{top:7%;left:43%;width:20%;height:15%;border:3px solid #79796d;border-radius:20%;background:#44443c}.is-playing .cv-front{animation:page-lift 4.2s both}
.board-frame{inset:12%;background:radial-gradient(#765433 1px,transparent 1px),#b7996c;background-size:4px 4px;border:5px solid #d2bc8e;box-shadow:2px 5px 4px #48151144}.board-note{width:40%;height:44%;box-shadow:1px 2px 3px #35291f66}.note-a{left:5%;top:5%;background:#eee9d8;rotate:-8deg}.note-b{right:4%;top:12%;background:#e8a7a1;rotate:5deg}.board-photo{left:14%;bottom:4%;width:65%;height:50%;padding:3%;background:#fff5db;rotate:-7deg;transform-origin:50% 0}.board-pin{left:46%;top:3%;width:12%;aspect-ratio:1;background:radial-gradient(at 30% 20%,#ffaba1,#ab2828);border-radius:50%;box-shadow:1px 3px 2px #0005}.is-playing .board-photo{animation:page-lift 4.2s both}
.key-base{inset:12%;border-radius:15%;background:#292b30;box-shadow:4px 6px 3px #48151155}.key-top{inset:12% 17% 24%;border-radius:12%;background:linear-gradient(130deg,#696a70,#383a41);color:#eee8da;text-align:center;font:40cqw Arial;padding-top:5%;box-shadow:inset 1px 1px #a9a8a1,0 5px #22242a}.is-playing .key-top{animation:key-press 4.2s both}
.acrylic-front,.acrylic-back{inset:0;text-align:center;font:bold 100cqw Arial;color:#1b5fc1;text-shadow:1px 1px #81b5f9}.acrylic-back{translate:5px 7px;color:#14336a;filter:drop-shadow(3px 5px 2px #48151155)}.is-playing .acrylic-front{animation:tag-rock 4.2s both}
@keyframes tag-rock{0%,100%{rotate:0deg}15%{rotate:15deg}35%{rotate:-10deg}55%{rotate:6deg}75%{rotate:-3deg}}
@keyframes page-lift{0%,100%{transform:perspective(300px) rotateX(0)}25%,50%{transform:perspective(300px) rotateX(-30deg)}}
@keyframes key-press{0%,100%,35%{translate:0 0}15%,25%{translate:0 5px;box-shadow:inset 1px 1px #a9a8a1,0 1px #22242a}}
@media(max-width:700px){.object-portfolio{--x:23%;--y:23%;--size:32vw}.object-camera{--x:81%;--y:27%;--size:29vw}.object-basketball{--x:61%;--y:13%;--size:17vw}.object-phone{--x:23%;--y:73%;--size:34vw}.object-envelope{--x:76%;--y:79%;--size:29vw}.object-badge{--x:9%;--y:42%;--size:17vw}.object-resume{--x:46%;--y:88%;--size:21vw}.object-moodboard{--x:85%;--y:57%;--size:21vw}.object-keycap{--x:44%;--y:14%;--size:11vw}.object-acrylic{--x:61%;--y:67%;--size:10vw}}
@media(prefers-reduced-motion:reduce){.articulated *{animation:none!important;transition:none!important}}
.book-cover>img,.book-elastic,.book-rule{backface-visibility:hidden;transform:translateZ(.5px)}