/* Deliberately scoped tokens prevent page themes and global button rules leaking in. */
.site-wallet-picker {
  --wallet-accent: #34d399;
  --wallet-ink: #effff4;
  --wallet-secondary: #b9e5c9;
  --wallet-line: #28543d;
  box-sizing: border-box;
  position: fixed;
  inset: 0;
  width: min(460px, calc(100% - 32px));
  max-width: none;
  height: fit-content;
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 0;
  overflow: hidden;
  color: var(--wallet-ink);
  background: radial-gradient(ellipse at 12% 0%, #234f36 0%, transparent 62%), #0d281c;
  border: 1px solid #3a7050;
  border-radius: 24px;
  box-shadow: 0 24px 80px #00150db3, inset 0 1px 0 #b0ffd52b;
  font: 400 14px/1.5 'Schibsted Grotesk', Sora, system-ui, sans-serif;
  text-align: left;
  color-scheme: dark;
  isolation: isolate;
}
.site-wallet-picker *, .site-wallet-picker *::before, .site-wallet-picker *::after { box-sizing: border-box; }
.site-wallet-picker[open] { display: flex; flex-direction: column; animation: wallet-enter 200ms ease-out; }
.site-wallet-picker [hidden] { display: none !important; }
.site-wallet-picker::backdrop { background: #00160ed6; backdrop-filter: blur(8px); animation: wallet-backdrop 200ms ease-out; }
.site-wallet-picker .wallet-header { flex: 0 0 auto; padding: 28px 28px 20px; }
.site-wallet-picker .wallet-eyebrow { margin: 0 48px 14px 0; color: var(--wallet-accent); font-size: 10px; font-weight: 600; letter-spacing: .16em; }
.site-wallet-picker h2 { margin: 0 0 8px; color: var(--wallet-ink); font: 600 30px/1.12 'Schibsted Grotesk', Sora, system-ui, sans-serif; letter-spacing: -.04em; overflow-wrap: anywhere; }
.site-wallet-picker .wallet-intro { margin: 0; color: var(--wallet-secondary); font-size: 13px; }
.site-wallet-picker .wallet-scroll { min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 0 20px 16px; scrollbar-width: thin; scrollbar-color: #5d9b74 #0d281c; }
.site-wallet-picker .wallet-group-title { margin: 14px 8px 6px; color: var(--wallet-secondary); font: 500 11px/1.5 'Schibsted Grotesk', Sora, system-ui, sans-serif; letter-spacing: .06em; }
.site-wallet-picker .wallet-group-title:first-child { margin-top: 0; }
.site-wallet-picker .wallet-options { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; }
.site-wallet-picker .wallet-option {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  width: 100%;
  min-width: 0;
  min-height: 60px;
  padding: 10px 12px;
  margin: 0;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: var(--wallet-ink);
  font: inherit;
  font-weight: 500;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: background-color 180ms ease-out, border-color 180ms ease-out, transform 180ms ease-out;
}
.site-wallet-picker .wallet-provider-icon { display: block; grid-column: 1; grid-row: 1; width: 36px; height: 36px; border-radius: 9px; object-fit: contain; }
.site-wallet-picker .wallet-provider-name { grid-column: 2; grid-row: 1; min-width: 0; overflow-wrap: anywhere; unicode-bidi: plaintext; }
.site-wallet-picker .wallet-provider-action { grid-column: 3; grid-row: 1; color: var(--wallet-accent); font-size: 11px; font-weight: 400; white-space: nowrap; }
.site-wallet-picker a.wallet-option .wallet-provider-action::after { content: ''; display: inline-block; width: 6px; height: 6px; margin: 0 2px 1px 7px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; }
.site-wallet-picker .wallet-icon-fallback { grid-column: 1; grid-row: 1; width: 30px; height: 24px; border: 1px solid var(--wallet-secondary); border-radius: 5px; position: relative; }
.site-wallet-picker .wallet-icon-fallback::after { content: ''; position: absolute; right: -2px; top: 7px; width: 10px; height: 8px; border: 1px solid var(--wallet-secondary); border-radius: 2px; background: #0d281c; }
.site-wallet-picker .wallet-setup-note { margin: 16px 8px 0; color: var(--wallet-secondary); font-size: 11px; line-height: 1.6; }
.site-wallet-picker .wallet-status { margin: 16px 8px 0; padding: 12px 0 0; border-top: 1px solid var(--wallet-line); color: var(--wallet-accent); font-size: 13px; overflow-wrap: anywhere; max-height: 6em; overflow: auto; }
.site-wallet-picker .wallet-status[data-state='error'] { color: #ffe3a3; }
.site-wallet-picker .wallet-footer { flex: 0 0 auto; padding: 16px 28px; border-top: 1px solid var(--wallet-line); color: var(--wallet-secondary); font-size: 11px; }
.site-wallet-picker .wallet-cancel { position: absolute; top: 12px; right: 12px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; margin: 0; border: 1px solid transparent; border-radius: 50%; background: transparent; color: var(--wallet-secondary); cursor: pointer; transition: background-color 180ms ease-out, transform 180ms ease-out; }
.site-wallet-picker .wallet-cancel::before, .site-wallet-picker .wallet-cancel::after { content: ''; position: absolute; width: 15px; height: 1px; background: currentColor; transform: rotate(45deg); }
.site-wallet-picker .wallet-cancel::after { transform: rotate(-45deg); }
@media (hover: hover) {
  .site-wallet-picker .wallet-option:hover:not(:disabled):not([aria-disabled='true']), .site-wallet-picker .wallet-cancel:hover { background: #234f36; border-color: #49835b; }
}
.site-wallet-picker .wallet-option:active:not(:disabled):not([aria-disabled='true']), .site-wallet-picker .wallet-cancel:active { background: #234f36; transform: scale(.985); }
.site-wallet-picker .wallet-option:focus-visible, .site-wallet-picker .wallet-cancel:focus-visible { outline: 2px solid var(--wallet-accent); outline-offset: 2px; }
.site-wallet-picker .wallet-option:disabled, .site-wallet-picker .wallet-option[aria-disabled='true'] { color: var(--wallet-secondary); cursor: not-allowed; }
.site-wallet-picker .wallet-option:disabled .wallet-provider-action, .site-wallet-picker .wallet-option[aria-disabled='true'] .wallet-provider-action { color: var(--wallet-secondary); }
.site-wallet-picker .wallet-option[data-connecting='true'] { background: #234f36; border-color: #49835b; cursor: wait; }
.site-wallet-picker .wallet-option[data-connecting='true'] .wallet-provider-action { color: var(--wallet-accent); }
[data-wallet-connect] { font: inherit; cursor: pointer; }
[data-wallet-connect]:focus-visible { outline: 2px solid #34d399; outline-offset: 3px; }
.home-wallet-connect { background: transparent; color: inherit; border: 1px solid currentColor; border-radius: 6px; padding: 9px 14px; margin-right: 12px; }
.wallet-account-link { font: inherit; font-size: 12px; color: inherit; margin-inline: 8px; overflow-wrap: anywhere; }
.wallet-account-link[hidden] { display: none; }
@keyframes wallet-enter { from { opacity: 0; transform: translateY(6px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes wallet-backdrop { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 480px) {
  .site-wallet-picker { border-radius: 20px; }
  .site-wallet-picker .wallet-header { padding: 24px 20px 16px; }
  .site-wallet-picker h2 { font-size: 27px; }
  .site-wallet-picker .wallet-scroll { padding: 0 12px 12px; }
  .site-wallet-picker .wallet-option { min-height: 56px; padding: 8px; gap: 10px; }
  .site-wallet-picker .wallet-footer { padding: 14px 20px; }
  .home-wallet-connect { padding: 8px; font-size: 12px; margin-right: 6px; }
}
@media (max-width: 380px) {
  .site-wallet-picker h2 { font-size: 25px; }
  .site-wallet-picker .wallet-option { grid-template-columns: 32px minmax(0, 1fr) auto; font-size: 13px; }
  .site-wallet-picker .wallet-provider-icon { width: 32px; height: 32px; }
  .site-wallet-picker .wallet-provider-action { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .site-wallet-picker[open], .site-wallet-picker::backdrop { animation: none; }
  .site-wallet-picker .wallet-option, .site-wallet-picker .wallet-cancel { transition: none; transform: none; }
}