/* The same phone hardware used by the Scale page, scoped to its embedded section. */
#scale .phone-shell{position:relative;width:100%;min-width:0;padding:7px 7px 0;background:linear-gradient(145deg,#353b43 0%,#13161c 12%,#080a0e 50%,#252b33 100%);border:1px solid #59616d;border-radius:35px;box-shadow:inset 0 0 0 2px #14171d,0 18px 38px #0005;isolation:isolate;overflow:visible}
#scale .phone-shell:before,#scale .phone-shell:after{content:"";position:absolute;width:3px;border-radius:2px;background:linear-gradient(90deg,#101319,#707782,#272c34);z-index:-1}
#scale .phone-shell:before{left:-4px;top:88px;height:34px;box-shadow:0 44px 0 #343a44}
#scale .phone-shell:after{right:-4px;top:127px;height:53px}
#scale .phone-top{height:23px;display:flex;align-items:center;justify-content:center;gap:9px;padding-bottom:2px}
#scale .phone-speaker{width:37px;height:4px;border-radius:8px;background:#030407;box-shadow:0 1px 0 #454b5480}
#scale .phone-camera{width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 38% 35%,#415b79 0%,#101b2c 35%,#020305 68%);box-shadow:0 0 0 1px #222731}
#scale .phone-screen{border:1px solid #03050a;border-radius:17px;background:#07090e;overflow:hidden;box-shadow:0 0 0 1px #ffffff08}
#scale .phone-screen img{display:block;width:100%;height:auto;aspect-ratio:390/844;object-fit:contain;margin:0;border:0;border-radius:0;background:#07090e}
#scale .phone-bottom{height:20px;display:grid;place-items:center}
#scale .phone-bottom span{width:64px;height:3px;border-radius:5px;background:#7b838e}
#scale .scale-shots{align-items:start;gap:20px}
#scale .scale-shots>.phone-shell:nth-child(2){margin-top:54px}
#scale .scale-layout{grid-template-columns:minmax(0,400px) minmax(0,1fr)}
#scale .scale-phones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:18px;width:100%;max-width:420px;margin-inline:auto}
#scale .scale-phones .phone-shell.up{margin:42px 0 0;transform:none}
@media(max-width:820px){#scale .scale-layout{grid-template-columns:1fr}}
@media(max-width:540px){
  #scale .scale-shots,#scale .scale-phones{display:block;width:min(285px,100%);margin-inline:auto}
  #scale .scale-shots>.phone-shell:first-child,#scale .scale-phones>.phone-shell:first-child{display:none}
  #scale .scale-shots>.phone-shell:nth-child(2),#scale .scale-phones .phone-shell.up{margin:0}
  #scale .scale-shots figcaption{margin-top:18px}
}
