.motion-studio{max-width:1370px;padding:32px 35px 40px;margin:auto}.motion-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:32px 0 26px}.motion-intro h1{font-size:32px;letter-spacing:1px;margin:7px 0 9px;font-weight:500}.motion-intro p{font-size:12px;color:#a8bcb1}.motion-intro .gold-button{width:auto;margin:0;font-size:12px;white-space:nowrap}.motion-intro .gold-button span{margin-left:18px}.motion-spotlight{display:grid;grid-template-columns:1.5fr 1fr;padding:22px;gap:30px;background:#10252cef}.preview-stage{position:relative;height:310px;overflow:hidden;border:1px solid #65796a;background:#203736}.stage-checkers{position:absolute;inset:65px -40px 4px;background:repeating-conic-gradient(#506c61 0% 25%,#314d4d 0% 50%) 0/92px 92px;transform:perspective(520px) rotateX(38deg);box-shadow:0 7px #172f32;border:3px solid #82957b}.preview-stage:after{position:absolute;content:'';inset:0;box-shadow:inset 0 0 0 5px #0a252335;pointer-events:none}.preview-stage canvas{image-rendering:pixelated;position:absolute;width:205px;height:205px;bottom:41px;z-index:3}.preview-stage #hero-canvas{left:4%}.preview-stage #target-canvas{right:2%;opacity:.85}.preview-stage #hero-effect{left:38%;bottom:42px;width:205px;height:205px;z-index:5}.stage-shadow{position:absolute;bottom:50px;width:85px;height:17px;background:#172e29a6;clip-path:polygon(10% 0,80% 0,100% 30%,100% 60%,80% 100%,10% 100%,0 60%,0 25%);z-index:1}.caster-shadow{left:calc(4% + 58px)}.target-shadow{right:calc(2% + 58px)}.stage-label{position:absolute;top:14px;left:15px;font-size:9px;letter-spacing:2px;color:#bfceaf}.effect-caption{position:absolute;bottom:13px;right:16px;font-size:10px;color:#e1ca9a;background:#20302fd6;padding:4px 8px;z-index:6}.motion-controls{padding:5px 3px}.motion-controls h2{font-size:20px;margin:7px 0 20px;letter-spacing:.5px}.control-row{display:flex;align-items:center;gap:15px;font-size:11px;color:#b3c5b8}.control-row select{flex:1}.motion-controls select{font:inherit;color:#e0d5b3;background:#244044;border:1px solid #7b8c78;padding:6px 8px}.team-switch{display:flex;gap:8px;margin:13px 0}.team-switch button{background:#1d383e;color:#99bbae;border:1px solid #58746c;padding:6px 14px;font-size:10px}.team-switch button.active{background:#355d58;border-color:#99c9af;color:#e0e9c2}.team-switch button[data-team='1'].active{background:#653e52;border-color:#c499aa}.motion-action-list{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:15px}.motion-action-list button{font-size:10px;padding:5px 10px;background:#1b3338;border:1px solid #69796b}.motion-action-list button.active{background:#8d724d;border-color:#cab37e;color:#fff1c6}.playback-line{display:flex;align-items:center;justify-content:space-between}.playback-line label{font-size:10px;color:#a2b6ac}.playback-line select{padding:4px 7px;margin-left:7px}.scrub-label{display:block;font-size:9px;color:#94b0a3;margin-top:15px}.scrub-label span{float:right;font-family:monospace;color:#d0bd8d}.scrub-label input{display:block;width:100%;accent-color:#c7ad71;height:4px;margin:8px 0 0}.motion-note{font-size:9px;line-height:1.8;color:#8faf9f;margin-top:15px}.studio-section{margin-top:31px}.section-title{display:flex;align-items:end;justify-content:space-between;margin-bottom:16px}.section-title h2{font-size:20px;margin-top:5px}.technical-badge{font-size:8px;letter-spacing:1px;color:#99b2a1;border:1px solid #617668;padding:5px 8px}.effect-gallery{display:grid;grid-template-columns:repeat(9,1fr);gap:11px}.effect-card{background:#152c31e8;border:1px solid #536b61;cursor:pointer;padding:11px 5px 10px;text-align:center;color:#e3d5b5}.effect-card.active{border-color:#d3b878;box-shadow:inset 0 -3px #b99761}.effect-card:hover{background:#274440}.effect-card canvas{display:block;width:100%;max-width:111px;aspect-ratio:1;margin:auto;image-rendering:pixelated}.effect-card strong{display:block;margin-top:4px;font-size:12px;letter-spacing:1px}.effect-card small{display:block;font-size:8px;color:#94afa0;margin-top:3px;letter-spacing:.7px}.motion-gallery{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.motion-card{border:1px solid #5c7265;background:#132b30e8;padding:14px 10px;text-align:center}.motion-card canvas{display:block;width:150px;height:150px;max-width:100%;margin:0 auto;image-rendering:pixelated}.motion-card strong{display:block;font-size:12px;letter-spacing:.5px;margin:4px 0}.motion-card small{font-size:8px;color:#9ab49f;letter-spacing:1px}.studio-footer{display:flex;justify-content:space-between;gap:15px;border-top:1px solid #617262;margin-top:27px;padding-top:15px;font-size:10px;color:#a3b6a8}.studio-footer>span{font-size:8px;letter-spacing:1px;color:#718b81;white-space:nowrap}
@media(max-width:1000px){.effect-gallery{grid-template-columns:repeat(5,1fr)}.motion-spotlight{gap:18px;padding:17px;grid-template-columns:1.2fr 1fr}.preview-stage{height:295px}.preview-stage canvas{width:155px;height:155px}.preview-stage #hero-effect{width:155px;height:155px;left:33%}.stage-shadow{width:64px}.caster-shadow{left:calc(4% + 44px)}.target-shadow{right:calc(2% + 44px)}.motion-controls h2{font-size:17px}.motion-controls{padding:1px}.team-switch button{padding:6px 9px}.motion-action-list button{padding:4px 7px}.motion-gallery{gap:8px}.motion-card canvas{height:auto;aspect-ratio:1}.motion-intro h1{font-size:28px}}
@media(max-width:650px){.motion-studio{padding:20px 12px}.motion-intro{display:block;margin:23px 0}.motion-intro h1{font-size:26px}.motion-intro p{font-size:11px;line-height:1.8}.motion-intro .gold-button{margin-top:14px;width:100%}.motion-spotlight{grid-template-columns:1fr;padding:12px;gap:17px}.preview-stage{height:255px}.preview-stage canvas{width:157px;height:157px;bottom:31px}.preview-stage #hero-effect{bottom:33px;width:155px;height:155px}.motion-controls{padding:4px}.motion-controls h2{margin-bottom:15px}.effect-gallery{grid-template-columns:repeat(3,1fr)}.motion-gallery{grid-template-columns:repeat(3,1fr)}.motion-card{padding:11px 6px}.section-title h2{font-size:17px}.technical-badge{font-size:6px;padding:4px 5px;letter-spacing:.5px}.studio-footer{display:block}.studio-footer>span{display:block;margin-top:10px}}