.reels-page{height:100dvh;max-width:none;overflow:hidden}.reels-page header{height:84px}.reels-stage{height:calc(100dvh - 84px);position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;touch-action:pan-x}.reel-wrap{height:calc(100% - 105px);aspect-ratio:9/16;max-width:calc(100vw - 110px);background:#050505;position:relative;min-height:200px}.reel-wrap iframe{pointer-events:none}.reel-navigation{position:absolute;left:calc(50% + (100dvh - 189px)*.28125 + 22px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:15px}.reel-navigation span{font-size:.875rem;white-space:nowrap;color:#aaa}.reel-navigation button{border:1px solid #555;background:#222;color:#fff;border-radius:50%;width:46px;height:46px;font-size:1.4rem}.reel-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;padding:0 10px}.reel-toolbar button{background:#222;border:1px solid #555;border-radius:5px;padding:8px 12px;color:#fff;font-size:.875rem}.reel-toolbar a,.reel-hint{font-size:.875rem}.reel-hint{color:#aaa;margin:0;text-align:center;padding:0 12px}.reel-navigation button:hover:enabled,.reel-toolbar button:hover:enabled{border-color:var(--accent)}@media(max-width:600px){.reels-page header{height:72px}.reels-stage{height:calc(100dvh - 72px);gap:12px}.reel-wrap{height:calc(100% - 110px)}.reel-navigation{left:auto;right:10px}.reel-navigation button{width:38px;height:38px}.reel-toolbar{gap:8px}.reel-toolbar a{font-size:.875rem}}@media(max-height:490px){.reels-page{overflow:auto}.reels-stage{min-height:400px}.reel-wrap{height:285px}.reel-navigation{left:auto;right:12px}}
/* Shared light social interface; the video remains on a dark viewing surface. */
.reels-page{background:#f7f8fa}.reels-page header{height:76px}.reels-stage{height:calc(100dvh - 76px)}.reel-wrap{border-radius:16px;overflow:hidden;box-shadow:0 8px 35px #253c5b16}.reel-navigation span,.reel-hint{color:#656c77}.reel-navigation button{background:#fff;color:#303b4a;border:1px solid #e0e5ed;box-shadow:0 2px 5px #20345108}.reel-toolbar button{background:#fff;color:#27354a;border:1px solid #dce2eb;border-radius:9px}.reel-toolbar a{color:#216be8}.reel-navigation{left:calc(50% + (100dvh - 181px)*.28125 + 22px)}@media(max-width:600px){.reels-page header{height:68px}.reels-stage{height:calc(100dvh - 68px)}.reel-navigation{left:auto;right:10px}}@media(max-height:490px){.reel-navigation{left:auto;right:12px}}

.reel-wrap [hidden]{display:none!important}.reel-wrap #instagram{pointer-events:auto;background:white}.reel-toolbar [hidden]{display:none}

.reels-page .site-menu{margin-left:auto}

.reel-wrap #instagram{pointer-events:none}.reel-wrap #instagram.interactive{pointer-events:auto}

.reel-wrap #instagram{pointer-events:auto}

.reel-wrap iframe{pointer-events:auto}
/* Warm viewing room, using the shared portfolio palette. */
.reels-page{color-scheme:light;background:var(--ivory);background-image:radial-gradient(ellipse at 48% 40%,var(--ivory) 10%,var(--limestone) 100%);color:var(--fg)}
.reels-page header{background:var(--ivory);border-color:var(--limestone)}
.reels-page .site-menu nav{background:var(--ivory);border-color:var(--limestone);box-shadow:0 16px 45px #24272818}
.reels-page .site-menu summary:hover,.reels-page .site-menu nav a:hover{background:var(--limestone)}
.reels-page .site-menu nav a:hover{color:var(--accent)}
.reels-page .reel-wrap{background:var(--fg);box-shadow:0 0 0 1px var(--limestone),0 24px 80px #573C2D26;border-radius:18px}
.reels-page .reel-navigation button,.reels-page .reel-toolbar button{background:var(--ivory);border:1px solid var(--walnut);color:var(--walnut);box-shadow:0 4px 18px #573C2D12;transition:background .18s,border-color .18s}
.reels-page .reel-navigation button:hover:enabled,.reels-page .reel-toolbar button:hover:enabled{background:var(--limestone);border-color:var(--accent);color:var(--accent)}
.reels-page .reel-toolbar a{color:var(--accent)}
.reels-page .reel-hint{color:var(--walnut)}
.reels-page a:focus-visible,.reels-page button:focus-visible,.reels-page summary:focus-visible{outline-color:var(--accent)}
@media(prefers-reduced-motion:reduce){.reels-page .reel-navigation button{transition:none}}
