.studio-mode-switch-shell{justify-content:center;align-items:flex-start;width:100%;min-width:0;display:flex;container:studio-mode/inline-size}.studio-mode-switch{--studio-mode-pad:6px;--studio-mode-gap:4px;--studio-mode-direction:1;isolation:isolate;gap:var(--studio-mode-gap);padding:var(--studio-mode-pad);background:#080e18c7;border:1px solid #a7bcd629;border-radius:999px;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;width:fit-content;max-width:100%;display:inline-grid;position:relative;box-shadow:inset 0 1px #ffffff0a}[dir=rtl] .studio-mode-switch{--studio-mode-direction:-1}.studio-mode-thumb{z-index:0;inset-block:var(--studio-mode-pad);width:calc((100% - 2 * var(--studio-mode-pad) - (var(--studio-mode-count) - 1) * var(--studio-mode-gap)) / var(--studio-mode-count));transform:translateX(calc(var(--studio-mode-index) * (100% + var(--studio-mode-gap)) * var(--studio-mode-direction)));pointer-events:none;background:linear-gradient(135deg,#63d3ff38,#6dffb724);border-radius:999px;transition:transform .26s cubic-bezier(.2,.8,.2,1),opacity .16s;position:absolute;inset-inline-start:var(--studio-mode-pad);box-shadow:0 10px 24px #0e1a292e,inset 0 0 0 1px #63d3ff2e}.studio-mode-switch[data-disabled] .studio-mode-thumb{opacity:.58}.studio-mode-button{z-index:1;box-sizing:border-box;color:#d6e3f4c2;min-width:0;min-height:48px;font:inherit;text-align:center;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:0 0;border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-weight:700;line-height:1.2;transition:color .16s,background .16s,box-shadow .16s;display:inline-flex;position:relative}.studio-mode-icon{opacity:.78;flex:none;width:18px;height:18px;transition:opacity .16s}[dir=rtl] .studio-mode-icon-split{transform:scaleX(-1)}.studio-mode-button-label{overflow-wrap:break-word;text-wrap:balance;min-width:0}.studio-mode-button.active{color:#eff6fffa}.studio-mode-button.active .studio-mode-icon{opacity:1}@media (hover:hover){.studio-mode-button:not(.active):not(:disabled):not([aria-disabled=true]):hover{color:#eff6fff0;background:#ffffff0a}}.studio-mode-button:focus-visible{outline:none;box-shadow:0 0 0 2px #0a0f18eb,0 0 0 4px #63d3ff52}.studio-mode-button:disabled,.studio-mode-button[aria-disabled=true]{cursor:not-allowed;opacity:.58}.studio-mode-switch-fallback .studio-mode-button:disabled,.studio-mode-switch-fallback .studio-mode-button[aria-disabled=true]{cursor:wait}@container studio-mode (max-width:520px){.studio-mode-switch{--studio-mode-pad:4px;border-radius:22px;width:100%}.studio-mode-thumb{border-radius:18px}.studio-mode-button{border-radius:18px;flex-direction:column;gap:4px;min-height:58px;padding:8px 6px;font-size:.8rem;line-height:1.15}.studio-mode-icon{width:20px;height:20px}}@media (prefers-reduced-motion:reduce){.studio-mode-thumb{transition:none}}