/* Promotion Mind · app real. El bloque de arriba es el CSS de la demo aprobada (app.html), copiado tal cual:
   el diseño no se rediseña. Debajo, sólo lo que la app real necesita y la demo no tenía. */
:root{--az:#0a5bb5;--az2:#0b3f86;--cel:#e8f1fc;--ink:#14223a;--mut:#6b7a90;--line:#e3e9f2;--ok:#1f9d55;--okb:#e6f6ec;--rj:#d93b3b;--rjb:#fdecec;--nar:#e08a1e;--narb:#fdf3e4;--bg:#eef3f9}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Inter,system-ui,sans-serif;background:var(--bg);color:var(--ink);min-height:100vh}
.top{max-width:1080px;margin:0 auto;padding:22px 20px 8px;display:flex;align-items:center;gap:12px}
.logo{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#1c7be0,#0a3f86);display:grid;place-items:center;color:#fff;font-weight:800;font-size:18px}
.top h1{font-size:20px;font-weight:800}.top .s{color:var(--mut);font-size:13px}
.demo{margin-left:auto;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--nar);background:var(--narb);border:1px solid #f3d3a4;padding:6px 11px;border-radius:99px}
.stage{max-width:1080px;margin:0 auto;padding:10px 20px 30px;display:grid;grid-template-columns:390px 1fr;gap:34px;align-items:start}
.phone{width:375px;height:760px;background:#fff;border-radius:42px;border:10px solid #0f1b2e;box-shadow:0 30px 70px rgba(15,27,46,.25);overflow:hidden;position:relative;display:flex;flex-direction:column}
.sb{height:30px;flex:0 0 auto;display:flex;justify-content:space-between;align-items:center;padding:0 22px;font-size:12px;font-weight:700;color:#fff;background:var(--az2)}
.hd{background:linear-gradient(180deg,var(--az2),var(--az));color:#fff;padding:10px 16px 14px;flex:0 0 auto}
.hd .r{display:flex;align-items:center;gap:8px}.hd .lg{width:26px;height:26px;border-radius:50%;background:#fff;color:var(--az);display:grid;place-items:center;font-weight:800;font-size:14px}
.hd .t{font-weight:800;font-size:15px;margin-top:8px}.hd .back{cursor:pointer;font-size:20px;line-height:1;margin-right:4px}
.body{flex:1;overflow-y:auto;padding:14px 14px 18px;background:#f6f9fd}
.tab{height:56px;flex:0 0 auto;border-top:1px solid var(--line);display:flex;justify-content:space-around;align-items:center;color:#9aa8bc;font-size:18px;background:#fff}
.tab span:first-child{color:var(--az)}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:10px}
.lbl{font-size:11px;font-weight:700;color:var(--mut);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
.row{display:flex;justify-content:space-between;align-items:center;font-size:13px;padding:6px 0;border-bottom:1px solid #f0f3f8}.row:last-child{border:none}
.row .k{color:var(--mut)}.row .v{font-weight:700}
.menu{display:flex;align-items:center;gap:11px;padding:11px 12px;background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:8px;cursor:pointer}
.menu .ic{width:34px;height:34px;border-radius:9px;background:var(--cel);display:grid;place-items:center;font-size:16px}
.menu b{font-size:13.5px;display:block}.menu small{font-size:11.5px;color:var(--mut)}.menu .ch{margin-left:auto;color:#9aa8bc}
.btn{display:block;width:100%;text-align:center;background:var(--az);color:#fff;font-weight:700;font-size:14px;padding:13px;border:none;border-radius:11px;cursor:pointer;margin-top:10px}
.btn.g{background:var(--ok)}.btn.r{background:var(--rj)}.btn.o{background:#fff;color:var(--az);border:1.5px solid var(--az)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.prod{display:flex;gap:10px;align-items:center}.prod .img{width:44px;height:52px;border-radius:8px;background:linear-gradient(180deg,#fff,#e7eef8);border:1px solid var(--line);display:grid;place-items:center;font-size:22px}
.prod b{font-size:13.5px}.prod small{display:block;color:var(--mut);font-size:11.5px}
.chips{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.chip{border:1px solid var(--line);border-radius:9px;padding:9px 0;text-align:center;font-size:13px;font-weight:600;cursor:pointer;background:#fff}.chip.on{background:var(--az);color:#fff;border-color:var(--az)}
.sel{border:1px solid var(--line);border-radius:9px;padding:10px;font-size:13px;display:flex;justify-content:space-between;background:#fff;margin-bottom:7px}
.opt{display:flex;align-items:center;gap:10px;padding:10px 6px;border-bottom:1px solid #f0f3f8;font-size:13.5px;cursor:pointer}.opt i{width:18px;height:18px;border-radius:50%;border:2px solid #b8c4d6}.opt.on i{border-color:var(--az);background:radial-gradient(var(--az) 45%,#fff 50%)}
.steps{display:flex;gap:4px;margin-bottom:12px}.steps div{flex:1;height:4px;border-radius:3px;background:#dde5f0}.steps div.on{background:var(--az)}
.reco{background:var(--okb);border:1px solid #bfe5cc;border-radius:14px;padding:12px;display:flex;gap:10px;align-items:center;margin-bottom:10px}
.reco .big{font-size:22px;font-weight:800;color:var(--ok)}.reco small{font-size:11.5px;color:#3d6b4f}
.kpi{display:flex;justify-content:space-between;font-size:12.5px;padding:6px 0;border-bottom:1px solid #f0f3f8}.kpi:last-child{border:none}.kpi .v{font-weight:800;color:var(--ok)}.kpi .rg{font-size:10.5px;color:var(--mut);font-weight:500;margin-left:5px}
.na{color:var(--mut)!important;font-weight:600!important}
.bars{display:flex;align-items:flex-end;gap:18px;height:92px;padding:6px 10px 0}.bars div{flex:1;text-align:center;font-size:11px;color:var(--mut)}.bars i{display:block;border-radius:6px 6px 0 0;background:#9fc3f0;margin-bottom:4px}.bars div:nth-child(2) i{background:var(--az)}
.budget{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:10px}
.bg{height:10px;border-radius:6px;background:#e6ecf5;overflow:hidden;display:flex;margin:8px 0 6px}.bg .c{background:var(--az)}.bg .n{background:var(--nar)}
.legend{display:flex;gap:10px;font-size:11px;color:var(--mut);flex-wrap:wrap}.legend b{color:var(--ink)}
.warn{font-size:12px;border-radius:10px;padding:9px 10px;margin-top:8px}.warn.y{background:var(--narb);color:#8a5410}.warn.g{background:var(--okb);color:#2a6b45}
.lock{background:linear-gradient(180deg,#1b3b6f,#0c1d3a);color:#fff;height:100%;padding:60px 18px}.lock .h{font-size:58px;font-weight:300;text-align:center}.lock .d{text-align:center;opacity:.8;margin-bottom:30px}
.notif{background:rgba(255,255,255,.92);color:var(--ink);border-radius:16px;padding:12px;cursor:pointer;font-size:12.5px}.notif b{display:block;margin:4px 0 2px}
.okbig{text-align:center;padding:40px 10px}.okbig .c{width:80px;height:80px;border-radius:50%;background:var(--okb);display:grid;place-items:center;font-size:40px;color:var(--ok);margin:0 auto 14px}
.badge{font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:99px}.b-ok{background:var(--okb);color:var(--ok)}.b-rv{background:var(--narb);color:var(--nar)}.b-pd{background:var(--cel);color:var(--az)}.b-rj{background:var(--rjb);color:var(--rj)}
.req{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;margin-bottom:8px;font-size:12px;cursor:pointer}.req .t{display:flex;justify-content:space-between;font-weight:700;font-size:12.5px;margin-bottom:3px}.req small{color:var(--mut);display:block}
.cmp{display:grid;grid-template-columns:1.3fr 1fr 1fr;font-size:12px;padding:6px 0;border-bottom:1px solid #f0f3f8}.cmp.h{font-weight:700;color:var(--mut);font-size:10.5px;text-transform:uppercase}.cmp span:not(:first-child){text-align:right}
.new{font-size:10px;font-weight:800;color:#fff;background:var(--nar);padding:2px 7px;border-radius:99px;margin-left:6px;vertical-align:middle}
.side h2{font-size:26px;font-weight:800;line-height:1.15}.side .num{width:40px;height:40px;border-radius:50%;background:var(--az);color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px;margin-bottom:12px}
.side p{color:#3b4a62;font-size:16px;line-height:1.55;margin-top:10px;max-width:46ch}
.side .who{display:inline-block;margin-top:14px;font-size:12px;font-weight:700;color:var(--az);background:var(--cel);padding:6px 12px;border-radius:99px}
.side .hon{margin-top:16px;font-size:13px;color:#7a5a20;background:var(--narb);border-radius:12px;padding:12px 14px;max-width:52ch;display:none}
.nav{display:flex;gap:10px;margin-top:26px;align-items:center}.nav button{border:1px solid #c9d5e6;background:#fff;border-radius:10px;padding:10px 16px;font-weight:700;cursor:pointer;color:var(--ink)}
.dots{display:flex;gap:6px;flex-wrap:wrap;margin-top:18px}.dots i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-style:normal;font-weight:700;background:#fff;border:1px solid #c9d5e6;cursor:pointer;color:var(--mut)}.dots i.on{background:var(--az);color:#fff;border-color:var(--az)}
.foot{max-width:1080px;margin:0 auto;padding:0 20px 28px;color:var(--mut);font-size:12px}
@media(max-width:860px){.stage{grid-template-columns:1fr}.phone{margin:0 auto;width:100%;max-width:375px}}

.top{max-width:1180px}.stage{max-width:1180px;grid-template-columns:395px 1fr}
.pw{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--mut);letter-spacing:.08em;text-transform:uppercase;margin-left:14px}.pw img{height:30px}
.tope{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:10px}
.tope .tt{font-size:15px;font-weight:800}.tope .tt b{color:var(--rj)}
.tope .ss{font-size:11px;color:var(--mut);margin:2px 0 6px}
.tope input[type=range]{width:100%;accent-color:var(--az)}
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:8px}.seg span{font-size:10.5px;text-align:center;padding:7px 2px;border:1px solid var(--line);border-radius:8px;cursor:pointer;font-weight:600}.seg span.on{background:var(--az);color:#fff;border-color:var(--az)}
.merma{border:1.5px solid #f3c0c0;background:var(--rjb);border-radius:14px;padding:12px;margin-bottom:10px}
.merma .h{font-size:11px;font-weight:800;color:var(--rj);text-transform:uppercase;letter-spacing:.04em}
.merma .row .v{color:var(--rj)}
.circ{position:absolute;border-radius:50%;background:var(--ok);z-index:20;pointer-events:none;transform:scale(0);transition:transform .7s cubic-bezier(.6,0,.2,1)}
.tregua{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;margin-top:8px;font-size:12px}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin:8px 0}.cal span{text-align:center;padding:5px 0;border-radius:6px;font-size:11px;cursor:pointer}.cal span.x{color:#c5cede}.cal span.on{background:var(--az);color:#fff;font-weight:700}
.plazo{background:#0f2a55;color:#fff;border-radius:14px;padding:14px;margin-bottom:10px}
.plazo .l{font-size:11px;opacity:.75;text-transform:uppercase;letter-spacing:.06em}
.plazo .cd{display:flex;gap:8px;margin:8px 0}.plazo .cd div{background:rgba(255,255,255,.1);border-radius:8px;padding:6px 0;flex:1;text-align:center}.plazo .cd b{font-size:22px;display:block;font-variant-numeric:tabular-nums}.plazo .cd small{font-size:9.5px;opacity:.7}
.tl{height:6px;background:rgba(255,255,255,.2);border-radius:4px;position:relative;margin-top:10px}.tl i{position:absolute;left:0;top:0;bottom:0;width:60%;background:#ffb74a;border-radius:4px}
.tlx{display:flex;justify-content:space-between;font-size:10px;opacity:.75;margin-top:5px}
.audio{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}.audio button{border:none;border-radius:99px;padding:11px 18px;font-weight:700;cursor:pointer;font-size:14px}
.a1{background:var(--az);color:#fff}.a2{background:var(--cel);color:var(--az)}
.playing{animation:pl 1s infinite}@keyframes pl{50%{opacity:.6}}
.h2s{color:var(--mut);font-size:15px;margin-top:4px}
.sim{display:flex;flex-direction:column;gap:5px}.simr{display:grid;grid-template-columns:34px 1fr 34px;gap:6px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:6px 8px;cursor:pointer;font-size:12px;position:relative}
.simr.on{border-color:var(--az);background:var(--cel)}.simr .sb2{height:7px;background:#e6ecf5;border-radius:4px;overflow:hidden}.simr .sb2 i{display:block;height:100%;background:var(--az);border-radius:4px}
.simr .sv{font-weight:800;text-align:right}.simr .sc{grid-column:2/4;font-size:10px;color:var(--mut)}.simr em{position:absolute;right:8px;top:-7px;font-style:normal;font-size:9px;font-weight:800;background:var(--ok);color:#fff;padding:1px 7px;border-radius:99px}
.cal2{font-size:11px}.cal2 .cw{display:grid;grid-template-columns:62px repeat(5,1fr);color:var(--mut);font-size:9.5px;margin-bottom:4px}.cal2 .cr{display:grid;grid-template-columns:62px 1fr;align-items:center;margin:5px 0}
.cal2 .cn{font-weight:700;font-size:11px}.cal2 .ct{position:relative;height:22px;background:repeating-linear-gradient(90deg,#f2f5fa 0 19.8%,#e3e9f2 19.8% 20%);border-radius:5px}
.cal2 .ct i{position:absolute;top:2px;bottom:2px;border-radius:4px;color:#fff;font-style:normal;font-size:9px;font-weight:700;padding:0 5px;display:flex;align-items:center;white-space:nowrap;overflow:hidden}
.gond{display:flex;align-items:center;gap:12px}.ring{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:18px;background:conic-gradient(var(--ok) 0 75%,#f3c0c0 75% 100%);position:relative}.ring:after{content:"";position:absolute;inset:9px;border-radius:50%;background:#fff}.ring span{position:relative;z-index:1;color:var(--ink)}
.gd2{display:grid;grid-template-columns:repeat(12,1fr);gap:7px;justify-items:center}.gd2 i{width:15px;height:15px;border-radius:50%;background:var(--ok);display:block}.gd2 i.x{background:var(--rj);cursor:pointer;transition:transform .15s}.gd2 i.x.on{transform:scale(1.35);box-shadow:0 0 0 3px #f6c9c9}

/* ======== lo de la app real ======== */
.top .who2{margin-left:auto;font-size:12px;color:var(--mut);text-align:right}.top .who2 b{display:block;color:var(--ink);font-size:13px}
.stage1{max-width:1180px;margin:0 auto;padding:6px 20px 30px;display:flex;justify-content:center}
.phone{height:min(800px,calc(100vh - 110px));min-height:640px}
#screen{flex:1;display:flex;flex-direction:column;min-height:0;position:relative}
.hd .ico{cursor:pointer;font-size:16px;line-height:1;padding:2px 4px;position:relative;background:none;border:none;color:#fff}
.hd .ico .n{position:absolute;top:-6px;right:-6px;background:var(--rj);color:#fff;font-size:9px;font-weight:800;border-radius:99px;padding:1px 5px}
.hd .ico.hab{animation:pl 1s infinite}
.tab span{cursor:pointer;padding:6px 14px;display:flex;flex-direction:column;align-items:center;gap:1px}.tab span small{font-size:9px;font-weight:600}
.tab span.on{color:var(--az)}.tab span:first-child{color:inherit}.tab span.on:first-child{color:var(--az)}
.inp{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px;font:inherit;font-size:14px;background:#fff;color:var(--ink);margin-bottom:7px}
.inp:focus{outline:2px solid #9fc3f0;border-color:var(--az)}
select.inp{appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%236b7a90'/%3E%3C/svg%3E") no-repeat right 12px center}
.err{background:var(--rjb);color:#8a2020;font-size:12.5px;border-radius:9px;padding:9px 10px;margin-top:8px}
.btn:disabled{opacity:.5;cursor:default}
.mini{font-size:11px;color:var(--mut)}
.mes{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.mes b{font-size:13px}.mes span{cursor:pointer;color:var(--az);font-weight:800;font-size:18px;padding:0 8px;user-select:none}.mes span.x{color:#c5cede;cursor:default}
.sbadge{margin-left:6px;background:var(--rj);color:#fff;font-size:10px;font-weight:800;border-radius:99px;padding:2px 7px}
.toast{position:absolute;left:12px;right:12px;top:10px;z-index:30;background:rgba(255,255,255,.97);border:1px solid var(--line);border-radius:16px;padding:11px 12px;font-size:12.5px;cursor:pointer;transform:translateY(-130%);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.toast{visibility:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),visibility 0s .35s}.toast.on{transform:none;visibility:visible;transition:transform .35s cubic-bezier(.2,.8,.2,1)}.toast b{display:block;margin:2px 0}
.offline{background:var(--narb);color:#8a5410;font-size:11.5px;text-align:center;padding:5px;font-weight:600}
.chk{display:inline-block;width:16px;margin-right:6px;font-weight:800;color:#c5cede;transition:color .2s}.chk.ok{color:var(--ok)}
.cdw{display:flex;gap:6px;margin:6px 0}.cdw div{background:rgba(255,255,255,.1);border-radius:8px;padding:5px 0;flex:1;text-align:center}.cdw b{font-size:19px;display:block;font-variant-numeric:tabular-nums}.cdw small{font-size:9px;opacity:.7}
.plazo.cl{background:#fff;color:var(--ink);border:1px solid var(--line)}.plazo.cl .cdw div{background:var(--cel)}.plazo.cl .l{color:var(--mut);opacity:1}
.reco.no{background:var(--rjb);border-color:#f3c0c0}.reco.no .big{color:var(--rj)}.reco.no small{color:#8a2020}
.reco.rv{background:var(--narb);border-color:#f3d3a4}.reco.rv .big{color:var(--nar)}.reco.rv small{color:#8a5410}
.ent{background:var(--cel);border-radius:14px;padding:12px;font-size:12.5px;color:#24466f;margin-bottom:10px}
.tabs2{display:flex;gap:14px;font-size:12px;font-weight:700;margin-bottom:10px;color:var(--mut)}.tabs2 span{cursor:pointer;padding-bottom:3px}.tabs2 span.on{color:var(--az);border-bottom:2px solid var(--az)}
.reg{font-size:11.5px;padding:8px 0;border-bottom:1px solid #f0f3f8}.reg b{font-size:12px}.reg code{font-size:10px;color:var(--mut)}
.pie{display:flex;align-items:center;justify-content:center;gap:6px;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin:16px 0 4px}.pie img{height:20px}
.vacio{text-align:center;color:var(--mut);font-size:12.5px;padding:24px 10px}
.drop{border:1.5px dashed #b8c4d6;border-radius:12px;padding:14px;text-align:center;font-size:12px;color:var(--mut);cursor:pointer}
/* movimiento: los números cuentan, la línea se dibuja, el punto late */
.draw{stroke-dasharray:1000;stroke-dashoffset:1000;animation:dib 1.1s cubic-bezier(.4,0,.2,1) forwards}
@keyframes dib{to{stroke-dashoffset:0}}
.aparece{animation:apa .9s ease-out .3s both}@keyframes apa{from{opacity:0}}
.late{animation:lat 1.2s ease-in-out infinite;transform-origin:center;transform-box:fill-box}
@keyframes lat{50%{transform:scale(1.6);opacity:.55}}
.entra{animation:ent .35s cubic-bezier(.2,.8,.2,1)}@keyframes ent{from{opacity:0;transform:translateY(8px)}}
@media (prefers-reduced-motion:reduce){.draw{animation:none;stroke-dashoffset:0}.late,.entra,.aparece,.hd .ico.hab{animation:none}.circ{transition:none}}
/* en el celular la app es la pantalla entera: sin marco, sin barra de mentira, respetando la muesca */
@media (max-width:520px){
 body{background:#f6f9fd}
 .top,.foot,.desk{display:none}
 .stage1{padding:0;display:block}
 .phone{width:100%;max-width:none;height:100dvh;min-height:0;border:none;border-radius:0;box-shadow:none}
 .sb{display:none!important}
 .hd{padding-top:calc(10px + env(safe-area-inset-top))}
 .tab{height:calc(56px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}
 .ingreso{padding-top:calc(54px + env(safe-area-inset-top))!important}
}
.cal2 .cw,.cal2 .cr{grid-template-columns:72px repeat(5,1fr)}.cal2 .cr{grid-template-columns:72px 1fr}.cal2 .cn{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:4px}
/* ======== lo que trajimos de DASH DHN (23-oct) ======== */
/* todo lo que se toca responde al dedo */
.btn,.menu,.req,.simr,.seg span,.opt,.tab span,.chip,[data-pop],.hd .ico,.hd .back,.mes span,.tabs2 span,.drop,.gd2 i,.cal2 .ct i{-webkit-tap-highlight-color:transparent;transition:transform .12s ease}
.btn:active,.menu:active,.req:active,.simr:active,.seg span:active,.opt:active,.tab span:active,[data-pop]:active,.hd .ico:active,.mes span:active,.tabs2 span:active,.drop:active{transform:scale(.975)}
/* 44 pt como mínimo en todo lo que se toca */
.btn{min-height:44px}.seg span{min-height:40px;display:flex;align-items:center;justify-content:center}.opt{min-height:44px}.menu{min-height:56px}
.hd .ico{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;margin:-10px -6px}
.hd .back{min-width:32px;min-height:44px;display:inline-flex;align-items:center;margin:-10px 0}
.mes span{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.tab span{min-width:56px;min-height:48px;justify-content:center}
.tabs2 span{min-height:36px;display:inline-flex;align-items:center}
.gd2 i{width:20px!important;height:20px!important}
[data-pop]{cursor:pointer}
.kpi[data-pop] .v:after,.row[data-pop] .v:after{content:"›";color:#b8c4d6;font-weight:600;margin-left:6px}
/* EL POP DE LA CASA (molde_pop.css, de DHN/_molde.py) con las variables de esta app */
:root{--card:#fff;--head:var(--ink);--muted:var(--mut);--line2:#eef2f7;--plane:#f6f9fd;--ink2:#3b4a62;--surface:#f3f7fd;--c1:var(--az)}
/* …y en el celular es una HOJA que sube desde abajo y se cierra arrastrándola (como en DASH DHN, idea de Silk) */
#phone .ovl{position:absolute;inset:0;padding:0;align-items:flex-end;justify-content:stretch;background:rgba(15,27,46,.38);backdrop-filter:none;overflow:hidden;z-index:40;opacity:0;transition:opacity .26s}
#phone .ovl.show{display:flex}#phone .ovl.on{opacity:1}
#phone .modal{position:absolute;left:0;right:0;bottom:0;max-width:none;width:100%;max-height:88%;border-radius:20px 20px 0 0;border:none;box-shadow:none;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;transform:translateY(100%);transition:transform .26s cubic-bezier(.2,.8,.2,1);padding-bottom:env(safe-area-inset-bottom)}
#phone .ovl.on .modal{transform:translateY(0)}
#phone .modal:before{content:"";display:block;width:42px;height:5px;border-radius:3px;background:#c9d2de;margin:9px auto 0}
#phone .mhead{padding:10px 18px 12px}#phone .mclose{top:8px;right:10px;width:44px;height:44px;border:none;background:none;font-size:18px}
#phone .mbody{padding:14px 18px 22px}#phone .mbig{font-size:30px}#phone .mread{font-size:13.5px}#phone .mstat .k{font-size:11.5px}#phone .mstat .v{font-size:15px}
#phone .mstat .cmpv{font-size:11px;font-weight:600;color:var(--mut);margin-top:1px}
#phone .rrow{grid-template-columns:minmax(0,1.4fr) 40px minmax(0,1fr)!important;gap:8px;font-size:12.5px;padding:8px 0;border-bottom:1px solid #f0f3f8;align-items:center}
#phone .rrow .rn{overflow:hidden;text-overflow:ellipsis}#phone .rrow .rv{text-align:right;font-weight:700}#phone .rrow .rv em{display:block;font-style:normal;font-weight:500;color:var(--mut);font-size:10.5px}
#phone .rrow .rb{height:6px;background:#eef2f7;border-radius:3px;overflow:hidden}#phone .rrow .rb i{display:block;height:100%}
#phone .rrow.va{cursor:pointer}#phone .macc{margin-top:12px}
@media (max-width:520px){#phone .ovl{position:fixed}}
/* ANILLOS de las metas del mes */
.anillos{display:flex;align-items:center;gap:14px}
.anillos svg{flex:0 0 auto}
.anillos .ar{transition:stroke-dashoffset 1.4s cubic-bezier(.2,.8,.2,1)}
.anillos .ar.cerrado{animation:brillo 1.2s ease-out 1.4s 1}
@keyframes brillo{40%{filter:drop-shadow(0 0 6px currentColor) brightness(1.25)}}
.anillos .lst{flex:1;min-width:0}.anillos .lst div{display:flex;align-items:center;gap:7px;font-size:12px;padding:4px 0}.anillos .lst i{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.anillos .lst b{margin-left:auto;font-size:12.5px}
@media (max-width:560px){.anillos{flex-direction:column;align-items:stretch}.anillos svg{margin:0 auto}}
@media (prefers-reduced-motion:reduce){#phone .ovl,#phone .modal,.anillos .ar{transition:none}.anillos .ar.cerrado{animation:none}.btn:active,.menu:active,.req:active,[data-pop]:active{transform:none}}

.b-rv{color:#9a5a0c}.reco.rv .big{color:#a35a06}
.hd .r{min-height:44px}.hd .ico{margin:0 -6px}.hd .back{margin:0}