:root{--primary: #0061ff;--white: #ffffff;--black: #000000;--glass: rgba(255, 255, 255, .1);--glass-heavy: rgba(255, 255, 255, .2);--transition: all .8s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--black);color:var(--white);font-family:Inter,-apple-system,sans-serif;overflow:hidden;height:100vh;width:100vw}.carousel{position:relative;width:100%;height:100%;overflow:hidden}@keyframes blurFade{0%{opacity:0;filter:blur(20px);transform:scale(1.1)}to{opacity:1;filter:blur(0);transform:scale(1)}}@keyframes perspectiveSlide{0%{opacity:0;transform:perspective(1000px) rotateY(15deg) translate(100px)}to{opacity:1;transform:perspective(1000px) rotateY(0) translate(0)}}@keyframes panRight{0%{transform:scale(1.1) translate(-30px)}to{transform:scale(1) translate(0)}}@keyframes panLeft{0%{transform:scale(1.1) translate(30px)}to{transform:scale(1) translate(0)}}@keyframes wipeRight{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}@keyframes zoomOutReveal{0%{opacity:0;transform:scale(1.5)}to{opacity:1;transform:scale(1)}}@keyframes slideUp{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes flipIn{0%{opacity:0;transform:perspective(1000px) rotateX(-90deg)}to{opacity:1;transform:perspective(1000px) rotateX(0)}}@keyframes revealCenter{0%{clip-path:circle(0% at 50% 50%)}to{clip-path:circle(100% at 50% 50%)}}.slide{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;visibility:hidden;transition:opacity .8s ease;z-index:1;display:flex;align-items:center;justify-content:center;background:var(--black)}.slide.active{opacity:1;visibility:visible;z-index:2}.slide.active.anim-blur-fade img{animation:blurFade 1.2s cubic-bezier(.4,0,.2,1) forwards}.slide.active.anim-perspective img{animation:perspectiveSlide 1.2s cubic-bezier(.4,0,.2,1) forwards}.slide.active.anim-pan-right img{animation:panRight 8s linear forwards}.slide.active.anim-pan-left img{animation:panLeft 8s linear forwards}.slide.active.anim-wipe img{animation:wipeRight 1.2s cubic-bezier(.4,0,.2,1) forwards}.slide.active.anim-zoom-out img{animation:zoomOutReveal 1.2s cubic-bezier(.4,0,.2,1) forwards}.slide.active.anim-slide-up img{animation:slideUp 1.2s cubic-bezier(.4,0,.2,1) forwards}.slide.active.anim-flip img{animation:flipIn 1.2s cubic-bezier(.4,0,.2,1) forwards}.slide.active.anim-reveal img{animation:revealCenter 1.5s cubic-bezier(.4,0,.2,1) forwards}.slide img{width:100%;height:100%;object-fit:contain;display:block;margin:auto;transition:none}.slide:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(0deg,#0006,#0000,#0006);pointer-events:none}.controls{position:absolute;bottom:40px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:20px;z-index:100;padding:10px 20px;background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:50px;border:1px solid rgba(255,255,255,.1);transition:opacity .3s ease;opacity:0}.carousel:hover .controls{opacity:1}.btn-nav{background:none;border:none;color:var(--white);font-size:24px;cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .3s ease}.btn-nav:hover{background:var(--glass-heavy)}.indicators{display:flex;gap:8px}.dot{width:8px;height:8px;background:#ffffff4d;border-radius:50%;cursor:pointer;transition:var(--transition)}.dot.active{background:var(--white);width:24px;border-radius:4px}.progress-container{position:absolute;bottom:0;left:0;width:100%;height:4px;background:#ffffff1a;z-index:101}.progress-bar{width:0%;height:100%;background:var(--white);transition:width .1s linear}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.modal-content{background:#111;padding:40px;border-radius:24px;text-align:center;max-width:400px;border:1px solid rgba(255,255,255,.1);box-shadow:0 25px 50px -12px #00000080}.modal-content h2{margin-bottom:16px;font-weight:800}.modal-content p{color:#888;margin-bottom:24px;line-height:1.6}#fullscreenButton{background:var(--white);color:var(--black);border:none;padding:16px 32px;border-radius:12px;font-weight:700;cursor:pointer;transition:all .3s ease;width:100%}#fullscreenButton:hover{transform:translateY(-2px);box-shadow:0 10px 20px #ffffff1a}.close{position:absolute;top:20px;right:30px;font-size:40px;cursor:pointer;opacity:.5}.close:hover{opacity:1}
