:root{--paper:#000;--ink:#f0eee7;--film:#000;--light:#f0eee7;--muted:#aaa;--gutter:6vw;--frame-w:100vw;--image-h:100svh;--edge:var(--rail);--gap:0px;--reel-top:0px}
html,body{background:#000;color:var(--light)}
.stage{overflow:clip}
.reel-window{inset:0;touch-action:pan-y}
.filmstrip{display:flex;flex-direction:column;gap:0;width:100%;padding:0;background:#000;box-shadow:none;transform:translate3d(0,0,0)}
.reel-cycle{display:flex;flex-direction:column;flex:0 0 auto;width:100%}
[data-reel-role="loadStatus"]:empty{display:none}
.frame{width:100%;height:auto;flex:0 0 auto;padding:var(--divider) var(--rail);background:#000}
.frame--intro{height:100svh;flex:0 0 100svh}
.frame-image{width:100%;height:auto;aspect-ratio:16/9;border:0;border-radius:0;box-shadow:none;outline-offset:0;background:#000}
.frame--portrait .frame-image{aspect-ratio:16/9;background:#000}
.project-play img,.project-play video,.frame--portrait .project-play img,.frame--portrait .project-play video{object-fit:contain;border:0;border-radius:0;box-shadow:none}
.frame-caption{display:none}
.opening{height:100%;aspect-ratio:auto;display:flex;flex-direction:column;justify-content:space-between;padding:34px 3vw 28px;background:#000}
.masthead{position:static;padding:0;background:none;display:flex;align-items:center;justify-content:space-between;font-size:13px}
.masthead nav{gap:30px}.opening-label{font-size:12px;color:#98988e}
.opening h1{font-size:14.7vw;line-height:.81;letter-spacing:-.082em;padding:28px 0;margin:0;font-weight:500}
.opening h1 span:last-child{font-size:.89em}
.hero-bottom{display:flex;flex-direction:column;gap:20px}
.under-reel{position:static;display:flex;justify-content:flex-end;gap:20px;align-items:center;font-size:11px}
.now{display:none}.transport{gap:18px}.transport>span{color:#8e8e83}.transport button{font-size:23px;width:32px;height:36px}
.scroll-hint{font-size:10px;line-height:1.7;gap:15px}.scroll-hint>span:first-child{font-size:28px}
.footer{position:static;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:10px}
.frame-index{gap:3px}.frame-index button{width:16px;height:34px}.frame-index span{background:#48483e}.frame-index button[aria-current=true] span{background:#e3e1d4}
.footer-tools{gap:25px;display:flex;align-items:center;flex-wrap:wrap}.footer-tools a{position:static;font-size:10px}.footer-tools button{position:static;font-size:10px}
.demo-note{position:static;margin:0;color:#77786e;font-size:9px;line-height:1.5}
#loadStatus:empty{display:none}#loadStatus:not(:empty){position:static;background:#000;color:#f0eee7;margin:0}
.stage::before,.stage::after,.masthead::before,.masthead::after{content:none}
.player-shell{padding:26px 4.8vw}.player-header h2{font-size:25px}
@media(max-width:700px){
  .opening{padding:27px 17px 22px}.masthead{font-size:10px}.masthead nav{gap:17px}.opening-label{font-size:8px}
  .opening h1{font-size:14.8vw;line-height:.83;padding:20px 0}.opening h1 span:last-child{font-size:.89em}
  .hero-bottom{gap:14px}.under-reel{gap:10px}.scroll-hint{font-size:8px;gap:9px}.scroll-hint>span:first-child{font-size:22px}
  .transport{gap:5px}.transport button{width:27px;font-size:20px}.transport>span{font-size:8px;min-width:43px}
  .footer{display:flex;flex-wrap:wrap;gap:12px}.frame-index{gap:2px}.frame-index button{width:12px;height:30px}
  .footer-tools{width:100%;justify-content:space-between;gap:12px}.footer-tools a,.footer-tools button{font-size:8px}
  .demo-note{font-size:7px}.player-shell{padding:20px 18px}.player-header h2{font-size:20px}
}
@media(max-height:700px){.opening{padding-top:20px;padding-bottom:15px}.opening h1{font-size:min(14.7vw,24vh);padding:12px 0}.hero-bottom{gap:10px}}
