@font-face{font-family:Barlow;src:url('src/native/fonts/BarlowCondensed-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:#151e20;color:#f2eee5;font:16px/1.6 system-ui,-apple-system,sans-serif}a{color:inherit;text-underline-offset:5px}a:hover{color:#ffd5a0}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid #ffd5a0;outline-offset:5px}header,main,footer{width:min(1440px,calc(100% - 40px));margin:auto}
header{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:15px 0 18px}header>div{display:flex;gap:16px;align-items:center}h1,h2,h3{font-family:Barlow,sans-serif;font-weight:600;margin:0;line-height:1.1}h1{font-size:24px;letter-spacing:1px}header span{font-size:11px;color:#a9b5b1}nav{display:flex;gap:18px;font-size:12px;white-space:nowrap}
.gallery-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:26px;align-items:start}.main-view{padding-top:32px}.hero{margin:0}.hero img{display:block;width:100%;height:auto;border-radius:4px}figcaption{font-size:11px;color:#a9b5b1;margin-top:6px}.project-note{font-size:13px;line-height:1.5;margin:15px 0 8px;max-width:470px}.muted{color:#a9b5b1;font-size:12px}.details-link{font-size:12px;color:#d8bb9f}.section-heading{height:32px;display:flex;justify-content:space-between;align-items:start;gap:12px}.section-heading h2{font-size:18px}.section-heading p{margin:0;font-size:10px;color:#a9b5b1}.scene-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px}.scene-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}h3{font-size:20px}.selection{font-size:10px;color:#cdb49a;white-space:nowrap}
.stage{position:relative;aspect-ratio:16/9;isolation:isolate;border-radius:4px;background:#202a2d}.slices{position:absolute;inset:0;display:grid;grid-template-columns:repeat(7,1fr);overflow:hidden;border-radius:4px}.slice{position:relative;background-size:700% 100%;background-position:var(--position) 50%;border-right:1px solid #ffffff16;cursor:pointer;z-index:2;text-decoration:none;display:flex;align-items:flex-end;justify-content:center;min-width:0}.slice:last-child{border:0}.slice span{font-size:8px;line-height:1.4;white-space:nowrap;text-align:center;color:white;text-shadow:0 1px 4px #000;padding:18px 0 5px;background:linear-gradient(transparent,#0009);width:100%}.slice:hover span,.slice:focus-visible span,.slice[aria-current=true] span{color:#ffe0b2;font-weight:750}.slice:focus-visible{outline-offset:-3px;z-index:5}.full-view{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:1;border-radius:4px}.stage.previewing .slice{background-image:none!important;border-color:transparent}.stage.previewing .slice span{opacity:0}.stage.previewing .slice:hover span,.stage.previewing .slice:focus-visible span{opacity:1}.time-label{position:absolute;top:8px;left:10px;color:white;font-size:11px;text-shadow:0 1px 5px #000;z-index:3;pointer-events:none}.scene-actions{display:flex;justify-content:space-between;gap:8px;align-items:center;min-height:25px;padding-top:4px;font-size:10px}.open-art{margin-left:auto;color:#b8c3be}.reset{background:none;border:0;color:#d8bb9f;padding:0;font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
footer{display:flex;justify-content:space-between;gap:24px;border-top:1px solid #ffffff18;padding:12px 0 16px;margin-top:18px;font-size:10px;color:#92a29c}footer span{max-width:900px}footer a{white-space:nowrap}
@media(min-width:1500px){.gallery-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media(max-width:1000px){header>div{display:block}header span{font-size:10px}.gallery-layout{grid-template-columns:1fr;gap:14px}.main-view{padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 18px;align-items:start}.hero{grid-row:1/4}.project-note{margin:0 0 10px}.scene-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.section-heading{height:30px}.selection{display:none}h3{font-size:19px}.slice span{font-size:8px}}
@media(max-width:600px){header,main,footer{width:calc(100% - 24px)}header{padding:12px 0}header>div span{display:none}h1{font-size:21px}nav{gap:12px;font-size:10px}.main-view{display:block}.project-note{margin-top:10px}.muted{font-size:11px}.scene-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}.scene-actions{font-size:9px}.slice span{font-size:7px}.section-heading p{font-size:9px}footer{display:block}footer a{display:block;margin-top:7px}h3{font-size:17px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
