/* Final Bosu wallet pages: Memo skin laid over the 2022 build (CSS only, no JS changes).
   Tokens copied from Memo app/globals.css (dark mode). Loaded after the Next.js CSS in
   /wallet/index.html and /wallet/[id]/index.html. 2026-10-24. */

@font-face { font-family: "AKIRA Expanded"; src: url("/fonts/akira-expanded.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Cera Pro"; src: url("/fonts/cera-pro-regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Cera Pro"; src: url("/fonts/cera-pro-medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Cera Pro"; src: url("/fonts/cera-pro-bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  --fb-bg-page: #00002F;
  --fb-bg-surface: #1A1A44;
  --fb-bg-elevated: #252550;
  --fb-bg-sunken: #0D0D3D;
  --fb-border-subtle: #333359;
  --fb-border-default: #4D4D6D;
  --fb-text-primary: #F3F3F3;
  --fb-text-secondary: #9999AC;
  --fb-text-tertiary: #7A7A9A;
  --fb-text-faint: #6A6A8A;
  --fb-accent: #E51A4B;
  --fb-accent-hover: #C41640;
  --fb-font-body: "Cera Pro", "Montserrat", system-ui, sans-serif;
  --fb-font-display: "AKIRA Expanded", Arial, sans-serif;
  --fb-radius-md: 5px;
  --fb-tile-radius: 9px;
  --fb-radius-lg: 13px;
  --fb-shadow: 0 4px 4px -4px rgba(12, 12, 13, 0.05), 0 16px 16px -8px rgba(12, 12, 13, 0.1);
}
@supports (corner-shape: squircle) {
  :root { --fb-radius-md: 8px; --fb-tile-radius: 16px; --fb-radius-lg: 24px; }
  .Account_account__3xpyE, .Wallet_token__1DgeR, .Wallet_token__1DgeR img, .Wallet_token__1DgeR button,
  .Modal_wrapper__nlPob, .Modal_form__QAw2J button, .Button_button__sL3tD, .Table_tableContent__2frdK,
  .Table_tableContent__2frdK table tr { corner-shape: squircle; }
}

/* Page */
body { background-color: var(--fb-bg-page); font-family: var(--fb-font-body); color: var(--fb-text-primary); }
.Layout_main__3H6h1 { background: var(--fb-bg-page); color: var(--fb-text-primary); font-family: var(--fb-font-body); }
.Layout_backgroundBosu__3gR86 { background-image: none; }

/* Header: Memo's 72px bar */
.Layout_header__2M2F8 { height: 72px; padding: 0 40px; background-color: var(--fb-bg-page); border-bottom: 1px solid var(--fb-border-subtle); }
.Layout_logo__3lLpK { height: 31px; }
.Layout_menu__15Wzg a, .Layout_menu__15Wzg div { font-family: var(--fb-font-body); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--fb-text-faint); transition: color 200ms ease; }
.Layout_menu__15Wzg a { margin-right: 24px; }
.Layout_menu__15Wzg a:hover, .Layout_menu__15Wzg div:hover { color: var(--fb-text-tertiary) !important; }
.Layout_activeMenu__3aiuC { color: var(--fb-text-primary) !important; }
.Layout_menu__15Wzg .Layout_activeMenu__3aiuC:after { height: 4px; background-color: var(--fb-accent); bottom: auto; top: -26px; border-radius: 0 0 4px 4px; }
/* Minting is over: hide the old MINT link in both menus */
.Layout_menu__15Wzg a[href="/#mint"], .Layout_menuContent__3wyTT a[href="/#mint"] { display: none; }
.Layout_collapseContent__6tR2z { background-color: var(--fb-bg-sunken); border-bottom: 1px solid var(--fb-border-subtle); top: 72px; }
.Layout_menuContent__3wyTT a, .Layout_menuContent__3wyTT div { font-family: var(--fb-font-body); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--fb-text-primary); }
.Layout_hamburger__1_72e { filter: invert(1); }

/* CONNECT / account pill: Memo primary button */
.Account_account__3xpyE { display: inline-flex; align-items: center; height: 40px; padding: 0 24px; background: var(--fb-accent); border-radius: var(--fb-radius-lg); font-family: var(--fb-font-body); font-size: 13px; font-weight: 600; color: #fff; box-shadow: var(--fb-shadow); transition: background 150ms ease; }
.Account_account__3xpyE:hover { background: var(--fb-accent-hover); box-shadow: var(--fb-shadow); }
.Account_info__d96Gc { color: #fff; }

/* My Bosus */
.Wallet_tokensWrapper__v2r7F h1 { font-family: var(--fb-font-display); font-size: 28px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--fb-text-primary); margin-bottom: 32px; }
.Wallet_tokensList__1qrIO .Wallet_emptyToken__5X5mL { color: var(--fb-text-secondary); font-size: 16px; font-weight: 500; }
.Wallet_tokensList__1qrIO .Wallet_token__1DgeR { background: var(--fb-bg-surface); border: 1px solid var(--fb-border-subtle); border-radius: var(--fb-radius-lg); padding: 16px; box-shadow: var(--fb-shadow); }
.Wallet_tokensList__1qrIO .Wallet_token__1DgeR img { border-radius: var(--fb-tile-radius); }
.Wallet_tokensList__1qrIO .Wallet_token__1DgeR .Wallet_tokenId__3igtA { color: var(--fb-text-primary); font-size: 16px; font-weight: 700; margin-top: 12px; }
.Wallet_tokensList__1qrIO .Wallet_token__1DgeR button { width: 100%; height: 48px; background: var(--fb-accent); border-radius: var(--fb-radius-lg); font-family: var(--fb-font-body); font-size: 16px; font-weight: 500; color: #fff; cursor: pointer; transition: background 150ms ease; }
.Wallet_tokensList__1qrIO .Wallet_token__1DgeR button:hover { background: var(--fb-accent-hover); }
.Wallet_tokensList__1qrIO .Wallet_token__1DgeR button[disabled] { background-color: var(--fb-bg-elevated); color: var(--fb-text-faint); }

/* Shared buttons, modals, tables (upload flow) */
.Button_button__sL3tD, .Modal_form__QAw2J button { background: var(--fb-accent); border-radius: var(--fb-radius-lg); font-family: var(--fb-font-body); font-size: 16px; font-weight: 500; color: #fff; height: 48px; padding: 0 32px; cursor: pointer; transition: background 150ms ease; }
.Button_button__sL3tD:hover, .Modal_form__QAw2J button:hover { background: var(--fb-accent-hover); box-shadow: none; }
.Modal_overlay__3pBJU { background-color: rgba(0, 0, 47, 0.8); }
.Modal_wrapper__nlPob { background: var(--fb-bg-surface); border: 1px solid var(--fb-border-subtle); border-radius: var(--fb-radius-lg); color: var(--fb-text-primary); }
.Modal_formWrapper__2LPa9 .Modal_label__3QFN0, .Modal_formWrapper__2LPa9 .Modal_ethBalance__Yz2Z0, .Modal_formWrapper__2LPa9 .Modal_counter__3OlQZ .Modal_amount__GJGgO, .Modal_buyForm__2ZE_2 .Modal_quizText__116c8, .Modal_progressBar__4JULn .Modal_progressPercent__1lleL .Modal_label__3QFN0, .Modal_progressBar__4JULn .Modal_progressPercent__1lleL .Modal_percent__38VZe { color: var(--fb-text-primary); }
.Table_tableTitle__-nlLQ { color: var(--fb-text-secondary); }
.Table_tableContent__2frdK { background: var(--fb-bg-surface); border: 1px solid var(--fb-border-subtle); border-radius: var(--fb-radius-lg); }
.Table_table__2zsdR th { color: var(--fb-text-secondary); }
.Table_table__2zsdR td { color: var(--fb-text-primary); border-top-color: var(--fb-border-subtle); }
@media (max-width: 567px) {
  .Table_tableContent__2frdK table tr { background: var(--fb-bg-sunken); border-color: var(--fb-border-subtle); }
  .Table_tableContent__2frdK table td:not(:last-child) { border-bottom-color: var(--fb-border-subtle); }
}

/* Footer */
.Layout_socials__1RWmV svg path { fill: var(--fb-text-faint); }
.Layout_socials__1RWmV a:hover svg path { fill: var(--fb-text-primary); }
.Layout_copyRight__uCX_9 { color: var(--fb-text-faint); }
.Layout_scrollTop__3TwYU { background: var(--fb-bg-surface); border: 1px solid var(--fb-border-subtle); }

/* Fixes after the first preview */
.Account_account__3xpyE div { font-size: 13px; font-weight: 600; letter-spacing: 0.02em; }
/* The 2022 loading gif has a white box; invert it and screen it onto the navy page */
.Wallet_tokensWrapper__v2r7F > img, .Modal_loading__11xz8 img { filter: invert(1); mix-blend-mode: screen; }

/* Loading state: Memo has no spinner, it uses pulsing skeleton tiles (components/ui/skeleton.tsx).
   The old page renders one loading gif; turn it into three skeleton Bosu cards. */
@keyframes fb-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
.Wallet_tokensWrapper__v2r7F:has(> img[src*="loading.gif"]) { display: flex; flex-direction: row !important; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 24px; }
.Wallet_tokensWrapper__v2r7F:has(> img[src*="loading.gif"]) h1 { width: 100%; text-align: center; }
.Wallet_tokensWrapper__v2r7F > img[src*="loading.gif"],
.Wallet_tokensWrapper__v2r7F:has(> img[src*="loading.gif"])::before,
.Wallet_tokensWrapper__v2r7F:has(> img[src*="loading.gif"])::after {
  content: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
  display: block; width: 300px; height: 404px; box-sizing: border-box;
  background: var(--fb-bg-elevated); border: 1px solid var(--fb-border-subtle); border-radius: var(--fb-radius-lg);
  filter: none; mix-blend-mode: normal; animation: fb-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
.Wallet_tokensWrapper__v2r7F:has(> img[src*="loading.gif"])::after { animation-delay: 0.3s; }
.Wallet_tokensWrapper__v2r7F:has(> img[src*="loading.gif"])::before { animation-delay: -0.3s; }
@media (max-width: 700px) { .Wallet_tokensWrapper__v2r7F:has(> img[src*="loading.gif"])::before, .Wallet_tokensWrapper__v2r7F:has(> img[src*="loading.gif"])::after { display: none; } }
@media (prefers-reduced-motion: reduce) { .Wallet_tokensWrapper__v2r7F > img[src*="loading.gif"], .Wallet_tokensWrapper__v2r7F:has(> img[src*="loading.gif"])::before, .Wallet_tokensWrapper__v2r7F:has(> img[src*="loading.gif"])::after { animation: none; } }
.Wallet_tokensWrapper__v2r7F:has(> img[src*="loading.gif"]) h1 { order: -1; }
/* The old footer links to twitter.com/Finalbosudojo, which no longer exists (404 on 2026-10-24). Hide it; the Discord invite there still works. */
.Layout_socials__1RWmV a[href*="Finalbosudojo"] { display: none; }

/* Browsers that still hold the 2022 /logo.png in cache (nginx sends no Cache-Control): swap the header image to the FB mark SVG where `content` on img is supported. */
.Layout_logo__3lLpK { content: url("/images/brand/fb-logo.svg"); width: 48px; height: 31px; object-fit: contain; }