.reel{flex-direction:column;gap:12px;min-width:0;display:flex}.reel-stage{aspect-ratio:4/3;box-shadow:inset 0 0 0 1px var(--line);background:#fff;border-radius:16px;position:relative;overflow:hidden}.reel-frame{opacity:0;pointer-events:none;border:0;width:100%;height:100%;position:absolute;inset:0}.reel-frame.is-on{opacity:1}.reel-caption{height:2.84em;color:var(--ink);font:500 17px/1.42 var(--font-read);text-wrap:pretty;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;margin:0;display:-webkit-box;overflow:hidden}.reel-caption span{animation:.45s both reel-in}.reel-meta{text-overflow:ellipsis;min-width:0;height:20px;color:var(--ink-3,var(--ink-2));font:400 13px/20px var(--font-ui);white-space:nowrap;margin:0;overflow:hidden}.reel-meta b{color:var(--ink-2);font-weight:600}@keyframes reel-in{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){.reel-caption span{animation:none}}.reel-cam{transform-origin:0 0;will-change:transform;position:absolute;inset:0}.reel-spot{opacity:0;pointer-events:none;mix-blend-mode:multiply;transition:transform .7s cubic-bezier(.45,0,.25,1),opacity .5s;position:absolute;inset:0}.reel-spot i{background:radial-gradient(circle, color-mix(in srgb, var(--accent) 75%, transparent) 0%, color-mix(in srgb, var(--accent) 30%, transparent) 45%, transparent 70%);border-radius:50%;width:150px;height:150px;margin:-75px 0 0 -75px;animation:2.2s ease-in-out infinite reel-breathe;position:absolute;top:0;left:0}@keyframes reel-breathe{0%,to{transform:scale(.85)}50%{transform:scale(1.12)}}.reel-wipe{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.reel-wipe path{fill:none;stroke:color-mix(in srgb, var(--accent) 26%, #fff);stroke-width:300px;stroke-linecap:round}.reel-karaoke>span{opacity:.45;transition:opacity .3s}.reel-karaoke>span.is-said{opacity:1}@media (prefers-reduced-motion:reduce){.reel-spot,.reel-karaoke>span{transition:none}.reel-spot i{animation:none}}.reel-reading{height:7.5em;font:400 17px/1.5 var(--font-read);position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(#0000 0,#000 7% 78%,#0000 100%);mask-image:linear-gradient(#0000 0,#000 7% 78%,#0000 100%)}.reel-reading-inner{padding-top:.4em;transition:transform .9s cubic-bezier(.4,0,.2,1)}.reel-reading p{color:var(--ink-2);opacity:.55;text-wrap:pretty;margin:0 0 .35em;transition:color .5s,opacity .5s}.reel-reading p.is-past{opacity:.4}.reel-reading p.is-cur{color:var(--ink);opacity:1}@media (prefers-reduced-motion:reduce){.reel-reading-inner,.reel-reading p{transition:none}}.reel-still{z-index:2;object-fit:cover;pointer-events:none;width:100%;height:100%;transition:opacity .4s;position:absolute;inset:0}.reel-still.is-gone{opacity:0}.reel-ghost{z-index:2;object-fit:cover;pointer-events:none;opacity:.13;filter:grayscale();mix-blend-mode:multiply;width:100%;height:100%;transition:opacity .8s;position:absolute;inset:0}.reel-sound{z-index:3;background:color-mix(in srgb, var(--surface) 92%, transparent);height:34px;color:var(--ink);font:600 13px/1 var(--font-ui);box-shadow:0 0 0 1px var(--line-strong), 0 6px 16px -10px #00000059;cursor:pointer;border:0;border-radius:999px;align-items:center;gap:6px;padding:0 13px 0 10px;display:inline-flex;position:absolute;bottom:10px;right:10px}.reel-sound:hover{background:var(--surface)}.reel-sound.is-on{background:var(--ink);color:var(--bg);box-shadow:none}.reel-sound:focus-visible{outline:3px solid var(--accent);outline-offset:2px}