/* ============================================================
   BITBI — Wallet styles
   Shared wallet trigger + overlay styles.
   ============================================================ */

@layer components {
    .wallet-nav__trigger,
    .wallet-nav__mobile-link,
    .wallet-nav__mobile-trigger,
    .wallet-modal__action,
    .wallet-modal__close,
    .wallet-modal__option,
    .wallet-modal__switch-btn {
        transition:
            transform 0.22s var(--ease-smooth),
            border-color 0.22s var(--ease-default),
            box-shadow 0.22s var(--ease-default),
            background-color 0.22s var(--ease-default),
            color 0.22s var(--ease-default),
            opacity 0.22s var(--ease-default);
    }

    .wallet-nav__mobile-copy {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.3rem;
    }

    .wallet-nav__trigger:hover,
    .wallet-nav__trigger:focus-visible {
        transform: translateY(-1px);
        border-color: rgba(0, 240, 255, 0.3);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.1),
            0 0 0 1px rgba(0, 240, 255, 0.12),
            0 10px 30px rgba(0, 0, 0, 0.32);
        outline: none;
    }

    .wallet-nav__trigger {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        min-inline-size: 4.75rem;
        min-block-size: 2.5rem;
        padding: var(--space-2) 0.95rem;
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.04);
        color: rgba(255, 255, 255, 0.86);
        font-size: 0.75rem;
        font-family: var(--font-mono);
        letter-spacing: 0.1em;
        text-transform: uppercase;
        cursor: pointer;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.05),
            0 8px 26px rgba(0, 0, 0, 0.24);
    }

    .wallet-nav__trigger[aria-expanded="true"] {
        border-color: rgba(0, 240, 255, 0.3);
        background: rgba(0, 240, 255, 0.08);
        color: rgba(255, 255, 255, 0.98);
    }

    .wallet-nav__trigger:focus-visible {
        background: rgba(0, 240, 255, 0.06);
    }

    .wallet-nav__trigger:disabled {
        cursor: progress;
    }

    .wallet-nav__status-dot,
    .wallet-nav__mobile-status {
        inline-size: 0.625rem;
        block-size: 0.625rem;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.25);
        box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.05);
        flex-shrink: 0;
    }

    .wallet-nav__status-dot.is-connected,
    .wallet-nav__mobile-status.is-connected {
        background: var(--color-success);
        box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.14);
    }

    .wallet-nav__status-dot.is-warning,
    .wallet-nav__mobile-status.is-warning {
        background: var(--color-gold);
        box-shadow: 0 0 0 3px rgba(255, 170, 0, 0.14);
    }

    .wallet-nav__status-dot.is-busy,
    .wallet-nav__mobile-status.is-busy {
        animation: walletPulse 1.2s ease-in-out infinite;
    }

    .wallet-nav__mobile-copy {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-start;
        min-width: 0;
    }

    .wallet-nav__label,
    .wallet-nav__mobile-label {
        font-size: 0.78rem;
        font-weight: 600;
        letter-spacing: 0.02em;
    }

    .wallet-nav__meta,
    .wallet-nav__mobile-meta {
        font-size: 0.625rem;
        font-family: var(--font-mono);
        color: rgba(0, 240, 255, 0.7);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-inline-size: 8.75rem;
    }

    .wallet-nav__meta.is-connected-address,
    .wallet-nav__mobile-meta.is-connected-address {
        color: rgba(134, 239, 172, 0.96);
        text-shadow:
            0 0 10px rgba(34, 197, 94, 0.18),
            0 0 20px rgba(34, 197, 94, 0.08);
    }

    .mobile-nav__section--wallet {
        padding-block-start: 0;
    }

    .wallet-nav__mobile-row {
        display: flex;
        align-items: stretch;
        gap: clamp(0.875rem, 4vw, 1.125rem);
        min-width: 0;
    }

    .wallet-nav__mobile-link {
        text-decoration: none;
        min-width: 0;
    }

    .wallet-nav__mobile-link {
        display: grid;
        flex: 1 1 auto;
        gap: 0.35rem;
        min-block-size: 44px;
        padding: 0;
        padding-inline-end: 0.5rem;
        appearance: none;
        border: 0;
        background: none;
        text-align: left;
        font: inherit;
        cursor: pointer;
    }

    .wallet-nav__mobile-trigger {
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        align-self: stretch;
        min-inline-size: 4.5rem;
        min-block-size: 44px;
        padding: 0.2rem 0 0.2rem 1rem;
        border: 0;
        border-inline-start: 1px solid rgba(255, 255, 255, 0.12);
        background: none;
        color: rgba(255, 255, 255, 0.5);
        font-family: var(--font-display);
        font-size: 1.125rem;
        font-weight: 700;
        line-height: 1.1;
        text-align: center;
        white-space: nowrap;
        cursor: pointer;
    }

    .wallet-nav__mobile-link:hover,
    .wallet-nav__mobile-link:focus-visible,
    .wallet-nav__mobile-trigger:hover,
    .wallet-nav__mobile-trigger:focus-visible {
        outline: none;
    }

    .wallet-nav__mobile-link .wallet-nav__mobile-label,
    .wallet-nav__mobile-trigger-label {
        font: inherit;
        color: inherit;
        transition: color 0.22s var(--ease-default);
    }

    .wallet-nav__mobile-link .wallet-nav__mobile-meta,
    .wallet-nav__mobile-meta {
        max-inline-size: none;
        font-size: 0.68rem;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .wallet-nav__mobile-link:hover .wallet-nav__mobile-meta,
    .wallet-nav__mobile-link:focus-visible .wallet-nav__mobile-meta,
    .wallet-nav__mobile-link.is-current .wallet-nav__mobile-meta {
        color: rgba(0, 240, 255, 0.72);
    }

    .wallet-nav__mobile-link.is-current .wallet-nav__mobile-label,
    .wallet-nav__mobile-trigger[aria-expanded="true"] .wallet-nav__mobile-trigger-label,
    .wallet-nav__mobile-trigger:hover .wallet-nav__mobile-trigger-label,
    .wallet-nav__mobile-trigger:focus-visible .wallet-nav__mobile-trigger-label {
        color: var(--color-cyan);
    }

    .wallet-nav__mobile-link.is-warning .wallet-nav__mobile-meta {
        color: rgba(255, 170, 0, 0.92);
    }

    .wallet-modal {
        position: fixed;
        inset: 0;
        z-index: 10020;
        display: flex;
        justify-content: flex-end;
        pointer-events: none;
    }

    .wallet-modal[hidden] {
        display: none !important;
    }

    .wallet-modal.is-open {
        pointer-events: auto;
    }

    .wallet-modal__backdrop {
        position: absolute;
        inset: 0;
        border: 0;
        padding: 0;
        background:
            radial-gradient(circle at top right, rgba(0, 240, 255, 0.08), transparent 30%),
            rgba(3, 6, 10, 0.72);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        opacity: 0;
        cursor: pointer;
        transition: opacity 0.24s var(--ease-default);
    }

    .wallet-modal.is-open .wallet-modal__backdrop {
        opacity: 1;
    }

    .wallet-modal__panel {
        position: relative;
        display: flex;
        flex-direction: column;
        inline-size: min(100vw, 26rem);
        block-size: 100%;
        padding: max(1.25rem, env(safe-area-inset-top)) 1rem max(1rem, env(safe-area-inset-bottom));
        border-inline-start: 1px solid rgba(255, 255, 255, 0.08);
        background:
            linear-gradient(180deg, rgba(18, 28, 40, 0.98), rgba(8, 12, 18, 0.98)),
            rgba(8, 12, 18, 0.98);
        box-shadow:
            inset 1px 0 0 rgba(255, 255, 255, 0.04),
            -24px 0 60px rgba(0, 0, 0, 0.38);
        transform: translateX(100%);
        opacity: 0;
        transition:
            transform 0.24s var(--ease-smooth),
            opacity 0.24s var(--ease-default);
        overflow-y: auto;
        overscroll-behavior-y: contain;
        -webkit-overflow-scrolling: touch;
    }

    .wallet-modal.is-open .wallet-modal__panel {
        transform: translateX(0);
        opacity: 1;
    }

    .wallet-modal__header {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1rem;
        padding: 0.5rem 0 1rem;
    }

    .wallet-modal__eyebrow {
        display: inline-block;
        font-size: 0.7rem;
        font-family: var(--font-mono);
        text-transform: uppercase;
        letter-spacing: 0.18em;
        color: rgba(0, 240, 255, 0.68);
        margin-block-end: 0.35rem;
    }

    .wallet-modal__title {
        margin: 0;
        font-family: var(--font-display);
        font-size: 1.7rem;
        color: rgba(255, 255, 255, 0.96);
    }

    .wallet-modal__desc {
        margin: 0.4rem 0 0;
        font-size: 0.875rem;
        color: rgba(255, 255, 255, 0.58);
        max-inline-size: 20rem;
    }

    .wallet-modal__close {
        inline-size: 2.25rem;
        block-size: 2.25rem;
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, 0.12);
        background: rgba(255, 255, 255, 0.04);
        color: rgba(255, 255, 255, 0.76);
        font-size: 1.4rem;
        line-height: 1;
        cursor: pointer;
        flex-shrink: 0;
    }

    .wallet-modal__close:hover,
    .wallet-modal__close:focus-visible {
        color: rgba(255, 255, 255, 1);
        border-color: rgba(0, 240, 255, 0.28);
        background: rgba(0, 240, 255, 0.08);
        outline: none;
    }

    .wallet-modal__body {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        overflow: visible;
        padding-inline-end: 0.125rem;
    }

    .wallet-modal__banner,
    .wallet-modal__connecting,
    .wallet-modal__details,
    .wallet-modal__empty,
    .wallet-modal__option,
    .wallet-modal__summary,
    .wallet-modal__warning {
        border: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: var(--radius-xl);
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02)),
            rgba(255, 255, 255, 0.03);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.04),
            0 18px 38px rgba(0, 0, 0, 0.18);
    }

    .wallet-modal__banner {
        padding: 0.85rem 0.95rem;
        font-size: 0.8125rem;
        line-height: 1.55;
    }

    .wallet-modal__banner--success {
        border-color: rgba(34, 197, 94, 0.24);
        color: rgba(220, 252, 231, 0.94);
    }

    .wallet-modal__banner--warning {
        border-color: rgba(255, 170, 0, 0.28);
        color: rgba(255, 231, 179, 0.96);
    }

    .wallet-modal__banner--error {
        border-color: rgba(239, 68, 68, 0.3);
        color: rgba(254, 226, 226, 0.96);
    }

    .wallet-modal__section-heading {
        display: flex;
        flex-direction: column;
        gap: 0.3rem;
    }

    .wallet-modal__section-title,
    .wallet-modal__connecting-title {
        margin: 0;
        font-size: 1rem;
        color: rgba(255, 255, 255, 0.94);
    }

    .wallet-modal__section-subtitle,
    .wallet-modal__connecting-copy,
    .wallet-modal__footnote,
    .wallet-modal__warning-copy {
        margin: 0;
        font-size: 0.82rem;
        line-height: 1.55;
        color: rgba(255, 255, 255, 0.58);
    }

    .wallet-modal__stack {
        display: flex;
        flex-direction: column;
        gap: 0.7rem;
    }

    .wallet-modal__mini-title {
        margin: 0;
        font-size: 0.8rem;
        font-family: var(--font-mono);
        text-transform: uppercase;
        letter-spacing: 0.12em;
        color: rgba(0, 240, 255, 0.72);
    }

    .wallet-modal__option {
        display: flex;
        align-items: center;
        gap: 0.9rem;
        inline-size: 100%;
        padding: 0.95rem 1rem;
        text-align: left;
        cursor: pointer;
        color: rgba(255, 255, 255, 0.92);
    }

    .wallet-modal__option:hover,
    .wallet-modal__option:focus-visible {
        transform: translateY(-1px);
        border-color: rgba(0, 240, 255, 0.22);
        outline: none;
    }

    .wallet-modal__option:disabled {
        cursor: not-allowed;
        opacity: 0.55;
        transform: none;
    }

    .wallet-modal__option-copy {
        display: flex;
        flex-direction: column;
        gap: 0.18rem;
        min-width: 0;
    }

    .wallet-modal__option-title,
    .wallet-modal__summary-name,
    .wallet-modal__empty-title,
    .wallet-modal__warning-title {
        font-size: 0.92rem;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.96);
    }

    .wallet-modal__option-meta,
    .wallet-modal__summary-address,
    .wallet-modal__empty-copy {
        font-size: 0.75rem;
        line-height: 1.45;
        color: rgba(255, 255, 255, 0.6);
    }

    .wallet-modal__option-meta,
    .wallet-modal__summary-address,
    .wallet-modal__detail-value,
    .wallet-modal__footnote,
    .wallet-modal__warning-copy {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .wallet-ui__provider-visual {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        border-radius: 999px;
        background:
            radial-gradient(circle at 30% 30%, rgba(0, 240, 255, 0.22), transparent 65%),
            rgba(255, 255, 255, 0.04);
        overflow: hidden;
    }

    .wallet-ui__provider-visual--sm {
        inline-size: 2.35rem;
        block-size: 2.35rem;
    }

    .wallet-ui__provider-visual--md {
        inline-size: 2.75rem;
        block-size: 2.75rem;
    }

    .wallet-ui__provider-visual--lg {
        inline-size: 3.15rem;
        block-size: 3.15rem;
    }

    .wallet-ui__provider-icon {
        inline-size: 100%;
        block-size: 100%;
        object-fit: cover;
        display: block;
    }

    .wallet-ui__provider-fallback {
        font-size: 0.95rem;
        font-family: var(--font-mono);
        color: rgba(255, 255, 255, 0.9);
    }

    .wallet-modal__connecting {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.85rem;
        padding: 1.1rem 1rem;
    }

    .wallet-modal__spinner {
        inline-size: 1.4rem;
        block-size: 1.4rem;
        border-radius: 999px;
        border: 2px solid rgba(0, 240, 255, 0.16);
        border-top-color: rgba(0, 240, 255, 0.9);
        animation: walletSpin 0.9s linear infinite;
    }

    .wallet-modal__summary {
        display: flex;
        align-items: center;
        gap: 0.95rem;
        padding: 1rem;
    }

    .wallet-modal__summary-copy {
        display: flex;
        flex-direction: column;
        gap: 0.25rem;
        min-width: 0;
    }

    .wallet-modal__summary-address {
        font-family: var(--font-mono);
        word-break: break-all;
    }

    .wallet-modal__details {
        display: flex;
        flex-direction: column;
        padding: 0.35rem 1rem;
    }

    .wallet-modal__detail-row {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1rem;
        padding: 0.8rem 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    }

    .wallet-modal__detail-row:last-child {
        border-bottom: 0;
    }

    .wallet-modal__detail-label {
        font-size: 0.74rem;
        font-family: var(--font-mono);
        text-transform: uppercase;
        letter-spacing: 0.08em;
        color: rgba(0, 240, 255, 0.66);
    }

    .wallet-modal__detail-value {
        font-size: 0.84rem;
        color: rgba(255, 255, 255, 0.9);
        text-align: right;
        word-break: break-word;
    }

    .wallet-modal__detail-row.is-warning .wallet-modal__detail-value {
        color: rgba(255, 170, 0, 0.95);
    }

    .wallet-modal__detail-row.is-error .wallet-modal__detail-value {
        color: rgba(248, 113, 113, 0.94);
    }

    .wallet-modal__action-row {
        display: flex;
        flex-wrap: wrap;
        gap: 0.65rem;
    }

    .wallet-modal__action,
    .wallet-modal__switch-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-inline-size: 8rem;
        padding: 0.8rem 1rem;
        border-radius: 999px;
        border: 1px solid rgba(0, 240, 255, 0.18);
        background:
            linear-gradient(180deg, rgba(0, 240, 255, 0.14), rgba(0, 240, 255, 0.08)),
            rgba(255, 255, 255, 0.04);
        color: rgba(255, 255, 255, 0.95);
        font-size: 0.78rem;
        font-family: var(--font-mono);
        text-decoration: none;
        cursor: pointer;
    }

    .wallet-modal__action--ghost {
        border-color: rgba(255, 255, 255, 0.12);
        background: rgba(255, 255, 255, 0.04);
        color: rgba(255, 255, 255, 0.82);
    }

    .wallet-modal__action:hover,
    .wallet-modal__action:focus-visible,
    .wallet-modal__switch-btn:hover,
    .wallet-modal__switch-btn:focus-visible {
        transform: translateY(-1px);
        border-color: rgba(0, 240, 255, 0.32);
        outline: none;
    }

    .wallet-modal__warning {
        display: flex;
        flex-direction: column;
        gap: 0.65rem;
        padding: 1rem;
        border-color: rgba(255, 170, 0, 0.24);
    }

    .wallet-modal__empty {
        display: flex;
        flex-direction: column;
        gap: 0.45rem;
        padding: 1rem;
    }

    .wallet-modal__footnote {
        padding-inline: 0.15rem;
    }

    .wallet-workspace {
        position: fixed;
        inset: 0;
        z-index: 10010;
        display: flex;
        align-items: center;
        justify-content: center;
        padding:
            max(1rem, env(safe-area-inset-top))
            max(1rem, env(safe-area-inset-right))
            max(1rem, env(safe-area-inset-bottom))
            max(1rem, env(safe-area-inset-left));
        pointer-events: none;
    }

    .wallet-workspace[hidden] {
        display: none !important;
    }

    .wallet-workspace.is-open {
        pointer-events: auto;
    }

    .wallet-workspace__backdrop {
        position: absolute;
        inset: 0;
        border: 0;
        padding: 0;
        background:
            radial-gradient(circle at top center, rgba(0, 240, 255, 0.08), transparent 34%),
            rgba(3, 6, 10, 0.78);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        opacity: 0;
        cursor: pointer;
        transition: opacity 0.24s var(--ease-default);
    }

    .wallet-workspace.is-open .wallet-workspace__backdrop {
        opacity: 1;
    }

    .wallet-workspace__panel {
        position: relative;
        inline-size: min(100%, 76rem);
        block-size: min(100%, 54rem);
        display: flex;
        flex-direction: column;
        gap: var(--space-4);
        padding: clamp(1.2rem, 2vw, 1.6rem);
        border: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: calc(var(--radius-2xl) + 0.1rem);
        background:
            linear-gradient(180deg, rgba(18, 28, 40, 0.98), rgba(8, 12, 18, 0.98)),
            rgba(8, 12, 18, 0.98);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.04),
            0 28px 72px rgba(0, 0, 0, 0.42);
        transform: translateY(1.5rem) scale(0.98);
        opacity: 0;
        transition:
            transform 0.24s var(--ease-smooth),
            opacity 0.24s var(--ease-default);
        overflow-y: auto;
        overscroll-behavior-y: contain;
        -webkit-overflow-scrolling: touch;
    }

    .wallet-workspace.is-open .wallet-workspace__panel {
        transform: translateY(0) scale(1);
        opacity: 1;
    }

    .wallet-workspace__hero {
        position: relative;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1rem;
        padding: 0.15rem 0 0;
    }

    .wallet-workspace__hero-copy {
        display: flex;
        flex-direction: column;
        gap: 0.2rem;
        min-width: 0;
    }

    .wallet-workspace__eyebrow {
        display: inline-flex;
        align-items: center;
        width: fit-content;
        padding: 0.38rem 0.76rem;
        border-radius: 999px;
        border: 1px solid rgba(0, 240, 255, 0.16);
        background: rgba(0, 240, 255, 0.08);
        color: rgba(0, 240, 255, 0.82);
        font-family: var(--font-mono);
        font-size: 0.67rem;
        font-weight: 700;
        letter-spacing: 0.12em;
        text-transform: uppercase;
    }

    .wallet-workspace__title {
        margin: 0;
        font-family: var(--font-display);
        font-size: clamp(1.9rem, 3vw, 2.6rem);
        color: rgba(255, 255, 255, 0.96);
    }

    .wallet-workspace__close {
        inline-size: 2.5rem;
        block-size: 2.5rem;
        flex-shrink: 0;
        appearance: none;
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.04);
        color: rgba(255, 255, 255, 0.76);
        font-size: 1.45rem;
        line-height: 1;
        cursor: pointer;
        transition:
            transform 0.22s var(--ease-default),
            border-color 0.22s var(--ease-default),
            background-color 0.22s var(--ease-default),
            color 0.22s var(--ease-default);
    }

    .wallet-workspace__close:hover,
    .wallet-workspace__close:focus-visible {
        transform: translateY(-1px);
        border-color: rgba(0, 240, 255, 0.28);
        background: rgba(0, 240, 255, 0.08);
        color: rgba(255, 255, 255, 0.96);
        outline: none;
    }

    .wallet-workspace__body {
        min-width: 0;
    }

    @media (max-width: 1023px) {
        .wallet-nav__trigger {
            display: none;
        }

        .wallet-modal {
            align-items: stretch;
            justify-content: flex-end;
        }

        .wallet-modal__panel {
            inline-size: 100%;
            block-size: 100%;
            max-inline-size: none;
            padding: 0;
            border-inline-start: 0;
            border-top: 0;
            border-radius: 0;
            background: #0a0a0a;
            transform: translateX(100%);
            box-shadow: none;
            overflow-y: auto;
            overscroll-behavior-y: contain;
        }

        .wallet-modal.is-open .wallet-modal__panel {
            transform: translateX(0);
        }

        .wallet-modal__header {
            position: relative;
            padding:
                calc(5rem + env(safe-area-inset-top, 0px))
                var(--space-6)
                0;
        }

        .wallet-modal__close {
            position: absolute;
            inset-block-start: calc(var(--space-5) + env(safe-area-inset-top, 0px));
            inset-inline-end: var(--space-5);
            border: 0;
            background: none;
            font-size: 1.75rem;
            color: var(--color-cyan);
            text-shadow: 0 0 8px rgba(0, 240, 255, 0.6), 0 0 20px rgba(239, 68, 68, 0.4);
        }

        .wallet-modal__close:hover,
        .wallet-modal__close:focus-visible {
            background: none;
            border: 0;
            color: var(--color-white);
            text-shadow: 0 0 12px rgba(0, 240, 255, 0.8), 0 0 28px rgba(239, 68, 68, 0.6);
        }

        .wallet-modal__title {
            font-size: clamp(1.9rem, 8vw, 2.5rem);
        }

        .wallet-modal__desc {
            max-inline-size: 24rem;
        }

        .wallet-modal__body {
            gap: 0;
            padding:
                var(--space-5)
                var(--space-6)
                calc(var(--space-6) + env(safe-area-inset-bottom, 0px));
            padding-inline-end: var(--space-6);
        }

        .wallet-modal__body > * {
            margin: 0 0 var(--space-5);
            padding-block-end: var(--space-5);
            border-bottom: 1px solid rgba(255, 255, 255, 0.06);
        }

        .wallet-modal__body > *:last-child {
            margin-bottom: 0;
            padding-bottom: 0;
            border-bottom: 0;
        }

        .wallet-modal__banner,
        .wallet-modal__connecting,
        .wallet-modal__details,
        .wallet-modal__empty,
        .wallet-modal__option,
        .wallet-modal__summary,
        .wallet-modal__warning {
            border: 0;
            border-radius: 0;
            background: none;
            box-shadow: none;
        }

        .wallet-modal__summary,
        .wallet-modal__details,
        .wallet-modal__empty,
        .wallet-modal__warning,
        .wallet-modal__connecting {
            padding: 0;
        }

        .wallet-modal__details {
            gap: 0;
        }

        .wallet-modal__detail-row {
            padding-inline: 0;
        }

        .wallet-modal__stack {
            gap: var(--space-3);
        }

        .wallet-modal__mini-title,
        .wallet-modal__section-title {
            font-family: var(--font-mono);
            text-transform: uppercase;
            letter-spacing: 0.1em;
        }

        .wallet-modal__mini-title {
            font-size: 11px;
            color: rgba(0, 240, 255, 0.4);
        }

        .wallet-modal__section-title,
        .wallet-modal__connecting-title {
            font-size: 1rem;
        }

        .wallet-modal__option {
            gap: 0.7rem;
            padding: 0;
            color: rgba(255, 255, 255, 0.86);
        }

        .wallet-modal__option:hover,
        .wallet-modal__option:focus-visible {
            transform: none;
            border-color: transparent;
        }

        .wallet-modal__option-title {
            font-size: 1.35rem;
            font-family: var(--font-display);
            font-weight: 700;
            color: rgba(255, 255, 255, 0.86);
        }

        .wallet-modal__option-meta {
            font-size: 0.76rem;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: rgba(255, 255, 255, 0.42);
        }

        .wallet-modal__summary-name {
            font-size: 1.1rem;
            font-family: var(--font-display);
        }

        .wallet-modal__action-row {
            flex-direction: column;
        }

        .wallet-modal__action,
        .wallet-modal__switch-btn {
            inline-size: 100%;
        }

        .wallet-workspace {
            padding: 0;
        }

        .wallet-workspace__panel {
            inline-size: 100%;
            block-size: 100%;
            max-inline-size: none;
            gap: 0;
            padding:
                calc(5rem + env(safe-area-inset-top, 0px))
                var(--space-6)
                calc(var(--space-6) + env(safe-area-inset-bottom, 0px));
            border: 0;
            border-radius: 0;
            background: #0a0a0a;
            box-shadow: none;
            transform: translateX(100%);
        }

        .wallet-workspace.is-open .wallet-workspace__panel {
            transform: translateX(0);
        }

        .wallet-workspace__hero {
            padding: 0 0 var(--space-3);
        }

        .wallet-workspace__eyebrow {
            font-size: 0.62rem;
        }

        .wallet-workspace__title {
            font-size: clamp(1.9rem, 8vw, 2.5rem);
        }

        .wallet-workspace__close {
            position: absolute;
            inset-block-start: calc(-1 * (4rem + env(safe-area-inset-top, 0px)));
            inset-inline-end: 0;
            border: 0;
            background: none;
            font-size: 1.75rem;
            color: var(--color-cyan);
            text-shadow: 0 0 8px rgba(0, 240, 255, 0.6), 0 0 20px rgba(239, 68, 68, 0.4);
        }

        .wallet-workspace__close:hover,
        .wallet-workspace__close:focus-visible {
            background: none;
            border: 0;
            color: var(--color-white);
            text-shadow: 0 0 12px rgba(0, 240, 255, 0.8), 0 0 28px rgba(239, 68, 68, 0.6);
        }
    }

    @media (min-width: 1024px) {
        .mobile-nav__section--wallet {
            display: none;
        }
    }

    @keyframes walletSpin {
        from { transform: rotate(0deg); }
        to { transform: rotate(360deg); }
    }

    @keyframes walletPulse {
        0%, 100% { transform: scale(1); opacity: 1; }
        50% { transform: scale(0.8); opacity: 0.65; }
    }
}