html,body{margin:0;height:100%;background:#000;overflow:hidden}.stage{position:fixed;top:0;right:0;bottom:0;left:0;background:#000}.layer{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;display:flex;align-items:center;justify-content:center}.layer.visible{opacity:1;z-index:1}:root{--tx-duration: .7s;--tx-easing: cubic-bezier(.4, 0, .2, 1)}.layer.tx-none{transition:opacity 50ms linear}.layer.tx-fade{transition:opacity var(--tx-duration) var(--tx-easing)}@keyframes slideInLeft{0%{opacity:1;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.layer.tx-slide-left.visible{animation:slideInLeft var(--tx-duration) var(--tx-easing) forwards;opacity:1}@keyframes slideInRight{0%{opacity:1;transform:translate(-100%)}to{opacity:1;transform:translate(0)}}.layer.tx-slide-right.visible{animation:slideInRight var(--tx-duration) var(--tx-easing) forwards;opacity:1}@keyframes slideInUp{0%{opacity:1;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.layer.tx-slide-up.visible{animation:slideInUp var(--tx-duration) var(--tx-easing) forwards;opacity:1}@keyframes slideInDown{0%{opacity:1;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}.layer.tx-slide-down.visible{animation:slideInDown var(--tx-duration) var(--tx-easing) forwards;opacity:1}@keyframes zoomIn{0%{opacity:0;transform:scale(.75)}to{opacity:1;transform:scale(1)}}.layer.tx-zoom-in.visible{animation:zoomIn var(--tx-duration) var(--tx-easing) forwards;opacity:1}@keyframes zoomOut{0%{opacity:0;transform:scale(1.3)}to{opacity:1;transform:scale(1)}}.layer.tx-zoom-out.visible{animation:zoomOut var(--tx-duration) var(--tx-easing) forwards;opacity:1}@keyframes wipeLeft{0%{clip-path:inset(0 100% 0 0);opacity:1}to{clip-path:inset(0 0% 0 0);opacity:1}}.layer.tx-wipe-left.visible{animation:wipeLeft var(--tx-duration) var(--tx-easing) forwards;opacity:1}@keyframes wipeRight{0%{clip-path:inset(0 0 0 100%);opacity:1}to{clip-path:inset(0 0 0 0%);opacity:1}}.layer.tx-wipe-right.visible{animation:wipeRight var(--tx-duration) var(--tx-easing) forwards;opacity:1}@keyframes flipH{0%{opacity:0;transform:perspective(800px) rotateY(-90deg)}50%{opacity:1;transform:perspective(800px) rotateY(-45deg)}to{opacity:1;transform:perspective(800px) rotateY(0)}}.layer.tx-flip-h.visible{animation:flipH var(--tx-duration) var(--tx-easing) forwards;opacity:1}.media{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}.empty{color:#9ca3af;font-family:system-ui,sans-serif;font-size:1.25rem}.fs-toggle{position:absolute;bottom:max(16px,env(safe-area-inset-bottom,0px));right:max(16px,env(safe-area-inset-right,0px));z-index:20;min-height:44px;min-width:44px;padding:10px 16px;border-radius:10px;border:1px solid rgba(255,255,255,.35);background:#0000008c;color:#f3f4f6;font-size:14px;font-family:system-ui,sans-serif;font-weight:600;cursor:pointer;pointer-events:auto;touch-action:manipulation;box-shadow:0 4px 20px #00000073;transition:background .2s ease,border-color .2s ease,transform .15s ease}.fs-toggle:hover{background:#000000b8;border-color:#ffffff8c}.fs-toggle:active{transform:scale(.98)}.fs-toggle.fs-toggle--active{background:#1e1e1ed9}.status{position:fixed;bottom:12px;left:50%;transform:translate(-50%);z-index:10;padding:6px 14px;border-radius:999px;background:#000000a6;color:#e5e7eb;font-size:12px;font-family:system-ui,sans-serif;opacity:0;transition:opacity .4s ease;pointer-events:none}