/* V157.3 — Mobile app visual system. Additive overrides; data and business logic remain in PHP. */
:root{
 --v157-red:#c8102e;--v157-red-dark:#970b25;--v157-ink:#171b24;--v157-muted:#6f7784;
 --v157-line:rgba(28,38,54,.10);--v157-glass:rgba(255,255,255,.72);
 --v157-shadow:0 12px 34px rgba(25,34,48,.09);--v157-radius:23px;
}
.sf-layout{background:#f3f5f8!important}
.sf-main{max-width:100%;min-width:0}
.sf-topbar{position:relative;z-index:30}
.sf-user-menu-wrap{position:relative;z-index:100}
.sf-user-menu{
 position:absolute!important;right:0!important;top:calc(100% + 10px)!important;z-index:10000!important;
 min-width:190px!important;padding:7px!important;border:1px solid rgba(255,255,255,.75)!important;
 border-radius:17px!important;background:rgba(255,255,255,.94)!important;
 backdrop-filter:blur(22px) saturate(150%)!important;-webkit-backdrop-filter:blur(22px) saturate(150%)!important;
 box-shadow:0 18px 44px rgba(20,25,36,.18)!important;
}
.sf-user-menu[hidden]{display:none!important}
.sf-user-menu a{display:flex!important;align-items:center!important;gap:11px!important;padding:12px 13px!important;
 border-radius:12px!important;color:#303744!important;text-decoration:none!important;font-size:13px!important;font-weight:700!important}
.sf-user-menu a:hover,.sf-user-menu a:focus{background:#fff0f2!important;color:var(--v157-red)!important}
.sf-user-menu .sf-user-logout{color:var(--v157-red)!important;border-top:1px solid #f0e8ea!important;margin-top:4px!important}
.sf-profile{cursor:pointer!important}
.sf-profile:focus-visible{outline:3px solid rgba(200,16,46,.22)!important;outline-offset:3px!important}

/* New Home: wide mountain image, circular progress, next activity and current phase. */
.v157-home{display:grid;gap:15px;max-width:900px;margin:0 auto}
.v157-mountain-hero{min-height:184px;position:relative;overflow:hidden;isolation:isolate;display:flex;align-items:flex-end;
 padding:22px;border-radius:26px;color:#fff;background-image:linear-gradient(90deg,rgba(8,14,25,.70),rgba(8,14,25,.12)),var(--v157-hero-image);
 background-size:cover;background-position:center 48%;box-shadow:0 15px 34px rgba(23,31,45,.15)}
.v157-hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(7,12,23,.58),transparent 76%)}
.v157-hero-content{max-width:78%;position:relative;z-index:1}
.v157-hero-eyebrow,.v157-eyebrow{display:block;font-size:9px;font-weight:850;letter-spacing:.13em;text-transform:uppercase;color:#87909d}
.v157-hero-eyebrow{color:rgba(255,255,255,.82)}
.v157-hero-content h2{font-size:clamp(20px,5.5vw,27px);line-height:1.12;letter-spacing:-.045em;margin:8px 0 5px;color:#fff}
.v157-hero-content p{font-size:11px;line-height:1.45;margin:0;color:rgba(255,255,255,.88)}
.v157-hero-mark{position:absolute;right:18px;top:17px;width:39px;height:39px;border-radius:14px;display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.20);border:1px solid rgba(255,255,255,.32);backdrop-filter:blur(14px)}
.v157-progress-card,.v157-next-card,.v157-current-card,.v157-summary-card,.v157-metals-card{
 background:rgba(255,255,255,.88);border:1px solid rgba(255,255,255,.92);border-radius:var(--v157-radius);
 box-shadow:var(--v157-shadow);padding:18px;min-width:0;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)
}
.v157-progress-heading,.v157-card-heading{display:flex;align-items:center;gap:12px;min-width:0}
.v157-progress-heading{justify-content:space-between;align-items:flex-start}
.v157-progress-heading h2,.v157-card-heading h2{font-size:15px;line-height:1.3;letter-spacing:-.025em;margin:4px 0 0;color:#202631}
.v157-live-pill{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:99px;background:#e9f8ef;color:#167c48;font-size:10px;font-weight:800}
.v157-live-pill i,.v157-metal-source>i{width:7px;height:7px;border-radius:50%;background:#22b76b;box-shadow:0 0 0 4px rgba(34,183,107,.12)}
.v157-progress-layout{display:flex;align-items:center;gap:19px;margin:19px 0 15px}
.v157-progress-ring{width:148px;height:148px;flex:0 0 148px;border-radius:50%;display:grid;place-items:center;position:relative;
 background:conic-gradient(var(--v157-red) var(--v157-progress),#f2dfe3 0);box-shadow:0 8px 20px rgba(200,16,46,.12)}
.v157-progress-ring:before{content:"";position:absolute;inset:10px;border-radius:50%;background:linear-gradient(145deg,#fff,#f8f9fb);box-shadow:inset 0 2px 8px rgba(26,32,43,.06)}
.v157-ring-inner{position:relative;z-index:1;display:grid;justify-items:center;gap:4px}
.v157-ring-inner strong{font-size:25px;letter-spacing:-.055em;color:#1c222c;font-variant-numeric:tabular-nums}
.v157-ring-inner small{font-size:9px;color:#808894;font-weight:750;text-transform:uppercase;letter-spacing:.08em}
.v157-progress-meta{display:grid;gap:8px;min-width:0}
.v157-progress-meta strong{font-size:14px;color:#1e2631}
.v157-progress-meta span{font-size:10px;line-height:1.5;color:#697382}
.v157-progress-meta span i{color:#17945a;margin-right:4px}
.v157-progress-meta small{font-size:9px;color:#8a929d}
.v157-progress-track,.v157-mini-track{height:7px;background:#f0e8ea;border-radius:99px;overflow:hidden}
.v157-progress-track i,.v157-mini-track i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#a90c2a,#ef3154);transition:width .7s cubic-bezier(.2,.7,.2,1)}
.v157-card-heading{align-items:center}
.v157-icon-tile{width:39px;height:39px;flex:0 0 39px;display:grid;place-items:center;border-radius:14px;background:#fff0f2;color:var(--v157-red);font-size:16px}
.v157-icon-tile.red{background:linear-gradient(145deg,#e51b42,#b80b2b);color:#fff;box-shadow:0 7px 16px rgba(200,16,46,.2)}
.v157-card-heading>div{min-width:0;flex:1}
.v157-card-arrow{color:#9ba2ad;font-size:13px}
.v157-next-meta{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:14px 0 0;padding-top:12px;border-top:1px solid #edf0f3}
.v157-next-meta span{font-size:10px;color:#77808d}.v157-next-meta strong{font-size:10px;color:#303846;text-align:right}
.v157-text-link{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid #edf0f3;color:var(--v157-red);font-size:11px;font-weight:800;text-decoration:none}
.v157-current-detail{display:grid;grid-template-columns:104px minmax(0,1fr);align-items:center;gap:13px;margin-top:15px}
.v157-current-detail img,.v157-current-image-placeholder{width:104px;height:82px;object-fit:cover;border-radius:15px;background:#f4e9ec}
.v157-current-image-placeholder{display:grid;place-items:center;color:var(--v157-red);font-size:25px}
.v157-current-detail p{margin:0 0 9px;font-size:10px;line-height:1.5;color:#737d89}
.v157-current-detail>div>strong{display:block;text-align:right;margin-top:6px;font-size:11px;color:var(--v157-red)}
.v157-amount{display:block;margin:15px 0 7px;font-size:clamp(23px,6vw,30px);letter-spacing:-.045em;color:#1e2631;overflow-wrap:anywhere}
.v157-summary-card>p{font-size:10px;line-height:1.55;color:#78818d;margin:0}
.v157-home-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.v157-home-shortcuts a{display:grid;justify-items:center;gap:8px;padding:14px 5px;border-radius:17px;background:rgba(255,255,255,.8);border:1px solid #fff;box-shadow:0 7px 20px rgba(25,34,48,.05);color:#555e6b;text-decoration:none;font-size:10px;font-weight:750}
.v157-home-shortcuts i{font-size:17px;color:var(--v157-red)}
.v157-informational-note{font-size:9px;line-height:1.55;color:#818a96;margin:0;padding:2px 3px}
.v157-informational-note i{color:#a4aab3;margin-right:4px}

/* Five-item bottom bar: selected icon can be white on red tile, but its label remains red. */
.sf-mobile-nav.v157-bottom-nav{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:5px!important;
 padding:8px 10px calc(8px + env(safe-area-inset-bottom))!important;background:rgba(255,255,255,.91)!important;
 border:1px solid rgba(255,255,255,.92)!important;border-bottom:0!important;border-radius:22px 22px 0 0!important;
 box-shadow:0 -8px 30px rgba(20,29,43,.10)!important;backdrop-filter:blur(24px) saturate(160%)!important;
 -webkit-backdrop-filter:blur(24px) saturate(160%)!important}
.sf-mobile-nav.v157-bottom-nav a{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
 gap:4px!important;min-height:48px!important;padding:3px 0!important;color:#626b78!important;font-size:9px!important}
.sf-mobile-nav.v157-bottom-nav a b{font-size:9px!important;font-weight:750!important;color:inherit!important;line-height:1.2}
.sf-mobile-nav.v157-bottom-nav a span{width:34px!important;height:30px!important;border-radius:11px!important;display:grid!important;place-items:center!important;
 background:transparent!important;color:#596371!important;font-size:18px!important;transition:all .2s ease}
.sf-mobile-nav.v157-bottom-nav a span i{color:inherit!important;font-size:17px!important}
.sf-mobile-nav.v157-bottom-nav a.active{color:var(--v157-red)!important}
.sf-mobile-nav.v157-bottom-nav a.active b{color:var(--v157-red)!important}
.sf-mobile-nav.v157-bottom-nav a.active span{background:linear-gradient(145deg,#e51b42,#b80b2b)!important;color:#fff!important;box-shadow:0 5px 13px rgba(200,16,46,.22)}
.sf-mobile-nav.v157-bottom-nav a.active span i{color:#fff!important}
.sf-mobile-nav.v157-bottom-nav a:active{transform:scale(.96)}
.sf-main{padding-bottom:112px!important}

/* Operations and activity: cleaner white glass cards, clear status hierarchy. */
.sf-operation-global-progress,.sf-operation-card,.sf-activity-accordion,.sf-activity-history-card,.sf-activity-detail-grid>.sf-card{
 border:1px solid rgba(255,255,255,.94)!important;border-radius:21px!important;box-shadow:0 9px 26px rgba(23,32,46,.065)!important}
.sf-operation-card{overflow:hidden!important}
.sf-operation-toggle{padding:15px!important}
.sf-operation-main strong{font-size:13px!important;letter-spacing:-.015em}
.sf-operation-progress{height:7px!important;background:#f1e8ea!important}
.sf-operation-progress i{background:linear-gradient(90deg,#b90c2c,#ef4562)!important}
.sf-operation-percent{color:var(--v157-red)!important}
.sf-operation-details{background:linear-gradient(180deg,#fff,#fafbfc)!important}
.sf-operation-detail-grid>div,.sf-operation-substep{border:1px solid #edf0f3!important;background:#f8f9fb!important;border-radius:14px!important}
.sf-periods button{border-radius:99px!important;padding:9px 13px!important}
.sf-periods button.active{background:var(--v157-red)!important;color:#fff!important}
.sf-global-ring{filter:drop-shadow(0 7px 13px rgba(200,16,46,.12))}
.sf-activity-toggle{border-radius:16px!important}

/* FX / CHF-EUR page */
.axefx-page{display:grid!important;gap:15px!important}
.axefx-hero,.axefx-history,.axefx-converter,.axefx-operation-card,.v157-metals-card{
 border-radius:23px!important;overflow:hidden!important;border:1px solid rgba(255,255,255,.94)!important;
 box-shadow:0 10px 30px rgba(22,31,45,.075)!important}
.axefx-hero{background:linear-gradient(145deg,#fff,#f6f7fa)!important}
.axefx-live-panel{border-radius:18px!important}
.axefx-price-line strong{letter-spacing:-.05em}
.axefx-history,.axefx-converter{background:rgba(255,255,255,.9)!important}
.axefx-result-wrap{border-radius:19px!important;background:linear-gradient(145deg,#c8102e,#920b25)!important}
.axefx-result-wrap strong{font-variant-numeric:tabular-nums}
.v157-metals-card{padding:18px;background:rgba(255,255,255,.92)}
.v157-metals-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.v157-metals-heading h2{font-size:17px;margin:5px 0;color:#202631}
.v157-metals-heading p{font-size:10px;line-height:1.5;color:#78818d;margin:0}
.v157-refresh-button{flex:0 0 auto;border:0;border-radius:99px;padding:9px 11px;background:#fff0f2;color:var(--v157-red);font-size:10px;font-weight:800}
.v157-metal-source{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:14px 0;padding:10px 11px;border-radius:12px;background:#f7f8fa;color:#707987;font-size:9px}
.v157-metal-source>i{flex:0 0 7px}
.v157-metal-source>i.is-error{background:#d64a4a;box-shadow:0 0 0 4px rgba(214,74,74,.1)}
.v157-metal-source small{margin-left:auto;color:#9098a3}
.v157-metal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.v157-metal-grid .mt-metal-price-card{min-width:0;padding:14px 12px!important;border:1px solid #edf0f3!important;border-radius:16px!important;background:linear-gradient(145deg,#fff,#fafbfc)!important;box-shadow:0 5px 15px rgba(25,34,48,.045)!important}
.v157-metal-grid .mt-metal-price-card>span{font-size:9px!important;color:#747d89!important;font-weight:850!important;letter-spacing:.06em}
.v157-metal-grid .mt-metal-price-card>strong{display:block;margin:8px 0 4px;font-size:18px!important;color:#202631!important;overflow-wrap:anywhere}
.v157-metal-grid .mt-metal-price-card>strong small{font-size:8px!important;color:#858d98!important}
.v157-metal-grid .mt-metal-price-card>small{font-size:9px!important;color:#818a96!important;line-height:1.4}
.axefx-chart{height:220px!important}
.axefx-input-wrap input,.axefx-input-wrap select{border-radius:13px!important}
.axefx-operation-card{margin-top:15px!important}

/* Profile dropdown and page-level touch targets */
@media(max-width:850px){
 .sf-layout{padding-bottom:0!important}
 .sf-main{padding:12px 13px calc(105px + env(safe-area-inset-bottom))!important}
 .sf-topbar{margin:0 0 14px!important;padding:4px 1px!important}
 .sf-topbar-heading{display:none!important}
 .sf-topbar-brand{font-size:12px!important}
 .sf-topbar-brand img,.sf-brand-mark{width:35px!important;height:35px!important}
 .sf-profile{min-height:42px!important;padding:5px!important}
 .sf-avatar{width:32px!important;height:32px!important}
 .v157-mountain-hero{min-height:172px;padding:18px;border-radius:23px}
 .v157-progress-card,.v157-next-card,.v157-current-card,.v157-summary-card,.v157-metals-card{padding:16px;border-radius:20px}
 .v157-progress-layout{gap:15px}
 .v157-progress-ring{width:132px;height:132px;flex-basis:132px}
 .v157-ring-inner strong{font-size:23px}
 .sf-console-page{border-radius:20px!important}
 .sf-console-page .sf-console-live-log{max-height:45vh;overflow:auto}
 .axefx-hero,.axefx-history,.axefx-converter{padding:16px!important}
 .axefx-price-layout{display:grid!important;gap:14px!important}
 .axefx-price-main .axefx-price-line strong{font-size:35px!important}
}
@media(max-width:390px){
 .v157-progress-layout{gap:11px}
 .v157-progress-ring{width:116px;height:116px;flex-basis:116px}
 .v157-ring-inner strong{font-size:20px}
 .v157-progress-meta strong{font-size:12px}
 .v157-progress-meta span{font-size:9px}
 .v157-current-detail{grid-template-columns:88px minmax(0,1fr)}
 .v157-current-detail img,.v157-current-image-placeholder{width:88px;height:76px}
 .v157-metal-grid{gap:7px}
 .v157-metal-grid .mt-metal-price-card{padding:12px 9px!important}
 .v157-metal-grid .mt-metal-price-card>strong{font-size:16px!important}
 .v157-metals-heading{display:block}
 .v157-refresh-button{margin-top:10px}
}
@media(prefers-reduced-motion:reduce){
 .v157-progress-track i,.v157-mini-track i,.sf-mobile-nav.v157-bottom-nav a span{transition:none!important}
}
