.q-phone{container-type:inline-size;width:100%}.q-phone__frame{position:relative;box-sizing:border-box;width:100%;padding:2.5%;border-radius:15cqw;background:#000;outline:2px solid #333}.q-phone__screen{position:relative;aspect-ratio:9/19.5;border-radius:calc(15cqw - 6px);overflow:hidden}.q-phone__placeholder{position:absolute;inset:0;background:#878787}.q-phone__image{display:block;width:100%;height:100%;object-fit:cover}.q-phone__shade{position:absolute;bottom:0;left:0;width:100%;height:18%;background:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.2) 50%,rgba(0,0,0,.7) 100%);pointer-events:none}.q-phone__island{position:absolute;top:2.5%;left:50%;transform:translateX(-50%);width:30%;height:4%;background:#000;border-radius:9999px}.q-phone__home{position:absolute;bottom:3%;left:50%;transform:translateX(-50%);width:34%;height:.6%;background:#fff;border-radius:9999px}.q-phone__navigation{position:absolute;bottom:6%;left:0;box-sizing:border-box;width:100%;display:flex;align-items:center;justify-content:space-between;padding:0 6%;gap:8px}.q-phone__control{display:flex;align-items:center;justify-content:center;width:12cqw;height:12cqw;color:rgba(255,255,255,.8);background:rgba(15,15,15,.32);backdrop-filter:blur(8px);border-radius:9999px;box-shadow:0 0 1.5px rgba(0,0,0,.1),0 .65px 5px rgba(0,0,0,.12),inset .65px .65px 1px -.65px rgba(255,255,255,.8),inset -.65px -.65px 2px -.65px rgba(255,255,255,.4)}.q-phone__control svg{width:5cqw;height:5cqw;flex-shrink:0}.q-phone__back svg{margin-left:-2px}.q-phone__address{width:auto;flex:1;min-width:0;font:13px/16px QuoterGeist,Arial,sans-serif}.q-phone__address span{box-sizing:border-box;color:#fff;display:block;width:100%;padding:0 16px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center;font-size:4.5cqw}.q-phone__mute,.q-phone__volume-up,.q-phone__volume-down,.q-phone__power{position:absolute;width:2px;background:#333}.q-phone__mute,.q-phone__volume-up,.q-phone__volume-down{left:-4px;border-radius:9999px 0 0 9999px}.q-phone__mute{top:15%;height:3.5%}.q-phone__volume-up{top:23.4%;height:7.1%}.q-phone__volume-down{top:32.4%;height:7.1%}.q-phone__power{right:-4px;top:28.2%;height:11%;border-radius:0 9999px 9999px 0}
