/* BridgeMD public inner pages, other pages: browse by condition, condition pages, how it works, sign in and
   account pages, unsubscribe, legal and error pages. Loaded after finder.detail.css. Tokens, fields and
   buttons come from cv-tokens.css and finder.css. */

/* Breadcrumbs */
body.fx .fo-crumbs { margin: 0 0 28px; }
body.fx .fo-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0; padding: 0; list-style: none; font: 400 13px/19.5px var(--cv-f); color: var(--cv-muted); }
body.fx .fo-crumbs li { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
body.fx .fo-crumbs li + li::before { content: ""; width: 6px; height: 6px; border-top: 1.5px solid #8b9ab2; border-right: 1.5px solid #8b9ab2; transform: rotate(45deg); }
body.fx .fo-crumbs a { color: var(--cv-accent); font-weight: 500; text-decoration: none; }
body.fx .fo-crumbs a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Use my location */
body.fx .fo-loc { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 14px 0 0; min-height: 24px; }
body.fx .fo-useloc { display: inline-flex; align-items: center; gap: 7px; }
body.fx .fo-useloc .ico { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
body.fx .fo-useloc:disabled { opacity: .6; cursor: default; text-decoration: none; }
body.fx .loc-confirm { margin: 0; font: 400 14px/1.45 var(--cv-f); color: var(--cv-text); }
body.fx .loc-confirm b { color: var(--cv-ink); font-weight: 600; }
body.fx .loc-confirm.ok, body.fx .loc-confirm.ok b { color: var(--fx-ok); }
body.fx .loc-confirm.err { color: var(--fx-bad); }

/* Sections, chips, link columns */
body.fx .fo-sec { margin-top: 72px; }
body.fx .fo-sec > h2 { margin: 0 0 20px; font: 500 var(--fx-h3)/var(--fx-h3-lh) var(--cv-fd); letter-spacing: -.01em; color: var(--cv-ink); text-wrap: balance; }
body.fx .fo-sec > .fo-sec-sub { margin: -8px 0 20px; max-width: 640px; font: 400 15px/24px var(--cv-f); color: var(--cv-text); }
body.fx .fo-chips { display: flex; flex-wrap: wrap; gap: 8px; }
body.fx .fo-chip { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border: 1px solid var(--cv-line-2); border-radius: var(--cv-r-pill); background: #fff; color: var(--cv-ink); font: 500 14px/1.2 var(--cv-f); letter-spacing: -.005em; text-decoration: none; transition: border-color .2s ease, background-color .2s ease, color .2s ease; }
body.fx .fo-chip:hover { border-color: var(--cv-accent); background: var(--cv-surface); color: var(--cv-accent-d); }
body.fx .fo-card-list { padding: 28px 32px; }
body.fx .fo-cols { columns: 3 220px; column-gap: 32px; margin: 0; padding: 0; list-style: none; }
body.fx .fo-cols li { break-inside: avoid; }
body.fx .fo-cols a { display: block; padding: 8px 0; font: 400 15px/1.35 var(--cv-f); color: var(--cv-text); text-decoration: none; transition: color .2s ease; }
body.fx .fo-cols a:hover { color: var(--cv-accent); }
body.fx .fo-about { max-width: 720px; margin: 72px 0 0; font: 400 13px/19.5px var(--cv-f); color: var(--cv-muted); }
body.fx .fo-about strong { color: var(--cv-ink); font-weight: 600; }

/* Condition page trial cards. The whole top of the card submits the eligibility search. */
body.fx .fo-trials { display: grid; gap: var(--cv-gap); }
body.fx .fo-trial { padding: 0; overflow: hidden; transition: background-color .25s ease, border-color .25s ease; }
body.fx .fo-trial:hover { background: var(--cv-surface); border-color: var(--cv-line-2); }
body.fx .fo-trial form { margin: 0; }
body.fx .fo-trial-main, body.fx a.fo-trial-main { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 32px; align-items: center; width: 100%; box-sizing: border-box; margin: 0; padding: 26px 28px 22px; border: 0; border-radius: 0; background: none; box-shadow: none; text-align: left; font: inherit; color: inherit; text-decoration: none; cursor: pointer; }
body.fx .fo-trial-main:focus-visible { outline: 2px solid var(--cv-accent); outline-offset: -2px; }
body.fx .fo-trial-text { display: grid; gap: 8px; min-width: 0; }
body.fx .fo-trial-title { font: 500 20px/26px var(--cv-fd); letter-spacing: -.01em; color: var(--cv-ink); overflow-wrap: anywhere; }
body.fx .fo-trial:hover .fo-trial-title { color: var(--cv-accent); }
body.fx .fo-trial-sum { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font: 400 15px/24px var(--cv-f); letter-spacing: -.005em; color: var(--cv-text); }
body.fx .fo-trial-site { display: inline-flex; align-items: center; gap: 6px; font: 400 13px/19.5px var(--cv-f); color: var(--cv-muted); }
body.fx .fo-trial-site .ico { width: 15px; height: 15px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body.fx .fo-trial-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; font: 400 13px/19.5px var(--cv-f); color: var(--cv-muted); }
body.fx .fo-trial-meta .is-status { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: var(--cv-r-pill); background: var(--fx-ok-bg); font-weight: 500; color: var(--fx-ok); }
body.fx .fo-trial-meta .is-eu { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: var(--cv-r-pill); background: var(--cv-surface-2); font-weight: 500; color: var(--cv-accent-d); }
body.fx .fo-trial-go { display: inline-flex; align-items: center; gap: 12px; height: 46px; padding: 5px 5px 5px 20px; border-radius: var(--cv-r-pill); background: var(--cv-accent); color: #fff; font: 500 15px/1 var(--cv-f); letter-spacing: -.01em; white-space: nowrap; transition: background-color .2s ease; }
body.fx .fo-trial-go .ico { box-sizing: border-box; width: 36px; height: 36px; padding: 10px; border-radius: 50%; background: #fff; color: var(--cv-accent); fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s var(--cv-ease); }
body.fx .fo-trial-main:hover .fo-trial-go { background: var(--cv-accent-d); }
body.fx .fo-trial-main:hover .fo-trial-go .ico { transform: translateX(2px); }
body.fx .fo-trial-links { display: flex; flex-wrap: wrap; gap: 6px 24px; padding: 14px 28px 16px; border-top: 1px solid var(--cv-line); font: 500 13px/19.5px var(--cv-f); }
body.fx .fo-trial-links a { display: inline-flex; align-items: center; gap: 6px; color: var(--cv-accent); text-decoration: none; }
body.fx .fo-trial-links a:hover { color: var(--cv-accent-d); text-decoration: underline; text-underline-offset: 3px; }
body.fx .fo-trial-links a.is-ext { color: var(--cv-muted); }
body.fx .fo-trial-links a.is-ext:hover { color: var(--cv-accent-d); }
body.fx .fo-trial-links .ico { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* The accordion row used by the FAQ lists: a label and a plus in a circle that turns into a cross. */
body.fx .fx-acc > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 58px; padding: 12px 0; font: 500 16px/22px var(--cv-f); letter-spacing: -.01em; color: var(--cv-ink); cursor: pointer; list-style: none; }
body.fx .fx-acc > summary::-webkit-details-marker { display: none; }
body.fx .fx-acc > summary::after { content: ""; flex: none; width: 34px; height: 34px; border-radius: 50%;
  background: linear-gradient(var(--cv-ink), var(--cv-ink)) center / 12px 2px no-repeat, linear-gradient(var(--cv-ink), var(--cv-ink)) center / 2px 12px no-repeat, var(--cv-surface-2);
  transition: transform .3s var(--cv-ease), background-color .25s ease; }
body.fx .fx-acc[open] > summary::after { transform: rotate(45deg);
  background: linear-gradient(#fff, #fff) center / 12px 2px no-repeat, linear-gradient(#fff, #fff) center / 2px 12px no-repeat, var(--cv-ink); }
body.fx .fx-acc > summary:hover { color: var(--cv-accent); }
body.fx .fo-faq { display: grid; gap: 10px; }
body.fx .fo-faq details { padding: 8px 24px; border: 1px solid var(--cv-line); border-radius: 18px; background: #fff; }
body.fx .fo-faq details > p { margin: 0 0 16px; max-width: 700px; font: 400 15px/24px var(--cv-f); letter-spacing: -.005em; color: var(--cv-text); }

/* How it works */
body.fx .fo-panel { margin: 0 0 var(--cv-gap); padding: 36px 40px; }
body.fx .fo-panel > h2 { margin: 0 0 6px; font: 500 var(--fx-h3)/var(--fx-h3-lh) var(--cv-fd); letter-spacing: -.01em; }
body.fx .fo-panel > .fo-panel-sub { margin: 0 0 12px; font: 400 15px/24px var(--cv-f); color: var(--cv-text); }
body.fx .fo-steps { margin: 0; padding: 0; list-style: none; }
body.fx .fo-steps li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 0 20px; align-items: start; padding: 20px 0; border-top: 1px solid var(--cv-line); }
body.fx .fo-steps li:first-child { padding-top: 0; border-top: 0; }
body.fx .fo-steps li:last-child { padding-bottom: 0; }
body.fx .fo-panel-sub + .fo-steps { margin-top: 20px; }
body.fx .fo-num { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: var(--cv-surface-2); color: var(--cv-accent-d); font: 500 15px/1 var(--cv-f); }
body.fx .fo-steps b { display: block; margin-top: 8px; font: 500 18px/24.3px var(--cv-fd); letter-spacing: -.01em; color: var(--cv-ink); }
body.fx .fo-steps p { margin: 4px 0 0; font: 400 15px/24px var(--cv-f); letter-spacing: -.005em; color: var(--cv-text); }
body.fx .fo-steps a { color: var(--cv-accent); font-weight: 500; text-decoration: none; }
body.fx .fo-steps a:hover { text-decoration: underline; text-underline-offset: 3px; }
body.fx .fo-note { display: flex; align-items: flex-start; gap: 14px; margin: 0; padding: 22px 26px; border-radius: var(--cv-r-tile); background: var(--cv-surface); color: var(--cv-ink); }
body.fx .fo-note .ico { width: 20px; height: 20px; margin-top: 2px; fill: none; stroke: var(--cv-accent); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
body.fx .fo-note b { display: block; font: 500 18px/24.3px var(--cv-fd); letter-spacing: -.01em; }
body.fx .fo-note p { margin: 2px 0 0; font: 400 15px/24px var(--cv-f); color: var(--cv-text); }

/* Sign in, account and unsubscribe pages */
body.fx .fo-auth-wrap { display: grid; justify-items: center; }
body.fx .fo-card { width: 100%; padding: 40px 36px 36px; }
body.fx .fo-card .cv-eyebrow { margin: 0 0 20px; }
body.fx .fo-card h1 { margin: 0 0 12px; font-size: 38px; line-height: 42px; text-wrap: balance; }
body.fx .fo-sub { margin: 0 0 28px; font: 400 15px/24px var(--cv-f); letter-spacing: -.005em; color: var(--cv-text); }
body.fx .fo-sub b { color: var(--cv-ink); font-weight: 600; overflow-wrap: anywhere; }
body.fo-auth-page .toast-stack { display: none; }
body.fx .fo-flash { margin: 0 0 20px; padding: 14px 16px; border-radius: 14px; background: var(--cv-surface); color: var(--cv-ink); font: 500 14px/1.5 var(--cv-f); }
body.fx .fo-flash.is-error, body.fx .fo-flash.is-warn { background: var(--fx-bad-bg); color: #8f2f20; }
body.fx .fo-flash.is-success, body.fx .fo-flash.is-ok { background: var(--fx-ok-bg); color: var(--fx-ok); }
body.fx .fo-nb { white-space: nowrap; }
body.fx .fo-form { display: grid; gap: 18px; margin: 0; }
body.fx .fo-field { display: grid; gap: 8px; min-width: 0; }
body.fx .fo-label { margin: 0; font: 500 13px/1.3 var(--cv-f); letter-spacing: 0; color: var(--cv-ink); }
body.fx .fo-input { width: 100%; height: 50px; padding: 0 16px; box-sizing: border-box; border: 1px solid var(--cv-line-2); border-radius: 14px; background: #fff; font: 400 15px/1.3 var(--cv-f); color: var(--cv-ink); box-shadow: none; transition: border-color .2s ease, box-shadow .2s ease; }
body.fx .fo-input:hover { border-color: rgba(10, 20, 40, .34); }
body.fx .fo-input:focus { outline: 0; border-color: var(--cv-accent); box-shadow: var(--fx-ring); }
body.fx .fo-input.input-invalid { border-color: #b4412e; box-shadow: 0 0 0 3px rgba(180, 65, 46, .12); }
body.fx .fo-hint { margin: 0; font: 400 13px/19.5px var(--cv-f); color: var(--cv-muted); }
body.fx .fo-err { display: none; margin: 0; font: 500 13px/19.5px var(--cv-f); color: var(--fx-bad); }
body.fx .fo-err.show { display: block; }
body.fx .fo-consent { display: flex; align-items: flex-start; gap: 12px; margin: 0; font: 400 14px/21px var(--cv-f); color: var(--cv-text); cursor: pointer; }
body.fx .fo-consent input { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--cv-accent); }
body.fx .fo-consent a, body.fx .fo-alt a { color: var(--cv-accent); font-weight: 500; text-decoration: none; }
body.fx .fo-consent a:hover, body.fx .fo-alt a:hover { text-decoration: underline; text-underline-offset: 3px; }
body.fx .fo-submit { width: 100%; }
body.fx .fo-alt { margin: 22px 0 0; font: 400 14px/21px var(--cv-f); text-align: center; color: var(--cv-text); }
body.fx .fo-alt + .fo-alt { margin-top: 10px; }
body.fx .fo-google { display: flex; align-items: center; justify-content: center; gap: 10px; height: 50px; border: 1px solid var(--cv-line-2); border-radius: var(--cv-r-pill); background: #fff; color: var(--cv-ink); font: 500 15px/1 var(--cv-f); text-decoration: none; transition: border-color .2s ease, background-color .2s ease; }
body.fx .fo-google:hover { border-color: rgba(10, 20, 40, .4); background: rgba(10, 20, 40, .03); color: var(--cv-ink); }
body.fx .fo-google .ico { width: 18px; height: 18px; }
body.fx .fo-divider { display: flex; align-items: center; gap: 14px; margin: 22px 0; font: 400 13px/19.5px var(--cv-f); color: var(--cv-muted); }
body.fx .fo-divider::before, body.fx .fo-divider::after { content: ""; flex: 1; height: 1px; background: var(--cv-line); }
body.fx .fo-code { height: 60px; text-align: center; font-size: 26px; font-weight: 600; letter-spacing: .4em; text-indent: .4em; font-variant-numeric: tabular-nums; }
body.fx .fo-card form + form { margin-top: 12px; }
body.fx .fo-card > .cv-btn { margin-top: 4px; }

/* Legal pages */
body.fx .fo-legal .fx-head { margin-bottom: 48px; }
body.fx .fo-legal > h2 { margin: 48px 0 16px; padding-top: 40px; border-top: 1px solid var(--cv-line); font: 500 var(--fx-h3)/var(--fx-h3-lh) var(--cv-fd); letter-spacing: -.01em; color: var(--cv-ink); }
body.fx .fo-legal > .fx-head + h2 { margin-top: 0; padding-top: 0; border-top: 0; }
body.fx .fo-legal p, body.fx .fo-legal li { font: 400 15px/24px var(--cv-f); letter-spacing: -.005em; color: var(--cv-text); }
body.fx .fo-legal p { margin: 0 0 14px; }
body.fx .fo-legal ul { margin: 0 0 14px; padding-left: 22px; }
body.fx .fo-legal li { margin: 0 0 10px; padding-left: 4px; }
body.fx .fo-legal li::marker { color: #8b9ab2; }
body.fx .fo-legal b { color: var(--cv-ink); font-weight: 600; }
body.fx .fo-legal a { color: var(--cv-accent); font-weight: 500; text-decoration: underline; text-decoration-color: rgba(18, 87, 176, .35); text-underline-offset: 3px; }
body.fx .fo-legal a:hover { color: var(--cv-accent-d); text-decoration-color: currentColor; }
body.fx .fo-legal .fo-contact { margin: 48px 0 8px; padding-top: 32px; border-top: 1px solid var(--cv-line); }
body.fx .fo-legal .fo-more { margin: 0; }

/* Error pages */
body.fx .fo-error { text-align: center; }
body.fx .fo-error .fx-head { align-items: center; margin-bottom: 32px; }
body.fx .fo-error h1 { text-wrap: balance; }
body.fx .fo-error .cv-lead { max-width: 480px; }
body.fx .fo-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }

@media (max-width: 767px) {
  body.fx .fo-sec { margin-top: 56px; }
  body.fx .fo-about { margin-top: 56px; }
  body.fx .fo-card-list { padding: 18px 20px; }
  body.fx .fo-cols { columns: 2 140px; column-gap: 20px; }
  body.fx .fo-trial-main, body.fx a.fo-trial-main { grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 22px 20px 18px; }
  body.fx .fo-trial-links { padding: 14px 20px 16px; }
  body.fx .fo-faq details { padding: 4px 18px; }
  body.fx .fo-panel { padding: 24px 20px; }
  body.fx .fo-steps li { grid-template-columns: 36px minmax(0, 1fr); gap: 0 14px; }
  body.fx .fo-num { width: 36px; height: 36px; }
  body.fx .fo-card { padding: 28px 20px 24px; }
  body.fx .fo-card h1 { font-size: 32px; line-height: 35px; }
  body.fx .fo-legal > h2 { margin-top: 40px; padding-top: 32px; }
}

/* ---------- Trial alerts (same cards, fields and buttons as My applications) ---------- */
body.fx .al-new { margin: 0 0 var(--cv-gap); padding: 32px 36px; }
body.fx .al-new-title { margin: 0 0 20px; }
body.fx .al-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 190px) auto; gap: 16px 20px; align-items: end; }
body.fx .al-field { position: relative; }
body.fx .fo-label .opt { font-weight: 400; color: var(--cv-muted); }
body.fx .al-dist { display: grid; grid-template-columns: minmax(0, 1fr) 88px; gap: 8px; }
body.fx .fo-select { appearance: none; -webkit-appearance: none; padding-right: 36px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%235b6980' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 1.5 6 6l4.5-4.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; background-size: 12px 8px; }
body.fx .al-submit { white-space: nowrap; }
body.fx .al-strong { margin: 22px 0 0; }
body.fx .al-hint { margin: 10px 0 0; }
body.fx .ac-suggest { position: absolute; z-index: 20; top: 100%; left: 0; right: 0; margin-top: 6px; max-height: 280px; overflow-y: auto; border: 1px solid var(--cv-line-2); border-radius: 14px; background: #fff; box-shadow: 0 14px 34px rgba(10, 20, 40, .12); }
body.fx .ac-suggest[hidden] { display: none; }
body.fx .ac-suggest-item { display: block; width: 100%; padding: 12px 16px; border: 0; background: none; text-align: left; font: 400 15px/1.3 var(--cv-f); color: var(--cv-ink); cursor: pointer; }
body.fx .ac-suggest-item:hover, body.fx .ac-suggest-item.is-active { background: var(--cv-surface-2); }
body.fx .al-card { margin: 0 0 var(--cv-gap); padding: 32px 36px; }
body.fx .al-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
body.fx .al-card-head form { margin: 0; }
body.fx .al-card-title { margin: 0; }
body.fx .al-meta { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 8px 0 0; font: 400 14px/21px var(--cv-f); color: var(--cv-muted); }
body.fx .al-meta span { display: inline-flex; align-items: center; gap: 6px; }
body.fx .al-meta .ico { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body.fx .al-tune { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 24px; margin: 24px 0 0; padding-top: 24px; border-top: 1px solid var(--cv-line); }
body.fx .al-tune-fields { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 16px 28px; }
body.fx .al-tune-dist { width: 230px; }
body.fx .al-tune-fields .fo-consent { min-height: 50px; align-items: center; }
body.fx .al-tune-actions { display: flex; gap: 10px; }
body.fx .alert-preview { margin: 20px 0 0; padding: 18px 20px; border-radius: 16px; background: var(--cv-surface); }
body.fx .alert-preview-loading, body.fx .alert-preview-lbl { margin: 0; font: 400 14px/21px var(--cv-f); color: var(--cv-text); }
body.fx .alert-preview-lbl { margin-bottom: 10px; font-weight: 500; color: var(--cv-ink); }
body.fx .alert-preview-list, body.fx .alert-matches { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
body.fx .alert-matches { margin-top: 22px; }
body.fx .alert-match, body.fx .alert-preview-list li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font: 400 15px/22px var(--cv-f); color: var(--cv-text); }
body.fx .alert-match a, body.fx .alert-preview-list a { color: var(--cv-accent); font-weight: 500; text-decoration: none; }
body.fx .alert-match a:hover, body.fx .alert-preview-list a:hover { text-decoration: underline; text-underline-offset: 3px; }
body.fx .alert-match-nct { font: 500 12px/1 var(--cv-f); letter-spacing: .02em; color: var(--cv-muted); }
body.fx .alert-tag-new, body.fx .alert-preview-strong { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: var(--cv-r-pill); background: var(--fx-ok-bg); color: var(--fx-ok); font: 500 12px/1 var(--cv-f); }
body.fx .alert-new-banner { display: flex; align-items: center; gap: 10px; margin: 20px 0 0; padding: 12px 16px; border-radius: 14px; background: var(--cv-surface-2); color: var(--cv-accent-d); font: 500 14px/21px var(--cv-f); }
body.fx .alert-new-banner .ico { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
body.fx .alert-none { margin: 20px 0 0; font: 400 15px/24px var(--cv-f); color: var(--cv-text); }
@media (max-width: 960px) {
  body.fx .al-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  body.fx .al-submit { grid-column: 1 / -1; width: 100%; justify-content: center; }
}
@media (max-width: 767px) {
  body.fx .al-new, body.fx .al-card { padding: 24px 20px; }
  body.fx .al-grid { grid-template-columns: minmax(0, 1fr); }
  body.fx .al-card-head { flex-direction: column; }
  body.fx .al-tune-dist { width: 100%; }
  body.fx .al-tune-fields { width: 100%; }
  body.fx .al-tune-actions { width: 100%; }
  body.fx .al-tune-actions .cv-btn { flex: 1 1 0; justify-content: center; }
}
/* Error page actions fill the width on phones */
@media (max-width: 479px) {
  body.fx .fo-actions { flex-direction: column; align-items: stretch; }
  body.fx .fo-actions .cv-btn { width: 100%; justify-content: center; }
}

/* The frame of every finder page lines up with the navigation above it. Titles, search bars, cards and the apply panel
   start where the logo starts and end where the nav's last button ends. The nav is a card set 16px in from each side
   (10px on a tablet or phone), at most 1240px wide, with 21px of padding on the left and 11px on the right (15px each side
   on a tablet or phone). This covers the results list, the browse and condition pages, the trial page and the study page.
   The narrow forms (sign in, sign up) keep their own centered column. */
.fx-results .fx-wrap, .fo-trials-page .fx-wrap, .fo-cond-page .fx-wrap,
body.fx .td-back, body.fx .td-layout, body.fx .study { width: calc(100% - 32px); max-width: 1240px; padding-left: 21px; padding-right: 11px; }
@media (max-width: 960px) {
  .fx-results .fx-wrap, .fo-trials-page .fx-wrap, .fo-cond-page .fx-wrap,
  body.fx .td-back, body.fx .td-layout, body.fx .study { width: calc(100% - 20px); padding-left: 15px; padding-right: 15px; }
}