/* Mobile Family 12: ActivityDesignTile, LoyaltyDesignScreen and MerchantDesignScreen.
   All geometry scales with the shared device. No selectors affect legacy phones. */
.danta-ui .dui-tier--road { --dui-tier: #173f31; }
.danta-ui .dui-tier--bronze { --dui-tier: #b46a3c; }
.danta-ui .dui-tier--silver { --dui-tier: #87909b; }
.danta-ui .dui-tier--gold { --dui-tier: #d5a11e; }
.dui-merchant-avatar { position:relative; display:grid; flex:none; place-items:center; width:4.125em; height:4.125em; padding:.4em; border:.15625em solid var(--dui-tier,var(--dui-line)); border-radius:50%; }
.dui-merchant-avatar>span { display:grid; place-items:center; width:100%; height:100%; border-radius:50%; background:var(--dui-soft); font-size:1em; font-weight:700; }
.dui-merchant-avatar>.dui-icon { position:absolute; top:-.6em; left:calc(50% - .74em); width:1.48em; height:1.48em; padding:.08em; color:var(--dui-tier); background:var(--dui-paper); }
.dui-merchant-avatar.dui-tier--road { border-color:var(--dui-line); }
.dui-merchant-avatar.is-plain { width:3em; height:3em; border:0; padding:0; }
.dui-merchant-avatar.is-plain>span { font-size:.875em; }
.dui-loyalty-mark { position:relative; display:inline-block; flex:none; width:1.5em; height:1.5em; color:var(--dui-tier); }
.dui-loyalty-mark>.dui-mark { position:absolute; bottom:0; left:10%; width:80%; height:80%; }
.dui-loyalty-mark>.dui-icon { position:absolute; top:-2%; left:35%; width:30%; height:30%; filter:drop-shadow(0 .06em .08em #0003); }
.dui-active-badge { position:relative; display:inline-grid; place-items:center; width:1.875em; height:1.875em; color:var(--dui-ink); }
.dui-active-badge svg { position:absolute; inset:0; width:100%; height:100%; }
.dui-active-badge b { position:relative; color:white; font-size:.54em; line-height:1; }

.dui-activity-heading { flex:none; padding:.75em 1em 0; }
.dui-activity-heading h2 { font-size:1.625em; }
.dui-activity-heading .dui-heading { margin-bottom:.25em; }
.dui-activity-history { padding:0 .75em; }
.dui-day-header { display:flex; align-items:center; gap:.75em; margin:.75em 1em .4em; }
.dui-day-header b { max-width:80%; padding:.55em 1.16em; border-radius:1em; background:var(--dui-soft); font-size:.75em; line-height:1.3; }
.dui-day-header i { flex:1; height:1px; background:var(--dui-line); }
.dui-activity-row { display:flex; align-items:flex-start; gap:.75em; padding:.8em 1em 1em; }
.dui-activity-body { flex:1; min-width:0; }
.dui-activity-identity { display:flex; align-items:flex-start; justify-content:space-between; gap:.75em; }
.dui-activity-identity>strong { flex:1; min-width:0; font-size:1em; line-height:1.3; }
.dui-activity-identity>b { flex:none; font-size:1.0625em; line-height:1.25; white-space:nowrap; }
.dui-activity-meta { display:flex; justify-content:space-between; align-items:center; gap:.6em; margin-top:.44em; }
.dui-activity-meta>small { flex:none; font-size:.68em; color:var(--dui-muted); }
.dui-cashback-chip { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:.35em; padding:.35em .5em; border-radius:.75em; background:var(--dui-soft); }
.dui-cashback-chip>span:last-child { font-size:.72em; font-weight:700; white-space:nowrap; }
.dui-cashback-chip .dui-loyalty-mark { width:1.35em; height:1.35em; }
.dui-activity-group+.dui-activity-group .dui-activity-body { border-top:0; }

.dui-level-content { padding:.75em 1.25em 1em; }
.dui-levels .dui-heading h2, .dui-level-detail .dui-heading h2 { font-size:1.375em; font-weight:400; }
.dui-levels .dui-heading, .dui-level-detail .dui-heading { margin-bottom:1em; }
.danta-ui .dui-levels-title { font-size:1.94em; line-height:1.1; letter-spacing:-.022em; }
.danta-ui .dui-levels-intro { margin:.875em 0 1.625em; color:var(--dui-muted); font-size:.875em; line-height:1.45; }
.dui-merchant-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.625em; padding:.4em 0 0; margin-bottom:1.75em; }
.dui-merchant-grid>div { display:flex; flex-direction:column; align-items:center; text-align:center; min-width:0; }
.dui-merchant-grid .dui-merchant-avatar { width:3.75em; height:3.75em; }
.dui-merchant-grid strong { margin-top:.875em; font-size:.75em; font-weight:400; line-height:1.3; }
.dui-merchant-grid small { margin-top:.45em; color:var(--dui-muted); font-size:.69em; }
.dui-loyalty-notice { padding:1.25em; border-radius:1.375em; background:var(--dui-soft); }
.dui-loyalty-notice h3 { font-size:1.3125em; }
.danta-ui .dui-loyalty-notice p { margin-top:.625em; font-size:.875em; line-height:1.45; }
.dui-map-link { display:flex; align-items:center; justify-content:center; gap:.5em; margin-top:1.375em; font-size:.875em; }
.dui-map-link .dui-icon { width:1.375em; height:1.375em; }
.danta-ui .dui-level-shop { font-size:1.6875em; line-height:1.15; }
.dui-level-portrait { display:grid; justify-content:center; margin:1.375em 0 1.5em; }
.dui-level-portrait .dui-merchant-avatar { width:6.875em; height:6.875em; padding:.5em; }
.dui-level-portrait .dui-merchant-avatar>span { font-size:1.72em; }
.danta-ui .dui-level-name { font-size:1.4375em; }
.dui-active-line { display:flex; align-items:center; gap:.5em; margin-top:.875em; font-size:.875em; }
.danta-ui .dui-level-expiry { margin:1em 0 1.5em; font-size:.8125em; line-height:1.4; color:var(--dui-muted); }
.dui-level-detail .dui-loyalty-notice { padding:1.125em 1.25em; }
.dui-next-level { margin-top:1.25em; }
.dui-next-level h3 { font-size:1.3125em; }
.danta-ui .dui-next-level p { margin-top:.5em; font-size:.875em; color:var(--dui-muted); }
.dui-level-map-action { margin-top:1.5em; font-size:.875em; }
.dui-level-detail .dui-nav { margin-top:.5em; }

.danta-device[data-current-screen="mapa"] .dui-status { background:var(--dui-ink); color:white; }
.dui-merchants { overflow:hidden; }
.dui-merchant-header { flex:none; padding:.625em 1.25em 1.25em; border-radius:0 0 1.875em 1.875em; background:var(--dui-ink); color:white; }
.dui-merchant-header .dui-heading { margin-bottom:1em; min-height:2.5em; gap:1.2em; }
.dui-merchant-header .dui-heading h2 { font-size:1.125em; font-weight:700; }
.dui-merchant-header>h3 { font-size:1.75em; letter-spacing:-.025em; line-height:1.15; }
.dui-search-field { display:flex; gap:1em; align-items:center; min-height:3.5em; margin-top:1.125em; padding:.875em; border-radius:1.125em; color:var(--dui-muted); background:white; }
.dui-search-field .dui-icon { width:1.35em; height:1.35em; }
.dui-search-field span { font-size:1em; }
.dui-map-tools { flex:none; display:flex; align-items:center; justify-content:space-between; padding:.75em 1.25em .75em; }
.dui-map-tools>span { display:flex; align-items:center; gap:.5em; padding:.65em .7em; font-size:.875em; font-weight:700; }
.dui-map-tools>span:last-child { border:1px solid var(--dui-line); border-radius:2em; background:white; }
.dui-map-tools .dui-icon { width:1.2em; height:1.2em; }
.dui-map-viewport { flex:none; margin:0 1.25em; }
.dui-map-art { position:relative; height:15.5em; border-radius:1.5em; overflow:hidden; background:#e9eee5; }
.dui-map-roads { position:absolute; inset:0; width:100%; height:100%; }
.dui-map-pin { position:absolute; width:4.15em; height:4.6em; transform:translate(-50%,-50%); }
.dui-map-pin[data-selected="true"] { z-index:1; }
.dui-map-seal { position:relative; display:block; width:100%; height:100%; color:var(--dui-tier); }
.dui-map-seal>svg { position:absolute; inset:0; width:100%; height:100%; }
.dui-map-seal>.dui-mark { position:absolute; left:24.0526%; top:27.7143%; width:51.8947%; height:46.9524%; }
.dui-map-expand { position:absolute; top:.625em; right:.625em; display:grid; place-items:center; width:2em; height:2em; border-radius:.5em; background:white; box-shadow:0 .2em .6em #173f3120; }
.dui-map-expand .dui-icon { width:1.2em; height:1.2em; }
.dui-map-results-heading { display:flex; align-items:center; gap:.75em; justify-content:space-between; margin:1em 1.25em .8em; }
.dui-map-results-heading h3 { font-size:1.375em; letter-spacing:-.015em; }
.dui-map-results-heading>b { padding:.25em .75em; border-radius:2em; background:var(--dui-soft); }
.dui-merchant-card { flex:none; margin:0 1.25em; padding:1.1em 1em 1em; border:.09375em solid var(--dui-ink); border-radius:1.375em; background:white; }
.dui-merchant-card-top { display:flex; align-items:flex-start; gap:.75em; }
.dui-merchant-card-top>.dui-merchant-avatar { width:3.625em; height:3.625em; }
.dui-merchant-card-top>.dui-merchant-avatar>.dui-icon { background:white; }
.dui-merchant-card-top>div { flex:1; min-width:0; display:grid; gap:.3em; }
.dui-merchant-card-top strong { font-size:1.125em; line-height:1.2; }
.dui-merchant-card-top small { font-size:.8125em; color:var(--dui-muted); }
.dui-merchant-card-top>.dui-icon { width:1.25em; height:1.25em; margin-top:.1em; }
.dui-merchant-benefit { display:flex; align-items:center; gap:.5em; margin-top:1em; padding:.625em .875em; border-radius:1em; background:var(--dui-soft); }
.dui-merchant-benefit>span:not(.dui-loyalty-mark) { flex:1; font-size:.875em; font-weight:700; }
.dui-merchant-benefit>strong { font-size:1.5em; line-height:1.2; }
.dui-merchant-address { display:flex; align-items:center; gap:.375em; margin-top:.75em; color:var(--dui-muted); font-size:.75em; }
.dui-merchant-address .dui-icon { width:1.2em; height:1.2em; }
