/* Generated by assets-src/cover/build_cover.py. Do not edit by hand. */

/* Phones: the 9:16 panel. */
.gate { --pic-r: 0.5628; --med-x: 49.95%; --med-y: 49.9%; --med-d: 21.5%; --shape: "phone"; }
.gate .p-art { background-image: url(panel.webp), url(data:image/webp;base64,UklGRnQBAABXRUJQVlA4IGgBAACQCACdASoYACsAPu1oqk+ppaOiKqoBMB2JQBdja/nH0BgW4N8vSQM2bwcOL/RAo5Fx+Bi14A/xLqupc5TeAQKyh9N7apFpMDdw36S8AAD3SQMTE6Lzh8FhJrZFnBHBL2qXVSc6FDBuX3q3D4lE8bgvqpu3agHSk7ZKG3BmyoQTIHtnxhKETf6K/G4+KnXPhcGh8s/+pMpfTogxEZE55CQsZKNSvjgiKrbgfAQc8CWXqajcpDwRFKnvH2g1O6miqW0tJsuuQNhDGpdosXnR03Anu4xDT5ygxEylVZG2hPPC/ntVF6J4An0VRZCrqc82uMYkU/E3zXUkrjxNpgMOAaUj2OuqRHZiGPKfH30E0DKYhhI3QOOX/V+0GPZkKPcJp0wLTGb1L+9x34iBCdg0N5UqaVA2Ij9Z0JJKwWO4PpMamDpHTPvBdKET/OJuuYZVcgkXTW+z0keVM/SHZ4cYzqvoAA8+TI6AAAA=); }
.gate .p-glint { -webkit-mask-image: url(gloss.webp); mask-image: url(gloss.webp); }

/* Tablets upright, and the laptop column: the 3:4 panel. */
@media (min-aspect-ratio: 5/8) {
  html:root .gate { --pic-r: 0.75; --med-x: 49.5%; --med-y: 49.7%; --med-d: 14.6%; --shape: "tab"; }
  html:root .gate .p-art { background-image: url(panel-tab.webp), url(data:image/webp;base64,UklGRvoAAABXRUJQVlA4IO4AAABQBgCdASoYACAAPu1iqU2ppaOiMAgBMB2JZVTAOfvvQcYqwDuBcCdMLUGfFuuUfTk8moIBptwAWJluAAD+w74LeTZ6Ib+sBaTSfnoa3t0tZuEKfaitqJaThnc8oZXhuej25PnQd/d/Z9vm1H4BML43Jab4360qh8jzFkX3bNq56tQy4F09+5PFCtEzOzf8XG1/YD5Z5/8EUxp+jCM0sE98o12BMu2wSk+8FkaBj4XtPnCliokOgwDC5To77qhRf9VLwmtrtzrEOX9Pwrb9+qI8j8e+2E5f8gkDqX/WBcJh2M6JRG1AjHAs6AxqBAgA); }
  html:root .gate .p-glint { -webkit-mask-image: url(gloss-tab.webp); mask-image: url(gloss-tab.webp); }
}

/* Tablets sideways: the 4:3 panel. */
@media (min-aspect-ratio: 6/5) {
  html.is-tablet .gate { --pic-r: 1.33333; --med-x: 50.0%; --med-y: 50.4%; --med-d: 9.3%; --shape: "land"; }
  html.is-tablet .gate .p-art { background-image: url(panel-land.webp), url(data:image/webp;base64,UklGRnoAAABXRUJQVlA4IG4AAACwBACdASoYABIAPu1ur1KppiQiqAgBMB2JZy+9yek7f4EGGoSo9wOqjRwZHzAYAPcEHWB8JagDj01CmMXRskvYtMOM/IqbKmfG4pfpa7z8pRc91TyL5SvtPlvQ1/7c93Ca/UU5YjdJqquApAAAAA==); }
  html.is-tablet .gate .p-glint { -webkit-mask-image: url(gloss-land.webp); mask-image: url(gloss-land.webp); }
}

/* The leaf shadows drifting over the panel (every shape). */
.gate .p-leaves { background-image: url(leaves.webp); }
