/* A flat CSS device frame for static renders (screenshots, film, fallbacks).
   Size it by setting a width on .devwrap; everything else scales from it. */
.devwrap { container-type: inline-size; }
.dev { position: relative; padding: 3.1cqw; border-radius: 15.5cqw; background: linear-gradient(140deg, #6a6e6c 0%, #232524 28%, #101110 60%, #4a4d4b 100%); box-shadow: 0 0 0 0.35cqw #0a0b0a inset, 0 6cqw 16cqw rgba(0, 0, 0, 0.6), 0 0 24cqw rgba(132, 204, 22, 0.14); }
.dev img { display: block; width: 100%; border-radius: 12.6cqw; background: #0a0c0a; }
.dev::after { content: ''; position: absolute; left: 50%; top: 6.3cqw; width: 27cqw; height: 7.6cqw; margin-left: -13.5cqw; border-radius: 4cqw; background: #000; }
.dev.ipad { padding: 3cqw; border-radius: 6cqw; }
.dev.ipad img { border-radius: 3cqw; }
.dev.ipad::after { display: none; }
.dev .stack { position: relative; }
.dev .stack img + img { position: absolute; inset: 0; }