/* Local, real MP4 works. Posters remain available before playback. */
.art-frame>video{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.03)}
.hero-motion-toggle{position:absolute;right:22px;top:20px;z-index:3;border-radius:50%;border:1px solid #e8d9ff4d;background:#0d081c80;backdrop-filter:blur(12px);width:38px;height:38px;display:grid;place-items:center;color:#e5daff;font-size:13px}
.showcase-visual{height:440px;background:#15121f;border:1px solid #c1aaff25}
.showcase-visual>video{display:block;width:100%;height:100%;object-fit:cover}
.showcase-visual #showcase-image-src{display:none}
.motion-topline{position:absolute;top:17px;left:18px;right:18px;display:flex;justify-content:space-between;align-items:center;gap:10px;pointer-events:none;color:#f2eaff;font:8px/1.5 var(--font);letter-spacing:1.5px;text-shadow:0 1px 10px #000}
.motion-topline>span:first-child{background:#0d091a70;backdrop-filter:blur(10px);padding:6px 9px;border:1px solid #fff2;border-radius:3px}
.motion-topline>span:last-child{display:flex;align-items:center;gap:7px;font-size:8px}
.showcase-visual .visual-tag{bottom:65px;left:16px;right:16px;font-size:10px;pointer-events:none;background:#0d0a17cc}
.motion-controls{position:absolute;bottom:14px;left:16px;right:16px;display:flex;align-items:center;gap:13px;border:1px solid #fff2;padding:9px 12px;border-radius:5px;background:#0d0a17e8;backdrop-filter:blur(16px)}
.motion-controls button,.motion-controls a{font-size:10px;color:#ede3ff;padding:3px 1px;white-space:nowrap;flex:none}
.motion-controls button:hover,.motion-controls a:hover{color:var(--lime)}
.motion-controls input{flex:1;width:30px;min-width:25px;accent-color:var(--purple);height:3px;cursor:pointer}
.motion-clock{font-size:9px;color:#c7b9d7;font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}
#motion-error{position:absolute;left:16px;right:16px;top:70px;padding:10px 14px;border-radius:5px;background:#181020df;color:#eee4fa;font-size:12px}
.motion-work-card{min-width:0}.motion-work-card .inspiration-image{height:285px;border:1px solid #c7acff24;isolation:isolate;background:#17121e}
.motion-work-card video{height:100%;width:100%;object-fit:cover;transition:transform .8s var(--ease)}
.motion-work-card:hover video{transform:scale(1.035)}
.motion-work-card .inspiration-image:after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#0b0719b0);pointer-events:none}
.film-label{position:absolute;top:14px;left:14px;border:1px solid #fff3;background:#0d071b80;backdrop-filter:blur(8px);padding:4px 8px;font-size:8px;letter-spacing:1px;border-radius:3px}
.watch-film{position:absolute;bottom:16px;left:16px;right:16px;z-index:1;display:flex;justify-content:space-between;align-items:center;color:#f5edff;font-size:11px;padding:8px 0;text-align:left}
.watch-film>span:first-child{display:flex;align-items:center;gap:9px}.watch-film b{border-radius:50%;border:1px solid #fff6;background:#ffffff12;width:30px;height:30px;display:grid;place-items:center;font-size:9px;font-weight:400}
.motion-work-card .inspiration-caption{align-items:center}.motion-work-card .inspiration-caption>button{font-size:9px;color:var(--muted);padding:8px 0;white-space:nowrap}
.motion-work-card .inspiration-caption>button:hover{color:var(--purple)}
.motion-gallery-note{display:flex;align-items:center;gap:8px;color:#8e809f;font-size:10px;margin-top:20px;line-height:1.8}
.motion-dialog{width:min(1100px,calc(100% - 32px));padding:20px;background:#0e0b16;max-height:94vh}
.motion-dialog-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:15px}.motion-dialog h2{font-size:22px;font-weight:400;margin-top:5px}.motion-dialog video{width:100%;max-height:65vh;display:block;object-fit:contain;background:#08060d;border-radius:5px}
.motion-dialog-foot{display:flex;gap:20px;justify-content:space-between;align-items:center;margin-top:18px}.motion-dialog-foot p{font-size:12px;color:#b0a2c1}.motion-dialog-foot small{font-size:9px;color:#766482;display:block;margin-top:5px}.motion-dialog .button{font-size:11px}
.motion-failed{opacity:.7}
@media(max-width:850px){.showcase-visual{height:385px}.motion-controls{gap:8px;left:10px;right:10px;padding:8px}.showcase-visual .visual-tag{left:10px;right:10px;font-size:9px}.motion-controls button,.motion-controls a{font-size:9px}.motion-clock{font-size:8px}.motion-controls .motion-download{display:none}.motion-topline{left:12px;right:12px;font-size:7px;letter-spacing:.7px}.motion-topline>span:last-child{font-size:7px}.motion-work-card .inspiration-image{height:235px}}
@media(max-width:650px){.showcase-visual{height:340px}.motion-controls{min-height:44px;bottom:10px;gap:9px}.motion-controls button,.motion-controls a{min-height:26px;font-size:10px}.motion-controls input{height:5px}.motion-clock{font-size:8px}.showcase-visual .visual-tag{bottom:63px;font-size:9px}.motion-work-card .inspiration-image{height:310px}.watch-film{min-height:44px}.motion-work-card .inspiration-caption>button{min-height:44px;font-size:10px}.motion-dialog{padding:14px}.motion-dialog-head{margin-bottom:12px}.motion-dialog h2{font-size:18px}.motion-dialog-foot{align-items:start;flex-direction:column;gap:12px}.motion-dialog-foot p{font-size:11px}.motion-dialog-foot .button{width:100%}.hero-motion-toggle{width:40px;height:40px}}
