

.fl-root{--paper:#f9f9f6;--ink:#131313;--t2:#52524f;--t3:#6c6c68;--line:rgba(19,19,19,.10);--accent:#6250d6;
  font-family:"Inter",system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;color:var(--ink);background:var(--paper);padding:24px}
.fl-frame{position:relative;aspect-ratio:16/10;border-radius:12px;overflow:hidden;border:.5px solid var(--line);background:var(--paper)}
.fl-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.fl-meta{position:absolute;left:18px;bottom:16px;display:flex;gap:12px;align-items:baseline}
.fl-cap{font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--t2)}
.fl-dim{color:var(--t3);opacity:.7}
.fl-bar{display:flex;gap:8px;margin-top:16px}
.fl-pick{height:44px;padding:0 18px;border:.5px solid var(--line);border-radius:9999px;background:#fff;color:var(--ink);
  font-family:inherit;font-size:13px;font-weight:400;cursor:default;
  transition:border-color 150ms cubic-bezier(.4,0,.2,1),background-color 150ms cubic-bezier(.4,0,.2,1),color 150ms cubic-bezier(.4,0,.2,1),opacity 150ms cubic-bezier(.4,0,.2,1)}
.fl-pick:is(:hover, [data-hover]){border-color:rgba(19,19,19,.18)}
.fl-pick[data-on="1"]{border-color:var(--accent);color:var(--accent);font-weight:500}
.fl-pick:focus-visible{outline:1px solid var(--accent);outline-offset:2px}
.fl-note{max-width:520px;margin:16px 0 0;font-size:13px;font-weight:400;line-height:1.55;color:var(--t2)}
@media (prefers-reduced-motion:reduce){.fl-pick{transition:none}}

html, body, #root { height: 100%; }
body { margin: 0; }
.ob-root, .su-root, .dp-root, .fl-root, .mb-shell { font-family: var(--font); }
/* in a frame narrower than the 400 px column the form would push past the edge: the column may shrink */
.ob-left { min-width: 0; }
.fl-root { max-width: 960px; margin: 0 auto; box-sizing: border-box; min-height: 100%; }
