.dev-toggle{display:inline-flex;gap:2px;padding:2px;border-radius:999px;background:color-mix(in srgb,currentColor 14%,transparent)}.dev-toggle-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:26px;border:0;border-radius:999px;background:transparent;color:inherit;opacity:.55;cursor:pointer;transition:opacity .15s ease,background .15s ease}.dev-toggle-btn:hover{opacity:.85}.dev-toggle-btn.is-on{opacity:1;background:color-mix(in srgb,currentColor 22%,transparent)}.dev-toggle-btn:focus-visible{outline:2px solid currentColor;outline-offset:2px;opacity:1}.dev-toggle--labelled .dev-toggle-btn{width:auto;gap:.4rem;padding:0 .7rem}.dev-toggle-cap{font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;line-height:1}@media (max-width:380px){.dev-toggle-cap{display:none}.dev-toggle--labelled .dev-toggle-btn{width:30px;padding:0;gap:0}}@media (max-width:640px){.dev-toggle{display:none}}.dev-stage{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}.dev-stage--mobile{padding:clamp(.75rem,3vw,2rem) 1rem}.dev-stage--desktop{padding:0}@media (max-width:640px){.dev-stage--mobile{padding:0}.dev-stage--mobile .dev-frame{aspect-ratio:auto;width:100%;height:100%;max-width:none}}.dev-stage-desktop{width:100%;height:100%;border:0;display:block}.dev-scalebox{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}.dev-scalebox-inner{flex:none;transform-origin:center}.dev-scalebox-inner .dev-frame{width:414px;height:864px;max-width:none;max-height:none}.dev-stage--desktop:has(.dev-scalebox){padding:1rem 1.5rem}.dev-desktop-shell{display:flex;flex-direction:column;width:100%;height:100%;border-radius:16px;overflow:hidden;background:var(--sk-surface,#fff);box-shadow:0 0 0 1.5px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.6),0 26px 60px -16px rgba(0,0,0,.48)}.dev-desktop-bar{flex:none;display:flex;align-items:center;gap:18px;height:52px;padding:0 22px;background:linear-gradient(180deg,color-mix(in oklab,#f7f5f3 var(--sk-tint-keep,100%),var(--sk-surface,#FFFDF9)) 0,color-mix(in oklab,#ece8e4 var(--sk-tint-keep,100%),var(--sk-surface,#FFFDF9)) 100%);border-bottom:1px solid rgba(0,0,0,.12)}.dev-desktop-dots{display:inline-flex;gap:9px}.dev-desktop-dots i{width:13px;height:13px;border-radius:50%;background:#e0443e;box-shadow:inset 0 0 0 .5px rgba(0,0,0,.12),0 1px 1px rgba(255,255,255,.5)}.dev-desktop-dots i:nth-child(2){background:#dea123}.dev-desktop-dots i:nth-child(3){background:#24a53f}.dev-desktop-url{display:flex;align-items:center;justify-content:center;gap:7px;flex:1;max-width:460px;margin-inline:auto;height:30px;padding:0 18px;border-radius:999px;background:var(--sk-surface,#fff);border:1px solid rgba(0,0,0,.08);box-shadow:inset 0 1px 2px rgba(0,0,0,.04);font-size:14px;line-height:1;letter-spacing:.02em;color:var(--sk-ink,#6b6560)}.dev-desktop-url:before{content:"";width:11px;height:12px;background-color:#8a847e;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 12'%3E%3Crect x='0.5' y='5' width='10' height='6.5' rx='1.5'/%3E%3Cpath d='M2.5 5V3.5a3 3 0 0 1 6 0V5' fill='none' stroke='%23000' stroke-width='1.4'/%3E%3C/svg%3E") center /contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 12'%3E%3Crect x='0.5' y='5' width='10' height='6.5' rx='1.5'/%3E%3Cpath d='M2.5 5V3.5a3 3 0 0 1 6 0V5' fill='none' stroke='%23000' stroke-width='1.4'/%3E%3C/svg%3E") center /contain no-repeat}.dev-desktop-shell iframe{width:1140px;height:760px;border:0;display:block}.dev-desktop-chin{flex:none;position:relative;height:24px;background:linear-gradient(180deg,color-mix(in oklab,#f0f0f2 var(--sk-tint-keep,100%),var(--sk-surface,#FFFDF9)) 0,color-mix(in oklab,#d6d7db var(--sk-tint-keep,100%),var(--sk-surface,#FFFDF9)) 55%,#b9bac1 100%);border-top:1px solid rgba(0,0,0,.12)}.dev-desktop-chin:before{content:"";position:absolute;top:50%;left:50%;width:10px;height:10px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 35% 30%,color-mix(in oklab,#c9cad0 var(--sk-tint-keep,100%),var(--sk-surface,#FFFDF9)),#8f9098 70%);box-shadow:0 0 0 1px rgba(0,0,0,.08)}.dev-deskbox{width:100%;height:100%;overflow:hidden;background:var(--sk-surface,#fff)}.dev-deskbox-inner{width:100%;height:100%;transform-origin:top left}.dev-deskbox-inner>iframe{width:100%;height:100%;border:0;display:block}