/* A continuous procedural surface: no image tiles or UV wrap boundaries. */
.studio-motion-setting { margin:19px 0 21px; }
.studio-motion-heading { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px; }
.studio-motion-heading>span { color:var(--paper);font-size:12px;font-weight:600; }
.studio-motion-heading>small { color:var(--muted);font:9px/1.4 var(--mono); }
#view-studio .motion-switch { position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;height:62px;padding:5px;border:1px solid var(--line-strong);border-radius:13px;background:color-mix(in srgb,var(--ink) 72%,var(--panel));box-shadow:inset 0 2px 5px #0005;cursor:pointer;overflow:hidden;transition:border-color .42s,box-shadow .42s; }
.motion-switch-thumb { position:absolute;inset:5px auto 5px 5px;width:calc(50% - 5px);overflow:hidden;border-radius:9px;background:radial-gradient(ellipse at 25% 100%,#476144,transparent 70%),linear-gradient(135deg,#19352a,#263f2d 48%,#102a20);border:1px solid #cee5b54a;box-shadow:inset 0 1px 0 #eef7d72b,0 2px 7px #0006;transition:transform .42s cubic-bezier(.22,.8,.25,1),border-color .42s,box-shadow .42s; }
.motion-switch-shader { display:block;width:100%;height:100%;opacity:0;transition:opacity .25s;pointer-events:none; }
.motion-switch-shader[data-renderer="webgl"] { opacity:1; }
.motion-switch-thumb::after { content:"";position:absolute;inset:0;background:linear-gradient(180deg,#cee5b510,transparent 38%,#071c1645);box-shadow:inset 0 0 0 1px #ffffff08; }
.motion-switch-option { position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:9px;color:var(--muted);font:650 11px/1 var(--mono);letter-spacing:.11em;transition:color .28s,text-shadow .28s; }
.motion-switch-option>svg { width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round; }
.motion-switch[aria-checked="false"] .motion-option-static,.motion-switch[aria-checked="true"] .motion-option-dynamic { color:#edf8e9;text-shadow:0 1px 4px #00190f; }
.motion-switch[aria-checked="true"] .motion-switch-thumb { transform:translateX(100%);border-color:var(--acid);box-shadow:inset 0 1px 0 #bdffe360,0 0 19px #00cc8d3b; }
.motion-switch[aria-checked="true"] .motion-option-dynamic { color:#e7fff1;text-shadow:0 1px 3px #06291d,0 0 9px #00cc8d45; }
#view-studio .motion-switch[aria-checked="true"] { border-color:color-mix(in srgb,var(--acid) 60%,var(--line));box-shadow:inset 0 2px 5px #0005,0 0 17px #00cc8d18; }
#view-studio .motion-switch:hover:not(:disabled) { border-color:var(--secondary); }
#view-studio .motion-switch[aria-checked="true"]:hover:not(:disabled) { border-color:var(--acid); }
#view-studio .motion-switch:focus-visible { outline:2px solid var(--acid);outline-offset:4px; }
#view-studio .motion-switch:disabled { cursor:wait;opacity:.65; }
.studio-motion-help { margin:10px 0 0;color:var(--muted);font-size:11px;line-height:1.6; }
@media(prefers-reduced-motion:reduce) {
  #view-studio .motion-switch,.motion-switch-thumb,.motion-switch-option,.motion-switch-shader { transition:none; }
}
@media(forced-colors:active) {
  #view-studio .motion-switch[aria-checked],#view-studio .motion-switch[aria-checked]:hover:not(:disabled) { border-color:ButtonText;box-shadow:none; }
  #view-studio .motion-switch .motion-switch-thumb { background:Highlight;border-color:Highlight;box-shadow:none;forced-color-adjust:none; }
  .motion-switch-shader,.motion-switch-thumb::after { display:none; }
  .motion-switch[aria-checked="false"] .motion-option-static,.motion-switch[aria-checked="true"] .motion-option-dynamic { color:HighlightText;text-shadow:none;forced-color-adjust:none; }
}
