:root{color-scheme:light;--studio-ink:#314839;--studio-porcelain:linear-gradient(145deg,#fffefd,#f1f1eb)}
*{box-sizing:border-box}body{margin:0;background:#f5f5ef;color:#455747;font-family:"Segoe UI",Arial,sans-serif;overflow-x:hidden}
button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid #71983b;outline-offset:3px}
.motion-viewport{position:relative;width:100%;aspect-ratio:1600/760;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#fffefb 0%,#f3f3ed 70%)}
.motion-stage{position:absolute;width:1600px;height:760px;transform-origin:0 0;perspective:1800px;overflow:hidden}
.motion-floor{position:absolute;left:15%;right:15%;bottom:14px;height:120px;background:radial-gradient(ellipse,#59734420,transparent 70%);filter:blur(20px)}
#report-plane{position:absolute;transform-origin:50% 50%;transform-style:preserve-3d}
.motion-controls{display:flex;justify-content:center;align-items:center;gap:20px;padding:14px 20px 0;min-height:52px}
.motion-controls button{min-height:36px;min-width:65px;border:1px solid #d6dfcb;border-radius:20px;padding:7px 15px;background:#fffef9;color:#4b6240;font-size:12px;font-weight:600}
.report-choices{display:flex;gap:8px;align-items:center}.report-choices button{width:32px;min-width:32px;height:32px;min-height:32px;padding:0;border-radius:50%;background:#e8eedf}
.report-choices button[aria-pressed="true"]{background:#6d923b;color:#fff;border-color:#6d923b}
.motion-caption{margin:10px 10px 16px;text-align:center;font-size:11px;color:#75846b;line-height:1.5}
@media(max-width:500px){.motion-controls{gap:12px;padding-top:8px}.report-choices{gap:5px}.motion-caption{font-size:10px;margin-bottom:8px}}

/* Controls retain their physical size while the film preview scales. */
html{-webkit-text-size-adjust:100%}
.motion-player{display:flow-root;min-width:0}
[hidden]{display:none!important}
button{touch-action:manipulation}
.motion-controls{flex-wrap:wrap;gap:12px;padding:14px 16px 0}
.motion-controls button{min-height:44px;font-size:13px;padding:9px 14px;line-height:1.4}
.motion-controls button:disabled{opacity:.5;cursor:default}
.report-choices{gap:6px;flex-wrap:wrap;justify-content:center}
.report-choices button{width:44px;height:44px;min-width:44px;padding:0}
.motion-caption{font-size:12px;line-height:1.6;margin:12px 16px 16px;overflow-wrap:anywhere}
.report-inspection{padding:0 12px}
.inspection-hint{margin:0;padding:14px 4px;color:#526548;font-size:13px;line-height:1.5}
.report-detail-scroll{width:100%;height:420px;overflow:auto;overscroll-behavior:contain;border:1px solid #d6dfcb;border-radius:8px;background:#f4f6ef}
.report-detail-scroll:focus-visible{outline:3px solid #71983b;outline-offset:2px}
.report-detail-canvas{width:1600px;height:900px;position:relative}
@media(max-width:620px){
  .motion-controls{display:grid;grid-template-columns:auto auto;justify-content:center;gap:10px 8px}
  .report-choices{grid-column:1/-1;justify-content:center}
  .report-detail-scroll{height:360px}
}
@media(max-height:480px) and (min-width:621px){.report-detail-scroll{height:280px}}