.reels-section{position:relative;isolation:isolate;overflow:hidden;background:#0d0a12;color:#f2edf7;padding:52px 0 48px;border-block:1px solid #d4b2ff25;scroll-margin-top:70px}
.reels-section:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 62%,#62358d38,transparent 65%);pointer-events:none}
.reels-topline{display:flex;justify-content:space-between;gap:20px;margin:0 var(--space);font-size:10px;letter-spacing:2px;color:#a69aaf}
.reels-topline a{color:#cda5fc;letter-spacing:0;text-decoration:underline;text-underline-offset:5px}
.reels-heading{text-align:center;margin:42px 20px 0}.reels-badge{display:inline-block;border:1px solid #bb8af74a;background:#bb8af712;border-radius:30px;padding:9px 17px;font-size:10px;letter-spacing:2px;color:#d3b5f7}
.reels-heading h2{font-size:clamp(42px,5.8vw,86px);line-height:.98;letter-spacing:-.055em;margin:22px 0 18px}.reels-heading h2 em{color:#c599f7}.reels-heading p{font-size:13px;color:#b4a9be;line-height:1.9}.reels-hand{font-style:italic;font-size:17px;color:#cfaaef;position:absolute;right:9%;top:240px;transform:rotate(12deg)}
.reels-stage{position:relative;height:470px;margin-top:12px;overflow:hidden;cursor:grab;touch-action:pan-y pinch-zoom;user-select:none}.reels-stage.is-dragging{cursor:grabbing}
.reel-card{position:absolute;left:0;top:0;width:208px;aspect-ratio:9/16;padding:0;border:1px solid #d8baff38;border-radius:18px;overflow:hidden;background:#211a2c;transform-origin:center;will-change:transform;text-align:left;touch-action:pan-y pinch-zoom}
.reel-card img{height:100%;width:100%;object-fit:cover;pointer-events:none;opacity:.85}.reel-card:after{content:"";position:absolute;inset:0;background:linear-gradient(#10091c30,transparent 30%,#10091c 100%);pointer-events:none}
.reel-card .reel-number{position:absolute;top:14px;left:14px;z-index:1;font-size:9px;letter-spacing:1px;color:#fff;background:#120b21aa;padding:7px 9px;border-radius:20px}
.reel-card .reel-caption{position:absolute;bottom:19px;left:17px;right:17px;z-index:1;color:#fff}.reel-caption small{font-size:9px;color:#c3abcF;letter-spacing:1px}.reel-caption strong{display:block;font-size:19px;line-height:1.2;margin:10px 0 17px;letter-spacing:-.4px}.reel-play{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid #fff7;border-radius:50%;background:#ffffff18;font-size:11px}.reel-duration{float:right;font-size:10px;margin-top:11px;color:#d7c9e0}
.reels-controls{display:flex;justify-content:center;align-items:center;gap:12px;margin:0 20px}.reels-controls button{min-height:44px;border-radius:28px;padding:13px 22px;background:#d2a9fb;color:#1d112a;font-size:12px}.reels-controls .reels-arrow{width:44px;padding:0;border:1px solid #c09bd450;background:transparent;color:#e1c8fa;font-size:20px}.reels-note{text-align:center;margin:17px 20px 0;color:#96849f;font-size:11px}
#reel-dialog{width:min(890px,94vw);border-radius:22px;background:#100d15;padding:0;max-height:92dvh}#reel-dialog .reel-modal-grid{display:grid;grid-template-columns:minmax(0,360px) 1fr;align-items:center}#reel-dialog video{display:block;width:100%;aspect-ratio:9/16;max-height:86dvh;background:#050407;object-fit:contain}#reel-dialog .reel-details{padding:36px}#reel-dialog h3{font-size:30px;letter-spacing:-1px;margin:18px 0;line-height:1.1}#reel-dialog p{color:#b8a9c3;font-size:13px}#reel-dialog .reel-modal-close{position:absolute;top:12px;right:12px;z-index:3;border:1px solid #fff5;border-radius:50%;width:44px;height:44px;background:#17121ddd;color:#fff;font-size:25px}#reel-dialog .reel-modal-tag{color:#c99bf7;font-size:10px;letter-spacing:2px}#reel-dialog .reel-placeholder{margin-top:22px;padding:13px;border:1px solid #c399f12a;border-radius:10px;font-size:11px;color:#c8add9}
@media(max-width:820px){.reels-section{padding-top:35px}.reels-topline{font-size:8px;letter-spacing:1px}.reels-heading{margin-top:32px}.reels-heading h2{font-size:clamp(40px,9vw,64px)}.reels-heading p{font-size:12px}.reels-hand{display:none}.reels-stage{height:365px;margin-top:18px}.reel-card{width:158px;border-radius:14px}.reel-caption strong{font-size:16px}.reel-card .reel-caption{left:13px;right:13px;bottom:14px}.reel-caption small{font-size:8px}.reels-note{font-size:10px;line-height:1.8}#reel-dialog{width:min(390px,94vw)}#reel-dialog .reel-modal-grid{display:block}#reel-dialog video{max-height:68dvh}#reel-dialog .reel-details{padding:20px}#reel-dialog h3{font-size:23px;margin:10px 0}#reel-dialog .reel-placeholder{margin-top:12px}}
@media(prefers-reduced-motion:reduce){.reel-card{will-change:auto}}
/* Matching icon-only playback controls for the two galleries. */
#work-toggle,#reels-toggle{display:inline-grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border-radius:50%;flex:0 0 44px;}
#work-toggle svg,#reels-toggle svg{display:block;width:18px;height:18px;}
.reel-empty{background:radial-gradient(ellipse at 65% 28%,#7847a32e,transparent 65%),linear-gradient(145deg,#21182d,#110d19);cursor:grab}
.reel-empty:nth-child(even){background:radial-gradient(ellipse at 25% 40%,#8b5db32b,transparent 65%),linear-gradient(160deg,#191221,#24182f)}
.reel-empty-symbol{position:absolute;inset:0;display:grid;place-items:center;color:#c59be575;font-size:40px;font-weight:200}
.reel-coming{font-size:11px;color:#a58bb7}.reel-empty .reel-caption strong{font-size:18px;font-weight:500}
.reel-cover-video{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none;opacity:.85}.reel-caption strong{overflow-wrap:anywhere}
#reel-dialog .reel-modal-grid{align-items:start}#reel-dialog video{position:sticky;top:0}#reel-dialog .reel-details{padding:30px} .reel-social{margin-top:24px;padding-top:20px;border-top:1px solid #c599f730}.reel-social h4{font-size:10px;letter-spacing:1.5px;color:#c599f7;margin:0 0 16px}.reel-social blockquote{margin:0;font-size:17px;line-height:1.5;color:#f2edf7}.social-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:20px}.social-stats>div{padding:12px 8px;background:#c599f70c;border:1px solid #c599f725;border-radius:12px}.social-stats strong{display:block;font-size:23px;color:#dcc2ff}.social-stats span{display:block;margin-top:5px;font-size:10px;color:#b8a9c3}#reel-dialog .social-date{font-size:10px;line-height:1.7;color:#96849f}.reel-social a{font-size:12px;color:#d3b5f7}.reel-social details{margin-top:20px}.reel-social summary{font-size:12px;cursor:pointer;color:#c8add9}.reel-social img{width:100%;height:auto;border-radius:8px;margin-top:12px}@media(max-width:820px){#reel-dialog video{position:static}#reel-dialog .reel-details{padding:22px}}
/* Mobile modal: keep dismissal reachable while browsing long social details. */
#reel-dialog{max-height:92vh;max-height:92dvh;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
#reel-dialog .reel-modal-close{position:sticky;float:right;top:max(12px,env(safe-area-inset-top));margin:12px 12px -56px 0;right:auto;z-index:5}
#reel-dialog .reel-details{min-width:0;padding-bottom:max(24px,env(safe-area-inset-bottom))}
#reel-dialog .reel-role,.reel-social blockquote{overflow-wrap:anywhere}
.reel-social summary{min-height:44px;display:flex;align-items:center;gap:8px}.reel-social summary:before{content:'＋'}.reel-social details[open] summary:before{content:'−'}
@media(max-width:820px){#reel-dialog video{max-height:68vh;max-height:68dvh}.reels-heading h2{font-size:clamp(32px,9vw,64px)}}
@media(max-width:600px){.method{grid-template-columns:minmax(0,1fr)}.method-intro,.method-list{min-width:0}.method-intro h2{font-size:clamp(30px,10.5vw,63px)}.method-list summary>div{min-width:0}.method-list summary h3{overflow-wrap:anywhere}.method-list summary .step-number{flex-shrink:0}.method-list summary>b{flex-shrink:0}.method-list .step-body{overflow-wrap:anywhere}}
.social-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
#project-description{white-space:pre-line}