.editor-page{--mockup-workspace-ground:#f0f5fc;--mockup-workspace-blue:#c1d9f6;--mockup-workspace-sky:#d5eafa;--mockup-workspace-indigo:#d2daf5;isolation:isolate;background:var(--mockup-workspace-ground);position:relative}:root[data-theme=dark] .editor-page{--mockup-workspace-ground:#171e2a;--mockup-workspace-blue:#243e62;--mockup-workspace-sky:#263e50;--mockup-workspace-indigo:#2c3456}.editor-page:before{content:"";z-index:-1;pointer-events:none;background:url(/workspace-grain.svg?v=2), radial-gradient(ellipse at 15% 25%, var(--mockup-workspace-blue), transparent 55%), radial-gradient(ellipse at 90% 65%, var(--mockup-workspace-sky), transparent 52%), radial-gradient(ellipse at 55% 95%, var(--mockup-workspace-indigo), transparent 55%);background-blend-mode:soft-light, normal, normal, normal;position:absolute;inset:0}.editor-page .inline-edit-toolbar,.editor-page .mobile-panel-tabs{border-color:color-mix(in srgb, var(--surface) 65%, transparent);background-color:var(--surface);box-shadow:inset 0 1px 0 #ffffff38, inset 0 -1px 0 #00000009, var(--shadow-panel);background-image:linear-gradient(160deg,#ffffff24,#0000 45%,#00000006)}@supports ((-webkit-backdrop-filter:blur(14px)) or (backdrop-filter:blur(14px))){.editor-page .inline-edit-toolbar,.editor-page .mobile-panel-tabs{background-color:color-mix(in srgb, var(--surface) 92%, transparent);-webkit-backdrop-filter:blur(14px)saturate(1.12);backdrop-filter:blur(14px)saturate(1.12)}}@media (prefers-reduced-transparency:reduce),(prefers-contrast:more){.editor-page .inline-edit-toolbar,.editor-page .mobile-panel-tabs{border-color:var(--border);background:var(--surface);-webkit-backdrop-filter:none;backdrop-filter:none}}.editor-page .compact-settings{box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:0;border-radius:0;padding:0}@media (width>=800px) and (height>=561px){.editor-page .fitted-workspace{grid-template-columns:var(--right-width) minmax(0, var(--canvas-width)) var(--left-width)}.editor-page .fitted-workspace .presets-rail{grid-column:1}.editor-page .fitted-workspace .settings-rail{grid-column:3}}.editor-page .compact-settings,.editor-page .compact-settings[data-section=Animation]{grid-template-rows:24px 96px 34px minmax(0,1fr) 80px}.editor-page .control-sections{border-bottom:1px solid var(--border);scrollbar-width:none;align-items:stretch;gap:4px;min-height:30px;display:flex;overflow-x:auto}.editor-page .control-section{min-height:30px;box-shadow:none;white-space:nowrap;background:0 0;border:0;border-bottom:2px solid #0000;border-radius:0;flex:1 0 auto;padding:0 3px;font-size:12px;display:flex}.editor-page .control-section[aria-selected=true]{border-bottom-color:var(--accent);color:var(--accent-ink);box-shadow:none;background:0 0}.editor-page .control-section:active:not(:disabled){transform:none}.editor-page .settings-page{overscroll-behavior:contain;scrollbar-width:thin;overflow-y:auto}.editor-page .settings-page[data-section=Animation] .animation-panel{grid-template-rows:40px 30px 34px max-content;height:auto}.editor-page .animation-gallery{grid-template-rows:repeat(3,34px);max-height:none}@media (width>=800px) and (height>=561px) and (height<=620px){.editor-page .compact-settings,.editor-page .compact-settings[data-section=Animation]{grid-template-rows:76px 32px minmax(0,1fr) 76px}}@media (width<=799px),(height<=560px){.editor-page .compact-settings,.editor-page .compact-settings[data-section=Animation]{grid-template-rows:68px 34px minmax(0,1fr) 44px}.editor-page .compact-settings[data-section=Animation] .control-sections,.editor-page .compact-settings[data-section=Animation] .control-footer{display:flex}}@media (width<=559px) and (height<=620px){.editor-page .compact-settings,.editor-page .compact-settings[data-section=Animation]{grid-template-rows:48px 30px minmax(0,1fr) 36px}}@media (width>=560px) and (height<=560px){.editor-page .compact-settings,.editor-page .compact-settings[data-section=Animation]{grid-template-rows:48px 34px minmax(0,1fr) 44px}}body:has(.editor-page){--accent:#176ce0;--accent-strong:#0955b6;--accent-ink:#1158b3;--accent-soft:#eaf3ff;--accent-border:#a5c7f5;--color-accent:#176ce0}:root[data-theme=dark] body:has(.editor-page){--accent:#65aaff;--accent-strong:#65aaff;--accent-ink:#a6d0ff;--accent-soft:#192e4a;--accent-border:#395e8e;--color-accent:#65aaff}.editor-page .button.primary{--action-label:#000;--action-label-shadow:var(--action-white-glow);--action-top:#2584f3;--action-bottom:#176ce0;--action-base:#0b4b9f}.editor-page .fitted-workspace .canvas-play-button{--action-top:#fff;--action-bottom:#dcdcdf;--action-base:#8b8b92;border:1px solid var(--action-base);color:#000;width:auto;min-width:92px;height:34px;min-height:34px;box-shadow:var(--action-shadow);transition:transform .12s var(--ease-out), box-shadow .12s var(--ease-out);border-radius:999px;gap:6px;padding:0 12px;transform:translate(-50%)}.editor-page .canvas-play-button .brand-mascot{flex-basis:22px}@media (hover:hover) and (pointer:fine){.editor-page .fitted-workspace .canvas-play-button:hover:not(:disabled){transform:translate(-50%)}}.editor-page .fitted-workspace .canvas-play-button:active:not(:disabled){transform:translate(-50%)scale(.96)}@media (prefers-reduced-motion:reduce){.editor-page .fitted-workspace .canvas-play-button:hover:not(:disabled),.editor-page .fitted-workspace .canvas-play-button:active:not(:disabled){transform:translate(-50%)}.editor-page .fitted-workspace .canvas-play-button:active:not(:disabled){opacity:.85}}.editor-page .fitted-workspace .presets-rail{grid-template-rows:auto auto minmax(0,1fr)}.editor-page .fitted-workspace .presets-rail[data-gallery-note=true]{grid-template-rows:auto auto auto minmax(0,1fr)}.editor-page .presets-rail[data-gallery-note=true] .gallery-section-label{display:block}.editor-page .control-section{flex:1 1 0;justify-content:center}.editor-page .control-section svg{flex-shrink:0;display:block}.editor-page .rail-heading h2,.editor-page .gallery-heading h2{font-family:var(--font-brand);letter-spacing:-.2px;font-size:20px;font-weight:400;line-height:1.15}.editor-page .fitted-workspace .mobile-panel-tabs button{font-family:var(--font-brand);font-size:18px;font-weight:400;line-height:1.1}
