.ff-main { padding-top: 126px; min-height: 75svh; }
.ff-intro { display:grid; gap:48px; padding-bottom:64px; }
.ff-intro-copy { align-self:center; max-width:560px; }
.ff-eyebrow { font-size:10px; letter-spacing:.16em; margin-bottom:24px; }
.ff-intro h1 { font-size:clamp(32px,4vw,62px); font-weight:400; line-height:1.14; letter-spacing:-.06em; white-space:pre-line; }
.ff-subtitle { font-size:13px; max-width:400px; margin-top:28px; line-height:1.85; }
.ff-intro-actions { display:flex; flex-direction:column; align-items:flex-start; gap:20px; margin:36px 0 28px; }
.ff-button { display:inline-flex; justify-content:center; align-items:center; min-height:48px; padding:14px 24px; background:var(--cobalt); color:#fff; font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.ff-button:hover { background:#073485; color:#fff; }
.ff-button:disabled { opacity:.5; cursor:wait; }
.ff-text-button { text-decoration:underline; text-underline-offset:5px; font-size:12px; min-height:44px; }
.ff-privacy,.ff-consent,.ff-muted { color:#595750; font-size:11px; line-height:1.85; }
.ff-privacy { max-width:520px; margin:24px 0; }
.ff-consent { display:flex; gap:10px; align-items:flex-start; max-width:470px; }
.ff-consent input { margin-top:4px; accent-color:var(--cobalt); flex:none; width:16px;height:16px; }
.ff-details { font-size:11px; margin-top:24px; max-width:520px; }
.ff-details summary { cursor:pointer; min-height:30px; }
.ff-details p { margin-top:12px; color:#595750; }
.ff-editorial { position:relative; }
.ff-editorial img { width:100%; max-height:740px; aspect-ratio:4/5; object-fit:cover; object-position:center 35%; }
.ff-editorial figcaption { margin-top:12px; font-size:10px; letter-spacing:.1em; }
.ff-error { color:#aa1519; margin:24px auto; }
.ff-results { padding-bottom:64px; scroll-margin-top:120px; }
.ff-result-header { display:flex; justify-content:space-between; gap:24px; margin-bottom:40px; }
.ff-result-header h2 { font-weight:400; font-size:clamp(30px,5vw,62px); line-height:1.2; margin-bottom:16px; }
#ffAnalysis { max-width:670px; margin-top:20px; font-size:13px; }
.ff-preferences { margin:40px 0 64px; }
.ff-report { display:grid; gap:24px; padding:28px; border:1px solid #0943a733; margin:40px 0; }
.ff-report .ff-eyebrow { color:var(--cobalt);margin-bottom:12px; }
.ff-report h3 { font-size:18px;font-weight:400;line-height:1.5; }
.ff-report p:not(.ff-eyebrow) { font-size:11px;line-height:1.8;max-width:510px;margin-top:12px; }
.ff-report-actions { display:flex;flex-direction:column;align-items:flex-start;min-width:0; }
.ff-report-actions .ff-button { width:100%; }
.ff-report-actions .ff-text-button { color:var(--cobalt);margin-top:8px; }
.ff-report-actions p:empty { display:none; }
.ff-report-actions p[data-error="true"] { color:#aa1519; }
@media(min-width:850px) { .ff-report { grid-template-columns:1fr 280px;gap:48px;align-items:center; } }
@media(max-width:649px) { .ff-report { padding:22px 18px; }.ff-report h3 { font-size:17px; } }
.ff-preferences fieldset { border:0; }
.ff-preferences legend { font-size:12px; margin-bottom:16px; }
.ff-pills { display:flex; flex-wrap:wrap; gap:10px; }
.ff-pill { min-height:44px; padding:10px 14px; border:1px solid #b6b3ab; font-size:11px; }
.ff-pill[aria-pressed="true"] { color:#fff; background:var(--ink); border-color:var(--ink); }
.ff-details label { display:block; margin-top:12px; }
.ff-details input { font:inherit; background:transparent; border:1px solid #aaa; padding:10px; width:100px; margin-top:8px; }
.ff-matches-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:12px; }
.ff-matches-heading h2 { font-size:13px; font-weight:400; text-transform:uppercase; letter-spacing:.05em; }
.ff-discovery-heading { display:flex;align-items:center;justify-content:space-between;gap:20px; }
.ff-filters { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px;padding:24px 0;margin:16px 0 24px;border-block:1px solid #1112; }
.ff-filters label { display:flex;flex-direction:column;gap:8px;font-size:11px;min-width:0; }
.ff-filters select,.ff-filters input:not([type=checkbox]) { width:100%;min-width:0;min-height:44px;background:transparent;border:1px solid #b6b3ab;padding:10px;font:inherit;font-size:12px;border-radius:0; }
.ff-filters label.ff-filter-check { flex-direction:row;align-items:center;gap:10px; }
.ff-filter-check input { accent-color:var(--cobalt);width:18px;height:18px; }
.ff-filter-error { grid-column:1/-1;color:#aa1519;font-size:11px; }
.ff-model-download { width:100%;max-width:580px;margin:4px auto;font-size:10px;flex:none; }
.ff-model-download progress { width:100%;height:3px;accent-color:#91baff;margin-top:8px; }
@media(min-width:1000px) { .ff-filters { grid-template-columns:repeat(3,minmax(0,1fr)); } }
.ff-matches { display:grid; gap:48px 24px; margin:28px 0 64px; }
.ff-match { min-width:0; }
.ff-match-image { display:block; position:relative; margin-bottom:18px; }
.ff-match-image img { width:100%; aspect-ratio:1; object-fit:cover; }
.ff-score { position:absolute; bottom:12px;left:12px; background:var(--cream);padding:6px 10px; font-size:10px; }
.ff-match-head { display:flex; justify-content:space-between;gap:16px; }
.ff-match h3 { font-size:13px;font-weight:500; }
.ff-match p { font-size:12px; margin:14px 0; }
.ff-match select { width:100%;border:0;border-bottom:1px solid #aaa;background:transparent;padding:10px 0;font:inherit;font-size:12px;border-radius:0; }
.ff-match-explanation { min-height:80px; color:#595750; }
.ff-match-actions { display:grid; grid-template-columns:1fr 1fr;gap:10px; }
.ff-match-actions .ff-button { padding:12px 10px; }
.ff-match-actions a { grid-column:1/-1; justify-self:start; }
.ff-secondary { background:transparent;color:var(--ink);border:1px solid var(--ink); }
.ff-secondary:hover { background:var(--ink);color:#fff; }
.ff-card-message { min-height:22px; }
.ff-scanner { position:fixed;inset:0;z-index:250; background:#101010;color:#fff;display:flex;flex-direction:column;
  padding:max(12px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));height:100dvh; }
.ff-camera-top { display:flex;align-items:center;justify-content:space-between;flex:none;width:100%;max-width:680px;margin:0 auto;font-size:11px;letter-spacing:.08em;min-height:46px; }
.ff-camera-top button { min-height:44px;padding:8px; }
.ff-camera-stage { position:relative; flex:1;min-height:180px;width:100%;max-width:580px;margin:8px auto;overflow:hidden; background:#181818; }
.ff-camera-media { position:absolute;inset:0;transform:scaleX(-1); }
.ff-camera-media video,.ff-camera-media canvas { position:absolute;inset:0;width:100%;height:100%;object-fit:contain; }
.ff-face-guide { position:absolute; width:56%;height:66%;max-width:290px;max-height:410px;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid #ffffff8c;border-radius:50%;pointer-events:none; }
.ff-face-guide.is-ready { border-color:#fff;border-width:2px; }
.ff-face-guide { overflow:hidden; }
.ff-scan-phase { position:absolute;top:16px;left:16px;right:16px;display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.05em;z-index:2; }
.ff-phase-dot { width:6px;height:6px;border-radius:50%;background:#fff;flex:none; }
.ff-scan-sweep { position:absolute;left:0;right:0;height:2px;top:12%;background:#d6e7ff;box-shadow:0 0 16px 3px #498fff70;opacity:0; }
.ff-scanner[data-evidence="true"] .ff-scan-sweep { opacity:.35; }
.ff-scanner[data-phase="scanning"] .ff-scan-sweep { opacity:1; }
.ff-scanner[data-phase="scanning"] .ff-face-guide { border-color:#91baff;box-shadow:0 0 24px #0943a72b; }
.ff-scanner[data-phase="scanning"] .ff-phase-dot { background:#91baff; }
.ff-progress-meta { display:flex;justify-content:space-between;gap:12px;font-size:10px;color:#d8d8d8;margin:5px 0 12px; }
#ffProgressValue { font-variant-numeric:tabular-nums; }
.ff-start-indicator,.ff-completion { position:absolute;inset:0;display:none;place-items:center;pointer-events:none; }
.ff-start-indicator { background:#10101090; }
.ff-scanner[data-phase="loading"] .ff-start-indicator,.ff-scanner[data-phase="complete"] .ff-completion { display:grid; }
.ff-start-indicator img { width:36px;height:36px;object-fit:contain;filter:brightness(0) invert(1); }
.ff-start-halo { position:absolute;width:84px;height:84px;border:1px solid #ffffff55;border-radius:50%; }
.ff-completion { background:#10101050; }
.ff-complete-ring { display:grid;place-items:center;width:88px;height:88px;border:1px solid #d5e4ff;border-radius:50%;background:#0943a7e6; }
.ff-complete-check { display:block;width:16px;height:29px;border:solid white;border-width:0 2px 2px 0;transform:translateY(-3px) rotate(45deg); }
.ff-scanner[data-phase="complete"] .ff-face-guide { opacity:0; }
.ff-scanner[data-phase="complete"] .ff-phase-dot { background:#91baff; }
.ff-camera-message { position:absolute;bottom:20px;left:12px;right:12px;text-align:center;font-size:12px;padding:12px;background:#111c; }
.ff-camera-bottom { width:100%;max-width:580px;margin:0 auto;flex:none;text-align:center; }
.ff-camera-bottom p { font-size:10px;color:#ccc;margin:10px auto; }
.ff-camera-bottom progress { width:100%;height:3px;accent-color:#fff;display:block; }
.ff-camera-bottom label { font-size:11px;display:flex;align-items:center;justify-content:center;gap:12px;margin:8px auto; }
.ff-camera-bottom input[type=range] { width:130px;accent-color:#fff; }
.ff-camera-bottom .ff-button { width:100%; }
.ff-try-purchase { width:100%;max-width:580px;margin:10px auto 0;flex:none;font-size:12px; }
.ff-try-heading,.ff-try-options { display:flex;align-items:center;gap:16px;justify-content:space-between; }
.ff-try-heading small { color:#bfcbe0;font-size:10px; }
.ff-try-options { margin-top:10px;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:12px; }
.ff-try-options label { display:flex;flex-direction:column;align-items:stretch;gap:4px;min-width:0;font-size:10px; }
.ff-try-options select { width:100%;min-width:0;min-height:44px;background:#191919;color:#fff;border:1px solid #777;padding:8px;font:inherit;font-size:12px; }
.ff-try-links { display:flex;justify-content:space-between;gap:12px;font-size:10px;margin:8px 0; }
.ff-try-links a { color:#fff;text-decoration:underline;flex-shrink:0; }
.ff-try-links span { color:#ccc; }
.ff-scanner { overflow-y:auto; }
.ff-offer{position:absolute;z-index:5;bottom:12px;left:12px;right:12px;max-width:460px;margin:auto;padding:24px;background:var(--cream);color:var(--ink);box-shadow:0 8px 36px #0004;text-align:left}.ff-offer h3{font-size:12px}.ff-offer p{font-size:11px;line-height:1.7;margin:12px 0}.ff-offer .ff-offer-amount{font-size:23px}.ff-offer button{margin:8px 12px 0 0}.ff-offer .ff-text-button{color:var(--ink)}
.ff-page .nav { background:var(--cream); }
@media(max-width:899px) { .ff-page .nav-right { gap:12px; } }
.ff-home-entry { display:flex;justify-content:space-between;gap:24px;align-items:center;margin-top:48px;margin-bottom:16px; }
.ff-home-entry p { font-size:11px; }
.ff-home-entry a { color:var(--cobalt);font-size:12px; }
@media(min-width:650px) { .ff-matches { grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 32px; } }
@media(min-width:1000px) { .ff-intro { grid-template-columns:1fr 1fr; gap:80px; }.ff-matches { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:649px) { .ff-editorial { order:-1; }.ff-editorial img { height:220px;aspect-ratio:16/9;object-position:center 28%; }.ff-intro { gap:28px; }.ff-main { padding-top:100px; }.ff-result-header { flex-direction:column; }.ff-result-header button { align-self:start; }.ff-home-entry { flex-direction:column;align-items:flex-start;gap:12px; } }
@media(prefers-reduced-motion:no-preference) { .ff-results { animation:ff-enter .45s ease both; } @keyframes ff-enter { from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;} } }
@media(prefers-reduced-motion:no-preference) {
  .ff-scanner { animation:ff-camera-open .25s ease-out both; }
  .ff-scanner[data-phase="loading"] .ff-start-halo { animation:ff-breathe 1.5s ease-in-out infinite; }
  .ff-scan-sweep { animation:ff-sweep 2.2s ease-in-out infinite alternate;animation-play-state:paused; }
  .ff-scanner[data-phase="scanning"] .ff-scan-sweep { animation-play-state:running; }
  .ff-scanner[data-phase="complete"] .ff-complete-ring { animation:ff-complete .4s ease-out both; }
  .ff-scanner[data-phase="scanning"] .ff-phase-dot { animation:ff-breathe 1.5s ease-in-out infinite; }
  @keyframes ff-camera-open { from{opacity:0;}to{opacity:1;} }
  @keyframes ff-breathe { 0%,100%{opacity:.5;transform:scale(.92);}50%{opacity:1;transform:scale(1);} }
  @keyframes ff-sweep { from{top:12%;}to{top:88%;} }
  @keyframes ff-complete { from{opacity:0;transform:scale(.86);}to{opacity:1;transform:scale(1);} }
}

/* ---------- THE LENS restyle: display type, mono for small print, brand cobalt ---------- */
.ff-main { padding-top: 48px; }
@media (min-width: 900px) { .ff-main { padding-top: 72px; } }
.ff-intro h1, .ff-result-header h2 {
  font-family: var(--display); font-weight: 800; letter-spacing: -0.02em; line-height: 0.95; text-transform: uppercase;
}
.ff-intro h1 { font-size: clamp(40px, 5.6vw, 84px); }
.ff-result-header h2 { font-size: clamp(36px, 5vw, 72px); }
.ff-eyebrow, .ff-privacy, .ff-consent, .ff-muted, .ff-details, .ff-editorial figcaption, .ff-pill, .ff-text-button { font-family: var(--mono); }
.ff-eyebrow { color: var(--ink-soft); font-size: 11px; }
.ff-subtitle { font-size: 16px; line-height: 1.6; }
.ff-button { font-family: var(--mono); font-size: 12px; letter-spacing: 0.14em; min-height: 52px; padding: 0 26px; background: var(--cobalt); }
.ff-button:hover { background: var(--cobalt-deep); }
.ff-report { border-color: var(--hairline); background: #fff; }
.ff-report h3 { font-family: var(--display); font-weight: 800; text-transform: uppercase; letter-spacing: -0.01em; }
