.loft-swap-button{background:linear-gradient(135deg, color-mix(in srgb, var(--color-accent-action) 22%, transparent), color-mix(in srgb, var(--accent-cyan) 22%, transparent));border:1px solid color-mix(in srgb, var(--color-accent-action) 35%, transparent);width:40px;height:40px;color:var(--color-accent-action);cursor:pointer;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:1rem;transition:filter .15s,transform .15s,box-shadow .15s;display:inline-flex}.loft-swap-button:hover:not(:disabled){filter:brightness(1.15);box-shadow:0 0 18px color-mix(in srgb, var(--color-accent-action) 25%, transparent);transform:scale(1.06)}.loft-swap-button:active:not(:disabled){transform:scale(.96)}.loft-swap-button:disabled{opacity:.4;cursor:not-allowed}.loft-swap-button:focus-visible{box-shadow:var(--ring-cyan);outline:none}@container codews (width<=56rem){.loft-swap-button i{display:inline-block;transform:rotate(90deg)}}.loft-examples{display:inline-block;position:relative}.loft-examples__trigger{background:var(--color-surface-card-hover);color:var(--color-text-heading);border-radius:var(--radius-md,8px);cursor:pointer;border:1px solid #0000;align-items:center;gap:6px;padding:6px 10px;font-family:inherit;font-size:12px;font-weight:500;transition:border-color .15s,background .15s;display:inline-flex}.loft-examples__trigger:hover{border-color:var(--color-accent-action)}.loft-examples__trigger[aria-expanded=true]{border-color:var(--color-accent-action);background:var(--color-surface-card)}.loft-examples__caret{color:var(--color-text-muted);font-size:9px}.loft-examples__menu{z-index:var(--z-dropdown);background:var(--color-surface-elevated);border:1px solid var(--color-surface-card-hover);border-radius:var(--radius-md,8px);min-width:240px;max-width:360px;box-shadow:var(--elev-3);max-height:360px;position:absolute;top:calc(100% + 4px);left:0;overflow:hidden auto}.loft-examples__group+.loft-examples__group{border-top:1px solid var(--color-surface-card-hover)}.loft-examples__group-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;background:var(--color-surface-elevated);padding:6px 12px;font-size:9px;font-weight:700}.loft-examples__item{text-align:left;width:100%;color:var(--color-text-body);cursor:pointer;background:0 0;border:0;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;font-family:inherit;font-size:12px;transition:background .1s,color .1s;display:flex}.loft-examples__item:hover,.loft-examples__item:focus-visible{background:var(--color-surface-card);color:var(--color-text-heading);outline:none}.loft-examples__label{text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.loft-examples__desc{color:var(--color-text-muted);font-size:10px;font-family:var(--font-mono,ui-monospace, monospace);flex:none}@media (prefers-reduced-motion:reduce){.loft-examples__trigger,.loft-examples__item{transition:none}}.loft-codews{width:100%;max-width:var(--codews-max-width,1400px);--codews-pane-h-desktop:520px;--codews-pane-h-tablet:440px;--codews-pane-h-mobile:360px;--codews-pane-h:var(--codews-pane-h-mobile);--codews-gap:16px;flex-direction:column;gap:16px;margin-inline:auto;display:flex;container:codews/inline-size}@container codews (width>=36rem){.loft-codews{--codews-pane-h:var(--codews-pane-h-tablet)}}@container codews (width>=60rem){.loft-codews{--codews-pane-h:var(--codews-pane-h-desktop)}}.loft-codews__tabs{background:var(--color-surface-card);border:1px solid var(--color-surface-card-hover);border-radius:var(--radius-md,8px);gap:4px;padding:4px;display:flex}@container codews (width>=36rem){.loft-codews__tabs{display:none}}.loft-codews__tabs button{color:var(--color-text-muted);cursor:pointer;border-radius:var(--radius-md,8px);background:0 0;border:0;flex:1;padding:8px 12px;font-family:inherit;font-size:12px;font-weight:600;transition:background .15s,color .15s}@media (prefers-reduced-motion:reduce){.loft-codews__tabs button{transition:none}}.loft-codews__tabs button:hover{color:var(--color-text-heading)}.loft-codews__tabs button.is-active{background:var(--color-accent-action);color:var(--color-surface-primary)}@media (width<=640px){.loft-codews__tabs button{min-height:44px;font-size:16px}}.loft-codews__toolbar{justify-content:flex-start;gap:8px;display:flex}.loft-codews__panes{gap:var(--codews-gap);grid-template-columns:1fr;align-items:stretch;display:grid}@container codews (width>=60rem){.loft-codews__panes{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}}.loft-codews__pane{height:var(--codews-pane-h);min-width:0;display:flex}.loft-codews__pane>*{flex-direction:column;flex:1;min-width:0;display:flex}.loft-codews__swap{place-self:center;display:none}.loft-codews__swap-spacer{display:none}@container codews (width>=60rem){.loft-codews__swap{display:flex}.loft-codews__swap-spacer{width:0;display:block}}@container codews (width<=35.99rem){.loft-codews[data-active-tab=input] .loft-codews__pane--output,.loft-codews[data-active-tab=input] .loft-codews__collapsibles,.loft-codews[data-active-tab=input] .loft-codews__swap,.loft-codews[data-active-tab=output] .loft-codews__pane--input,.loft-codews[data-active-tab=output] .loft-codews__collapsibles,.loft-codews[data-active-tab=output] .loft-codews__swap,.loft-codews[data-active-tab=options] .loft-codews__panes,.loft-codews[data-active-tab=options] .loft-codews__toolbar,.loft-codews[data-active-tab=options] .loft-codews__swap{display:none}}.loft-codews__collapsibles{gap:var(--codews-gap);flex-direction:column;display:flex}.loft-codews__advanced-body--auto-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;display:grid}.loft-codews__advanced-body--stack{flex-direction:column;gap:12px;display:flex}.loft-examples-menu{display:inline-block;position:relative}.loft-examples-menu__trigger{border-radius:var(--radius-md);color:var(--text-primary,#f8fafc);cursor:pointer;background:#ffffff0a;border:1px solid #ffffff14;align-items:center;gap:6px;padding:6px 12px;font-family:inherit;font-size:.78rem;font-weight:500;transition:background .15s,border-color .15s;display:inline-flex}.loft-examples-menu__trigger:hover{background:#ffffff12;border-color:#06b6d459}.loft-examples-menu__trigger i{color:var(--accent-cyan,#06b6d4);font-size:.9rem}.loft-examples-menu__caret{transition:transform .2s;color:var(--text-muted,#64748b)!important;font-size:.7rem!important}.loft-examples-menu__caret--open{transform:rotate(180deg)}.loft-examples-menu__list{z-index:30;background:var(--elev-surface-3);border:1px solid #0000;border-top-color:var(--border-lit);border-radius:var(--radius-lg);box-shadow:var(--elev-3);min-width:220px;max-height:320px;margin:0;padding:6px;list-style:none;position:absolute;top:calc(100% + 6px);right:0;overflow-y:auto}.loft-examples-menu__item{border-radius:var(--radius-sm);width:100%;color:var(--text-primary,#f8fafc);cursor:pointer;text-align:left;background:0 0;border:none;flex-direction:column;align-items:flex-start;padding:8px 10px;font-family:inherit;transition:background .12s;display:flex}.loft-examples-menu__item:hover{background:#06b6d41a}.loft-examples-menu__item-label{font-size:.82rem;font-weight:500}.loft-examples-menu__item-desc{color:var(--text-muted,#64748b);margin-top:2px;font-size:.72rem}@media (pointer:coarse){.loft-examples-menu__trigger{min-height:44px}}