.phone-shell:has(.fenni-wallet) { background: #0b111e; }
.app-screen:has(.fenni-wallet) { background: #0b111e; }
.app-screen:has(.fenni-wallet) > .top-brand { display: none; }
.app-screen:has(.fenni-wallet) .bottom-nav { background: #111a2b; border-color: #283753; }
.app-screen:has(.fenni-wallet) .bottom-nav button { color: #a9b8d1; }
.app-screen:has(.fenni-wallet) .bottom-nav button.active { color: #fff; }
.fenni-wallet { min-height: calc(100vh - 80px); padding: 28px 20px 44px; color: #edf3ff; background: radial-gradient(circle at 74% 0%, #1b2851 0, transparent 34%), #0b111e; }
.fenni-wallet button { color: inherit; }
.fw-heading { display: flex; align-items: center; gap: 14px; margin: 0 0 24px; }
.fw-mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: linear-gradient(135deg,#36c7ee,#5269e9 65%,#9471e4); color: #fff; font-size: 26px; font-weight: 900; font-style: italic; }
.fw-eyebrow { color: #8095bb; font-size: 10px; letter-spacing: .16em; font-weight: 800; }
.fw-heading h1 { margin: 1px 0 0; font-size: clamp(24px, 3vw, 33px); line-height: 1.1; }
.fw-heading p { margin: 5px 0 0; color: #9eacc6; font-size: 13px; }
.fw-home-grid, .fw-subpage-grid { display: grid; gap: 20px; }
.fw-balance-card, .fw-panel { border: 1px solid #263658; border-radius: 20px; background: linear-gradient(145deg,rgba(34,49,78,.89),rgba(17,26,44,.94)); box-shadow: 0 18px 40px rgba(0,0,0,.14); }
.fw-balance-card { position: relative; overflow: hidden; min-height: 210px; padding: 23px; border-color: #394e93; background: radial-gradient(circle at 90% 100%,rgba(80,86,204,.37),transparent 45%),linear-gradient(135deg,#1d3054,#161d39 60%,#12172b); }
.fw-balance-card::after { content: ""; position: absolute; right: -20px; bottom: 30px; width: 175px; height: 70px; opacity: .36; background: linear-gradient(135deg,transparent 35%,#6487ff 36%,transparent 38%,transparent 52%,#7487ef 53%,transparent 55%); transform: skewY(-12deg); pointer-events: none; }
.fw-balance-top { display: flex; align-items: center; justify-content: space-between; color: #c4d2ef; font-size: 15px; }
.fw-balance-top small { font-size: 11px; color: #91a6cd; }
.fw-balance-top button { border: 1px solid #455a8c; border-radius: 50%; width: 32px; height: 32px; background: #273862; font-size: 18px; }
.fw-balance-card > strong { display: block; margin: 14px 0 6px; font-size: clamp(32px, 5vw, 43px); letter-spacing: -.04em; }
.fw-balance-note { color: #55d8ad; font-size: 13px; font-weight: 700; }
.fw-balance-note span { float: right; color: #b9c9e8; }
.fw-balance-card p { position: relative; z-index: 1; margin: 25px -23px -23px; padding: 12px 23px; border-top: 1px solid #354770; background: rgba(18,27,51,.48); color: #aebcda; text-align: center; font-size: 11px; }
.fw-actions { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; margin: 17px 0 20px; }
.fw-action { display: flex; flex-direction: column; align-items: center; min-height: 113px; padding: 12px 4px; border: 1px solid #283853; border-radius: 16px; background: linear-gradient(145deg,#1b2a46,#141d31); text-align: center; }
.fw-action:hover,.fw-action:focus-visible,.fw-mode:hover,.fw-method:hover,.fw-asset-row:hover { border-color: #687ff7; outline: none; }
.fw-action-icon { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 9px; border-radius: 13px; font-size: 27px; font-weight: 700; line-height: 1; }
.fw-action-icon.buy { background: linear-gradient(135deg,#52debe,#16b783); }
.fw-action-icon.sell { background: linear-gradient(135deg,#ff7e90,#e84060); }
.fw-action-icon.deposit { background: linear-gradient(135deg,#59bdff,#316dde); font-size: 22px; }
.fw-action-icon.withdraw { background: linear-gradient(135deg,#849fff,#5459d6); }
.fw-action strong { font-size: 12px; white-space: nowrap; }
.fw-action small { margin-top: 5px; color: #9ba9c3; font-size: 10px; line-height: 1.2; }
.fw-panel { padding: 18px; }
.fw-section-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.fw-section-head h2,.fw-panel h2 { margin: 0; font-size: 18px; }
.fw-section-head span,.fw-panel small,.fw-muted,.fw-footnote { color: #9aabc8; font-size: 12px; }
.fw-asset-list { display: grid; gap: 7px; }
.fw-asset-row { display: grid; grid-template-columns: 42px minmax(0,1fr) auto 12px; align-items: center; gap: 10px; width: 100%; min-height: 66px; padding: 9px 11px; border: 1px solid #27354f; border-radius: 14px; background: rgba(11,18,32,.5); text-align: left; }
.fw-token { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; color: #fff; font-size: 25px; font-weight: 700; }
.fw-token.btc { background: #f7981b; }.fw-token.eth { background: #696ed5; }.fw-token.usdc { background: transparent; }.fw-token img { display: block; width: 100%; height: 100%; object-fit: contain; }.fw-token.cash { background: #24ad8a; }
.fw-asset-name,.fw-asset-values { display: grid; gap: 3px; }
.fw-asset-name strong,.fw-asset-values strong { font-size: 13px; }
.fw-asset-values { text-align: right; }.fw-asset-values small { font-size: 10px; }
.fw-change.positive { color: #58d6a7; }.fw-change.negative { color: #fb7185; }.fw-change.neutral { color: #aebed9; }
.fw-chevron { color: #95a7c7; font-size: 23px; }
.fw-footnote { margin: 13px 2px 0; line-height: 1.4; }
.fw-activity { margin-top: 17px; }.fw-activity-row { display: flex; justify-content: space-between; gap: 12px; padding: 11px 0; border-top: 1px solid #31415b; font-size: 12px; }
.fw-activity-row strong { white-space: nowrap; }.fw-activity .fw-muted { margin-bottom: 0; }
.fw-back { margin: 0 0 18px; padding: 0; border: 0; background: transparent; color: #b7c8e8; font-size: 22px; }.fw-back span { font-size: 13px; vertical-align: 2px; }
.fw-subpage .fw-heading { margin-bottom: 20px; }
.fw-subpage .fw-panel { padding: 24px; }.fw-panel h3 { margin: 17px 0 12px; font-size: 14px; }.fw-panel p { color: #bac8de; line-height: 1.55; font-size: 13px; }
.fw-deposit-intro { display: grid; justify-items: center; gap: 7px; margin: 5px 0 24px; text-align: center; }.fw-deposit-intro h2 { margin: 8px 0 3px; }.fw-deposit-intro span:not(.fw-round-icon) { color: #a6b4cd; font-size: 13px; }.fw-deposit-intro strong { font-size: 32px; }
.fw-round-icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: linear-gradient(135deg,#356ad8,#2738a2); color: white; font-size: 24px; }
.fw-method-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.fw-method { display: flex; align-items: center; gap: 10px; min-height: 62px; padding: 12px; border: 1px solid #344664; border-radius: 14px; background: #17243e; text-align: left; font-size: 17px; }.fw-method span { font-size: 12px; font-weight: 700; }.fw-method.selected,.fw-mode.selected { border-color: #627dff; background: #253765; }
.fw-info { padding: 15px; border: 1px solid #3556ac; border-radius: 14px; background: #17274c; color: #c8d8fb !important; }
.fw-receiving h3 { margin-top: 0; }.fw-receiving h3 small { font-weight: 400; }.fw-bank-fields { display: grid; gap: 0; margin: 15px 0 21px; }.fw-bank-fields > div { display: flex; justify-content: space-between; gap: 10px; padding: 12px 0; border-bottom: 1px solid #33425b; font-size: 12px; }.fw-bank-fields span { color: #a7b8d4; }.fw-bank-fields strong { filter: blur(3px); user-select: none; letter-spacing: .13em; }
.fw-primary { width: 100%; margin-top: 8px; padding: 14px 18px; border: 0; border-radius: 13px; background: linear-gradient(100deg,#635ee0,#3c66dd); color: #fff; font-weight: 700; }
.fw-mode-list { display: grid; gap: 10px; margin-top: 20px; }.fw-mode { display: flex; align-items: center; gap: 14px; padding: 14px; border: 1px solid #33445f; border-radius: 15px; background: #142139; text-align: left; }.fw-mode .fw-round-icon { width: 40px; height: 40px; font-size: 19px; }.fw-mode span:nth-child(2) { display: grid; gap: 4px; flex: 1; }.fw-mode strong { font-size: 14px; }.fw-mode small { font-size: 11px; }.fw-mode b { color: #9eafcc; font-size: 22px; }
.fw-trade-panel { max-width: 620px; }.fw-trade-panel .fw-round-icon,.fw-trade-panel .fw-token { margin-bottom: 18px; }.fw-trade-panel h2 small { margin-left: 6px; font-weight: 400; }
.fw-trade-path { display: grid; gap: 8px; margin-bottom: 18px; }.fw-trade-path > span { display: grid; gap: 5px; padding: 14px 16px; border: 1px solid #344766; border-radius: 14px; background: #14223b; color: #8fa5cc; font-size: 11px; letter-spacing: .09em; }.fw-trade-path strong { color: #edf3ff; font-size: 16px; letter-spacing: 0; }.fw-trade-path small { letter-spacing: 0; }.fw-trade-path > b { color: #778def; text-align: center; font-size: 22px; }
.fw-trade-panel .fw-method-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fw-trade-panel .fw-method { flex-direction: column; justify-content: center; min-height: 83px; gap: 6px; padding: 8px 3px; text-align: center; }.fw-trade-panel .fw-method .fw-token { width: 34px; height: 34px; margin: 0; flex: none; font-size: 20px; }.fw-trade-panel .fw-method > span:last-child { font-size: 11px; line-height: 1.2; }
.fw-sell-mode { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 18px; }.fw-sell-mode button { min-height: 40px; border: 1px solid #344664; border-radius: 10px; background: #17243e; color: #d9e4f9; font-size: 12px; font-weight: 700; cursor: pointer; }.fw-sell-mode button.selected { border-color: #627dff; background: #253765; color: #fff; }
.fw-trade-label { display: block; margin: 22px 0 8px; color: #d9e4f9; font-size: 13px; font-weight: 700; }.fw-trade-input { width: 100%; padding: 14px; border: 1px solid #395072; border-radius: 12px; background: #101d33; color: #edf3ff; }.fw-trade-input:disabled { opacity: .55; cursor: not-allowed; }.fw-trade-panel .fw-info { margin: 18px 0 10px; }.fw-primary:disabled { opacity: .55; cursor: not-allowed; }
.fw-trade-explain { max-width: 620px; }.fw-trade-explain h2 { margin-bottom: 12px; }
.fw-crypto-form .fw-withdraw-form { max-width: 700px; padding: 24px; border: 1px solid #263658; border-radius: 20px; background: linear-gradient(145deg,#22314e,#111a2c); box-shadow: none; }
.fw-crypto-form .section-title { color: #edf3ff; }.fw-crypto-form .section-title:first-child { margin-top: 0; }
.fw-crypto-form .withdraw-summary,.fw-crypto-form .withdraw-bound { border-color: #344766; background: #17243c; color: #edf3ff; }
.fw-crypto-form .withdraw-summary span,.fw-crypto-form .withdraw-bound span,.fw-crypto-form .list-row small { color: #aebed9; }
.fw-crypto-form .form-stack input,.fw-crypto-form .form-stack select { border-color: #395072; background: #101d33; color: #edf3ff; }
.fw-crypto-form .form-stack input::placeholder { color: #8fa1bf; }
.fw-crypto-form .auth-button.black { background: #2a3b5a; }.fw-crypto-form .auth-button.gold { background: linear-gradient(100deg,#635ee0,#3c66dd); color: #fff; }
.fw-crypto-form .list-row { border-color: #344766; }.fw-crypto-form .muted { color: #aebed9; }
.fw-reserve-card { margin-top: 0; border-color: #385189; background: linear-gradient(145deg,#1b3055,#14213a); }
.fw-text-button { padding: 3px 0; border: 0; background: none; color: #bcd3ff !important; font-size: 12px; cursor: pointer; }
.fw-reserve-total { display: grid; gap: 4px; margin: 14px 0 17px; }
.fw-reserve-total > strong { font-size: clamp(25px,4vw,35px); letter-spacing: -.04em; }
.fw-reserve-total > span { color: #bac9e3; font-size: 12px; }
.fw-reserve-total > small { color: #59d5ae; font-size: 11px; }
.fw-reserve-list { display: grid; gap: 7px; }
.fw-reserve-row { display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: 10px; min-height: 64px; padding: 9px; border: 1px solid #2d4165; border-radius: 14px; background: #111e34; }
.fw-reserve-name,.fw-reserve-value { display: grid; gap: 3px; min-width: 0; }.fw-reserve-name strong,.fw-reserve-value strong { font-size: 12px; }.fw-reserve-name small,.fw-reserve-value small { color: #a9bddb; font-size: 10px; }.fw-reserve-name strong small { font-weight: 400; }.fw-reserve-value { justify-items: end; text-align: right; }
.fw-availability { padding: 3px 8px; border-radius: 12px; background: #194439; color: #79e7be; font-size: 10px; font-style: normal; }.fw-availability.limited { background: #493d20; color: #f5c76e; }.fw-availability.unavailable { background: #502a36; color: #ff91a0; }
.fw-reserve-details { max-width: 880px; margin: 0 auto; }.fw-reserve-details .fw-panel { margin-bottom: 15px; }.fw-reserve-hero { border-color: #4163aa; background: linear-gradient(140deg,#1c345f,#182344); }.fw-reserve-details .fw-bank-fields b { text-align: right; font-size: 12px; }.fw-reserve-details .fw-info { margin-bottom: 0; }
@media (max-width: 390px) { .fw-reserve-row { grid-template-columns: 35px minmax(0,1fr) auto; gap: 6px; padding: 7px; }.fw-reserve-row .fw-token { width: 34px; height: 34px; font-size: 20px; }.fw-reserve-name strong,.fw-reserve-value strong { font-size: 11px; } }
@media (min-width: 860px) { .fenni-wallet { padding: 36px clamp(28px,5vw,70px) 60px; }.fw-home-grid { grid-template-columns: minmax(310px,.9fr) minmax(360px,1.1fr); align-items: start; }.fw-subpage-grid { grid-template-columns: 1fr 1fr; align-items: start; } }
@media (max-width: 390px) { .fenni-wallet { padding-inline: 13px; }.fw-panel { padding: 13px; }.fw-action { padding-inline: 2px; }.fw-action strong { font-size: 11px; }.fw-action small { font-size: 9px; }.fw-asset-values small { max-width: 83px; }.fw-subpage .fw-panel { padding: 17px; } }
