/* Integration only. The upstream phone.css is copied without changes. */
iframe#screen { border: 0; touch-action: auto; width: 320px; height: 480px; transform-origin: top left; }

/* Touch browsers may retain :active after release; only the pointer controller depresses Home. */
.physical.home[data-controlled]{transition:box-shadow 80ms ease-out}
.physical.home[data-controlled] .home-symbol{transition:transform 80ms ease-out,opacity 80ms ease-out}
.physical.home[data-controlled]:active:not(.pressed){background:radial-gradient(ellipse at 50% 100%,#262a30,#080a0d 73%);box-shadow:inset 0 1px 2px #000,inset 0 -1px 1px #777c7d80,0 0 0 1px #050607}
.physical.home[data-controlled]:active:not(.pressed) .home-symbol{transform:none;opacity:.85}

.experience{min-height:calc(var(--a4os-stage-height,100svh) - 24px)}
.phone{width:min(380px,calc(var(--a4os-stage-width,100vw) - 32px),calc((var(--a4os-stage-height,100svh) - 44px)*380/716))}