/* /forms: OpenVibe's own form controls (openvibe-shared ov-forms). Theme variables from the Frame; the controls are ov-forms.css's. */
.fm { --fm-face: 'OV Brand', Nunito, Inter, -apple-system, BlinkMacSystemFont, sans-serif; max-width: 1120px; margin: 0 auto; padding: clamp(18px, 4vw, 44px) clamp(16px, 3vw, 32px) 96px; color: var(--text-primary); }
.fm-hero { max-width: 800px; padding-bottom: clamp(18px, 3vw, 28px); }
.fm-eye { margin: 0 0 10px; color: var(--accent); font-size: 12px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.fm-h1 { margin: 0; font-family: var(--fm-face); font-weight: 900; font-size: clamp(32px, 5.2vw, 56px); line-height: 1.05; letter-spacing: -.02em; text-wrap: balance; }
.fm-lede { margin: 14px 0 0; max-width: 64ch; color: var(--text-secondary); font-size: clamp(15px, 1.6vw, 17px); line-height: 1.6; }
.fm-jump { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 18px; font-size: 14px; }
.fm-jump a { color: var(--text-secondary); text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--accent) 40%, transparent); }
.fm-jump a:hover { color: var(--text-primary); }
.fm-sec { margin: 0; padding: clamp(22px, 3.5vw, 38px) 0; border-top: 1px solid var(--border); scroll-margin-top: 72px; }
.fm-sec-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 8px 32px; align-items: baseline; margin-bottom: 18px; }
.fm-sec-head h2 { margin: 0; font-family: var(--fm-face); font-weight: 900; font-size: clamp(22px, 3vw, 30px); line-height: 1.15; text-wrap: balance; }
.fm-sec-head p { margin: 0; max-width: 64ch; color: var(--text-secondary); line-height: 1.55; }
.fm code { font-size: .92em; }
.fm-demo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 16px; align-items: start; }
.fm-live { display: grid; gap: 14px; padding: 20px; border-radius: 16px; border: 1px solid var(--border); background: var(--bg-secondary); min-width: 0; }
.fm-stack { gap: 16px; }
.fm-out { margin: 0; color: var(--text-secondary); font-size: 13px; }
.fm-code { display: grid; gap: 12px; min-width: 0; }
.fm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)); gap: 16px; padding: 20px; border-radius: 16px; border: 1px solid var(--border); background: var(--bg-secondary); }
.fm-row { display: flex; flex-wrap: wrap; gap: 14px 28px; padding: 20px; border-radius: 16px; border: 1px solid var(--border); background: var(--bg-secondary); }
.fm-check { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 15px; }
.fm-range input { width: 160px; }
/* The switch-row / segmented demo (markup of kit 4.164; this site's pin catches up on the next round). */
.fm .ovk-set-switch { min-height: 56px; }
.fm .ovk-set-ic { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: var(--ov-radius-1); background: color-mix(in srgb, var(--ovk-accent) 12%, transparent); color: var(--ovk-accent); }
.fm .ovk-set-ic .ovk-i { width: 19px; height: 19px; }
.fm .ovk-set-row .ovk-switch { margin-left: auto; }
.fm .ovk-set-seg { flex-wrap: wrap; }
.fm .ovk-set-seg .ovk-set-text { flex: 1 1 100%; }
.fm .ovk-seg--fill { display: flex; flex: 1 1 100%; flex-wrap: nowrap; width: 100%; min-width: 0; }
.fm .ovk-seg--fill .ovk-seg-item { flex: 1 1 0; min-width: 0; }
.fm .ovk-seg--fill span { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fm .ovk-seg--fill .ovk-i { flex: none; width: 16px; height: 16px; }
.fm #fm-rows .ovk-set-row:first-child { border-top: 0; }
.fm-table-wrap { overflow-x: auto; border-radius: 14px; border: 1px solid var(--border); }
.fm-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.fm-table th, .fm-table td { padding: 11px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border); }
.fm-table th { color: var(--text-secondary); font-size: 12px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; background: var(--bg-secondary); }
.fm-table tr:last-child td { border-bottom: 0; }
.fm-table td:first-child { white-space: nowrap; }
@media (max-width: 760px) { .fm-sec-head, .fm-demo { grid-template-columns: 1fr; } }