/* Same rail, canvas, inspector widths and blue selection as UI animation. */
#v-motion{--accent-soft:#edf1fc;--accent-ink:#4566cb;--surface-2:#f5f7fa;--ink-2:#59667b;--line-2:#d4dcea}
#mtn-icon-form{display:grid;grid-template-columns:172px minmax(0,1fr) 304px;height:calc(100dvh - 110px);min-height:690px;margin:0;border-bottom:1px solid var(--line)}
.icon-motion-rail .mtn-uses{display:grid;grid-template-columns:1fr;gap:10px}
.icon-motion-rail .mtn-use{position:relative;display:grid;gap:7px;border-radius:6px;background:#fff;padding:0 0 9px;text-align:left;overflow:hidden;transition:border-color 150ms}
.icon-motion-rail .mtn-use[aria-pressed=true]{background:#fff;border-color:#5f7ce3;box-shadow:0 0 0 1px #5f7ce3}
.icon-motion-rail .mtn-use-stage{height:82px;width:100%;background:#e9edf3;padding:10px 20px 0}
.icon-motion-rail .mtn-use-t{padding:0 9px;font-size:10px;font-weight:550}
.icon-motion-rail .mtn-use-b{padding:0 9px;font-size:9px;color:#8b98ad}
.icon-motion-rail .mtn-bar{margin:0 9px;height:2px;background:#e8ecf3}
.icon-motion-rail .icon-scene{width:100%;height:76px;min-height:0;border-radius:5px;box-shadow:none;gap:6px;padding:8px}
.icon-motion-rail .icon-scene-mark{width:25px;height:25px}
.icon-motion-rail .icon-scene-lines{gap:4px;width:40px}
.icon-motion-rail .icon-scene-lines i{height:3px}
.icon-motion-rail .icon-scene[data-scene=header]{padding:0}
.icon-motion-rail .icon-scene-nav{height:26px;padding:4px 8px;gap:4px}
.icon-motion-rail .icon-scene-nav .icon-scene-mark{width:15px;height:15px}
.icon-motion-rail .icon-scene-nav>i{height:2px;width:9px}
.icon-motion-rail .icon-scene-content{padding:9px;gap:4px}
.icon-motion-rail .icon-scene-content>i{width:40%;height:4px}
.icon-motion-rail .icon-scene-content>span:last-child{height:13px;border-radius:2px}
.icon-motion-rail .icon-scene-button{padding:7px;border-radius:8px}
.icon-motion-rail .icon-scene-loader{width:34px;height:34px}
.icon-motion-rail .icon-scene-loading-bar{height:2px;width:45px}
.icon-motion-workspace{min-width:0;min-height:0;display:grid;grid-template-rows:44px 40px minmax(0,1fr) 54px 35px}
.icon-motion-workspace[data-view=source],.icon-motion-workspace[data-view=result]{grid-template-rows:44px 40px minmax(0,1fr) 0 35px}.icon-motion-footer{grid-row:5}
.icon-motion-badge{font-size:9px;color:#96a1b3}.icon-motion-workspace .motion-workspace-head h2{max-width:100%}
#mtn-icon-replay{font-size:10px;color:#607bbd;white-space:nowrap}#mtn-icon-replay:disabled{opacity:.4}
.icon-motion-canvas{position:relative;min-height:0;display:grid;place-items:center;overflow:hidden;padding:48px 36px 66px;background:#e9ecf1;background-image:radial-gradient(#bcc6d375 .65px,transparent .65px);background-size:16px 16px}
#mtn-icon-demo{display:grid;place-items:center;width:100%;height:100%;min-height:0}
.icon-scene{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;width:360px;max-width:100%;height:340px;max-height:100%;background:#fff;border:1px solid #e4e9f2;border-radius:12px;box-shadow:0 8px 30px #2f426508;overflow:hidden;flex-shrink:0}
.icon-scene-mark{display:block;width:86px;height:86px;object-fit:contain;flex:none;transform-origin:center}
.icon-scene-lines{display:flex;flex-direction:column;align-items:center;gap:9px;width:92px}
.icon-scene-lines i{display:block;width:100%;height:6px;border-radius:8px;background:#e9edf4}.icon-scene-lines i:last-child{width:65%;background:#f0f2f7}
.icon-scene[data-scene=header]{justify-content:flex-start;gap:0}
.icon-scene-nav{display:flex;align-items:center;gap:10px;width:100%;height:68px;padding:16px 24px;border-bottom:1px solid #edf0f5;flex-shrink:0}
.icon-scene-nav .icon-scene-mark{width:34px;height:34px;margin-right:auto}.icon-scene-nav>i{width:25px;height:4px;background:#e2e8f3;border-radius:8px}
.icon-scene-content{display:flex;flex-direction:column;gap:17px;width:100%;padding:34px 26px}
.icon-scene-content>i{width:48%;height:10px;background:#cdd8ef;border-radius:4px}
.icon-scene-content .icon-scene-lines{width:85%;align-items:flex-start}
.icon-scene-content>span:last-child{display:block;width:100%;height:87px;background:#f0f3fa;border-radius:6px}
.icon-scene-loader{display:grid;place-items:center;width:96px;height:96px;border:1px solid #edf0f7;border-radius:50%}.icon-scene-loader .icon-scene-mark{width:56%;height:56%}
.icon-scene-loading-bar{width:108px;height:4px;background:#edf1f8;border-radius:8px;overflow:hidden}.icon-scene-loading-bar i{display:block;width:40%;height:100%;background:#a8b9e7;border-radius:8px}
.icon-scene-button{display:grid;place-items:center;border:1px solid #dfe6f5;border-radius:18px;background:#f4f7fd;padding:18px;color:#4566df}
.icon-scene-button .icon-scene-mark{width:58px;height:58px;transition:transform 220ms cubic-bezier(.2,0,0,1)}
.icon-motion-rail .icon-scene-button .icon-scene-mark{width:25px;height:25px}
button.icon-scene-button:hover .icon-scene-mark,button.icon-scene-button:focus-visible .icon-scene-mark{transform:scale(1.1)}
.icon-motion-canvas-note{position:absolute;bottom:24px;left:24px;right:24px;text-align:center;color:#8b97aa;font-size:11px;line-height:1.7;pointer-events:none}
#mtn-icon-static{width:180px;height:180px;max-width:70%;object-fit:contain}
#mtn-icon-result-view{position:absolute;inset:0;background:#fff}#mtn-frame{display:block;width:100%;height:100%;border:0}
.icon-motion-transport{display:flex;align-items:center;gap:18px;padding:0 20px;background:#fafbfd;border-top:1px solid #e1e6f0}
#mtn-icon-play{font-size:10px;color:#fff;background:#506fd8;border-radius:5px;padding:6px 11px;min-width:65px;white-space:nowrap}#mtn-icon-play:disabled{opacity:.5;cursor:default}
.icon-motion-track{height:3px;background:#e1e6f1;border-radius:3px;flex:1;overflow:hidden}.icon-motion-track span{display:block;height:100%;width:0;background:#758fe0;border-radius:3px}
#mtn-icon-time{font-size:9px;color:#8d99ad;white-space:nowrap}
.icon-motion-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;background:#fff;border-top:1px solid #e5e9f0;font-size:9px;color:#94a0b3}
#mtn-icon-export{display:flex;gap:12px;white-space:nowrap}#mtn-icon-export a,#mtn-icon-export button{color:#5877c6;text-decoration:none;font-size:inherit}
.icon-motion-composer{min-width:0;overflow:auto;scrollbar-width:thin;padding:20px;border-left:1px solid #e0e4ea;background:#fff}
.icon-motion-composer .motion-composer-title{margin-bottom:19px}.icon-motion-composer .motion-field-label{margin-top:0}
.icon-motion-composer .mtn-drop{width:100%;padding:15px 8px;gap:5px;border:1px dashed #cbd4e5;border-radius:7px;background:#fafbfe}.icon-motion-composer .mtn-drop b{font-size:11px;font-weight:500;color:#7687aa}
.icon-motion-upload-plus{font-size:24px;line-height:1;color:#8da1d2}.icon-motion-composer .mtn-drop .tls{font-size:9px;color:#99a6bb;line-height:1.6}
.icon-motion-library{font-size:10px;color:#7187c1;padding:10px 0 0}
.icon-motion-composer .adv{font-size:10px;margin-top:10px}.icon-motion-composer .adv summary{color:#8693a8}.icon-motion-composer .adv-body{padding:10px 0 0}
.icon-motion-composer .mtn-free{padding:13px 0 0;margin:18px 0 17px;border:0;border-top:1px solid #edf0f6;border-radius:0;background:none;color:#95a0b4;font-size:10px;line-height:1.7}
.icon-motion-composer .ig-grid{gap:18px}.icon-motion-composer .ig-field{gap:8px;min-width:0}.icon-motion-composer .ig-field>label{font-size:11px;color:#677387}
.icon-motion-composer .mtn-preset{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0}.icon-motion-composer .chip{border:1px solid #e2e7ef;border-radius:5px;padding:7px 6px;font-size:10px;color:#8490a5;background:#fff;white-space:normal;text-align:center}
.icon-motion-composer .chip[aria-pressed=true]{border-color:#9fb1ec;color:#526fc8;background:#edf1fc;box-shadow:none}
.icon-motion-composer .mtn-row{grid-template-columns:auto minmax(0,1fr) auto;gap:8px;padding:10px;border:1px solid #e1e6ef;background:#fafbfd;border-radius:6px}
.icon-motion-composer .mtn-row .mtn-pat-stage,.icon-motion-composer .mtn-row .mtn-pat-stage svg{width:30px;height:25px}.icon-motion-composer .mtn-row-b b{font-size:11px;font-weight:500;color:#687994}.icon-motion-composer .mtn-row-b .tls{font-size:9px;line-height:1.6;color:#9ba7b9}
.icon-motion-composer .btn.line.sm{font-size:10px;border-radius:5px;padding:4px 7px;color:#7184af;background:#fff;border-color:#dfe5ef}
.icon-motion-composer .mtn-pats{grid-template-columns:1fr 1fr;gap:6px}.icon-motion-composer .mtn-pat{border-radius:6px}.icon-motion-composer .mtn-pat-stage *,.icon-motion-composer .mtn-pat-stage svg{animation:none!important}.icon-motion-composer .mtn-pat-for{font-size:9px;line-height:1.5}.icon-motion-composer .mtn-use-t{font-size:10px}
.icon-motion-composer :is(textarea,input[type=text]){width:100%;border:1px solid #dde3ed;border-radius:6px;background:#fff;color:#4c5b75;font-size:11px;line-height:1.7;padding:10px;resize:vertical}.icon-motion-composer textarea::placeholder,.icon-motion-composer input::placeholder{color:#a6afbe}.icon-motion-composer .hlp{font-size:10px;color:#95a1b5}
.icon-motion-composer .mtn-source{grid-template-columns:40px minmax(0,1fr);gap:10px;background:#fafbfd;border:1px solid #e0e6ef;border-radius:6px;padding:10px}.icon-motion-composer .mtn-shot{width:40px;height:40px;border-radius:5px;background:#edf1f8}.icon-motion-composer .mtn-shot img{width:30px;height:30px}.icon-motion-composer .gen-t{font-size:11px}.icon-motion-composer .mtn-source .tls{font-size:9px;line-height:1.6}
.icon-motion-submit{margin-top:17px}.icon-motion-submit .tls{font-size:10px;color:#9aa5b8;line-height:1.7}.icon-motion-composer #mtn-stage{font-size:10px}.icon-motion-composer .pick-grid{grid-template-columns:1fr 1fr}
#mtn-icon-form :is(button,a,input,textarea,summary):focus-visible{outline:2px solid #8aa5ef;outline-offset:3px}#mtn-icon-form button{transition:background-color 150ms,border-color 150ms,color 150ms}
@media(max-width:1100px){#mtn-icon-form{grid-template-columns:140px minmax(0,1fr) 264px}.icon-motion-composer{padding:16px}.icon-motion-canvas{padding:36px 22px 66px}.icon-motion-footer{font-size:8px;padding:0 12px}.icon-motion-rail .mtn-use-stage{padding-left:12px;padding-right:12px}}
@media(max-width:760px){
  .motion-heading{height:auto;min-height:62px;padding:12px 14px;gap:10px}.motion-heading>.motion-modes{display:flex;order:3;flex-basis:100%;width:max-content}.motion-heading>.motion-modes button{flex:1;padding:7px 10px}
  #mtn-icon-form{display:block;height:auto;min-height:0}.icon-motion-rail{padding:12px}.icon-motion-rail .mtn-uses{display:flex;gap:8px;overflow:auto;padding:2px}.icon-motion-rail .mtn-use{min-width:125px;width:125px;flex:none}.icon-motion-rail .mtn-use-stage{height:65px}.icon-motion-rail .icon-scene{height:65px}
  .icon-motion-workspace{height:570px;grid-template-rows:44px 40px minmax(0,1fr) 50px 46px}.icon-motion-canvas{padding:24px 24px 58px}.icon-scene{width:300px;height:290px}.icon-motion-composer{overflow:visible;border-left:0;border-top:1px solid #e0e4ea;padding:22px}.icon-motion-badge{display:none}.icon-motion-footer{font-size:9px;line-height:1.6}.icon-motion-composer .mtn-preset{grid-template-columns:repeat(3,1fr)}.icon-motion-composer .mtn-pats{grid-template-columns:repeat(2,1fr)}
}
@media(prefers-reduced-motion:reduce){#mtn-icon-form *,#mtn-icon-form *:before{animation:none!important;transition:none!important}.icon-scene-button:hover .icon-scene-mark,.icon-scene-button:focus-visible .icon-scene-mark{transform:none!important}}