.social-phone-trigger{position:absolute;left:550px;top:457px;width:42px;height:65px;z-index:5;transform:rotate(12deg);border-radius:9px;padding:0;background:transparent;transition:box-shadow .3s ease}
.social-phone-trigger:hover,.social-phone-trigger:focus-visible{box-shadow:0 0 14px #f078c54d,inset 0 0 10px #f078c524}
.social-phone-hint{position:absolute;left:45px;top:3px;width:139px;padding:10px 13px;opacity:0;visibility:hidden;transform:rotate(-12deg);text-align:left;pointer-events:none;transition:opacity .25s ease,visibility .25s}
.social-phone-hint b{font-size:13px}.social-phone-hint small{display:block;font-size:11px;margin-top:4px;font-weight:500;color:var(--text-secondary)}
.social-phone-trigger:hover .social-phone-hint,.social-phone-trigger:focus-visible .social-phone-hint{opacity:1;visibility:visible}
.in-scene .social-phone-trigger{visibility:hidden}
.social-phone-layer{position:absolute;inset:0;z-index:30;isolation:isolate}
.social-phone-shade{position:absolute;inset:0;background:#08050d40}
.social-phone-object{position:absolute;left:660px;top:34px;width:624px;height:936px;transform-origin:center;filter:drop-shadow(0 18px 22px #0008)}
.phone-silhouette{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.social-phone-close{position:absolute;right:45px;top:32px;padding:10px 16px;color:var(--pink-text);font-size:25px;z-index:2}.social-phone-close span{font-size:12px;margin-left:10px}
.social-mili{position:absolute;left:38.6%;top:33.6%;width:9%;height:7%;object-fit:contain;border-radius:50%;border:2px solid #df60b1;background:#1d101e;transform:rotate(-8deg)}
.phone-hit{position:absolute;cursor:pointer;border-radius:6px;background:transparent}.phone-hit:focus-visible{outline:2px solid var(--pink-text);outline-offset:-2px}.phone-hit:hover{background:#f078c510}
.phone-us{left:25.5%;top:33.5%;width:11%;height:9%}.phone-life{left:38%;top:33.5%;width:11%;height:9%}
.phone-post-hits{position:absolute;left:19%;top:47%;width:57%;height:35%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);transform:skewX(-4deg)}
.phone-post-hits .phone-hit{position:relative}
.phone-post-view{position:absolute;left:22%;top:14%;width:55%;height:69%;background:#09090d;border-radius:14px;padding:18px;transform:skewX(-4deg);color:var(--text-primary)}
.phone-post-back{font-size:19px;padding:10px 0}.phone-post-preview{width:100%;height:72%;margin-top:25px;background-repeat:no-repeat;background-color:#100c13;border-radius:8px}.phone-story{height:75%}.phone-post-caption{font-size:14px;line-height:1.7}
.phone-external{position:absolute;right:17%;bottom:13%;font-size:13px;color:var(--pink-text)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

.phone-post-preview{height:auto;aspect-ratio:1}.phone-post-preview.phone-story{aspect-ratio:auto;height:75%}

/* Final desktop phone placement; all coordinates share the homepage scale. */
.social-phone-object{left:895px;top:125px;width:570px;height:855px}
.social-phone-annotation{position:absolute;right:65px;top:28px;font-family:"Segoe Print","Bradley Hand",cursive;font-size:22px;line-height:1.25;font-weight:400;color:#f078c5;transform:rotate(-7deg);text-align:center;text-shadow:0 0 6px #f078c526;pointer-events:none}
.social-phone-annotation svg{position:absolute;right:-43px;top:45px;width:52px;height:65px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.social-phone-close{right:520px;top:130px}
.social-phone-hotspot{position:absolute;left:715px;top:748px;z-index:5;display:flex;align-items:center;gap:10px;padding:11px 14px;text-align:left;border:1px solid #f078c570;box-shadow:0 0 13px #f078c51c;transition:transform .25s,border-color .25s,box-shadow .25s}
.social-phone-hotspot svg{width:28px;height:28px;fill:none;stroke:#f078c5;stroke-width:1.5;filter:drop-shadow(0 0 4px #ff4db850)}
.social-phone-hotspot b{font-size:13px;font-weight:600}.social-phone-hotspot small{display:block;margin-top:4px;font-size:11px;color:var(--text-secondary)}
.social-phone-hotspot:hover{transform:translateY(-1px);border-color:#f078c5;box-shadow:0 0 18px #f078c539}
.in-scene .social-phone-hotspot{visibility:hidden}
@media(prefers-reduced-motion:reduce){.social-phone-hotspot{transition:none}.social-phone-hotspot:hover{transform:none}}

.social-phone-annotation{top:80px;right:62px;font-size:19px;line-height:1.2}.social-phone-annotation svg{right:-28px;top:32px;width:36px;height:48px}

.social-phone-annotation{right:112px}

.social-phone-object{left:1000px;top:150px;width:430px;height:850px;filter:none}
.phone-flat-source{position:absolute;left:0;top:0;width:1024px;height:1536px;transform-origin:0 0;pointer-events:none}
.canvas.social-phone-open{transform:none;zoom:var(--scale,1)}

.social-phone-annotation{top:65px;font-size:18px}

/* Upright iPhone 16-inspired housing: 71.6 : 147.6 proportions. */
.social-phone-object{width:414px;height:854px;border-radius:61px;background:linear-gradient(100deg,#d66d9d,#f8bdd7 22%,#e998bd 66%,#c65d8f);border:2px solid #f7b9d6;box-shadow:inset 0 0 0 3px #b95486,0 14px 35px #0008}
.phone-screen{position:absolute;left:10px;top:13px;width:390px;height:824px;overflow:hidden;border-radius:49px;background:#08090c;border:3px solid #101015;box-sizing:content-box}
.phone-flat-source{left:0;top:0}
.phone-island{position:absolute;top:11px;left:50%;transform:translateX(-50%);width:113px;height:30px;border-radius:22px;background:#020204;box-shadow:0 0 0 8px #08090c;pointer-events:none}
.phone-island:after{content:"";position:absolute;right:12px;top:10px;width:9px;height:9px;border-radius:50%;background:#101321;box-shadow:inset 1px 0 2px #263047}
.phone-side-key{position:absolute;right:-5px;top:235px;width:4px;height:62px;border-radius:0 3px 3px 0;background:#db8aad}
.social-phone-object:before{content:"";position:absolute;left:-5px;top:180px;width:4px;height:48px;border-radius:3px 0 0 3px;background:#db8aad;box-shadow:0 60px #db8aad}
.canvas.social-phone-open{zoom:1;transform:scale(var(--scale,1))}

.phone-screen-content{display:block;width:100%;height:100%}

/* Approved master is displayed whole, at its native aspect ratio. */
.social-phone-object{width:480px;height:853.333px;left:950px;top:150px;background:none;border:0;border-radius:0;box-shadow:none}
.social-phone-object:before{display:none}.phone-master{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.master-grid{position:absolute;left:16.56%;top:50.6%;width:68.6%;height:33.17%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr)}
.master-grid button{background:transparent;border:1px solid transparent;padding:0}.master-grid button:hover{border-color:#f078c5;background:#ffffff0a;box-shadow:inset 0 0 8px #f078c550}
.master-post{position:absolute;left:16.56%;top:11%;width:68.6%;height:78%;background:#090a0d;padding:12px;color:#e9e3e8;border-radius:8px}.master-back{font-size:16px;padding:12px 0}.master-thumbnail{display:block;width:100%;height:auto;margin-top:45px;aspect-ratio:214/184}.master-post p{font-size:12px}
@media(prefers-reduced-motion:reduce){.master-grid,.master-post{animation:none}}
.social-phone-object{height:834.8265px}.master-grid{left:16.3%;top:50.91%;width:67.51%;height:33.37%}
.social-phone-hotspot{left:715px;top:710px}

.social-phone-hotspot{left:600px;top:450px}
.social-phone-hotspot .social-phone-pointer{position:absolute;left:-42px;top:3px;width:40px;height:37px;stroke:#f078c5;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;fill:none;pointer-events:none;filter:drop-shadow(0 0 3px #f078c548)}
