:where([data-flipbook]){aspect-ratio:16/10;width:100%;display:block}.flipbook{touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;margin:0;position:relative;overflow:hidden}.flipbook canvas{display:block}.flipbook__btn{color:#222;opacity:.6;cursor:pointer;-webkit-tap-highlight-color:transparent;background:#ffffffd9;border:1px solid #0000001f;border-radius:50%;place-items:center;width:44px;height:44px;padding:0;transition:opacity .2s,background .2s;display:grid;position:absolute;box-shadow:0 1px 4px #00000026}.flipbook__arrow--prev{bottom:max(16px, env(safe-area-inset-bottom));left:max(16px, env(safe-area-inset-left));transform:scaleX(-1)}.flipbook__arrow--next{bottom:max(16px, env(safe-area-inset-bottom));right:max(16px, env(safe-area-inset-right))}.flipbook__play{top:max(16px, env(safe-area-inset-top));right:max(16px, env(safe-area-inset-right))}.flipbook__btn:hover:not(:disabled){background:#fff}.flipbook__btn:disabled{opacity:.2;cursor:default}.flipbook__tilt{top:max(16px, env(safe-area-inset-top));left:max(16px, env(safe-area-inset-left));opacity:.6;color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;background:#ffffff1f;border:1px solid #ffffff40;border-radius:999px;padding:6px 12px;font:12px system-ui,sans-serif;position:absolute}.flipbook__error{color:#f66;text-align:center;place-items:center;padding:1em;font:14px system-ui,sans-serif;display:grid;position:absolute;inset:0}