/* Fable's own wallet card (fable-wallet-chooser.js): inside the welcome card (Continue with a wallet) and as the same centred
   card for Link wallet. Dark only; Fable's tokens (fable.css) with the welcome card's own colours as fallbacks. */
.fw-panel[data-view="wallet"]>:not(.fwc){display:none!important}
.fw-wallets.is-found img,.fw-wallets.is-found img:first-child{padding:0;background:#1b1815;object-fit:cover}
.fwc{text-align:left;color:#f4eee6;font-family:var(--sans,Arial,sans-serif)}
.fwc *{box-sizing:border-box;letter-spacing:0}
.fwc [hidden]{display:none!important}
.fwc button,.fwc a{font-family:inherit}
.fwc button:focus-visible,.fwc a:focus-visible{outline:2px solid #f1d3a1;outline-offset:3px}
.fwc-shell .fw-panel{padding-top:28px}
/* the head: back arrow, the ƒ, what this card does, close */
.fwc-head{display:grid;grid-template-columns:34px 34px minmax(0,1fr) 34px;align-items:start;gap:10px;margin:-10px -8px 18px -10px}
.fwc-head.no-back{grid-template-columns:34px minmax(0,1fr) 34px;margin-left:0}
.fwc-mark{display:block;width:34px;height:42px;object-fit:contain}
.fwc-title{padding-top:5px}
.fwc-title h2{margin:0;color:#f4eee6;font-size:20px;line-height:1.15;font-weight:780;overflow-wrap:anywhere;text-wrap:balance}
.fwc-title p{margin:4px 0 0;color:#c6b7a8;font-size:14px;line-height:1.4}
.fwc-icon-btn{display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:none;color:#a79786;cursor:pointer;align-self:start}
.fwc-icon-btn:hover{background:#ffffff0d;color:#fff}
.fwc-icon-btn svg{width:19px;height:19px}
.fwc-lab{margin:0 0 2px;font:600 11px/1 var(--mono,monospace);letter-spacing:.08em!important;text-transform:uppercase;color:var(--muted,#918375)}
.fwc-rows{display:flex;flex-direction:column;gap:9px}
/* one big row per wallet; the first one gold */
.fwc-row{display:grid;grid-template-columns:40px minmax(0,1fr) 18px;align-items:center;gap:13px;width:100%;min-height:66px;margin:0;padding:12px 14px;border:1px solid #3e2c1c;border-radius:14px;background:#18120e;color:#f3eadd;text-align:left;text-decoration:none;cursor:pointer}
.fwc-row:hover{border-color:#a17e53;background:#211912}
.fwc-row.is-pri{border-color:transparent;background:var(--brand-sheen-sm);color:var(--brand-ink,#fff4e2);box-shadow:var(--brand-bevel);text-shadow:var(--brand-ink-shadow)}
.fwc-row.is-pri:hover{background:var(--brand-sheen-sm-hover,var(--brand-sheen-sm))}
.fwc-row.is-dim{opacity:.35;pointer-events:none}
.fwc-row.fwc-qr{min-height:58px;border-style:dashed;background:transparent}
.fwc-row.fwc-qr .fwc-wi{width:32px;height:32px;margin-left:4px}
.fwc-rt{min-width:0}
.fwc-rt b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:17px;line-height:1.2;font-weight:750}
.fwc-rt small{display:block;margin-top:3px;font-size:13px;line-height:1.3;color:var(--muted,#918375)}
.fwc-row.is-pri .fwc-rt small{color:rgba(255,244,226,.82)}
.fwc-row>svg{width:18px;height:18px;opacity:.8}
/* the wallet's own picture; ring: waiting on the wallet, listen: listening to it, ok: done */
.fwc-wi{position:relative;display:inline-grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:#1b1815;color:#cfc2b5}
.fwc-wi img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.fwc-wi>svg{width:60%;height:60%}
.fwc-ring{position:absolute;inset:-3px;border-radius:50%;pointer-events:none}
.fwc-wi.is-wait .fwc-ring{border:2px solid rgba(218,162,100,.25);border-top-color:var(--brand-hi,#f8d49a);animation:fwc-spin .9s linear infinite}
.fwc-wi.is-listen .fwc-ring{box-shadow:0 0 0 0 rgba(248,212,154,.5);animation:fwc-listen 1.6s ease-out infinite}
.fwc-wi.is-ok .fwc-ring{border:2px solid var(--up,#4ade80)}
.fwc-or{display:flex;align-items:center;gap:12px;margin:16px 0 12px;color:#81705c;font:600 10px/1 var(--mono,monospace);text-transform:uppercase;letter-spacing:.06em!important}
.fwc-or::before,.fwc-or::after{content:"";height:1px;background:#3b2c1e;flex:1}
.fwc-note{margin:2px 0 0;color:#b5a48e;font-size:13.5px;line-height:1.45}
.fwc-msg{margin:0 0 14px;padding:10px 12px;border:1px solid var(--line-2,#40322a);border-radius:10px;background:var(--panel-2,#1c1512);color:#ebc995;font-size:13.5px;line-height:1.45}
/* progress: Connect -> Sign -> Checking -> Signed in, drawn in Fable's gold */
.fwc-prog{padding:14px;border:1px solid transparent;border-radius:14px;background:linear-gradient(var(--panel-2,#1c1512),var(--panel-2,#1c1512)) padding-box,var(--brand-outline) border-box}
.fwc-prog.is-error{border-color:var(--line-2,#40322a);background:var(--panel-2,#1c1512)}
.fwc-prog-h{display:flex;align-items:center;gap:12px}
.fwc-prog-h .fwc-wi{width:36px;height:36px}
.fwc-pt{flex:1;min-width:0}
.fwc-pt b{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:16px;line-height:1.25;font-weight:750;color:#f7efe6}
.fwc-pt small{display:block;margin-top:3px;font:500 12px/1.3 var(--mono,monospace);color:var(--muted,#918375)}
.fwc-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:14px 0 12px;padding:0;list-style:none}
.fwc-steps.is-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.fwc-steps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;line-height:1.2;font-weight:600;color:var(--muted,#918375);text-align:center}
.fwc-steps i{position:relative;z-index:1;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--line-2,#40322a);background:var(--panel,#140f0c)}
.fwc-steps i svg{width:13px;height:13px}
.fwc-steps li:not(:last-child)::after{content:"";position:absolute;top:11px;left:calc(50% + 14px);right:calc(-50% + 14px);height:1.5px;background:var(--line-2,#40322a)}
.fwc-steps li.done{color:#cfc2b5}
.fwc-steps li.done i{border-color:var(--up,#4ade80);background:var(--up,#4ade80);color:#06210f}
.fwc-steps li.done:not(:last-child)::after{background:color-mix(in srgb,var(--up,#4ade80) 60%,transparent)}
.fwc-steps li.now{color:#f7efe6}
.fwc-steps li.now i{border-color:var(--brand-hi,#f8d49a);box-shadow:0 0 0 4px rgba(248,212,154,.18)}
.fwc-hint{display:flex;align-items:flex-start;gap:9px;margin:0;font-size:14px;line-height:1.45;color:#cfc2b5}
.fwc-live .fwc-hint,.fwc-prog.is-error .fwc-hint{margin-top:10px}
.fwc-spin{flex:none;width:15px;height:15px;margin-top:2px;border-radius:50%;border:2px solid rgba(218,162,100,.28);border-top-color:var(--brand-hi,#f8d49a);animation:fwc-spin .8s linear infinite}
.fwc-public{margin:10px 0 0;font-size:12px;line-height:1.4;color:var(--muted,#918375)}
.fwc-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.fwc-acts.is-end{justify-content:flex-end}
.fwc-acts .fwc-btn.is-pri:last-child{margin-left:auto}
.fwc-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;margin:0;padding:0 12px;border:1px solid transparent;border-radius:10px;background:linear-gradient(var(--panel,#140f0c),var(--panel,#140f0c)) padding-box,var(--brand-outline) border-box;color:var(--brand-text-solid,#ebb97a);font-size:13.5px;line-height:1;font-weight:700;white-space:nowrap;cursor:pointer}
.fwc-btn:hover{color:var(--brand-hi,#f8d49a)}
.fwc-btn.is-pri{border:0;background:var(--brand-sheen-sm);color:var(--brand-ink,#fff4e2);box-shadow:var(--brand-bevel);text-shadow:var(--brand-ink-shadow)}
.fwc-btn.is-sm{min-height:32px;padding:0 11px;font-size:12.5px}
.fwc-btn:disabled{opacity:.45;cursor:default}
.fwc-link{flex:none;padding:4px 2px;border:0;background:none;color:var(--brand-text-solid,#ebb97a);font-size:13px;line-height:1.2;font-weight:650;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.fwc-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line,#2c221c)}
.fwc-foot p{margin:0;font-size:12.5px;line-height:1.45;color:var(--muted,#918375)}
.fwc-provider{flex:none}
/* linking: the count, the ticked addresses and every address the session saw */
.fwc-badge{padding:2px 8px;border-radius:999px;background:var(--brand-sheen-sm);color:var(--brand-ink,#fff4e2);box-shadow:var(--brand-bevel);font-size:11.5px;line-height:1.4;font-weight:750;text-shadow:var(--brand-ink-shadow);white-space:nowrap}
.fwc-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}
.fwc-chips em{display:inline-flex;align-items:center;gap:4px;padding:3px 8px 3px 6px;border-radius:999px;background:color-mix(in srgb,var(--up,#4ade80) 12%,transparent);font:600 11.5px/1.2 var(--mono,monospace);font-style:normal;color:var(--up,#4ade80)}
.fwc-chips svg{width:11px;height:11px}
.fwc-addrs{display:flex;flex-direction:column;gap:6px;max-height:240px;margin-top:12px;overflow:auto;scrollbar-width:thin}
.fwc-addr{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line,#2c221c);border-radius:11px;background:var(--panel-2,#1c1512)}
.fwc-addr .fwc-wi{width:30px;height:30px}
.fwc-addr-t{min-width:0}
.fwc-addr code{display:block;font:600 13px/1.2 var(--mono,monospace);color:#f7efe6}
.fwc-addr small{display:block;margin-top:2px;font-size:12px;line-height:1.35;color:var(--muted,#918375)}
.fwc-addr.is-linked small,.fwc-addr.is-already small{color:var(--up,#4ade80)}
.fwc-addr.is-pending small,.fwc-addr.is-checking small,.fwc-addr.is-queued small{color:var(--brand-hi,#f8d49a)}
.fwc-addr.is-other small{color:#b5a48e}
.fwc-addr.is-declined small,.fwc-addr.is-error small{color:var(--down,#f87171)}
@keyframes fwc-spin{to{transform:rotate(360deg)}}
@keyframes fwc-listen{0%{box-shadow:0 0 0 0 rgba(248,212,154,.5)}100%{box-shadow:0 0 0 10px rgba(248,212,154,0)}}
/* a phone: the same card, sized like a bottom sheet in the middle of the screen */
@media(max-width:520px){
  .fwc-head{grid-template-columns:32px minmax(0,1fr) 32px;gap:8px;margin:-12px -6px 16px -8px}
  .fwc-head.no-back{grid-template-columns:minmax(0,1fr) 32px;margin-left:0}
  .fwc-mark{display:none}
  .fwc-title{padding-top:3px}
  .fwc-title h2{font-size:20px}
  .fwc-title p{font-size:13px}
  .fwc-row{min-height:60px;padding:10px 12px;gap:11px;grid-template-columns:36px minmax(0,1fr) 16px}
  .fwc-wi{width:36px;height:36px}
  .fwc-rt b{font-size:16px}
  .fwc-rt small{font-size:12px}
  .fwc-hint{font-size:13px}
  .fwc-steps li{font-size:11px}
  .fwc-foot{flex-direction:column;align-items:flex-start;gap:10px}
  .fwc-acts .fwc-btn{flex:1 1 auto}
}
@media(max-height:600px){.fwc-head{margin-bottom:12px}.fwc-row{min-height:54px}.fwc-or{margin:12px 0 9px}.fwc-foot{margin-top:12px}}
@media(prefers-reduced-motion:reduce){.fwc-spin,.fwc-wi .fwc-ring{animation:none!important}}