/* Loaf V50 — full desktop Animation Editor */
body.motion-editor-page{margin:0;overflow:hidden;background:#050507;color:#fff}
.motion-editor-page .promo,.motion-editor-page .navbar,.motion-editor-page .footer,.motion-editor-page .noise,.motion-editor-page .cookie-shell,.motion-editor-page .home-info-button-v31{display:none!important}
.motion-editor-hidden-library{display:none!important}
.motion-editor-topbar{height:64px;position:fixed;inset:0 0 auto 0;z-index:700;display:grid;grid-template-columns:260px minmax(0,1fr) 360px;align-items:center;padding:0 14px;border-bottom:1px solid rgba(255,255,255,.07);background:rgba(5,5,7,.96);backdrop-filter:blur(22px)}
.motion-editor-brand{width:max-content;display:inline-flex;align-items:center;gap:9px;padding:8px 12px;border:1px solid rgba(255,255,255,.09);border-radius:999px;color:#fff;text-decoration:none;font-weight:900;font-size:12px;background:rgba(255,255,255,.025)}
.motion-editor-brand img{width:18px;height:18px;object-fit:contain}.motion-editor-title{justify-self:center;display:flex;align-items:center;gap:8px;min-width:0;color:#cfc8db;font-size:12px}.motion-editor-title>b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:560px}.motion-editor-title>svg{width:14px;color:#ff62dc}.motion-editor-title .tiny-chevron{width:12px;color:#6e6774}
.motion-editor-top-actions{justify-self:end;display:flex;align-items:center;gap:9px}.motion-top-icon{width:42px;height:42px;border-radius:15px;border:1px solid rgba(255,255,255,.08);background:#09090d;color:#77717f;display:grid;place-items:center;cursor:pointer}.motion-top-icon:not(:disabled):hover{color:#fff;border-color:rgba(146,91,255,.28);background:#100d18}.motion-top-icon:disabled{opacity:.45;cursor:default}.motion-top-icon svg{width:17px}.motion-top-export{height:42px;padding:0 18px;border-radius:15px;border:1px solid rgba(185,139,255,.42);background:linear-gradient(135deg,#6d42ff,#a85cff);color:#fff;font:inherit;font-size:11px;font-weight:900;display:flex;align-items:center;gap:8px;cursor:pointer;box-shadow:0 10px 30px rgba(95,49,255,.25)}.motion-top-export:hover{transform:translateY(-1px);filter:brightness(1.08)}.motion-top-export svg{width:16px}.motion-top-avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#7649ff,#35e5ff);font-size:11px;font-weight:900;box-shadow:0 0 0 3px #09090d,0 0 0 4px rgba(255,255,255,.08)}
.motion-editor-page .motion-preview-shell{position:fixed!important;inset:64px 0 0!important;z-index:550!important;opacity:1!important;visibility:visible!important;transition:none!important;background:#050507}
.motion-editor-page .motion-preview-backdrop{display:none!important}.motion-editor-page .motion-preview-close{display:none!important}
.motion-editor-page .motion-preview-modal,.motion-editor-page .motion-preview-modal-v15{position:relative!important;left:auto!important;top:auto!important;width:100%!important;height:calc(100vh - 64px)!important;max-height:none!important;overflow:hidden!important;transform:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#050507!important;display:grid!important;grid-template-columns:318px minmax(500px,1fr) 395px!important;grid-template-rows:minmax(0,1fr) 158px!important;gap:0!important}
.motion-editor-page .motion-preview-stage{grid-column:2!important;grid-row:1!important;width:calc(100% - 64px)!important;max-width:1050px!important;aspect-ratio:16/9!important;height:auto!important;max-height:calc(100% - 58px)!important;place-self:center!important;border-radius:15px!important;border:1px solid rgba(255,255,255,.07)!important;box-shadow:0 28px 90px rgba(0,0,0,.42),0 0 0 18px #08080b!important;background-clip:padding-box!important}
.motion-editor-page .motion-preview-stage:before{content:"PREVIEW";position:absolute;top:-31px;left:0;font-size:8px;letter-spacing:.15em;font-weight:900;color:#514b58;z-index:30}
.motion-editor-page .motion-preview-info{grid-column:3!important;grid-row:1/3!important;min-width:0!important;overflow:auto!important;padding:18px 20px 70px!important;border-left:1px solid rgba(255,255,255,.07);background:linear-gradient(180deg,#08080c,#060609)!important;scrollbar-width:thin;scrollbar-color:#4d2b8c transparent}
.motion-editor-page .motion-preview-heading{padding-top:4px}.motion-editor-page .motion-preview-heading h2{font-size:24px!important}.motion-editor-page .motion-preview-heading>div>p{font-size:10px;line-height:1.55}.motion-editor-page .motion-preview-badge{display:none}.motion-editor-page .motion-customize,.motion-editor-page .motion-lab-v20{border-radius:16px!important;background:#09090e!important;border-color:rgba(255,255,255,.065)!important}.motion-editor-page .motion-lab-grid{grid-template-columns:1fr 1fr!important}.motion-editor-page .motion-lab-row,.motion-editor-page .motion-lab-row-cinematic{grid-template-columns:1fr!important}.motion-editor-page input[type=range]{accent-color:#9b5cff}
.motion-editor-page .motion-download-actions{display:flex!important;position:sticky;bottom:0;z-index:8;padding:12px 0 2px;background:linear-gradient(180deg,transparent,#08080c 28%)}.motion-editor-page .motion-download-actions .btn{flex:1;justify-content:center}.motion-editor-page .motion-format-note{margin-bottom:20px}
.motion-editor-explorer{grid-column:1;grid-row:1/3;min-width:0;overflow:hidden;display:flex;flex-direction:column;border-right:1px solid rgba(255,255,255,.07);background:#07070a;padding:18px 14px 12px}.motion-explorer-head{display:flex;align-items:center;justify-content:space-between;padding:0 2px 12px}.motion-explorer-head h2{margin:0;font-size:15px;letter-spacing:-.02em}.motion-explorer-close{width:28px;height:28px;border:0;background:transparent;color:#5f5867;cursor:pointer}.motion-explorer-tools{display:grid;grid-template-columns:1fr 94px;gap:8px;margin-bottom:12px}.motion-explorer-search,.motion-explorer-filter{height:40px;border-radius:12px;border:1px solid rgba(255,255,255,.06);background:#0e0e12;color:#fff;padding:0 12px;outline:none;font:inherit;font-size:10px}.motion-explorer-search:focus,.motion-explorer-filter:focus{border-color:rgba(153,97,255,.26)}.motion-explorer-list{overflow:auto;display:grid;gap:12px;padding:2px 5px 20px 0;scrollbar-width:thin;scrollbar-color:#2c2830 transparent}.motion-explorer-card{border:1px solid rgba(255,255,255,.065);border-radius:15px;background:#0b0a0e;color:#fff;overflow:hidden;text-align:left;padding:0;cursor:pointer;transition:.18s}.motion-explorer-card:hover{transform:translateY(-1px);border-color:rgba(150,94,255,.25)}.motion-explorer-card.active{border-color:rgba(155,96,255,.55);box-shadow:0 0 0 2px rgba(127,77,255,.08)}.motion-explorer-thumb{height:112px;display:grid;place-items:center;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 100%,rgba(126,76,255,.14),transparent 60%),#09080d}.motion-explorer-thumb>*{transform:scale(.72)}.motion-explorer-meta{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:9px 10px 11px}.motion-explorer-meta b{display:block;font-size:10px}.motion-explorer-meta span{display:block;margin-top:3px;color:#6f6877;font-size:8px;text-transform:capitalize}.motion-explorer-badge{font-size:7px!important;margin:0!important;padding:4px 6px;border-radius:999px;background:rgba(145,255,21,.08);border:1px solid rgba(145,255,21,.12);color:#baff67!important;font-weight:900}
.motion-editor-tabs{position:sticky;top:-18px;z-index:9;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:-18px -20px 16px;padding:16px 18px 10px;background:rgba(8,8,12,.94);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.05)}.motion-editor-tabs button{height:34px;border:0;border-radius:999px;background:transparent;color:#756e7e;font:inherit;font-size:9px;font-weight:800;cursor:pointer}.motion-editor-tabs button.active{background:#fff;color:#09090b}.motion-editor-tabs button:hover:not(.active){background:rgba(255,255,255,.04);color:#ddd6e4}
.motion-preview-info[data-editor-tab="colors"]>.motion-customize:not(.motion-cinematic-panel):not(.motion-brand-panel){display:none!important}.motion-preview-info[data-editor-tab="colors"]>.motion-brand-panel{display:none!important}.motion-preview-info[data-editor-tab="text"]>.motion-lab-v20,.motion-preview-info[data-editor-tab="text"]>.motion-cinematic-panel,.motion-preview-info[data-editor-tab="text"]>.motion-brand-panel,.motion-preview-info[data-editor-tab="text"]>.motion-format-note{display:none!important}.motion-preview-info[data-editor-tab="values"]>.motion-customize:not(.motion-brand-panel),.motion-preview-info[data-editor-tab="values"]>.motion-cinematic-panel{display:none!important}.motion-preview-info[data-editor-tab="values"]>.motion-lab-v20{display:none!important}
.motion-editor-timeline{grid-column:2;grid-row:2;border-top:1px solid rgba(255,255,255,.07);background:#07070a;padding:12px 24px 16px;display:grid;grid-template-rows:28px 1fr 42px;gap:7px;position:relative}.motion-timeline-toolbar{display:flex;align-items:center;gap:10px}.motion-timeline-time{display:inline-flex;align-items:center;gap:8px;padding:6px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.07);font-size:9px;color:#8c8593}.motion-timeline-time svg{width:13px}.motion-timeline-play{margin-left:auto;margin-right:auto;width:30px;height:30px;border-radius:50%;border:1px solid rgba(255,255,255,.08);background:#0c0c10;color:#fff;display:grid;place-items:center;cursor:pointer}.motion-timeline-play svg{width:14px}.motion-timeline-quality{margin-left:auto;height:30px;border-radius:11px;border:1px solid rgba(255,255,255,.07);background:#0b0b0f;color:#97909f;padding:0 10px;font-size:9px}.motion-timeline-track{position:relative;height:100%;border-radius:10px;background:linear-gradient(90deg,rgba(104,32,97,.55),rgba(72,23,80,.35));border:1px solid rgba(241,72,213,.12);display:grid;place-items:center;overflow:hidden}.motion-timeline-track b{font-size:9px;color:#ff74ea;letter-spacing:-.01em}.motion-timeline-audio{position:relative;border-radius:9px;border:1px solid rgba(145,255,21,.12);background:rgba(70,105,20,.15);overflow:hidden}.motion-timeline-audio:before{content:"";position:absolute;inset:10px 14px;background:repeating-linear-gradient(90deg,#91ff15 0 2px,transparent 2px 8px);opacity:.65;mask-image:linear-gradient(180deg,transparent 20%,#000 21% 79%,transparent 80%)}.motion-timeline-playhead{position:absolute;top:42px;bottom:10px;left:0;width:1px;background:#fff;z-index:5;box-shadow:0 0 12px rgba(255,255,255,.7);pointer-events:none}.motion-timeline-playhead:before{content:"";position:absolute;top:-8px;left:-5px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid #fff}.motion-timeline-scrub{position:absolute;left:24px;right:24px;top:42px;height:75px;opacity:0;z-index:7;cursor:ew-resize}
.motion-editor-mobile-lock{display:none}
@media(max-width:1050px){.motion-editor-page .motion-preview-modal,.motion-editor-page .motion-preview-modal-v15{grid-template-columns:270px minmax(460px,1fr) 340px!important}.motion-editor-topbar{grid-template-columns:220px 1fr 330px}.motion-explorer-thumb{height:96px}}
@media(max-width:900px){body.motion-editor-page{overflow:auto}.motion-editor-topbar,.motion-editor-page .motion-preview-shell,.motion-editor-hidden-library{display:none!important}.motion-editor-mobile-lock{display:grid;position:fixed;inset:0;z-index:9999;place-items:center;padding:22px;background:radial-gradient(circle at 50% 25%,rgba(123,74,255,.22),transparent 36%),#060509}.motion-editor-mobile-card{width:min(430px,100%);text-align:center;padding:32px 24px;border:1px solid rgba(255,255,255,.08);border-radius:28px;background:rgba(13,11,18,.92);box-shadow:0 35px 100px rgba(0,0,0,.5)}.motion-editor-mobile-card img{width:72px;height:72px;margin-bottom:14px}.motion-editor-mobile-card h1{font-size:30px;line-height:1.02;letter-spacing:-.05em;margin:14px 0 10px}.motion-editor-mobile-card p{color:#91899a;line-height:1.6;font-size:12px;margin:0 auto 20px;max-width:330px}.motion-editor-mobile-card .btn{width:100%;justify-content:center}}

/* Loaf V52 — ccLeaf-inspired editor refinement */
body.motion-editor-page{background:
  radial-gradient(circle at 50% 100%,rgba(110,58,255,.18),transparent 28%),
  linear-gradient(180deg,#040408 0%,#050507 100%)!important;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
body.motion-editor-page:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(rgba(255,255,255,.02),rgba(255,255,255,0));opacity:.45}
.motion-editor-topbar{height:56px!important;grid-template-columns:220px 1fr 300px!important;padding:0 10px!important;background:rgba(4,4,8,.92)!important;border-bottom:1px solid rgba(255,255,255,.05)!important;backdrop-filter:blur(18px)!important}
.motion-editor-brand{padding:8px 14px!important;border-radius:18px!important;background:rgba(11,11,16,.92)!important;border-color:rgba(255,255,255,.1)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)!important;font-size:14px!important;gap:10px!important}
.motion-editor-brand img{width:16px!important;height:16px!important}
.motion-editor-title{font-size:11px!important;font-weight:800!important;color:#c8bfda!important;gap:7px!important}
.motion-editor-title b{font-size:14px!important;color:#ece6f5!important}
.motion-editor-title svg:first-child{color:#ff6fdf!important}
.motion-editor-top-actions{gap:8px!important}
.motion-top-icon{width:40px!important;height:40px!important;border-radius:999px!important;background:#0a0b11!important;border-color:rgba(255,255,255,.07)!important;color:#b8afc7!important}
.motion-top-icon:hover:not(:disabled){background:#121320!important;box-shadow:0 0 0 1px rgba(134,88,255,.2) inset!important}
.motion-top-export{height:42px!important;border-radius:16px!important;padding:0 20px!important;background:linear-gradient(180deg,#8459ff,#6d4af6)!important;border-color:rgba(199,177,255,.22)!important;font-size:13px!important;box-shadow:0 14px 34px rgba(112,67,255,.32)!important}
.motion-top-avatar{width:40px!important;height:40px!important;box-shadow:0 0 0 3px #09090d,0 0 0 4px rgba(255,255,255,.08)!important}

.motion-editor-page .motion-preview-modal,.motion-editor-page .motion-preview-modal-v15{
  grid-template-columns:392px minmax(620px,1fr) 420px!important;
  grid-template-rows:minmax(0,1fr) 168px!important;
  width:100%!important;height:calc(100vh - 56px)!important;padding:16px 16px 14px!important;gap:14px!important;background:transparent!important;border:0!important;box-shadow:none!important;
}
.motion-editor-page .motion-preview-shell{background:transparent!important}
.motion-editor-page .motion-preview-stage{grid-column:2!important;grid-row:1!important;align-self:stretch!important;justify-self:stretch!important;width:100%!important;max-width:none!important;max-height:none!important;height:auto!important;min-height:0!important;border-radius:24px!important;border:1px solid rgba(255,255,255,.07)!important;background:
  radial-gradient(circle at 50% 100%,rgba(123,74,255,.18),transparent 34%),
  linear-gradient(180deg,#07080e,#06060b)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.02)!important;
}
.motion-editor-page .motion-preview-stage:before{content:""!important;position:absolute!important;inset:16px!important;border-radius:18px!important;border:1px solid rgba(255,255,255,.05)!important;z-index:1!important}
.motion-editor-page .motion-preview-stage>*{transform:scale(1)!important;max-width:92%!important;max-height:86%!important}
.motion-editor-page .motion-preview-info{grid-column:3!important;grid-row:1 / 3!important;padding:12px 14px 110px!important;border:1px solid rgba(255,255,255,.07)!important;border-radius:24px!important;background:linear-gradient(180deg,rgba(7,8,13,.97),rgba(6,6,10,.98))!important;box-shadow:0 20px 60px rgba(0,0,0,.32)!important;overflow:auto!important}
.motion-editor-page .motion-preview-info>*{position:relative;z-index:2}
.motion-editor-page .motion-preview-heading{display:grid!important;grid-template-columns:auto 1fr!important;gap:12px!important;align-items:start!important;margin:4px 0 14px!important}
.motion-editor-page .motion-preview-heading>div{min-width:0!important}
.motion-editor-page .motion-preview-heading h2{font-size:22px!important;line-height:1.02!important;letter-spacing:-.05em!important;margin:6px 0 8px!important;color:#fff!important}
.motion-editor-page .motion-preview-heading p{font-size:13px!important;color:#9a92a9!important;line-height:1.45!important}
.motion-editor-page .motion-preview-badge{justify-self:end!important;align-self:start!important;border-radius:14px!important;background:rgba(124,77,255,.08)!important;border-color:rgba(124,77,255,.18)!important;color:#cab7ff!important;padding:10px 12px!important;font-size:11px!important}
.motion-editor-page .motion-preview-badge::after{display:none!important}
.motion-editor-page [data-motion-tier]{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:44px!important;height:26px!important;padding:0 10px!important;border-radius:12px!important;background:rgba(146,96,255,.12)!important;border:1px solid rgba(146,96,255,.16)!important;color:#e7dcff!important;font-size:11px!important;font-weight:900!important}

.motion-editor-inspector-tools{position:sticky;top:-12px;z-index:20;background:linear-gradient(180deg,rgba(7,8,13,.98),rgba(7,8,13,.95));padding:2px 0 14px;margin:-12px 0 16px;border-bottom:1px solid rgba(255,255,255,.06)}
.motion-editor-tabs{display:flex!important;align-items:center!important;gap:8px!important;margin:0 0 14px!important;padding:0!important;background:none!important;border:0!important}
.motion-editor-tabs button{height:36px!important;padding:0 16px!important;border-radius:999px!important;border:1px solid transparent!important;background:transparent!important;color:#7f788d!important;font-size:12px!important;font-weight:800!important;display:inline-flex!important;align-items:center!important;gap:7px!important}
.motion-editor-tabs button svg{width:14px!important;height:14px!important}
.motion-editor-tabs button.active{background:#fff!important;color:#08090e!important;border-color:#fff!important;box-shadow:0 6px 18px rgba(255,255,255,.08)!important}
.motion-editor-tabs button:hover:not(.active){background:rgba(255,255,255,.03)!important;color:#ddd7e8!important}
.motion-inspector-search{display:flex;align-items:center;gap:10px;height:44px;padding:0 14px;border-radius:16px;border:1px solid rgba(255,255,255,.06);background:#090a11;color:#88819a}
.motion-inspector-search svg{width:16px;height:16px;flex:none}
.motion-inspector-search input{border:0!important;outline:none!important;background:transparent!important;color:#fff!important;width:100%!important;height:auto!important;padding:0!important;font:inherit!important}
.motion-inspector-search input::placeholder{color:#666072}

.motion-editor-page .motion-customize,.motion-editor-page .motion-lab-v20{margin:0 0 14px!important;padding:16px!important;border-radius:18px!important;background:linear-gradient(180deg,rgba(12,13,21,.96),rgba(10,11,17,.98))!important;border:1px solid rgba(255,255,255,.07)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important}
.motion-editor-page .motion-customize-head{margin-bottom:10px!important}
.motion-editor-page .motion-customize-head>span{font-size:14px!important;color:#fff!important;gap:8px!important}
.motion-editor-page .motion-customize-head small{font-size:11px!important;color:#7c7688!important}
.motion-editor-page .motion-customize label,.motion-editor-page .motion-lab-grid label,.motion-editor-page .motion-lab-row label{font-size:12px!important;color:#e8e1f5!important;gap:8px!important}
.motion-editor-page .motion-customize label small{font-size:11px!important;color:#8e8798!important}
.motion-editor-page .motion-customize input,.motion-editor-page .motion-lab-row input,.motion-editor-page .motion-lab-row select{height:44px!important;border-radius:14px!important;border:1px solid rgba(255,255,255,.08)!important;background:#0b0c13!important;color:#fff!important;padding:0 12px!important;font-size:13px!important}
.motion-editor-page .motion-customize input:focus,.motion-editor-page .motion-lab-row input:focus,.motion-editor-page .motion-lab-row select:focus{border-color:rgba(143,92,255,.38)!important;box-shadow:0 0 0 4px rgba(143,92,255,.08)!important}
.motion-editor-page .motion-lab-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;margin-top:10px!important}
.motion-editor-page .motion-lab-grid label{display:grid!important;grid-template-columns:1fr auto!important;gap:6px!important;background:#0b0c13!important;border:1px solid rgba(255,255,255,.05)!important;border-radius:16px!important;padding:12px!important}
.motion-editor-page .motion-lab-grid label b{font-size:12px!important;color:#fff!important}
.motion-editor-page .motion-lab-grid input{grid-column:1 / -1!important;width:100%!important;margin:2px 0 0!important;accent-color:#8f5cff!important}
.motion-editor-page .motion-lab-row{grid-template-columns:1fr!important;gap:10px!important;margin-top:12px!important}
.motion-editor-page .motion-palette-v20{gap:8px!important;margin-top:12px!important}
.motion-editor-page .motion-palette-v20 button{min-height:34px!important;padding:0 12px!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.08)!important;background:#0b0c13!important;color:#d0c9dd!important;font-size:11px!important;font-weight:700!important}
.motion-editor-page .motion-palette-v20 button:hover{background:#10111a!important;color:#fff!important;border-color:rgba(143,92,255,.24)!important}
.motion-editor-page .motion-lab-spacer{flex-basis:100%;height:0}
.motion-editor-page .motion-text-actions .btn,.motion-editor-page .motion-brand-actions .btn{border-radius:12px!important}
.motion-editor-page .motion-upload-box{display:grid!important;gap:8px!important;place-items:center!important;text-align:center!important;padding:18px!important;min-height:156px!important;border:1px dashed rgba(255,255,255,.1)!important;border-radius:18px!important;background:#0b0c13!important;color:#d7cfff!important}
.motion-editor-page .motion-upload-box b{font-size:14px!important}
.motion-editor-page .motion-upload-box span{font-size:12px!important;color:#8f8898!important}
.motion-editor-page .motion-brand-upload{display:grid!important;gap:12px!important}
.motion-editor-page .motion-format-note{margin-top:16px!important;padding:14px 16px!important;border-radius:16px!important;background:rgba(255,255,255,.03)!important;border:1px solid rgba(255,255,255,.06)!important;font-size:12px!important;color:#9992a5!important}
.motion-editor-page .motion-format-note b{color:#fff!important}
.motion-editor-page .motion-download-actions{position:sticky!important;left:0!important;right:0!important;bottom:-12px!important;display:grid!important;grid-template-columns:1fr 1fr 1fr!important;gap:10px!important;padding:16px 0 2px!important;margin-top:10px!important;background:linear-gradient(180deg,rgba(7,8,13,0),rgba(7,8,13,.98) 34%)!important}
.motion-editor-page .motion-download-actions .btn{min-height:58px!important;border-radius:16px!important;font-size:14px!important;font-weight:800!important;justify-content:center!important;box-shadow:none!important}
.motion-editor-page .motion-download-actions .btn.primary{background:linear-gradient(180deg,#875cff,#744af9)!important;border-color:rgba(208,193,255,.24)!important}
.motion-editor-page .motion-download-actions .btn.ghost{background:#0b0c13!important;border-color:rgba(255,255,255,.08)!important;color:#dcd6e8!important}

.motion-editor-explorer{grid-column:1!important;grid-row:1 / 3!important;display:grid!important;grid-template-columns:56px minmax(0,1fr)!important;gap:14px!important;min-height:0!important;overflow:visible!important;padding:0!important;border:0!important;background:transparent!important}
.motion-explorer-rail{display:flex;flex-direction:column;align-items:center;gap:10px;padding:14px 0;border:1px solid rgba(255,255,255,.07);border-radius:22px;background:linear-gradient(180deg,rgba(7,8,13,.96),rgba(6,6,11,.98));box-shadow:0 16px 42px rgba(0,0,0,.28)}
.motion-rail-btn{width:38px;height:38px;border-radius:14px;border:1px solid transparent;background:transparent;color:#8d8798;display:grid;place-items:center;text-decoration:none;cursor:pointer}
.motion-rail-btn svg{width:16px;height:16px}
.motion-rail-btn.active,.motion-rail-btn:hover{background:rgba(255,255,255,.05);color:#fff;border-color:rgba(255,255,255,.06)}
.motion-rail-spacer{flex:1}
.motion-explorer-panel{display:flex;flex-direction:column;min-height:0;border:1px solid rgba(255,255,255,.07);border-radius:24px;background:linear-gradient(180deg,rgba(7,8,13,.96),rgba(6,6,11,.98));box-shadow:0 20px 60px rgba(0,0,0,.32);padding:14px}
.motion-explorer-head{padding:4px 2px 14px!important;border-bottom:1px solid rgba(255,255,255,.06);margin-bottom:14px!important}
.motion-explorer-head h2{font-size:15px!important;line-height:1.1!important;color:#fff!important}
.motion-explorer-close{width:32px!important;height:32px!important;display:grid!important;place-items:center!important;border-radius:12px!important;color:#7e7887!important}
.motion-search-wrap{display:flex;align-items:center;gap:10px;height:44px;padding:0 14px;border-radius:16px;border:1px solid rgba(255,255,255,.06);background:#090a11;color:#787285}
.motion-search-wrap svg,.motion-filter-wrap svg{width:16px;height:16px;flex:none}
.motion-explorer-tools{grid-template-columns:minmax(0,1fr) 92px!important;gap:10px!important;margin-bottom:14px!important}
.motion-explorer-search{width:100%!important;height:auto!important;background:transparent!important;border:0!important;padding:0!important;color:#fff!important;font-size:13px!important}
.motion-explorer-search::placeholder{color:#666072!important}
.motion-filter-wrap{position:relative;display:flex;align-items:center;height:44px;padding:0 10px 0 12px;border-radius:16px;border:1px solid rgba(255,255,255,.06);background:#090a11;color:#fff}
.motion-explorer-filter{width:100%!important;appearance:none!important;-webkit-appearance:none!important;height:100%!important;background:transparent!important;border:0!important;padding:0 20px 0 0!important;color:#fff!important;font-size:13px!important;outline:none!important}
.motion-filter-wrap svg{position:absolute;right:10px;color:#77718a;pointer-events:none}
.motion-explorer-list{display:grid!important;gap:12px!important;overflow:auto!important;padding-right:2px!important}
.motion-explorer-card{display:grid!important;gap:0!important;padding:0!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:18px!important;background:linear-gradient(180deg,#0d0e15,#0a0b12)!important;overflow:hidden!important;box-shadow:0 8px 24px rgba(0,0,0,.18)!important}
.motion-explorer-card:hover{transform:translateY(-2px)!important;border-color:rgba(143,92,255,.32)!important}
.motion-explorer-card.active{border-color:rgba(143,92,255,.58)!important;box-shadow:0 0 0 1px rgba(143,92,255,.16),0 10px 28px rgba(68,45,130,.2)!important}
.motion-explorer-thumb{height:152px!important;display:grid!important;place-items:center!important;background:
  radial-gradient(circle at 65% 18%,rgba(84,200,255,.22),transparent 18%),
  radial-gradient(circle at 22% 62%,rgba(143,92,255,.20),transparent 22%),
  linear-gradient(180deg,#0d0d16,#080910)!important;position:relative!important}
.motion-explorer-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(5,5,7,.42));pointer-events:none}
.motion-explorer-thumb>*{transform:scale(.9)!important;max-width:100%!important}
.motion-explorer-meta{padding:14px 14px 16px!important;display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:10px!important;background:linear-gradient(180deg,rgba(8,8,12,.04),rgba(5,5,8,.42))!important}
.motion-explorer-copy b{display:block!important;font-size:13px!important;color:#fff!important}
.motion-explorer-copy span{display:block!important;margin-top:6px!important;font-size:12px!important;color:#9b95a6!important;line-height:1.35!important;text-transform:none!important}
.motion-explorer-badge{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:74px!important;height:28px!important;padding:0 10px!important;border-radius:999px!important;background:rgba(143,92,255,.12)!important;border:1px solid rgba(143,92,255,.16)!important;color:#e5d8ff!important;font-size:11px!important;font-weight:900!important}
.motion-explorer-badge.free{background:rgba(167,255,46,.12)!important;border-color:rgba(167,255,46,.18)!important;color:#cbff81!important}
.motion-explorer-footer{padding-top:14px!important;margin-top:auto!important;border-top:1px solid rgba(255,255,255,.06)!important}
.motion-explorer-all{display:flex;align-items:center;justify-content:center;gap:10px;min-height:50px;border-radius:16px;text-decoration:none;color:#fff;font-size:14px;font-weight:800;background:linear-gradient(180deg,#8459ff,#7148f7);box-shadow:0 10px 24px rgba(112,67,255,.28)}
.motion-explorer-all svg{width:16px;height:16px}

.motion-editor-timeline{grid-column:2!important;grid-row:2!important;display:grid!important;grid-template-rows:34px 60px 54px!important;gap:8px!important;padding:0!important;border:0!important;background:transparent!important}
.motion-timeline-toolbar,.motion-timeline-track,.motion-timeline-audio{border:1px solid rgba(255,255,255,.07)!important;background:linear-gradient(180deg,rgba(8,9,14,.96),rgba(6,6,10,.98))!important;box-shadow:0 18px 40px rgba(0,0,0,.22)!important}
.motion-timeline-toolbar{padding:0 14px!important;border-radius:14px!important}
.motion-timeline-time{height:28px!important;padding:0 10px!important;border-radius:999px!important;background:#0f1017!important;border:1px solid rgba(255,255,255,.06)!important;color:#d5cedf!important;font-size:12px!important}
.motion-timeline-play{width:34px!important;height:34px!important;background:#10111a!important;border:1px solid rgba(255,255,255,.08)!important}
.motion-timeline-play svg{width:15px!important;height:15px!important}
.motion-timeline-quality{height:34px!important;border-radius:12px!important;background:#10111a!important;border:1px solid rgba(255,255,255,.08)!important;color:#cec7db!important;font-size:12px!important;padding:0 12px!important}
.motion-timeline-track{height:60px!important;border-radius:14px!important;display:grid!important;place-items:center!important;background:linear-gradient(180deg,rgba(77,12,78,.82),rgba(65,13,68,.78))!important;border-color:rgba(255,79,232,.14)!important}
.motion-timeline-track b{font-size:15px!important;color:#ff7cf2!important}
.motion-timeline-audio{height:54px!important;border-radius:14px!important;background:linear-gradient(180deg,rgba(31,56,13,.92),rgba(22,40,10,.98))!important;border-color:rgba(163,255,46,.16)!important}
.motion-timeline-audio:before{inset:11px 14px!important;background:repeating-linear-gradient(90deg,#9aff19 0 2px,transparent 2px 9px)!important;opacity:.78!important}
.motion-timeline-playhead{top:38px!important;bottom:10px!important}
.motion-timeline-scrub{top:38px!important;height:122px!important;left:0!important;right:0!important}

.motion-preview-info[data-editor-tab="colors"] .motion-customize:not(.motion-brand-panel):not(.motion-cinematic-panel){display:none!important}
.motion-preview-info[data-editor-tab="text"] .motion-lab-v20,.motion-preview-info[data-editor-tab="text"] .motion-cinematic-panel,.motion-preview-info[data-editor-tab="text"] .motion-brand-panel,.motion-preview-info[data-editor-tab="text"] .motion-format-note{display:none!important}
.motion-preview-info[data-editor-tab="values"] .motion-customize:not(.motion-cinematic-panel),.motion-preview-info[data-editor-tab="values"] .motion-brand-panel,.motion-preview-info[data-editor-tab="values"] .motion-format-note{display:none!important}

@media(max-width:1500px){
  .motion-editor-page .motion-preview-modal,.motion-editor-page .motion-preview-modal-v15{grid-template-columns:340px minmax(520px,1fr) 380px!important}
  .motion-explorer-thumb{height:136px!important}
}
@media(max-width:1250px){
  .motion-editor-topbar{grid-template-columns:180px 1fr 270px!important}
  .motion-editor-page .motion-preview-modal,.motion-editor-page .motion-preview-modal-v15{grid-template-columns:300px minmax(460px,1fr) 340px!important}
  .motion-editor-page .motion-preview-info{padding:10px 12px 110px!important}
}

/* V53 exacter ccLeaf-style refinement */
.motion-editor-page .motion-preview-info{padding-top:10px!important}
.motion-editor-page .motion-preview-heading{display:grid!important;grid-template-columns:auto 1fr auto!important;gap:10px!important;align-items:center!important;margin:0 0 12px!important;padding:0 0 10px!important;border-bottom:1px solid rgba(255,255,255,.055)!important}
.motion-editor-page .motion-preview-heading>div{display:grid!important;gap:4px!important;min-width:0!important}
.motion-editor-page .motion-preview-heading h2{font-size:18px!important;line-height:1.04!important;letter-spacing:-.04em!important;margin:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.motion-editor-page .motion-preview-heading p{font-size:11px!important;line-height:1.35!important;color:#7f788e!important;margin:0!important}
.motion-editor-page .motion-preview-badge{display:inline-flex!important;align-items:center!important;justify-self:end!important;height:28px!important;padding:0 10px!important;border-radius:999px!important;font-size:11px!important;background:rgba(13,14,20,.9)!important;color:#9f97b0!important;border:1px solid rgba(255,255,255,.07)!important}
.motion-editor-page .motion-preview-badge svg{width:12px!important;height:12px!important;color:#8762ff!important}
.motion-editor-page .motion-customize-head{display:none!important}
.motion-editor-page .motion-customize,.motion-editor-page .motion-lab-v20{padding:14px!important;border-radius:22px!important;background:rgba(7,8,12,.92)!important;border:1px solid rgba(255,255,255,.06)!important}
.motion-editor-page .motion-customize.hidden{display:none!important}

.motion-editor-page .motion-lab-grid,.motion-editor-page .motion-lab-row,.motion-editor-page .motion-lab-row-cinematic,.motion-editor-page .motion-customize{gap:14px!important}
.motion-editor-page .motion-lab-grid label,.motion-editor-page .motion-lab-row label,.motion-editor-page .motion-customize label{display:grid!important;gap:12px!important;padding:0!important;background:none!important;border:0!important}
.motion-editor-page .motion-field-header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;min-height:20px!important}
.motion-editor-page .motion-field-name{display:inline-flex!important;align-items:center!important;gap:10px!important;min-width:0!important;color:#d6cfe3!important;font-size:14px!important;font-weight:500!important;letter-spacing:-.01em!important}
.motion-editor-page .motion-field-name span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.motion-editor-page .motion-field-name i{width:13px!important;height:13px!important;color:#6e697a!important}
.motion-editor-page .motion-field-value{font-style:normal!important;font-size:12px!important;color:#a8a0b8!important;padding:0 8px!important;height:22px!important;border-radius:999px!important;background:#11131b!important;border:1px solid rgba(255,255,255,.06)!important;display:inline-flex!important;align-items:center!important}
.motion-editor-page .motion-field-actions{display:inline-flex!important;align-items:center!important;gap:8px!important;flex:none!important}
.motion-editor-page .motion-field-action{width:26px!important;height:26px!important;border-radius:999px!important;border:0!important;background:transparent!important;color:#6b6678!important;display:grid!important;place-items:center!important;cursor:pointer!important}
.motion-editor-page .motion-field-action:hover{background:rgba(255,255,255,.04)!important;color:#dad3ea!important}
.motion-editor-page .motion-field-action svg{width:14px!important;height:14px!important}
.motion-editor-page .motion-field-body{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
.motion-editor-page .motion-field-body.has-side-button{grid-template-columns:minmax(0,1fr) 44px!important;align-items:center!important}
.motion-editor-page .motion-type-badge{width:44px!important;height:44px!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.05)!important;background:#11131b!important;color:#a8a0b8!important;display:grid!important;place-items:center!important}
.motion-editor-page .motion-type-badge svg{width:16px!important;height:16px!important}
.motion-editor-page .motion-field-body input[type="text"],.motion-editor-page .motion-field-body input[type="number"],.motion-editor-page .motion-field-body select{height:44px!important;border-radius:15px!important;background:#11131b!important;border:1px solid rgba(255,255,255,.05)!important;color:#ece8f4!important;padding:0 16px!important;font-size:14px!important}
.motion-editor-page .motion-field-body input[type="text"]::placeholder{color:#6d687b!important}
.motion-editor-page .motion-field-body.is-select{position:relative!important}
.motion-editor-page .motion-field-body.is-select:after{content:"";position:absolute;right:16px;top:50%;width:8px;height:8px;border-right:2px solid #8f89a0;border-bottom:2px solid #8f89a0;transform:translateY(-70%) rotate(45deg);pointer-events:none}
.motion-editor-page .motion-field-body.is-select select{appearance:none!important;-webkit-appearance:none!important;padding-right:38px!important}
.motion-editor-page .motion-field-body.is-range{grid-template-columns:76px minmax(0,1fr)!important;align-items:center!important}
.motion-editor-page .motion-field-body.is-range::before{content:attr(data-start);display:none}
.motion-editor-page .motion-field-body.is-range input[type="range"]{width:100%!important;margin:0!important;accent-color:#ffffff!important}
.motion-editor-page .motion-lab-grid .motion-field-body.is-range input[type="range"],.motion-editor-page .motion-lab-row .motion-field-body.is-range input[type="range"]{grid-column:2!important}
.motion-editor-page .motion-lab-grid label:has(input[type="range"]) .motion-field-body,.motion-editor-page .motion-lab-row label:has(input[type="range"]) .motion-field-body{grid-template-columns:80px minmax(0,1fr)!important}
.motion-editor-page .motion-lab-grid label:has(input[type="range"]) .motion-field-body::before,.motion-editor-page .motion-lab-row label:has(input[type="range"]) .motion-field-body::before{content:attr(data-value)!important;display:flex!important;align-items:center!important;justify-content:center!important;height:42px!important;border-radius:14px!important;background:#11131b!important;border:1px solid rgba(255,255,255,.05)!important;color:#ece8f4!important;font-size:13px!important}
.motion-editor-page .motion-lab-grid label:has(input[type="range"]) .motion-field-body,.motion-editor-page .motion-lab-row label:has(input[type="range"]) .motion-field-body{--value:''}
.motion-editor-page .motion-lab-grid label:has(input[type="range"]) .motion-field-body .motion-range-mirror,.motion-editor-page .motion-lab-row label:has(input[type="range"]) .motion-field-body .motion-range-mirror{display:none!important}
.motion-editor-page .motion-field-body input[type="color"]{width:100%!important;height:50px!important;border-radius:18px!important;background:#11131b!important;border:1px solid rgba(255,255,255,.05)!important;padding:6px!important}
.motion-editor-page .motion-field-body input[type="color"]::-webkit-color-swatch-wrapper{padding:0}
.motion-editor-page .motion-field-body input[type="color"]::-webkit-color-swatch{border:0;border-radius:14px}
.motion-editor-page .motion-palette-v20{display:flex!important;flex-wrap:wrap!important;gap:10px!important;margin-top:4px!important}
.motion-editor-page .motion-palette-v20 button{height:34px!important;padding:0 12px!important;border-radius:999px!important;background:#11131b!important;color:#bab3c6!important;border:1px solid rgba(255,255,255,.06)!important}
.motion-editor-page .motion-palette-v20 button[data-motion-replay],.motion-editor-page .motion-palette-v20 button[data-motion-pause],.motion-editor-page .motion-palette-v20 button[data-motion-reset-lab]{margin-left:auto!important}
.motion-editor-page .motion-cinematic-panel{background:linear-gradient(180deg,rgba(1,67,63,.48),rgba(4,52,51,.68))!important;border-color:rgba(52,201,172,.18)!important}
.motion-editor-page .motion-brand-panel{background:linear-gradient(180deg,rgba(61,3,42,.48),rgba(58,5,47,.58))!important;border-color:rgba(220,66,160,.18)!important}
.motion-editor-page .motion-cinematic-panel::before,.motion-editor-page .motion-brand-panel::before{content:attr(data-panel-title);display:flex;align-items:center;min-height:36px;padding:0 14px;border-radius:14px;margin-bottom:14px;font-weight:800;font-size:13px;color:#fff;background:rgba(0,0,0,.16);border:1px solid rgba(255,255,255,.06)}
.motion-editor-page .motion-cinematic-panel::before{content:"Badge Settings"!important}
.motion-editor-page .motion-brand-panel::before{content:"Logo / Icon Settings"!important}
.motion-editor-page .motion-upload-box{min-height:132px!important;border-radius:18px!important;background:rgba(8,8,12,.35)!important}
.motion-editor-page .motion-download-actions{grid-template-columns:1fr 1fr!important;gap:12px!important;padding-top:18px!important}
.motion-editor-page .motion-download-actions .btn{min-height:42px!important;border-radius:999px!important;font-size:14px!important;font-weight:700!important}
.motion-editor-page .motion-download-actions [data-copy-css]{grid-column:2!important}
.motion-editor-page .motion-download-actions .btn.primary{background:linear-gradient(90deg,#b4ff40,#d5ff75 48%,#c5ff4d)!important;color:#09110a!important;border:1px solid rgba(255,255,255,.34)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.46),0 0 0 4px rgba(179,255,64,.12)!important}
.motion-editor-page .motion-download-actions .btn.ghost{background:linear-gradient(90deg,#1b123f,#25145d)!important;color:#b9a6ff!important;border:1px solid rgba(130,92,255,.18)!important}
.motion-editor-page .motion-format-note{display:none!important}

.motion-editor-tabs{gap:12px!important;justify-content:flex-start!important;margin-bottom:14px!important}
.motion-editor-tabs button{height:38px!important;padding:0 18px!important;border-radius:999px!important;color:#787287!important;background:transparent!important}
.motion-editor-tabs button.active{background:#fff!important;color:#05060a!important}
.motion-editor-tabs button span{font-size:14px!important;font-weight:700!important}
.motion-editor-tabs button svg{width:14px!important;height:14px!important;stroke-width:2.1!important}
.motion-inspector-search{height:40px!important;border-radius:15px!important;background:#101118!important;border:1px solid rgba(255,255,255,.035)!important}
.motion-inspector-search input{font-size:14px!important}
.motion-inspector-search input::placeholder{color:#55505d!important}

.motion-explorer-panel{padding:14px!important;border-radius:22px!important}
.motion-explorer-head{padding:2px 0 10px!important;margin-bottom:12px!important;border-bottom:0!important}
.motion-explorer-head h2{font-size:15px!important;font-weight:800!important;letter-spacing:-.02em!important}
.motion-explorer-tools{display:grid!important;align-items:center!important}
.motion-search-wrap,.motion-filter-wrap{height:40px!important;border-radius:14px!important;background:#11131b!important;border-color:rgba(255,255,255,.04)!important}
.motion-explorer-list{gap:14px!important;padding-right:6px!important}
.motion-explorer-card{border-radius:18px!important;background:transparent!important;border:0!important;box-shadow:none!important;gap:10px!important}
.motion-explorer-card:hover{transform:none!important}
.motion-explorer-thumb{height:144px!important;border-radius:16px!important;border:1px solid rgba(255,255,255,.06)!important;overflow:hidden!important;background:radial-gradient(circle at 50% 0%,rgba(85,87,255,.18),transparent 26%),linear-gradient(180deg,#0c0d14,#08090e)!important}
.motion-explorer-thumb>*{transform:scale(.88)!important}
.motion-explorer-meta{padding:0 2px!important;display:block!important;background:none!important}
.motion-explorer-copy b{display:flex!important;align-items:center!important;gap:8px!important;font-size:13px!important;font-weight:700!important;color:#eae5f3!important}
.motion-explorer-copy b i{width:14px!important;height:14px!important;color:#86e8ff!important;flex:none!important}
.motion-explorer-copy span{font-size:12px!important;color:#8e8899!important;margin-top:4px!important;display:block!important;max-width:100%;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.motion-explorer-badge{display:none!important}
.motion-explorer-footer{position:sticky!important;bottom:0!important;background:linear-gradient(180deg,rgba(7,8,13,0),rgba(7,8,13,.96) 30%)!important;padding-top:18px!important;display:grid!important;grid-template-columns:auto 1fr!important;gap:10px!important;align-items:center!important}
.motion-explorer-new{display:inline-flex!important;align-items:center!important;justify-content:center!important;height:26px!important;padding:0 8px!important;border-radius:8px!important;background:#d8ff31!important;color:#121600!important;font-size:12px!important;font-weight:900!important;box-shadow:0 4px 14px rgba(216,255,49,.25)!important}
.motion-explorer-all{min-height:48px!important;border-radius:18px!important;background:linear-gradient(180deg,#6e35ff,#4f1fd2)!important;box-shadow:0 14px 28px rgba(89,36,255,.32)!important}
.motion-explorer-all span{font-size:14px!important}
.motion-explorer-all svg{width:16px!important;height:16px!important}
.motion-explorer-rail{padding:16px 0!important;border-radius:24px!important}
.motion-rail-btn{width:40px!important;height:40px!important;border-radius:14px!important}

.motion-editor-page .motion-preview-modal,.motion-editor-page .motion-preview-modal-v15{animation:editorFade .44s cubic-bezier(.2,.8,.2,1)!important}
.motion-editor-explorer,.motion-editor-page .motion-preview-stage,.motion-editor-page .motion-preview-info,.motion-editor-timeline{animation:editorRise .55s cubic-bezier(.2,.8,.2,1) backwards}
.motion-editor-explorer{animation-delay:.03s}.motion-editor-page .motion-preview-stage{animation-delay:.08s}.motion-editor-page .motion-preview-info{animation-delay:.12s}.motion-editor-timeline{animation-delay:.17s}
@keyframes editorFade{from{opacity:0}to{opacity:1}}
@keyframes editorRise{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}


/* V54 overlap hotfix */
.motion-editor-page .motion-editor-inspector-tools{display:block!important}
.motion-editor-page .motion-inspector-search{display:flex!important;grid-template-columns:none!important;width:100%!important}
.motion-editor-page .motion-inspector-search .motion-field-header,
.motion-editor-page .motion-inspector-search .motion-field-body{display:none!important}
.motion-editor-page .motion-inspector-search>svg{display:block!important}
.motion-editor-page .motion-inspector-search>input{display:block!important}

/* Controls must never fight for horizontal space in the inspector */
.motion-editor-page .motion-lab-grid{grid-template-columns:1fr!important;gap:16px!important}
.motion-editor-page .motion-lab-grid label,
.motion-editor-page .motion-lab-row label,
.motion-editor-page .motion-customize label{min-width:0!important;width:100%!important;overflow:visible!important}
.motion-editor-page .motion-field-header{min-width:0!important;width:100%!important}
.motion-editor-page .motion-field-name{min-width:0!important;max-width:calc(100% - 72px)!important}
.motion-editor-page .motion-field-actions{width:auto!important;min-width:60px!important;justify-content:flex-end!important}
.motion-editor-page .motion-field-body{min-width:0!important;width:100%!important}
.motion-editor-page .motion-field-body.has-side-button{grid-template-columns:minmax(0,1fr) 44px!important}
.motion-editor-page .motion-field-body.is-range,
.motion-editor-page .motion-lab-grid label:has(input[type="range"]) .motion-field-body,
.motion-editor-page .motion-lab-row label:has(input[type="range"]) .motion-field-body{grid-template-columns:82px minmax(0,1fr)!important;column-gap:12px!important}
.motion-editor-page .motion-field-body input,
.motion-editor-page .motion-field-body select,
.motion-editor-page .motion-field-body textarea{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
.motion-editor-page .motion-field-body input[type="range"]{min-width:0!important;width:100%!important}
.motion-editor-page .motion-field-value{max-width:110px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}

/* Keep the right panel clean at common laptop/desktop widths */
@media(max-width:1650px){
  .motion-editor-page .motion-preview-modal,.motion-editor-page .motion-preview-modal-v15{grid-template-columns:360px minmax(560px,1fr) 390px!important}
}
@media(max-width:1450px){
  .motion-editor-page .motion-preview-modal,.motion-editor-page .motion-preview-modal-v15{grid-template-columns:320px minmax(520px,1fr) 370px!important}
  .motion-editor-page .motion-editor-tabs{gap:6px!important}
  .motion-editor-page .motion-editor-tabs button{padding:0 12px!important}
}

/* V55 — inspector polish / circled ugly sections fix */
.motion-editor-page .motion-preview-info{
  padding:18px 18px 84px !important;
  background:
    linear-gradient(180deg,rgba(12,12,18,.98),rgba(7,7,12,.985)) !important;
}

/* top inspector bar */
.motion-editor-page .motion-editor-inspector-tools{
  position:sticky !important;
  top:-10px !important;
  z-index:30 !important;
  margin:-10px -2px 16px !important;
  padding:2px 0 16px !important;
  background:linear-gradient(180deg,rgba(7,8,13,.985) 0%, rgba(7,8,13,.96) 76%, rgba(7,8,13,0) 100%) !important;
  backdrop-filter:blur(16px) !important;
}
.motion-editor-page .motion-editor-tabs{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:8px !important;
  margin:0 0 14px !important;
  width:100% !important;
}
.motion-editor-page .motion-editor-tabs button{
  min-width:0 !important;
  height:40px !important;
  padding:0 10px !important;
  justify-content:center !important;
  gap:6px !important;
  border-radius:14px !important;
  border:1px solid transparent !important;
  background:rgba(255,255,255,.02) !important;
  color:#7e788a !important;
  white-space:nowrap !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02) !important;
}
.motion-editor-page .motion-editor-tabs button span{
  font-size:12px !important;
  font-weight:800 !important;
}
.motion-editor-page .motion-editor-tabs button svg{
  width:13px !important;
  height:13px !important;
  stroke-width:2.1 !important;
}
.motion-editor-page .motion-editor-tabs button.active{
  background:#ffffff !important;
  color:#0a0b12 !important;
  border-color:#ffffff !important;
  box-shadow:0 8px 24px rgba(255,255,255,.08) !important;
}
.motion-editor-page .motion-editor-tabs button:hover:not(.active){
  color:#e4deef !important;
  background:rgba(255,255,255,.04) !important;
}
.motion-editor-page .motion-inspector-search{
  height:44px !important;
  border-radius:15px !important;
  border:1px solid rgba(255,255,255,.055) !important;
  background:#0d0f16 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03) !important;
}
.motion-editor-page .motion-inspector-search input{
  font-size:14px !important;
}

/* title / badge row */
.motion-editor-page .motion-preview-heading{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:14px !important;
  align-items:start !important;
  margin:0 0 14px !important;
  padding:0 0 14px !important;
  border-bottom:1px solid rgba(255,255,255,.06) !important;
}
.motion-editor-page .motion-preview-heading > div{
  display:grid !important;
  gap:6px !important;
  min-width:0 !important;
}
.motion-editor-page [data-motion-tier]{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:max-content !important;
  min-height:26px !important;
  padding:0 12px !important;
  border-radius:999px !important;
  background:linear-gradient(180deg,#44207f,#25143c) !important;
  border:1px solid rgba(187,145,255,.18) !important;
  color:#ffffff !important;
  font-size:11px !important;
  font-weight:900 !important;
  letter-spacing:.02em !important;
}
.motion-editor-page .motion-preview-heading h2{
  margin:0 !important;
  font-size:16px !important;
  line-height:1.05 !important;
  letter-spacing:-.04em !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.motion-editor-page .motion-preview-heading p{
  margin:0 !important;
  color:#8f8aa0 !important;
  font-size:11px !important;
  line-height:1.45 !important;
}
.motion-editor-page .motion-preview-badge{
  display:inline-flex !important;
  align-items:center !important;
  gap:7px !important;
  align-self:start !important;
  min-height:30px !important;
  padding:0 12px !important;
  border-radius:999px !important;
  background:#10111a !important;
  border:1px solid rgba(255,255,255,.06) !important;
  color:#c9c3d6 !important;
  font-size:11px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}
.motion-editor-page .motion-preview-badge svg{
  width:13px !important;
  height:13px !important;
  color:#a56cff !important;
}

/* clean export block */
.motion-editor-page .motion-download-actions{
  position:sticky !important;
  left:0 !important;
  right:0 !important;
  bottom:-12px !important;
  z-index:10 !important;
  display:grid !important;
  grid-template-columns:1.08fr 1fr !important;
  grid-template-areas:
    "alpha mp4"
    "alpha copy" !important;
  gap:12px !important;
  padding:18px 0 4px !important;
  margin-top:14px !important;
  background:linear-gradient(180deg,rgba(7,8,13,0) 0%, rgba(7,8,13,.88) 18%, rgba(7,8,13,.985) 38%) !important;
}
.motion-editor-page .motion-download-actions [data-download-alpha]{grid-area:alpha !important; min-height:102px !important;}
.motion-editor-page .motion-download-actions [data-download-mp4]{grid-area:mp4 !important; min-height:45px !important;}
.motion-editor-page .motion-download-actions [data-copy-css]{grid-area:copy !important; min-height:45px !important;}
.motion-editor-page .motion-download-actions .btn{
  width:100% !important;
  border-radius:20px !important;
  justify-content:center !important;
  gap:10px !important;
  padding:0 16px !important;
  font-size:13px !important;
  font-weight:800 !important;
  line-height:1.1 !important;
}
.motion-editor-page .motion-download-actions .btn svg{
  width:16px !important;
  height:16px !important;
}
.motion-editor-page .motion-download-actions [data-download-alpha]{
  background:linear-gradient(180deg,#bbf659,#b1ef45) !important;
  color:#11160d !important;
  border:1px solid rgba(255,255,255,.30) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 10px 28px rgba(175,247,76,.18) !important;
}
.motion-editor-page .motion-download-actions [data-download-mp4],
.motion-editor-page .motion-download-actions [data-copy-css]{
  background:linear-gradient(180deg,#2f145f,#251049) !important;
  color:#c9baf8 !important;
  border:1px solid rgba(138,100,255,.22) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04) !important;
}
.motion-editor-page .motion-download-actions [data-download-mp4]:hover,
.motion-editor-page .motion-download-actions [data-copy-css]:hover,
.motion-editor-page .motion-download-actions [data-download-alpha]:hover{
  transform:translateY(-1px) !important;
  filter:brightness(1.04) !important;
}

@media (max-width: 1500px){
  .motion-editor-page .motion-editor-tabs button span{font-size:11px !important}
  .motion-editor-page .motion-editor-tabs button{padding:0 8px !important}
}

/* V56 — compact exports + premium click/hover motion */
.motion-editor-page .motion-download-actions{
  grid-template-columns:1fr 1fr !important;
  grid-template-areas:
    "alpha mp4"
    "copy copy" !important;
  gap:10px !important;
  padding:14px 0 4px !important;
}
.motion-editor-page .motion-download-actions [data-download-alpha]{
  grid-area:alpha !important;
  min-height:46px !important;
  height:46px !important;
}
.motion-editor-page .motion-download-actions [data-download-mp4]{
  grid-area:mp4 !important;
  min-height:46px !important;
  height:46px !important;
}
.motion-editor-page .motion-download-actions [data-copy-css]{
  grid-area:copy !important;
  min-height:42px !important;
  height:42px !important;
}
.motion-editor-page .motion-download-actions .btn{
  border-radius:16px !important;
  padding:0 14px !important;
  font-size:12px !important;
  line-height:1 !important;
}
.motion-editor-page .motion-download-actions [data-download-alpha]{
  background:linear-gradient(180deg,#c8ff61,#adf43d) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.52),0 8px 20px rgba(174,246,63,.14) !important;
}

/* universal editor button physics */
.motion-editor-page button,
.motion-editor-page .motion-explorer-all,
.motion-editor-page .motion-editor-brand,
.motion-editor-page .motion-rail-btn,
.motion-editor-page .motion-explorer-card,
.motion-editor-page .motion-top-export,
.motion-editor-page .motion-top-icon{
  position:relative;
  overflow:hidden;
  transform:translateZ(0);
  transition:
    transform .22s cubic-bezier(.2,.9,.2,1.35),
    box-shadow .22s ease,
    background .22s ease,
    border-color .22s ease,
    color .22s ease,
    filter .22s ease,
    opacity .22s ease !important;
  will-change:transform;
}
.motion-editor-page button:hover:not(:disabled),
.motion-editor-page .motion-explorer-all:hover,
.motion-editor-page .motion-rail-btn:hover,
.motion-editor-page .motion-explorer-card:hover,
.motion-editor-page .motion-top-export:hover,
.motion-editor-page .motion-top-icon:hover:not(:disabled){
  transform:translateY(-2px) scale(1.015) !important;
}
.motion-editor-page button:active:not(:disabled),
.motion-editor-page .motion-explorer-all:active,
.motion-editor-page .motion-rail-btn:active,
.motion-editor-page .motion-explorer-card:active,
.motion-editor-page .motion-top-export:active,
.motion-editor-page .motion-top-icon:active:not(:disabled){
  transform:translateY(0) scale(.965) !important;
  transition-duration:.08s !important;
}
.motion-editor-page .motion-editor-tabs button.active{
  animation:loafTabPop .34s cubic-bezier(.16,1,.3,1);
}
@keyframes loafTabPop{
  0%{transform:scale(.92);filter:brightness(.86)}
  55%{transform:scale(1.035)}
  100%{transform:scale(1);filter:none}
}

/* ripple generated by JS */
.motion-editor-page .loaf-click-ripple{
  position:absolute;
  width:14px;
  height:14px;
  border-radius:999px;
  pointer-events:none;
  z-index:50;
  background:rgba(255,255,255,.34);
  transform:translate(-50%,-50%) scale(0);
  animation:loafRipple .56s cubic-bezier(.2,.7,.2,1) forwards;
  mix-blend-mode:screen;
}
.motion-editor-page .motion-download-actions [data-download-alpha] .loaf-click-ripple{
  background:rgba(255,255,255,.66);
  mix-blend-mode:soft-light;
}
@keyframes loafRipple{
  0%{opacity:.9;transform:translate(-50%,-50%) scale(0)}
  70%{opacity:.18}
  100%{opacity:0;transform:translate(-50%,-50%) scale(16)}
}

/* panel transition when switching All / Colors / Text / Values */
.motion-editor-page .motion-preview-info.editor-tab-switching > :not(.motion-editor-inspector-tools){
  animation:loafInspectorSwap .28s cubic-bezier(.2,.8,.2,1);
}
@keyframes loafInspectorSwap{
  from{opacity:0;transform:translateY(8px);filter:blur(4px)}
  to{opacity:1;transform:none;filter:none}
}
.motion-editor-page .motion-explorer-card.active{
  animation:loafCardSelect .36s cubic-bezier(.16,1,.3,1);
}
@keyframes loafCardSelect{
  0%{transform:scale(.975);filter:brightness(.82)}
  60%{transform:scale(1.012)}
  100%{transform:scale(1);filter:none}
}

/* export click success micro-state */
.motion-editor-page .motion-download-actions .btn.is-clicked,
.motion-editor-page .motion-top-export.is-clicked{
  animation:loafExportPulse .48s cubic-bezier(.16,1,.3,1);
}
@keyframes loafExportPulse{
  0%{transform:scale(1)}
  38%{transform:scale(.95)}
  72%{transform:scale(1.035)}
  100%{transform:scale(1)}
}

/* smoother icon motion */
.motion-editor-page button svg,
.motion-editor-page .motion-explorer-all svg,
.motion-editor-page .motion-rail-btn svg,
.motion-editor-page .motion-top-export svg,
.motion-editor-page .motion-top-icon svg{
  transition:transform .24s cubic-bezier(.2,.9,.2,1.3),color .2s ease !important;
}
.motion-editor-page button:hover:not(:disabled) svg,
.motion-editor-page .motion-explorer-all:hover svg,
.motion-editor-page .motion-rail-btn:hover svg,
.motion-editor-page .motion-top-export:hover svg,
.motion-editor-page .motion-top-icon:hover:not(:disabled) svg{
  transform:scale(1.12) rotate(-4deg);
}

@media (prefers-reduced-motion:reduce){
  .motion-editor-page *,
  .motion-editor-page *::before,
  .motion-editor-page *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
}

/* V57 — Explore Animations visibility/flex fix */
.motion-editor-page .motion-explorer-panel{
  min-height:0 !important;
  overflow:hidden !important;
}
.motion-editor-page .motion-explorer-list{
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  align-content:start !important;
  grid-auto-rows:max-content !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  opacity:1 !important;
  visibility:visible !important;
  padding:0 6px 18px 0 !important;
}
.motion-editor-page .motion-explorer-card{
  display:grid !important;
  grid-template-rows:144px auto !important;
  min-height:190px !important;
  opacity:1 !important;
  visibility:visible !important;
  position:relative !important;
  transform:none !important;
}
.motion-editor-page .motion-explorer-card[hidden]{display:none !important}
.motion-editor-page .motion-explorer-thumb{
  display:grid !important;
  place-items:center !important;
  width:100% !important;
  min-height:144px !important;
  opacity:1 !important;
  visibility:visible !important;
}
.motion-editor-page .motion-explorer-meta{
  display:block !important;
  min-height:48px !important;
  opacity:1 !important;
  visibility:visible !important;
}
.motion-editor-page .motion-explorer-copy,
.motion-editor-page .motion-explorer-copy b,
.motion-editor-page .motion-explorer-copy span{
  opacity:1 !important;
  visibility:visible !important;
}
.motion-editor-page .motion-explorer-footer{
  flex:0 0 auto !important;
}

/* V60 — stable category menu, richer palettes and per-animation controls */
.motion-editor-page .motion-filter-custom-v60{position:relative!important;display:block!important;padding:0!important;border:0!important;background:transparent!important;overflow:visible!important;height:44px!important}
.motion-editor-page .motion-filter-custom-v60>select{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.motion-editor-page .motion-filter-button-v60{width:100%!important;height:44px!important;padding:0 13px!important;border:1px solid rgba(255,255,255,.075)!important;border-radius:15px!important;background:#10121b!important;color:#f3eefb!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;font-size:12px!important;font-weight:800!important;overflow:visible!important}
.motion-editor-page .motion-filter-button-v60 svg{width:15px!important;height:15px!important;color:#837a94!important}
.motion-editor-page .motion-filter-menu-v60{position:absolute!important;z-index:90!important;top:50px!important;right:0!important;width:210px!important;max-height:330px!important;overflow:auto!important;padding:8px!important;border:1px solid rgba(255,255,255,.10)!important;border-radius:18px!important;background:rgba(11,12,18,.985)!important;box-shadow:0 24px 56px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.04)!important;backdrop-filter:blur(18px)!important;opacity:0!important;visibility:hidden!important;transform:translateY(-8px) scale(.98)!important;transform-origin:top right!important;transition:.18s ease!important}
.motion-editor-page .motion-filter-custom-v60.open .motion-filter-menu-v60{opacity:1!important;visibility:visible!important;transform:none!important}
.motion-editor-page .motion-filter-menu-v60 button{width:100%!important;min-height:38px!important;padding:0 12px!important;border:0!important;border-radius:11px!important;background:transparent!important;color:#aaa3b8!important;text-align:left!important;font-size:12px!important;font-weight:700!important;display:flex!important;align-items:center!important;overflow:visible!important}
.motion-editor-page .motion-filter-menu-v60 button:hover,.motion-editor-page .motion-filter-menu-v60 button.active{background:rgba(143,92,255,.12)!important;color:#fff!important;transform:none!important}

.motion-editor-page .motion-color-studio-v60{display:grid!important;gap:14px!important;background:linear-gradient(180deg,rgba(13,14,21,.98),rgba(8,9,14,.98))!important;border:1px solid rgba(255,255,255,.075)!important}
.motion-editor-page .motion-color-studio-v60 .motion-customize-head{display:flex!important}
.motion-editor-page .motion-color-group-v60{display:grid!important;gap:10px!important;padding:2px 0 5px!important}
.motion-editor-page .motion-color-label-v60{display:flex!important;align-items:center!important;justify-content:space-between!important;color:#d8d1e4!important;font-size:13px!important;font-weight:700!important}
.motion-editor-page .motion-color-tools-v60{display:flex!important;gap:10px!important;color:#625d6d!important}
.motion-editor-page .motion-color-tools-v60 svg{width:13px!important;height:13px!important}
.motion-editor-page .motion-color-picks-v60{display:grid!important;grid-template-columns:34px 34px 34px minmax(0,1fr)!important;gap:10px!important;align-items:center!important}
.motion-editor-page [data-motion-color-swatch]{width:30px!important;height:30px!important;border-radius:50%!important;border:1px solid rgba(255,255,255,.18)!important;background:var(--sw)!important;box-shadow:0 5px 16px color-mix(in srgb,var(--sw) 22%,transparent)!important;padding:0!important}
.motion-editor-page .motion-spectrum-v60{height:42px!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:15px!important;background:linear-gradient(90deg,#ff271f,#ffea00,#00ff6c,#00e7ff,#294cff,#b600ff,#ff00ba,#ff271f)!important;position:relative!important;padding:0!important;overflow:hidden!important;display:block!important}
.motion-editor-page .motion-spectrum-v60.secondary{background:linear-gradient(90deg,#61e7ff,#8f5cff,#ff67d5,#91ff15,#61e7ff)!important}
.motion-editor-page .motion-spectrum-v60.accent{background:linear-gradient(90deg,#91ff15,#ffffff,#ffba62,#ff5e91,#91ff15)!important}
.motion-editor-page .motion-spectrum-v60 span{position:absolute!important;inset:0!important;background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,0) 44%,rgba(0,0,0,.12))!important;pointer-events:none!important}
.motion-editor-page .motion-spectrum-v60 input{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:0!important;cursor:pointer!important}
.motion-editor-page .motion-palette-presets-v60{display:flex!important;flex-wrap:wrap!important;gap:8px!important;padding-top:2px!important}
.motion-editor-page .motion-palette-presets-v60 button{height:32px!important;padding:0 12px!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.07)!important;background:#10121a!important;color:#b9b2c7!important;font-size:11px!important;font-weight:800!important}
.motion-editor-page .motion-palette-presets-v60 button:hover{border-color:rgba(143,92,255,.28)!important;color:#fff!important}

.motion-editor-page .motion-specific-controls-v60{display:grid!important;gap:12px!important;background:linear-gradient(180deg,rgba(11,17,28,.95),rgba(8,11,18,.98))!important;border:1px solid rgba(97,231,255,.10)!important}
.motion-editor-page .motion-specific-head-v60{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important}
.motion-editor-page .motion-specific-head-v60>div{display:flex!important;align-items:center!important;gap:8px!important;color:#fff!important}
.motion-editor-page .motion-specific-head-v60 svg{width:15px!important;height:15px!important;color:#64ddff!important}
.motion-editor-page .motion-specific-head-v60 span{color:#7f899f!important;font-size:10px!important}
.motion-editor-page .motion-specific-grid-v60{display:grid!important;gap:10px!important}
.motion-editor-page .motion-specific-grid-v60 label{display:grid!important;gap:8px!important;padding:11px 12px!important;border-radius:15px!important;background:#0e121d!important;border:1px solid rgba(255,255,255,.045)!important}
.motion-editor-page .motion-specific-grid-v60 label>div{display:flex!important;align-items:center!important;justify-content:space-between!important;color:#cfc9db!important;font-size:12px!important;font-weight:700!important}
.motion-editor-page .motion-specific-grid-v60 output{padding:3px 7px!important;border-radius:999px!important;background:#181c29!important;color:#fff!important;font-size:10px!important;font-weight:800!important}
.motion-editor-page .motion-specific-grid-v60 input[type=range]{width:100%!important;accent-color:#8f5cff!important}

/* Inspector values: one stable row per value, never crop labels */
.motion-editor-page .motion-lab-v20{display:grid!important;gap:12px!important}
.motion-editor-page .motion-lab-grid{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
.motion-editor-page .motion-lab-grid>label{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;padding:11px 12px!important;border:1px solid rgba(255,255,255,.05)!important;border-radius:15px!important;background:#0e111b!important;min-width:0!important;overflow:visible!important}
.motion-editor-page .motion-lab-grid .motion-field-header{min-width:0!important;width:100%!important}
.motion-editor-page .motion-lab-grid .motion-field-name{font-size:12px!important;min-width:0!important;overflow:visible!important}
.motion-editor-page .motion-lab-grid .motion-field-name span{overflow:visible!important;text-overflow:clip!important;white-space:nowrap!important}
.motion-editor-page .motion-lab-grid .motion-field-body.is-range{display:grid!important;grid-template-columns:76px minmax(0,1fr)!important;gap:12px!important;align-items:center!important;min-width:0!important}
.motion-editor-page .motion-lab-grid .motion-field-body.is-range::before{content:attr(data-value)!important;display:grid!important;place-items:center!important;height:38px!important;border-radius:12px!important;background:#171b27!important;border:1px solid rgba(255,255,255,.055)!important;color:#fff!important;font-size:11px!important;font-weight:800!important;white-space:nowrap!important}
.motion-editor-page .motion-lab-grid input[type=range]{width:100%!important;min-width:0!important;margin:0!important;accent-color:#fff!important}
.motion-editor-page .motion-lab-row{grid-template-columns:1fr!important}
.motion-editor-page .motion-lab-row>label{min-width:0!important}

/* Extra color mapping for common preview elements */
.motion-editor-page .motion-preview-content-v20 .anim-title,
.motion-editor-page .motion-preview-content-v20 .anim-wipe span,
.motion-editor-page .motion-preview-content-v20 .anim-typewriter span,
.motion-editor-page .motion-preview-content-v20 .anim-v20-label,
.motion-editor-page .motion-preview-content-v20 .anim-letters span{color:var(--motion-primary,#fff)!important}
.motion-editor-page .motion-preview-content-v20 .anim-pill,
.motion-editor-page .motion-preview-content-v20 .anim-magnetic,
.motion-editor-page .motion-preview-content-v20 .anim-toggle{background:linear-gradient(90deg,var(--motion-primary,#8f5cff),var(--motion-secondary,#61e7ff))!important}
.motion-editor-page .motion-preview-content-v20 .anim-orbit::after,
.motion-editor-page .motion-preview-content-v20 .anim-progress-ring{border-color:var(--motion-primary,#8f5cff)!important}

@media(max-width:1450px){
  .motion-editor-page .motion-preview-modal,.motion-editor-page .motion-preview-modal-v15{grid-template-columns:320px minmax(460px,1fr) 390px!important}
  .motion-editor-page .motion-color-picks-v60{grid-template-columns:30px 30px 30px minmax(0,1fr)!important}
}

/* V66 — fully responsive Animation Editor */
@media(max-width:900px){
  body.motion-editor-page{overflow:auto!important;min-height:100dvh!important;background:#050507!important}
  .motion-editor-mobile-lock{display:none!important}
  .motion-editor-topbar{display:grid!important;position:sticky!important;top:0!important;inset:auto!important;z-index:1000!important;height:54px!important;grid-template-columns:auto minmax(0,1fr) auto!important;padding:0 8px!important;gap:6px!important}
  .motion-editor-brand{padding:7px 9px!important;border-radius:14px!important}.motion-editor-brand span{display:none!important}.motion-editor-brand img{width:18px!important;height:18px!important}
  .motion-editor-title{justify-self:center!important;min-width:0!important;max-width:100%!important}.motion-editor-title b{font-size:11px!important;max-width:150px!important}.motion-editor-title svg{display:none!important}
  .motion-editor-top-actions{justify-self:end!important;gap:5px!important}.motion-editor-top-actions .motion-top-icon:nth-child(-n+2){display:none!important}.motion-top-icon{width:34px!important;height:34px!important}.motion-top-export{height:36px!important;padding:0 10px!important;border-radius:13px!important;font-size:10px!important}.motion-top-avatar{width:34px!important;height:34px!important}
  .motion-editor-page .motion-preview-shell{display:block!important;position:relative!important;inset:auto!important;z-index:auto!important;width:100%!important;height:auto!important;min-height:0!important;background:#050507!important}
  .motion-editor-page .motion-preview-modal,.motion-editor-page .motion-preview-modal-v15{position:relative!important;display:grid!important;grid-template-columns:1fr!important;grid-template-rows:auto auto auto auto!important;width:100%!important;height:auto!important;max-height:none!important;overflow:visible!important;padding:9px!important;gap:9px!important;background:#050507!important}
  .motion-editor-page .motion-preview-stage{grid-column:1!important;grid-row:1!important;width:100%!important;max-width:none!important;height:auto!important;min-height:230px!important;max-height:none!important;aspect-ratio:16/9!important;place-self:auto!important;margin:0!important;border-radius:18px!important;box-shadow:0 20px 60px rgba(0,0,0,.34)!important}.motion-editor-page .motion-preview-stage:before{inset:10px!important;border-radius:13px!important}.motion-editor-page .motion-preview-stage>*{max-width:92%!important;max-height:84%!important}
  .motion-editor-timeline{grid-column:1!important;grid-row:2!important;position:relative!important;min-height:150px!important;height:150px!important;padding:10px!important;border:1px solid rgba(255,255,255,.06)!important;border-radius:18px!important;background:#07070a!important;grid-template-rows:30px 52px 44px!important;gap:7px!important}.motion-timeline-toolbar{min-width:0!important}.motion-timeline-quality{font-size:8px!important;padding:0 7px!important}.motion-timeline-track,.motion-timeline-audio{border-radius:12px!important}.motion-timeline-playhead{top:36px!important;bottom:8px!important}.motion-timeline-scrub{top:36px!important;height:110px!important}
  .motion-editor-page .motion-preview-info{grid-column:1!important;grid-row:3!important;position:relative!important;min-width:0!important;width:100%!important;max-height:none!important;overflow:visible!important;padding:10px 10px 28px!important;border:1px solid rgba(255,255,255,.06)!important;border-radius:18px!important;background:linear-gradient(180deg,#08080c,#060609)!important;box-shadow:none!important}
  .motion-editor-inspector-tools{position:sticky!important;top:54px!important;z-index:60!important;margin:-10px -10px 12px!important;padding:8px 10px 12px!important;background:rgba(7,8,13,.96)!important;border-radius:18px 18px 0 0!important}.motion-editor-tabs{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;margin-bottom:9px!important}.motion-editor-tabs button{height:34px!important;padding:0 6px!important;font-size:0!important;justify-content:center!important}.motion-editor-tabs button svg{width:15px!important;height:15px!important}.motion-inspector-search{height:38px!important;border-radius:12px!important}
  .motion-editor-page .motion-preview-heading{grid-template-columns:1fr auto!important;gap:8px!important}.motion-editor-page .motion-preview-heading h2{font-size:17px!important}.motion-editor-page .motion-preview-heading p{font-size:10px!important}.motion-editor-page .motion-preview-badge{font-size:9px!important;padding:0 9px!important;min-height:28px!important}
  .motion-editor-page .motion-customize,.motion-editor-page .motion-lab-v20{padding:12px!important;border-radius:15px!important}.motion-editor-page .motion-lab-grid{grid-template-columns:1fr!important}.motion-editor-page .motion-field-body.is-range,.motion-editor-page .motion-lab-grid label:has(input[type="range"]) .motion-field-body,.motion-editor-page .motion-lab-row label:has(input[type="range"]) .motion-field-body{grid-template-columns:72px minmax(0,1fr)!important}.motion-editor-page .motion-palette-v20{gap:6px!important}.motion-editor-page .motion-palette-v20 button{height:32px!important;min-height:32px!important;padding:0 9px!important;font-size:9px!important}.motion-editor-page .motion-download-actions{position:relative!important;bottom:auto!important;grid-template-columns:1fr 1fr!important;grid-template-areas:"alpha mp4" "copy copy"!important;padding:12px 0 0!important;background:transparent!important}.motion-editor-page .motion-download-actions [data-download-alpha]{min-height:52px!important;grid-area:alpha!important}.motion-editor-page .motion-download-actions [data-download-mp4]{min-height:52px!important;grid-area:mp4!important}.motion-editor-page .motion-download-actions [data-copy-css]{min-height:46px!important;grid-area:copy!important}.motion-editor-page .motion-download-actions .btn{border-radius:15px!important;font-size:10px!important}
  .motion-editor-explorer{grid-column:1!important;grid-row:4!important;display:grid!important;grid-template-columns:46px minmax(0,1fr)!important;gap:8px!important;min-height:360px!important;height:420px!important;padding:0!important;margin:0!important;overflow:visible!important}.motion-explorer-rail{display:flex!important;padding:8px 0!important;border-radius:16px!important}.motion-rail-btn{width:34px!important;height:34px!important;border-radius:11px!important}.motion-explorer-panel{min-height:0!important;height:420px!important;border-radius:18px!important;padding:10px!important;overflow:hidden!important}.motion-explorer-head{padding:0 0 8px!important;margin-bottom:8px!important}.motion-explorer-tools{grid-template-columns:minmax(0,1fr) 84px!important;gap:6px!important;margin-bottom:8px!important}.motion-search-wrap,.motion-filter-wrap{height:38px!important;border-radius:12px!important}.motion-explorer-list{overflow:auto!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important;padding-right:3px!important}.motion-explorer-card{min-width:0!important}.motion-explorer-thumb{height:96px!important}.motion-explorer-copy b{font-size:10px!important}.motion-explorer-copy span{font-size:8px!important}.motion-explorer-footer{padding-top:10px!important}.motion-explorer-all{min-height:42px!important;border-radius:14px!important;font-size:10px!important}
}
@media(max-width:520px){
  .motion-editor-page .motion-preview-stage{min-height:210px!important}.motion-editor-page .motion-preview-stage>*{transform:scale(.78)!important}.motion-explorer-list{grid-template-columns:1fr!important}.motion-editor-explorer{height:480px!important}.motion-explorer-panel{height:480px!important}.motion-editor-title b{max-width:110px!important}.motion-top-export{font-size:0!important;width:38px!important;padding:0!important;display:grid!important;place-items:center!important}.motion-top-export svg{width:15px!important}.motion-editor-page .motion-download-actions{grid-template-columns:1fr!important;grid-template-areas:"alpha" "mp4" "copy"!important}.motion-editor-page .motion-download-actions [data-download-alpha],.motion-editor-page .motion-download-actions [data-download-mp4],.motion-editor-page .motion-download-actions [data-copy-css]{min-height:44px!important}
}

/* V68 — Animator / Motion Lab workspace switcher */
.editor-mode-switcher{position:relative;justify-self:center;z-index:90;min-width:0}
.editor-mode-trigger{height:38px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 13px;border:1px solid transparent;border-radius:13px;background:transparent;color:#cfc8db;cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease}
.editor-mode-trigger:hover,.editor-mode-switcher.is-open .editor-mode-trigger{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.07);box-shadow:0 10px 28px rgba(0,0,0,.22)}
.editor-mode-trigger:active{transform:scale(.975)}
.editor-mode-trigger>b{font-size:14px;color:#f1edf7;white-space:nowrap}
.editor-mode-trigger>svg:first-child{width:14px;height:14px;color:#ff6fdf;filter:drop-shadow(0 0 9px rgba(255,111,223,.28))}
.editor-mode-trigger .tiny-chevron{width:12px;height:12px;color:#756e7e;transition:transform .2s ease}
.editor-mode-switcher.is-open .tiny-chevron{transform:rotate(180deg)}
.editor-mode-menu{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(-5px);width:330px;padding:8px;border-radius:20px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,rgba(17,18,27,.985),rgba(8,9,15,.99));box-shadow:0 26px 70px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.035);backdrop-filter:blur(24px);opacity:0;animation:editorModeIn .18s cubic-bezier(.2,.8,.2,1) forwards;transform-origin:top center}
.editor-mode-menu[hidden]{display:none!important}
@keyframes editorModeIn{to{opacity:1;transform:translateX(-50%) translateY(0)}}
.editor-mode-option{display:grid;grid-template-columns:42px minmax(0,1fr) 18px;align-items:center;gap:11px;padding:10px;border-radius:14px;color:#d8d2e1;text-decoration:none;transition:background .17s ease,transform .17s ease,color .17s ease}
.editor-mode-option:hover{background:rgba(255,255,255,.055);transform:translateX(2px);color:#fff}
.editor-mode-option.active{background:linear-gradient(90deg,rgba(126,80,255,.14),rgba(255,255,255,.025));box-shadow:inset 0 0 0 1px rgba(139,95,255,.12)}
.editor-mode-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(180deg,#191b28,#0f111a);border:1px solid rgba(255,255,255,.07);color:#cdbdff}
.editor-mode-icon.beta{color:#dbff6e;background:linear-gradient(180deg,rgba(111,141,25,.22),rgba(21,30,10,.65));border-color:rgba(193,255,66,.12)}
.editor-mode-icon svg{width:17px;height:17px}
.editor-mode-option>span:nth-child(2){display:grid;gap:3px;min-width:0}
.editor-mode-option b{font-size:12px;color:#f5f1fa;display:flex;align-items:center;gap:7px}
.editor-mode-option small{font-size:10px;color:#7f788a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.editor-mode-option em{font-style:normal;font-size:8px;letter-spacing:.06em;color:#dfff7c;background:rgba(158,206,45,.13);border:1px solid rgba(192,255,68,.12);padding:3px 5px;border-radius:999px}
.editor-mode-option>svg{width:14px;height:14px;color:#756e7f;justify-self:end}
.editor-mode-option.active>svg{color:#9dff61}
.motion-lab-v67 .editor-mode-trigger .ml67-beta-mini{margin-left:1px}
@media(max-width:820px){.editor-mode-trigger{padding:0 8px}.editor-mode-trigger>b{font-size:11px}.editor-mode-trigger>svg:first-child{display:none}.editor-mode-menu{width:min(310px,calc(100vw - 24px))}}
@media(max-width:520px){.editor-mode-trigger .ml67-beta-mini{display:none}.editor-mode-trigger>b{max-width:120px;overflow:hidden;text-overflow:ellipsis}.editor-mode-menu{position:fixed;top:58px;left:12px;right:12px;width:auto;transform:none;animation:editorModeMobileIn .18s cubic-bezier(.2,.8,.2,1) forwards}@keyframes editorModeMobileIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}}