.reels-section{--bg: var(--color-ink, #0a1712);--card-bg: rgba(255, 255, 255, .05);--card-border: rgba(255, 255, 255, .1);--ivory: var(--color-ivory, #f7f2e6);--gold: var(--color-foil-gold, #d8b369);--radius: var(--radius-lg, 16px);--shadow: 0 8px 24px rgba(0, 0, 0, .4)}.reel-container{width:100%;max-width:100%;padding:1.5rem 2rem}.reel-list{display:flex;width:100%;gap:16px;justify-content:space-between}@keyframes skeletonPulse{0%{background-position:200% 0}to{background-position:-200% 0}}.reel-card{flex:1 1 0;min-width:0;position:relative;overflow:hidden;border-radius:var(--radius);border:1px solid var(--card-border);box-shadow:var(--shadow);aspect-ratio:9 / 16;cursor:pointer;outline:none;transition:transform .35s cubic-bezier(.25,.8,.25,1),box-shadow .35s ease,border-color .35s ease;background:linear-gradient(90deg,#11261d,#1a3a2c,#11261d);background-size:200% 100%;animation:skeletonPulse 1.5s infinite linear}.reel-card:focus-visible{border-color:var(--gold);box-shadow:0 0 0 3px #d8b36980;transform:translateY(-8px)}.reel-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 16px 32px #0009;border-color:#d8b36980;z-index:5}.reel-card video{width:100%;height:100%;object-fit:cover;opacity:0;transition:transform .4s ease,opacity .5s ease}.reel-card:hover video{transform:scale(1.05)}.audio-badge{position:absolute;top:10px;right:10px;background:#0000008c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;transition:background .3s ease,transform .3s ease;z-index:2;pointer-events:none}.reel-card:hover .audio-badge{background:#d8b369d9;transform:scale(1.1)}.audio-badge svg{width:14px;height:14px;fill:var(--ivory)}.reel-card:hover .audio-badge svg{fill:#0a1712}.reel-info{position:absolute;bottom:0;left:0;right:0;padding:2rem .75rem .75rem;background:linear-gradient(to top,rgba(10,23,18,.95) 10%,rgba(10,23,18,.5) 60%,transparent);color:var(--ivory);pointer-events:none}.reel-user{font-weight:600;font-size:clamp(.7rem,.85vw,.95rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reel-tagline{font-size:clamp(.65rem,.75vw,.82rem);color:var(--gold);margin-top:2px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:flex;justify-content:center;align-items:center;z-index:1000;opacity:0;pointer-events:none;transition:opacity .3s ease}.modal.active{opacity:1;pointer-events:auto}.modal-wrapper{position:relative;height:94vh;aspect-ratio:9/16;max-width:calc(100vw - 150px)}.modal-content{width:100%;height:100%;border-radius:var(--radius);overflow:hidden;background:#000;border:1px solid var(--card-border);box-shadow:0 24px 60px #000000e6;transform:scale(.95);transition:transform .3s cubic-bezier(.16,1,.3,1)}.modal.active .modal-content{transform:scale(1)}.modal-content video{width:100%;height:100%;object-fit:cover}.modal-btn{position:absolute;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.2);color:var(--ivory);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s ease,transform .2s ease,border-color .2s ease;z-index:1010}.modal-btn:hover{background:#d8b369cc;color:#0a1712;border-color:var(--gold);transform:scale(1.1)}.close-btn{top:14px;right:14px;font-size:1.4rem;width:36px;height:36px}.nav-arrow{top:50%;transform:translateY(-50%);width:48px;height:48px;font-size:1.2rem}.nav-arrow:hover{transform:translateY(-50%) scale(1.1)}.nav-arrow.prev{left:-64px}.nav-arrow.next{right:-64px}@media(max-width:640px){.reel-container{padding:1rem}.reel-list{flex-wrap:wrap;gap:12px}.reel-card{flex:0 0 calc(50% - 6px)}.reel-info{padding:1.5rem .6rem .6rem}.reel-tagline{display:none}.modal-wrapper{height:100vh;width:100vw;max-width:none;aspect-ratio:auto}.modal-content{border-radius:0;border:none;transform:scale(1)}.nav-arrow{display:none}.close-btn{top:20px;right:20px}}
/*# sourceMappingURL=/cdn/shop/t/30/assets/mr-reels.css.map */