/* Lumo screens: the mobile app's screen chrome for every Mini App screen, the
   same rules as the Lumo extension's public/lumo-screens.css. Loaded after the
   screen stylesheets. The shared LumoScreenHeader (.pagehead), the Inter
   weights CustomButton uses, the select chevron and the dark-mode forms live
   here; the base button, input and card rules themselves are mobile's values
   in ui.css, so a screen's own sizes still win.
   Sources (lumo-mobile-app): widgets/lumo_screen_header.dart, widgets/custom_button.dart,
   utils/theme/lumo_input_decoration.dart, view/wallet_features/send/send_view.dart
   (_blockDecoration, _sectionLabel). Inter Medium and Bold are mobile's
   assets/fonts/Inter_24pt-Medium.ttf and Inter_18pt-Bold.ttf (Inter-OFL.txt).
   Telegram: inside Telegram the header's in-page back arrow gives way to
   Telegram's own BackButton (telegram.js sets data-telegram-back), keeping
   its 44px slot so the title stays centred as on mobile. */
@font-face{font-family:Inter;src:url('inter-medium.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Inter;src:url('inter-bold.ttf') format('truetype');font-weight:600 700;font-display:swap}

/* Chevron for selects (Material keyboard_arrow_down_rounded, textSecondary). */
:root{--lumo-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2368656f'%3E%3Cpath d='M8.12 9.29 12 13.17l3.88-3.88a1 1 0 1 1 1.41 1.41l-4.59 4.59a1 1 0 0 1-1.41 0L6.7 10.7a1 1 0 0 1 1.42-1.41z'/%3E%3C/svg%3E")}
html[data-lumo-theme=dark]{--lumo-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23a9a5b0'%3E%3Cpath d='M8.12 9.29 12 13.17l3.88-3.88a1 1 0 1 1 1.41 1.41l-4.59 4.59a1 1 0 0 1-1.41 0L6.7 10.7a1 1 0 0 1 1.42-1.41z'/%3E%3C/svg%3E")}

/* Screen: flat LumoColors background, 20px gutters, no footer. Screens drawn
   without the shared header (results, status pages) keep 18px above. */
.section{padding:18px var(--lumo-gutter) 28px;color:var(--lumo-text);font-family:var(--lumo-font)}
.section:has(>.pagehead){padding-top:0}
.stack{gap:12px}

/* LumoScreenHeader: 44px back slot, centred 18/500 title, 44px end slot. */
.pagehead.lumo-header{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:0;margin:0 calc(-1 * var(--lumo-gutter)) 6px;padding:18px var(--lumo-gutter)}
.pagehead.lumo-header h2{flex:none;font:500 18px/1.3 var(--lumo-font);letter-spacing:0}
.lumo-back{color:var(--lumo-text)}
.lumo-back:hover{background:var(--lumo-card)}
html[data-lumo-theme=dark] .lumo-back{color:#fff}
html[data-telegram-back=native] .pagehead.lumo-header>#back{visibility:hidden}
.lumo-header-title{grid-column:2;min-width:0;text-align:center}
.lumo-header-title h2{margin:0;text-align:center;font:500 18px/1.3 var(--lumo-font);color:var(--lumo-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lumo-header-subtitle{margin:2px 0 0;font:400 12px/1.35 var(--lumo-font);color:var(--lumo-text-2)}

/* Buttons, inputs and cards are mobile's in ui.css itself (CustomButton,
   LumoInputDecoration, _blockDecoration), so a screen's own sizes still win.
   Dark mode: inputs are transparent with the divider outline; outlined
   buttons stay purple. */
:is(input,textarea)::placeholder{color:var(--lumo-text-2)}
:is(input:not([type=checkbox],[type=radio]),textarea,select):focus-visible{outline:1.4px solid var(--lumo-primary);outline-offset:0}
select:not([multiple],[size]){appearance:none;-webkit-appearance:none;background-image:var(--lumo-chevron);background-repeat:no-repeat;background-position:right 12px center;background-size:18px;padding-right:36px}
html[data-lumo-theme=dark] :is(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color]),textarea,select){background-color:transparent;border-color:var(--lumo-input-border);box-shadow:none}
html[data-lumo-theme=dark] select option{background:var(--lumo-card);color:var(--lumo-text)}
html[data-lumo-theme=dark] .notice{background:#ffab401a;border-color:#ffab404d;color:#ffc46b}
html[data-lumo-theme=dark] .error{background:#e5484d1f;border-color:#e5484d59;color:#ff8b93}
html[data-lumo-theme=dark] .subtle{background:var(--lumo-nested);color:var(--lumo-text-2);border-color:transparent}
html[data-lumo-theme=dark] .details{background:var(--lumo-card);box-shadow:none}
html[data-lumo-theme=dark] .detail{border-color:var(--lumo-divider)}
html[data-lumo-theme=dark] .secondary{background:transparent;color:#bd9afa;border-color:var(--lumo-primary)}
html[data-lumo-theme=dark] .ghost{background:transparent}
html[data-lumo-theme=dark] .tag{background:#8b5cf62e;color:#c9acf9}

/* Send (send_view.dart): You send / To / Network blocks on raised cards
   (radius 14, purple shadow, 12/14 padding), nested 44px fields (radius 10,
   nestedCardFill), 30px percentage chips and the 52px radius-14 CTA. The
   camera and image scanners are the Mini App's own, under the recipient. */
.send-form{gap:12px}
/* send_view.dart _buildHeader: the title at 24/500 with its 12px line 5px below. */
.section:has(>.send-form)>.pagehead .lumo-header-title h2{font-size:24px;line-height:1.2}
.section:has(>.send-form)>.pagehead .lumo-header-subtitle{margin-top:5px}
.send-block{display:flex;flex-direction:column;gap:9px;padding:12px 14px;background:var(--lumo-card);border-radius:var(--lumo-r-tile);box-shadow:var(--lumo-shadow)}
.send-block-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.send-label{font:500 11px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.send-balance{font:400 11px/1.3 var(--lumo-font);color:var(--lumo-text-2);text-align:right;overflow-wrap:anywhere}
.send-balance b{font-weight:400;color:var(--lumo-primary)}
.send-amount-row{display:flex;align-items:center;gap:10px;margin-top:5px}
.send-form .send-amount{flex:1;min-width:0;height:auto;min-height:44px;padding:0;border:0;background:transparent;box-shadow:none;font:600 30px/1.2 var(--lumo-font);color:var(--lumo-text)}
.send-form .send-amount::placeholder{color:var(--lumo-text)}
.send-form .send-amount:focus-visible{outline:0}
.send-amount-row:focus-within{box-shadow:0 2px 0 -1px var(--lumo-primary)}
.send-coin{position:relative;display:flex;align-items:center;gap:7px;flex:0 1 auto;max-width:55%;padding:5px 8px 5px 6px;border-radius:var(--lumo-r-pill);background:var(--lumo-nested)}
.send-coin-art,.send-coin-art>.coin{display:block;width:24px;height:24px;flex:0 0 24px}
.send-coin-art>.coin{font-size:9px}
.send-coin-art img{width:24px;height:24px}
.send-form .send-coin select{min-height:0;height:24px;padding:0 18px 0 0;border:0;background:transparent var(--lumo-chevron) right center/16px no-repeat;box-shadow:none;appearance:none;-webkit-appearance:none;font:600 13px/1 var(--lumo-font);color:var(--lumo-text);text-overflow:ellipsis;max-width:150px;cursor:pointer}
.send-form .send-coin select:disabled{opacity:1;padding-right:0;background-image:none;cursor:default}
html[data-lumo-theme=dark] .send-form .send-coin select{background:transparent var(--lumo-chevron) right center/16px no-repeat}
html[data-lumo-theme=dark] .send-form .send-coin select:disabled{background-image:none}
.send-chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:5px}
.send-chip{height:30px;min-height:30px;padding:0 4px;border:1px solid var(--lumo-divider);border-radius:var(--lumo-r-pill);background:var(--lumo-nested);color:var(--lumo-text-2);font:500 11px/1 var(--lumo-font)}
.send-chip[aria-pressed=true]{border-color:transparent;background:#8b5cf61f;color:var(--lumo-primary);font-weight:600}
.send-field{display:flex;align-items:center;gap:9px;width:100%;min-height:44px;padding:0 11px;border:0;border-radius:var(--lumo-r-card);background:var(--lumo-nested);color:var(--lumo-text);text-align:left;box-sizing:border-box}
.send-field>img{width:20px;height:20px;flex:0 0 20px}
.send-form .send-field input{flex:1;min-width:0;min-height:42px;padding:0;border:0;background:transparent;box-shadow:none;font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text)}
.send-form .send-field input:focus-visible{outline:0}
.send-field:focus-within{outline:1.4px solid var(--lumo-primary)}
.send-scan{display:grid;place-items:center;width:28px;height:28px;min-height:0;padding:0;border-radius:50%;background:transparent;flex:0 0 28px}
.send-scan>img{width:20px;height:20px}
.send-scan-more{display:flex;flex-wrap:wrap;gap:4px 18px}
.send-scan-more>.text-action{min-height:24px;font:500 12px/1.2 var(--lumo-font);color:var(--lumo-primary)}
.send-block #scanQrStatus:empty{display:none}
.send-block #scanQrStatus{margin:0;font:400 11px/1.4 var(--lumo-font);color:var(--lumo-text-2)}
.send-block>div:has(>#accountMemo) label,.send-block>div:has(>#tonMemo) label{font:500 11px/1.3 var(--lumo-font);color:var(--lumo-text-2);margin:2px 0 6px}
.send-form :is(#accountMemo,#tonMemo,#btcFeeLevel,#splFeeLevel){background-color:var(--lumo-nested);border:0;border-radius:var(--lumo-r-card);box-shadow:none;font-size:13px}
.send-block>div:has(>#accountMemo) .tiny,.send-block>div:has(>#tonMemo) .tiny,.send-block>div:has(>#btcFeeLevel) .tiny{margin:6px 0 0;font-size:11px;line-height:1.4;color:var(--lumo-text-2)}
.send-network{font:500 13px/1.3 var(--lumo-font);cursor:pointer}
.send-network>.coin{width:22px;height:22px;flex:0 0 22px}
.send-network>.coin img{width:22px;height:22px}
.send-network>span:not(.coin){flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.send-network>.lumo-chevron{width:18px;height:18px;flex:0 0 18px;color:var(--lumo-text-2)}
.send-block>div:has(>#btcFeeLevel) label{font:500 11px/1.3 var(--lumo-font);color:var(--lumo-text);margin:2px 0 6px}
.send-block>p.tiny{margin:0;font:500 11px/1.4 var(--lumo-font);color:var(--lumo-text-2)}
.send-note{margin:0;font:400 11px/1.45 var(--lumo-font);color:var(--lumo-text-2)}
.send-fiat{margin:-6px 0 0;min-height:14px;font:400 11px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
/* Mobile _ToCard: "Add from contacts" (user_plus 16, 11/500 primary, chevron). */
.send-contacts{display:flex;align-items:center;gap:6px;width:100%;min-height:0;margin:2px 0 0;padding:0;border:0;background:transparent;box-shadow:none;text-align:left;font:500 11px/1.3 var(--lumo-font);color:var(--lumo-primary);cursor:pointer}
.send-contacts>img{width:16px;height:16px;flex:0 0 16px}
.send-contacts>span{flex:1;min-width:0}
.send-contacts>.lumo-chevron{width:15px;height:15px;flex:0 0 15px;color:var(--lumo-text-2)}
.send-contacts-off{color:var(--lumo-text-2);cursor:default}
/* Mobile _NetworkCard: Recommended pill, Network Fee row and time. */
.send-recommended{flex:0 0 auto;padding:3px 8px;border-radius:var(--lumo-r-pill);background:#8b5cf61f;color:var(--lumo-primary);font:500 9.5px/1.2 var(--lumo-font);font-style:normal}
.send-network>.send-recommended+.lumo-chevron{margin-left:-4px}
.send-fee-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:2px;font:400 11px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.send-fee-label{display:inline-flex;align-items:center;gap:4px;flex:0 0 auto;font-weight:500;color:var(--lumo-text)}
.send-fee-label img{width:13px;height:13px;display:block}
#sendFee{text-align:right;overflow-wrap:anywhere}
.send-fee-time{margin:-6px 0 0;font:500 10.5px/1.3 var(--lumo-font);color:var(--lumo-green)}
/* Mobile _SummaryCard: unraised nested fill, label rows, divider, green total. */
.send-block.send-summary{gap:12px;background:var(--lumo-nested);box-shadow:none;padding-bottom:14px}
.send-summary-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;font:400 11px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.send-summary-row>span:first-child{display:inline-flex;align-items:center;gap:4px;min-width:0}
.send-summary-row>span:first-child img{width:12px;height:12px}
.send-summary-row>span:last-child{display:flex;flex-direction:column;align-items:flex-end;gap:4px;text-align:right;min-width:0}
.send-summary-row strong{font:600 12.5px/1.25 var(--lumo-font);color:var(--lumo-text);overflow-wrap:anywhere}
.send-summary-row small{font:400 10.5px/1.25 var(--lumo-font);color:var(--lumo-text-2)}
.send-summary-row small:empty{display:none}
.send-summary hr{width:100%;margin:0;border:0;border-top:1px solid var(--lumo-divider)}
.send-summary-total>span:first-child{font-weight:500}
.send-summary-total strong{font-size:14px;color:var(--lumo-green)}
.send-form>details{font-size:12px}
.send-form>.send-cta{height:52px;min-height:52px;border-radius:var(--lumo-r-tile);font:600 15px/1.2 var(--lumo-font);margin-top:4px}
html[data-lumo-theme=dark] .send-form :is(.send-field input,.send-amount){background:transparent;border:0}
html[data-lumo-theme=dark] .send-form :is(#accountMemo,#tonMemo,#btcFeeLevel,#splFeeLevel){background-color:var(--lumo-nested);border:0}

/* Network pickers (send_view _SendCoinTile / receive "Select coin"): 36px
   coin art, name 14/500, ticker 12 textSecondary, a purple check_circle on
   the selected row; the list sits on the screen, not in a box. */
.netlist{max-height:none;overflow:visible;margin-top:8px;padding:0;background:transparent;border-radius:0}
.netitem{gap:16px;padding:8px 4px;border-radius:var(--lumo-r-card);min-height:56px;color:var(--lumo-text)}
.netitem:hover{background:var(--lumo-nested)}
.netitem.selected{background:transparent}
.netitem .coin,.netitem .coin-img{width:36px;height:36px;flex:0 0 36px}
.netitem .coin img{width:36px;height:36px}
.netitem strong{font:500 14px/1.3 var(--lumo-font)}
.netitem .small{margin-top:2px;font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.netitem .lumo-check{width:20px;height:20px;flex:0 0 20px;color:var(--lumo-primary)}
.section>#search{padding-left:42px;background-image:url('theme/search.svg');background-repeat:no-repeat;background-position:14px center;background-size:18px}
html[data-lumo-theme=dark] :is(.netlist,.netitem.selected){background:transparent}
#refreshNetworks{font-size:14px;font-weight:500;margin-top:4px}

/* Receive (receive_bottom_sheet.dart): one card (radius 10, purple shadow)
   with "You receive", the coin row, the QR on a white radius-28 tile with
   the coin art on a 54px white tile, the address box, the purple send-only
   warning, then the four 66px action tiles. */
.receive-card{display:flex;flex-direction:column;align-items:center;padding:16px 14px 14px;background:var(--lumo-card);border-radius:var(--lumo-r-card);box-shadow:var(--lumo-shadow);text-align:center}
.receive-label{margin:0;font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text-3)}
.receive-asset{display:inline-flex;align-items:center;gap:6px;margin-top:12px;min-height:32px;padding:0 4px;border:0;background:transparent;color:var(--lumo-text);font:600 14px/1.3 var(--lumo-font);border-radius:var(--lumo-r-card)}
.receive-asset>.coin{width:28px;height:28px;flex:0 0 28px}
.receive-asset>.coin img{width:28px;height:28px}
.receive-asset b{font-weight:600;color:var(--lumo-primary)}
.receive-asset>.lumo-chevron{width:18px;height:18px;color:var(--lumo-primary)}
.receive-qr{position:relative;display:grid;place-items:center;margin-top:20px;padding:16px;background:#fff;border-radius:28px}
.receive-qr>.qrcode{display:block;width:168px;height:168px;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:#fff}
.receive-qr-art{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px 0 0 -27px;padding:6px;box-sizing:border-box;background:#fff;border-radius:16px;display:grid;place-items:center}
.receive-qr-art>.coin{width:42px;height:42px}
.receive-qr-art>.coin img{width:42px;height:42px}
.receive-address-label{margin:18px 0 0;font:500 13px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.receive-address{display:flex;align-items:center;gap:8px;width:100%;margin-top:10px;padding:12px 14px;border:1px solid var(--lumo-chip-border);border-radius:16px;box-sizing:border-box;text-align:left}
.receive-address>.mono{flex:1;min-width:0;font:400 12px/1.6 var(--lumo-font);color:var(--lumo-text);overflow-wrap:anywhere}
.receive-copy{display:grid;place-items:center;width:28px;height:28px;min-height:0;padding:0;border-radius:50%;background:transparent;flex:0 0 28px}
.receive-copy>img{width:20px;height:20px}
.receive-warning{display:flex;align-items:center;gap:10px;width:100%;margin-top:12px;padding:10px;border-radius:var(--lumo-r-card);background:#8b5cf61a;box-sizing:border-box;text-align:left}
.receive-warning-icon{display:grid;place-items:center;width:45px;height:45px;flex:0 0 45px;border-radius:50%;background:#8b5cf633}
.receive-warning-icon>img{width:24px;height:24px}
.receive-warning strong{display:block;font:600 12px/1.35 var(--lumo-font);color:var(--lumo-text)}
.receive-warning small{display:block;margin-top:2px;font:400 10px/1.35 var(--lumo-font);color:var(--lumo-text-2)}
.receive-actions{display:flex;justify-content:space-between;gap:8px;margin-top:16px}
.receive-action{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:66px;height:66px;min-height:66px;padding:0;border:0;border-radius:var(--lumo-r-card);background:var(--lumo-card);box-shadow:0 4.44px 22.2px #6a41fb1a;color:var(--lumo-text);font:400 12px/1.2 var(--lumo-font)}
.receive-action>img{width:24px;height:24px}
html[data-lumo-theme=dark] .receive-action{box-shadow:none;background:var(--lumo-card);color:var(--lumo-text)}
html[data-lumo-theme=dark] .receive-address{border-color:var(--lumo-border)}

/* Coin details (coin_details_view.dart _buildMobileLayout): 20px gutters;
   header back + 38px badged logo + ticker 16/600; price 32/600 with the 14px
   change and "Today"; period chips (padding 5, radius 5, primarySoft 20%);
   156px purple line chart with a fading fill and the price column (current
   price on purple); the pill action bar; "Your balance", Market details and
   Transaction history titled 16/500. No dock: Telegram's BackButton (or the
   in-page arrow) returns home. */
.dashboard{padding-bottom:calc(24px + var(--tg-content-bottom) + env(safe-area-inset-bottom))}
.coin-detail{padding:9px var(--lumo-gutter) 24px;color:var(--lumo-text);font-family:var(--lumo-font)}
.coin-detail-head{display:flex;align-items:center;gap:0;min-height:44px}
.coin-detail-head>.lumo-back{margin-right:13px}
html[data-telegram-back=native] .coin-detail-head>#back{display:none}
.coin-detail-logo{width:var(--coin-size);height:var(--coin-size);flex:0 0 var(--coin-size)}
.coin-detail-logo>.coin{width:100%;height:100%;border-radius:50%}
.coin-detail-logo>.coin img{width:100%;height:100%}
.coin-detail-logo>.lumo-coin-badge{width:calc(var(--coin-size) * .32);height:calc(var(--coin-size) * .32)}
.coin-detail-logo>.lumo-coin-badge>.coin,.coin-detail-logo>.lumo-coin-badge img{width:100%;height:100%;border-radius:50%}
.coin-detail-symbol{margin-left:10px;font:600 16px/1.2 var(--lumo-font)}
.coin-detail-tools{display:flex;gap:8px;margin-left:auto}
.coin-detail-tools .icon{width:18px;height:18px}
.coin-detail-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:14px 0 0}
.coin-detail-meta .network{border-color:var(--lumo-chip-border);background:var(--lumo-card);color:var(--lumo-text);font:400 12px/1.2 var(--lumo-font)}
.coin-detail-meta .network>.lumo-chevron{width:16px;height:16px;color:var(--lumo-text-2)}
.coin-detail-meta .address{color:var(--lumo-text-2);font:400 12px/1.2 var(--lumo-font)}
.coin-detail-meta .address>img{width:16px;height:16px}
.coin-detail .coin-chart{margin:26px 0 0;padding:0;gap:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.coin-detail .coin-chart>h3{display:none}
.coin-chart-price{flex-direction:column;align-items:flex-start;gap:3px}
.coin-chart-price strong{font:600 32px/1.2 var(--lumo-font);color:var(--lumo-text)}
.coin-chart-price>span{font:400 14px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.coin-chart-up{color:var(--lumo-green)}.coin-chart-down{color:var(--lumo-red)}.coin-chart-flat{color:var(--lumo-text-2)}
.coin-chart .coin-chart-frames{display:flex;flex-wrap:nowrap;gap:24px;margin-top:20px;overflow-x:auto;scrollbar-width:none}
.coin-chart .coin-chart-frames button{flex:none;min-height:0;padding:5px;border:0;border-radius:5px;background:transparent;color:var(--lumo-text-2);font:400 12px/1.2 var(--lumo-font)}
.coin-chart .coin-chart-frames button.selected{background:#b794d933;color:var(--lumo-primary);font-weight:500}
.coin-chart-plot{display:grid;grid-template-columns:minmax(0,1fr) minmax(39px,auto);gap:6px;margin-top:19px;min-height:156px}
.coin-chart-plot>p{grid-column:1/-1;align-self:center;text-align:center;color:var(--lumo-text-3);font-size:12px}
.coin-chart-plot .price-chart{width:100%;height:156px;background:transparent;border-radius:0;color:var(--lumo-primary)}
.coin-chart-labels{display:flex;flex-direction:column;justify-content:space-between;height:156px;font:400 10px/1.2 var(--lumo-font);color:var(--lumo-text-2);text-align:right}
.coin-chart-labels .current{background:var(--lumo-primary);color:#fff;padding:0 2px;border-radius:0}
.coin-detail-actions{margin-top:20px}
.coin-detail-actions>button{padding:0}
.coin-detail-actions>button:disabled{opacity:.45}
.coin-detail-actions .coin-detail-stake{width:28px;height:28px;color:var(--lumo-primary)}
.coin-detail-title{display:flex;align-items:center;gap:6px}
.coin-detail h2,.coin-chart-market h3{margin:0;font:500 16px/1.3 var(--lumo-font);color:var(--lumo-text);letter-spacing:0}
.coin-detail-balance{margin-top:20px}
.coin-detail-balance-row{display:flex;align-items:center;gap:10px;margin-top:14px}
.coin-detail-balance-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.coin-detail-balance-main>strong{font:600 16px/1.2 var(--lumo-font)}
.coin-detail-balance-main>.amount{font:400 14px/1.3 var(--lumo-font);letter-spacing:0;color:var(--lumo-text-2);overflow-wrap:anywhere}
.coin-detail-balance-main .fraction{font-size:1em;color:inherit;letter-spacing:0}
.coin-detail-balance-main .ticker{font:inherit;color:inherit;margin:0}
.coin-detail-balance-main .balance-mask{font-size:14px}
.coin-detail-balance-end{display:flex;flex-direction:column;align-items:flex-end;gap:5px;text-align:right;max-width:45%}
.coin-detail-balance-end .text-action{min-height:0;padding:0}
.coin-chart-market{margin-top:20px}
.coin-chart-market>.details,.coin-chart>.details{margin-top:10px;padding:10px;border-radius:var(--lumo-r-card)}
.coin-chart-market .detail,.coin-chart>.details .detail{display:flex;justify-content:space-between;gap:10px;padding:0 0 5px;border:0}
.coin-chart-market .detail .label,.coin-chart>.details .detail .label{margin:0;font:400 12px/1.4 var(--lumo-font);color:var(--lumo-text-3)}
.coin-chart-market .detail .val,.coin-chart>.details .detail .val{font:400 12px/1.4 var(--lumo-font);color:var(--lumo-text);text-align:right}
.coin-detail-list{margin-top:20px}
.coin-detail-tabs{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px}
.coin-detail-tabs>button{white-space:nowrap}
.coin-detail-tabs>button[aria-pressed]{min-height:0;padding:0;background:transparent;font:500 16px/1.3 var(--lumo-font);color:var(--lumo-text-3)}
.coin-detail-tabs>button[aria-pressed=true]{color:var(--lumo-text)}
.coin-detail-tabs>#activity+.text-action{margin-left:auto}
.coin-detail .assets{display:flex;flex-direction:column;gap:10px;margin-top:10px}
.coin-detail .asset{gap:10px;padding:10px;border:0;border-radius:var(--lumo-r-card);background:var(--lumo-card);box-shadow:var(--lumo-shadow)}
.coin-detail .asset .coin,.coin-detail .asset .coin-img{width:44px;height:44px}
.coin-detail .asset .coin img{width:44px;height:44px}
.coin-detail .asset strong{font:600 16px/1.2 var(--lumo-font)}
.coin-detail .asset .small{font:400 14px/1.3 var(--lumo-font);color:var(--lumo-text-2);margin-top:5px}
.coin-detail .asset .value strong{font:600 16px/1.2 var(--lumo-font)}
.coin-detail .tx-row .coin{display:grid;place-items:center;background:var(--lumo-nested);color:var(--lumo-primary)}
.coin-detail .tx-row .coin .icon{width:20px;height:20px}
.coin-detail .tx-row strong{font-size:12px}
.coin-detail .tx-row .small{font-size:10px}
.coin-detail .tx-row a{font:500 12px/1.2 var(--lumo-font);color:var(--lumo-primary)}
/* Mobile TransactionTile: 10/15 padding, 10 radius, Send/Received and the
   date on the left, the signed amount, fee and status on the right. */
.coin-detail .lumo-tx-tile{align-items:flex-start;padding:10px 15px;border-radius:10px}
.coin-detail .lumo-tx-tile .name{min-width:0}
.coin-detail .lumo-tx-tile .name strong{display:block;font:500 12px/1.3 var(--lumo-font);color:var(--lumo-text)}
.coin-detail .lumo-tx-tile .tx-tile-date{margin-top:5px;font:400 10px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.coin-detail .lumo-tx-tile .tx-tile-hash{margin-top:5px;font-size:10px;color:var(--lumo-text-3)}
.coin-detail .lumo-tx-tile .name .small{margin-top:5px;font-size:10px}
.coin-detail .tx-tile-side{display:flex;flex-direction:column;align-items:flex-end;gap:5px;margin-left:auto;text-align:right;flex:none}
.coin-detail .tx-tile-amount{font:500 12px/1.3 var(--lumo-font)}
.coin-detail .tx-tile-amount.send{color:var(--lumo-red)}
.coin-detail .tx-tile-amount.receive{color:var(--lumo-green)}
.coin-detail .tx-tile-fee{font:400 10px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.coin-detail .tx-tile-status{font:400 10px/1.3 var(--lumo-font);color:var(--lumo-text-3)}
.coin-detail .lumo-tx-tile a{font:500 10px/1.2 var(--lumo-font)}
.coin-detail .empty{padding:16px 0;text-align:left;font-size:12px;color:var(--lumo-text-3)}
.coin-detail .dashboard-error{margin:12px 0 0}
html[data-lumo-theme=dark] .coin-detail :is(.asset,.coin-chart){background:var(--lumo-card);border-color:transparent}
html[data-lumo-theme=dark] .coin-detail .coin-chart{background:transparent}
html[data-lumo-theme=dark] .coin-detail-meta .network{background:var(--lumo-card);border-color:var(--lumo-border);color:var(--lumo-text)}
html[data-lumo-theme=dark] .coin-detail-actions{background:var(--lumo-nav-fill)}

/* Transaction details (transaction_details_view.dart): the amount card with
   the direction dot and a 700-weight amount, then label / value rows (label
   textSecondary left, value 500 right; copyable values purple). */
.tx-details .tx-amount-card{padding:20px 14px;border:0;border-radius:var(--lumo-r-tile);background:var(--lumo-card);box-shadow:var(--lumo-shadow)}
.tx-details .tx-direction{font:400 13px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.tx-details .tx-direction.tx-sent::first-letter{color:#ff5252}
.tx-details .tx-direction.tx-received::first-letter{color:#3bff1b}
.tx-details .tx-amount-card strong{margin-top:10px;font:700 26px/1.2 var(--lumo-font);color:var(--lumo-text)}
.tx-details .details .detail{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:13px 0}
.tx-details .details .detail .label{margin:0;flex:none;font:400 13px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.tx-details .details .detail .val{min-width:0;text-align:right;font:500 13px/1.3 var(--lumo-font)}
.tx-details .details .detail .val .text-action{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 13px/1.3 var(--lumo-font);color:var(--lumo-primary);min-height:0;padding:0}
html[data-lumo-theme=dark] .tx-details .tx-amount-card{background:var(--lumo-card)}


/* Settings (settings_view.dart, new_theme_settings_widgets.dart): rows on the
   screen itself, min-height 41, 24px glyph in iconColor, 5px gap, title
   14/500 (subtitle 11), value 14 textSecondary, 16px grey caret, a 1px
   divider under each row and 28px between groups; the version line at 12px.
   Mobile's SettingsThemeToggle (35x18 pill, 14px thumb) for the switches. */
.settings-list{padding-top:10px}
/* settings_view.dart: the header title is 16/500. */
.section:has(>.settings-list)>.pagehead .lumo-header-title h2{font-size:16px}
.settings-list>#biometricSlot>.settings-toggle,.settings-group>#biometricSlot>.settings-toggle{margin:0 0 10px}
.settings-list .settings-toggle[for=biometricLock]{--art:url('theme/fingerprint.svg')}
.settings-glyph-art{object-fit:contain}
.settings-preview-note{margin-top:28px}
.settings-security{margin-top:28px}
.settings-list>#lock{margin-top:20px}
.settings-group+.settings-group{margin-top:28px}
.settings-row,.settings-list .settings-toggle{box-sizing:border-box;display:flex;align-items:center;gap:5px;width:100%;min-height:41px;margin:0 0 10px;padding:0 0 6px;border:0;border-bottom:1px solid var(--lumo-divider);border-radius:0;background:transparent;box-shadow:none;color:var(--lumo-text);text-align:left;font:500 14px/1.3 var(--lumo-font);cursor:pointer}
.settings-glyph{width:24px;height:24px;flex:0 0 24px;color:var(--lumo-text)}
.settings-art{display:block;background:currentColor;-webkit-mask:var(--art) center/24px no-repeat;mask:var(--art) center/24px no-repeat}
.settings-art-passcode{--art:url('theme/passcode.svg')}.settings-art-bell{--art:url('theme/bell.svg')}.settings-art-moon{--art:url('theme/moon.svg')}.settings-art-money{--art:url('theme/money.svg')}.settings-art-globe{--art:url('theme/settings_globe.svg')}
.settings-row-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;padding-left:0}
.settings-row-text strong{font:500 14px/1.3 var(--lumo-font)}
.settings-row-text small{font:400 11px/1.35 var(--lumo-font);color:var(--lumo-text-2)}
.settings-row-value{margin-left:8px;font:400 14px/1.3 var(--lumo-font);color:var(--lumo-text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40%}
.settings-caret{width:16px;height:16px;flex:0 0 16px;margin-left:10px}
.settings-row:hover{background:transparent}
#app.lumo-flat .wallpaper>div{display:none}
.settings-list .settings-toggle>span{flex:1;font:500 14px/1.3 var(--lumo-font)}
.settings-list .settings-toggle::before{content:"";width:24px;height:24px;flex:0 0 24px;background:currentColor;-webkit-mask:var(--art) center/24px no-repeat;mask:var(--art) center/24px no-repeat}
.settings-list .settings-toggle[for=settingsSounds]{--art:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9v6h4l5 5V4L7 9H3zm7-.17v6.34L7.83 13H5v-2h2.83L10 8.83zM16.5 12c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77 0-4.28-2.99-7.86-7-8.77z'/%3E%3C/svg%3E")}
.settings-list .settings-toggle[for=settingsWalletAnimation]{--art:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17 16.99c-1.35 0-2.2.42-2.95.8-.65.33-1.18.6-2.05.6-.9 0-1.4-.25-2.05-.6-.75-.38-1.57-.8-2.95-.8s-2.2.42-2.95.8c-.65.33-1.17.6-2.05.6v1.95c1.35 0 2.2-.42 2.95-.8.65-.33 1.17-.6 2.05-.6s1.4.25 2.05.6c.75.38 1.57.8 2.95.8s2.2-.42 2.95-.8c.65-.33 1.18-.6 2.05-.6.9 0 1.4.25 2.05.6.75.38 1.58.8 2.95.8v-1.95c-.9 0-1.4-.25-2.05-.6-.75-.38-1.6-.8-2.95-.8zm0-4.45c-1.35 0-2.2.43-2.95.8-.65.32-1.18.6-2.05.6-.9 0-1.4-.25-2.05-.6-.75-.38-1.57-.8-2.95-.8s-2.2.43-2.95.8c-.65.32-1.17.6-2.05.6v1.95c1.35 0 2.2-.43 2.95-.8.65-.35 1.15-.6 2.05-.6s1.4.25 2.05.6c.75.38 1.57.8 2.95.8s2.2-.43 2.95-.8c.65-.35 1.15-.6 2.05-.6s1.4.25 2.05.6c.75.38 1.58.8 2.95.8v-1.95c-.9 0-1.4-.25-2.05-.6-.75-.38-1.6-.8-2.95-.8zm2.95-8.08c-.75-.38-1.58-.8-2.95-.8s-2.2.42-2.95.8c-.65.32-1.18.6-2.05.6-.9 0-1.4-.25-2.05-.6-.75-.37-1.57-.8-2.95-.8s-2.2.42-2.95.8c-.65.33-1.17.6-2.05.6v1.93c1.35 0 2.2-.43 2.95-.8.65-.33 1.17-.6 2.05-.6s1.4.25 2.05.6c.75.38 1.57.8 2.95.8s2.2-.43 2.95-.8c.65-.32 1.18-.6 2.05-.6.9 0 1.4.25 2.05.6.75.38 1.58.8 2.95.8V5.04c-.9 0-1.4-.25-2.05-.58zM17 8.09c-1.35 0-2.2.43-2.95.8-.65.35-1.15.6-2.05.6s-1.4-.25-2.05-.6c-.75-.38-1.57-.8-2.95-.8s-2.2.43-2.95.8c-.65.35-1.15.6-2.05.6v1.95c1.35 0 2.2-.43 2.95-.8.65-.32 1.18-.6 2.05-.6s1.4.25 2.05.6c.75.38 1.57.8 2.95.8s2.2-.43 2.95-.8c.65-.32 1.18-.6 2.05-.6.9 0 1.4.25 2.05.6.75.38 1.58.8 2.95.8V9.49c-.9 0-1.4-.25-2.05-.6-.75-.38-1.6-.8-2.95-.8z'/%3E%3C/svg%3E")}
.settings-list input[role=switch]{appearance:none;-webkit-appearance:none;position:relative;width:35px;min-width:35px;height:18px;min-height:18px;margin:0 4px;padding:0;border:0;border-radius:100px;background:var(--lumo-divider);box-shadow:none;cursor:pointer;transition:background .18s}
.settings-list input[role=switch]::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;transition:transform .18s}
.settings-list input[role=switch]:checked{background:var(--lumo-primary)}
.settings-list input[role=switch]:checked::after{transform:translateX(17px)}
html[data-lumo-theme=dark] .settings-list input[role=switch]{background:var(--lumo-divider);border:0}
html[data-lumo-theme=dark] .settings-list input[role=switch]:checked{background:var(--lumo-primary)}
html[data-lumo-theme=dark] .settings-list .settings-row.feature-link{background:transparent;border-color:var(--lumo-divider);color:var(--lumo-text)}
html[data-lumo-theme=dark] .settings-list .settings-toggle{background:transparent;border-color:var(--lumo-divider)}
.settings-note{margin:28px 0 12px;font:400 12px/1.5 var(--lumo-font);color:var(--lumo-text-2)}
.settings-version{margin:24px 0 8px;text-align:center;font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
@media(prefers-reduced-motion:reduce){.settings-list input[role=switch],.settings-list input[role=switch]::after{transition:none}}

/* Profile (profile_view.dart, Figma 172:1015): Appearance / Support /
   Settings as 32px round card buttons with purple glyphs; the 63px photo,
   name 18/500, "Change name" on a purple 8% radius-8 chip and the "Switch"
   stadium; then 78% card surfaces (radius 15): Account statement and
   Notifications rows (18px glyph, 12/500 title, 11px line, chevron),
   shortcut cards (min-height 111, 40px purple-tint glyph box, 12/500 label;
   three in the first row, then two) and service rows (min-height 73,
   32px purple glyph, 12/500 label, chevron). */
.profile-menu{padding:0 0 20px}
.profile-menu-tools{gap:0;margin:-68px 0 30px;justify-content:flex-end;position:relative;z-index:1;pointer-events:none}
.profile-menu-tools .profile-tool{pointer-events:auto;margin:6px;color:var(--lumo-primary);box-shadow:none;border:0;padding:0}
.profile-menu-tools .profile-tool .icon{width:20px;height:20px}
.profile-menu-header{gap:12px;margin-bottom:24px}
.profile-menu-avatar{width:63px;height:63px;background:var(--lumo-nested)}
.profile-menu-identity h3{margin:0 0 4px;font:500 18px/1.3 var(--lumo-font);color:var(--lumo-text)}
.profile-menu-identity .text-action{min-height:28px;padding:4px 10px;border-radius:8px;background:#8b5cf614;color:var(--lumo-primary);font:600 12px/1.2 var(--lumo-font)}
.profile-menu-switch{min-height:36px;padding:0 20px;border:0;border-radius:var(--lumo-r-pill);background:var(--lumo-card);color:var(--lumo-primary);font:500 12px/1.2 var(--lumo-font)}
.profile-menu-main{gap:14px}
.profile-menu-row{gap:10px;min-height:0;padding:14px;border-radius:15px;background:color-mix(in srgb,var(--lumo-card) 78%,transparent);box-shadow:none;color:var(--lumo-text)}
.profile-menu-main .profile-menu-glyph{width:18px;height:18px;border-radius:0;background:transparent;color:var(--lumo-text)}
.profile-menu-main .profile-menu-glyph .icon{width:18px;height:18px}
.profile-menu-row strong{font:500 12px/1.3 var(--lumo-font)}
.profile-menu-row small{margin-top:2px;font:400 11px/1.35 var(--lumo-font);color:var(--lumo-text-2)}
.profile-menu-chevron{font-size:20px;line-height:1;color:var(--lumo-text)}
.profile-menu-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin:14px 0 4px}
.profile-menu-tile{grid-column:span 3;min-height:111px;padding:14px;border-radius:15px;background:color-mix(in srgb,var(--lumo-card) 78%,transparent);justify-content:center;gap:10px;color:var(--lumo-text);font:500 12px/1.3 var(--lumo-font)}



.section:has(#profileMenu)>.pagehead .lumo-header-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.profile-menu-tile>.profile-menu-glyph{width:40px;height:40px;border-radius:12px;background:#8b5cf61a;color:var(--lumo-primary)}
.profile-menu-tile>.profile-menu-glyph .icon{width:26px;height:26px}
.profile-menu-tile>span:last-child{min-height:0}
.profile-menu-services{gap:10px;margin-top:10px}
.profile-menu-services .profile-menu-row{min-height:73px;padding:16px 18px;gap:14px}
.profile-menu-services .profile-menu-glyph{width:32px;height:32px;background:transparent;color:var(--lumo-primary)}
.profile-menu-services .profile-menu-glyph .icon{width:30px;height:30px}
html[data-lumo-theme=dark] :is(.profile-menu-row,.profile-menu-tile){background:color-mix(in srgb,var(--lumo-card) 78%,transparent);border-color:transparent;color:var(--lumo-text)}
html[data-lumo-theme=dark] .profile-menu-main .profile-menu-glyph{background:transparent;color:var(--lumo-text)}
html[data-lumo-theme=dark] .profile-menu-tile>.profile-menu-glyph{background:#8b5cf62e;color:#c5a6f9}
html[data-lumo-theme=dark] .profile-menu-services .profile-menu-glyph{background:transparent;color:#c5a6f9}
html[data-lumo-theme=dark] .profile-menu-tools .profile-tool{background:var(--lumo-card);color:#c5a6f9}

/* Swap (swap_view.dart) titles itself in the header only; Buy & Sell
   (buy_sell_view.dart _buildHeader) puts its 24/500 title and 12px line in
   the header row beside the back button, with no separate screen title. */
.swap-ramp-page .swap-heading{display:none}
.section:has(.ramp-heading)>.pagehead .lumo-header-title{visibility:hidden}
.swap-ramp-page .ramp-heading{position:relative;z-index:1;margin:-70px 44px 22px;padding:0;gap:5px;pointer-events:none}
.swap-ramp-page .ramp-heading h2{font:500 24px/1.2 var(--lumo-font);color:var(--lumo-text)}
.swap-ramp-page .ramp-heading p{margin:0;font:400 12px/1.35 var(--lumo-font);color:var(--lumo-text-2)}
html[data-lumo-theme=dark] .swap-asset-card{background:var(--lumo-card);border-color:var(--lumo-border);box-shadow:none;color:var(--lumo-text)}
html[data-lumo-theme=dark] .swap-asset-picker{background:var(--lumo-nested);color:var(--lumo-text)}
html[data-lumo-theme=dark] .swap-asset-picker select{color:var(--lumo-text);border-color:var(--lumo-border)}
html[data-lumo-theme=dark] .swap-reverse{background:var(--lumo-card);border-color:var(--lumo-bg)}
html[data-lumo-theme=dark] .swap-promo h2{color:var(--lumo-text)}
html[data-lumo-theme=dark] .swap-picked-coin{color:var(--lumo-text)}
html[data-lumo-theme=dark] .swap-card-bottom{border-top-color:var(--lumo-divider)}
html[data-lumo-theme=dark] .swap-card-top label{color:var(--lumo-text-2)}

/* Cards (card_view.dart _buildOffer): the plan in one card-coloured panel
   with a 1px brand-purple border (radius 15, padding 23/22/16, purple
   shadow): the card art, "Lumo debit" 24/600 with the plan on a 12% pill,
   then the actions. Mobile's Basic / Pro switch above it stays. */
.card-offer{display:flex;flex-direction:column;gap:12px;padding:23px 22px 16px;border:1px solid var(--lumo-primary);border-radius:15px;background:var(--lumo-card);box-shadow:var(--lumo-shadow)}
.card-offer .card-design-title{margin-top:11px;align-items:center}
.card-offer .card-design-title h3{font:600 24px/1.2 var(--lumo-font);color:var(--lumo-text)}
.card-offer .card-design-title span{padding:5px 10px;border-radius:20px;background:#8b5cf61f;color:var(--lumo-primary);font:700 10px/1.2 var(--lumo-font);text-transform:uppercase}
.card-offer>.primary{min-height:46px;border-radius:10px;font-size:15px}
.card-offer>.secondary{min-height:40px;border-radius:10px;font-size:14px}
.card-lifecycle .card-plan-switch{border-radius:12px;background:var(--lumo-nested)}
.card-lifecycle .card-plan-switch button{border-radius:10px;color:var(--lumo-text)}
.card-lifecycle .card-plan-switch button[aria-pressed=true]{background:var(--lumo-primary);color:#fff}
.card-lifecycle .feature-link{border:0;border-radius:var(--lumo-r-card);box-shadow:var(--lumo-shadow);padding:12px 14px}
html[data-lumo-theme=dark] .card-offer{background:var(--lumo-card);box-shadow:none}
html[data-lumo-theme=dark] .card-lifecycle .card-plan-switch{background:var(--lumo-nested)}
html[data-lumo-theme=dark] .card-lifecycle .card-plan-switch button[aria-pressed=false]{background:transparent;color:var(--lumo-text)}

/* Lock screen (pin_code_view.dart verify mode): 54px logo mark 74px down,
   a 16/500 title, the 10-12px textSecondary line, the entry (radius 12) and
   a 46px Continue; no extension footer. */
.lumo-lock{padding:74px var(--lumo-gutter) 28px;color:var(--lumo-text)}
.lumo-lock .emblem{width:54px;height:54px;margin:0 auto 34px}
.lumo-lock h1{max-width:none;margin:0 auto 8px;font:500 16px/1.3 var(--lumo-font);letter-spacing:0}
.lumo-lock>p{margin:0 auto 22px;max-width:260px;font:400 12px/1.45 var(--lumo-font);color:var(--lumo-text-2)}
.lumo-lock form{margin-top:12px;text-align:left}
.lumo-lock label{font:500 12px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.lumo-lock #password{border:1px solid var(--lumo-chip-border);text-align:center;letter-spacing:.2em}
.lumo-lock #submit{min-height:46px}
.lumo-lock .text-action{margin:0 auto;font-size:12px}
.lumo-lock>p.tiny{margin-top:22px!important;font-size:10px}
html[data-lumo-theme=dark] .lumo-lock #password{border-color:var(--lumo-border)}

/* Setup wizard (setup_wizard_view.dart): the top bar is mobile's own: a
   plain 40px back chevron, the 4px progress bar and "Skip setup ×" (13px,
   textSecondary), with no screen title; titles 22/500 and 12px subtitles;
   the 46px radius-10 CTA on the purple → soft purple gradient (14/500) and
   the grey secondary with a dark label. */
.section:has(.setup-wizard)>.pagehead{position:relative;z-index:2;padding-top:8px;padding-bottom:8px;margin-bottom:-58px;pointer-events:none}
.section:has(.setup-wizard)>.pagehead>.lumo-back{pointer-events:auto}
.section:has(.setup-wizard)>.pagehead .lumo-header-title{visibility:hidden}
.section:has(.setup-wizard)>.pagehead>.lumo-back{background:transparent;box-shadow:none;width:40px;height:40px;margin:2px}
.section:has(.setup-wizard)>.pagehead>.lumo-back>svg{width:18px;height:18px}
.setup-wizard .setup-top{margin:8px 0 12px 48px;min-height:40px}
.setup-wizard progress{height:4px}
.setup-skip{font:400 13px/1.2 var(--lumo-font);color:var(--lumo-text-2);min-height:36px;padding:0 10px}
.setup-wizard h2{font:500 22px/1.25 var(--lumo-font);letter-spacing:0;color:var(--lumo-text)}
.setup-wizard .setup-subtitle,.setup-wizard .setup-hero>p{font:400 12px/1.45 var(--lumo-font);color:var(--lumo-text-2)}
.setup-actions>.primary{min-height:46px;border-radius:10px;background:linear-gradient(90deg,#8b5cf6,#b794d9);font:500 14px/1.2 var(--lumo-font-material)}
.setup-actions>.secondary{min-height:46px;border:0;border-radius:10px;background:var(--lumo-secondary-bg);color:var(--lumo-text);font:500 14px/1.2 var(--lumo-font-material)}
.setup-actions>.ghost{min-height:30px;font:500 12px/1.2 var(--lumo-font);color:var(--lumo-primary)}
html[data-lumo-theme=dark] .setup-actions>.secondary{background:var(--lumo-card);color:var(--lumo-text);border:0}
html[data-lumo-theme=dark] .setup-wizard .setup-actions>button.primary{background:linear-gradient(90deg,#8b5cf6,#b794d9)}

/* Mobile handles_view (registered): title block, purple hero, plan card,
   Receiving networks card and feature notes. */
.section:has(.handles-screen)>.pagehead .lumo-header-title{visibility:hidden}
.handles-screen{gap:14px;font-family:var(--lumo-font)}
.handles-intro h2{margin:0;font:700 26px/1.2 var(--lumo-font);color:var(--lumo-text)}
.handles-intro p{margin:4px 0 0;font:400 13px/1.4 var(--lumo-font);color:var(--lumo-text-2)}
.handles-hero{display:flex;flex-direction:column;gap:18px;padding:20px;border-radius:20px;background:linear-gradient(135deg,#8b5cf6,#6d28d9);box-shadow:0 10px 24px #8b5cf640;color:#fff}
.handles-hero-id{display:flex;align-items:center;gap:14px}
.handles-avatar{display:grid;place-items:center;flex:0 0 52px;width:52px;height:52px;border-radius:50%;background:#fff;color:#8b5cf6f2;font:700 26px/1 var(--lumo-font);box-sizing:border-box}
.handles-hero h3{margin:0 0 4px;font:700 22px/1.2 var(--lumo-font);color:#fff;overflow-wrap:anywhere}
.handles-registered{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;background:#ffffff2e;font:600 11px/1.2 var(--lumo-font)}
.handles-registered svg{width:12px;height:12px}
.handles-hero .premium-plan-badge{margin-left:6px}
.handles-hero-actions{display:flex;gap:10px}
.handles-hero-actions button{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;min-height:0;height:auto;padding:10px 0;border:0;border-radius:12px;background:#ffffff29;box-shadow:none;color:#fff;font:500 11px/1.2 var(--lumo-font)}
.handles-hero-actions svg{width:20px;height:20px}
.handles-qr{display:flex;justify-content:center}
.handles-qr canvas{padding:8px;border-radius:16px;background:#fff}
.handles-plan{display:flex;flex-direction:column;gap:10px;padding:14px;border:1px solid #d4a83a73;border-radius:18px;background:var(--lumo-card)}
.handles-plan .row{align-items:center;gap:12px}
.handles-plan .row>div{flex:1;min-width:0;overflow-wrap:anywhere}
.handles-plan .row>button.secondary{flex:0 0 auto;width:auto;min-height:36px;height:36px;padding:0 14px;white-space:nowrap;font-size:13px}
.handles-plan-offer{padding:16px;border:1px solid #f5b83d80;border-radius:18px;background:linear-gradient(90deg,#2a1d05,#3b2a0a)}
.handles-plan-offer strong{display:block;font:700 16px/1.3 var(--lumo-font);color:#f5b83d}
.handles-plan-offer p{margin:4px 0 10px;font:400 12px/1.4 var(--lumo-font);color:#d9cfb8}
.handles-plan-offer button{width:auto;min-height:40px;padding:0 20px;border:0;border-radius:20px;background:#f5b83d;color:#3d2a00;font:600 14px/1 var(--lumo-font)}
.handles-card{display:flex;flex-direction:column;padding:16px;border:1px solid color-mix(in srgb,var(--lumo-divider) 60%,transparent);border-radius:16px;background:var(--lumo-card)}
.handles-card-title{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.handles-card-title h3{flex:1;margin:0;font:600 15px/1.3 var(--lumo-font);color:var(--lumo-text)}
.handles-card-title span{font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.handles-network{display:flex;align-items:center;gap:12px;padding:9px 0;border-top:1px solid color-mix(in srgb,var(--lumo-divider) 60%,transparent)}
.handles-network:first-of-type{border-top:0}
.handles-network>div{flex:1;min-width:0}
.handles-network strong{display:block;font:600 13px/1.3 var(--lumo-font);color:var(--lumo-text)}
.handles-network small{display:block;margin-top:2px;font-size:11px;color:var(--lumo-text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.handles-network-state{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:50%;background:var(--lumo-nested);color:var(--lumo-text-2)}
.handles-network-state.on{background:#16a34a1f;color:#16a34a}
.handles-network-state svg{width:18px;height:18px}
.handles-network .text-action{flex:0 0 auto;width:auto;font-size:12px}
.handles-info{display:flex;gap:12px;padding:10px 0;border-top:1px solid color-mix(in srgb,var(--lumo-divider) 60%,transparent)}
.handles-info:first-child{border-top:0}
.handles-info>span{display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;border-radius:50%;background:#8b5cf61f;color:var(--lumo-primary)}
.handles-info>span svg{width:24px;height:24px}
.handles-info strong{font:600 13px/1.3 var(--lumo-font);color:var(--lumo-text)}
.handles-info p{margin:4px 0 0;font:400 11px/1.4 var(--lumo-font);color:var(--lumo-text-2)}
.handles-footnote{margin:0;font:400 11px/1.4 var(--lumo-font);color:var(--lumo-text-2)}

/* Mobile referral_view: title block, 140px tinted gift banner, white 10px
   cards (code 24/500 with 36px outlined copy buttons, the link in a 5px
   box), the two stat columns, numbered steps and the reward box. */
.section:has(.referral-intro)>.pagehead .lumo-header-title{visibility:hidden}
.referral-intro h2{margin:0;font:600 24px/1.25 var(--lumo-font);color:var(--lumo-text)}
.referral-intro p{margin:4px 0 0;font:400 12px/1.4 var(--lumo-font);color:var(--lumo-text-2)}
.referral-hero{position:relative;display:flex;align-items:center;height:140px;padding:0 150px 0 20px;border-radius:10px;background:#8b5cf61a;overflow:hidden;box-sizing:border-box;font-family:var(--lumo-font)}
.referral-hero strong{display:block;font:500 20px/1.25 var(--lumo-font);color:var(--lumo-text)}
.referral-hero p{margin:5px 0 0;font:400 12px/1.4 var(--lumo-font);color:var(--lumo-text-2)}
.referral-hero>img{position:absolute;right:4px;top:10px;width:138px;height:120px}
.referral-card{padding:14px 20px 18px;border-radius:10px;background:var(--lumo-card);box-shadow:var(--lumo-shadow);font-family:var(--lumo-font)}
.referral-card hr{margin:12px 0 14px;border:0;border-top:.5px solid var(--lumo-divider)}
.referral-code-row{display:flex;align-items:center;gap:7px}
.referral-code-row>div{flex:1;min-width:0}
.referral-code small,.referral-link-label{display:block;font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.referral-link-label{margin-bottom:7px;font-size:10px;color:var(--lumo-text-3)}
.referral-code strong{display:block;margin-top:5px;font:500 24px/1.2 var(--lumo-font);color:var(--lumo-text);overflow-wrap:anywhere}
.referral-link{flex:1;min-width:0;height:36px;padding:0 10px;border:1px solid var(--lumo-divider);border-radius:5px;background:var(--lumo-nested);font:400 12px/34px var(--lumo-font);color:var(--lumo-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box}
.referral-copy{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;min-height:36px;padding:0;border:1px solid var(--lumo-divider);border-radius:5px;background:transparent;box-shadow:none}
.referral-copy img{width:18px;height:18px}
.referral-stats{display:flex;justify-content:space-evenly;padding:22px 20px}
.referral-stats>*{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;height:auto;min-height:0;padding:0;border:0;background:transparent;box-shadow:none;color:var(--lumo-text);text-align:center}
.referral-stat-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#8b5cf61a}
.referral-stat-icon img{width:24px;height:24px}
.referral-stat-green{background:#01d9031a}
.referral-stats strong{font:600 20px/1.2 var(--lumo-font)}
.referral-stats>div strong{font-weight:400}
.referral-stats small{font:400 10px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.referral-share{display:flex;align-items:center;justify-content:center;gap:10px;height:46px;min-height:46px;border-radius:10px;font:500 14px/1 var(--lumo-font)}
.referral-share img{width:24px;height:24px}
.referral-card h3{margin:0 0 10px;font:500 12px/1.3 var(--lumo-font);color:var(--lumo-text)}
.referral-tasks>p{margin:-6px 0 10px;font:400 11px/1.4 var(--lumo-font);color:var(--lumo-text-2)}
.referral-step{display:flex;gap:10px;align-items:flex-start;padding:6px 0}
.referral-step>span{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;border-radius:50%;background:#8b5cf61a;color:var(--lumo-primary);font:600 11px/1 var(--lumo-font)}
.referral-step strong{display:block;font:500 12px/1.3 var(--lumo-font);color:var(--lumo-text)}
.referral-step small{display:block;margin-top:2px;font:400 11px/1.35 var(--lumo-font);color:var(--lumo-text-2)}
.referral-rewards{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px;padding:10px 12px;border-radius:8px;background:var(--lumo-nested)}
.referral-rewards>div{display:flex;flex-direction:column;gap:2px}
.referral-rewards>div:last-child{text-align:right}
.referral-rewards small{font:400 11px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.referral-rewards strong{font:600 14px/1.3 var(--lumo-font);color:var(--lumo-primary)}

/* Mobile support_view: title block beside the headset, 88px option cards,
   security banner; the Mini App's legal links follow. */
.support-home .support-legal{padding-top:4px}
.section:has(.support-home)>.pagehead .lumo-header-title{visibility:hidden}
.support-home{gap:13px;font-family:var(--lumo-font)}
.support-hero{display:flex;align-items:center;gap:8px;min-height:104px;margin-bottom:15px}
.support-hero>div{flex:1;min-width:0}
.support-hero h2{margin:0;font:600 24px/1.25 var(--lumo-font);color:var(--lumo-text)}
.support-hero p{margin:5px 0 0;font:400 12px/1.4 var(--lumo-font);color:var(--lumo-text-2)}
.support-hero>img{flex:0 0 121px;width:121px;height:104px}
.support-option{display:flex;align-items:center;gap:10px;width:100%;min-height:88px;height:auto;padding:10px;border:0;border-radius:10px;background:var(--lumo-card);box-shadow:var(--lumo-shadow);color:var(--lumo-text);text-align:left;text-decoration:none;box-sizing:border-box}
.support-option>span:nth-child(2){flex:1;min-width:0}
.support-option strong{display:block;font:500 12px/1.3 var(--lumo-font);color:var(--lumo-text)}
.support-option small{display:block;margin-top:2px;font:400 10px/1.4 var(--lumo-font);color:var(--lumo-text-2)}
.support-option-icon{display:grid;place-items:center;flex:0 0 45px;width:45px;height:45px;border-radius:50%}
.support-option-icon img{width:24px;height:24px}
.support-tone-primary{background:#8b5cf61a}.support-tone-green{background:#01d9031a}.support-tone-info{background:#3478f61a}.support-tone-warning{background:#f5b83d1a}
.support-option-chevron{flex:0 0 16px;width:16px;height:16px;color:var(--lumo-text-2)}
.support-security{display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;background:#8b5cf61a}
.support-security>span{display:grid;place-items:center;flex:0 0 45px;width:45px;height:45px;border-radius:50%;background:#8b5cf633}
.support-security img{width:24px;height:24px}
.support-security strong{display:block;font:500 12px/1.3 var(--lumo-font);color:var(--lumo-text)}
.support-security small{display:block;margin-top:2px;font:400 10px/1.4 var(--lumo-font);color:var(--lumo-text-2)}

/* Mobile chat_view bubbles: incoming on the card with the top-left corner
   square, yours in purple with the bottom-right corner square, 10px radii,
   right-aligned and at most 280px wide. */
.section .chat-messages{max-height:none;gap:12px;font-family:var(--lumo-font)}
.section .chat-bubble{align-self:flex-start;max-width:280px;padding:12px 14px;border:0;border-radius:0 10px 10px 10px;background:var(--lumo-card);box-shadow:var(--lumo-shadow);color:var(--lumo-text);font:400 13.5px/1.4 var(--lumo-font)}
.section .chat-bubble strong{display:block;margin-bottom:2px;font:500 11.5px/1.3 var(--lumo-font);color:var(--lumo-primary)}
.section .chat-bubble.user{align-self:flex-end;border-radius:10px 10px 0 10px;background:var(--lumo-primary);color:#fff}
.section .chat-bubble.user strong{color:#ffffffcc}
.section .chat-bubble.user :is(p,small,span){color:#fff}
.section #pulseMessage{min-height:56px;border-radius:12px}
.section .chat-bubble.user button{color:#fff;opacity:.85}
html[data-lumo-theme=dark] .section .chat-bubble{border:0;background:var(--lumo-card);color:var(--lumo-text)}
html[data-lumo-theme=dark] .section .chat-bubble.user{background:var(--lumo-primary);color:#fff}
html[data-lumo-theme=dark] .section .chat-bubble.user :is(strong,p,small,span,button){color:#fff}

/* Pulse chat header (chat_view _buildHeader): back button, then the 32px
   Pulse avatar with "Pulse" (12/500) and "The Team Can Also Help" (7px)
   centred, and Clear (14/500, primary) on the right once there are
   messages. The shared header row stays for Back; its title is hidden. */
.section:has(>.pulse-chat-head)>.pagehead{position:relative;z-index:2;padding-top:16px;padding-bottom:8px;margin-bottom:-68px;pointer-events:none}
.section:has(>.pulse-chat-head)>.pagehead>.lumo-back{pointer-events:auto}
.section:has(>.pulse-chat-head)>.pagehead .lumo-header-title{visibility:hidden}
.pulse-chat-head{display:grid;grid-template-columns:44px minmax(0,1fr) minmax(44px,auto);align-items:center;height:68px;padding:16px 0 8px;box-sizing:border-box;margin-bottom:6px}
.pulse-chat-id{display:flex;align-items:center;justify-content:center;gap:7px;min-width:0}
.pulse-chat-avatar,.pulse-avatar{display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:var(--lumo-card);border:1px solid var(--lumo-border);box-sizing:border-box}
.pulse-chat-avatar{width:32px;height:32px}
.pulse-chat-avatar img{width:28px;height:28px}
.pulse-chat-names{display:flex;flex-direction:column;min-width:0}
.pulse-chat-names strong{font:500 12px/1.3 var(--lumo-font);color:var(--lumo-text)}
.pulse-chat-names small{font:400 7px/1.3 var(--lumo-font);color:var(--lumo-text-2);white-space:nowrap}
.pulse-chat-clear{justify-self:end;font:500 14px/1.2 var(--lumo-font);color:var(--lumo-primary)}
.pulse-chat-clear[hidden]{display:none}
.pulse-disclaimer{margin:0 0 8px;text-align:center;font:400 12px/1.4 var(--lumo-font);color:var(--lumo-text-3)}
.pulse-row{display:flex;align-items:flex-start;gap:10px}
.pulse-avatar{width:21px;height:21px}
.pulse-avatar img{width:17px;height:17px}
.section .pulse-row>.chat-bubble{flex:0 1 auto}
.pulse-intro p{white-space:pre-line}
.pulse-clear-actions{display:flex;gap:10px;padding:6px var(--lumo-gutter) 18px}
.pulse-clear-actions>button{flex:1}
/* Mobile TransactionsView: centred 16px title between the back arrow and the
   calendar button, 14px pill chips, a 40px chain selector, tiles 10px apart. */
.lumo-history .lumo-history-head{padding:12px 0 0;grid-template-columns:32px minmax(0,1fr) 32px}
.lumo-history .lumo-history-head h2{font:500 16px/1.3 var(--lumo-font)}
.lumo-history .lumo-history-head .lumo-icon-button{width:32px;height:32px;min-height:0;padding:0;border-radius:50%;background:var(--lumo-card);box-shadow:var(--lumo-shadow);color:var(--lumo-text)}
.lumo-history .lumo-history-head .lumo-icon-button svg{width:20px;height:20px}
.lumo-history .lumo-history-calendar{color:var(--lumo-primary)!important}
.lumo-history .lumo-history-calendar svg{width:15px!important;height:15px!important}
.lumo-history .lumo-history-calendar.active{background:var(--lumo-primary)!important;color:#fff!important}
.lumo-history-chips{display:flex;gap:14px;overflow-x:auto;margin-top:24px;scrollbar-width:none}
.lumo-history-sheet .lumo-history-chips{flex-wrap:wrap;gap:8px;margin-top:16px}
.lumo-history-chip{flex:none;min-height:0;padding:5px 15px;border-radius:100px;border:1px solid var(--lumo-chip-border);background:transparent;font:400 14px/1.3 var(--lumo-font);color:var(--lumo-text)}
.lumo-history-chip[aria-pressed=true]{border-color:transparent;background:var(--lumo-primary);color:#fff;font-weight:500}
.lumo-history-chain{display:flex;align-items:center;justify-content:space-between;width:100%;height:40px;min-height:0;margin-top:12px;padding:0 12px;border-radius:10px;border:1px solid var(--lumo-chip-border);background:var(--lumo-card);font:400 12px/1.2 var(--lumo-font);color:var(--lumo-text)}
.lumo-history-chain .lumo-chevron{width:20px;height:20px;color:var(--lumo-text-2)}
.lumo-history-range{display:block;min-height:0;margin-top:8px;padding:0;background:transparent;font:400 10px/1.3 var(--lumo-font);color:var(--lumo-primary)}
.lumo-history-sheet{margin-top:12px;padding:16px 20px 20px;border-radius:24px;background:var(--lumo-card);box-shadow:var(--lumo-shadow)}
.lumo-history-sheet strong{display:block;font:600 18px/1.3 var(--lumo-font);color:var(--lumo-text)}
.lumo-history-sheet p{margin:4px 0 0;font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.lumo-history .lumo-history-list{margin-top:16px}
.lumo-history [data-txrow][hidden]{display:none}
.lumo-history .lumo-history-none{padding-top:160px;text-align:center;font-size:14px}
/* Mobile SwitchWalletSheet rows: 10px card, 45px photo, 12px name,
   10px status (purple when not active) and the 8…6 short address. */
.wallet-manager-list{gap:9px}
.wallet-manager-card.lumo-wallet-row{padding:10px;border:0;border-radius:10px;background:var(--lumo-card);box-shadow:var(--lumo-shadow)}
.lumo-wallet-row .wallet-manager-heading{gap:10px}
.lumo-wallet-photo{flex:none;display:grid;place-items:center;width:45px;height:45px;border-radius:50%;background:var(--lumo-nested);overflow:hidden}
.lumo-wallet-photo img{width:30px;height:30px}
.lumo-wallet-row .wallet-manager-heading strong{font:500 12px/1.3 var(--lumo-font);color:var(--lumo-text)}
.lumo-wallet-row .wallet-manager-heading small{margin-top:2px;font:500 10px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.lumo-wallet-row .wallet-manager-heading small.lumo-wallet-saved{color:var(--lumo-primary)}
.lumo-wallet-row code{margin-top:2px;font:400 10px/1.3 var(--lumo-font);color:var(--lumo-text-2);background:none;padding:0}
.lumo-wallet-row .wallet-manager-active{font:500 12px/1.2 var(--lumo-font);color:var(--lumo-primary)}
.lumo-wallet-row [data-wallet-switch]{min-height:0;padding:8px 14px;border-radius:10px;font:500 12px/1.2 var(--lumo-font)}
.lumo-wallet-row .wallet-manager-actions{margin-top:6px;gap:16px}
.lumo-wallet-row .wallet-manager-actions .text-action{min-height:0;padding:4px 0;border:0;border-radius:0;background:none;box-shadow:none;font:500 12px/1.2 var(--lumo-font)}
html[data-lumo-theme=dark] .wallet-manager-card.lumo-wallet-row{background:var(--lumo-card);border:0}
html[data-lumo-theme=dark] .lumo-wallet-row code,html[data-lumo-theme=dark] .lumo-wallet-row .wallet-manager-heading small:not(.lumo-wallet-saved){color:var(--lumo-text-2)}
.lumo-wallet-row .wallet-manager-actions .text-action.danger{color:var(--lumo-red)}
/* Mobile LumoGiftCardStore: "My cards" text action, the 12px-radius search
   field with the country button, and 16px-radius brand tiles with a white
   logo box, the brand name and the face-value hint. */
.gift-store{display:grid;gap:12px}
.gift-store .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0}
.gift-store-top{display:flex;justify-content:flex-end;margin-top:-6px}
.gift-store-top .text-action{min-height:0;padding:4px 0;font:600 14px/1.2 var(--lumo-font);color:var(--lumo-primary)}
.gift-store-search{display:flex;gap:8px;align-items:stretch}
.gift-store-field{flex:1;min-width:0;display:flex;align-items:center;gap:8px;height:44px;margin:0;padding:0 12px;border-radius:12px;border:1px solid var(--lumo-chip-border);background:var(--lumo-card)}
.gift-store-field svg,.gift-store-country svg{flex:none;width:20px;height:20px;color:var(--lumo-text-2)}
.gift-store-country svg{width:18px;height:18px;color:var(--lumo-primary)}
.gift-store-field input{flex:1;min-width:0;height:100%;margin:0;padding:0;border:0;background:transparent;box-shadow:none;font:400 14px var(--lumo-font);color:var(--lumo-text)}
.gift-store-field input:focus{outline:none}
.gift-store-country{flex:none;display:flex;align-items:center;gap:6px;height:44px;margin:0;padding:0 10px;border-radius:12px;border:1px solid var(--lumo-chip-border);background:transparent;max-width:42%}
.gift-store-country{position:relative;font:500 14px var(--lumo-font);color:var(--lumo-primary)}
.gift-store-country{width:auto;min-height:0;box-shadow:none;cursor:pointer}
/* Mobile _CountrySheet: title, search field, then the country list. */
.gift-country-search{display:flex;align-items:center;gap:8px;height:44px;margin:0 var(--lumo-gutter,16px) 8px;padding:0 12px;border-radius:12px;border:1px solid var(--lumo-chip-border);background:var(--lumo-card)}
.gift-country-search svg{flex:none;width:20px;height:20px;color:var(--lumo-text-2)}
.gift-country-search input{flex:1;min-width:0;height:100%;margin:0;padding:0;border:0;background:transparent;box-shadow:none;font:400 14px var(--lumo-font);color:var(--lumo-text)}
.gift-country-search input:focus{outline:none}
.gift-country-list{display:flex;flex-direction:column}
.gift-country-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px;margin:0;padding:10px var(--lumo-gutter,16px);border:0;border-radius:0;background:transparent;box-shadow:none;text-align:left;font:400 16px/1.3 var(--lumo-font);color:var(--lumo-text)}
.gift-country-row small{flex:none;font:400 14px var(--lumo-font);color:var(--lumo-text-2)}
.gift-country-row.selected{color:var(--lumo-primary);font-weight:600}
.gift-store-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:4px}
.gift-store-tile{display:flex;flex-direction:column;align-items:stretch;gap:0;min-height:0;aspect-ratio:.95;padding:12px;border-radius:16px;border:1px solid var(--lumo-chip-border);background:var(--lumo-card);text-align:left;color:var(--lumo-text)}
.gift-store-logo{flex:1;display:grid;place-items:center;border-radius:10px;background:#fff;color:var(--lumo-primary);padding:8px}
.gift-store-logo svg{width:28px;height:28px}
.gift-store-tile strong{margin-top:8px;font:600 14px/1.3 var(--lumo-font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gift-store-tile small{font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Mobile BuySellModeToggle: 50px nested-fill track, 10px radius, the active
   side filled purple with white 12px text. */
.ramp-mode{height:50px;gap:0;padding:4px;border-radius:10px;background:var(--lumo-nested)}
.ramp-mode button{min-height:0;height:100%;padding:0;border:0;border-radius:8px;background:transparent;box-shadow:none;font:500 12px/1 var(--lumo-font);color:var(--lumo-text)}
.ramp-mode button.primary{background:var(--lumo-primary);color:#fff;box-shadow:none}
/* Provider tiles: the logo stays clear of the chevron and inside the tile. */
.ramp-provider .provider-mark{padding-right:18px;box-sizing:border-box;overflow:hidden}
.ramp-provider .provider-mark img{max-width:100%}
html[data-lumo-theme=dark] .ramp-mode{background:var(--lumo-nested)}
/* Dark theme: the providers' dark wordmarks sit on a white plate (mobile
   swaps OnRamp's black logo for a white copy for the same reason). */
html[data-lumo-theme=dark] .ramp-provider .provider-mark{width:calc(100% - 18px);height:40px;padding:6px 10px;border-radius:8px;background:#fff}
html[data-lumo-theme=dark] .ramp-mode button:not(.primary){color:var(--lumo-text)}
html[data-lumo-theme=dark] .ramp-provider .provider-mark img{width:100%;height:28px;max-height:28px;max-width:100%;object-fit:contain;object-position:left center}
/* Mobile swap _AssetButton: a purple-tint pill with the 26px coin, the
   13px symbol over the 9px network and a caret; the native select covers
   the pill so a tap still opens the asset list. */
.swap-asset-row .swap-asset-picker,.ramp-amount-line .swap-asset-picker,.ramp-chip .swap-asset-picker{position:relative;max-width:62%;padding:6px 10px 6px 6px;border-radius:100px;background:color-mix(in srgb,var(--lumo-primary) 8%,transparent)}
.swap-asset-row .swap-asset-picker>div:last-child,.ramp-amount-line .swap-asset-picker>div:last-child,.ramp-chip .swap-asset-picker>div:last-child{position:absolute;inset:0;width:auto!important;margin:0}
.swap-asset-row .swap-asset-picker>div:last-child label,.ramp-amount-line .swap-asset-picker>div:last-child label,.ramp-chip .swap-asset-picker>div:last-child label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.swap-asset-row .swap-asset-picker select,.ramp-amount-line .swap-asset-picker select,.ramp-chip .swap-asset-picker select{position:absolute;inset:0;width:100%;height:100%;max-width:none;opacity:0;cursor:pointer}
.swap-picked-coin{display:grid;grid-template-columns:26px auto 12px;grid-template-rows:auto auto;column-gap:6px;align-items:center}
.swap-picked-coin img{grid-row:1/3;width:26px!important;height:26px!important}
.swap-picked-coin span{font:600 13px/1.2 var(--lumo-font)!important;color:var(--lumo-text)}
.swap-picked-coin small{grid-column:2;font:400 9px/1.2 var(--lumo-font);color:var(--lumo-text-2);max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.swap-picked-coin small:empty{display:none}
.swap-picked-caret{grid-column:3;grid-row:1/3;width:12px;height:12px;color:var(--lumo-text)}
.ramp-amount-line>div:has(>select){flex:none}
.ramp-amount-line select{min-width:92px}
/* Mobile InvoiceListDesign: BizStatTile (32px tinted circle, 16px icon in
   the stat colour), the 44px BizSearchField and its 8px radius. */
.invoice-stat{border-radius:12px;background:var(--lumo-card)}
.invoice-stat>span{width:32px;height:32px;background:color-mix(in srgb,currentColor 12%,transparent)}
.invoice-stat>span svg{width:16px;height:16px}
.invoice-stat-all>span{color:var(--lumo-text)}
.invoice-stat-paid>span{color:#8b5cf6}
.invoice-stat-pending>span{color:#b57915}
.invoice-stat-overdue>span{color:#d43a49}
.biz-search{display:flex;align-items:center;height:44px;margin:0;border-radius:8px;background:var(--lumo-card);border:1px solid var(--lumo-chip-border)}
.biz-search svg{flex:none;width:20px;height:20px;margin:0 12px;color:var(--lumo-text-2)}
.biz-search input{flex:1;min-width:0;height:100%;margin:0;padding:0 12px 0 0;border:0;background:transparent;box-shadow:none;font:400 13px var(--lumo-font);color:var(--lumo-text)}
.biz-search input:focus{outline:none}
/* Mobile BusinessSettingsView (Figma 329:2488): the 63px round logo card,
   12px group labels, and compact rows (18px icon, 12px title, 6px padding)
   in one 10px-radius card per group. */
.business-home-settings .business-home-profile{gap:11px;padding:10px;border:0;border-radius:15px;background:var(--lumo-card);box-shadow:var(--lumo-shadow)}
.business-home-settings .business-home-profile>img{width:63px;height:63px;padding:16px;border-radius:50%;background:color-mix(in srgb,var(--lumo-primary) 12%,transparent)}
.business-home-settings .business-home-profile strong{font:500 18px/1.25 var(--lumo-font);color:var(--lumo-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.business-home-settings .business-home-profile small{margin-top:5px;font:400 10px/1.3 var(--lumo-font);color:#68656f}
.business-home-settings section>h3{margin:0 0 10px;font:500 12px/1.3 var(--lumo-font);color:#68656f}
.business-home-settings .business-home-settings-group{padding:6px 15px;border:0;border-radius:10px;background:var(--lumo-card);box-shadow:var(--lumo-shadow);overflow:hidden}
.business-home-settings .business-home-row{gap:10px;min-height:0;padding:6px 0;border:0!important;background:transparent;font:500 12px/1.4 var(--lumo-font);color:var(--lumo-text)}
.business-home-settings .business-home-row>span:nth-of-type(1){flex:1}
.business-home-row-icon{flex:none;width:18px;height:18px;color:var(--lumo-text)}
.business-home-settings .business-home-row span:last-child{font-size:18px;color:var(--lumo-text-2)}
html[data-lumo-theme=dark] .business-home-settings section>h3,html[data-lumo-theme=dark] .business-home-settings .business-home-profile small{color:var(--lumo-text-2)}
html[data-lumo-theme=dark] .business-home-settings .business-home-settings-group{border:1px solid #ffffff14}
/* Buy & Sell (mobile buy_sell_view.dart): amount card, provider tiles with
   quotes, fee card, payment method and "Continue with {provider}". */
.ramp-buy-sell{gap:10px}
.ramp-buy-sell .ramp-mode{margin-bottom:5px}
.ramp-card{display:flex;flex-direction:column;gap:0;padding:10px;border-radius:var(--lumo-r-card,20px);background:var(--lumo-card);box-shadow:var(--lumo-shadow)}
.ramp-buy-sell .ramp-amount-row{display:flex;align-items:center;gap:8px;padding:12px 2px;margin:0;min-width:0;border-top:0}
.ramp-buy-sell .ramp-amount-row+.ramp-amount-row{border-top:1px solid var(--lumo-divider)}
.ramp-buy-sell .ramp-amount-row>div:first-child{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.ramp-buy-sell .ramp-amount-row label,.ramp-buy-sell .ramp-row-label{margin:0;font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.ramp-buy-sell #rampAmount{width:100%;min-width:0;padding:0;border:0;background:transparent;box-shadow:none;font:500 24px/1.2 var(--lumo-font);color:var(--lumo-text);outline:none}
.ramp-buy-sell .ramp-estimate{font:500 24px/1.2 var(--lumo-font);color:var(--lumo-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ramp-buy-sell .ramp-amount-row small{font:400 10px/1.35 var(--lumo-font);color:var(--lumo-text-3)}
.ramp-buy-sell .ramp-amount-row small:empty{display:none}
.ramp-chip{flex:none;display:flex;flex-direction:column;align-items:center;gap:4px;max-width:52%}
.ramp-chip .swap-asset-picker{max-width:100%!important;padding:6px 10px 6px 6px}
.ramp-fiat-chip{position:relative;display:flex;align-items:center;gap:6px;padding:6px 10px 6px 6px;border-radius:100px;background:color-mix(in srgb,var(--lumo-primary) 10%,var(--lumo-card));font:500 14px/1 var(--lumo-font);color:var(--lumo-text)}
.ramp-flag{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1px solid var(--lumo-border);background:var(--lumo-nested);font-size:13px;line-height:1;overflow:hidden}
.ramp-fiat-chip select{min-width:0;width:auto;padding:0 16px 0 0;border:0;background:transparent;box-shadow:none;font:500 14px/1.2 var(--lumo-font);color:var(--lumo-text);appearance:auto}
.ramp-fiat-chip select:disabled{opacity:1}
.ramp-fiat-lock{font:400 9px/1.2 var(--lumo-font);color:var(--lumo-text-3)}
.ramp-fiat-lock:empty{display:none}
.ramp-buy-sell .provider-fast{margin-top:10px;padding:10px;border-radius:10px;background:color-mix(in srgb,var(--lumo-primary) 10%,transparent)}
.ramp-buy-sell .fast-shield{display:grid;place-items:center;flex:none;width:45px;height:45px;border-radius:50%;background:color-mix(in srgb,var(--lumo-primary) 20%,transparent);color:var(--lumo-primary);font-weight:700}
.ramp-buy-sell .provider-fast strong{font:500 12px/1.3 var(--lumo-font);color:var(--lumo-text)}
.ramp-buy-sell .provider-fast small{font:400 10px/1.35 var(--lumo-font);color:var(--lumo-text-2)}
.ramp-choose{margin:20px 0 10px;font:500 12px/1.3 var(--lumo-font);color:var(--lumo-text)}
.ramp-best{margin:0 0 8px!important;font:600 11px/1.3 var(--lumo-font);color:var(--lumo-primary)}
.ramp-best:empty{display:none}
.ramp-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding-top:6px}
.ramp-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:84px;min-width:0;padding:9px 6px;border:1px solid var(--lumo-divider);border-radius:10px;background:var(--lumo-card);box-shadow:none;color:var(--lumo-text)}
.ramp-tile.best{border-color:color-mix(in srgb,var(--lumo-primary) 55%,transparent)}
.ramp-tile.selected{border:1.5px solid var(--lumo-primary)}
.ramp-tile .provider-mark{justify-content:center;width:100%;height:30px;padding:0;background:transparent}
.ramp-tile .provider-mark img{max-width:100%;max-height:22px;object-position:center}
.ramp-tile small{max-width:100%;font:400 10px/1.3 var(--lumo-font);color:var(--lumo-text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ramp-tile.best small{font-weight:600;color:var(--lumo-primary)}
.ramp-tile-badge{position:absolute;top:-8px;left:50%;transform:translateX(-50%);padding:2px 7px;border-radius:20px;background:var(--lumo-primary);color:#fff;font:700 9px/1.3 var(--lumo-font);white-space:nowrap}
.ramp-buy-sell #rampNotes{margin-top:8px!important;font-size:10px}
.ramp-buy-sell #rampNotes:empty{display:none}
.ramp-fees{padding:14px 10px}
.ramp-fee-row{display:flex;align-items:center;gap:8px;padding:5.5px 0;font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text)}
.ramp-fee-row span{display:flex;align-items:center;gap:5px;flex:1;min-width:0}
.ramp-fee-row i{display:grid;place-items:center;width:12px;height:12px;border:1px solid var(--lumo-text-3);border-radius:50%;font:600 8px/1 var(--lumo-font);font-style:normal;color:var(--lumo-text-3)}
.ramp-fee-row b{font-weight:400;text-align:right;overflow-wrap:anywhere}
.ramp-fee-row b.good{color:var(--lumo-green)}
.ramp-fee-row.strong,.ramp-fee-row.strong b{font-weight:600}
.ramp-method{display:flex;align-items:center;gap:8px;margin:0;padding:12px 14px;border-radius:var(--lumo-r-card,20px);background:var(--lumo-card);box-shadow:var(--lumo-shadow)}
.ramp-method span{flex:1;font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.ramp-method select{min-height:0;height:auto;width:auto;max-width:60%;padding:0 18px 0 0;border:0;background:transparent;box-shadow:none;font:500 12px/1.3 var(--lumo-font);color:var(--lumo-text);text-align:right}
#rampMethodWrap:empty{display:none}
.ramp-continue{margin-top:10px}
.ramp-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:48px 0;text-align:center}
.ramp-empty strong{font:600 16px/1.3 var(--lumo-font);color:var(--lumo-text)}
.ramp-empty p{font:400 13px/1.4 var(--lumo-font);color:var(--lumo-text-2)}
html[data-lumo-theme=dark] .ramp-tile .provider-mark{height:30px;padding:3px 6px;border-radius:6px;background:#fff}
/* Transaction History: mobile's range pill, "Custom range" and the Swap chip's history links. */
.lumo-history-range{display:inline-flex!important;align-items:center;gap:6px;width:auto;margin-top:10px!important;padding:5px 10px!important;border-radius:100px;background:color-mix(in srgb,var(--lumo-primary) 10%,transparent)!important;font:500 12px/1.3 var(--lumo-font)!important}
.lumo-history-range svg{width:14px;height:14px}
.lumo-history-range b{font-weight:500}
.lumo-history-custom{display:flex;align-items:center;gap:10px;width:100%;min-height:0;margin-top:14px;padding:12px 14px;border-radius:12px;border:1px solid var(--lumo-chip-border);background:transparent;box-shadow:none;font:500 14px/1.3 var(--lumo-font);color:var(--lumo-text);text-align:left}
.lumo-history-custom[aria-pressed=true]{border-color:var(--lumo-primary)}
.lumo-history-custom svg{width:18px;height:18px;color:var(--lumo-primary)}
.lumo-history-custom span{flex:1}
.lumo-history-custom b{color:var(--lumo-text-2);font-weight:400}
.lumo-history-custom-form{display:flex;flex-direction:column;gap:12px;margin-top:14px}
.lumo-history-custom-form[hidden]{display:none}
.lumo-history-custom-title{font:600 14px/1.3 var(--lumo-font);color:var(--lumo-text)}
.lumo-history-dates{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.lumo-history-dates label{display:flex;flex-direction:column;gap:6px;font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.lumo-history-dates input{width:100%;min-width:0;box-sizing:border-box}
.lumo-history-custom-error{color:var(--lumo-red)!important}
.lumo-history-swaps{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.lumo-history-swap{display:flex;align-items:center;gap:12px;width:100%;min-height:0;padding:12px 14px;border-radius:12px;border:0;background:var(--lumo-card);box-shadow:var(--lumo-shadow);text-align:left;color:var(--lumo-text)}
.lumo-history-swap-icon{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;background:color-mix(in srgb,var(--lumo-primary) 12%,transparent);color:var(--lumo-primary);font-size:18px}
.lumo-history-swap>span:nth-child(2){display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.lumo-history-swap strong{font:500 14px/1.3 var(--lumo-font)}
.lumo-history-swap small{font:400 12px/1.3 var(--lumo-font);color:var(--lumo-text-2)}
.lumo-history-swap b{color:var(--lumo-text-2);font-weight:400}
/* Service directory glyphs: the profile menu's service-row icon (purple outline SVG, 30px in a 32px box). */
.feature-link>.feature-symbol.service-glyph{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;font-size:0;background:transparent;color:var(--lumo-primary)}
.feature-symbol.service-glyph .icon{width:30px;height:30px;stroke-width:1.6}
html[data-lumo-theme=dark] .feature-link>.feature-symbol.service-glyph{color:#c5a6f9}
.lumo-history-swap-icon .icon{width:18px;height:18px}
:is(.feature-symbol,.nft-library-placeholder,.nft-library-detail-mark,.invoice-record-icon,.pulse-tour-mark,.pulse-nudge-mark,.premium-checkout-mark,.fast-shield,.provider-check,.backup-reminder-icon,.payout-stat-icon,.business-application-status-mark,.ghost-outcome>span,.setup-check,.profile-menu-chevron,.business-notification-chevron,.invoice-customer-choice>span,.invoice-next>span)>.icon{width:1em;height:1em}
.tx-direction-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:currentColor;margin-right:6px;vertical-align:middle}
.setup-skip .icon,#phoneVerifiedRow .icon,.premium-coupon-applied .icon{width:1em;height:1em;vertical-align:-.15em}