html{background:var(--bg)}
body.first-run{margin:0;min-height:100vh;min-height:100dvh;background:var(--bg);color:var(--ink);font:var(--text-base)/1.5 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;align-items:center;padding:max(18px,env(safe-area-inset-top)) 16px calc(22px + env(safe-area-inset-bottom));background-image:radial-gradient(90% 52% at 50% -8%,color-mix(in oklch,var(--accent) 15%,transparent),transparent 72%);overflow-x:hidden}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{cursor:default;opacity:.55}
.fr-shell{width:100%;max-width:430px;margin:clamp(10px,4vh,40px) auto 0;min-width:0}
.fr-progress{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:0 4px 20px}
.fr-progress[hidden]{display:none}
.fr-progress span{height:3px;border-radius:99px;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-med) var(--ease-out),background var(--dur-fast) var(--ease-out)}
.fr-progress span.on{background:var(--accent);transform:scaleX(1)}
.fr-panel{width:100%;min-width:0;transform-origin:50% 16%}
.fr-panel[hidden]{display:none!important}
.fr-auth-card,.fr-card{position:relative;width:100%;background:color-mix(in oklch,var(--surface) 94%,transparent);border:1px solid var(--line);border-radius:var(--r-xl,20px);padding:24px 20px;box-shadow:0 24px 80px rgba(0,0,0,.24);min-width:0;overflow:hidden}
.fr-auth-card h1,.fr-card h1{margin:0;color:var(--ink);font-size:var(--text-xl);line-height:1.2;letter-spacing:-.02em;text-align:center}
.fr-card h1{text-align:left;font-size:var(--text-2xl)}
.fr-wordmark{text-align:center;font:850 var(--text-2xl)/1 "Space Grotesk",-apple-system,system-ui,sans-serif;letter-spacing:-.03em;margin-bottom:10px}
.fr-wordmark span{color:var(--accent);margin-left:2px}
.fr-auth-card>.fr-auth-note{margin:10px auto 0;text-align:center;max-width:320px}
.fr-auth-note,.fr-copy,.fr-meta{color:var(--ink-dim);font-size:var(--text-sm);line-height:1.55;overflow-wrap:anywhere}
.fr-auth-note strong{color:var(--ink)}
.fr-primary,.fr-secondary{width:100%;min-height:52px;border:1px solid transparent;border-radius:14px;font-weight:800;font-size:var(--text-base);margin-top:18px;padding:0 16px;transform:translateZ(0);transition:transform var(--dur-fast) var(--ease-out),background var(--dur-fast),border-color var(--dur-fast),box-shadow var(--dur-fast) var(--ease-out)}
.fr-primary{background:var(--accent);color:var(--accent-ink)}
.fr-secondary{background:transparent;color:var(--ink);border-color:var(--line-strong);min-height:46px;margin-top:10px}
.fr-primary:hover:not(:disabled){box-shadow:0 8px 28px color-mix(in oklch,var(--accent) 18%,transparent)}
.fr-primary:active,.fr-secondary:active{transform:translateZ(0) scale(.975)}
.fr-primary:focus-visible,.fr-secondary:focus-visible,.fr-secondary-link:focus-visible,.fr-text:focus-visible,.fr-choice:focus-visible,.fr-theme:focus-visible{outline:3px solid var(--accent-text);outline-offset:3px}
.fr-or{display:flex;align-items:center;gap:12px;color:var(--ink-faint);font-size:var(--text-xs);margin:16px 0}
.fr-or::before,.fr-or::after{content:"";height:1px;background:var(--line);flex:1}
.fr-email-form label,.fr-password-form label,.fr-field label{display:block;color:var(--ink-faint);font-size:var(--text-2xs);font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
.fr-password-form label:not(:first-child){margin-top:14px}
.fr-email-form input,.fr-password-form input,.fr-field input,.fr-totp-code{width:100%;min-height:48px;border:1px solid var(--line-strong);border-radius:14px;background:var(--surface-2);color:var(--ink);padding:0 14px;font-size:16px;outline:none;font-variant-numeric:tabular-nums}
.fr-email-form input:focus,.fr-password-form input:focus,.fr-field input:focus,.fr-totp-code:focus,.fr-otp input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint)}
.fr-password-toggle{display:block;margin:10px auto 0}
.fr-password-field{position:relative;min-width:0}
.fr-password-field input{padding-right:68px}
.fr-password-reveal{position:absolute;right:8px;top:50%;min-width:48px;min-height:40px;transform:translateY(-50%);border:0;border-radius:10px;background:transparent;color:var(--accent-text);font-weight:800}
.fr-password-reveal:focus-visible{outline:3px solid var(--accent-text);outline-offset:1px}
.fr-password-status:empty{display:none}
.fr-error{min-height:0;margin:12px 0 0;color:var(--neg);font-size:var(--text-sm);font-weight:700;text-align:center}
.fr-error:empty{display:none}
.fr-legal{margin:14px auto 0;max-width:330px;color:var(--ink-faint);font-size:var(--text-xs);line-height:1.5;text-align:center}
.fr-legal a{display:inline-flex;align-items:center;min-height:44px;color:var(--accent-text);font-weight:750;text-underline-offset:2px}
.fr-auth-card.has-error{border-color:color-mix(in oklch,var(--neg) 45%,var(--line))}
.fr-otp{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:22px 0 4px}
.fr-otp input{min-width:0;width:100%;height:48px;padding:0;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface-2);color:var(--ink);font-size:22px;font-weight:800;text-align:center;outline:none;font-variant-numeric:tabular-nums}
.fr-otp input[aria-invalid="true"]{border-color:var(--neg);box-shadow:0 0 0 2px color-mix(in oklch,var(--neg) 18%,transparent)}
.fr-inline-actions{display:flex;justify-content:center;gap:18px;margin-top:12px}
.fr-text{min-height:38px;border:0;background:transparent;color:var(--accent-text);font-weight:750;padding:4px}
.fr-dev-code{text-align:center;color:var(--warn);font-size:var(--text-xs);margin:8px 0 0}
.fr-eyebrow{margin:0 0 8px;color:var(--accent-text);font-size:var(--text-2xs);font-weight:850;letter-spacing:.11em;text-transform:uppercase}
.fr-copy{margin:10px 0 0}
.fr-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.fr-topline .fr-wordmark{margin:0;text-align:left;font-size:var(--text-lg)}
.fr-story{display:flex;flex-direction:column}
.fr-story .fr-card{min-height:min(590px,calc(100dvh - 150px));display:flex;flex-direction:column}
.fr-story-proof{margin-top:auto;padding-top:26px}
.fr-demo{border:1px solid var(--line);border-radius:16px;background:var(--surface-2);padding:16px;position:relative}
.fr-demo-chip{display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:99px;background:var(--info-tint);color:var(--info);font-size:var(--text-2xs);font-weight:850;letter-spacing:.06em;text-transform:uppercase}
.fr-demo-value{display:block;font:850 var(--text-3xl)/1 "Space Grotesk",system-ui,sans-serif;letter-spacing:-.04em;margin-top:10px;font-variant-numeric:tabular-nums}
.fr-story-controls{display:flex;gap:10px;margin-top:18px}
.fr-story-controls .fr-primary{margin:0}
.fr-trust-list{display:grid;gap:10px}
.fr-trust-row,.fr-value-row,.fr-setting-row{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:52px;border-bottom:1px solid var(--line);color:var(--ink)}
/* space-between is right for label↔value (.fr-value-row) and label↔control (.fr-setting-row), but a
   trust row is icon + sentence: the short row ("Can never move your money") got pushed to the far
   right while wrapping rows started right after the icon, so the check column didn't line up. */
.fr-trust-row{justify-content:flex-start}
.fr-trust-row:last-child,.fr-value-row:last-child,.fr-setting-row:last-child{border-bottom:0}
.fr-check{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--pos-tint);color:var(--pos);font-weight:900;flex:none}
.fr-choices{display:grid;gap:10px;margin-top:18px}
.fr-choice{display:flex;align-items:center;gap:12px;width:100%;min-height:54px;padding:0 14px;border-radius:14px;border:1px solid var(--line);background:var(--surface-2);color:var(--ink);font-weight:750;text-align:left;transform:translateZ(0);transition:transform var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),background var(--dur-fast) var(--ease-out)}
.fr-choice::after{content:"";width:18px;height:18px;border-radius:50%;border:1px solid var(--line-strong);margin-left:auto;flex:none}
.fr-choice:hover{transform:translate3d(2px,0,0)}
.fr-choice:active{transform:translateZ(0) scale(.985)}
.fr-choice.on{border-color:var(--accent);background:var(--accent-tint)}
.fr-choice.on::after{content:"✓";display:grid;place-items:center;background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-size:11px}
.fr-theme-row{display:flex;gap:10px;margin-top:8px}
.fr-theme{width:44px;height:34px;border-radius:10px;border:2px solid var(--line);background:#0b0d10;position:relative}
.fr-theme[data-theme="auto"]{background:linear-gradient(135deg,#0b0d10 0 50%,#f5f6f8 50% 100%)}
.fr-theme[data-theme="light"]{background:#f5f6f8}
.fr-theme[data-theme="high-contrast"]{background:linear-gradient(135deg,#000 0 50%,#fff 50%)}
.fr-theme.on{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint)}
.fr-toggle{width:42px;height:26px;border:0;border-radius:99px;background:var(--line-strong);padding:3px;flex:none}
.fr-toggle::after{content:"";display:block;width:20px;height:20px;border-radius:50%;background:var(--ink);transform:translateX(0);transition:transform var(--dur-fast)}
.fr-toggle[aria-pressed="true"]{background:var(--accent)}
.fr-toggle[aria-pressed="true"]::after{transform:translateX(16px);background:var(--accent-ink)}
.fr-setting-copy{min-width:0}
.fr-setting-copy strong{display:block;font-size:var(--text-sm)}
.fr-setting-copy span{display:block;color:var(--ink-dim);font-size:var(--text-xs);line-height:1.45;margin-top:2px}
.fr-money-preview{margin:12px 0;border-radius:14px;border:1px solid var(--line);padding:10px 14px;background:var(--surface-2)}
.fr-money-preview .fr-value-row{min-height:40px}
.fr-money-preview.is-blurred [data-money]{filter:blur(7px);user-select:none}
.fr-starter-card{margin:14px 0 0;padding:14px;border:1px solid var(--line);border-radius:15px;background:var(--surface-2);min-width:0}.fr-starter-card legend{padding:0 5px;color:var(--ink);font-size:var(--text-base);font-weight:850}.fr-starter-card p{margin:0 0 11px;color:var(--ink-dim);font-size:var(--text-xs)}.fr-starter-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.fr-starter-grid label{display:grid;gap:5px;color:var(--ink-faint);font-size:var(--text-2xs);font-weight:800}.fr-starter-grid input{width:100%;min-width:0;min-height:46px;padding:0 11px;border:1px solid var(--line-strong);border-radius:11px;background:var(--bg);color:var(--ink);font-size:16px}.fr-starter-grid input:focus{outline:2px solid var(--accent);outline-offset:1px}@media(max-width:520px){.fr-starter-grid{grid-template-columns:1fr}}
.fr-bullets{display:grid;gap:12px;margin:18px 0}
.fr-bullet{display:flex;align-items:flex-start;gap:12px;color:var(--ink);font-weight:700}
.fr-bullet::before{content:"✓";width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--accent-tint);color:var(--accent);flex:none}
.fr-bullet-body{display:flex;flex-direction:column;gap:3px;min-width:0;padding-top:1px}
.fr-bullet-body strong{font-weight:750;font-size:var(--text-sm);line-height:1.35}
.fr-bullet-state{color:var(--ink-dim);font-size:var(--text-xs);font-weight:600;line-height:1.4}
.fr-bullets--arriving .fr-bullet::before{content:"";width:14px;height:14px;border:2px solid var(--accent);background:transparent;color:transparent;margin-top:4px}
.fr-region{text-align:center;color:var(--ink-faint);font-size:var(--text-xs);margin-top:8px}
.fr-sync-list{display:grid;gap:10px;margin-top:18px}
.fr-sync-row{display:flex;align-items:center;gap:12px;min-height:56px;padding:0 12px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}
.fr-sync-avatar{width:34px;height:34px;border-radius:12px;background:oklch(68% .12 var(--source-hue,295)/.18);color:var(--accent-text);display:grid;place-items:center;font-weight:900}
.fr-sync-row strong{display:block}
.fr-sync-row span{display:block;color:var(--ink-dim);font-size:var(--text-xs)}
.fr-sync-state{margin-left:auto!important;color:var(--pos)!important;font-weight:800}
.fr-sync-row.is-landed{border-color:color-mix(in oklch,var(--pos) 32%,var(--line));background:linear-gradient(90deg,var(--pos-tint),var(--surface-2) 44%)}
.fr-sync-row.is-not-ready{border-color:color-mix(in oklch,var(--warn) 34%,var(--line));background:linear-gradient(90deg,var(--warn-tint),var(--surface-2) 44%)}
.fr-sync-state.is-not-ready{color:var(--warn)!important}
.fr-sync-proof{display:flex;align-items:flex-start;gap:12px;margin-top:14px;padding:14px;border:1px solid color-mix(in oklch,var(--pos) 35%,var(--line));border-radius:14px;background:var(--pos-tint)}
.fr-sync-proof strong{display:block;color:var(--ink)}
.fr-sync-proof p{margin:3px 0 6px;color:var(--ink-dim);font-size:var(--text-xs);line-height:1.45}
.fr-sync-proof a{display:inline-flex;min-height:44px;align-items:center;color:var(--accent-text);font-size:var(--text-xs);font-weight:850}
/* Reconciliation receipt (product law 5) — names every typed value kept or replaced by the connection.
   Neutral surface, not a celebration: it is a statement of record about the user's own inputs. */
.fr-reconcile{margin-top:12px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2,var(--surface))}
.fr-reconcile>strong{display:block;color:var(--ink);font-size:var(--text-base)}
.fr-reconcile>.fr-meta{margin:3px 0 8px}
.fr-reconcile .fr-value-row{min-height:44px;font-size:var(--text-sm)}
.fr-sync-recovery{margin-top:14px;padding:14px;border:1px solid color-mix(in oklch,var(--warn) 32%,var(--line));border-radius:14px;background:var(--warn-tint)}
.fr-sync-recovery>strong{display:block;color:var(--ink)}
.fr-sync-recovery>p{margin:5px 0 0;color:var(--ink-dim);font-size:var(--text-xs);line-height:1.5}
.fr-secondary-link{display:flex;align-items:center;justify-content:center;box-sizing:border-box;text-decoration:none}
.fr-sync-explore{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;margin-top:8px}
.fr-status{text-align:center;color:var(--ink-dim);font-size:var(--text-sm);margin-top:12px}
.fr-foot{text-align:center;color:var(--ink-faint);font-size:var(--text-2xs);margin-top:18px}
.fr-link{border:0;background:transparent;color:var(--accent-text);font:inherit;text-decoration:underline;cursor:pointer;padding:0}
.fr-save-status{position:fixed;z-index:4;top:max(12px,env(safe-area-inset-top));left:50%;display:flex;align-items:center;gap:8px;min-height:30px;padding:4px 10px;border:1px solid var(--line);border-radius:99px;background:color-mix(in oklch,var(--surface) 92%,transparent);box-shadow:0 8px 28px rgba(0,0,0,.18);color:var(--ink-dim);font-size:var(--text-xs);transform:translateX(-50%);backdrop-filter:blur(12px)}
.fr-save-status[hidden]{display:none}
.fr-save-status[data-state="saved"]{color:var(--pos)}
.fr-save-status[data-state="error"]{color:var(--neg);border-color:color-mix(in oklch,var(--neg) 35%,var(--line))}
.fr-save-status button{border:0;background:transparent;color:var(--accent-text);font-weight:800;padding:3px 4px}
.fr-enter--forward{animation:fr-panel-forward var(--dur-slow) var(--ease-out) both}
.fr-enter--back{animation:fr-panel-back var(--dur-base) var(--ease-out) both}
.fr-enter .fr-eyebrow,.fr-enter h1,.fr-enter .fr-copy,.fr-enter .fr-story-proof,.fr-enter .fr-choices,.fr-enter .fr-setting-row,.fr-enter .fr-bullets,.fr-enter .fr-primary,.fr-enter .fr-secondary{animation:fr-content-rise var(--dur-slow) var(--ease-out) both}
.fr-enter h1{animation-delay:45ms}.fr-enter .fr-copy,.fr-enter .fr-choices,.fr-enter .fr-bullets{animation-delay:60ms}.fr-enter .fr-story-proof,.fr-enter .fr-setting-row{animation-delay:90ms}.fr-enter .fr-primary,.fr-enter .fr-secondary{animation-delay:120ms}
@keyframes fr-panel-forward{from{opacity:0;transform:translate3d(18px,0,0) scale(.985)}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes fr-panel-back{from{opacity:0;transform:translate3d(-14px,0,0) scale(.99)}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes fr-content-rise{from{opacity:0;transform:translate3d(0,8px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media (max-width:380px){.fr-auth-card,.fr-card{padding:20px 16px}.fr-story .fr-card{min-height:min(540px,calc(100dvh - 132px))}.fr-otp{gap:5px}.fr-otp input{height:44px}.fr-inline-actions{gap:10px}}
@media (prefers-reduced-motion:reduce){.fr-progress span,.fr-toggle::after,.fr-primary,.fr-secondary,.fr-choice{transition:none!important}.fr-enter,.fr-enter *{animation:none!important}.fr-sync-row.is-landed{transition:none!important}}