/* Reserve real layout space for the tilted phone and its independent controls. */
.word.brand-word{background:linear-gradient(145deg,var(--logo-a-light),var(--logo-a));background-clip:text;-webkit-background-clip:text;color:transparent}
.calm .brand-word{background:none;color:var(--logo-a-light)}
body[data-intro-pending=true] .scene--hero .copy{opacity:0;pointer-events:none}
.scene--phone .phone-art{--phone-size:552px;--phone-scale:.90;height:auto;min-height:0;display:flex;flex-direction:column;align-items:center;gap:8px}
.phone-stage{position:relative;width:100%;height:calc(var(--phone-size)*var(--phone-scale) + 14px);flex:none}
.scene--phone .phone-wrap{top:5px;left:50%;height:var(--phone-size);transform:translateX(-50%) scale(var(--phone-scale));transform-origin:50% 0}
.scene--phone .phone-case{height:var(--phone-size)}
.scene--phone .conversation-controls{position:relative;inset:auto;transform:none;flex:none;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:8px}
.conversation-controls [role=tab],.conversation-play{min-height:44px}
.scene--phone .phone-caption{position:relative;inset:auto;flex:none}
.scene--phone .phone-float{bottom:90px}
@media(min-width:1600px){.scene--phone .phone-art{--phone-scale:1.05}}
@media(max-width:1200px){.scene--phone .phone-art{--phone-scale:.85}}
@media(max-width:960px){.scene--phone .phone-art{--phone-scale:.76}}
@media(min-width:701px) and (max-height:760px){.scene--phone .phone-art{--phone-scale:.68}}
@media(min-width:701px) and (max-height:500px){.scene--phone .phone-art{--phone-scale:.48}}
@media(max-width:700px){.scene--phone .phone-art{--phone-size:390px;--phone-scale:.86}.scene--phone .scene-inner{gap:12px;padding-bottom:4px}}
@media(max-width:370px){.scene--phone .phone-art{--phone-scale:.82}}
@media(max-width:700px) and (max-height:740px){.scene--phone .phone-art{--phone-size:330px;--phone-scale:.80}.scene--phone .scene-inner{gap:8px;padding-top:2px;padding-bottom:2px}.scene--phone .phone-caption{font-size:8px}}