/* Tilt remains on the persistent phone wrapper when its example profile changes. */
.phone-motion-enabled{--phone-base-roll:7deg;--phone-rotate-x:0deg;--phone-rotate-y:0deg;--phone-rotate-z:0deg;--phone-x:0px;--phone-y:0px;--phone-depth:0px;--phone-satellite-x:0px;--phone-satellite-y:0px;--phone-light-x:50%;--phone-light-y:40%;--phone-light-opacity:.055;perspective:1100px;touch-action:pan-y}
.phone-motion-enabled .niche-phone,.phone-motion-enabled:hover .niche-phone{transform:translate3d(var(--phone-x),var(--phone-y),var(--phone-depth)) rotate(calc(var(--phone-base-roll) + var(--phone-rotate-z))) rotateY(calc(-7deg + var(--phone-rotate-y))) rotateX(var(--phone-rotate-x));transition:none;transform-style:preserve-3d;will-change:transform;user-select:none;-webkit-user-select:none}
.phone-motion-enabled .niche-phone .phone-glare{background:radial-gradient(ellipse at var(--phone-light-x) var(--phone-light-y),rgba(255,255,255,.95),rgba(255,255,255,.2) 28%,transparent 68%),linear-gradient(116deg,#ffffff30 3%,transparent 28%,#ffffff22 30%,transparent 62%);opacity:var(--phone-light-opacity);mix-blend-mode:screen;z-index:5}
.phone-motion-enabled .annotation-bio{transform:translate3d(var(--phone-satellite-x),var(--phone-satellite-y),0) rotate(-4deg);transition:none;pointer-events:none}
.phone-motion-enabled .annotation-content{transform:translate3d(calc(var(--phone-satellite-x) * 1.3),calc(var(--phone-satellite-y) * 1.3),0) rotate(3deg);transition:none;pointer-events:none}
.phone-motion-controls{display:flex;align-items:flex-start;flex-direction:column;gap:9px;margin-top:18px;max-width:370px}
.phone-motion-controls[hidden],.phone-motion-button[hidden]{display:none}
.phone-motion-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:10px 14px;color:#521D23;border:1px solid #521D2350;background:#F6F4F0;border-radius:5px;font-size:11px;font-weight:700;line-height:1.4;box-shadow:2px 2px 0 #DEA6AB55;transition:background .2s,color .2s,box-shadow .2s;touch-action:manipulation}
.phone-motion-button svg{width:19px;height:23px;flex:none}
.phone-motion-button:hover,.phone-motion-button[aria-pressed=true]{background:#521D23;color:#F6F4F0;border-color:#521D23;box-shadow:2px 2px 0 #DEA6AB}
.phone-motion-button:disabled{cursor:wait;opacity:.65}
.phone-motion-hint{display:block;font-size:10px;color:#766C68;line-height:1.6;max-width:300px}
@media(max-width:760px){.phone-motion-enabled{--phone-base-roll:5deg}.phone-motion-enabled .annotation-bio{transform:translate3d(var(--phone-satellite-x),var(--phone-satellite-y),0) rotate(-5deg)}.phone-motion-controls{margin-top:16px;gap:7px}.phone-motion-button{font-size:11px}.phone-motion-hint{font-size:10px}}
@media(prefers-reduced-motion:reduce){.phone-motion-enabled .niche-phone,.phone-motion-enabled:hover .niche-phone{transform:rotate(var(--phone-base-roll)) rotateY(-7deg);will-change:auto}.phone-motion-enabled .annotation-bio{transform:rotate(-4deg)}.phone-motion-enabled .annotation-content{transform:rotate(3deg)}.phone-motion-enabled .niche-phone .phone-glare{opacity:.055}.phone-motion-controls{display:none}}