.reel-universe{height:510px}
.reel-universe .universe-axis{height:100%}
.reel-device{position:absolute;width:292px;height:510px;left:50%;top:50%;transform:translate(-50%,-50%) translateZ(30px);background:#15141a;border:7px solid #19171e;border-radius:35px;box-shadow:2px 3px 0 #aaa3a7,6px 8px 0 #47434c,11px 14px 0 #13101d,20px 35px 80px #11102588;overflow:hidden;z-index:3}
.reel-device:after{content:'';position:absolute;left:34%;right:34%;height:3px;bottom:3px;border-radius:3px;background:#fff8;z-index:20}
.reel-surface{position:relative;width:100%;height:100%;border-radius:27px;overflow:hidden;background:#15141a;color:#fff}
.reel-visual{position:absolute;inset:0;overflow:hidden}
.reel-slide{position:absolute;inset:0;padding:86px 22px 115px;overflow:hidden;opacity:0;background:var(--pink);color:var(--ink)}
.reel-slide[data-face="0"]{opacity:1}
.reel-art-label{position:relative;font-size:7px;font-weight:700;letter-spacing:.08em;z-index:2;display:block;max-width:210px}
.reel-slide>strong{position:relative;font-family:var(--font);font-size:65px;line-height:.84;letter-spacing:-.055em;font-weight:700;display:block;margin-top:22px;z-index:2}
.reel-slide>strong em{font-family:Georgia,serif;font-weight:400}
.reel-idea{background:#c5c7f5;color:#25265f}
.reel-idea strong em{color:var(--blue)}
.reel-art-orb{position:absolute;width:210px;height:210px;border-radius:50%;right:-85px;bottom:97px;background:radial-gradient(circle at 30% 25%,#fff7e9,#ffc2dc 30%,#a995d6 50%,#55568e 73%);box-shadow:-10px 15px 40px #30386b44}
.reel-spark{position:absolute;font-size:117px;color:var(--yellow);left:-22px;bottom:91px;line-height:1;transform:rotate(var(--reel-spark-turn,0deg));text-shadow:2px 3px #25265f33}
.reel-hook{background:var(--yellow);color:var(--ink)}
.reel-hook>strong{font-size:60px}
.reel-hook>strong em{color:var(--blue)}
.reel-art-arrow{position:absolute;font-size:150px;line-height:1;bottom:100px;right:20px;color:var(--orange);transform:rotate(var(--reel-spark-turn,0deg))}
.reel-feeling{background:var(--pink);color:var(--ink)}
.reel-feeling>strong{font-size:65px}
.reel-feeling>strong em{color:var(--blue)}
.reel-feel-heart{position:absolute;font-size:135px;line-height:1;bottom:97px;left:65px;color:#ee496b;transform:rotate(-12deg) scale(var(--heart-beat,1));z-index:2;text-shadow:5px 6px #b02e6855}
.reel-feeling .reel-art-orb{bottom:105px;right:-100px}
.reel-replay{background:var(--blue);color:var(--cream)}
.reel-replay>strong{font-size:65px}
.reel-replay>strong em{font-size:51px;color:var(--pink)}
.replay-circle{position:absolute;left:59px;top:240px;width:134px;height:134px;border-radius:50%;border:1px solid #fff7e955;display:grid;place-items:center;font-size:100px;line-height:1;font-family:Arial,sans-serif;color:var(--pink);transform:rotate(var(--reel-spark-turn,0deg))}
.reel-replay .reel-spark{bottom:70px;left:-15px;font-size:95px}
.reel-shade{position:absolute;inset:0;background:linear-gradient(#0007,transparent 15%,transparent 54%,#000a 83%,#000e);z-index:4;pointer-events:none}
.reel-header{position:absolute;top:20px;left:16px;right:17px;display:flex;align-items:center;justify-content:space-between;z-index:5;font-family:Arial,sans-serif;font-size:20px;font-weight:700}
.reel-header svg,.reel-interactions svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.reel-interactions{position:absolute;right:10px;bottom:104px;width:36px;z-index:6;display:grid;gap:16px;text-align:center}
.reel-interactions>div{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:9px;font-weight:600;line-height:1.1}
.reel-interactions .reel-like>span{font-size:29px;line-height:1;color:#ff497a;transform:scale(var(--heart-beat,1));text-shadow:0 1px 6px #0005}
.reel-interactions small{font-family:Arial,sans-serif;font-size:9px;line-height:1.2;font-weight:600}
.reel-interactions .reel-more{font-size:22px;letter-spacing:1px;line-height:.4}
.reel-author{position:absolute;left:12px;bottom:27px;right:10px;z-index:7;font-family:Arial,sans-serif}
.reel-profile{display:flex;align-items:center;gap:6px}
.reel-avatar{width:25px;height:25px;display:grid;place-items:center;background:var(--blue);color:var(--cream);border:1px solid #fff;border-radius:50%;font-family:var(--font);font-size:13px;font-weight:700;letter-spacing:-.06em;flex-shrink:0}
.reel-profile>strong{font-family:Arial,sans-serif;font-size:10px;line-height:1.3;font-weight:600}
.follow-label{font-size:8px;border:1px solid #ffffff88;border-radius:4px;padding:3px 6px;margin-left:3px}
.reel-author>p{font-size:9px;line-height:1.4;margin-top:9px}
.reel-audio{font-size:7px;margin-top:7px;display:flex;gap:5px;align-items:center;color:#fff9}
.reel-audio>span{font-size:12px}
.reel-playback{position:absolute;bottom:13px;left:10px;right:10px;height:2px;background:#ffffff44;z-index:8}
.reel-playback>i{height:100%;width:var(--reel-playback,4%);background:#fff;display:block}
.engagement-card{position:absolute;border:1px solid var(--ink);border-radius:12px;background:var(--cream);color:var(--ink);padding:15px 17px;box-shadow:5px 7px 0 #17132c;z-index:7;display:flex;flex-direction:column;justify-content:start;gap:7px}
.engagement-card .metric-label{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:700;letter-spacing:.08em;white-space:nowrap}
.metric-label>span{font-size:20px;line-height:.7;color:var(--blue)}
.engagement-card>strong{font-family:var(--font);font-size:49px;line-height:.95;letter-spacing:-.055em;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.metric-caption{font-size:7px;line-height:1.4;max-width:120px}
.views-card.orbit-reel{left:-3px;top:80px;width:190px;height:150px;transform:translate3d(var(--reel-x,-30px),var(--reel-y,0px),110px) rotateZ(var(--reel-rotate,-9deg));background:var(--cream);z-index:8}
.growth-bars{display:flex;align-items:end;gap:4px;height:25px;margin-top:1px}
.growth-bars i{width:12px;background:var(--blue);border-radius:2px 2px 0 0;transform:scaleY(var(--growth-scale,.4));transform-origin:bottom}
.growth-bars i:nth-child(1){height:4px}.growth-bars i:nth-child(2){height:7px}.growth-bars i:nth-child(3){height:9px}.growth-bars i:nth-child(4){height:12px}.growth-bars i:nth-child(5){height:15px}.growth-bars i:nth-child(6){height:19px}.growth-bars i:nth-child(7){height:22px}.growth-bars i:nth-child(8){height:25px}
.likes-card{left:447px;top:105px;width:190px;height:133px;background:var(--pink);transform:translate3d(var(--likes-x,0px),var(--likes-y,0px),95px) rotateZ(var(--likes-rotate,9deg))}
.likes-card .metric-label>span{color:#de2c61}
.shares-card.orbit-script{left:432px;top:315px;width:172px;height:133px;background:var(--yellow);transform:translate3d(var(--script-x,0px),var(--script-y,0px),130px) rotateZ(var(--script-rotate,8deg));z-index:8}
.reel-universe .scene-sticker{width:91px;height:91px;left:95px;top:358px;right:auto;transform:translate3d(0,0,145px) rotate(var(--sticker-rotate,12deg))}
.reel-universe .scene-sticker span{font-size:10px}
.reel-universe .scene-ring{width:570px;height:300px;left:13px;top:115px}
.reel-universe .ring-two{width:530px;height:440px;left:33px;top:35px}
.heart-cloud{position:absolute;inset:0;transform:translateZ(165px);z-index:9;pointer-events:none}
.heart-cloud>span{position:absolute;left:50%;top:63%;font-family:Arial,sans-serif;font-size:32px;line-height:1;color:var(--pink);text-shadow:1px 2px #12132e22;opacity:0;will-change:transform,opacity}
.heart-cloud>span:nth-child(3n){color:var(--yellow);font-size:40px}
.heart-cloud>span:nth-child(2n){font-size:24px;color:#ff618f}
.reel-disclaimer{position:absolute;z-index:10;bottom:76px;left:68%;transform:translateX(-50%);font-size:9px;letter-spacing:.08em;color:#fff7e9cc;white-space:nowrap}
.scroll-enabled .reel-universe{top:51%}
.story-copy[data-chapter="2"] h2{font-size:clamp(54px,5.7vw,83px)}
.story-copy[data-chapter="3"] h2{font-size:clamp(54px,5.9vw,85px)}
@media(max-width:1100px){.reel-disclaimer{left:69%;bottom:78px;font-size:8px}}
@media(max-width:780px){.scroll-enabled .reel-universe{top:53%;left:71%}.story-copy[data-chapter="2"] h2,.story-copy[data-chapter="3"] h2{font-size:clamp(44px,6.1vw,60px)}.reel-disclaimer{left:71%;font-size:7px;bottom:91px}}
@media(max-width:600px){
 .scroll-enabled .reel-universe{left:50%;top:68%}
 .reel-universe{margin-top:-25px;margin-bottom:0}
 .reel-disclaimer{left:50%;bottom:65px;font-size:8px;letter-spacing:.04em}
 .engagement-card .metric-label{font-size:19px;letter-spacing:.02em;gap:7px}
 .metric-label>span{font-size:23px}
 .engagement-card .metric-caption{display:none}
 .engagement-card>strong{font-size:43px}
 .engagement-card{padding:13px 15px}
 .views-card.orbit-reel{width:187px;height:144px;left:-8px;top:60px}
 .likes-card{width:160px;height:117px;left:440px;top:114px}
 .shares-card.orbit-script{width:173px;height:117px;left:434px;top:365px}
 .reel-universe .scene-sticker{left:95px;top:355px}
 .story-copy[data-chapter="2"] h2,.story-copy[data-chapter="3"] h2{font-size:clamp(43px,10.5vw,58px);margin-bottom:17px}
 .story-copy[data-chapter="3"] h2{line-height:.92;font-size:44px}
 .story-copy[data-chapter="3"]>p{font-size:12px;max-width:310px}
 .story-copy[data-chapter="3"] .pill{margin-top:12px;padding:11px 17px}
}
@media(max-width:360px){.scroll-enabled .reel-universe{top:70%}.reel-disclaimer{bottom:64px;font-size:7px}.story-copy[data-chapter="3"] h2{font-size:39px}.story-copy[data-chapter="2"] h2{font-size:43px}}
@media(max-width:600px) and (max-height:700px){.scroll-enabled .reel-universe{top:73%}.shares-card.orbit-script{top:285px}.reel-disclaimer{bottom:52px;font-size:7px}.story-copy[data-chapter="3"] h2{font-size:36px;margin-top:13px;margin-bottom:12px}.story-copy[data-chapter="2"] h2{font-size:40px}.story-copy[data-chapter="3"]>p{font-size:11px;max-width:290px}.story-copy[data-chapter="3"] .pill{padding:9px 15px;margin-top:10px}.story-copy[data-chapter="3"]{top:14.5%}.reel-universe .scene-sticker{display:none}}
@media(prefers-reduced-motion:reduce){.reel-disclaimer{position:relative;display:block;left:auto;bottom:auto;transform:none;text-align:center;padding:15px 20px 30px}.reel-universe .universe-axis{transform:rotate(-3deg)}}

.reel-video{display:block;width:100%;height:100%;object-fit:cover;object-position:center;background:#15141a}
.has-reel-video .reel-playback>i{width:var(--video-progress,0%)}
.scroll-enabled .has-reel-video .reel-universe{top:48%}
.reel-media-controls{position:absolute;top:min(calc(48% + 330px * var(--scene-scale,.85)),calc(100% - 118px));left:68%;transform:translateX(-50%);z-index:25;display:flex;align-items:center;gap:8px;white-space:nowrap}
.reel-media-controls button{border:1px solid #fff7e977;border-radius:999px;background:#211c47cc;color:var(--cream);font-size:11px;line-height:1.2;padding:8px 15px;min-width:70px;min-height:40px;backdrop-filter:blur(8px)}
.reel-media-controls button:hover{background:var(--cream);color:var(--ink)}
.has-reel-video .reel-disclaimer{top:min(calc(48% + 330px * var(--scene-scale,.85) + 52px),calc(100% - 65px));bottom:auto}
@media(max-width:1100px){.reel-media-controls{left:69%}}
@media(max-width:780px){.reel-media-controls{left:71%}}
@media(max-width:600px){.scroll-enabled .has-reel-video .reel-universe{top:66%}.reel-media-controls{left:50%;top:auto;bottom:91px}.reel-media-controls button{min-height:44px;padding:8px 15px;font-size:11px}.has-reel-video .reel-disclaimer{top:auto;bottom:65px}}
@media(max-width:600px) and (max-height:700px){.scroll-enabled .has-reel-video .reel-universe{top:68%}.reel-media-controls{bottom:70px}.has-reel-video .reel-disclaimer{bottom:52px}}
@media(prefers-reduced-motion:reduce){.reel-media-controls{position:relative;left:auto;top:auto;bottom:auto;transform:none;justify-content:center;margin:20px 0 0}.has-reel-video .reel-disclaimer{top:auto;bottom:auto}}
