.themes-playground{overflow-x:clip}.themes-playground-desktop{grid-template-columns:minmax(10rem,13rem) minmax(0,1fr);align-items:center;gap:clamp(1.5rem,4vw,3.5rem)}.themes-playground-desktop--studio{grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:clamp(1.25rem,3vw,2.75rem)}.themes-phone{background:linear-gradient(160deg,#2a2a2a 0%,#111 45%,#1c1c1c 100%);border-radius:2.15rem;flex-shrink:0;width:18.75rem;height:40rem;padding:.72rem;position:relative;box-shadow:0 30px 60px -28px #0000008c,inset 0 0 0 1px #ffffff14}.themes-phone-notch{z-index:2;background:#0a0a0a;border-radius:999px;width:28%;height:.72rem;position:absolute;top:1.05rem;left:50%;transform:translate(-50%)}.themes-phone-screen{background:var(--background,#fff);isolation:isolate;border-radius:1.55rem;height:100%;padding-top:1.35rem;position:relative;overflow:hidden}.themes-mobile-preview-frame{position:relative}.themes-mobile-toolbar{animation:.28s both themes-toolbar-enter}.themes-mobile-palette-row{animation:.22s both themes-palette-enter}.themes-theme-chip{max-width:100%}@keyframes themes-toolbar-enter{0%{opacity:0;transform:translateY(-.35rem)}to{opacity:1;transform:translateY(0)}}@keyframes themes-palette-enter{0%{opacity:0;transform:translateY(.25rem)}to{opacity:1;transform:translateY(0)}}.themes-mobile-preview-frame>.menu-theme-preview,.themes-phone-screen>.menu-theme-preview{height:100%}.menu-theme-preview{transition:background-color .22s,color .22s}.menu-theme-preview *{transition:background-color .22s,color .22s,border-color .22s,box-shadow .22s}.themes-preview-enter{animation:.28s both themes-preview-fade}@keyframes themes-preview-fade{0%{opacity:.55;transform:translateY(.35rem)}to{opacity:1;transform:translateY(0)}}.themes-fullscreen{padding-inline:env(safe-area-inset-left) env(safe-area-inset-right)}@media (prefers-reduced-motion:reduce){.menu-theme-preview,.menu-theme-preview *,.themes-theme-option,.themes-palette-swatch{transition:none!important}.themes-preview-enter,.themes-mobile-toolbar,.themes-mobile-palette-row{animation:none!important}}.menu-theme-preview .inverted-radius-top,.menu-theme-preview .inverted-radius-bottom{--scoop:1.25rem;--overlap:0;pointer-events:none;width:var(--scoop);height:var(--scoop);background:0 0;position:absolute;inset-inline-end:var(--overlap)}.menu-theme-preview .inverted-radius-top{top:calc(var(--scoop) * -1);box-shadow:.35rem .35rem 0 .35rem var(--background);border-end-end-radius:var(--scoop)}.menu-theme-preview .inverted-radius-bottom{bottom:calc(var(--scoop) * -1);box-shadow:.35rem -.35rem 0 .35rem var(--background);border-start-end-radius:var(--scoop)}[dir=rtl] .menu-theme-preview .inverted-radius-top{box-shadow:-.35rem .35rem 0 .35rem var(--background)}[dir=rtl] .menu-theme-preview .inverted-radius-bottom{box-shadow:-.35rem -.35rem 0 .35rem var(--background)}