@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:200 800;font-display:swap;src:url(fonts/bricolage-grotesque-latin-opsz-normal.woff2) format("woff2-variations"),url(fonts/bricolage-grotesque-latin-opsz-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/hanken-grotesk-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/hanken-grotesk-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/hanken-grotesk-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/hanken-grotesk-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Martian Mono";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/martian-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Martian Mono";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/martian-mono-latin-500-normal.woff2) format("woff2")}

/* Layout: una app de iPhone. En escritorio, el teléfono a la derecha y el argumento a la izquierda; en móvil, la app ocupa toda la pantalla.
   Idea visual: la niebla mental se disipa. El fondo pasa de noche a amanecer según avanzas, y el dial de 90 marcas va del gris niebla al color del alba. */
:root{
  color-scheme: dark;
  --page:#07090E;
  --bg:#0C0F16;
  --surface:#131824;
  --surface-2:#1A2030;
  --line:rgba(196,206,234,.10);
  --line-2:rgba(196,206,234,.18);
  --fg:#ECEEF4;
  --muted:#8E95A8;
  --faint:#555D71;
  --tick-off:rgba(196,206,234,.13);
  --fog:#6E7EA4;
  --dusk:#A594C8;
  --dawn:#F4B183;
  --dawn-ink:#1A120C;
  --ok:#7CC6A4;
  --alert:#E8766E;
  --bezel:#1C2029;
  --glass:rgba(12,15,22,.72);
  --fog-blob:rgba(120,134,170,.34);
  --glow:rgba(244,177,131,.30);
  --sky:#86B6DA;
  --gold:#E9C46A;

  --f-display:"Bricolage Grotesque", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --f-body:"Hanken Grotesk", "Helvetica Neue", "Segoe UI", system-ui, sans-serif;
  --f-mono:"Martian Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --r-lg:26px; --r-md:18px; --r-sm:12px;
  --ease: cubic-bezier(.2,.8,.2,1);
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    color-scheme: light;
    --page:#DDE1E9; --bg:#F1F3F7; --surface:#FFFFFF; --surface-2:#E8EBF1;
    --line:rgba(22,30,56,.10); --line-2:rgba(22,30,56,.18);
    --fg:#141925; --muted:#596175; --faint:#8F96A8; --tick-off:rgba(22,30,56,.12);
    --fog:#56637F; --dusk:#6F5DA3; --dawn:#C4652F; --dawn-ink:#FFFFFF;
    --ok:#2F8A62; --alert:#C2463D; --bezel:#C9CED8; --glass:rgba(241,243,247,.78);
    --fog-blob:rgba(150,162,196,.36); --glow:rgba(226,140,86,.26); --sky:#2F6F9E; --gold:#A87712;
  }
}
:root[data-theme="light"]{
  color-scheme: light;
  --page:#DDE1E9; --bg:#F1F3F7; --surface:#FFFFFF; --surface-2:#E8EBF1;
  --line:rgba(22,30,56,.10); --line-2:rgba(22,30,56,.18);
  --fg:#141925; --muted:#596175; --faint:#8F96A8; --tick-off:rgba(22,30,56,.12);
  --fog:#56637F; --dusk:#6F5DA3; --dawn:#C4652F; --dawn-ink:#FFFFFF;
  --ok:#2F8A62; --alert:#C2463D; --bezel:#C9CED8; --glass:rgba(241,243,247,.78);
  --fog-blob:rgba(150,162,196,.36); --glow:rgba(226,140,86,.26); --sky:#2F6F9E; --gold:#A87712;
}

*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--page);color:var(--fg);font-family:var(--f-body);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow:hidden}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
input,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--dawn);outline-offset:3px;border-radius:8px}
h1,h2,h3,h4{margin:0;font-family:var(--f-display);font-weight:500;letter-spacing:-.02em;text-wrap:balance}
p{margin:0}
.mono{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.num{font-variant-numeric:tabular-nums}

/* ---------- Escenario ---------- */
.stage{height:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(40px,6vw,96px);max-width:1200px;margin:0 auto;padding-inline:40px;padding-block:32px}
.pitch{min-width:0;max-width:470px}
.pitch .brand{display:flex;align-items:center;gap:12px;margin-bottom:40px}
.pitch h1{font-size:clamp(44px,5.4vw,76px);line-height:.95;font-weight:300;font-variation-settings:"opsz" 96;letter-spacing:-.045em}
.pitch h1 em{font-style:normal;color:var(--dawn)}
.pitch .lede{margin-top:24px;color:var(--muted);font-size:17px;max-width:40ch}
.pitch ul{list-style:none;margin:32px 0 0;padding:0;display:grid;gap:14px}
.pitch li{display:grid;grid-template-columns:84px 1fr;gap:10px;align-items:baseline;color:var(--fg)}
.pitch li .mono{color:var(--dawn)}
.pitch .price{margin-top:36px;display:flex;align-items:baseline;gap:14px;padding-top:24px;border-top:1px solid var(--line)}
.pitch .price b{font-family:var(--f-display);font-size:34px;font-weight:400;letter-spacing:-.03em}
.pitch .note{margin-top:18px;font-size:12.5px;color:var(--faint);max-width:44ch}
.logo{width:34px;height:34px;border-radius:10px;background:radial-gradient(120% 120% at 50% 110%,var(--dawn) 0%,var(--dusk) 45%,#1A2030 80%);display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.logo span{font-family:var(--f-display);font-weight:600;font-size:13px;color:#fff;letter-spacing:-.02em}
.brand-name{font-family:var(--f-display);font-size:18px;font-weight:500;letter-spacing:-.02em}

.device{position:relative;width:390px;height:min(844px,calc(100vh - 64px));border-radius:56px;padding:10px;background:var(--bezel);box-shadow:0 0 0 1px var(--line-2),0 50px 120px -30px rgba(0,0,0,.55),0 20px 40px -20px rgba(0,0,0,.4)}
.device::after{content:"";position:absolute;top:21px;left:50%;translate:-50% 0;width:118px;height:34px;border-radius:20px;background:#000;z-index:90;pointer-events:none}
.app{position:relative;width:100%;height:100%;border-radius:46px;overflow:hidden;background:var(--bg);isolation:isolate;--p:0}
.statusbar{position:absolute;top:0;left:0;right:0;height:54px;display:flex;justify-content:space-between;align-items:center;padding:6px 34px 0;font-weight:600;font-size:15px;z-index:80;pointer-events:none}
.statusbar .sb-r{display:flex;gap:6px;align-items:center}
.statusbar svg{fill:var(--fg)}

@media all{
  body{background:var(--bg)}
  .stage{display:block;padding:0;height:100%;max-width:none}
  .pitch{display:none}
  .device{width:100%;height:100%;border-radius:0;padding:0;background:none;box-shadow:none}
  .device::after,.statusbar{display:none}
  .app{border-radius:0}
}

/* ---------- Atmósfera ---------- */
.atmo{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.atmo i{position:absolute;border-radius:50%;filter:blur(50px)}
.atmo .f1{width:420px;height:320px;left:-140px;top:40px;background:var(--fog-blob);opacity:calc(.9 - var(--p)*.8);animation:drift 26s ease-in-out infinite alternate}
.atmo .f2{width:380px;height:300px;right:-160px;top:260px;background:var(--fog-blob);opacity:calc(.75 - var(--p)*.65);animation:drift 32s ease-in-out infinite alternate-reverse}
.atmo .f3{width:520px;height:340px;left:50%;bottom:-220px;translate:-50% 0;background:var(--glow);opacity:calc(.25 + var(--p)*.9)}
@keyframes drift{from{transform:translate(0,0)}to{transform:translate(60px,40px)}}

/* ---------- Pantallas ---------- */
.screen{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;padding:64px 20px 128px;scrollbar-width:none;overscroll-behavior:contain}
.screen::-webkit-scrollbar{display:none}
@media all{.screen{padding-top:calc(env(safe-area-inset-top,0px) + 18px)}}
.view{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;animation:viewIn .5s var(--ease)}
@keyframes viewIn{from{opacity:.001;transform:translateY(10px)}to{opacity:1;transform:none}}

.topline{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:30px;flex-wrap:wrap}
.topline > .mono{white-space:nowrap}
.chip{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:99px;border:1px solid var(--line-2);font-family:var(--f-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.chip .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.chip.demo{color:var(--dawn);border-color:color-mix(in srgb,var(--dawn) 40%,transparent)}
.h-title{font-size:30px;font-weight:400;line-height:1.05;letter-spacing:-.035em}

.card{background:color-mix(in srgb,var(--surface) 86%,transparent);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.card.flat{background:transparent;backdrop-filter:none}
.sec-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:12px}
.sec-h h3{font-size:18px;font-weight:500}
.link{color:var(--dawn);font-weight:600;font-size:13.5px}

/* Dial */
.dial-wrap{position:relative;display:grid;place-items:center;margin:6px auto 0;width:min(100%,318px);aspect-ratio:1}
.dial-wrap svg{width:100%;height:100%;overflow:visible}
.dial-wrap .tick{animation:tickIn .9s var(--ease) both}
@keyframes tickIn{from{opacity:.15}to{opacity:1}}
.dial-center{position:absolute;inset:0;display:grid;place-content:center;text-align:center;pointer-events:none}
.dial-num{font-family:var(--f-display);font-size:104px;line-height:.86;font-weight:250;font-variation-settings:"opsz" 96;letter-spacing:-.06em;font-variant-numeric:tabular-nums}
.dial-of{margin-top:10px}
.today-tick{animation:pulse 2.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.45}}
.clock{display:flex;justify-content:center;gap:14px;margin-top:-2px}
.clock div{text-align:center}
.clock b{display:block;font-family:var(--f-mono);font-weight:400;font-size:17px;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.clock span{font-family:var(--f-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}

/* Día */
.day-card h2{font-size:26px;font-weight:450;line-height:1.1;letter-spacing:-.03em;margin-top:8px}
.block{padding-top:14px;margin-top:14px;border-top:1px solid var(--line)}
.block p{color:color-mix(in srgb,var(--fg) 86%,var(--muted));font-size:14.5px;margin-top:6px}
.reto{margin-top:16px;border-radius:var(--r-md);padding:16px;background:linear-gradient(160deg,color-mix(in srgb,var(--dawn) 16%,transparent),color-mix(in srgb,var(--dusk) 8%,transparent));border:1px solid color-mix(in srgb,var(--dawn) 26%,transparent)}
.reto .mono{color:var(--dawn)}
.reto p{margin-top:6px;font-size:14.5px}
.reto-row{display:flex;justify-content:space-between;align-items:center;margin-top:12px;gap:10px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 22px;border-radius:99px;font-weight:600;font-size:15px;transition:transform .2s var(--ease),background .2s,opacity .2s}
.btn:active{transform:scale(.97)}
.btn.primary{background:var(--fg);color:var(--bg)}
.btn.dawn{background:var(--dawn);color:var(--dawn-ink)}
.btn.ghost{border:1px solid var(--line-2)}
.btn.small{height:36px;padding:0 14px;font-size:13px}
.btn.block{width:100%}
.btn[disabled]{opacity:.4;pointer-events:none}
.btn.done{background:color-mix(in srgb,var(--ok) 18%,transparent);color:var(--ok)}

.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.stat{padding:14px 12px;border-radius:var(--r-md);border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 70%,transparent)}
.stat b{display:block;font-family:var(--f-display);font-size:28px;font-weight:350;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.stat span{display:block;margin-top:8px;font-size:11.5px;color:var(--muted);line-height:1.3}

.milestone{display:grid;gap:10px}
.bar{height:6px;border-radius:9px;background:var(--tick-off);overflow:hidden}
.bar i{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,var(--fog),var(--dusk),var(--dawn))}
.ms-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.ms-row b{font-family:var(--f-display);font-weight:500;font-size:17px;letter-spacing:-.02em}

.reason-q{font-family:var(--f-display);font-size:22px;font-weight:350;line-height:1.2;letter-spacing:-.025em;margin-top:10px}
.reason-q::before{content:"“";color:var(--dawn)}
.reason-q::after{content:"”";color:var(--dawn)}

/* ---------- Tabbar ---------- */
.tabbar{position:absolute;left:0;right:0;bottom:0;z-index:40;padding:10px 12px calc(20px + env(safe-area-inset-bottom,0px));background:linear-gradient(to top,var(--bg) 55%,transparent);}
.tabs{display:grid;grid-template-columns:repeat(5,1fr);align-items:center;height:64px;border-radius:32px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4)}
.tab{display:grid;justify-items:center;gap:3px;font-size:10.5px;font-weight:600;color:var(--faint);height:100%;align-content:center;transition:color .2s}
.tab svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tab[aria-current="page"]{color:var(--fg)}
.sos-btn{justify-self:center;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;margin-top:-26px;background:radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--dawn) 100%,#fff 10%),var(--dawn));color:var(--dawn-ink);font-family:var(--f-mono);font-size:11px;font-weight:500;letter-spacing:.08em;box-shadow:0 10px 30px -6px var(--glow),0 0 0 6px var(--bg),0 0 0 7px var(--line)}
.sos-btn::before{content:"";position:absolute;width:58px;height:58px;border-radius:50%;border:1px solid var(--dawn);animation:ring 2.8s ease-out infinite}
@keyframes ring{from{transform:scale(1);opacity:.7}to{transform:scale(1.55);opacity:0}}

/* ---------- Camino ---------- */
.phase{display:grid;grid-template-columns:22px 1fr;gap:14px;position:relative}
.phase + .phase{margin-top:4px}
.phase .rail{display:grid;justify-items:center}
.phase .rail i{width:12px;height:12px;border-radius:50%;border:2px solid var(--line-2);margin-top:6px;background:var(--bg)}
.phase .rail u{width:2px;flex:1;background:var(--line);min-height:30px}
.phase.done .rail i{background:var(--c);border-color:var(--c)}
.phase.now .rail i{border-color:var(--c);box-shadow:0 0 0 5px color-mix(in srgb,var(--c) 22%,transparent)}
.phase-body{padding-bottom:22px;min-width:0}
.phase-body h3{font-size:19px;font-weight:500}
.phase-body .dates{margin-top:3px}
.phase-body p{margin-top:8px;color:var(--muted);font-size:14px}
.phase.now .phase-body p{color:var(--fg)}
.tagline{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:4px}

.grid90{display:grid;grid-template-columns:repeat(10,1fr);gap:6px}
.cell{aspect-ratio:1;border-radius:8px;display:grid;place-items:center;font-family:var(--f-mono);font-size:9.5px;color:var(--faint);border:1px solid var(--line);background:transparent;transition:transform .15s}
.cell:active{transform:scale(.92)}
.cell.w{background:var(--c);border-color:transparent;color:color-mix(in srgb,#000 70%,var(--c))}
.cell.p{border-color:color-mix(in srgb,var(--c) 70%,transparent);color:var(--muted)}
.cell.t{box-shadow:0 0 0 2px var(--bg),0 0 0 3.5px var(--dawn);color:var(--fg)}
.cell.r{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--alert) 40%,transparent) 0 3px,transparent 3px 6px);border-color:var(--alert);color:var(--alert)}
.legend{display:flex;flex-wrap:wrap;gap:12px 16px;margin-top:14px}
.legend span{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.legend i{width:12px;height:12px;border-radius:4px;border:1px solid var(--line-2)}

/* ---------- Diario ---------- */
.moods{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.mood{display:grid;justify-items:center;gap:8px;padding:12px 0 10px;border-radius:var(--r-md);border:1px solid var(--line);font-size:11.5px;color:var(--muted);transition:all .2s var(--ease)}
.mood i{width:22px;height:22px;border-radius:50%;background:var(--mc);opacity:.35;transition:all .25s var(--ease)}
.mood[aria-pressed="true"]{border-color:var(--mc);color:var(--fg);background:color-mix(in srgb,var(--mc) 12%,transparent)}
.mood[aria-pressed="true"] i{opacity:1;transform:scale(1.15)}
.toggle{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0;border-top:1px solid var(--line);text-align:left;width:100%}
.toggle:first-child{border-top:0}
.switch{flex:none;width:50px;height:30px;border-radius:99px;background:var(--tick-off);position:relative;transition:background .25s}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.25);transition:transform .3s var(--ease)}
[aria-checked="true"] .switch{background:var(--ok)}
[aria-checked="true"] .switch::after{transform:translateX(20px)}
.field{display:grid;gap:8px}
.field + .field{margin-top:18px}
.field label{font-weight:600;font-size:14px}
.field .hint{font-size:12.5px;color:var(--muted);margin-top:-4px}
textarea,.input{width:100%;border-radius:var(--r-sm);border:1px solid var(--line-2);background:color-mix(in srgb,var(--surface-2) 60%,transparent);padding:12px 14px;font-size:15px;line-height:1.5;resize:none;min-height:48px;outline:none;transition:border-color .2s}
textarea{min-height:84px;field-sizing:content;max-height:260px}
textarea:focus,.input:focus{border-color:var(--dawn)}
textarea::placeholder,.input::placeholder{color:var(--faint)}
.saved{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ok)}
.hist{display:grid}
.hist button{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:13px 0;border-top:1px solid var(--line);text-align:left;width:100%}
.hist button:first-child{border-top:0}
.hist .d{font-family:var(--f-display);font-size:22px;font-weight:350;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.hist .t{min-width:0}
.hist .t b{display:block;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hist .t span{display:block;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hist .m{width:10px;height:10px;border-radius:50%}
.chart svg{width:100%;height:auto;display:block}
.circles{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;text-align:center}
.circles button{aspect-ratio:1;border-radius:50%;border:1.5px solid var(--line-2);font-family:var(--f-mono);font-size:11px;color:var(--muted)}
.circles button[aria-pressed="true"]{background:var(--dawn);border-color:var(--dawn);color:var(--dawn-ink)}

/* ---------- Tú ---------- */
.list{display:grid}
.row{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--line);width:100%;text-align:left}
.row:first-child{border-top:0}
.row .ic{flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:var(--surface-2);color:var(--dawn)}
.row .ic svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.row .tx{flex:1;min-width:0}
.row .tx b{display:block;font-weight:600;font-size:14.5px}
.row .tx span{display:block;font-size:12.5px;color:var(--muted)}
.row .chev{color:var(--faint)}
.check{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--line);text-align:left;width:100%}
.check:first-child{border-top:0}
.box{flex:none;width:22px;height:22px;border-radius:7px;border:1.5px solid var(--line-2);display:grid;place-items:center;margin-top:1px;transition:all .2s}
.box svg{width:13px;height:13px;stroke:var(--dawn-ink);stroke-width:2.6;fill:none;opacity:0}
[aria-checked="true"] .box{background:var(--dawn);border-color:var(--dawn)}
[aria-checked="true"] .box svg{opacity:1}
[aria-checked="true"] .ct{color:var(--muted);text-decoration:line-through;text-decoration-color:var(--faint)}
.ct{font-size:14.5px}
.relapse-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.slot{border:1px dashed var(--line-2);border-radius:var(--r-md);padding:12px;display:grid;gap:4px;min-height:74px}
.slot.on{border-style:solid;border-color:color-mix(in srgb,var(--alert) 60%,transparent);background:color-mix(in srgb,var(--alert) 8%,transparent)}
.slot b{font-family:var(--f-display);font-weight:450;font-size:15px}
.reason-in{display:grid;grid-template-columns:24px minmax(0,1fr);gap:8px;align-items:start}
.reason-in span{padding-top:15px}
.reason-in + .reason-in{margin-top:8px}
.reason-in span{font-family:var(--f-mono);font-size:11px;color:var(--dawn)}
.seg{display:grid;grid-template-columns:repeat(3,1fr);padding:3px;border-radius:12px;background:var(--surface-2)}
.seg button{height:34px;border-radius:9px;font-size:13px;font-weight:600;color:var(--muted)}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--fg);box-shadow:0 1px 4px rgba(0,0,0,.18)}
.disclaimer{font-size:12px;color:var(--faint);line-height:1.5;padding:0 4px}

/* ---------- Hojas y capas ---------- */
.sheet-wrap{position:absolute;inset:0;z-index:60;display:flex;align-items:flex-end;background:rgba(4,6,10,.5);animation:fade .25s both}
.sheet-wrap.closing{animation:fadeOut .25s both}
@keyframes fade{from{opacity:0}}
@keyframes fadeOut{to{opacity:0}}
.sheet{width:100%;max-height:92%;overflow-y:auto;background:var(--bg);border-radius:30px 30px 0 0;border-top:1px solid var(--line-2);padding:10px 20px calc(30px + env(safe-area-inset-bottom,0px));animation:up .45s var(--ease) both;scrollbar-width:none}
.sheet::-webkit-scrollbar{display:none}
.sheet-wrap.closing .sheet{animation:down .25s ease-in both}
@keyframes up{from{transform:translateY(100%)}}
@keyframes down{to{transform:translateY(100%)}}
.grab{width:38px;height:5px;border-radius:9px;background:var(--line-2);margin:0 auto 16px}
.sheet h2{font-size:26px;font-weight:450;letter-spacing:-.03em;line-height:1.1}
.sheet .prose p{margin-top:12px;color:color-mix(in srgb,var(--fg) 86%,var(--muted));font-size:15px}
.sheet .prose h4{font-size:16px;margin-top:22px;font-weight:600;font-family:var(--f-body);letter-spacing:0}
.sheet .prose ol,.sheet .prose ul{margin:10px 0 0;padding-left:20px;display:grid;gap:6px;font-size:14.5px}
.sheet .prose li::marker{color:var(--dawn);font-family:var(--f-mono);font-size:11px}
.callout{margin-top:16px;padding:14px 16px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line);font-size:14px}
.callout b{display:block;margin-bottom:4px}
.close-x{position:absolute;right:16px;top:14px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);z-index:2}
.close-x svg{width:16px;height:16px;stroke:var(--fg);stroke-width:2;fill:none}
.sheet-actions{display:grid;gap:10px;margin-top:24px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{height:36px;padding:0 14px;border-radius:99px;border:1px solid var(--line-2);font-size:13.5px;color:var(--muted)}
.chips button[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.phrase{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.phrase p{margin:0!important;font-size:14.5px}

.overlay{position:absolute;inset:0;z-index:70;background:var(--bg);overflow-y:auto;scrollbar-width:none;animation:fade .35s both}
.overlay::-webkit-scrollbar{display:none}
.ov-inner{min-height:100%;display:flex;flex-direction:column;padding:64px 22px calc(28px + env(safe-area-inset-bottom,0px))}
@media all{.ov-inner{padding-top:calc(env(safe-area-inset-top,0px) + 22px)}}

/* SOS */
.sos{--sc:var(--dawn)}
.sos .atmo .f3{opacity:.5}
.breath{position:relative;width:min(100%,280px);aspect-ratio:1;margin:18px auto 8px;display:grid;place-items:center}
.breath svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.orb{width:46%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 40% 35%,color-mix(in srgb,var(--dawn) 60%,#fff 40%),var(--dawn) 45%,var(--dusk) 100%);box-shadow:0 0 60px var(--glow);transform:scale(.62);transition:transform 4s cubic-bezier(.45,0,.55,1)}
.breath-label{position:absolute;bottom:-4px;left:0;right:0;text-align:center}
.timer-big{font-family:var(--f-mono);font-size:34px;font-weight:400;letter-spacing:-.03em;text-align:center;font-variant-numeric:tabular-nums}
.phase-word{font-family:var(--f-display);font-size:30px;font-weight:350;letter-spacing:-.03em;text-align:center;min-height:38px}
.steps{counter-reset:s}
.steps .check .ct b{font-weight:600}
.steps .check .ct span{display:block;color:var(--muted);font-size:13px;margin-top:2px}
[aria-checked="true"] .ct span{text-decoration:none}
.reasons-scroll{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-22px;padding:0 22px 4px;scrollbar-width:none}
.reasons-scroll::-webkit-scrollbar{display:none}
.reasons-scroll div{flex:0 0 78%;scroll-snap-align:start;padding:18px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line);font-family:var(--f-display);font-size:19px;font-weight:350;line-height:1.25;letter-spacing:-.02em}
.reasons-scroll div .mono{display:block;margin-bottom:10px;color:var(--dawn)}

/* Onboarding */
.ob-dots{display:flex;gap:6px}
.ob-dots i{height:4px;flex:1;border-radius:9px;background:var(--tick-off)}
.ob-dots i.on{background:var(--dawn)}
.ob-title{font-size:38px;font-weight:300;font-variation-settings:"opsz" 96;line-height:1;letter-spacing:-.045em}
.ob-body{display:grid;gap:14px;color:color-mix(in srgb,var(--fg) 86%,var(--muted));font-size:16px}
.ms-list{display:grid}
.ms-list > div{display:grid;grid-template-columns:1fr auto;gap:10px;padding:12px 0;border-top:1px solid var(--line)}
.ms-list b{font-weight:600;font-size:14.5px}
.ms-list span{font-size:12.5px;color:var(--muted)}
.ms-list time{font-family:var(--f-mono);font-size:12px;align-self:center}
.pay-price{display:flex;align-items:baseline;gap:10px}
.pay-price b{font-family:var(--f-display);font-size:52px;font-weight:300;letter-spacing:-.05em;line-height:1}
.feat{display:grid;grid-template-columns:22px 1fr;gap:12px;padding:10px 0;font-size:14.5px}
.feat svg{width:18px;height:18px;stroke:var(--dawn);stroke-width:2;fill:none;margin-top:2px}

.toast{position:absolute;left:50%;bottom:112px;translate:-50% 0;z-index:95;background:var(--fg);color:var(--bg);padding:10px 16px;border-radius:99px;font-size:13.5px;font-weight:600;white-space:nowrap;animation:toast 2.4s var(--ease) both;pointer-events:none}
@keyframes toast{0%{opacity:0;transform:translateY(10px)}12%,85%{opacity:1;transform:none}100%{opacity:0}}

.celebrate-num{font-family:var(--f-display);font-size:120px;font-weight:200;font-variation-settings:"opsz" 96;letter-spacing:-.07em;line-height:.9;background:linear-gradient(160deg,var(--dusk),var(--dawn));-webkit-background-clip:text;background-clip:text;color:transparent}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* ================= v2 ================= */
.back{display:inline-flex;align-items:center;gap:4px;font-weight:600;font-size:14px;color:var(--dawn);height:30px}
.chip.flame{color:var(--dawn);border-color:color-mix(in srgb,var(--dawn) 40%,transparent)}
.chip.flame svg{width:11px;height:11px;fill:currentColor}
.chip.pro{height:20px;padding:0 7px;font-size:9px;color:var(--gold);border-color:color-mix(in srgb,var(--gold) 55%,transparent)}

/* Nivel y XP */
.level{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center}
.lvl-badge{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:conic-gradient(from 200deg,var(--fog),var(--dusk),var(--dawn),var(--fog));position:relative}
.lvl-badge::after{content:"";position:absolute;inset:2px;border-radius:14px;background:var(--surface)}
.lvl-badge b{position:relative;z-index:1;font-family:var(--f-display);font-size:24px;font-weight:450;letter-spacing:-.04em}
.xpbar{height:10px;border-radius:9px;background:var(--tick-off);overflow:hidden;margin-top:8px;position:relative}
.xpbar i{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,var(--dusk),var(--dawn));position:relative;overflow:hidden}
.xpbar i::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);animation:shine 2.8s ease-in-out infinite}
@keyframes shine{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.lvl-meta{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.lvl-meta b{font-family:var(--f-display);font-weight:500;font-size:17px;letter-spacing:-.02em}
.near{color:var(--dawn);font-size:12.5px;font-weight:600}

/* Check-in */
.checkin{border-radius:var(--r-lg);padding:22px 20px;background:
  radial-gradient(120% 90% at 50% 120%,color-mix(in srgb,var(--dawn) 34%,transparent),transparent 70%),
  color-mix(in srgb,var(--surface) 90%,transparent);border:1px solid color-mix(in srgb,var(--dawn) 30%,var(--line));text-align:center;display:grid;gap:14px;justify-items:center}
.checkin h2{font-size:24px;font-weight:450;letter-spacing:-.03em;line-height:1.1}
.checkin p{color:var(--muted);font-size:14px;max-width:30ch}
.big-yes{width:100%;height:64px;border-radius:22px;background:var(--dawn);color:var(--dawn-ink);font-weight:700;font-size:17px;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 14px 34px -12px var(--glow);position:relative;overflow:hidden;transition:transform .2s var(--ease)}
.big-yes:active{transform:scale(.97)}
.big-yes::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);animation:shine 3.2s ease-in-out infinite}
.big-yes svg{width:22px;height:22px;stroke:currentColor;stroke-width:2.6;fill:none}
.done-badge{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--ok) 18%,transparent);color:var(--ok)}
.done-badge svg{width:30px;height:30px;stroke:currentColor;stroke-width:2.4;fill:none}
.gift{display:flex;align-items:center;gap:14px;width:100%;padding:14px 16px;border-radius:var(--r-md);border:1px dashed color-mix(in srgb,var(--gold) 60%,transparent);background:color-mix(in srgb,var(--gold) 8%,transparent);text-align:left}
.gift .gi{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--gold);color:#1a1405;animation:wiggle 2.4s ease-in-out infinite}
.gift .gi svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.9;fill:none}
@keyframes wiggle{0%,70%,100%{transform:rotate(0)}75%{transform:rotate(-9deg)}80%{transform:rotate(8deg)}85%{transform:rotate(-5deg)}90%{transform:rotate(3deg)}}
.gift b{display:block;font-size:14.5px}
.gift span{display:block;font-size:12.5px;color:var(--muted)}

/* Misiones */
.quest{display:grid;grid-template-columns:28px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line);width:100%;text-align:left}
.quest:first-child{border-top:0}
.quest .qb{width:26px;height:26px;border-radius:50%;border:1.8px solid var(--line-2);display:grid;place-items:center}
.quest .qb svg{width:14px;height:14px;stroke:var(--dawn-ink);stroke-width:2.8;fill:none;opacity:0}
.quest.ok .qb{background:var(--dawn);border-color:var(--dawn)}
.quest.ok .qb svg{opacity:1}
.quest b{display:block;font-weight:600;font-size:14.5px}
.quest.ok b{color:var(--muted);text-decoration:line-through;text-decoration-color:var(--faint)}
.quest span.s{display:block;font-size:12.5px;color:var(--muted)}
.xp-pill{font-family:var(--f-mono);font-size:10.5px;padding:4px 8px;border-radius:99px;background:color-mix(in srgb,var(--gold) 16%,transparent);color:var(--gold);white-space:nowrap}
.qring{display:flex;align-items:center;gap:10px}
.qring svg{width:34px;height:34px;transform:rotate(-90deg)}

/* Medidores */
.meters{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.meter{display:grid;justify-items:center;gap:6px;text-align:center}
.meter svg{width:74px;height:74px;transform:rotate(-90deg)}
.meter .v{position:relative;display:grid;place-items:center}
.meter .v b{position:absolute;font-family:var(--f-display);font-size:19px;font-weight:450;letter-spacing:-.03em}
.meter span{font-size:11.5px;color:var(--muted);line-height:1.25}

/* Cerebro */
.rings-wrap{position:relative;width:min(100%,240px);aspect-ratio:1;margin:4px auto 0}
.rings-wrap svg{width:100%;height:100%;transform:rotate(-90deg)}
.rings-wrap .ring{transition:stroke-dashoffset 1.4s var(--ease)}
.rings-center{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.rings-center b{font-family:var(--f-display);font-size:52px;font-weight:250;letter-spacing:-.06em;line-height:.9}
.ring-legend{display:grid;gap:10px;margin-top:16px}
.ring-legend div{display:grid;grid-template-columns:12px 1fr auto;gap:10px;align-items:center;font-size:14px}
.ring-legend i{width:12px;height:12px;border-radius:50%}
.ring-legend b{font-family:var(--f-mono);font-weight:400;font-size:13px}
.metrics{display:grid;gap:10px}
.metric{padding:14px 16px;border-radius:var(--r-md);border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 70%,transparent)}
.metric .mh{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.metric .mh b{font-weight:600;font-size:14.5px}
.metric .mh span{font-family:var(--f-mono);font-size:13px}
.metric p{font-size:12.5px;color:var(--muted);margin-top:6px}
.metric .bar{margin-top:10px}
.up{color:var(--ok);font-size:11px;font-family:var(--f-mono)}
.facts{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:20px;margin-inline:-20px;padding:2px 20px 6px;scrollbar-width:none}
.facts::-webkit-scrollbar{display:none}
.fact{flex:0 0 76%;scroll-snap-align:start;border-radius:var(--r-md);padding:18px;background:var(--surface);border:1px solid var(--line);position:relative;overflow:hidden;min-height:150px;display:flex;flex-direction:column;justify-content:space-between;gap:14px}
.fact p{font-family:var(--f-display);font-size:18px;font-weight:350;line-height:1.25;letter-spacing:-.02em}
.fact .src{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.fact .n{font-family:var(--f-mono);font-size:10px;color:var(--dawn)}

/* Bloqueos Pro */
.locked{position:relative;border-radius:var(--r-md);overflow:hidden}
.locked .blur{filter:blur(7px) saturate(.8);opacity:.75;pointer-events:none;user-select:none}
.lock-cta{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:8px;text-align:center;padding:14px;background:linear-gradient(to bottom,transparent,color-mix(in srgb,var(--bg) 55%,transparent))}
.lock-cta .lk{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:#1a1405;box-shadow:0 8px 24px -8px var(--gold)}
.lock-cta .lk svg{width:18px;height:18px;stroke:currentColor;stroke-width:2;fill:none}
.lock-cta b{font-size:14.5px}
.lock-cta span{font-size:12.5px;color:var(--muted);max-width:26ch}
.btn.gold{background:var(--gold);color:#1a1405}
.pro-card{border-radius:var(--r-lg);padding:20px;background:radial-gradient(140% 100% at 100% 0%,color-mix(in srgb,var(--gold) 22%,transparent),transparent 60%),var(--surface);border:1px solid color-mix(in srgb,var(--gold) 40%,var(--line))}
.pro-list{display:grid;gap:8px;margin-top:12px}
.pro-list div{display:grid;grid-template-columns:20px 1fr;gap:10px;font-size:14px;align-items:start}
.pro-list svg{width:16px;height:16px;stroke:var(--gold);stroke-width:2.2;fill:none;margin-top:2px}

/* Comunidad */
.live{display:flex;align-items:center;gap:8px}
.live i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 var(--ok);animation:live 1.8s ease-out infinite}
@keyframes live{from{box-shadow:0 0 0 0 color-mix(in srgb,var(--ok) 60%,transparent)}to{box-shadow:0 0 0 10px transparent}}
.big-count{font-family:var(--f-display);font-size:64px;font-weight:250;letter-spacing:-.06em;line-height:.95;font-variant-numeric:tabular-nums}
.rank-card{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center}
.rank-card .pos{font-family:var(--f-display);font-size:46px;font-weight:300;letter-spacing:-.05em;line-height:1}
.board{display:grid}
.brow{display:grid;grid-template-columns:34px 36px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.brow:first-child{border-top:0}
.brow .r{font-family:var(--f-mono);font-size:12px;color:var(--muted);text-align:center}
.brow .av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:13px;color:#fff}
.brow .nm{min-width:0}
.brow .nm b{display:block;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brow .nm span{font-size:11.5px;color:var(--muted)}
.brow .dd{font-family:var(--f-display);font-size:18px;font-weight:450;letter-spacing:-.02em;text-align:right}
.brow .dd small{display:block;font-family:var(--f-mono);font-size:9px;color:var(--faint);letter-spacing:.08em}
.brow.me{margin-inline:-12px;padding-inline:12px;border-radius:14px;background:color-mix(in srgb,var(--dawn) 14%,transparent);border-top-color:transparent}
.brow.me + .brow{border-top-color:transparent}
.brow.gap{grid-template-columns:1fr;text-align:center;color:var(--faint);font-family:var(--f-mono);font-size:11px;padding:4px 0}
.medal-1 .r,.medal-2 .r,.medal-3 .r{color:var(--gold);font-weight:500}
.feed{display:grid}
.feed div{display:grid;grid-template-columns:8px 1fr auto;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--line);font-size:13.5px}
.feed div:first-child{border-top:0}
.feed i{width:8px;height:8px;border-radius:50%;background:var(--dawn)}
.feed time{font-family:var(--f-mono);font-size:10px;color:var(--faint)}
.ex-note{font-size:11.5px;color:var(--faint);display:flex;gap:6px;align-items:center}

/* Logros */
.badges{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 8px}
.badge{display:grid;justify-items:center;gap:6px;text-align:center}
.badge .md{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(from 210deg,var(--fog),var(--dusk),var(--dawn),var(--gold),var(--fog));position:relative}
.badge .md::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--surface)}
.badge .md b{position:relative;z-index:1;font-family:var(--f-display);font-size:17px;font-weight:500;letter-spacing:-.03em}
.badge .md svg{position:relative;z-index:1;width:20px;height:20px;stroke:var(--fg);stroke-width:1.8;fill:none}
.badge span{font-size:10.5px;line-height:1.2;color:var(--fg)}
.badge.off .md{background:var(--tick-off)}
.badge.off .md b,.badge.off .md svg{opacity:.35}
.badge.off span{color:var(--faint)}

/* Acordeón */
details.acc{border-top:1px solid var(--line)}
details.acc:first-of-type{border-top:0}
details.acc summary{list-style:none;display:flex;align-items:center;gap:14px;padding:14px 0;cursor:pointer}
details.acc summary::-webkit-details-marker{display:none}
details.acc summary .tx{flex:1;min-width:0}
details.acc summary .tx b{display:block;font-weight:600;font-size:14.5px}
details.acc summary .tx span{display:block;font-size:12.5px;color:var(--muted)}
details.acc summary .chev{transition:transform .25s var(--ease)}
details.acc[open] summary .chev{transform:rotate(90deg)}
details.acc .acc-body{padding-bottom:16px}

/* Aviso especialista */
.pro-help{display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:start;border-radius:var(--r-lg);padding:18px;background:color-mix(in srgb,var(--sky) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--sky) 35%,transparent)}
.pro-help .ic2{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--sky);color:#0b1520}
.pro-help .ic2 svg{width:20px;height:20px;stroke:currentColor;stroke-width:2;fill:none}
.pro-help b{display:block;font-size:15px}
.pro-help p{font-size:13.5px;color:var(--muted);margin-top:4px}

/* Confeti */
.confetti{position:absolute;inset:0;z-index:99;pointer-events:none}

/* Recompensa: rodillo */
.reel{position:relative;height:150px;border-radius:22px;overflow:hidden;margin-top:18px;background:var(--surface);border:1px solid color-mix(in srgb,var(--gold) 45%,var(--line));box-shadow:inset 0 16px 20px -14px rgba(0,0,0,.4),inset 0 -16px 20px -14px rgba(0,0,0,.4)}
.reel::before,.reel::after{content:"";position:absolute;left:0;right:0;height:38px;z-index:2;pointer-events:none}
.reel::before{top:0;background:linear-gradient(var(--surface),transparent)}
.reel::after{bottom:0;background:linear-gradient(transparent,var(--surface))}
.reel-track{will-change:transform}
.reel-item{height:150px;display:grid;place-content:center;justify-items:center;gap:8px;text-align:center;padding:0 20px}
.reel-item .ri{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--surface-2);color:var(--gold)}
.reel-item .ri svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.8;fill:none}
.reel-item b{font-family:var(--f-display);font-size:22px;font-weight:450;letter-spacing:-.02em}
.reel.win{animation:winGlow 1.2s ease-out}
@keyframes winGlow{0%{box-shadow:0 0 0 0 var(--gold)}100%{box-shadow:0 0 0 18px transparent}}
.reward-body{margin-top:16px;min-height:60px}

/* SOS v2 */
.sos2 .ov-inner{padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}
.sos-head{display:grid;grid-template-columns:36px 1fr 36px;align-items:center;gap:10px}
.sos-head .ob-dots{justify-content:center}
.urge-timer{margin-top:18px;padding:12px 14px;border-radius:16px;background:var(--surface);border:1px solid var(--line);display:grid;gap:8px}
.urge-timer .row2{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:13px;color:var(--muted)}
.urge-timer b{font-family:var(--f-mono);font-weight:400;font-size:16px;color:var(--fg)}
.sos-stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:18px 0}
.sos-icon{width:112px;height:112px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--dawn) 30%,transparent),transparent 70%);border:1px solid color-mix(in srgb,var(--dawn) 30%,transparent);color:var(--dawn)}
.sos-icon svg{width:54px;height:54px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.sos-title{font-family:var(--f-display);font-size:32px;font-weight:350;letter-spacing:-.04em;line-height:1.05;max-width:14ch}
.sos-sub{color:var(--muted);font-size:15px;max-width:30ch}
.sos-actions{display:grid;gap:10px}
.tap-count{width:170px;height:170px;border-radius:50%;background:radial-gradient(circle at 45% 35%,color-mix(in srgb,var(--dawn) 55%,#fff 20%),var(--dawn) 50%,var(--dusk));color:var(--dawn-ink);display:grid;place-content:center;box-shadow:0 20px 50px -18px var(--glow);transition:transform .12s}
.tap-count:active{transform:scale(.94)}
.tap-count b{font-family:var(--f-display);font-size:64px;font-weight:350;line-height:.9;letter-spacing:-.05em}
.tap-count span{font-family:var(--f-mono);font-size:10px;letter-spacing:.1em}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
.tile{border-radius:20px;padding:18px 12px;border:1.5px solid var(--line-2);display:grid;justify-items:center;gap:10px;font-weight:600;font-size:14px}
.tile svg{width:34px;height:34px;stroke:var(--dawn);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tile[aria-pressed="true"]{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,transparent)}
.tile[aria-pressed="true"] svg{stroke:var(--ok)}
.feel{display:grid;gap:10px;width:100%}
.feel button{height:64px;border-radius:20px;font-weight:700;font-size:17px}
.reason-big{font-family:var(--f-display);font-size:26px;font-weight:350;line-height:1.2;letter-spacing:-.025em;max-width:18ch}
.reason-big::before{content:"“";color:var(--dawn)}
.reason-big::after{content:"”";color:var(--dawn)}

/* Paywall v2 */
.pw{min-height:100%;display:flex;flex-direction:column;padding:60px 20px calc(22px + env(safe-area-inset-bottom,0px));background:radial-gradient(120% 60% at 50% 0%,color-mix(in srgb,var(--dusk) 26%,transparent),transparent 70%),var(--bg)}
@media all{.pw{padding-top:calc(env(safe-area-inset-top,0px) + 16px)}}
.pw-top{display:flex;justify-content:space-between;align-items:center;min-height:34px}
.pw-x{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:var(--faint)}
.pw-x svg{width:13px;height:13px;stroke:currentColor;stroke-width:2;fill:none}
.pw-restore{height:30px;padding:0 12px;border-radius:99px;background:var(--surface);font-size:12.5px;font-weight:600;color:var(--muted)}
.pw h1{font-size:34px;font-weight:450;letter-spacing:-.04em;line-height:1.02;text-align:center;margin-top:10px}
.pw .pw-sub{text-align:center;color:var(--muted);margin-top:10px;font-size:15px}
.pw-hero{position:relative;width:190px;height:190px;margin:14px auto 4px}
.pw-hero .dial-num{font-size:66px}
.pw-feats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:6px}
.pw-feats div{display:grid;grid-template-columns:18px 1fr;gap:8px;font-size:13px;line-height:1.3;align-items:start}
.pw-feats svg{width:16px;height:16px;stroke:var(--dawn);stroke-width:2.2;fill:none;margin-top:1px}
.plans{display:grid;gap:10px;margin-top:auto;padding-top:18px}
.plan{position:relative;display:grid;grid-template-columns:1fr auto 24px;gap:12px;align-items:center;padding:16px;border-radius:18px;border:1.5px solid var(--line-2);background:var(--surface);text-align:left;width:100%}
.plan b{display:block;font-size:16px;font-weight:700}
.plan span{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.plan .pp{font-weight:700;font-size:15px;white-space:nowrap}
.plan .rd{width:22px;height:22px;border-radius:50%;border:1.8px solid var(--line-2);display:grid;place-items:center}
.plan .rd svg{width:12px;height:12px;stroke:#fff;stroke-width:3;fill:none;opacity:0}
.plan[aria-checked="true"]{border-color:var(--dawn);box-shadow:0 0 0 1px var(--dawn)}
.plan[aria-checked="true"] .rd{background:var(--dawn);border-color:var(--dawn)}
.plan[aria-checked="true"] .rd svg{opacity:1;stroke:var(--dawn-ink)}
.plan .flag{position:absolute;top:-1.5px;left:-1.5px;right:-1.5px;transform:translateY(-100%);height:24px;border-radius:14px 14px 0 0;background:var(--dawn);color:var(--dawn-ink);font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;display:grid;place-items:center}
.plan.has-flag{margin-top:24px;border-top-left-radius:0;border-top-right-radius:0}
.pw-cta{margin-top:14px;height:58px;border-radius:99px;width:100%;background:var(--dawn);color:var(--dawn-ink);font-weight:700;font-size:17px;box-shadow:0 16px 36px -14px var(--glow)}
.pw-cta.green{background:var(--ok);color:#06140d;box-shadow:0 16px 36px -14px color-mix(in srgb,var(--ok) 60%,transparent)}
.pw-foot{text-align:center;font-size:12.5px;color:var(--muted);margin-top:10px}
.pw-links{display:flex;justify-content:center;gap:18px;font-size:12px;color:var(--faint);margin-top:6px}
.offer{margin:26px 0 0;position:relative;border-radius:22px;background:var(--surface);border:1px solid var(--line-2);padding:34px 18px 20px;text-align:center}
.offer .tag{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);height:28px;padding:0 14px;border-radius:99px;background:var(--ok);color:#06140d;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;display:grid;place-items:center;white-space:nowrap}
.offer .pr{display:flex;justify-content:center;align-items:baseline;gap:10px;flex-wrap:wrap}
.offer s{color:var(--muted);font-size:18px}
.offer .now{font-family:var(--f-display);font-size:52px;font-weight:500;letter-spacing:-.04em;color:var(--ok);line-height:1}
.offer .per{color:var(--ok);font-weight:700}
.offer p{font-size:13px;color:var(--muted);margin-top:8px}
.save-big{font-family:var(--f-display);font-size:110px;font-weight:200;letter-spacing:-.07em;line-height:.9;text-align:center;margin-top:18px;background:linear-gradient(160deg,var(--ok),var(--sky));-webkit-background-clip:text;background-clip:text;color:transparent}
.countdown{display:flex;justify-content:center;gap:6px;margin-top:14px;font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.countdown b{color:var(--fg);font-weight:500}

/* ================= v3 · Faro y Hoy simplificado ================= */
.tl-r{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.avatar-btn{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:13px;background:linear-gradient(150deg,var(--dusk),var(--dawn));color:var(--dawn-ink);box-shadow:0 0 0 2px var(--bg),0 0 0 3px var(--line-2);transition:transform .3s var(--ease)}
.avatar-btn:active{transform:scale(.92)}
@keyframes rise{from{opacity:.001;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.view{animation:none}
.view.enter > *{animation:rise .7s var(--ease) both}
.view.enter > *:nth-child(2){animation-delay:.04s}.view.enter > *:nth-child(3){animation-delay:.08s}.view.enter > *:nth-child(4){animation-delay:.12s}.view.enter > *:nth-child(5){animation-delay:.16s}.view.enter > *:nth-child(n+6){animation-delay:.2s}
.checkin.done{padding-block:18px}
.step-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.step-tile{position:relative;display:grid;justify-items:start;gap:4px;text-align:left;padding:14px 12px 12px;border-radius:22px;background:color-mix(in srgb,var(--surface) 86%,transparent);border:1px solid var(--line);min-height:128px;transition:transform .3s var(--ease),border-color .3s,background .3s}
.step-tile:active{transform:scale(.96)}
.step-tile .st-ic{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:var(--surface-2);color:var(--dawn);margin-bottom:auto;transition:all .4s var(--ease)}
.step-tile .st-ic svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.step-tile b{font-size:15px;margin-top:10px}
.step-tile > span:not(.st-ic){font-size:12px;color:var(--muted)}
.step-tile em{position:absolute;top:12px;right:10px;font-style:normal;font-size:9.5px;padding:3px 6px}
.step-tile.ok{border-color:color-mix(in srgb,var(--ok) 45%,transparent);background:color-mix(in srgb,var(--ok) 8%,var(--surface))}
.step-tile.ok .st-ic{background:var(--ok);color:#06140d}
.step-tile.ok em{opacity:.35}
.faro-card{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;width:100%;text-align:left;padding:16px 18px;border-radius:var(--r-lg);background:radial-gradient(120% 140% at 0% 50%,color-mix(in srgb,var(--dusk) 26%,transparent),transparent 60%),color-mix(in srgb,var(--surface) 86%,transparent);border:1px solid color-mix(in srgb,var(--dusk) 35%,var(--line));transition:transform .3s var(--ease)}
.faro-card:active{transform:scale(.98)}
.fc-tx b{display:block;font-family:var(--f-display);font-weight:500;font-size:18px;letter-spacing:-.02em}
.fc-tx span{display:block;font-size:13px;color:var(--muted);margin-top:2px}
.brain-mini{text-align:left;width:100%}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.card.mini{display:grid;gap:4px;text-align:left;padding:16px}
.card.mini b{font-family:var(--f-display);font-size:32px;font-weight:350;letter-spacing:-.04em;line-height:1.05;margin-top:6px}
.card.mini > span:last-child{font-size:12px;color:var(--muted);line-height:1.3}

/* Orbe de Faro */
.faro-orb{position:relative;width:46px;height:46px;border-radius:50%;flex:none;display:block;background:radial-gradient(circle at 35% 30%,#fff 0%,color-mix(in srgb,var(--dawn) 80%,#fff) 18%,var(--dawn) 42%,var(--dusk) 75%,color-mix(in srgb,var(--fog) 80%,#000) 100%);box-shadow:0 0 28px -4px var(--glow),inset 0 -6px 14px rgba(0,0,0,.25);animation:orbBreath 5s ease-in-out infinite}
.faro-orb i{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 70%,rgba(255,255,255,.55) 80%,transparent 90%);mix-blend-mode:soft-light;animation:spin 7s linear infinite}
.faro-orb.sm{width:42px;height:42px}
.faro-orb.big{width:92px;height:92px}
.faro-orb.busy{animation:orbBreath 1.4s ease-in-out infinite}
.faro-orb.busy i{animation-duration:1.8s}
@keyframes orbBreath{0%,100%{transform:scale(.94)}50%{transform:scale(1.04)}}
@keyframes spin{to{transform:rotate(360deg)}}

/* Chat */
.app.in-faro .screen{padding-bottom:260px}
.faro-view{gap:14px}
.view.enter.faro-view > *{animation:none}
.faro-head{display:grid;grid-template-columns:32px auto 1fr;gap:12px;align-items:center;padding:0 0 4px}
.avatar-back{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);font-size:22px;line-height:1;color:var(--muted)}
.fh-tx b{display:block;font-family:var(--f-display);font-size:20px;font-weight:500;letter-spacing:-.02em;line-height:1.1}
.fh-tx span{display:block;font-size:12px;color:var(--muted)}
.modes{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:4px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}
.modes button{display:flex;align-items:center;justify-content:center;gap:6px;height:40px;border-radius:14px;font-size:13.5px;font-weight:600;color:var(--muted);transition:all .35s var(--ease)}
.modes button svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.modes button[aria-selected="true"]{background:var(--fg);color:var(--bg)}
.sos-inline{display:grid;grid-template-columns:32px 1fr auto;gap:10px;align-items:center;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--dawn) 14%,transparent);border:1px solid color-mix(in srgb,var(--dawn) 35%,transparent);text-align:left;font-size:14px}
.sos-inline svg{width:20px;height:20px;stroke:var(--dawn);stroke-width:1.9;fill:none}
.faro-empty{display:grid;justify-items:center;text-align:center;gap:16px;padding:26px 10px 6px}
.faro-empty p{font-family:var(--f-display);font-size:21px;font-weight:350;line-height:1.3;letter-spacing:-.02em;max-width:24ch;color:color-mix(in srgb,var(--fg) 88%,var(--muted))}
.thread{display:grid;gap:16px;padding-top:6px}
.msg{animation:msgIn .55s var(--ease) both}
@keyframes msgIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.msg.me{justify-self:end;max-width:84%;padding:11px 15px;border-radius:22px 22px 6px 22px;background:var(--fg);color:var(--bg);font-size:15px}
.msg.ai{display:grid;grid-template-columns:22px 1fr;gap:10px;max-width:96%}
.ai-dot{width:22px;height:22px;border-radius:50%;margin-top:2px;background:radial-gradient(circle at 35% 30%,#fff,var(--dawn) 45%,var(--dusk))}
.ai-tx{min-width:0;font-size:15.5px;line-height:1.6;color:color-mix(in srgb,var(--fg) 92%,var(--muted))}
.ai-tx p + p{margin-top:10px}
.ai-tx b{color:var(--fg);font-weight:600}
.typing{display:inline-flex;gap:4px;padding:8px 0}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:dot 1.2s ease-in-out infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.crisis{display:grid;grid-template-columns:32px 1fr;gap:10px;align-items:center;margin-top:12px;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--alert) 12%,transparent);border:1px solid color-mix(in srgb,var(--alert) 40%,transparent)}
.crisis svg{stroke:var(--alert);stroke-width:4;fill:none}
.crisis b{display:block;font-size:14px}
.crisis span{display:block;font-family:var(--f-mono);font-size:12px;margin-top:2px}
.faro-save{display:flex;justify-content:center;animation:msgIn .5s var(--ease) both}
.faro-save .btn svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.9;fill:none}
.faro-alt{text-align:center;font-size:13px}
.composer-slot{position:absolute;left:0;right:0;bottom:calc(94px + env(safe-area-inset-bottom,0px));z-index:41;padding:0 12px}
.composer{display:grid;gap:8px}
.sugg{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-inline:-12px;padding:0 12px 2px}
.sugg::-webkit-scrollbar{display:none}
.sugg button{flex:none;height:36px;padding:0 14px;border-radius:99px;border:1px solid var(--line-2);background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:13px;color:var(--fg);white-space:nowrap;transition:transform .25s var(--ease)}
.sugg button:active{transform:scale(.95)}
.compose-row{display:grid;grid-template-columns:1fr 44px;gap:8px;align-items:end;padding:6px 6px 6px 16px;border-radius:26px;background:var(--glass);border:1px solid var(--line-2);backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);box-shadow:0 10px 30px -14px rgba(0,0,0,.4)}
.compose-row textarea{border:0;background:transparent;padding:10px 0;min-height:40px;max-height:120px;font-size:15.5px;resize:none;outline:none;field-sizing:content}
.send{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--dawn);color:var(--dawn-ink);transition:transform .25s var(--ease)}
.send:active{transform:scale(.9)}
.send svg{width:20px;height:20px;stroke:currentColor;stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.send svg rect{fill:currentColor;stroke:none}
.left-note{text-align:center;font-size:11.5px;color:var(--faint)}
.limit-card{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:center;padding:14px;border-radius:20px;background:var(--glass);border:1px solid color-mix(in srgb,var(--gold) 45%,var(--line));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.limit-card > span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:#1a1405}
.limit-card svg{width:16px;height:16px;stroke:currentColor;stroke-width:2;fill:none}
.limit-card b{font-size:13.5px;display:block}
.limit-card p{font-size:12px;color:var(--muted);margin-top:2px}

/* ================= v4 ================= */
.hid{filter:blur(5px);user-select:none;cursor:pointer;border-radius:4px;background:color-mix(in srgb,var(--gold) 10%,transparent);padding:0 2px;transition:filter .3s}
.bar-hid,.chart-hid{filter:blur(5px)}
.is-hid-wrap,.metric.is-hid,.fact[data-act="upgrade"]{cursor:pointer}
.metric{position:relative}
.metric .peek-mini{position:absolute;top:12px;right:12px}
.metric.is-hid .mh span{margin-right:44px}
.peek-mini{display:inline-flex;align-items:center;gap:3px;height:20px;padding:0 7px;border-radius:99px;font-family:var(--f-mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);background:color-mix(in srgb,var(--gold) 12%,transparent);border:1px solid color-mix(in srgb,var(--gold) 35%,transparent);white-space:nowrap;flex:none}
.peek-mini svg{width:10px;height:10px;fill:currentColor;stroke:none}
.pro-peek{position:relative;cursor:pointer}
.pro-peek .tx span,.pro-peek p{filter:blur(4px)}
.peek-tag{position:absolute;top:0;right:0;display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border-radius:99px;background:var(--gold);color:#1a1405;font-size:11.5px;font-weight:700}
.peek-tag svg{width:12px;height:12px;fill:currentColor;stroke:none}
.fact .peek-mini{position:absolute;top:14px;right:14px}

/* Pasos del día */
.steps-card{border-radius:28px;padding:20px;background:radial-gradient(130% 80% at 100% 0%,color-mix(in srgb,var(--dawn) 16%,transparent),transparent 60%),color-mix(in srgb,var(--surface) 90%,transparent);border:1px solid color-mix(in srgb,var(--dawn) 22%,var(--line));box-shadow:0 30px 60px -40px rgba(0,0,0,.6)}
.steps-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.steps-head h2{font-size:26px;font-weight:450;letter-spacing:-.035em;margin-top:4px}
.steps-ring{position:relative;width:60px;height:60px;flex:none}
.steps-ring svg{width:100%;height:100%}
.steps-ring b{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--f-mono);font-size:12px;font-weight:500}
.ring-anim{transition:stroke-dasharray .9s var(--ease)}
.steps{display:grid;gap:8px;margin-top:16px}
.step{border-radius:20px;border:1px solid var(--line);background:color-mix(in srgb,var(--surface-2) 45%,transparent);transition:border-color .4s,background .4s}
.step.next{border-color:color-mix(in srgb,var(--dawn) 55%,transparent);background:color-mix(in srgb,var(--dawn) 7%,var(--surface));box-shadow:0 0 0 4px color-mix(in srgb,var(--dawn) 8%,transparent)}
.step-main{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;width:100%;padding:12px 14px;text-align:left}
.step-main[disabled]{cursor:default}
.step-n{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-display);font-size:19px;font-weight:450;border:1.5px solid var(--line-2);color:var(--muted);transition:all .5s var(--ease)}
.step.next .step-n{background:var(--dawn);border-color:var(--dawn);color:var(--dawn-ink)}
.step.ok .step-n{background:var(--ok);border-color:var(--ok);color:#06140d}
.step-n svg{width:18px;height:18px;stroke:currentColor;stroke-width:2.6;fill:none}
.step-tx{min-width:0}
.step-tx b{display:block;font-size:15.5px;font-weight:600}
.step-tx span{display:block;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.step.ok .step-tx b{color:var(--muted)}
.step-actions{display:grid;gap:6px;justify-items:center;padding:0 14px 14px}
.big-yes.sm{height:52px;font-size:15.5px;border-radius:18px}
.link.soft{color:var(--muted);font-size:13px;font-weight:500}
.steps-foot{margin-top:12px;font-size:12.5px;color:var(--muted);text-align:center}
.steps-card.complete{text-align:center;display:grid;justify-items:center;gap:10px;padding:26px 20px;background:radial-gradient(120% 90% at 50% 120%,color-mix(in srgb,var(--ok) 22%,transparent),transparent 70%),color-mix(in srgb,var(--surface) 90%,transparent);border-color:color-mix(in srgb,var(--ok) 35%,var(--line))}
.steps-card.complete h2{font-size:26px;font-weight:450;letter-spacing:-.035em}
.steps-card.complete p{color:var(--muted);font-size:14px}
.done-badge.big{width:76px;height:76px;animation:pop .7s var(--ease) both}
@keyframes pop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}

/* Análisis */
.insight-card{padding-bottom:12px}
.risk-row{display:grid;grid-template-columns:150px 1fr;gap:14px;align-items:center}
.gauge-wrap{position:relative}
.gauge{width:100%;height:auto;display:block}
.gauge-arc{transition:stroke-dasharray 1.2s var(--ease)}
.gauge-c{position:absolute;left:0;right:0;bottom:2px;text-align:center}
.gauge-c b{display:block;font-family:var(--f-display);font-size:24px;font-weight:450;letter-spacing:-.03em;line-height:1}
.gauge-c .mono{font-size:9px}
.risk-note{font-size:12.5px;color:var(--muted);line-height:1.45}
.insights{display:grid;margin-top:12px}
.insight{display:grid;grid-template-columns:36px 1fr auto;gap:12px;align-items:start;padding:13px 0;border-top:1px solid var(--line);text-align:left;width:100%}
.ins-ic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--tc) 16%,transparent);color:var(--tc)}
.ins-ic svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.ins-tx b{display:block;font-size:14.5px;font-weight:600;line-height:1.35}
.ins-tx > span{display:block;font-size:13px;color:var(--muted);margin-top:3px;line-height:1.45}
.tone-dawn{--tc:var(--dawn)}.tone-sky{--tc:var(--sky)}.tone-dusk{--tc:var(--dusk)}.tone-gold{--tc:var(--gold)}.tone-alert{--tc:var(--alert)}
.urge-pill{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;width:100%;padding:14px 16px;border-radius:22px;text-align:left;background:color-mix(in srgb,var(--surface) 86%,transparent);border:1px solid var(--line)}
.up-ic{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--dawn) 18%,transparent)}
.up-ic svg{width:20px;height:20px;stroke:var(--dawn);stroke-width:2;fill:none;stroke-linejoin:round}
.urge-pill b{display:block;font-size:15px}
.urge-pill span span{display:block;font-size:12.5px;color:var(--muted)}
.safe-line{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:var(--faint);padding:4px 0 8px}
.safe-line svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.9;fill:none}

/* Watch */
.watch-svg{width:74px;height:auto;flex:none;filter:drop-shadow(0 10px 18px rgba(0,0,0,.35))}
.wc-row{display:grid;grid-template-columns:74px 1fr;gap:16px;align-items:center}
.wc-row b{display:block;font-size:15.5px}
.wc-row p{font-size:13px;color:var(--muted);margin:4px 0 10px}
.watch-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.watch-stats div{padding:10px;border-radius:14px;background:var(--surface-2);display:grid;gap:4px}
.watch-stats .mono{font-size:8.5px}
.watch-stats b{font-family:var(--f-display);font-size:19px;font-weight:450;letter-spacing:-.02em}
.pat-bars{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;align-items:end;height:130px}
.pat-bars > div{display:grid;gap:6px;justify-items:center;align-self:end}
.pat-bars i{display:block;width:100%;border-radius:8px}
.pat-bars .mono{font-size:9px}

/* Calendario */
.cell{position:relative}
.cell.hito{box-shadow:inset 0 0 0 1.5px var(--h)}
.cell.hito i{position:absolute;top:-3px;right:-3px;width:8px;height:8px;border-radius:50%;background:var(--h);box-shadow:0 0 0 2px var(--surface)}
.cell.hito.w{background:var(--h);color:var(--bg)}
.cell.full:not(.hito){box-shadow:inset 0 0 0 1.5px color-mix(in srgb,#fff 35%,transparent)}
.hitos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hito-card{padding:14px;border-radius:20px;background:color-mix(in srgb,var(--surface) 86%,transparent);border:1px solid var(--line);display:grid;gap:4px;position:relative;overflow:hidden}
.hito-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--h)}
.hito-card .mono{color:var(--h)}
.hito-card b{font-family:var(--f-display);font-size:17px;font-weight:500;letter-spacing:-.02em}
.hito-card > span:last-child{font-size:12px;color:var(--muted)}
.cal-events{display:grid;gap:8px;margin-top:10px}
.cal-ev{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:center}
.cal-date{width:44px;height:44px;border-radius:12px;background:var(--surface-2);display:grid;place-content:center;text-align:center}
.cal-date b{font-family:var(--f-display);font-size:17px;font-weight:500;line-height:1}
.cal-date span{font-family:var(--f-mono);font-size:8px;text-transform:uppercase;color:var(--alert)}
.cal-ev > span:last-child b{display:block;font-size:14px;font-weight:600}
.cal-ev > span:last-child span{display:block;font-size:12px;color:var(--muted)}
.cal-note{font-size:11.5px;color:var(--faint);margin-top:10px}

/* Botón central Faro */
.faro-btn{background:none!important;box-shadow:0 0 0 6px var(--bg),0 0 0 7px var(--line)!important}
.faro-btn::before{border-color:var(--dusk)!important}
.faro-btn .faro-orb{width:58px;height:58px}

/* Puerta de Faro */
.gate-hero{display:grid;place-items:center;margin-top:24px}
.gate-demo{display:grid;gap:12px;margin-top:22px;padding:16px;border-radius:22px;background:var(--surface);border:1px solid var(--line)}
.gate-demo .msg{animation:none}
.gate-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.gate-modes div{display:grid;gap:4px;justify-items:center;text-align:center;padding:12px 6px;border-radius:18px;border:1px solid var(--line)}
.gate-modes span{color:var(--dawn)}
.gate-modes svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.9;fill:none}
.gate-modes b{font-size:13.5px}
.gate-modes em{font-style:normal;font-size:11px;color:var(--muted);line-height:1.3}
.gate-crisis{text-align:center;font-size:11.5px;color:var(--faint);line-height:1.5}
.btn svg{width:16px;height:16px;stroke:currentColor;stroke-width:2;fill:none}

/* Por qué Pro */
.why{display:grid;gap:12px;margin-top:14px}
.why-row{display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:start}
.why-ic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--gold) 16%,transparent);color:var(--gold)}
.why-ic svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.9;fill:none}
.why-row b{display:block;font-size:14.5px}
.why-row span{display:block;font-size:12.5px;color:var(--muted);margin-top:2px;line-height:1.4}
.why-link{margin:14px auto 0;display:block;font-size:13px;font-weight:600;color:var(--dawn)}
.why-inline{margin-top:10px;padding:14px;border-radius:18px;background:var(--surface);border:1px solid var(--line);animation:msgIn .5s var(--ease) both}
.why-inline .why{margin-top:0}

/* Notificación iOS */
.ios-banner{position:absolute;left:10px;right:10px;top:calc(56px + env(safe-area-inset-top,0px));z-index:96;display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:center;padding:12px 14px;border-radius:24px;text-align:left;background:color-mix(in srgb,var(--surface) 78%,transparent);backdrop-filter:blur(26px) saturate(1.6);-webkit-backdrop-filter:blur(26px) saturate(1.6);border:1px solid var(--line-2);box-shadow:0 20px 50px -20px rgba(0,0,0,.6);animation:bannerIn .7s var(--ease) both}
@media all{.ios-banner{top:calc(env(safe-area-inset-top,0px) + 10px)}}
.ios-banner.out{animation:bannerOut .45s ease-in both}
@keyframes bannerIn{from{transform:translateY(-140%);opacity:0}to{transform:none;opacity:1}}
@keyframes bannerOut{to{transform:translateY(-140%);opacity:0}}
.logo.sm{width:38px;height:38px;border-radius:10px}
.ib-tx{min-width:0;display:grid;gap:1px}
.ib-top{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}
.ib-top b{font-weight:600;letter-spacing:.04em}
.ib-tx > b{font-size:14px}
.ib-tx > span:last-child{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mono svg{width:11px;height:11px;fill:currentColor;stroke:none;vertical-align:-1px;margin-right:3px}

/* ================= v5 ================= */
.week-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;max-width:300px;margin:16px auto 0}
.wk{display:grid;justify-items:center;gap:6px}
.wk span{font-family:var(--f-mono);font-size:9.5px;color:var(--faint)}
.wk i{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1.5px dashed var(--line-2)}
.wk i svg{width:13px;height:13px;stroke:currentColor;stroke-width:3;fill:none}
.wk.on i{border:0;background:color-mix(in srgb,var(--dawn) 80%,var(--dusk));color:var(--dawn-ink)}
.wk.full i{background:linear-gradient(140deg,var(--dawn),var(--gold));box-shadow:0 0 14px -2px var(--glow)}
.wk.today i{border:1.5px solid var(--dawn);animation:pulse 2.4s ease-in-out infinite}
.wk.today span{color:var(--dawn)}
.wk.rel i{border:1.5px solid var(--alert)}
.wk.pre i{opacity:.25}
.notice{display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:center;padding:14px 16px;border-radius:22px;background:color-mix(in srgb,var(--surface) 88%,transparent);border:1px solid var(--line-2)}
.notice > div b{display:block;font-size:14.5px}
.notice > div span{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.notice > .btn,.notice .nt-btns{grid-column:2;justify-self:start}
.nt-btns{display:flex;gap:14px;align-items:center}
.nt-ic{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--tc) 16%,transparent);color:var(--tc)}
.nt-ic svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.9;fill:none}
.wsum{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.wsum div{display:grid;gap:4px;padding:12px 8px;border-radius:14px;background:var(--surface-2);text-align:center}
.wsum b{font-family:var(--f-display);font-size:24px;font-weight:400;letter-spacing:-.03em;line-height:1}
.wsum small{font-size:12px;color:var(--faint)}
.wsum span{font-size:10.5px;color:var(--muted);line-height:1.2}
.notif-preview{display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:center;margin:22px 0 14px;padding:12px 14px;border-radius:22px;background:var(--surface);border:1px solid var(--line-2)}
.ios-alert-wrap{position:absolute;inset:0;z-index:5;display:grid;place-items:center;background:rgba(0,0,0,.35);animation:fade .25s both;padding:30px}
.ios-alert{width:270px;border-radius:16px;overflow:hidden;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);text-align:center;animation:pop .35s var(--ease) both}
.ios-alert > b{display:block;padding:18px 16px 4px;font-size:16px}
.ios-alert p{padding:0 16px 16px;font-size:13px;color:var(--muted)}
.ios-alert div{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line-2)}
.ios-alert button{height:44px;color:#0A84FF;font-size:16px}
.ios-alert button + button{border-left:1px solid var(--line-2)}
.face-lock{position:absolute;inset:0;z-index:120;display:grid;place-items:center;background:var(--bg);animation:fade .2s both}
.face-lock.out{animation:fadeOut .45s both}
.fl-in{display:grid;justify-items:center;gap:12px;text-align:center}
.fl-in > b{font-family:var(--f-display);font-size:20px;font-weight:500}
.fl-in > span{font-size:13px;color:var(--muted)}
.face-id{width:64px;height:64px;margin:18px 0 6px}
.face-id svg{width:100%;height:100%;stroke:var(--fg);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.face-id .fi-ok{opacity:0;stroke:var(--ok)}
.face-lock.ok .fi-face{opacity:0;transition:opacity .2s}
.face-lock.ok .fi-ok{opacity:1;transition:opacity .3s .1s}
.face-lock.ok .face-id svg{stroke:var(--ok)}

/* ================= v6 · pulido ================= */
/* Rendimiento: fuera desenfoques costosos */
.atmo i{filter:none!important;animation:none!important;border-radius:50%}
.atmo .f1{background:radial-gradient(closest-side,var(--fog-blob),transparent)!important;width:520px;height:420px}
.atmo .f2{background:radial-gradient(closest-side,var(--fog-blob),transparent)!important;width:480px;height:400px}
.atmo .f3{background:radial-gradient(closest-side,var(--glow),transparent)!important}
.card,.steps-card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.card{background:var(--surface);border-color:var(--line)}
:root{--shadow:0 1px 0 rgba(255,255,255,.03) inset,0 18px 40px -28px rgba(0,0,0,.7)}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){--shadow:0 1px 2px rgba(20,30,60,.04),0 12px 30px -18px rgba(20,30,60,.18)}}
:root[data-theme="light"]{--shadow:0 1px 2px rgba(20,30,60,.04),0 12px 30px -18px rgba(20,30,60,.18)}
.card,.steps-card,.faro-card,.urge-pill,.notice,.hito-card,.metric,.fact{box-shadow:var(--shadow)}

/* Tipografía más editorial, menos "etiqueta de máquina" */
.mono{font-family:var(--f-body);font-size:12.5px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--muted)}
.chip{font-family:var(--f-body);font-size:11.5px;font-weight:600;letter-spacing:0;text-transform:none;height:28px;padding:0 11px}
.eyebrow{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--dawn)}
.eyebrow svg{width:14px;height:14px;stroke:currentColor;stroke-width:2;fill:none}
.eyebrow.center{display:flex;justify-content:center}
.center{text-align:center}
.h-title{font-size:32px;font-weight:350;letter-spacing:-.04em;line-height:1.02}
.sec-h h3{font-size:19px;font-weight:500;letter-spacing:-.02em}
.muted-s{font-size:13.5px;color:var(--muted);line-height:1.5}
.sh4{font-family:var(--f-body);font-size:13px;font-weight:700;color:var(--muted);margin:22px 0 10px;letter-spacing:.01em}
.clock span{font-family:var(--f-body);font-size:10.5px;letter-spacing:.02em;text-transform:none}
.dial-center .mono{font-size:12px}
.fact .n{font-family:var(--f-body);font-size:12px;font-weight:700;letter-spacing:0}

/* Animaciones: solo transform y opacity, cortas */
.view.enter > *{animation:rise .42s cubic-bezier(.22,1,.36,1) both}
.view.enter > *:nth-child(2){animation-delay:.03s}.view.enter > *:nth-child(3){animation-delay:.06s}.view.enter > *:nth-child(4){animation-delay:.09s}.view.enter > *:nth-child(n+5){animation-delay:.12s}
@keyframes rise{from{opacity:0;transform:translate3d(0,8px,0)}to{opacity:1;transform:none}}
.dial-wrap .tick{animation-duration:.6s}
.sheet{animation:up .42s cubic-bezier(.22,1,.36,1) both;will-change:transform}
.btn,.big-yes,.step-main,.opt,.plan,.theme-sw{-webkit-tap-highlight-color:transparent}
.step.just .step-n{animation:stepPop .6s cubic-bezier(.34,1.56,.64,1) both}
.step.just{animation:stepGlow .9s ease-out both}
@keyframes stepPop{0%{transform:scale(.4)}100%{transform:scale(1)}}
@keyframes stepGlow{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--ok) 50%,transparent)}100%{box-shadow:0 0 0 12px transparent}}

/* Botón de recaída */
.step-actions{grid-template-columns:1fr;gap:8px}
.btn-relapse{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;width:100%;border-radius:16px;border:1.5px solid color-mix(in srgb,var(--alert) 45%,var(--line-2));color:color-mix(in srgb,var(--alert) 85%,var(--fg));font-weight:600;font-size:14.5px;background:color-mix(in srgb,var(--alert) 6%,transparent);transition:transform .2s}
.btn-relapse:active{transform:scale(.97)}
.btn-relapse svg{width:17px;height:17px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}

.info-btn{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:600;color:var(--muted);padding:4px 0}
.info-btn svg{width:14px;height:14px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round}
.why-btn{font-size:12.5px;font-weight:600;color:var(--dawn)}
button.fact{text-align:left;font:inherit;color:inherit}

/* Nivel y premios */
.lvl-btn{width:100%;text-align:left}
.lvl-xp{font-size:12.5px;color:var(--muted);font-weight:600}
.themes{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.theme-sw{display:grid;justify-items:center;gap:6px;font-size:11.5px;color:var(--muted);position:relative}
.theme-sw i{width:48px;height:48px;border-radius:16px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);transition:transform .25s}
.theme-sw.on i{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--fg)}
.theme-sw.on span{color:var(--fg);font-weight:600}
.theme-sw.locked-sw i{filter:grayscale(.8) brightness(.6)}
.theme-sw em{position:absolute;top:16px;font-style:normal;font-size:9.5px;font-weight:700;color:#fff}
.ladder{display:grid;gap:6px}
.rw-row{display:grid;grid-template-columns:26px 36px 1fr auto;gap:10px;align-items:center;padding:10px 12px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.rw-row.got{border-color:color-mix(in srgb,var(--gold) 40%,var(--line))}
.rw-lv{font-family:var(--f-display);font-size:18px;color:var(--muted);text-align:center}
.rw-ic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--surface-2);color:var(--gold)}
.rw-ic svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.8;fill:none}
.rw-t b{display:block;font-size:14px}
.rw-t span{display:block;font-size:12px;color:var(--muted)}
.rw-row:not(.got) .rw-t b{color:var(--muted)}
.rw-ok{color:var(--ok)}.rw-ok svg{width:18px;height:18px;stroke:currentColor;stroke-width:2.6;fill:none}
.ways{display:grid;border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.ways div{display:flex;justify-content:space-between;padding:11px 14px;font-size:14px;background:var(--surface)}
.ways div + div{border-top:1px solid var(--line)}
.ways b{color:var(--gold);font-weight:700}
.pro-nudge{display:grid;grid-template-columns:22px 1fr auto;gap:12px;align-items:center;width:100%;margin-top:16px;padding:14px;border-radius:18px;text-align:left;background:color-mix(in srgb,var(--gold) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--gold) 35%,transparent)}
.pro-nudge > svg{width:20px;height:20px;fill:var(--gold);stroke:none}
.pro-nudge b{display:block;font-size:14.5px}.pro-nudge span span{display:block;font-size:12.5px;color:var(--muted)}
.badge.t-bronze .md{background:conic-gradient(from 210deg,#8a5a3b,#d9a27a,#8a5a3b,#e8c3a0,#8a5a3b)}
.badge.t-silver .md{background:conic-gradient(from 210deg,#7d8796,#e6ebf2,#7d8796,#c9d1dc,#7d8796)}
.badge.t-gold .md{background:conic-gradient(from 210deg,#9b6f16,#f5d98b,#9b6f16,#ffe9b0,#9b6f16)}
.badge.off .md{background:var(--tick-off)!important}
.prof-row{display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:center}
.prof-row b{display:block;font-family:var(--f-display);font-size:20px;font-weight:450}
.prof-row span{display:block;font-size:12.5px;color:var(--muted)}
.prof-meter{width:52px;height:52px;border-radius:50%;background:conic-gradient(var(--dawn) calc(var(--p)*360deg),var(--tick-off) 0);display:grid;place-items:center}
.prof-meter i{width:38px;height:38px;border-radius:50%;background:var(--surface)}

/* Onboarding v2 */
.ob2{min-height:100%;display:flex;flex-direction:column;padding:62px 22px calc(26px + env(safe-area-inset-bottom,0px))}
@media all{.ob2{padding-top:calc(env(safe-area-inset-top,0px) + 18px)}}
.brand-row{display:flex;align-items:center;gap:10px}
.intro-hero{position:relative;width:min(100%,250px);aspect-ratio:1;margin:30px auto 8px}
.intro-hero svg{width:100%;height:100%}
.intro-hero .dial-center{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.intro-hero .dial-of{font-size:13px;color:var(--muted);font-weight:600}
.ob-title{font-size:36px;font-weight:350;letter-spacing:-.045em;line-height:1.02;text-wrap:balance}
.ob-title em{font-style:normal;color:var(--dawn)}
.ob-lead{font-size:16px;color:var(--muted);line-height:1.5;margin-top:12px}
.ob-actions{margin-top:auto;padding-top:26px;display:grid;gap:12px;justify-items:center}
.btn.big{height:58px;font-size:16.5px}
.quiz-top{display:grid;grid-template-columns:36px 1fr auto;gap:14px;align-items:center}
.icon-btn{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2)}
.icon-btn svg{width:18px;height:18px;stroke:var(--fg);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.qbar{height:6px;border-radius:9px;background:var(--tick-off);overflow:hidden}
.qbar i{display:block;height:100%;background:var(--dawn);border-radius:9px;transition:width .4s cubic-bezier(.22,1,.36,1)}
.qn{font-size:12.5px;font-weight:600;color:var(--muted)}
.quiz-q{font-size:29px;font-weight:400;letter-spacing:-.035em;line-height:1.1;margin-top:34px;animation:rise .4s cubic-bezier(.22,1,.36,1) both}
.opts{display:grid;gap:10px;margin-top:24px}
.opt{display:flex;align-items:center;gap:14px;min-height:60px;padding:14px 16px;border-radius:18px;background:var(--surface);border:1.5px solid var(--line);text-align:left;font-size:16px;font-weight:500;transition:border-color .2s,background .2s,transform .15s;animation:rise .45s cubic-bezier(.22,1,.36,1) both}
.opt:nth-child(2){animation-delay:.04s}.opt:nth-child(3){animation-delay:.08s}.opt:nth-child(4){animation-delay:.12s}.opt:nth-child(n+5){animation-delay:.16s}
.opt:active{transform:scale(.98)}
.opt-dot{flex:none;width:24px;height:24px;border-radius:50%;border:1.8px solid var(--line-2);display:grid;place-items:center;transition:all .2s}
.opt-dot svg{width:13px;height:13px;stroke:var(--dawn-ink);stroke-width:3;fill:none;opacity:0}
.opt[aria-pressed="true"]{border-color:var(--dawn);background:color-mix(in srgb,var(--dawn) 10%,var(--surface))}
.opt[aria-pressed="true"] .opt-dot{background:var(--dawn);border-color:var(--dawn)}
.opt[aria-pressed="true"] .opt-dot svg{opacity:1}
.center-col{align-items:center;justify-content:center;text-align:center}
.an-ring{position:relative;width:150px;height:150px}
.an-ring svg{width:100%;height:100%}
.an-ring b{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--f-display);font-size:32px;font-weight:350}
.an-line{margin-top:22px;font-size:16px;color:var(--muted);min-height:24px}
.lvl-scale{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:18px}
.lvl-scale div{display:grid;gap:8px}
.lvl-scale i{height:8px;border-radius:9px;background:var(--tick-off)}
.lvl-scale .past i{background:color-mix(in srgb,var(--dawn) 45%,var(--tick-off))}
.lvl-scale .on i{background:var(--dawn);box-shadow:0 0 12px var(--glow)}
.lvl-scale span{font-size:11.5px;color:var(--faint);font-weight:600}
.lvl-scale .on span{color:var(--fg)}
.findings{display:grid;gap:8px;margin-top:18px}
.findings div{padding:13px 15px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.findings b{display:block;font-size:14.5px}
.findings span{display:block;font-size:13px;color:var(--muted);margin-top:2px}
.myplan{display:grid;gap:12px}
.myplan > div{display:grid;grid-template-columns:24px 1fr;gap:12px}
.myplan > div > span{width:24px;height:24px;border-radius:50%;background:var(--ok);display:grid;place-items:center}
.myplan > div > span svg{width:13px;height:13px;stroke:#06140d;stroke-width:3;fill:none}
.myplan b{display:block;font-size:14.5px}
.myplan div div span{display:block;font-size:13px;color:var(--muted)}
.fine{font-size:11.5px;color:var(--faint);margin-top:16px}
.tut-top{display:flex;align-items:center;gap:16px}
.tut-top .ob-dots{flex:1}
.tut-visual{margin-top:34px;min-height:230px;display:grid;place-items:center;border-radius:28px;background:radial-gradient(120% 90% at 50% 0%,color-mix(in srgb,var(--dawn) 14%,transparent),transparent 70%),var(--surface);border:1px solid var(--line);padding:22px;animation:rise .45s cubic-bezier(.22,1,.36,1) both}
.tut .ob-title{animation:rise .45s .05s cubic-bezier(.22,1,.36,1) both}
.tut .ob-lead{animation:rise .45s .1s cubic-bezier(.22,1,.36,1) both}
.tv-steps{display:grid;gap:8px;width:100%}
.tv-steps div{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;background:var(--surface-2);font-size:14.5px;font-weight:600}
.tv-steps span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:1.5px solid var(--line-2);font-family:var(--f-display)}
.tv-steps .ok span{background:var(--ok);border-color:var(--ok);color:#06140d}
.tv-steps .next{box-shadow:0 0 0 1.5px var(--dawn)}
.tv-steps .next span{background:var(--dawn);border-color:var(--dawn);color:var(--dawn-ink)}
.tv-steps svg{width:14px;height:14px;stroke:currentColor;stroke-width:3;fill:none}
.tv-dial{text-align:center}
.tv-dial > b{display:block;font-family:var(--f-display);font-size:88px;font-weight:250;letter-spacing:-.06em;line-height:.9}
.tv-dial > span{font-size:13px;color:var(--muted);font-weight:600}
.tv-pill{display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:20px;background:var(--surface-2);font-size:16px}
.tv-timer{font-family:var(--f-display);font-size:56px;font-weight:300;letter-spacing:-.04em;margin-top:18px;text-align:center}
.tv-rewards{display:grid;justify-items:center;gap:16px}
.tv-rewards .lvl-badge{width:74px;height:74px;border-radius:22px}
.tv-rewards .lvl-badge b{font-size:34px}
.tv-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.tv-chips span{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:99px;background:var(--surface-2);font-size:13px;font-weight:600}
.tv-chips svg{width:15px;height:15px;stroke:var(--gold);stroke-width:1.9;fill:none}
.tv-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%}
.tv-slots div{display:grid;gap:6px;justify-items:center;text-align:center;padding:16px 8px;border-radius:18px;border:1.5px dashed var(--line-2)}
.tv-slots b{font-family:var(--f-display);font-size:30px;font-weight:350}
.tv-slots span{font-size:12px;color:var(--muted);line-height:1.3}
.tv-slots .on{border-style:solid;border-color:color-mix(in srgb,var(--sky) 50%,transparent)}
.tv-slots .last{border-style:solid;border-color:color-mix(in srgb,var(--alert) 55%,transparent)}
.tv-gauge{position:relative;display:grid;justify-items:center;width:210px}
.tv-gauge .gauge{width:100%}
.tv-gauge b{font-family:var(--f-display);font-size:26px;font-weight:450;margin-top:-34px}
.tv-gauge span{font-size:13px;color:var(--muted);margin-top:6px}

/* Pago simplificado */
.pw h1{font-size:30px;margin-top:8px}
.ptable{margin-top:20px;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--surface)}
.pt-h,.pt-r{display:grid;grid-template-columns:1fr 62px 62px;align-items:center}
.pt-h{padding:10px 14px;font-size:12px;font-weight:700;color:var(--muted)}
.pt-h span,.pt-r span:not(:first-child){text-align:center}
.pt-r{padding:11px 14px;border-top:1px solid var(--line);font-size:13.5px}
.pt-r span:not(:first-child){font-weight:700}
.pt-r .no{color:var(--faint)}
.pro-col{color:var(--gold)}
.pt-h .pro-col,.pt-r .pro-col{background:color-mix(in srgb,var(--gold) 8%,transparent);margin:-11px 0;padding:11px 0}
.pt-h .pro-col{margin:-10px 0;padding:10px 0}
.cmp{margin-top:14px;display:grid;gap:9px}
.cmp-row{display:grid;grid-template-columns:128px 1fr 40px;gap:10px;align-items:center;font-size:12.5px}
.cmp-row > span{color:var(--muted);font-weight:600}
.cmp-row b{text-align:right;font-size:13px}
.cmp-bar{height:10px;border-radius:9px;background:var(--tick-off);overflow:hidden}
.cmp-bar i{display:block;height:100%;border-radius:9px;animation:grow 1s cubic-bezier(.22,1,.36,1) both;transform-origin:left}
@keyframes grow{from{transform:scaleX(0)}to{transform:none}}
.cmp-note{font-size:11.5px;color:var(--faint);line-height:1.45}
.cmp-note .link{font-size:11.5px}
.tools-list{display:grid;gap:0;border-radius:14px;overflow:hidden;border:1px solid var(--line)}
.tools-list > div{display:grid;grid-template-columns:1fr 34px 34px 34px;padding:8px 12px;font-size:12.5px;background:var(--surface)}
.tools-list > div + div{border-top:1px solid var(--line)}
.tools-list > div span:not(:first-child){text-align:center;font-weight:700}
.tools-list .no{color:var(--faint)}
.tools-list .cmp-note{padding:8px 12px}

/* Puerta de Faro */
.gate-why{display:grid;gap:14px;margin-top:18px}
.gate-why > div{display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:start}
.gate-why > div > span{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--gold) 15%,transparent);color:var(--gold)}
.gate-why svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.9;fill:none}
.gate-why p{font-size:13.5px;color:var(--muted);line-height:1.45}
.gate-why b{color:var(--fg)}

/* Temas de color desbloqueables */
:root[data-accent="oceano"]{--dawn:#7CC3F0;--glow:rgba(124,195,240,.30)}
:root[data-accent="bosque"]{--dawn:#7ED3A2;--glow:rgba(126,211,162,.28)}
:root[data-accent="oro"]{--dawn:#EBC46A;--glow:rgba(235,196,106,.30)}
:root[data-accent="aurora"]{--dawn:#C9A2F2;--glow:rgba(201,162,242,.30)}
@media (prefers-color-scheme: light){
  :root[data-accent="oceano"]:not([data-theme="dark"]){--dawn:#1F7FB8}
  :root[data-accent="bosque"]:not([data-theme="dark"]){--dawn:#2E8B5E}
  :root[data-accent="oro"]:not([data-theme="dark"]){--dawn:#A7771A}
  :root[data-accent="aurora"]:not([data-theme="dark"]){--dawn:#7A4FC0}
}
:root[data-theme="light"][data-accent="oceano"]{--dawn:#1F7FB8}
:root[data-theme="light"][data-accent="bosque"]{--dawn:#2E8B5E}
:root[data-theme="light"][data-accent="oro"]{--dawn:#A7771A}
:root[data-theme="light"][data-accent="aurora"]{--dawn:#7A4FC0}

/* ================= v7 · hábitos ================= */
.htabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:2px -20px 0;padding:2px 20px 4px}
.htabs::-webkit-scrollbar{display:none}
.htab{flex:none;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px 0 12px;border-radius:99px;background:var(--surface);border:1px solid var(--line);font-size:14px;font-weight:600;color:var(--muted);transition:background .25s,color .25s,border-color .25s}
.htab i{width:9px;height:9px;border-radius:50%;background:var(--hc)}
.htab b{font-size:12px;font-weight:700;padding:2px 7px;border-radius:99px;background:var(--surface-2);color:var(--muted)}
.htab.on{background:color-mix(in srgb,var(--hc) 16%,var(--surface));border-color:color-mix(in srgb,var(--hc) 55%,transparent);color:var(--fg)}
.htab.on b{background:var(--hc);color:#15110c}
.htab.add{width:40px;padding:0;justify-content:center;font-size:20px;font-weight:400}
.hgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:20px}
.hchip{position:relative;display:flex;align-items:center;gap:10px;min-height:52px;padding:10px 12px;border-radius:16px;background:var(--surface);border:1.5px solid var(--line);text-align:left;font-size:14px;font-weight:600;transition:border-color .2s,background .2s,transform .15s}
.hchip:active{transform:scale(.97)}
.hchip i{flex:none;width:22px;height:22px;border-radius:50%;border:2px solid var(--hc);display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:800;color:#15110c;transition:background .2s}
.hchip.on{border-color:var(--hc);background:color-mix(in srgb,var(--hc) 12%,var(--surface))}
.hchip.on i{background:var(--hc)}
.hnote{font-size:13px;color:var(--muted);margin-top:12px;text-align:center}
.hnote.pro{color:var(--gold)}
.hnote svg{width:12px;height:12px;fill:currentColor;stroke:none;vertical-align:-1px}
.hlist{display:flex;flex-wrap:wrap;gap:8px}
.hpill{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 12px;border-radius:99px;background:var(--surface-2);font-size:13.5px;font-weight:600}
.hpill i{width:9px;height:9px;border-radius:50%;background:var(--hc)}
.app.not-porn [data-g="bloqueo"],.app.not-porn [data-g="teclado"],.app.not-porn [data-g="sexualidad"]{display:none}
[hidden]{display:none!important}

/* ================= v8 ================= */
.plan .pp{display:grid;justify-items:end;font-size:18px;line-height:1.1}
.plan .pp small{font-size:11.5px;font-weight:500;color:var(--muted)}
.legal{margin-top:14px;font-size:12px;color:var(--muted)}
.legal summary{cursor:pointer;text-align:center;font-weight:600;list-style:none;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.legal summary::-webkit-details-marker{display:none}
.legal p{margin-top:10px;line-height:1.5}
.legal-open p{font-size:14px}
.trial-steps{display:grid;gap:14px;margin-top:26px}
.trial-steps > div{display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:center}
.trial-steps span{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);font-size:12px;font-weight:700}
.trial-steps span.on{background:var(--dawn);color:var(--dawn-ink)}
.trial-steps p{font-size:15px}
.offer .now{font-size:48px}
.offer .per{font-size:16px}

/* ===== v9 · emojis, hábito propio, análisis animado, pitch, comunidad ===== */
.emo{font-style:normal;font-size:20px;line-height:1;flex:none;width:26px;text-align:center;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}
.hchip{padding:10px 36px 10px 10px;min-height:56px}
.hchip > span{flex:1;min-width:0;line-height:1.25}
.hchip i{position:absolute;right:10px;top:50%;margin-top:-11px}
.htab .emo{font-size:16px;width:auto}
.hpill .emo{font-size:15px;width:auto}
.custom-in{margin-top:14px;padding:14px;border-radius:18px;background:var(--surface);border:1.5px solid color-mix(in srgb,var(--dawn) 45%,transparent);display:grid;gap:8px;animation:rise .35s var(--ease) both}
.custom-in label{font-weight:700;font-size:15px}
.custom-in .input{height:52px;font-size:17px}

.an2{align-items:center;text-align:center;padding-top:54px}
.an-core{position:relative;width:250px;height:250px;margin:22px auto 0}
.an-core canvas{position:absolute;inset:0;border-radius:50%;opacity:.9}
.an-core svg{position:absolute;inset:0;width:100%;height:100%}

.orb-r{position:absolute;inset:0;will-change:transform;pointer-events:none}
.orb-r svg{width:100%;height:100%;display:block}
.orb-r.r1{animation:spin 14s linear infinite}
.orb-r.r2{animation:spin 7s linear infinite reverse}
.orb-r.r3{animation:spin 3.6s cubic-bezier(.5,.1,.5,.9) infinite}
.an-center{position:absolute;inset:0;display:grid;place-content:center;gap:6px;padding:0 44px}
.an-center b{font-family:var(--f-display);font-size:50px;font-weight:300;letter-spacing:-.04em;line-height:1}
.an-center span{font-size:13.5px;color:var(--muted);line-height:1.3;min-height:36px}
.an-bars{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;width:100%;max-width:330px;margin:24px auto 0}
.an-bars div{display:grid;gap:6px;justify-items:center}
.an-bars i{display:block;width:100%;height:46px;border-radius:8px;background:linear-gradient(to top,var(--dawn),var(--dusk));transform-origin:bottom;transform:scaleY(0);will-change:transform}
.an-bars span{font-size:10.5px;color:var(--muted);font-weight:600}
.an-list{display:grid;gap:4px;width:100%;margin-top:22px;text-align:left}
.an-it{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;opacity:.001;transform:translateY(8px);transition:opacity .4s,transform .4s var(--ease),background .3s}
.an-it.show{opacity:1;transform:none}
.an-it.ok{background:var(--surface)}
.an-it b{display:block;font-size:15px}
.an-it div span{display:block;font-size:13.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.an-st{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;position:relative}
.an-st .spin{position:absolute;inset:3px;border-radius:50%;border:2.5px solid var(--tick-off);border-top-color:var(--dawn);animation:spin .8s linear infinite}
.an-st svg{width:15px;height:15px;stroke:#06140d;stroke-width:3;fill:none;opacity:0;transform:scale(.4);transition:.3s var(--ease)}
.an-it.ok .an-st{background:var(--ok)}
.an-it.ok .an-st .spin{display:none}
.an-it.ok .an-st svg{opacity:1;transform:none}

.tv-chat{display:grid;gap:10px;width:100%;text-align:left}
.tv-chat .msg{animation:none}
.tv-chat .msg.me p{font-size:15px}

.pitch-goal{margin-top:14px;padding:20px 18px;border-radius:24px;text-align:left;background:radial-gradient(120% 100% at 0% 0%,color-mix(in srgb,var(--ok) 20%,transparent),transparent 60%),var(--surface);border:1px solid color-mix(in srgb,var(--ok) 35%,var(--line))}
.pitch-goal .eyebrow{color:var(--ok)}
.pitch-goal h2{font-size:25px;font-weight:450;line-height:1.18;letter-spacing:-.025em;margin-top:8px}
.pitch-goal h2 b{color:var(--ok);font-weight:600;white-space:nowrap}
.goal-line{display:grid;grid-template-columns:repeat(4,1fr);margin-top:18px;position:relative}
.goal-line::before{content:"";position:absolute;left:12.5%;right:12.5%;top:6px;height:2px;background:linear-gradient(90deg,var(--dawn),var(--ok))}
.goal-line div{display:grid;justify-items:center;gap:3px;position:relative;text-align:center}
.goal-line i{width:14px;height:14px;border-radius:50%;background:var(--bg);border:3px solid var(--dawn)}
.goal-line div:last-child i{border-color:var(--ok);background:var(--ok);box-shadow:0 0 0 5px color-mix(in srgb,var(--ok) 22%,transparent)}
.goal-line b{font-size:13px;margin-top:4px}
.goal-line span{font-size:12px;color:var(--muted)}
.goal-more{display:grid;gap:6px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line);font-size:13.5px;color:var(--muted)}
.pitch-sub{margin-top:16px;font-size:15.5px;text-align:left}
.pw .why{display:grid;gap:14px;margin-top:14px;text-align:left}

.promo-hero{padding:6px 2px 4px}
.promo-hero .h-title{margin-top:8px;font-size:36px}
.muted-l{color:var(--muted);font-size:16px;line-height:1.5;margin-top:10px}
.promo-count{display:grid;gap:2px;margin-top:18px;padding:16px 18px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
.promo-count b{font-family:var(--f-display);font-size:40px;font-weight:350;letter-spacing:-.03em;line-height:1.05;margin-top:6px}
.promo-count > span{color:var(--muted);font-size:14px}
.card .why{display:grid;gap:14px}
.tab.tab-pro{color:var(--gold)}
.tab.tab-pro svg{stroke:var(--gold)}
.tab.tab-pro[aria-current="page"]{color:var(--gold)}

/* ===== v10 · métricas ===== */
button.risk-row{width:100%;text-align:left;border-radius:18px;transition:background .2s}
button.risk-row:active{background:var(--surface-2)}
.risk-note .more{display:block;margin-top:6px;color:var(--dawn);font-weight:600}
.mgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.mt{position:relative;display:grid;gap:4px;align-content:start;text-align:left;padding:12px 12px 12px;border-radius:18px;background:var(--surface-2);border:1px solid var(--line);min-height:104px;transition:transform .15s var(--ease),background .2s}
.mt:active{transform:scale(.97)}
.mt-top{display:flex;align-items:center;justify-content:space-between;gap:7px}
.mt-ic{flex:none;width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:color-mix(in srgb,var(--tc) 18%,transparent);color:var(--tc)}
.mt-ic svg{width:15px;height:15px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.mt-go{color:var(--faint);font-size:20px;line-height:1}
.mt-lock{display:inline-flex;align-items:center;gap:3px;height:20px;padding:0 7px;border-radius:99px;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--gold);background:color-mix(in srgb,var(--gold) 14%,transparent)}
.mt-lock svg{width:10px;height:10px;fill:currentColor;stroke:none}
.mt-v{font-family:var(--f-display);font-size:30px;font-weight:400;letter-spacing:-.03em;line-height:1.05;margin-top:8px;white-space:nowrap}
.mt-v small{font-family:var(--f-body);font-size:14px;font-weight:600;color:var(--muted);margin-left:3px;letter-spacing:0}
.mt-l{font-size:14px;font-weight:650;color:var(--fg);line-height:1.25}
.mt-s{font-size:12.5px;color:var(--muted);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mt-s.mt-up{color:var(--ok)}
.mt-s.mt-down{color:var(--alert)}
.mt-hint{font-size:13px;color:var(--muted);margin-top:10px;line-height:1.45}
.mt-hint svg{width:12px;height:12px;fill:var(--gold);stroke:none;vertical-align:-1px}
.insight .chev{color:var(--faint);font-size:20px;line-height:1;align-self:center}
.mx-hero{display:flex;align-items:baseline;gap:12px;margin-top:14px;flex-wrap:wrap}
.mx-hero b{font-family:var(--f-display);font-size:56px;font-weight:300;letter-spacing:-.045em;line-height:1;color:var(--tc)}
.mx-hero b small{font-family:var(--f-body);font-size:18px;font-weight:600;color:var(--muted);margin-left:4px;letter-spacing:0}
.mx-hero > span{font-size:15px;font-weight:600;color:var(--muted)}
.mx-chart{margin-top:16px;padding:14px;border-radius:18px;background:var(--surface-2)}
.mx-bars{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:5px;align-items:end;height:70px}
.mx-bars i{display:block;border-radius:5px;background:color-mix(in srgb,var(--dawn) 70%,transparent);transform-origin:bottom;animation:barUp .6s var(--ease) both}
.mx-bars i:nth-child(n){animation-delay:calc(var(--i,0) * 20ms)}
.mx-bars i.off{background:var(--tick-off)}
.mx-bars i.today{background:var(--dawn);box-shadow:0 0 0 2px color-mix(in srgb,var(--dawn) 35%,transparent)}
@keyframes barUp{from{transform:scaleY(0)}to{transform:none}}
.mx-ax{display:flex;justify-content:space-between;margin-top:8px;font-size:11.5px;color:var(--faint);font-weight:600}
.mx-dim{filter:blur(3px);opacity:.7}
.sheet .mx-prose h4{font-family:var(--f-body);font-size:13px;font-weight:700;letter-spacing:.02em;color:var(--dawn);margin-top:22px;text-transform:uppercase}
.sheet .mx-prose h4:first-child{margin-top:18px}
.mx-prose p b{color:var(--fg)}
.mx-factors{display:grid;margin-top:10px;border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.mx-factors div{display:flex;justify-content:space-between;gap:12px;padding:11px 14px;font-size:14.5px;border-top:1px solid var(--line)}
.mx-factors div:first-child{border-top:0}
.mx-factors b{color:var(--alert);font-weight:700}
.mx-factors .neg b{color:var(--ok)}
.mx-factors div:first-child b{color:var(--muted)}
.mx-lock{position:relative;margin-top:6px;min-height:310px}
.mx-blur{filter:blur(6px);opacity:.55;user-select:none;pointer-events:none;max-height:300px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 40%,transparent);mask-image:linear-gradient(#000 40%,transparent)}
.mx-cta{position:absolute;left:0;right:0;top:40px;margin:0 auto;padding:18px;border-radius:22px;background:var(--surface);border:1px solid color-mix(in srgb,var(--gold) 40%,var(--line));box-shadow:0 20px 50px -20px rgba(0,0,0,.45);display:grid;gap:8px;justify-items:start}
.mx-cta b{font-size:17px;line-height:1.3}
.mx-cta p{margin:0!important;font-size:14.5px!important;color:var(--muted)!important}
.mx-cta .btn{margin-top:6px}
.mx-cta .why-ic svg{fill:currentColor;stroke:none}
.sheet-actions .btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.9}

.why-row .why-ic{display:grid;color:var(--gold);margin-top:0;font-size:inherit;line-height:1}

/* ===== v11 · Pro con valor real ===== */
.hs-strip{margin-top:12px;padding:12px;border-radius:18px;background:var(--surface-2);border:1px solid var(--line)}
.hs-h{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--muted)}
.hs-h svg{width:14px;height:14px;stroke:var(--alert);fill:none;stroke-width:2}
.hs-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
.hs{display:grid;gap:2px;text-align:left;padding:8px 10px;border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.hs span{font-size:12px;color:var(--muted);font-weight:600}
.hs b{font-family:var(--f-display);font-size:20px;font-weight:450;letter-spacing:-.02em;white-space:nowrap}
.hs b small{font-family:var(--f-body);font-size:11px;color:var(--muted);margin-left:2px;font-weight:600}
.pro-an{border-color:color-mix(in srgb,var(--gold) 30%,var(--line));background:radial-gradient(120% 60% at 100% 0%,color-mix(in srgb,var(--gold) 9%,transparent),transparent 60%),var(--surface)}
.pro-an > .muted-s{margin-top:-2px}
.fc-wrap{display:block;width:100%;text-align:left;margin-top:14px;padding:12px;border-radius:18px;background:var(--surface-2);border:1px solid var(--line)}
.fc-h{display:flex;justify-content:space-between;font-size:13px;font-weight:700;color:var(--muted)}
.fc-h .chev{color:var(--faint)}
.fc{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:10px}
.fc-d{display:grid;justify-items:center;gap:5px}
.fc-d span{font-size:11.5px;font-weight:600;color:var(--muted)}
.fc-d i{display:block;width:100%;height:56px;border-radius:8px;background:var(--tick-off);position:relative;overflow:hidden}
.fc-d i::after{content:"";position:absolute;inset:0;border-radius:8px;background:var(--fcc);transform-origin:bottom;transform:scaleY(var(--h));opacity:.9}
.fc-d b{font-size:12px;font-weight:600}
.lv-Bajo{--fcc:var(--ok)}.lv-Medio{--fcc:var(--gold)}.lv-Alto{--fcc:var(--alert)}
.blurbox{filter:blur(4px);opacity:.7}
.mt-v.txt{font-family:var(--f-body);font-size:17px;font-weight:700;letter-spacing:-.01em;white-space:normal;line-height:1.2;margin-top:10px}
.mx-hero b.txt{font-family:var(--f-body);font-size:26px;font-weight:700;letter-spacing:-.01em;line-height:1.2}
.mx-note{display:flex;gap:8px;align-items:flex-start;margin-top:14px!important;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--alert) 8%,var(--surface-2));font-size:14px!important;color:var(--muted)!important}
.mx-note svg{flex:none;width:16px;height:16px;margin-top:2px;stroke:var(--alert);fill:none;stroke-width:2}
.vs-health{margin-top:18px;padding:16px;border-radius:22px;background:var(--surface);border:1px solid var(--line);text-align:left}
.vs-health > div p{margin-top:4px;font-size:15.5px;line-height:1.4}
.vs-health .vs-pro{padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--gold) 12%,transparent);border:1px solid color-mix(in srgb,var(--gold) 35%,transparent)}
.vs-health .vs-pro .mono{color:var(--gold)}
.vs-health .vs-pro p{font-weight:600}
.vs-arrow{text-align:center;color:var(--faint);font-size:18px;margin:4px 0}
.ifthen{display:grid;gap:10px;margin-top:16px}
.ifthen > div{display:grid;gap:6px;padding:14px;border-radius:18px;background:var(--surface-2);border:1px solid var(--line)}
.ifthen .if{font-weight:700;font-size:15px}
.ifthen .then{font-size:14.5px;color:color-mix(in srgb,var(--fg) 85%,var(--muted));padding-left:14px;border-left:2px solid var(--dawn)}
.rep-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}
.rep-grid div{display:grid;gap:2px;padding:10px;border-radius:14px;background:var(--surface-2)}
.rep-grid span{font-size:12px;color:var(--muted);font-weight:600;line-height:1.2}
.rep-grid b{font-family:var(--f-display);font-size:22px;font-weight:450}
.pdf-prev{margin-top:16px;border-radius:16px;background:#fff;color:#1b1f2a;padding:16px;box-shadow:0 12px 30px -16px rgba(0,0,0,.4);border:1px solid rgba(0,0,0,.08)}
.pdf-h{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:10px;border-bottom:2px solid #1b1f2a;font-size:14px}
.pdf-h span{font-size:12px;color:#667}
.pdf-r{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #e6e8ee;font-size:13.5px}
.pdf-r span{color:#556}
.pdf-r b{text-align:right}
.pdf-f{font-size:12px;color:#667;margin-top:10px}
.sh-win{display:grid;gap:2px;margin-top:14px;padding:14px;border-radius:18px;background:color-mix(in srgb,var(--gold) 10%,var(--surface-2));border:1px solid color-mix(in srgb,var(--gold) 30%,transparent)}
.sh-win b{font-family:var(--f-display);font-size:30px;font-weight:400;letter-spacing:-.02em}
.sh-win > span:last-child{font-size:13.5px;color:var(--muted)}
.sheet .chips{display:flex;flex-wrap:wrap;gap:8px}

/* ===== Iconos: relleno suave y contenedores con más cuerpo ===== */
svg .d{fill:currentColor;fill-opacity:.22;stroke:none}
.sos-icon svg{stroke-width:1.3!important}
.tile svg{stroke-width:1.6!important}
.tab[aria-current="page"] svg .d{fill-opacity:.32}
.ins-ic,.mt-ic,.why-ic{background:linear-gradient(150deg,color-mix(in srgb,var(--tc,var(--gold)) 26%,transparent),color-mix(in srgb,var(--tc,var(--gold)) 9%,transparent));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tc,var(--gold)) 22%,transparent)}
.why-ic{--tc:var(--gold)}
.row .ic{background:linear-gradient(150deg,color-mix(in srgb,var(--dawn) 20%,var(--surface-2)),var(--surface-2));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--dawn) 18%,transparent)}


/* ===== Rendimiento: 60 fps · solo transform y opacity, capas justas ===== */
/* Niebla de fondo: degradados en vez de filtros de desenfoque */
.atmo i{filter:none;will-change:transform}
.atmo .f1,.atmo .f2{background:radial-gradient(closest-side,var(--fog-blob),transparent)}
.atmo .f1{width:520px;height:420px;left:-190px;top:-10px}
.atmo .f2{width:480px;height:400px;right:-210px;top:210px}
.atmo .f3{background:radial-gradient(closest-side,var(--glow),transparent);width:640px;height:460px;bottom:-280px}
/* Pulsos sin box-shadow animado */
.live i{position:relative;box-shadow:none!important;animation:none}
.live i::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--ok);animation:livePulse 1.8s ease-out infinite;will-change:transform,opacity}
@keyframes livePulse{from{transform:scale(1);opacity:.55}to{transform:scale(2.6);opacity:0}}
.step{position:relative}
.step.just{animation:none}
.step.just::after{content:"";position:absolute;inset:-1px;border-radius:inherit;border:2px solid color-mix(in srgb,var(--ok) 60%,transparent);animation:glowOut .9s ease-out both;pointer-events:none}
@keyframes glowOut{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.035)}}
.reel{position:relative}
.reel.win{animation:none}
.reel.win::after{content:"";position:absolute;inset:-2px;border-radius:inherit;border:2px solid var(--gold);animation:glowOut 1.2s ease-out both;pointer-events:none}
/* Esfera: el reloj de la esfera entra de una pieza (compuesto por la GPU), sin 90 animaciones SVG */
.dial-wrap .tick,.today-tick{animation:none!important}
.view.enter .dial-wrap > svg{animation:dialIn .7s cubic-bezier(.22,1,.36,1) both}
@keyframes dialIn{from{opacity:0;transform:rotate(-14deg) scale(.95)}to{opacity:1;transform:none}}
.intro-hero .tick{animation:tickIn .9s var(--ease) both!important}
/* Entrada de vista: solo las primeras tarjetas; el resto no crea capas */
.view.enter > *:nth-child(n+5){animation:none}
/* Tarjetas fuera de pantalla: el navegador no las pinta hasta que llegas */
.view > section:nth-child(n+5){content-visibility:auto;contain-intrinsic-size:auto 420px}
/* Hoja inferior: una sola capa que se mueve */
.sheet{contain:layout paint}
.sheet-wrap{will-change:opacity}
/* Barra de pestañas: desenfoque más ligero */
.tabs{backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3)}
.tab,.btn,.mt,.hs,.insight,.row{touch-action:manipulation}

.pf .pf-h{display:flex;align-items:center;justify-content:space-between}
.pf .why-ic{width:42px;height:42px;border-radius:14px}
.pf .why-ic svg{width:22px;height:22px}
.pf-tag{font-size:12px;font-weight:700;color:var(--gold);padding:4px 10px;border-radius:99px;background:color-mix(in srgb,var(--gold) 12%,transparent)}
.pf-t{font-size:22px;font-weight:450;letter-spacing:-.02em;margin-top:12px}
.pf .muted-l{margin-top:6px;font-size:15.5px}
.pf .mgrid{margin-top:10px}

/* ===== v12 · informes ===== */
.rep-grid .dl{display:block;font-style:normal;font-size:11.5px;font-weight:700;margin-top:2px}
.dl.good{color:var(--ok)}.dl.bad{color:var(--alert)}.dl.eq{color:var(--muted)}
.wk-chart{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;height:96px;align-items:end}
.wk-chart div{display:grid;grid-template-rows:1fr auto;justify-items:center;gap:6px;height:100%;position:relative}
.wk-chart i.u{width:60%;height:100%;border-radius:6px;background:var(--tick-off);position:relative;overflow:hidden;align-self:end}
.wk-chart i.u::after{content:"";position:absolute;inset:0;background:var(--dusk);transform-origin:bottom;transform:scaleY(var(--h))}
.wk-chart i.m{position:absolute;left:50%;width:9px;height:9px;margin-left:-4.5px;border-radius:50%;background:var(--gold);bottom:calc(20px + var(--m) * 66px);box-shadow:0 0 0 2px var(--surface-2)}
.wk-chart i.m[style*="--m:0;"],.wk-chart i.m[style="--m:0"]{display:none}
.wk-chart span{font-size:11.5px;color:var(--muted);font-weight:600}
.wk-leg{display:flex;gap:14px;margin-top:10px;font-size:12px;color:var(--muted)}
.wk-leg i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.wk-leg i.u{background:var(--dusk)}.wk-leg i.m{background:var(--gold);border-radius:50%}
.pdf-s{margin-top:14px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#8a5a2b}
.pdf-bars{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;margin-top:10px;height:80px;align-items:end}
.pdf-bars div{display:grid;grid-template-rows:1fr auto auto;justify-items:center;height:100%;gap:2px;font-size:10.5px;color:#556}
.pdf-bars i{width:70%;height:100%;border-radius:4px;background:#e6e8ee;position:relative;overflow:hidden}
.pdf-bars i::after{content:"";position:absolute;inset:0;background:#6F5DA3;transform-origin:bottom;transform:scaleY(var(--h))}
.pdf-bars b{color:#1b1f2a;font-size:11px}
.rep-card{margin-top:12px;padding:14px;border-radius:18px;background:var(--surface-2);border:1px solid var(--line)}
.rep-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.rep-top b{font-size:16px}
.rep-top span{font-size:12px;font-weight:700;color:var(--gold)}
.rep-card ul{margin:8px 0 0;padding-left:18px;display:grid;gap:6px;font-size:14.5px;color:color-mix(in srgb,var(--fg) 85%,var(--muted))}
.rep-card li b{color:var(--fg)}

/* ===== v13 · compromiso y días atrasados ===== */
.pledge-paper{margin-top:18px;padding:18px 18px 14px;border-radius:20px;background:#FBF7EF;color:#1f2433;box-shadow:0 18px 40px -22px rgba(0,0,0,.55),inset 0 0 0 1px rgba(0,0,0,.06);position:relative}
.pledge-paper .pp-h{display:flex;justify-content:space-between;gap:10px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#8a5a2b;padding-bottom:10px;border-bottom:1px solid rgba(0,0,0,.12)}
.pp-txt{margin-top:12px;font-family:var(--f-display);font-size:17px;line-height:1.5;letter-spacing:-.01em}
.pp-txt p + p{margin-top:8px}
.pp-txt ul{margin:8px 0 0;padding-left:18px;display:grid;gap:4px;font-family:var(--f-body);font-size:15px}
.pp-txt b{font-weight:650}
.pp-l{display:block;margin-top:14px;font-size:12px;font-weight:700;color:#6b5a45}
.pp-in{width:100%;height:46px;margin-top:6px;border:0;border-bottom:1.5px solid rgba(0,0,0,.25);background:transparent;font:500 19px var(--f-display);color:#1f2433;outline:none;padding:0 2px}
.pp-in:focus{border-bottom-color:#C4652F}
.pp-sig{position:relative;height:140px;margin-top:14px;border-radius:14px;background:repeating-linear-gradient(0deg,transparent 0 27px,rgba(0,0,0,.05) 27px 28px),#fff;border:1.5px dashed rgba(0,0,0,.18);touch-action:none}
.pp-sig canvas{position:absolute;inset:0;display:block;cursor:crosshair}
.pp-hint{position:absolute;inset:0;display:grid;place-items:center;font-size:14px;color:#9a8f80;pointer-events:none;transition:opacity .2s}
.pp-clear{position:absolute;right:8px;top:8px;height:28px;padding:0 10px;border-radius:99px;background:rgba(0,0,0,.06);font-size:12px;font-weight:700;color:#5a5048}
.pp-line{margin-top:8px;padding-top:6px;border-top:1.5px solid #1f2433;font-size:11.5px;color:#6b5a45;letter-spacing:.04em}
.pledge-paper.small .pp-txt{font-size:15px}
.pledge-paper.small .pp-txt ul{font-size:13.5px}
.pp-img{display:block;width:100%;max-height:110px;object-fit:contain;object-position:left;margin-top:10px}
.pl-sheet{display:flex;flex-direction:column}
.pl-sheet .ob-title{font-size:30px}
.pd-state{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pd-state button{display:grid;justify-items:center;gap:6px;padding:14px 10px;border-radius:18px;border:1.5px solid var(--line-2);font-weight:650;font-size:14px;text-align:center;transition:background .2s,border-color .2s}
.pd-state svg{width:22px;height:22px;stroke:var(--ok);stroke-width:2.2;fill:none}
.pd-state .rel svg{stroke:var(--alert)}
.pd-state button[aria-pressed="true"]{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 14%,transparent)}
.pd-state .rel[aria-pressed="true"]{border-color:var(--alert);background:color-mix(in srgb,var(--alert) 14%,transparent)}
.pd-moods{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.pd-step{display:flex;align-items:center;gap:14px}
.pd-step button{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line-2);font-size:22px;font-weight:500}
.pd-step b{font-family:var(--f-display);font-size:30px;font-weight:400;min-width:28px;text-align:center}
.pd-step span{color:var(--muted);flex:1}
.rc{display:grid;margin-top:14px;border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.rc-r{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;padding:11px 14px;border-top:1px solid var(--line);font-size:14.5px}
.rc-r:first-child{border-top:0}
.rc-r s{color:var(--muted)}
.rc-r b{color:var(--dawn)}
#plOk[aria-checked="true"] .ct{text-decoration:none!important;color:var(--fg)!important;opacity:1!important}
.pp-in{-webkit-user-select:text;user-select:text;position:relative;z-index:2;font-size:19px!important;pointer-events:auto}
#plSign.is-off{opacity:.55}
.flow-back{display:inline-flex;align-self:flex-start;margin-bottom:10px;font-size:15px!important}
.pw-back{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--fg) 8%,transparent);color:var(--fg);flex:none}
.pw-back svg{width:18px;height:18px;stroke:currentColor;stroke-width:2.2;fill:none}
.pw-top{display:flex;align-items:center;gap:8px}
.pw-top .pw-restore{margin-left:auto}
.tut-top{gap:10px}
/* ===== v14 · pago esquemático ===== */
.pw2 .pw-h{font-size:34px;font-weight:400;letter-spacing:-.035em;line-height:1.05;text-align:center;margin-top:10px}
.pw2 .pw-goal{margin-top:16px;padding:14px 6px 12px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}
.pf-list{display:grid;border-radius:20px;background:var(--surface);border:1px solid var(--line);overflow:hidden}
.pf-row{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;padding:12px 14px;border-top:1px solid var(--line);text-align:left}
.pf-row:first-child{border-top:0}
.pf-row .why-ic{width:40px;height:40px;border-radius:13px}
.pf-row .why-ic svg{width:20px;height:20px}
.pf-row b{display:block;font-size:15.5px;line-height:1.25}
.pf-row div span{display:block;font-size:13px;color:var(--muted);line-height:1.35;margin-top:2px}
.pf-row em{font-style:normal;font-size:11px;font-weight:700;color:var(--gold);padding:3px 8px;border-radius:99px;background:color-mix(in srgb,var(--gold) 12%,transparent)}
.pf-more{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;justify-content:center}
.pf-more span{display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 11px;border-radius:99px;background:var(--surface);border:1px solid var(--line);font-size:13px;font-weight:600}
.pf-more svg{width:12px;height:12px;stroke:var(--ok);stroke-width:3;fill:none}
.pw2 .plans{margin-top:18px}
.pw-cmp{margin-top:14px;border-radius:18px;border:1px solid var(--line);padding:4px 14px}
.pw-cmp summary{cursor:pointer;padding:10px 0;font-weight:700;font-size:14.5px;color:var(--muted);list-style:none;text-align:center}
.pw-cmp summary::-webkit-details-marker{display:none}
.pw-cmp[open] summary{color:var(--fg)}
.pw-cmp .ptable{margin-top:4px}
/* ===== v15 ===== */
.overlay > .atmo .f3{display:none}
.overlay > .atmo{height:100%}
.lvl-legend{display:grid;gap:6px}
.lvl-legend > div{display:grid;grid-template-columns:14px 1fr;gap:12px;align-items:start;padding:12px 14px;border-radius:16px;background:var(--surface);border:1px solid var(--line);opacity:.75}
.lvl-legend > div.on{opacity:1;border-color:var(--dawn);background:color-mix(in srgb,var(--dawn) 10%,var(--surface))}
.lvl-legend i{width:12px;height:12px;border-radius:50%;margin-top:5px;background:var(--line-2)}
.lvl-legend > div:nth-child(1) i{background:var(--ok)}.lvl-legend > div:nth-child(2) i{background:var(--gold)}.lvl-legend > div:nth-child(3) i{background:var(--dawn)}.lvl-legend > div:nth-child(4) i{background:var(--alert)}
.lvl-legend b{display:block;font-size:15.5px}
.lvl-legend em{font-style:normal;font-size:11px;font-weight:700;color:var(--dawn);margin-left:6px;padding:2px 7px;border-radius:99px;background:color-mix(in srgb,var(--dawn) 14%,transparent)}
.lvl-legend span{display:block;font-size:13.5px;color:var(--muted);margin-top:2px;line-height:1.4}
.lvl2{display:grid!important;gap:12px;text-align:left}
.lv2-row{display:flex;gap:14px;align-items:center}
.lv2-next{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--gold) 10%,var(--surface-2))}
.lv2-next .rw-ic{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:color-mix(in srgb,var(--gold) 20%,transparent);color:var(--gold);flex:none}
.lv2-next .rw-ic svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.9}
.lv2-next b{display:block;font-size:14.5px}
.lv2-next span span{display:block;font-size:12.5px;color:var(--muted)}
.lv2-ways{display:flex;flex-wrap:wrap;gap:6px}
.lv2-ways span{font-size:12.5px;padding:5px 10px;border-radius:99px;background:var(--surface-2);color:var(--muted)}
.lv2-ways b{color:var(--ok)}
.lv2-more{font-size:13.5px;font-weight:700;color:var(--gold)}
.card.level.lvl2{grid-template-columns:minmax(0,1fr)!important;align-items:stretch}

/* ===== v16 ===== */
.intro-hero .dial-of{font-size:24px!important;font-weight:600;color:var(--fg);margin-top:2px;letter-spacing:-.01em}
/* Tutorial: botón siempre en el mismo sitio */
#pwBox[data-stage="tut"]{height:100%}
.ob2.tut{min-height:100%;display:flex;flex-direction:column;padding-bottom:0}
.tut-actions{position:sticky;bottom:0;z-index:5;margin:auto -22px 0;padding:16px 22px calc(24px + env(safe-area-inset-bottom,0px));background:linear-gradient(to top,var(--bg) 72%,transparent)}
.tut-visual{min-height:210px}
.tut .ob-lead{font-size:17px!important;line-height:1.5}
/* Fuerza de la racha */
.str{display:grid;gap:8px;width:100%;text-align:left;padding:14px;border-radius:20px;background:var(--surface-2);border:1px solid var(--line)}
.str-h{display:flex;justify-content:space-between;align-items:baseline;font-weight:700;font-size:15px}
.str-h b{font-family:var(--f-display);font-size:30px;font-weight:450;color:var(--tc,var(--ok))}
.str-bar{height:10px;border-radius:99px;background:var(--tick-off);overflow:hidden}
.str-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--gold),var(--ok));transform-origin:left;transition:transform .6s var(--ease)}
.str.tone-alert .str-bar i{background:linear-gradient(90deg,var(--alert),var(--gold))}
.str-chart{width:100%;height:56px;display:block}
.str p{font-size:14px;color:var(--muted);margin:0}
.str .more{font-size:13.5px;font-weight:700;color:var(--dawn)}
.str-big{margin-top:14px;padding:12px;border-radius:18px;background:var(--surface-2)}
.str-big .str-chart{height:90px}
.insight-card .mgrid{margin-top:12px}
/* Puntos */
.pt-row{display:flex;align-items:baseline;gap:8px;margin-top:4px}
.pt-big{font-family:var(--f-display);font-size:44px;font-weight:400;letter-spacing:-.03em;line-height:1}
.pt-row > span{color:var(--muted);font-weight:600}
.pt-pro{font-style:normal;font-size:12px;font-weight:700;color:var(--gold);padding:3px 8px;border-radius:99px;background:color-mix(in srgb,var(--gold) 14%,transparent);margin-left:auto}
.store{display:grid;gap:8px}
.st-item{display:grid;grid-template-columns:38px 1fr auto;gap:12px;align-items:center;padding:10px 12px;border-radius:16px;background:var(--surface-2);border:1px solid var(--line)}
.st-item.focus{border-color:var(--gold)}
.st-item .rw-ic{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--gold) 16%,transparent);color:var(--gold)}
.st-item .rw-ic svg{width:20px;height:20px}
.st-t b{display:block;font-size:14.5px}
.st-t span{display:block;font-size:12.5px;color:var(--muted);line-height:1.35}
.st-btn{min-width:74px;height:36px;padding:0 12px;border-radius:99px;background:var(--gold);color:#1a1405;font-weight:700;font-size:13.5px}
.st-btn.off{background:var(--surface);color:var(--muted);border:1px solid var(--line-2)}
.st-btn.on{background:var(--ok);color:#06140d}
.st-own{font-size:13px;font-weight:700;color:var(--ok)}
.packs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pack{position:relative;display:grid;justify-items:center;gap:2px;padding:16px 8px 12px;border-radius:18px;background:var(--surface-2);border:1.5px solid var(--line-2)}
.pack em{position:absolute;top:-9px;font-style:normal;font-size:10.5px;font-weight:800;padding:2px 8px;border-radius:99px;background:var(--gold);color:#1a1405;white-space:nowrap}
.pack b{font-family:var(--f-display);font-size:24px;font-weight:450}
.pack span{font-size:12px;color:var(--muted)}
.pack i{font-style:normal;margin-top:6px;font-weight:700;font-size:14px}
.tv-pts{display:grid;gap:8px;width:100%;max-width:280px}
.tv-pts-row{display:flex;justify-content:space-between;padding:10px 14px;border-radius:14px;background:var(--surface-2);font-weight:600}
.tv-pts-row b{color:var(--ok)}
.tv-pts-arrow{text-align:center;color:var(--faint)}
.tv-pts-prize{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--gold) 14%,var(--surface-2));font-weight:700}
.tv-pts-prize svg{width:22px;height:22px;stroke:var(--gold);fill:none;stroke-width:1.9}
.tv-pts-prize b{color:var(--gold);font-size:13px}
.tv-str{width:100%;max-width:300px;display:grid;gap:10px}
.tv-str-legend{display:grid;gap:4px;font-size:13.5px;color:var(--muted)}
.tv-str-legend b{color:var(--fg)}
.tv-ai{position:relative;width:260px;height:200px}
.tv-ai-core{position:absolute;left:50%;top:44%;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--dawn) 60%,#fff),var(--dusk));box-shadow:0 0 0 10px color-mix(in srgb,var(--dawn) 12%,transparent),0 0 0 22px color-mix(in srgb,var(--dawn) 6%,transparent);animation:orbBreath 3s ease-in-out infinite}
.tv-ai-core svg{width:40px;height:40px;stroke:#fff;fill:none;stroke-width:1.6}
.tv-ai-n{position:absolute;font-size:12px;font-weight:700;padding:5px 10px;border-radius:99px;background:var(--surface-2);border:1px solid var(--line-2)}
.tv-ai-n.n0{left:0;top:8px}.tv-ai-n.n1{right:0;top:8px}.tv-ai-n.n2{left:4px;top:120px}.tv-ai-n.n3{right:4px;top:120px}
.tv-ai-out{position:absolute;left:0;right:0;bottom:0;text-align:center;font-size:13px;font-weight:700;color:var(--ok);padding:8px;border-radius:12px;background:color-mix(in srgb,var(--ok) 12%,transparent)}
/* Oferta 24 h */
.offer2{margin-top:16px;padding:16px;border-radius:22px;background:radial-gradient(120% 80% at 0% 0%,color-mix(in srgb,var(--ok) 18%,transparent),transparent 60%),var(--surface);border:1.5px solid color-mix(in srgb,var(--ok) 45%,var(--line))}
.of-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.of-tag{font-size:11px;font-weight:800;letter-spacing:.06em;color:var(--ok)}
.of-timer{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:99px;background:color-mix(in srgb,var(--alert) 14%,transparent);color:var(--alert);font-weight:700}
.of-timer svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.of-timer b{font-family:var(--f-mono);font-size:13px;letter-spacing:.02em}
.of-price{display:flex;align-items:baseline;gap:10px;margin-top:10px;flex-wrap:wrap}
.of-price s{color:var(--muted);font-size:18px}
.of-price b{font-family:var(--f-display);font-size:40px;font-weight:450;letter-spacing:-.03em;color:var(--fg)}
.of-price span{color:var(--muted);font-weight:600}
.of-price.sm b{font-size:28px}
.of-price.sm span{color:var(--ok);font-weight:800}
.of-save{margin-top:6px;font-size:14px;color:var(--muted)}
.of-save b{color:var(--ok)}
.offer-card{display:grid!important;gap:6px;text-align:left;width:100%;border:1.5px solid color-mix(in srgb,var(--ok) 45%,var(--line));background:radial-gradient(120% 80% at 0% 0%,color-mix(in srgb,var(--ok) 16%,transparent),transparent 60%),var(--surface)}
.oc-t{font-size:18px;margin-top:6px}
/* Pro claro */
.pw2 .pw-h{font-size:34px}
.goal-box{margin-top:16px;padding:16px 8px 12px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
.goal-line.g4{margin-top:0}
.goal-line.g4::before{top:7px;left:12.5%;right:12.5%}
.goal-line.g4 em{font-style:normal;font-size:11.5px;font-weight:700;color:var(--ok);margin-top:2px;line-height:1.2;text-align:center}
.goal-line.g4 div:nth-child(3) i{border-color:var(--ok);background:var(--ok)}
.goal-line.g4 div:last-child i{border-color:var(--gold);background:var(--gold);box-shadow:0 0 0 5px color-mix(in srgb,var(--gold) 22%,transparent)}
.goal-line.g4 div:last-child em{color:var(--gold)}
.pf-row{grid-template-columns:40px 1fr}
.pw-cta{height:auto;min-height:58px;padding:14px 20px;line-height:1.25}
.pw-cta2{margin-top:16px}
.pt2 .pt-h span:first-child{font-size:12px;color:var(--muted);font-weight:600;text-align:left}
.pt-d{border-top:1px solid var(--line)}
.pt-d summary{list-style:none;cursor:pointer}
.pt-d summary::-webkit-details-marker{display:none}
.pt-d .pt-r{border-top:0}
.pt-chev{display:inline-block;font-style:normal;color:var(--faint);margin-right:6px;transition:transform .2s;font-size:16px}
.pt-d[open] .pt-chev{transform:rotate(90deg);color:var(--gold)}
.pt-d p{margin:0;padding:0 14px 12px 30px;font-size:13.5px;color:var(--muted);line-height:1.45}
.safe-line{margin-top:10px;font-weight:700;color:var(--ok)}

/* ===================== v17 ===================== */
:root{--pia:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill-rule='evenodd' d='M12 4.6c4.4 0 8 2.9 8 6.6s-3.6 6.6-8 6.6c-.9 0-1.7-.1-2.5-.3l-3.7 2.1.9-3.3C5.1 15 4 13.2 4 11.2 4 7.5 7.6 4.6 12 4.6zM8.8 10a1.2 1.2 0 1 0 0 2.4 1.2 1.2 0 0 0 0-2.4zm3.2 0a1.2 1.2 0 1 0 0 2.4 1.2 1.2 0 0 0 0-2.4zm3.2 0a1.2 1.2 0 1 0 0 2.4 1.2 1.2 0 0 0 0-2.4z'/></svg>");
  --moon:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M15.5 3.2A9 9 0 1 0 20.8 16 7.2 7.2 0 0 1 15.5 3.2z'/></svg>")}
/* Psicólogo IA · logo nuevo */
.faro-orb{--o1:#3E6FB8;--o2:#16243F;background:radial-gradient(120% 120% at 30% 18%,#E3ECFA 0%,#7FA3D9 13%,var(--o1) 42%,#24406E 72%,var(--o2) 100%)!important;box-shadow:0 10px 26px -10px color-mix(in srgb,var(--o1) 85%,transparent),inset 0 -6px 12px rgba(20,20,60,.22),inset 0 2px 5px rgba(255,255,255,.45)!important;animation:orbBreath 5s ease-in-out infinite}
.faro-orb::before{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px solid color-mix(in srgb,var(--o1) 65%,transparent);opacity:0;animation:orbHalo 3.8s cubic-bezier(.22,1,.36,1) infinite;pointer-events:none}
.faro-orb::after{content:"";position:absolute;inset:23%;background:#fff;-webkit-mask:var(--pia) center/contain no-repeat;mask:var(--pia) center/contain no-repeat;animation:orbFloat 5s ease-in-out infinite}
.faro-orb.busy::before{animation-duration:1.2s}
.faro-orb.busy::after{animation:orbThink 1.1s ease-in-out infinite}
@keyframes orbHalo{0%{transform:scale(.92);opacity:0}20%{opacity:.85}100%{transform:scale(1.42);opacity:0}}
@keyframes orbFloat{0%,100%{transform:translateY(.5px)}50%{transform:translateY(-1.5px)}}
@keyframes orbThink{0%,100%{transform:scale(1)}50%{transform:scale(.84)}}
.ai-dot{position:relative;background:radial-gradient(120% 120% at 30% 18%,#E3ECFA 0%,#7FA3D9 13%,#3E6FB8 42%,#24406E 72%,#16243F 100%)!important}
.ai-dot::after{content:"";position:absolute;inset:4px;background:#fff;-webkit-mask:var(--pia) center/contain no-repeat;mask:var(--pia) center/contain no-repeat}
.faro-btn .faro-orb::before{inset:-6px}
/* Cabecera del chat, gemas y aviso */
.faro-head{grid-template-columns:32px auto 1fr auto!important}
.ai-disc{display:flex;gap:6px;align-items:flex-start;font-size:11.5px;color:var(--faint);margin:0 0 8px;line-height:1.35}
.ai-disc svg{width:13px;height:13px;flex:none;margin-top:1px}
.gem-chip{display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 11px 0 9px;border-radius:99px;background:color-mix(in srgb,var(--sky) 16%,var(--surface));border:1px solid color-mix(in srgb,var(--sky) 42%,transparent);color:var(--fg)}
.gem-chip svg{width:16px;height:16px;color:var(--sky)}
.gem-chip b{font-size:13.5px;font-weight:700}
.gem-chip.low{border-color:var(--gold)}
.gem-note{display:flex;align-items:center;justify-content:center;gap:5px;width:100%;margin:2px 0;background:none;border:0;color:var(--faint);font-size:11.5px}
.gem-note svg{width:13px;height:13px;color:var(--sky);flex:none}
.sugg-wrap{display:grid;gap:6px}
.sugg-lbl{font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);padding-left:2px}
.limit-card.gem-out > span{background:var(--sky);color:#062030}
.gem-bal{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.gem-bal div{display:grid;gap:2px;padding:14px;border-radius:18px;background:var(--surface-2);text-align:center}
.gem-bal b{font-family:var(--f-display);font-size:30px;font-weight:400}
.gem-bal span{font-size:12.5px;color:var(--muted)}
.gem-eq{display:grid;grid-template-columns:38px 1fr;gap:2px 12px;align-items:center;margin-top:12px;padding:14px;border-radius:18px;border:1.5px solid color-mix(in srgb,var(--sky) 45%,transparent);background:color-mix(in srgb,var(--sky) 9%,transparent)}
.gem-eq .gq-ic{grid-row:span 2;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--sky);color:#062030}
.gem-eq .gq-ic svg{width:20px;height:20px}
.gem-eq b{font-size:16px}
.gem-eq > span:last-child{font-size:13px;color:var(--muted)}
.gem-rules{margin:14px 0 4px;padding-left:18px;display:grid;gap:6px;font-size:13.5px;color:var(--muted);line-height:1.45}
.gem-rules b{color:var(--fg)}
.gem-packs .pack{gap:1px}
.gem-packs .gp-ic{width:26px;height:26px;color:var(--sky);margin-bottom:2px}
.gem-packs .gp-ic svg{width:26px;height:26px}
.gem-packs small{font-size:10.5px;color:var(--faint);margin-top:3px;text-align:center}
.gem-mini{display:inline-flex;align-items:center;gap:4px;padding:5px 9px;border-radius:99px;background:color-mix(in srgb,var(--sky) 15%,transparent);color:var(--fg);font-size:13px}
.gem-mini svg{width:14px;height:14px;color:var(--sky)}
/* SOS arriba en Hoy */
.sos-top{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;width:100%;padding:11px 12px;border-radius:20px;text-align:left;background:linear-gradient(100deg,color-mix(in srgb,var(--dawn) 20%,var(--surface)),color-mix(in srgb,var(--alert) 10%,var(--surface)));border:1px solid color-mix(in srgb,var(--dawn) 42%,transparent);box-shadow:var(--shadow)}
.sos-top:active{transform:scale(.98)}
.sos-top .st-ic{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--dawn);color:var(--dawn-ink)}
.sos-top .st-ic svg{width:20px;height:20px}
.sos-top .st-tx b{display:block;font-size:15.5px;line-height:1.2}
.sos-top .st-tx span{display:block;font-size:12.5px;color:var(--muted);margin-top:2px;line-height:1.3}
.sos-top .st-go{font-weight:800;font-size:12px;letter-spacing:.08em;padding:8px 12px;border-radius:99px;background:var(--fg);color:var(--bg)}
/* Plan de acción */
.plan-line{display:grid;grid-template-columns:32px 1fr auto;gap:10px;align-items:center;width:100%;margin-top:12px;padding:11px 12px;border-radius:16px;background:color-mix(in srgb,var(--ok) 9%,transparent);border:1px dashed color-mix(in srgb,var(--ok) 45%,transparent);text-align:left;color:var(--fg)}
.plan-line .pl-ic{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--ok) 22%,transparent);color:var(--ok)}
.plan-line .pl-ic svg{width:17px;height:17px}
.plan-line em{display:block;font-style:normal;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ok)}
.plan-line b{display:block;font-size:14px;line-height:1.3;margin-top:1px;font-weight:600}
.ap-list{display:grid;gap:9px}
.ap-list div{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-size:14.5px;line-height:1.35}
.ap-list span{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--ok) 22%,transparent);color:var(--ok)}
.ap-list svg{width:13px;height:13px}
/* Ranking en Hoy */
.rank-mini{display:block;width:100%;text-align:left}
.board.sm .brow{padding:8px 0;grid-template-columns:48px 30px 1fr auto}
.board.sm .av{width:30px;height:30px;font-size:13px}
.board.sm .r{font-size:12.5px}
.rank-mini .lv2-more{display:block;margin-top:10px}
/* Reto de la semana */
.weekly-card .wc-top{display:grid;grid-template-columns:1fr 56px;gap:12px;align-items:start}
.weekly-card h3{font-size:19px;margin-top:6px;line-height:1.2}
.weekly-card p{margin-top:6px}
.wc-medal{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--tick-off);color:var(--faint)}
.wc-medal svg{width:24px;height:24px}
.wc-medal.on{background:conic-gradient(from 210deg,var(--gold),var(--dawn),var(--gold));color:#1a1405;box-shadow:0 0 22px -4px var(--gold)}
.wc-days{display:flex;gap:6px;margin-top:14px}
.wc-d{flex:1;display:grid;justify-items:center;gap:5px}
.wc-d i{width:100%;height:30px;border-radius:10px;background:var(--tick-off);display:grid;place-items:center;color:var(--dawn-ink)}
.wc-d i svg{width:15px;height:15px}
.wc-d span{font-size:11px;font-weight:700;color:var(--faint)}
.wc-d.on i{background:var(--dawn)}
.wc-d.today i{box-shadow:inset 0 0 0 2px var(--dawn)}
.wc-d.miss i{background:color-mix(in srgb,var(--alert) 25%,transparent)}
.wc-d:last-child i{outline:1.5px dashed var(--gold);outline-offset:2px}
.weekly-card.done{border-color:color-mix(in srgb,var(--gold) 50%,transparent)}
.weekly-card.failed .wc-d:last-child i{outline:0}
/* Premios */
.rw-card .rw-next,.rw-card .rw-pts{display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;width:100%;text-align:left;padding:12px;border-radius:18px;background:var(--surface-2);color:var(--fg)}
.rw-card .rw-pts{margin-top:8px}
.md-mini{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(from 210deg,var(--fog),var(--dusk),var(--dawn),var(--gold),var(--fog));position:relative}
.md-mini::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--surface-2)}
.md-mini b{position:relative;z-index:1;font-family:var(--f-display);font-size:16px;font-weight:500}
.rw-tx{display:grid;gap:2px;min-width:0}
.rw-tx em{font-style:normal;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}
.rw-tx b{font-size:15px;line-height:1.25}
.rw-tx > span{font-size:12.5px;color:var(--muted);line-height:1.3}
.rw-bar{display:block;height:6px;border-radius:99px;background:var(--tick-off);margin-top:6px;overflow:hidden}
.rw-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--dawn),var(--gold))}
.rw-pts .rw-ic{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--gold) 20%,transparent);color:var(--gold)}
.rw-pts .rw-ic svg{width:22px;height:22px}
.rw-how{font-size:12.5px;color:var(--muted);margin-top:10px;line-height:1.4}
button.badge{background:none;border:0;padding:0;color:inherit;font:inherit;cursor:pointer}
button.badge:active{transform:scale(.95)}
.badge.t-gold:not(.off) .md{box-shadow:0 0 16px -4px var(--gold)}
.medal-row{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.medal-s{flex:none;width:92px;display:grid;justify-items:center;gap:4px;text-align:center}
.medal-s > span{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(from 210deg,var(--gold),var(--dawn),var(--gold));color:#1a1405}
.medal-s svg{width:22px;height:22px}
.medal-s b{font-size:11.5px;line-height:1.2}
.medal-s em{font-style:normal;font-size:10.5px;color:var(--faint)}
.medal-big{display:grid;place-items:center;margin:4px auto 14px}
.medal-big > span{width:96px;height:96px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(from 210deg,var(--gold),var(--dawn),var(--dusk),var(--gold));color:#1a1405;box-shadow:0 0 40px -6px var(--gold)}
.medal-big > span svg{width:40px;height:40px}
.medal-big > span b{font-family:var(--f-display);font-size:34px;font-weight:500}
.medal-big.off > span{background:var(--tick-off);color:var(--faint);box-shadow:none}
/* Mensajes de ánimo y neutros */
.toast.cheer{display:flex;gap:7px;align-items:center;white-space:normal;width:max-content;max-width:calc(100% - 40px);background:linear-gradient(90deg,var(--dawn),var(--gold));color:#1a1405;padding:11px 18px;animation-duration:2.7s;box-shadow:0 10px 30px -10px var(--dawn)}
.toast.cheer b{font-weight:800;flex:none}
.toast.cheer span{font-weight:600}
.toast.neutral{white-space:normal;width:min(330px,calc(100% - 40px));border-radius:18px;display:grid;gap:4px;text-align:left;padding:12px 16px;animation-duration:5.1s;background:var(--surface-2);color:var(--fg);border:1px solid var(--line-2);box-shadow:var(--shadow)}
.toast.neutral em{font-style:normal;font-weight:500;font-size:12.5px;color:var(--muted);line-height:1.4}
.neutral-note{font-size:12.5px;color:var(--muted);line-height:1.45;margin-top:10px;padding:10px 12px;border-radius:14px;background:var(--surface-2)}
/* Invitar y privacidad */
.invite-card h3{font-size:20px;margin-top:6px}
.invite-card p{margin-top:6px}
.code-box{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding:12px 12px 12px 16px;border-radius:18px;border:1.5px dashed color-mix(in srgb,var(--ok) 55%,transparent);background:color-mix(in srgb,var(--ok) 8%,transparent)}
.code-box em{display:block;font-style:normal;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.code-box b{font-size:20px;letter-spacing:.06em;font-weight:700}
.priv-card .toggle{border-top:0;padding:2px 0}
.priv-card .toggle b{display:block;font-size:15px}
.priv-card .toggle em{display:block;font-style:normal;font-size:12.5px;color:var(--muted);margin-top:2px;line-height:1.35}
/* Código amigo */
.fc-link{display:inline-flex!important;align-items:center;justify-content:center;gap:6px}
.fc-link svg{width:16px;height:16px}
.fc-in{display:grid;grid-template-columns:1fr auto;gap:8px}
.fc-in[hidden]{display:none}
.fc-in .input{text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.fc-ok{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--fg);font-size:13.5px}
.fc-ok svg{width:18px;height:18px;color:var(--ok);flex:none}
.plan.plan-f .flag{background:var(--ok)!important;color:#062014!important}
/* Calendario: lección */
.lesson-card .lc-t{font-size:16px;font-weight:600;margin-top:4px;line-height:1.35}
/* Curva: «Estás aquí» */
.here-pulse{animation:herePulse 2.2s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes herePulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(1.9);opacity:0}}
/* Cerebro */
.brain-hero{padding:14px 18px 16px;overflow:hidden}
.bh-net svg{width:100%;height:auto;display:block;overflow:visible}
.bn-e{stroke:var(--fg);stroke-opacity:.12;stroke-width:.2;stroke-linecap:round}
.bn-e.on{stroke:url(#bnLine);stroke-opacity:.9;stroke-width:.3;stroke-dasharray:var(--l);stroke-dashoffset:var(--l);animation:bnDraw 1s cubic-bezier(.22,1,.36,1) forwards}
@keyframes bnDraw{to{stroke-dashoffset:0}}
.bn-n{fill:var(--fg);fill-opacity:.22}
.bn-n.on{fill:var(--dawn);fill-opacity:1;filter:drop-shadow(0 0 .6px var(--dawn));transform-box:fill-box;transform-origin:center;animation:bnPop .6s cubic-bezier(.22,1,.36,1) both,bnPulse 3s ease-in-out infinite}
@keyframes bnPop{from{transform:scale(0)}}
@keyframes bnPulse{0%,100%{opacity:1}50%{opacity:.55}}
.bh-row{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:4px}
.bh-num{display:grid;gap:2px}
.bh-num b{font-family:var(--f-display);font-size:60px;font-weight:250;letter-spacing:-.05em;line-height:.9}
.bh-num b small{font-size:.42em;letter-spacing:0;margin-left:3px;color:var(--muted);font-weight:400}
.bh-side{display:grid;gap:6px;justify-items:end;text-align:right;padding-bottom:4px}
.bh-side em{font-style:normal;font-size:13px;font-weight:600;color:var(--ok)}
.bh-phase{font-size:12px;font-weight:700;padding:5px 10px;border-radius:99px;color:var(--pc);background:color-mix(in srgb,var(--pc) 15%,transparent);white-space:nowrap}
.bh-cap{font-size:13px;color:var(--muted);margin-top:10px;line-height:1.4}
.bh-bars{display:grid;gap:11px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.bh-bars div{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center}
.bh-bars span{font-size:13.5px;color:var(--muted)}
.bh-bars b{font-size:14px}
.bh-bars i{grid-column:1/-1;height:6px;border-radius:99px;background:var(--tick-off);overflow:hidden;display:block}
.bh-bars em{display:block;height:100%;border-radius:inherit;transform-origin:left;animation:barGrow 1.2s cubic-bezier(.22,1,.36,1) both}
@keyframes barGrow{from{transform:scaleX(0)}}
.cerebro-v .h-title em{font-style:normal;background:linear-gradient(90deg,var(--dawn),var(--dusk));-webkit-background-clip:text;background-clip:text;color:transparent}
/* Icono discreto «Luna» */
[data-icon="luna"] .logo{position:relative;background:linear-gradient(160deg,#2B3350,#141828)!important}
[data-icon="luna"] .logo > span{visibility:hidden}
[data-icon="luna"] .logo::after{content:"";position:absolute;inset:24%;background:#F1E6C8;-webkit-mask:var(--moon) center/contain no-repeat;mask:var(--moon) center/contain no-repeat}

/* ===================== v18 ===================== */
/* Ranking: fila destacada alineada */
.brow.me{margin-inline:-12px;padding-inline:12px!important;background:linear-gradient(90deg,color-mix(in srgb,var(--dawn) 20%,transparent),color-mix(in srgb,var(--dawn) 8%,transparent));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--dawn) 30%,transparent);border-top-color:transparent}
.brow.me .r{color:var(--dawn);font-weight:700}
.brow.me .dd small{color:var(--muted)}
/* Tabla Gratis/Pro con desplegable elegante */
.pt3 .pt-h,.pt3 .pt-r{display:grid;grid-template-columns:1fr 62px 62px;align-items:stretch}
.pt3 .pt-h{padding:0 0 0 14px}
.pt3 .pt-h > span{display:flex;align-items:center;justify-content:center;padding:10px 0;margin:0!important}
.pt3 .pt-h > span:first-child{justify-content:flex-start}
.pt3 .pt-it{border-top:1px solid var(--line)}
.pt3 .pt-r{width:100%;padding:0 0 0 14px;border:0;background:none;color:var(--fg);font:inherit;font-size:14px;text-align:left;cursor:pointer}
.pt3 .pt-r > span{display:flex;align-items:center;padding:12px 0;margin:0!important}
.pt3 .pt-r > span:not(:first-child){justify-content:center;font-weight:700}
.pt3 .pt-t{padding-right:8px!important;line-height:1.3}
.pt3 .pro-col{background:color-mix(in srgb,var(--gold) 9%,transparent)}
.pt3 .pt-chev{flex:none;transition:transform .3s cubic-bezier(.22,1,.36,1),color .2s}
.pt3 .pt-it.open .pt-chev{transform:rotate(90deg);color:var(--gold)}
.pt3 .pt-it.open .pt-r .pt-t{color:var(--fg);font-weight:600}
.pt-x{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s cubic-bezier(.22,1,.36,1)}
.pt-x > div{overflow:hidden;min-height:0}
.pt-it.open .pt-x{grid-template-rows:1fr}
.pt-x p{margin:0 10px 12px;padding:14px 16px;border-radius:14px;background:var(--bg);box-shadow:inset 0 1px 3px rgba(0,0,0,.18);font-size:14px;line-height:1.55;color:var(--muted);opacity:0;transform:translateY(-6px);transition:opacity .3s ease,transform .38s cubic-bezier(.22,1,.36,1)}
.pt-it.open .pt-x p{opacity:1;transform:none}
.gem-c{display:inline-flex;align-items:center;gap:3px;color:var(--sky)}
.gem-c svg{width:15px;height:15px}
.pro-col .gem-c{color:var(--gold)}
/* Tu racha: palabra + porcentaje */
.str-h b{font-family:var(--f-display);font-size:26px}
.str-h b small{font-family:var(--f-ui,inherit);font-size:13px;font-weight:600;color:var(--muted);margin-left:4px;letter-spacing:0}
/* Tutorial: reloj opcional */
.tv-watch{position:relative;display:grid;justify-items:center;gap:14px;width:100%;max-width:290px}
.tw-opt{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:99px;background:color-mix(in srgb,var(--sky) 18%,transparent);color:var(--sky)}
.tw-ic{width:76px;height:76px;border-radius:24px;display:grid;place-items:center;background:var(--surface-2);border:1px solid var(--line-2);color:var(--sky)}
.tw-ic svg{width:40px;height:40px}
.tw-card{width:100%;padding:14px 16px;border-radius:18px;background:var(--surface-2);border:1px solid var(--line);text-align:left}
.tw-card em{display:block;font-style:normal;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tw-card b{display:block;margin-top:4px;font-size:15px;line-height:1.35}
/* Compromiso: el nombre se puede tocar */
.pl-name{cursor:pointer;border-bottom:1.5px dashed currentColor;padding:0 2px}
/* Día 1: otro día */
.d1-date{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
#d1chips [data-d1other]{display:inline-flex;align-items:center;gap:6px}
#d1chips [data-d1other] svg{width:16px;height:16px}
/* v18b · toast de aviso */
.toast.warn{white-space:normal;width:min(330px,calc(100% - 40px));border-radius:18px;text-align:left;padding:12px 16px;animation-duration:5.1s;background:var(--alert);color:#fff}
/* Tabla: flechas visibles y desplegable solo en la franja oscura */
.pt3 .pt-chev{flex:none;width:22px;height:22px;margin-right:8px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--fg) 12%,transparent);transition:transform .3s cubic-bezier(.22,1,.36,1),background .2s}
.pt3 .pt-chev svg,.of-acc .pt-chev svg{width:15px;height:15px;fill:none;stroke:var(--fg);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pt3 .pt-it.open .pt-chev{transform:rotate(180deg);background:var(--gold)}
.pt3 .pt-it.open .pt-chev svg{stroke:#1a1405}
.pt3 .pt-xg{display:grid;grid-template-columns:1fr 62px}
.pt3 .pt-xg p{margin:0 8px 12px 10px}
.pt3 .pt-xg .pro-col{display:block;padding:0!important}
/* Oferta: urgencia, celebración y desplegables */
.of-urgent{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-16px -16px 14px;padding:12px 16px;border-radius:20px 20px 0 0;background:linear-gradient(90deg,#D93A3A,#F0703C);color:#fff;animation:urgPulse 1.6s ease-in-out infinite}
.of-u-l{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:13px;letter-spacing:.02em;text-transform:uppercase}
.of-u-l svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2.2;animation:clockShake 2.4s ease-in-out infinite}
.of-urgent b{font-family:var(--f-mono);font-size:26px;font-weight:700;letter-spacing:.02em;color:#fff}
@keyframes urgPulse{0%,100%{box-shadow:0 0 0 0 rgba(217,58,58,0)}50%{box-shadow:0 0 22px 2px rgba(217,58,58,.55)}}
@keyframes clockShake{0%,80%,100%{transform:rotate(0)}84%{transform:rotate(-14deg)}88%{transform:rotate(14deg)}92%{transform:rotate(-10deg)}96%{transform:rotate(8deg)}}
.of-timer{background:#D93A3A!important;color:#fff!important;animation:urgPulse 1.6s ease-in-out infinite}
.of-timer svg{stroke:#fff!important}
.of-timer.hot,.of-urgent:has(.hot),.hot{animation-duration:.8s}
.offer2{overflow:hidden}
.offer2.pop{animation:offerPop .9s cubic-bezier(.34,1.56,.64,1) both}
@keyframes offerPop{0%{transform:scale(.86);opacity:0}60%{transform:scale(1.03);opacity:1}100%{transform:none}}
.of-gift{justify-self:center;margin:2px auto 0;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(from 200deg,var(--gold),var(--dawn),var(--gold));color:#1a1405;box-shadow:0 0 34px -4px var(--gold);animation:giftIn .8s cubic-bezier(.34,1.56,.64,1) both}
.of-gift svg{width:30px;height:30px}
@keyframes giftIn{0%{transform:scale(0) rotate(-30deg)}100%{transform:none}}
.of-acc{display:grid;border-radius:20px;overflow:hidden;border:1px solid var(--line);background:var(--surface)}
.oa-it + .oa-it{border-top:1px solid var(--line)}
.oa-r{display:grid;grid-template-columns:40px 1fr 22px;gap:12px;align-items:center;width:100%;padding:12px 14px;border:0;background:none;color:var(--fg);font:inherit;text-align:left;cursor:pointer}
.oa-t{display:grid;gap:2px}
.oa-t b{font-size:15px}
.oa-t span{font-size:13px;color:var(--muted)}
.of-acc .pt-chev{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--fg) 12%,transparent);transition:transform .3s cubic-bezier(.22,1,.36,1),background .2s}
.oa-it.open .pt-chev{transform:rotate(180deg);background:var(--ok)}
.oa-it.open .pt-chev svg{stroke:#062014}
.oa-it.open .pt-x{grid-template-rows:1fr}
.oa-it.open .pt-x p{opacity:1;transform:none}
.of-acc .pt-x p{margin:0 12px 12px}

/* ===================== v19 ===================== */
/* Psico IA: burbuja de chat y halo centrado */
.faro-btn::before{display:none!important}
.faro-btn{box-shadow:0 0 0 5px var(--bg),0 0 0 6px color-mix(in srgb,#3E6FB8 45%,var(--line))!important}
.faro-orb::before{inset:0!important;border:2px solid rgba(110,150,220,.75);opacity:0;animation:orbHalo 3.2s cubic-bezier(.22,1,.36,1) infinite}
.faro-orb.busy::before{animation-duration:1.1s}
@keyframes orbHalo{0%{transform:scale(1);opacity:.75}100%{transform:scale(1.55);opacity:0}}
.faro-orb::after{inset:21%!important;transform-origin:center}
@keyframes orbFloat{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
/* Ranking: columna del puesto más ancha */
.brow{grid-template-columns:52px 36px 1fr auto}
.brow .r{white-space:nowrap}
/* Hoy: grupos con sentido */
.grp-h{margin:14px 4px -4px}
.grp-h h2{font-size:12.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.grp-h p{font-size:13.5px;color:var(--faint);margin-top:3px;line-height:1.4}
.goal-ln{margin-top:12px;font-size:14px;color:var(--muted);text-align:center}
.goal-ln b{color:var(--fg)}
.tab-why{font-size:14.5px;color:var(--muted);line-height:1.45;margin:-6px 4px 6px}
.sec-why{font-size:13.5px;color:var(--muted);line-height:1.45;margin:-4px 0 12px}
section > .sec-h[style*="padding:0 4px"] + .sec-why{margin:-4px 4px 12px}
.h-title.one-line{white-space:nowrap}
/* Cerebro por zonas */
.bh-art{margin:4px -6px 0}
.br-art{width:100%;height:auto;display:block;overflow:visible}
.br-z{animation:brZone 1.4s ease both}
@keyframes brZone{from{fill-opacity:0}}
.br-rew{transform-box:fill-box;transform-origin:center;animation:brPulse 3s ease-in-out infinite}
@keyframes brPulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.12);opacity:1}}
.br-core{filter:drop-shadow(0 0 3px var(--dawn))}
.br-pill{animation:pillIn .6s cubic-bezier(.34,1.56,.64,1) .5s both;transform-box:fill-box;transform-origin:center}
@keyframes pillIn{from{opacity:0;transform:scale(.7)}}
.bh-top{margin:0 0 4px}
.bh-legend{display:grid;gap:12px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.bh-legend > div{display:grid;grid-template-columns:10px 1fr auto;gap:10px;align-items:start}
.bh-legend i{width:10px;height:10px;border-radius:50%;margin-top:6px}
.bh-legend span b{display:block;font-size:14.5px}
.bh-legend span em{display:block;font-style:normal;font-size:13px;color:var(--muted);line-height:1.4;margin-top:2px}
.bh-legend > div > b{font-size:15px}
/* ===================== v20 ===================== */
/* Arriba: puntos y SOS */
.pts-chip{gap:5px!important;color:var(--gold);border-color:color-mix(in srgb,var(--gold) 40%,transparent)!important;cursor:pointer}
.pts-chip svg{width:13px;height:13px}
.pts-chip b{font-weight:700;font-size:12px}
.sos-chip{height:28px;padding:0 11px;border-radius:99px;background:#D93A3A;color:#fff;font-weight:800;font-size:12px;letter-spacing:.06em;box-shadow:0 4px 14px -4px rgba(217,58,58,.7)}
.sos-chip:active{transform:scale(.94)}
.tl-r{gap:5px!important}
/* Detalle de puntos */
.pn-next{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:center;margin-top:14px;padding:12px;border-radius:16px;background:var(--surface-2)}
.pn-next > span:last-child{display:grid;gap:2px}
.pn-next b{font-size:14.5px}
.pn-next span span{font-size:12.5px;color:var(--muted)}
.ways em{font-style:normal;color:var(--faint)}
/* Resumen visual */
.sum-card{display:grid;gap:14px}
.sum-top{display:grid;grid-template-columns:118px 1fr;gap:14px;align-items:center}
.sum-g{display:grid;justify-items:center}
.sum-g svg{width:118px;height:auto;display:block}
.sum-g > span{font-size:11px;color:var(--faint);margin-top:-4px}
.sg-arc{animation:sgIn 1.2s cubic-bezier(.22,1,.36,1) both}
@keyframes sgIn{from{stroke-dasharray:0 var(--l)}}
.sum-tx h3{font-size:22px;margin-top:4px;line-height:1.15}
.sum-tx p{font-size:13.5px;color:var(--muted);margin-top:4px;line-height:1.4}
.sum-items{display:grid;gap:8px}
.si{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;padding:10px 12px;border-radius:16px;background:var(--surface-2)}
.si-ic{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--tc) 18%,transparent);color:var(--tc)}
.si-ic svg{width:17px;height:17px}
.si-t b{display:block;font-size:14px}
.si-t em{display:block;font-style:normal;font-size:12.5px;color:var(--muted);line-height:1.35;margin-top:1px}
.si-v{font-size:12px;font-weight:800;padding:5px 9px;border-radius:99px;color:var(--tc);background:color-mix(in srgb,var(--tc) 16%,transparent);white-space:nowrap}
.si.tone-ok{--tc:var(--ok)}.si.tone-warn{--tc:var(--gold)}.si.tone-bad{--tc:var(--alert)}
.sum-do{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:center;padding:12px;border-radius:16px;border:1px dashed color-mix(in srgb,var(--dawn) 50%,transparent);background:color-mix(in srgb,var(--dawn) 8%,transparent)}
.sum-do > span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--dawn) 22%,transparent);color:var(--dawn)}
.sum-do svg{width:16px;height:16px}
.sum-do p{font-size:14px;line-height:1.4}
/* Mapa del camino */
.path-mini{display:block;width:100%;text-align:left;margin-top:12px;padding:12px 16px 26px;border-radius:18px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);color:var(--fg)}
.pm-h{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--muted)}
.pm-h b{color:var(--fg)}
.pm-more{color:var(--dawn);font-weight:700;white-space:nowrap}
.pm-track{position:relative;height:6px;margin:16px 8px 0;border-radius:99px;background:var(--tick-off)}
.pm-fill{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,var(--dusk),var(--dawn))}
.pm-node{position:absolute;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--surface);border:2px solid var(--tick-off)}
.pm-node.on{border-color:var(--dawn);background:var(--dawn)}
.pm-me{position:absolute;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:var(--fg);box-shadow:0 0 0 4px color-mix(in srgb,var(--dawn) 35%,transparent);animation:meP 2.4s ease-in-out infinite}
.pm-me em{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font-style:normal;font-size:10.5px;font-weight:800;padding:2px 7px;border-radius:99px;background:var(--fg);color:var(--bg);white-space:nowrap}
@keyframes meP{0%,100%{box-shadow:0 0 0 4px color-mix(in srgb,var(--dawn) 35%,transparent)}50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--dawn) 15%,transparent)}}
.pm-lbl{position:relative;margin:0 8px;height:0}
.pm-lbl span{position:absolute;top:8px;transform:translateX(-50%);font-size:10.5px;color:var(--faint);font-weight:600;white-space:nowrap}
.pm-lbl span:first-child{transform:none;margin-left:-6px}
.pm-lbl span:last-child{transform:translateX(-80%)}
.pp-got{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}
.pp-got div{display:grid;justify-items:center;gap:2px;padding:10px 4px;border-radius:14px;background:var(--surface-2);text-align:center}
.pp-got b{font-family:var(--f-display);font-size:22px;font-weight:450}
.pp-got span{font-size:11px;color:var(--muted);line-height:1.2}
.pp-list{position:relative;display:grid;gap:4px;margin-top:18px}
.pp-it{display:grid;grid-template-columns:32px 1fr;gap:12px;position:relative;padding-bottom:14px}
.pp-it:not(:last-child)::before{content:"";position:absolute;left:15px;top:34px;bottom:0;width:2px;background:var(--tick-off)}
.pp-it.done:not(:last-child)::before{background:var(--dawn)}
.pp-n{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:14px;background:var(--surface-2);color:var(--muted);border:2px solid var(--tick-off)}
.pp-n svg{width:15px;height:15px}
.pp-it.done .pp-n{background:var(--dawn);border-color:var(--dawn);color:var(--dawn-ink)}
.pp-it.now .pp-n{background:var(--fg);border-color:var(--fg);color:var(--bg);box-shadow:0 0 0 5px color-mix(in srgb,var(--dawn) 30%,transparent)}
.pp-c{padding-top:4px}
.pp-h{display:flex;align-items:center;gap:8px}
.pp-h b{font-size:16px}
.pp-h em{font-style:normal;font-size:11px;font-weight:800;padding:2px 8px;border-radius:99px;background:var(--surface-2);color:var(--muted)}
.pp-it.now .pp-h em{background:var(--dawn);color:var(--dawn-ink)}
.pp-it.done .pp-h em{color:var(--ok)}
.pp-d{display:block;font-size:12px;color:var(--faint);margin-top:2px}
.pp-c p{font-size:13.5px;color:var(--muted);line-height:1.45;margin-top:6px}
.pp-c .pp-do{color:var(--fg)}
.pp-it.next .pp-c{opacity:.75}
.pp-bar{height:6px;border-radius:99px;background:var(--tick-off);margin-top:10px;overflow:hidden}
.pp-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--dusk),var(--dawn))}

.pm-h{align-items:baseline}
.pm-h b{font-size:15px}
.pm-sub{display:block;font-size:13px;color:var(--muted);margin-top:2px}
.pm-track{margin-top:30px!important}
/* ===================== v21 ===================== */
.modes{grid-template-columns:repeat(2,1fr)!important}
.tick-ic{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.wc-d i .tick-ic{width:17px;height:17px;stroke:var(--dawn-ink)}
/* Datos bloqueados: mucho más borrosos */
.hid{filter:blur(9px)!important;opacity:.75;background:none!important}
.mt.is-locked .mt-v,.mt.is-locked .mt-s{position:relative}
.mt.is-locked .mt-v::after{content:"";position:absolute;inset:-4px -6px;border-radius:10px;background:linear-gradient(90deg,color-mix(in srgb,var(--surface) 30%,transparent),color-mix(in srgb,var(--surface) 70%,transparent));backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
/* Trofeos con puntos */
.b-pts{display:block;font-style:normal;font-size:10.5px;font-weight:800;color:var(--gold);margin-top:-2px}
.badge.off .b-pts{color:var(--faint)}
.tr-val{text-align:center;font-size:14px;color:var(--gold);margin-top:6px}
/* Arriba: SOS redondo y más grande */
.sos-round{position:relative;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#FF7A6E,#D93A3A 60%,#A82424);color:#fff;font-weight:900;font-size:11px;letter-spacing:.06em;box-shadow:0 6px 18px -6px rgba(217,58,58,.9),inset 0 1px 2px rgba(255,255,255,.35)}
.sos-round::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(217,58,58,.7);animation:sosRing 2.6s ease-out infinite}
@keyframes sosRing{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.45);opacity:0}}
.sos-round:active{transform:scale(.92)}
.chip.flame{cursor:pointer}
/* SOS: pantalla de inicio */
.sos-intro{display:flex;flex-direction:column;gap:14px;min-height:100%}
.si-hero{display:grid;place-items:center;margin:10px 0 4px}
.si-orb{width:120px;height:120px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#FF7A6E,#D93A3A 60%,#A82424);box-shadow:0 0 0 14px rgba(217,58,58,.12),0 0 0 28px rgba(217,58,58,.06);animation:siBreath 4s ease-in-out infinite}
.si-orb span{color:#fff;font-weight:900;font-size:26px;letter-spacing:.08em}
@keyframes siBreath{0%,100%{transform:scale(.94)}50%{transform:scale(1.04)}}
.si-steps{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:6px}
.si-steps div{display:grid;grid-template-columns:26px 1fr;gap:8px;align-items:start;padding:12px;border-radius:16px;background:var(--surface-2)}
.si-steps b{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--dawn);color:var(--dawn-ink);font-size:13px}
.si-steps span{font-size:12.5px;color:var(--muted);line-height:1.35}
.si-steps em{display:block;font-style:normal;font-weight:700;font-size:14px;color:var(--fg)}
.si-actions{margin-top:auto;display:grid;gap:10px;padding-top:14px}
/* Racha y hábito */
.sk-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:14px}
.sk-grid span{display:grid;justify-items:center;gap:3px}
.sk-grid i{width:100%;aspect-ratio:1;border-radius:10px;display:grid;place-items:center;background:var(--tick-off);color:var(--dawn-ink)}
.sk-grid .on i{background:var(--dawn)}
.sk-grid .today i{box-shadow:inset 0 0 0 2px var(--dawn)}
.sk-grid em{font-style:normal;font-size:10.5px;color:var(--faint)}
.str-link{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:14px;padding:12px 14px;border-radius:14px;background:var(--surface-2);color:var(--fg);font-size:14px;text-align:left}
.hi-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.hi-row div{display:grid;justify-items:center;gap:2px;padding:12px 6px;border-radius:14px;background:var(--surface-2)}
.hi-row b{font-size:17px}
.hi-row span{font-size:11.5px;color:var(--muted)}
/* Mapa: fecha concreta */
.pm-h b{font-size:15.5px;line-height:1.3}
.pm-sub{display:flex!important;justify-content:space-between;gap:8px}
.pm-sub .pm-more{font-style:normal}
/* Oferta arriba y mejor explicada */
.of-strip{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;width:100%;margin-top:10px;padding:10px 12px;border-radius:16px;background:linear-gradient(90deg,color-mix(in srgb,#D93A3A 22%,var(--surface)),color-mix(in srgb,var(--ok) 14%,var(--surface)));border:1px solid color-mix(in srgb,#D93A3A 45%,transparent);color:var(--fg);text-align:left;box-shadow:var(--shadow)}
.ofs-tag{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ok)}
.ofs-tag svg{width:14px;height:14px}
.ofs-t{font-size:13.5px}
.ofs-time{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:99px;background:#D93A3A;color:#fff;animation:urgPulse 1.6s ease-in-out infinite}
.ofs-time svg{width:13px;height:13px;stroke:#fff;fill:none}
.ofs-time b{font-family:var(--f-mono);font-size:13px}
.of-how{display:grid;gap:8px;margin-top:6px}
.ofh{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:start;padding:12px;border-radius:14px;background:var(--surface)}
.ofh > span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--ok);color:#062014;font-weight:800;font-size:13px}
.ofh p{font-size:14px;line-height:1.45;color:var(--muted)}
.ofh b{color:var(--fg)}
/* Escudo */
.sh-card .sh-ic{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--sky) 18%,transparent);color:var(--sky)}
.sh-card .sh-ic svg{width:21px;height:21px}
.sh-demo{display:grid;place-items:center;margin:14px 0 10px}
.shd-phone{width:180px;padding:18px 14px;border-radius:26px;background:linear-gradient(170deg,#1b2440,#0e1322);border:1px solid rgba(255,255,255,.12);display:grid;justify-items:center;gap:8px;text-align:center;color:#fff}
.shd-ring{width:54px;height:54px;border-radius:50%;border:2px solid rgba(134,182,218,.5);display:grid;place-items:center;animation:siBreath 4s ease-in-out infinite}
.shd-ring i{width:26px;height:26px;border-radius:50%;background:#86B6DA}
.shd-phone b{font-size:15px}
.shd-phone span{font-size:11.5px;color:rgba(255,255,255,.75);line-height:1.35}
.shd-phone em{font-style:normal;font-size:10.5px;color:rgba(255,255,255,.5)}
.sh-note{font-weight:600;color:var(--faint);text-transform:none;letter-spacing:0}
.sh-pro{font-size:11px;color:var(--gold);font-weight:800;margin-left:6px;text-transform:none;letter-spacing:0}
.sh-pro svg{width:12px;height:12px}
.chips button.lk{opacity:.6}
.shp{display:flex;flex-direction:column;gap:14px;min-height:100%;justify-content:center}
.shp-ring{position:relative;width:150px;height:150px;margin:10px auto;border-radius:50%;display:grid;place-items:center;border:2px solid rgba(134,182,218,.45)}
.shp-ring i{position:absolute;inset:18px;border-radius:50%;background:radial-gradient(circle,#86B6DA,#3E6FB8);animation:shpB 8s ease-in-out infinite}
.shp-ring b{position:relative;font-size:40px;color:#fff;font-weight:300}
@keyframes shpB{0%,100%{transform:scale(.6)}50%{transform:scale(1)}}

.of-strip{grid-template-columns:1fr auto!important}
.ofs-l{display:grid;gap:2px;min-width:0}
.ofs-t{font-size:14px}
.ofs-t s{color:var(--muted);font-size:12px;margin-left:4px}

/* ===== v22 · grado de adicción, resultado, cerebro, SOS ===== */
.in-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:20px}
.in-steps div{display:grid;justify-items:center;text-align:center;gap:6px;padding:12px 6px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.in-steps b{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--dawn);color:var(--dawn-ink);font-size:13px}
.in-steps span{font-size:11.5px;color:var(--muted);line-height:1.3}
.in-steps em{display:block;font-style:normal;font-weight:700;font-size:13px;color:var(--fg);margin-bottom:2px}
.q-hab{align-self:flex-start;justify-self:start;width:max-content;max-width:100%;display:inline-flex;align-items:center;gap:6px;margin-top:28px;padding:6px 12px;border-radius:99px;font-size:13px;font-weight:700;background:color-mix(in srgb,var(--hc) 18%,transparent);color:var(--fg);border:1px solid color-mix(in srgb,var(--hc) 45%,transparent);animation:rise .4s cubic-bezier(.22,1,.36,1) both}
.q-hab em{font-style:normal;font-weight:600;font-size:11.5px;color:var(--muted);margin-left:4px}
.q-hab + .quiz-q{margin-top:12px}
.dg-svg{display:block;width:100%;max-width:280px;margin:0 auto;overflow:visible}
.dg-mk{transform-origin:120px 116px;animation:dgIn 1.3s .2s cubic-bezier(.22,1,.36,1) both}
.dg-mk.scan{animation:dgScan 2.6s ease-in-out infinite alternate}
@keyframes dgIn{from{transform:rotate(calc(-1 * var(--a)))}to{transform:rotate(0)}}
@keyframes dgScan{from{transform:rotate(8deg)}to{transform:rotate(172deg)}}
.dg-num{font-family:var(--f-display);font-size:46px;font-weight:400;letter-spacing:-.04em}
.dg-of{font-size:12px;font-weight:600}
.dg-lbl{display:grid;grid-template-columns:repeat(4,1fr);max-width:280px;margin:6px auto 0;gap:4px}
.dg-lbl span{display:flex;align-items:center;justify-content:center;gap:5px;font-size:11.5px;font-weight:700;color:var(--muted)}
.dg-lbl span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--c)}
.dg-hero{margin:18px 0 0}.dg-hero .dg-svg{max-width:230px}.dg-hero .dg-lbl{max-width:260px}
.deg-eb{display:flex;justify-content:center;margin-top:14px}
.deg-t{margin-top:8px}
.deg .ob-lead b{color:var(--fg)}
.deg-multi{display:grid;grid-template-columns:18px 1fr;gap:10px;align-items:start;margin-top:16px;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--sky) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--sky) 30%,transparent);font-size:13.5px;line-height:1.4}
.deg-multi svg{width:18px;height:18px;color:var(--sky);margin-top:1px}
.deg-track{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:22px}
.deg-track > i{width:26px;height:2px;border-radius:2px;background:var(--line-2)}
.deg-track div{display:grid;justify-items:center;gap:6px}
.deg-track b{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:13px;background:var(--surface-2);color:var(--muted);border:1.5px solid var(--line-2)}
.deg-track b svg{width:14px;height:14px;stroke:currentColor;stroke-width:3;fill:none}
.deg-track span{font-size:11.5px;font-weight:700;color:var(--muted)}
.deg-track .ok b{background:var(--ok);border-color:var(--ok);color:#06140d}
.deg-track .now b{background:var(--dawn);border-color:var(--dawn);color:var(--dawn-ink);box-shadow:0 0 0 5px color-mix(in srgb,var(--dawn) 22%,transparent)}
.deg-track .now span{color:var(--fg)}
.an-bars{grid-template-columns:repeat(4,1fr);row-gap:12px}
.an-bars i{height:30px}
/* Resultado */
.rs .eyebrow.center{display:flex;justify-content:center;margin-top:18px}
.rs-t{margin-top:8px;font-size:32px}
.rs-t em{font-style:normal}
.rs-gauge{margin:18px 0 4px}
.rs-habs{display:grid;gap:8px;margin-top:16px}
.rs-habs > div{display:grid;grid-template-columns:34px 1fr 90px;gap:10px;align-items:center;padding:10px 12px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.rs-he{font-size:22px;text-align:center}
.rs-hn b{display:block;font-size:14px}
.rs-hn em{font-style:normal;font-size:12px;font-weight:700;color:var(--c)}
.rs-hb{height:8px;border-radius:9px;background:var(--tick-off);overflow:hidden}
.rs-hb i{display:block;height:100%;border-radius:9px;background:var(--c)}
.rs .ob-lead.center{text-align:center}
.rs-leg{margin-top:14px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.rs-leg summary{list-style:none;cursor:pointer;padding:13px 16px;font-size:14px;font-weight:700;display:flex;justify-content:space-between;align-items:center}
.rs-leg summary::-webkit-details-marker{display:none}
.rs-leg summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg) translateY(-3px);transition:transform .25s}
.rs-leg[open] summary::after{transform:rotate(-135deg) translate(-2px,0)}
.rs-leg .lvl-legend{padding:0 10px 10px}
.rs-find{display:grid;gap:8px}
.rs-find > div{display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:start;padding:13px 14px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.rs-fi{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--dawn) 16%,transparent);color:var(--dawn)}
.rs-fi svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.9}
.rs-find b{display:block;font-size:14.5px}
.rs-find > div > div > span{display:block;font-size:13px;color:var(--muted);margin-top:2px;line-height:1.4}
.rs-goal{display:grid;gap:4px;margin-top:22px;padding:16px 18px;border-radius:20px;background:linear-gradient(135deg,color-mix(in srgb,var(--ok) 18%,var(--surface)),var(--surface));border:1px solid color-mix(in srgb,var(--ok) 35%,transparent)}
.rs-goal .eyebrow{color:var(--ok)}
.rs-goal .eyebrow svg{width:14px;height:14px}
.rs-goal b{font-family:var(--f-display);font-weight:400;font-size:21px;letter-spacing:-.02em;line-height:1.2}
.rs-goal > span:last-child{font-size:13px;color:var(--muted)}
.rs-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.rs-stats div{display:grid;justify-items:center;gap:2px;padding:12px 6px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.rs-stats b{font-size:20px;font-weight:700}
.rs-stats span{font-size:11.5px;color:var(--muted);font-weight:600}
.rs-bar{display:flex;gap:4px;margin-top:16px;height:10px}
.rs-bar i{display:block;border-radius:6px;transform-origin:left;animation:rsBar .8s cubic-bezier(.22,1,.36,1) both}
.rs-bar i:nth-child(2){animation-delay:.15s}.rs-bar i:nth-child(3){animation-delay:.3s}
@keyframes rsBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.rs-bar-l{display:grid;grid-template-columns:14fr 31fr 45fr auto;margin-top:6px;font-size:11px;font-weight:700;color:var(--muted)}
.rs-tl{position:relative;display:grid;gap:12px;margin-top:16px}
.rs-tl::before{content:"";position:absolute;left:17px;top:18px;bottom:18px;width:2px;background:linear-gradient(var(--alert),var(--dawn),var(--ok));opacity:.5;border-radius:2px}
.rs-ph{position:relative;display:grid;grid-template-columns:36px 1fr;gap:12px}
.rs-dot b{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--pc);color:#140c06;font-size:15px;box-shadow:0 0 0 5px var(--bg)}
.rs-pb{padding:14px 15px;border-radius:18px;background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--pc)}
.rs-pd{display:block;font-size:11.5px;font-weight:800;letter-spacing:.03em;color:var(--pc);text-transform:uppercase}
.rs-pn{display:block;font-size:18px;margin-top:3px}
.rs-pb p{font-size:13.5px;color:var(--muted);line-height:1.45;margin-top:4px}
.rs-pb ul{list-style:none;display:grid;gap:8px;margin-top:12px;padding:0}
.rs-pb li{display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:start}
.rs-pb li > span{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb,var(--pc) 16%,transparent);color:var(--pc)}
.rs-pb li > span svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.rs-pb li em{font-style:normal;font-size:13.5px;line-height:1.4;padding-top:3px}
.rs-pb li small{display:inline-block;font-size:10.5px;font-weight:800;padding:1px 7px;border-radius:99px;background:var(--surface-2);color:var(--muted);margin-left:2px;vertical-align:1px}
.rs-daily{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rs-daily > div{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:center;padding:12px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.rs-daily b{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--dawn);color:var(--dawn-ink);font-size:14px}
.rs-daily span{font-size:12px;color:var(--muted)}
.rs-daily em{display:block;font-style:normal;font-size:14px;font-weight:700;color:var(--fg)}
.rs-tools{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rs-tools > div{display:grid;align-content:start;gap:4px;padding:13px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.rs-tools span{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--sky) 16%,transparent);color:var(--sky);margin-bottom:4px}
.rs-tools span svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.9}
.rs-tools b{font-size:14px}
.rs-tools em{font-style:normal;font-size:12px;color:var(--muted);line-height:1.35}
/* Tutorial: reprogramar el cerebro */
.rp-wrap{width:100%}
.rp-art{display:block;width:100%;max-width:240px;height:auto;margin:0 auto;overflow:visible}
.rp-new{stroke-dasharray:1;stroke-dashoffset:1;animation:rpDraw 1.9s .3s cubic-bezier(.45,0,.2,1) forwards}
@keyframes rpDraw{to{stroke-dashoffset:0}}
.rp-old{animation:rpFade 2.4s .2s ease both}
@keyframes rpFade{from{opacity:1}to{opacity:.3}}
.rp-n{transform-box:fill-box;transform-origin:center;animation:rpPop .5s cubic-bezier(.3,1.6,.5,1) both}
@keyframes rpPop{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
.rp-leg{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 12px;margin-top:6px}
.tut-visual:has(.rp-wrap){padding:16px 14px}
.rp-leg span{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--muted)}
.rp-leg i{width:20px;height:4px;border-radius:3px}
.rp-leg i.old{background:repeating-linear-gradient(90deg,var(--alert) 0 4px,transparent 4px 8px)}
.rp-leg i.new{background:linear-gradient(90deg,var(--dawn),var(--gold),var(--ok))}
/* SOS: títulos centrados */
.sos2 .sos-title,.sos2 .sos-sub{margin-left:auto;margin-right:auto;text-align:center}
.sos-intro .si-title{max-width:16ch}
.sos-intro .si-sub{max-width:34ch;font-size:15.5px;line-height:1.5}
.si-how{display:grid;gap:2px;text-align:center;margin-top:4px}
.si-how b{font-size:15px}
.si-how span{font-size:13px;color:var(--muted)}
.si-steps{grid-template-columns:1fr 1fr}
.si-steps div{padding:11px}

/* ===== v23 · compositor, títulos centrados, guías, test ===== */
.composer-slot{bottom:calc(112px + env(safe-area-inset-bottom,0px))}
.app.in-faro .screen{padding-bottom:280px}
.sos .sos-title,.sos .sos-sub,.shp .sos-title,.shp .sos-sub{margin-left:auto;margin-right:auto;text-align:center}
.shp{align-items:center;text-align:center}
.shp .si-actions{width:100%}
/* Lector de guías */
.gx-ov{background:var(--bg)}
.gx{position:relative;min-height:100%;padding:0 18px calc(40px + env(safe-area-inset-bottom,0px))}
.gx-bar{position:sticky;top:0;z-index:5;display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;margin:0 -18px;padding:calc(env(safe-area-inset-top,0px) + 14px) 18px 12px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border-bottom:1px solid var(--line)}
.gx-bar .close-x{position:static;width:40px;height:40px}
.gx-prog{height:6px;border-radius:9px;background:var(--tick-off);overflow:hidden}
.gx-prog i{display:block;height:100%;background:var(--gc);transform-origin:left;transform:scaleX(0);border-radius:9px}
.gx-pct{font-size:12px;font-weight:700;color:var(--muted);min-width:34px;text-align:right}
.gx-hero{display:grid;justify-items:center;text-align:center;gap:8px;padding:28px 6px 6px}
.gx-ic{width:76px;height:76px;border-radius:24px;display:grid;place-items:center;color:var(--gc);background:radial-gradient(120% 120% at 30% 20%,color-mix(in srgb,var(--gc) 34%,transparent),color-mix(in srgb,var(--gc) 10%,transparent));border:1px solid color-mix(in srgb,var(--gc) 40%,transparent);box-shadow:0 14px 40px -12px color-mix(in srgb,var(--gc) 60%,transparent)}
.gx-ic svg{width:36px;height:36px;stroke:currentColor;fill:none;stroke-width:1.7}
.gx-eb{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gc);margin-top:8px}
.gx-hero h1{font-family:var(--f-display);font-weight:400;font-size:34px;letter-spacing:-.04em;line-height:1.05;max-width:16ch;margin:0 auto;text-wrap:balance}
.gx-hero p{font-size:15.5px;color:var(--muted);line-height:1.45;max-width:32ch;margin:2px auto 0}
.gx-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:8px}
.gx-meta span{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:99px;background:var(--surface);border:1px solid var(--line);font-size:12.5px;font-weight:700;color:var(--muted)}
.gx-meta svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.gx-tldr{margin-top:22px;padding:16px 16px 14px;border-radius:20px;background:linear-gradient(140deg,color-mix(in srgb,var(--gc) 16%,var(--surface)),var(--surface));border:1px solid color-mix(in srgb,var(--gc) 30%,var(--line))}
.gx-tldr > em{display:flex;align-items:center;gap:6px;font-style:normal;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gc)}
.gx-tldr > em svg{width:14px;height:14px}
.gx-tldr ul{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:9px}
.gx-tldr li{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-size:15px;line-height:1.4;font-weight:600}
.gx-tldr li .tick-ic{width:22px;height:22px;padding:4px;border-radius:50%;background:var(--gc);stroke:var(--bg);stroke-width:3.2;fill:none}
.gx-toc{display:grid;gap:6px;margin-top:16px;padding:14px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
.gx-toc > em{font-style:normal;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 2px 4px}
.gx-toc button{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;text-align:left;padding:8px 4px;border-radius:12px;font-size:14.5px;font-weight:600;color:var(--fg)}
.gx-toc button b{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font-size:13px;background:color-mix(in srgb,var(--gc) 16%,transparent);color:var(--gc)}
.gx-toc button i{font-style:normal;color:var(--muted);font-size:18px}
.gx-sec{margin-top:34px;scroll-margin-top:calc(env(safe-area-inset-top,0px) + 80px)}
.gx-sh{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.gx-sh b{flex:none;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:var(--gc);color:var(--bg);font-size:15px}
.gx-sh b svg{width:16px;height:16px;stroke:currentColor;stroke-width:3;fill:none}
.gx-sh h2{font-family:var(--f-display);font-weight:400;font-size:25px;letter-spacing:-.03em;line-height:1.1}
.gx-body{display:grid;gap:12px}
.gx-body > p{font-size:15.5px;line-height:1.55;color:color-mix(in srgb,var(--fg) 88%,var(--muted))}
.gx-body > p b{color:var(--fg)}
.gx-body h4{font-size:16.5px;font-weight:700;margin-top:6px}
.gx-body > ul,.gx-body > ol{margin:0;padding-left:22px;display:grid;gap:8px;font-size:15px;line-height:1.5}
.gx-body li::marker{color:var(--gc);font-weight:800}
.gx-body .g-key{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--gc) 10%,transparent);border-left:3px solid var(--gc);font-weight:700;font-size:14.5px;line-height:1.4;color:var(--fg)}
/* Componentes */
.g-steps{display:grid;gap:8px;counter-reset:gs}
.g-steps > div{display:grid;grid-template-columns:32px 1fr;gap:12px;align-items:start;padding:13px 14px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.g-steps > div > b{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--gc) 18%,transparent);color:var(--gc);font-size:14px;font-weight:800}
.g-steps em{display:block;font-style:normal;font-weight:700;font-size:15px;line-height:1.3}
.g-steps p{font-size:14px;color:var(--muted);line-height:1.45;margin-top:3px}
.g-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.g-grid > div{display:grid;align-content:start;gap:4px;padding:13px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.g-grid i{font-style:normal;font-size:24px;line-height:1;margin-bottom:4px}
.g-grid em{font-style:normal;font-weight:700;font-size:14px;line-height:1.25}
.g-grid p{font-size:12.5px;color:var(--muted);line-height:1.4}
.g-tip,.g-warn{display:grid;gap:4px;padding:14px 15px;border-radius:16px}
.g-tip{background:color-mix(in srgb,var(--ok) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--ok) 32%,transparent)}
.g-warn{background:color-mix(in srgb,var(--alert) 11%,var(--surface));border:1px solid color-mix(in srgb,var(--alert) 32%,transparent)}
.g-tip em,.g-warn em{display:inline-flex;align-items:center;gap:6px;font-style:normal;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.g-tip em{color:var(--ok)}.g-warn em{color:var(--alert)}
.g-tip em::before{content:"💡";font-size:14px}.g-warn em::before{content:"⚠️";font-size:13px}
.g-tip p,.g-warn p{font-size:14.5px;line-height:1.45}
.g-vs{display:grid;grid-template-columns:1fr 1fr;gap:6px;position:relative}
.g-vs > div{padding:12px 13px;border-radius:16px}
.g-vs .bad{background:color-mix(in srgb,var(--alert) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--alert) 26%,transparent)}
.g-vs .good{background:color-mix(in srgb,var(--ok) 11%,var(--surface));border:1px solid color-mix(in srgb,var(--ok) 30%,transparent)}
.g-vs em{display:flex;align-items:center;gap:5px;font-style:normal;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.g-vs .bad em{color:var(--alert)}.g-vs .good em{color:var(--ok)}
.g-vs .bad em::before{content:"✕"}.g-vs .good em::before{content:"✓"}
.g-vs p{font-size:14px;line-height:1.4;margin-top:4px;font-weight:600}
.g-time{position:relative;display:grid;gap:10px;padding-left:22px}
.g-time::before{content:"";position:absolute;left:6px;top:8px;bottom:8px;width:2px;border-radius:2px;background:linear-gradient(var(--gc),color-mix(in srgb,var(--gc) 20%,transparent))}
.g-time > div{position:relative;padding:11px 13px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.g-time > div::before{content:"";position:absolute;left:-21px;top:15px;width:12px;height:12px;border-radius:50%;background:var(--bg);border:3px solid var(--gc)}
.g-time span{display:block;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--gc)}
.g-time p{font-size:14px;line-height:1.45;margin-top:2px}
.g-say{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:14px 14px 14px 16px;border-radius:16px;background:var(--surface-2);border:1px dashed color-mix(in srgb,var(--gc) 50%,var(--line-2))}
.g-say p{font-family:var(--f-display);font-size:17px;line-height:1.35;letter-spacing:-.01em}
.g-copy{display:inline-flex;align-items:center;gap:5px;padding:8px 11px;border-radius:99px;background:var(--surface);border:1px solid var(--line-2);font-size:12px;font-weight:700;color:var(--fg)}
.g-copy svg{width:12px;height:12px;stroke:currentColor;stroke-width:3;fill:none}
.g-scale{display:grid;gap:9px;padding:14px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.g-scale > div{display:grid;grid-template-columns:minmax(0,1.1fr) 1fr;gap:12px;align-items:center}
.g-scale span{font-size:13px;font-weight:600;line-height:1.3}
.g-scale i{display:block;height:10px;border-radius:9px;background:var(--tick-off);position:relative;overflow:hidden}
.g-scale i::after{content:"";position:absolute;inset:0;width:var(--v);border-radius:9px;background:linear-gradient(90deg,color-mix(in srgb,var(--gc) 55%,transparent),var(--gc))}
.g-path{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:12px;border-radius:16px;background:var(--surface-2)}
.g-path span{display:inline-flex;align-items:center;padding:6px 10px;border-radius:10px;background:var(--surface);border:1px solid var(--line);font-size:12.5px;font-weight:700}
.g-path span + span::before{content:"›";margin:0 6px 0 -2px;color:var(--gc);font-weight:900}
.g-path span:last-child{background:color-mix(in srgb,var(--gc) 16%,var(--surface));border-color:color-mix(in srgb,var(--gc) 40%,transparent)}
.g-cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;padding:12px 16px;border-radius:16px;background:var(--gc);color:var(--bg);font-weight:800;font-size:15px}
.g-cta::after{content:"›";font-size:20px;line-height:1}
.gx-body .phrase{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.gx-body .phrase p{font-size:14.5px}
#phrases{display:grid;gap:8px}
.gx-todo{margin-top:38px;padding:18px 16px;border-radius:22px;background:var(--surface);border:1px solid color-mix(in srgb,var(--gc) 30%,var(--line))}
.gx-todo > p{font-size:13.5px;color:var(--muted);margin:-4px 0 12px}
.gx-cks{display:grid;gap:8px}
.gx-ck{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:center;text-align:left;padding:12px;border-radius:14px;background:var(--surface-2);border:1.5px solid transparent;font-size:14.5px;line-height:1.35;font-weight:600;color:var(--fg);transition:background .2s,border-color .2s}
.gx-ck > span{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;border:2px solid var(--line-2);transition:all .2s}
.gx-ck .tick-ic{width:16px;height:16px;stroke:var(--bg);stroke-width:3.4;fill:none;opacity:0}
.gx-ck em{font-style:normal}
.gx-ck[aria-pressed="true"]{border-color:color-mix(in srgb,var(--ok) 45%,transparent);background:color-mix(in srgb,var(--ok) 10%,var(--surface-2))}
.gx-ck[aria-pressed="true"] > span{background:var(--ok);border-color:var(--ok)}
.gx-ck[aria-pressed="true"] .tick-ic{opacity:1}
.gx-ck[aria-pressed="true"] em{color:var(--muted);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--muted) 60%,transparent)}
.gx-done{display:flex;align-items:center;gap:10px;margin-top:12px;font-size:13px;font-weight:700;color:var(--muted)}
.gx-dbar{flex:1;height:8px;border-radius:9px;background:var(--tick-off);overflow:hidden;display:block}
.gx-dbar i{display:block;height:100%;border-radius:9px;background:var(--ok);transition:width .3s}
.gx-done > b{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--ok)}
.gx-done > b .tick-ic{width:18px;height:18px;stroke:#06140d;stroke-width:3.4;fill:none}
.gx-done em{display:block;font-style:normal;color:var(--fg);font-size:14.5px}
.gx-next{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;margin-top:14px;padding:16px;border-radius:20px;background:var(--surface);border:1px solid var(--line);text-align:left}
.gx-next em{display:block;font-style:normal;font-size:12px;font-weight:700;color:var(--muted)}
.gx-next b{font-size:16px}
.gx-next i{font-style:normal;font-size:22px;color:var(--gc)}
/* Lista de guías en Tú */
.gx-list{display:grid;gap:8px;margin-top:4px}
.gx-li{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;text-align:left;padding:10px 12px 10px 10px;border-radius:16px;background:var(--surface-2);border:1px solid var(--line)}
.gx-li-ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;color:var(--gc);background:color-mix(in srgb,var(--gc) 16%,transparent)}
.gx-li-ic svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8}
.gx-li-t b{display:block;font-size:14.5px;line-height:1.25}
.gx-li-t em{display:flex;align-items:center;gap:5px;font-style:normal;font-size:12.5px;color:var(--muted);line-height:1.3;margin-top:2px}
.gx-li-t em .tick-ic{width:13px;height:13px;stroke:var(--ok);stroke-width:3.2;fill:none}
.gx-li-t em svg{width:12px;height:12px;flex:none}
.gx-li.lk{opacity:.72}
.gx-li.lk .gx-li-ic{filter:grayscale(.6)}
/* Test: progreso por etapas */
.qsteps{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;align-self:center}
.qsteps > div{display:grid;gap:5px}
.qsteps > div > i{display:block;height:5px;border-radius:9px;background:var(--tick-off);overflow:hidden}
.qsteps > div > i > i{display:block;height:100%;border-radius:9px;background:var(--dawn);transform-origin:left;transition:transform .45s cubic-bezier(.22,1,.36,1)}
.qsteps > div.ok > i > i{background:var(--ok)}
.qsteps span{font-size:10px;font-weight:700;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qsteps .now span{color:var(--fg)}
.qsteps .ok span{color:var(--muted)}
.quiz-top{grid-template-columns:36px 1fr auto}
/* Test: cabecera de cada pregunta */
.qx-hero{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;margin-top:26px;padding:10px 14px 10px 10px;border-radius:18px;background:linear-gradient(120deg,color-mix(in srgb,var(--dawn) 14%,var(--surface)),var(--surface));border:1px solid color-mix(in srgb,var(--dawn) 26%,var(--line));animation:rise .4s cubic-bezier(.22,1,.36,1) both}
.qx-hero.alt{background:linear-gradient(120deg,color-mix(in srgb,var(--sky) 14%,var(--surface)),var(--surface));border-color:color-mix(in srgb,var(--sky) 26%,var(--line))}
.qx-ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--dawn);color:var(--dawn-ink);box-shadow:0 8px 20px -8px var(--dawn)}
.qx-hero.alt .qx-ic{background:var(--sky);color:#0b1a26;box-shadow:0 8px 20px -8px var(--sky)}
.qx-ic svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2}
.qx-t b{display:block;font-size:15px}
.qx-t em{display:block;font-style:normal;font-size:12.5px;color:var(--muted)}
.qx-n{font-size:12.5px;font-weight:800;color:var(--muted);padding:5px 9px;border-radius:99px;background:var(--surface-2)}
.qx-hab{display:inline-flex;align-self:flex-start;align-items:center;gap:7px;margin-top:10px;padding:6px 12px 6px 8px;border-radius:99px;font-size:13px;font-weight:700;background:color-mix(in srgb,var(--hc) 16%,transparent);border:1px solid color-mix(in srgb,var(--hc) 40%,transparent);width:max-content;max-width:100%}
.qx-hab > span{font-size:16px}
.qx-hab em{font-style:normal;font-weight:600;font-size:11.5px;color:var(--muted)}
.qx .quiz-q{margin-top:16px}
.qx-hero + .quiz-q{margin-top:18px}
.qx-opts{margin-top:20px}
.qx-opt{gap:14px}
.qx-o{flex:1}
.qx-pips{display:grid;grid-template-columns:repeat(4,5px);gap:3px;align-items:end;height:22px;flex:none}
.qx-pips i{display:block;width:5px;border-radius:3px;background:var(--tick-off)}
.qx-pips i:nth-child(1){height:7px}.qx-pips i:nth-child(2){height:11px}.qx-pips i:nth-child(3){height:16px}.qx-pips i:nth-child(4){height:22px}
.qx-pips i.on{background:var(--dawn)}
.qx-opt[aria-pressed="true"] .qx-pips i.on{background:var(--dawn);box-shadow:0 0 8px color-mix(in srgb,var(--dawn) 60%,transparent)}
.qx-opt:active{transform:scale(.985)}
.qx-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.qx-tile{position:relative;display:grid!important;justify-items:start;align-content:start;gap:8px;min-height:92px!important;padding:14px!important}
.qx-tile > i{font-style:normal;font-size:28px;line-height:1}
.qx-tile > span:not(.opt-dot){font-size:15px;font-weight:600;line-height:1.25}
.qx-tile .opt-dot{position:absolute;top:12px;right:12px;width:22px;height:22px}

/* ===== v24 · un botón principal, diario en 3 toques, día 1, fecha en el resultado ===== */
.gold-t{color:var(--gold)!important;border-color:color-mix(in srgb,var(--gold) 40%,var(--line-2))!important}
.g-cta{background:color-mix(in srgb,var(--gc) 14%,var(--surface));color:var(--gc);border:1.5px solid color-mix(in srgb,var(--gc) 45%,transparent)}
.pw-dock{position:sticky;bottom:0;z-index:6;margin:18px -22px 0;padding:14px 22px calc(14px + env(safe-area-inset-bottom,0px));background:linear-gradient(to top,var(--bg) 70%,color-mix(in srgb,var(--bg) 0%,transparent))}
.pw-dock .pw-cta{margin:0;width:100%}
.rs-start{display:grid;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--ok) 25%,var(--line))}
.rs-start em{font-style:normal;font-size:13px;font-weight:700;color:var(--fg)}
.rs-start .chips{margin:0}
.rs-start .chips button svg{width:14px;height:14px;vertical-align:-2px}
/* Diario rápido */
.qd-q{margin-top:16px;padding:14px;border-radius:18px;background:var(--surface-2);border:1.5px solid transparent;transition:border-color .2s}
.qd-q.ok{border-color:color-mix(in srgb,var(--ok) 40%,transparent)}
.qd-q > b{display:flex;align-items:center;gap:9px;font-size:15px}
.qd-q > b i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;background:var(--dawn);color:var(--dawn-ink)}
.qd-q.ok > b i{background:var(--ok);color:#06140d}
.qd-moods{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:12px}
.qd-moods button{display:grid;justify-items:center;gap:6px;padding:10px 2px;border-radius:14px;background:var(--surface);border:1.5px solid var(--line);font-size:11.5px;font-weight:700;color:var(--muted)}
.qd-moods i{width:22px;height:22px;border-radius:50%;background:var(--mc);opacity:.75}
.qd-moods button[aria-pressed="true"]{border-color:var(--mc);color:var(--fg);background:color-mix(in srgb,var(--mc) 16%,var(--surface))}
.qd-moods button[aria-pressed="true"] i{opacity:1;box-shadow:0 0 0 4px color-mix(in srgb,var(--mc) 30%,transparent)}
.qd-urge{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:12px}
.qd-urge button{display:grid;justify-items:center;gap:6px;padding:10px 2px;border-radius:14px;background:var(--surface);border:1.5px solid var(--line);font-size:12px;font-weight:700;color:var(--muted)}
.qd-urge button[aria-pressed="true"]{border-color:var(--dawn);color:var(--fg);background:color-mix(in srgb,var(--dawn) 12%,var(--surface))}
.qd-mom{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:12px}
.qd-mom button{display:flex;align-items:center;gap:8px;padding:10px 11px;border-radius:13px;background:var(--surface);border:1.5px solid var(--line);font-size:13.5px;font-weight:600;text-align:left;color:var(--fg)}
.qd-mom em{font-style:normal;font-size:17px}
.qd-mom button[aria-pressed="true"]{border-color:var(--dawn);background:color-mix(in srgb,var(--dawn) 12%,var(--surface))}
.qd-add{margin-top:14px;font-weight:700}
.qd-note{display:grid;gap:8px;margin-top:16px}
.qd-note label{font-size:13.5px;font-weight:700;color:var(--muted)}
#qdBody .sheet-actions{display:grid;gap:10px;justify-items:center}
#qdBody .sheet-actions .btn{width:100%}
/* Día 1 guiado */
.d1-card{border-color:color-mix(in srgb,var(--dawn) 35%,var(--line));background:linear-gradient(150deg,color-mix(in srgb,var(--dawn) 10%,var(--surface)),var(--surface))}
.d1-h{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.d1-h h3{font-size:20px;margin-top:4px}
.d1-n{font-size:14px;font-weight:800;padding:6px 11px;border-radius:99px;background:var(--surface-2);color:var(--dawn)}
.d1-list{display:grid;gap:8px;margin-top:12px}
.d1-it{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;text-align:left;padding:11px 12px 11px 10px;border-radius:16px;background:var(--surface-2);border:1px solid var(--line);color:var(--fg)}
.d1-ic{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:color-mix(in srgb,var(--dawn) 16%,transparent);color:var(--dawn)}
.d1-ic svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.9}
.d1-it.ok .d1-ic{background:var(--ok);color:#06140d}
.d1-it.ok .d1-ic .tick-ic{width:20px;height:20px;stroke:#06140d;stroke-width:3.2}
.d1-tx b{display:block;font-size:14.5px}
.d1-tx em{display:block;font-style:normal;font-size:12.5px;color:var(--muted);margin-top:1px}
.d1-it.ok .d1-tx b{color:var(--muted);text-decoration:line-through}
.tr-say{--gc:var(--dawn)}

/* ===== v25 · medidor, Hoy en tarjetas, informe A4 ===== */
.dg-lbl{display:flex;justify-content:center;flex-wrap:nowrap;gap:12px;max-width:none}
.dg-lbl span{white-space:nowrap}
.dg-hero .dg-lbl{max-width:none}
/* Hoy más limpio */
.hx-hero .dial-wrap{width:min(100%,200px)!important}
.hx-hero .goal-ln{margin-top:6px}
.hoy2 .steps-card{margin-top:4px}
.hx-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hx-t{display:grid;align-content:start;gap:4px;text-align:left;padding:14px;border-radius:20px;background:var(--surface);border:1px solid var(--line);color:var(--fg);min-height:118px;transition:transform .15s}
.hx-t:active{transform:scale(.98)}
.hx-top{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.hx-ic{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:color-mix(in srgb,var(--hc) 16%,transparent);color:var(--hc)}
.hx-ic svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.hx-l{font-size:12.5px;font-weight:700;color:var(--muted)}
.hx-v{font-family:var(--f-display);font-weight:400;font-size:28px;letter-spacing:-.03em;line-height:1.05}
.hx-v small{font-family:var(--f-body);font-size:13px;font-weight:700;color:var(--muted);margin-left:3px;letter-spacing:0}
.hx-s{font-size:12.5px;color:var(--muted);line-height:1.3}
.hx-bar{display:block;height:6px;border-radius:9px;background:var(--tick-off);overflow:hidden;margin-top:6px}
.hx-bar i{display:block;height:100%;border-radius:9px}
.hx-dots{display:flex;gap:4px;margin-top:6px}
.hx-dots i{width:9px;height:9px;border-radius:50%;background:var(--tick-off)}
.hx-dots i.on{background:var(--gold)}
.hx-dots i.miss{background:color-mix(in srgb,var(--alert) 55%,transparent)}
.hx-sheet > .card,.hx-sheet > section{margin-top:12px}
.hx-sheet .card{box-shadow:none}
/* Informe A4 */
.rp-ov{background:var(--bg)}
.rp-wrap2{padding:0 16px calc(28px + env(safe-area-inset-bottom,0px))}
.rp-bar{position:sticky;top:0;z-index:4;display:grid;grid-template-columns:40px 1fr 40px;align-items:center;gap:10px;margin:0 -16px;padding:calc(env(safe-area-inset-top,0px) + 14px) 16px 12px;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);text-align:center}
.rp-bar .close-x{position:static}
.rp-intro{font-size:14.5px;color:var(--muted);line-height:1.45;margin:6px 0 12px}
.a4-doc{position:relative;margin-top:14px;overflow:hidden}
.a4-scale{position:absolute;top:0;left:0;width:794px;transform-origin:top left;display:grid;gap:18px}
.rp-actions{position:sticky;bottom:0;padding:14px 0 calc(6px + env(safe-area-inset-bottom,0px));background:linear-gradient(to top,var(--bg) 70%,transparent)}
.a4{width:794px;height:1123px;background:#fff;color:#1B1F2A;padding:48px 56px 40px;display:flex;flex-direction:column;gap:18px;font-family:var(--f-body);box-shadow:0 18px 50px -20px rgba(0,0,0,.55);border-radius:4px;position:relative;overflow:hidden}
.a4-h{display:flex;justify-content:space-between;align-items:center;padding-bottom:16px;border-bottom:2px solid #1B1F2A}
.a4-brand{display:flex;align-items:center;gap:12px}
.a4-logo{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#F4B183,#8C84B4);color:#fff;font-weight:800;font-size:15px}
.a4-brand b{display:block;font-size:18px;letter-spacing:-.01em}
.a4-brand span,.a4-meta span{display:block;font-size:11.5px;color:#6B7180;margin-top:1px}
.a4-meta{text-align:right}
.a4-meta b{font-size:13.5px}
.a4-title h1{font-family:var(--f-display);font-weight:400;font-size:30px;letter-spacing:-.03em;color:#1B1F2A}
.a4-title p{font-size:12px;color:#6B7180;margin-top:4px}
.a4-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.a4-kpi{padding:14px;border-radius:12px;background:#F6F7FA;border-top:4px solid var(--k)}
.a4-kpi b{display:block;font-size:26px;font-weight:700;letter-spacing:-.02em;color:#1B1F2A}
.a4-kpi span{display:block;font-size:11.5px;font-weight:700;color:#3C4250;margin-top:2px}
.a4-kpi em{display:block;font-style:normal;font-size:10.5px;color:#6B7180;margin-top:2px}
.a4-sec h2{font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#1B1F2A}
.a4-cap{font-size:10.5px;color:#8A8F9C;margin:2px 0 8px}
.a4-ch{display:block;width:100%;height:auto}
.a4-two{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.a4-leg{display:flex;gap:14px;margin:6px 0 8px;font-size:10.5px;color:#6B7180}
.a4-leg span{display:inline-flex;align-items:center;gap:5px}
.a4-leg i{width:10px;height:10px;border-radius:3px}
.rp-cal{display:grid;grid-template-columns:repeat(10,1fr);gap:5px}
.rp-cal div{padding:5px 4px;border-radius:6px;background:#EEF0F4;text-align:center}
.rp-cal div.ok{background:#DDF1E8}
.rp-cal div.rel{background:#F8DCDB}
.rp-cal b{display:block;font-size:11px;color:#1B1F2A}
.rp-cal span{display:block;font-size:8.5px;color:#6B7180}
.rp-hb{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:6px;align-items:end;height:120px;margin-top:4px}
.rp-hb div{display:grid;grid-template-rows:1fr auto auto;align-items:end;justify-items:center;height:100%;gap:2px}
.rp-hb i{display:block;width:70%;border-radius:4px 4px 2px 2px;background:#E8956B;align-self:end}
.rp-hb b{font-size:10px;color:#1B1F2A}
.rp-hb span{font-size:9.5px;color:#8A8F9C}
.rp-top{display:grid;gap:7px;margin-top:8px}
.rp-top div{display:grid;grid-template-columns:110px 1fr 24px;gap:8px;align-items:center;font-size:11.5px;color:#3C4250}
.rp-top i{display:block;height:8px;border-radius:9px;background:#EEF0F4;overflow:hidden}
.rp-top i i{height:100%;border-radius:9px}
.rp-top b{text-align:right;font-size:11px}
.rp-empty{font-size:11.5px;color:#8A8F9C;margin-top:8px}
.a4-obs ul{margin:8px 0 0;padding-left:18px;display:grid;gap:5px;font-size:12px;line-height:1.45;color:#3C4250}
.a4-obs b{color:#1B1F2A}
.a4-list{margin:8px 0 0;padding-left:18px;display:grid;gap:4px;font-size:11.5px;color:#3C4250;line-height:1.4}
.a4-notes div{margin-top:6px;font-size:11px;color:#3C4250}
.a4-notes b{font-size:11px;color:#1B1F2A}
.a4-sign{margin-top:auto}
.a4-sign span{display:block;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#6B7180;margin-bottom:6px}
.a4-sign i{display:block;height:22px;border-bottom:1px solid #D5D8E0}
.a4-f{display:flex;justify-content:space-between;gap:20px;padding-top:12px;border-top:1px solid #E6E8EE;font-size:9.5px;color:#8A8F9C;margin-top:auto}
.a4 .a4-sign + .a4-f{margin-top:12px}
@media print{
  @page{size:A4;margin:0}
  body.printing-a4 *{visibility:hidden!important}
  body.printing-a4 .a4-doc,body.printing-a4 .a4-doc *{visibility:visible!important}
  body.printing-a4 .a4-doc{position:fixed!important;left:0;top:0;height:auto!important;overflow:visible;margin:0}
  body.printing-a4 .a4-scale{position:static!important;transform:none!important;gap:0}
  body.printing-a4 .a4{box-shadow:none;border-radius:0;page-break-after:always;break-after:page}
}
.hx-hero{padding-top:4px}
.hx-hero .dial-wrap{width:min(100%,184px)!important;margin:0 auto}
.hx-streak{display:grid;gap:12px;justify-items:center;padding:16px 14px}
.hx-streak .clock{margin:0}
.hx-streak .goal-ln{margin:0;text-align:center}
.a4-brand .a4-logo{display:grid;place-items:center;width:40px;height:40px;margin:0;font-size:14px;color:#fff}
.a4-ph{display:flex;gap:8px;margin-top:10px}
.a4-ph > div{display:grid;gap:4px}
.a4-ph > div > i{display:block;height:10px;border-radius:9px;background:#EEF0F4;overflow:hidden}
.a4-ph > div > i > i{display:block;height:100%;background:var(--c);border-radius:9px}
.a4-ph b{font-size:11.5px;color:#1B1F2A}
.a4-ph span{font-size:10px;color:#8A8F9C}
.a4{padding:40px 52px 30px;gap:13px}
.a4-sec h2{font-size:12.5px}
.rp-cal{gap:4px}
.rp-cal div{padding:4px 3px}
.a4-two{gap:20px}

/* ===== v27 · portada animada ===== */
.cover{display:flex;flex-direction:column;min-height:100%}
.cover .brand-row{justify-content:center}
.cv-title{font-family:var(--f-display);font-size:34px;font-weight:350;letter-spacing:-.045em;line-height:1.06;text-align:center;margin-top:34px;text-wrap:balance;animation:rise .6s .05s cubic-bezier(.22,1,.36,1) both}
.cv-dial{position:relative;width:min(100%,290px);aspect-ratio:1;margin:14px auto 4px;animation:rise .7s .15s cubic-bezier(.22,1,.36,1) both}
.cv-dial svg{width:100%;height:100%;overflow:visible}
.cv-center{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.cv-center b{font-family:var(--f-display);font-size:88px;font-weight:300;letter-spacing:-.06em;line-height:.9;animation:cvNum 7s ease-in-out infinite}
.cv-center span{font-size:21px;font-weight:600;color:var(--muted);margin-top:6px;letter-spacing:-.01em}
.cv-sweep{animation:cvSweep 7s cubic-bezier(.5,.05,.3,1) infinite}
.cv-lit{animation:cvLit 7s ease infinite}
.cv-head{transform-box:view-box;transform-origin:160px 160px;animation:cvHead 7s cubic-bezier(.5,.05,.3,1) infinite}
.cv-headw{animation:cvHeadO 7s ease infinite}
.cv-head circle:last-child{filter:drop-shadow(0 0 6px var(--dawn))}
@keyframes cvSweep{0%{stroke-dashoffset:var(--cv-c,848.2)}62%,100%{stroke-dashoffset:0}}
@keyframes cvLit{0%,80%{opacity:1}94%,100%{opacity:0}}
@keyframes cvHead{0%{transform:rotate(0deg)}62%,100%{transform:rotate(360deg)}}
@keyframes cvHeadO{0%{opacity:0}5%,60%{opacity:1}70%,100%{opacity:0}}
@keyframes cvNum{0%,56%{color:var(--fg);text-shadow:none}66%{color:var(--dawn);text-shadow:0 0 30px color-mix(in srgb,var(--dawn) 50%,transparent)}86%,100%{color:var(--fg);text-shadow:none}}
.cover .ob-actions{margin-top:auto;padding-top:22px}
@media (prefers-reduced-motion:reduce){.cv-sweep{animation:none;stroke-dashoffset:0!important}.cv-lit,.cv-center b{animation:none}.cv-headw{animation:none;opacity:0}}

/* ===== v27 · SOS como el botón real ===== */
.sos-ic{display:inline-grid;place-items:center;width:1.5em;height:1.5em;border-radius:50%;vertical-align:.08em;background:radial-gradient(circle at 35% 30%,#FF7A6E,#D93A3A 60%,#A82424);color:#fff;font-family:var(--f-body);font-size:.42em;font-weight:900;letter-spacing:.06em;line-height:1;box-shadow:0 6px 16px -6px rgba(217,58,58,.9),inset 0 1px 2px rgba(255,255,255,.35)}
.tv-sos{display:grid;gap:14px;width:100%;max-width:300px;margin:0 auto}
.tvs-bar{display:flex;justify-content:flex-end;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
.tvs-btn{position:relative;width:46px;height:46px;font-size:12px}
.tvs-tap{position:absolute;right:-6px;bottom:-10px;width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.85);box-shadow:0 2px 8px rgba(0,0,0,.35);animation:tvsTap 2.4s ease-in-out infinite}
@keyframes tvsTap{0%,100%{transform:translate(18px,16px) scale(1);opacity:0}25%{opacity:1}45%{transform:translate(-14px,-12px) scale(1)}55%{transform:translate(-14px,-12px) scale(.75)}65%{transform:translate(-14px,-12px) scale(1);opacity:1}85%{opacity:0}}
.tvs-card{display:grid;justify-items:center;gap:4px;padding:16px;border-radius:20px;background:color-mix(in srgb,#D93A3A 10%,var(--surface));border:1px solid color-mix(in srgb,#D93A3A 30%,transparent);text-align:center}
.tvs-card .mono{font-size:10px;color:var(--muted)}
.tvs-card b{font-family:var(--f-display);font-size:44px;font-weight:300;letter-spacing:-.04em;line-height:1}
.tvs-card > span:last-child{font-size:13px;color:var(--muted)}

/* ===== v27 · confeti suave ===== */
.fx-pop{position:absolute;z-index:200;width:var(--s);height:var(--s);margin:calc(var(--s) / -2) 0 0 calc(var(--s) / -2);border-radius:50%;pointer-events:none;border:2px solid var(--dawn);animation:fxPop .65s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes fxPop{from{transform:scale(.55);opacity:.75}to{transform:scale(1.55);opacity:0}}
.fx-glow{position:absolute;inset:0;z-index:98;pointer-events:none;background:radial-gradient(60% 45% at 50% 55%,color-mix(in srgb,var(--dawn) 26%,transparent),transparent 70%);animation:fxGlow 1.2s ease-out forwards}
@keyframes fxGlow{0%{opacity:0}25%{opacity:1}100%{opacity:0}}

/* ===== v27 · Perfil y barra superior ===== */
.tl-r{gap:12px!important}
.comm-lock{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;text-align:left;width:100%}
.cl-ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:color-mix(in srgb,var(--sky) 16%,transparent);color:var(--sky)}
.cl-ic svg{width:22px;height:22px}
.cl-t b{display:block;font-size:15.5px}
.cl-t span{display:block;font-size:13px;color:var(--muted);margin-top:2px;line-height:1.4}
.st-pro{display:block;font-style:normal;font-size:12px;font-weight:700;color:var(--gold);margin-top:4px}
.ob-title .sos-ic{width:56px;height:56px;font-size:15px;vertical-align:4px}
.qx .quiz-q{margin-top:22px}

/* ===== v28 ===== */
.comm-wrap{display:contents}
.tl-r{gap:10px!important}
.tl-r .chip{height:30px;padding:0 10px;gap:5px}
.tl-r .chip svg{width:15px;height:15px}
.tro-chip{color:var(--gold);border-color:color-mix(in srgb,var(--gold) 40%,transparent)}
.pts-chip svg{color:var(--gold)}
/* Pro bloqueado: sin ver datos */
.lock-ph{display:grid;place-content:center;justify-items:center;gap:4px;width:100%;min-height:120px;border-radius:16px;text-align:center;color:var(--muted);background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--gold) 13%,transparent) 0 8px,color-mix(in srgb,var(--gold) 4%,transparent) 8px 16px);border:1px dashed color-mix(in srgb,var(--gold) 45%,transparent)}
.lock-ph .lp-ic{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--gold) 18%,var(--surface));color:var(--gold)}
.lock-ph .lp-ic svg{width:19px;height:19px}
.lock-ph b{color:var(--fg);font-size:14.5px}
.lock-ph > span:last-child{font-size:12.5px}
.hid{filter:none!important;opacity:1!important;color:transparent!important;text-shadow:none!important;border-radius:6px;padding:0 6px;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--gold) 26%,transparent) 0 5px,color-mix(in srgb,var(--gold) 9%,transparent) 5px 10px)!important}
.hid *{visibility:hidden}
.bar-hid{filter:none!important;opacity:1!important}
.bar.bar-hid i,.bar.bar-hid > *{width:100%!important;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--gold) 30%,transparent) 0 6px,color-mix(in srgb,var(--gold) 10%,transparent) 6px 12px)!important}
i.bar-hid{height:44px!important;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--gold) 30%,transparent) 0 6px,color-mix(in srgb,var(--gold) 10%,transparent) 6px 12px)!important}
/* Ticks del plan de acción */
.ap-list span svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.ap-list span svg path{fill:none}
/* Campo de fecha alineado */
input[type="date"].input{-webkit-appearance:none;appearance:none;display:block;width:100%;min-height:48px;text-align:left;line-height:normal}
input[type="date"].input::-webkit-date-and-time-value{text-align:left;margin:0}
input[type="date"].input::-webkit-datetime-edit{padding:0}
/* Gemas: el del medio destaca */
.gem-packs .pack.best{border-color:var(--gold)!important;background:color-mix(in srgb,var(--gold) 10%,var(--surface))!important;transform:translateY(-4px);box-shadow:0 10px 26px -14px color-mix(in srgb,var(--gold) 80%,transparent)}
.gem-packs .pack.best em{background:var(--gold)!important;color:#1A1405!important}
.gp-save{display:block;margin-top:4px;font-size:11.5px;font-weight:800;color:var(--ok)}
.ai-tip{display:block;margin:8px 0 2px;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,var(--gold) 11%,var(--surface));border:1px solid color-mix(in srgb,var(--gold) 32%,transparent);line-height:1.45}
.gem-packs .pack b.gp-save{font-size:11.5px!important;font-weight:800;line-height:1.2;color:var(--ok);margin-top:6px;letter-spacing:0}

/* ===== v29 ===== */
/* Lugar seguro: icono más grande */
.safe-line{gap:10px;padding-left:4px;padding-right:4px}
.safe-line svg{width:26px!important;height:26px!important;flex:0 0 26px;stroke-width:1.7}
/* Tienda de premios: botón blanco, texto negro */
.btn[data-act="rewards"],.lvl2 .lv2-more{background:#fff!important;color:#111!important;border:0!important;box-shadow:0 0 0 1px rgba(0,0,0,.10),0 8px 20px -10px rgba(0,0,0,.45)!important}
.btn[data-act="rewards"] svg{stroke:#111}
.lvl2 .lv2-more{display:block;margin-top:14px;padding:12px 16px;border-radius:999px;text-align:center}
/* En curso: en verde */
.phase.now .tagline .chip{color:var(--ok)!important;border-color:color-mix(in srgb,var(--ok) 45%,transparent)!important;background:color-mix(in srgb,var(--ok) 12%,transparent)!important}
/* Reloj: para qué es */
.hx-why{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;margin:0;font-size:14px;line-height:1.35;color:var(--muted);text-align:center;max-width:300px}
.hx-why svg{width:22px;height:22px;flex:0 0 22px;stroke:var(--ok);stroke-width:1.7;fill:none}
.hx-why b{color:var(--fg);font-weight:700}
.hero-dial > .hx-why{margin:10px auto 2px}
/* Perfil por temas */
.pf-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:2px 0 0}
.pf-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:68px;padding:10px 4px;border-radius:16px;background:var(--card,rgba(255,255,255,.05));border:1px solid var(--line,rgba(255,255,255,.1));color:var(--fg);font-size:13px;font-weight:700;font-family:var(--f-body);line-height:1.15;text-align:center}
.pf-nav button svg{width:20px;height:20px;stroke:var(--dawn);stroke-width:1.9;fill:none}
.pf-grp{display:flex;align-items:center;gap:12px;margin:22px 4px 0;scroll-margin-top:12px}
.pf-grp .pf-ic{width:38px;height:38px;flex:0 0 38px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--dawn) 16%,transparent)}
.pf-grp .pf-ic svg{width:20px;height:20px;stroke:var(--dawn);stroke-width:1.9;fill:none}
.pf-grp h2{font-size:19px;font-weight:800;letter-spacing:-.01em;color:var(--fg);margin:0}
.pf-grp p{font-size:13px;color:var(--faint);margin:2px 0 0;line-height:1.35}

/* ===== v30 · Conversaciones guardadas ===== */
.cv-bar{position:sticky;top:6px;z-index:5;display:flex;gap:8px;margin:2px 0 -2px}
.cv-bar button{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 14px;border-radius:999px;background:var(--glass);border:1px solid var(--line-2);color:var(--fg);font-size:13.5px;font-weight:700;font-family:var(--f-body);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5)}
.cv-bar button:first-child{flex:1;justify-content:flex-start}
.cv-bar button svg{width:17px;height:17px;stroke:var(--dawn);stroke-width:1.9;fill:none}
.cv-bar button b{margin-left:auto;min-width:22px;height:22px;padding:0 7px;border-radius:99px;display:grid;place-items:center;background:color-mix(in srgb,var(--dawn) 18%,transparent);color:var(--dawn);font-size:12px}
.cv-list{display:grid;gap:8px;margin-top:16px}
.cv-row{display:flex;align-items:stretch;gap:6px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}
.cv-row.cur{border-color:color-mix(in srgb,var(--dawn) 45%,transparent)}
.cv-open{flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:12px 4px 12px 12px;text-align:left;color:var(--fg)}
.cv-ic{width:38px;height:38px;flex:0 0 38px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,#5A8BD6 16%,transparent)}
.cv-ic svg{width:19px;height:19px;stroke:#5A8BD6;stroke-width:1.9;fill:none}
.cv-tx{flex:1;min-width:0;display:grid;gap:3px}
.cv-tx b{font-size:15px;font-weight:700;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cv-pv{font-size:13px;color:var(--muted);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cv-tx em{font-style:normal;font-size:11.5px;color:var(--faint);font-weight:600}
.cv-tx em i{font-style:normal;color:var(--dawn)}
.cv-open .chev{color:var(--faint);font-size:20px;padding:0 2px}
.cv-del{flex:0 0 38px;display:grid;place-items:center;color:var(--faint);border-left:1px solid var(--line)}
.cv-del svg{width:12px;height:12px;stroke:currentColor;stroke-width:2;fill:none}
.cv-empty{font-size:14px;color:var(--muted);text-align:center;padding:18px 8px}
.cv-recent{display:grid;gap:8px;margin:4px 0 18px}
.cv-lbl{font-size:12.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin:0 4px 2px}
.cv-all{justify-self:center;font-size:13.5px;font-weight:700;color:var(--dawn);padding:6px 10px}

/* ===== v30 · iPhone: Liquid Glass en navegación y controles ===== */
:root.ios-glass{--lg-a:rgba(255,255,255,.13);--lg-b:rgba(255,255,255,.04);--lg-edge:rgba(255,255,255,.20);--lg-hi:rgba(255,255,255,.42);--lg-lo:rgba(255,255,255,.06);--lg-sel:rgba(255,255,255,.14);--lg-shadow:0 10px 30px -8px rgba(0,0,0,.55);--lg-blur:blur(24px) saturate(185%)}
:root.ios-glass[data-theme="light"]{--lg-a:rgba(255,255,255,.72);--lg-b:rgba(255,255,255,.38);--lg-edge:rgba(255,255,255,.85);--lg-hi:rgba(255,255,255,1);--lg-lo:rgba(20,30,60,.05);--lg-sel:rgba(20,30,60,.07);--lg-shadow:0 10px 28px -10px rgba(20,30,60,.28)}
@media (prefers-color-scheme: light){:root.ios-glass:not([data-theme="dark"]){--lg-a:rgba(255,255,255,.72);--lg-b:rgba(255,255,255,.38);--lg-edge:rgba(255,255,255,.85);--lg-hi:rgba(255,255,255,1);--lg-lo:rgba(20,30,60,.05);--lg-sel:rgba(20,30,60,.07);--lg-shadow:0 10px 28px -10px rgba(20,30,60,.28)}}
.ios-glass .tabs,.ios-glass .tl-r .chip,.ios-glass .modes,.ios-glass .compose-row,.ios-glass .cv-bar button,.ios-glass .avatar-back,.ios-glass .close-x,.ios-glass .pf-nav button,.ios-glass .htabs .htab{
  background:linear-gradient(180deg,var(--lg-a),var(--lg-b))!important;
  backdrop-filter:var(--lg-blur)!important;-webkit-backdrop-filter:var(--lg-blur)!important;
  border:1px solid var(--lg-edge)!important;
  box-shadow:inset 0 1px 0 var(--lg-hi),inset 0 -1px 1px var(--lg-lo),var(--lg-shadow)!important}
.ios-glass .tabbar{background:linear-gradient(to top,color-mix(in srgb,var(--bg) 55%,transparent),transparent)!important}
.ios-glass .tabs{border-radius:999px!important;height:66px}
.ios-glass .tab{position:relative;isolation:isolate}
.ios-glass .tab[aria-current="page"]::before{content:"";position:absolute;inset:7px 3px;border-radius:999px;z-index:-1;background:var(--lg-sel);box-shadow:inset 0 1px 0 var(--lg-hi)}
.ios-glass .tab[aria-current="page"]{color:var(--dawn)}
.ios-glass .modes{border-radius:999px!important;padding:4px}
.ios-glass .modes button{border-radius:999px!important}
.ios-glass .compose-row{border-radius:999px!important}
.ios-glass .sheet-wrap{background:rgba(4,6,10,.32)}
.ios-glass .sheet{width:calc(100% - 14px);margin:0 7px 7px;border-radius:38px!important;border:1px solid var(--lg-edge)!important;background:color-mix(in srgb,var(--bg) 93%,transparent)!important;backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);box-shadow:inset 0 1px 0 var(--lg-hi),0 20px 60px -20px rgba(0,0,0,.6)}
.ios-glass .close-x{border-radius:50%!important}
.ios-glass .cv-bar button svg{stroke:var(--fg)}

.sheet:focus,.sheet:focus-visible,.overlay:focus{outline:none!important}
.ios-glass .tl-r .chip,.ios-glass .htabs .htab{box-shadow:inset 0 1px 0 var(--lg-hi),inset 0 -1px 1px var(--lg-lo),0 3px 10px -4px rgba(0,0,0,.25)!important}
.ios-glass .htabs .htab{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.ios-glass .htabs .htab.on{background:linear-gradient(180deg,color-mix(in srgb,var(--hc) 26%,var(--lg-a)),color-mix(in srgb,var(--hc) 12%,var(--lg-b)))!important;border-color:color-mix(in srgb,var(--hc) 55%,transparent)!important}
.ios-glass .tl-r .chip.flame{border-color:color-mix(in srgb,var(--dawn) 45%,var(--lg-edge))!important}
.ios-glass .tl-r .pts-chip,.ios-glass .tl-r .tro-chip{border-color:color-mix(in srgb,var(--gold) 45%,var(--lg-edge))!important}

/* ===== v31 · Oferta: 1 año o de por vida ===== */
.of-opts{display:grid;gap:10px;margin:16px 0 4px}
.of-opt{position:relative;display:flex;align-items:center;gap:12px;padding:14px 14px;border-radius:18px;background:var(--surface);border:1.5px solid var(--line-2);text-align:left;color:var(--fg)}
.of-opt[aria-checked="true"]{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 10%,var(--surface));box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 18%,transparent)}
.of-r{width:22px;height:22px;flex:0 0 22px;border-radius:50%;border:2px solid var(--line-2);display:grid;place-items:center}
.of-opt[aria-checked="true"] .of-r{border-color:var(--ok);background:var(--ok);box-shadow:inset 0 0 0 4px var(--surface)}
.of-ot{flex:1;min-width:0;display:grid;gap:2px}
.of-ot b{font-size:16px;font-weight:800}
.of-ot span{font-size:12.5px;color:var(--muted);line-height:1.35}
.of-op{display:grid;justify-items:end;gap:1px;text-align:right}
.of-op b{font-size:18px;font-weight:800;white-space:nowrap}
.of-op em{font-style:normal;font-size:11.5px;color:var(--faint);white-space:nowrap}
.of-tag2{position:absolute;top:-10px;right:14px;font-style:normal;font-size:11px;font-weight:800;letter-spacing:.04em;padding:3px 9px;border-radius:99px;background:var(--gold);color:#1a1405}

/* ===== Texto más grande ===== */
body{font-size:16.5px}
.mono{font-size:12px}
.sec-h h3{font-size:19.1px}
.link{font-size:14.9px}
.block p{font-size:16px}
.reto p{font-size:16px}
.btn{font-size:16.5px}
.btn.small{font-size:14.3px}
.stat span{font-size:13px}
.ms-row b{font-size:18px}
.reason-q{font-size:23.3px}
.sos-btn{font-size:12.5px}
.phase-body h3{font-size:20.1px}
.phase-body p{font-size:15.4px}
.cell{font-size:11px}
.legend span{font-size:13.5px}
.mood{font-size:13px}
.field label{font-size:15.4px}
.field .hint{font-size:13.8px}
textarea,.input{font-size:16.5px}
.saved{font-size:13.5px}
.hist .d{font-size:23.3px}
.hist .t b{font-size:15.4px}
.hist .t span{font-size:13.8px}
.circles button{font-size:12.5px}
.row .tx b{font-size:16px}
.row .tx span{font-size:13.8px}
.ct{font-size:16px}
.slot b{font-size:16.5px}
.reason-in span{font-size:12.5px}
.seg button{font-size:14.3px}
.disclaimer{font-size:13.5px}
.sheet .prose p{font-size:16.5px}
.sheet .prose h4{font-size:17.6px}
.sheet .prose ol,.sheet .prose ul{font-size:16px}
.sheet .prose li::marker{font-size:12.5px}
.callout{font-size:15.4px}
.phrase p{font-size:16px}
.steps .check .ct span{font-size:14.3px}
.reasons-scroll div{font-size:20.1px}
.ob-body{font-size:17.6px}
.ms-list b{font-size:16px}
.ms-list span{font-size:13.8px}
.ms-list time{font-size:13.5px}
.feat{font-size:16px}
.toast{font-size:14.9px}
/* ================= v2 ================= */
.back{font-size:15.4px}
.lvl-meta b{font-size:18px}
.near{font-size:13.8px}
.checkin p{font-size:15.4px}
.big-yes{font-size:18px}
.gift b{font-size:16px}
.gift span{font-size:13.8px}
.quest b{font-size:16px}
.quest span.s{font-size:13.8px}
.xp-pill{font-size:12px}
.meter .v b{font-size:20.1px}
.meter span{font-size:13px}
.ring-legend div{font-size:15.4px}
.ring-legend b{font-size:14.3px}
.metric .mh b{font-size:16px}
.metric .mh span{font-size:14.3px}
.metric p{font-size:13.8px}
.up{font-size:12.5px}
.fact p{font-size:19.1px}
.fact .src{font-size:11px}
.fact .n{font-size:11.5px}
.lock-cta b{font-size:16px}
.lock-cta span{font-size:13.8px}
.pro-list div{font-size:15.4px}
.brow .r{font-size:13.5px}
.brow .av{font-size:14.3px}
.brow .nm b{font-size:15.4px}
.brow .nm span{font-size:13px}
.brow .dd{font-size:19.1px}
.brow.gap{font-size:12.5px}
.feed div{font-size:14.9px}
.feed time{font-size:11.5px}
.ex-note{font-size:13px}
.badge span{font-size:12px}
details.acc summary .tx b{font-size:16px}
details.acc summary .tx span{font-size:13.8px}
.pro-help b{font-size:16.5px}
.pro-help p{font-size:14.9px}
.reel-item b{font-size:23.3px}
.urge-timer .row2{font-size:14.3px}
.urge-timer b{font-size:17.6px}
.sos-sub{font-size:16.5px}
.tap-count span{font-size:11.5px}
.tile{font-size:15.4px}
.feel button{font-size:18px}
.pw-restore{font-size:13.8px}
.pw .pw-sub{font-size:16.5px}
.pw-feats div{font-size:14.3px}
.plan b{font-size:17.6px}
.plan span{font-size:13.8px}
.plan .pp{font-size:16.5px}
.pw-cta{font-size:18px}
.pw-foot{font-size:13.8px}
.pw-links{font-size:13.5px}
.offer .tag{font-size:12px}
.offer s{font-size:19.1px}
.offer p{font-size:14.3px}
.countdown{font-size:13.5px}
.avatar-btn{font-size:14.3px}
.step-tile b{font-size:16.5px}
.step-tile > span:not(.st-ic){font-size:13.5px}
.step-tile em{font-size:11px}
.fc-tx b{font-size:19.1px}
.fc-tx span{font-size:14.3px}
.card.mini > span:last-child{font-size:13.5px}
.avatar-back{font-size:23.3px}
.fh-tx b{font-size:21.2px}
.fh-tx span{font-size:13.5px}
.modes button{font-size:14.9px}
.sos-inline{font-size:15.4px}
.faro-empty p{font-size:22.3px}
.msg.me{font-size:16.5px}
.ai-tx{font-size:17.1px}
.crisis b{font-size:15.4px}
.crisis span{font-size:13.5px}
.faro-alt{font-size:14.3px}
.sugg button{font-size:14.3px}
.compose-row textarea{font-size:17.1px}
.left-note{font-size:13px}
.limit-card b{font-size:14.9px}
.limit-card p{font-size:13.5px}
.peek-tag{font-size:13px}
.steps-ring b{font-size:13.5px}
.step-n{font-size:20.1px}
.step-tx b{font-size:17.1px}
.step-tx span{font-size:13.8px}
.big-yes.sm{font-size:17.1px}
.link.soft{font-size:14.3px}
.steps-foot{font-size:13.8px}
.steps-card.complete p{font-size:15.4px}
.risk-note{font-size:13.8px}
.ins-tx b{font-size:16px}
.ins-tx > span{font-size:14.3px}
.urge-pill b{font-size:16.5px}
.urge-pill span span{font-size:13.8px}
.safe-line{font-size:13.5px}
.wc-row b{font-size:17.1px}
.wc-row p{font-size:14.3px}
.hito-card b{font-size:18px}
.hito-card > span:last-child{font-size:13.5px}
.cal-ev > span:last-child b{font-size:15.4px}
.cal-ev > span:last-child span{font-size:13.5px}
.cal-note{font-size:13px}
.gate-modes b{font-size:14.9px}
.gate-modes em{font-size:12.5px}
.gate-crisis{font-size:13px}
.why-row b{font-size:16px}
.why-row span{font-size:13.8px}
.why-link{font-size:14.3px}
.ib-top{font-size:12.5px}
.ib-tx > b{font-size:15.4px}
.ib-tx > span:last-child{font-size:14.3px}
.notice > div b{font-size:16px}
.notice > div span{font-size:13.8px}
.wsum small{font-size:13.5px}
.wsum span{font-size:12px}
.fl-in > b{font-size:21.2px}
.fl-in > span{font-size:14.3px}
/* Tipografía más editorial, menos "etiqueta de máquina" */
.mono{font-size:13.8px}
.eyebrow{font-size:14.3px}
.sec-h h3{font-size:20.1px}
.muted-s{font-size:14.9px}
.sh4{font-size:14.3px}
.fact .n{font-size:13.5px}
.btn-relapse{font-size:16px}
.info-btn{font-size:13.8px}
.why-btn{font-size:13.8px}
.lvl-xp{font-size:13.8px}
.theme-sw{font-size:13px}
.theme-sw em{font-size:11px}
.rw-lv{font-size:19.1px}
.rw-t b{font-size:15.4px}
.rw-t span{font-size:13.5px}
.ways div{font-size:15.4px}
.pro-nudge b{font-size:16px}
.pro-nudge span span{font-size:13.8px}
.prof-row b{font-size:21.2px}
.prof-row span{font-size:13.8px}
.ob-lead{font-size:17.6px}
.btn.big{font-size:17.5px}
.opt{font-size:17.6px}
.an-line{font-size:17.6px}
.lvl-scale span{font-size:13px}
.findings b{font-size:16px}
.findings span{font-size:14.3px}
.myplan b{font-size:16px}
.myplan div div span{font-size:14.3px}
.fine{font-size:13px}
.pt-h{font-size:13.5px}
.pt-r{font-size:14.9px}
.cmp-row{font-size:13.8px}
.cmp-row b{font-size:14.3px}
.cmp-note{font-size:13px}
.cmp-note .link{font-size:13px}
.tools-list > div{font-size:13.8px}
.gate-why p{font-size:14.9px}
.htab{font-size:15.4px}
.htab.add{font-size:21.2px}
.hchip{font-size:15.4px}
.hchip i{font-size:12.5px}
.hnote{font-size:14.3px}
.hpill{font-size:14.9px}
/* ================= v8 ================= */
.plan .pp{font-size:19.1px}
.plan .pp small{font-size:13px}
.legal{font-size:13.5px}
.legal-open p{font-size:15.4px}
.trial-steps span{font-size:13.5px}
.trial-steps p{font-size:16.5px}
.offer .per{font-size:17.6px}
.custom-in label{font-size:16.5px}
.custom-in .input{font-size:18px}
.an-it b{font-size:16.5px}
.an-it div span{font-size:14.9px}
.goal-more{font-size:14.9px}
.muted-l{font-size:17.6px}
.promo-count > span{font-size:15.4px}
.mt-go{font-size:21.2px}
.mt-lock{font-size:11.5px}
.mt-l{font-size:15.4px}
.mt-s{font-size:13.8px}
.mt-hint{font-size:14.3px}
.insight .chev{font-size:21.2px}
.mx-ax{font-size:13px}
.sheet .mx-prose h4{font-size:14.3px}
.mx-factors div{font-size:16px}
.mx-cta b{font-size:18px}
.mx-cta p{font-size:16px}
.hs-h{font-size:13.8px}
.hs span{font-size:13.5px}
.hs b{font-size:21.2px}
.hs b small{font-size:12.5px}
.fc-h{font-size:14.3px}
.fc-d span{font-size:13px}
.fc-d b{font-size:13.5px}
.mx-note{font-size:15.4px}
.vs-health > div p{font-size:17.1px}
.vs-arrow{font-size:19.1px}
.ifthen .if{font-size:16.5px}
.ifthen .then{font-size:16px}
.rep-grid span{font-size:13.5px}
.rep-grid b{font-size:23.3px}
.pdf-h{font-size:15.4px}
.pdf-h span{font-size:13.5px}
.pdf-r{font-size:14.9px}
.pdf-f{font-size:13.5px}
.sh-win > span:last-child{font-size:14.9px}
.pf-tag{font-size:13.5px}
.pf-t{font-size:23.3px}
.pf .muted-l{font-size:17.1px}
/* ===== v12 · informes ===== */
.rep-grid .dl{font-size:13px}
.pdf-s{font-size:12.5px}
.pdf-bars div{font-size:12px}
.pdf-bars b{font-size:12.5px}
.rep-top b{font-size:17.6px}
.rep-top span{font-size:13.5px}
.rep-card ul{font-size:16px}
.pledge-paper .pp-h{font-size:12.5px}
.pp-txt{font-size:18px}
.pp-txt ul{font-size:16.5px}
.pp-l{font-size:13.5px}
.pp-hint{font-size:15.4px}
.pp-clear{font-size:13.5px}
.pp-line{font-size:13px}
.pledge-paper.small .pp-txt{font-size:16.5px}
.pledge-paper.small .pp-txt ul{font-size:14.9px}
.pd-state button{font-size:15.4px}
.pd-step button{font-size:23.3px}
.rc-r{font-size:16px}
.pp-in{font-size:20.1px}
.flow-back{font-size:16.5px}
.pf-row b{font-size:17.1px}
.pf-row div span{font-size:14.3px}
.pf-row em{font-size:12.5px}
.pf-more span{font-size:14.3px}
.pw-cmp summary{font-size:16px}
.lvl-legend b{font-size:17.1px}
.lvl-legend em{font-size:12.5px}
.lvl-legend span{font-size:14.9px}
.lv2-next b{font-size:16px}
.lv2-next span span{font-size:13.8px}
.lv2-ways span{font-size:13.8px}
.lv2-more{font-size:14.9px}
.tut .ob-lead{font-size:18px}
.str-h{font-size:16.5px}
.str p{font-size:15.4px}
.str .more{font-size:14.9px}
.pt-pro{font-size:13.5px}
.st-t b{font-size:16px}
.st-t span{font-size:13.8px}
.st-btn{font-size:14.9px}
.st-own{font-size:14.3px}
.pack em{font-size:12px}
.pack span{font-size:13.5px}
.pack i{font-size:15.4px}
.of-tag{font-size:12.5px}
.of-timer b{font-size:14.3px}
.of-price s{font-size:19.1px}
.of-save{font-size:15.4px}
.oc-t{font-size:19.1px}
.pt2 .pt-h span:first-child{font-size:13.5px}
.pt-chev{font-size:17.6px}
.pt-d p{font-size:14.9px}
.ai-disc{font-size:13px}
.gem-chip b{font-size:14.9px}
.gem-note{font-size:13px}
.sugg-lbl{font-size:12px}
.gem-bal span{font-size:13.8px}
.gem-eq b{font-size:17.6px}
.gem-eq > span:last-child{font-size:14.3px}
.gem-rules{font-size:14.9px}
.gem-packs small{font-size:12px}
.gem-mini{font-size:14.3px}
.sos-top .st-tx b{font-size:17.1px}
.sos-top .st-tx span{font-size:13.8px}
.sos-top .st-go{font-size:13.5px}
.plan-line em{font-size:12px}
.plan-line b{font-size:15.4px}
.ap-list div{font-size:16px}
.board.sm .av{font-size:14.3px}
.board.sm .r{font-size:13.8px}
.weekly-card h3{font-size:20.1px}
.wc-d span{font-size:12.5px}
.md-mini b{font-size:17.6px}
.rw-tx em{font-size:12px}
.rw-tx b{font-size:16.5px}
.rw-tx > span{font-size:13.8px}
.rw-how{font-size:13.8px}
.medal-s b{font-size:13px}
.medal-s em{font-size:12px}
.toast.neutral em{font-size:13.8px}
.neutral-note{font-size:13.8px}
/* Invitar y privacidad */
.invite-card h3{font-size:21.2px}
.code-box em{font-size:12px}
.code-box b{font-size:21.2px}
.priv-card .toggle b{font-size:16.5px}
.priv-card .toggle em{font-size:13.8px}
.fc-ok{font-size:14.9px}
/* Calendario: lección */
.lesson-card .lc-t{font-size:17.6px}
.bh-side em{font-size:14.3px}
.bh-phase{font-size:13.5px}
.bh-cap{font-size:14.3px}
.bh-bars span{font-size:14.9px}
.bh-bars b{font-size:15.4px}
.pt3 .pt-r{font-size:15.4px}
.pt-x p{font-size:15.4px}
.str-h b small{font-size:14.3px}
.tw-opt{font-size:12.5px}
.tw-card em{font-size:12.5px}
.tw-card b{font-size:16.5px}
.of-u-l{font-size:14.3px}
.oa-t b{font-size:16.5px}
.oa-t span{font-size:14.3px}
.grp-h h2{font-size:13.8px}
.grp-h p{font-size:14.9px}
.goal-ln{font-size:15.4px}
.sec-why{font-size:14.9px}
.bh-legend span b{font-size:16px}
.bh-legend span em{font-size:14.3px}
.bh-legend > div > b{font-size:16.5px}
.pts-chip b{font-size:13.5px}
.sos-chip{font-size:13.5px}
.pn-next b{font-size:16px}
.pn-next span span{font-size:13.8px}
.sum-g > span{font-size:12.5px}
.sum-tx h3{font-size:23.3px}
.sum-tx p{font-size:14.9px}
.si-t b{font-size:15.4px}
.si-t em{font-size:13.8px}
.si-v{font-size:13.5px}
.sum-do p{font-size:15.4px}
.pm-h{font-size:14.3px}
.pm-me em{font-size:12px}
.pm-lbl span{font-size:12px}
.pp-got b{font-size:23.3px}
.pp-got span{font-size:12.5px}
.pp-n{font-size:15.4px}
.pp-h b{font-size:17.6px}
.pp-h em{font-size:12.5px}
.pp-d{font-size:13.5px}
.pp-c p{font-size:14.9px}
.pm-h b{font-size:16.5px}
.pm-sub{font-size:14.3px}
/* Trofeos con puntos */
.b-pts{font-size:12px}
.tr-val{font-size:15.4px}
/* Arriba: SOS redondo y más grande */
.sos-round{font-size:12.5px}
.si-steps b{font-size:14.3px}
.si-steps span{font-size:13.8px}
.si-steps em{font-size:15.4px}
.sk-grid em{font-size:12px}
.str-link{font-size:15.4px}
.hi-row b{font-size:18px}
.hi-row span{font-size:13px}
/* Mapa: fecha concreta */
.pm-h b{font-size:17.1px}
.ofs-tag{font-size:12px}
.ofs-t{font-size:14.9px}
.ofs-time b{font-size:14.3px}
.ofh > span{font-size:14.3px}
.ofh p{font-size:15.4px}
.shd-phone b{font-size:16.5px}
.shd-phone span{font-size:13px}
.shd-phone em{font-size:12px}
.sh-pro{font-size:12.5px}
.ofs-t{font-size:15.4px}
.ofs-t s{font-size:13.5px}
.in-steps b{font-size:14.3px}
.in-steps span{font-size:13px}
.in-steps em{font-size:14.3px}
.q-hab{font-size:14.3px}
.q-hab em{font-size:13px}
.dg-of{font-size:13.5px}
.dg-lbl span{font-size:13px}
.deg-multi{font-size:14.9px}
.deg-track b{font-size:14.3px}
.deg-track span{font-size:13px}
.rs-he{font-size:23.3px}
.rs-hn b{font-size:15.4px}
.rs-hn em{font-size:13.5px}
.rs-leg summary{font-size:15.4px}
.rs-find b{font-size:16px}
.rs-find > div > div > span{font-size:14.3px}
.rs-goal b{font-size:22.3px}
.rs-goal > span:last-child{font-size:14.3px}
.rs-stats b{font-size:21.2px}
.rs-stats span{font-size:13px}
.rs-bar-l{font-size:12.5px}
.rs-dot b{font-size:16.5px}
.rs-pd{font-size:13px}
.rs-pn{font-size:19.1px}
.rs-pb p{font-size:14.9px}
.rs-pb li em{font-size:14.9px}
.rs-pb li small{font-size:12px}
.rs-daily b{font-size:15.4px}
.rs-daily span{font-size:13.5px}
.rs-daily em{font-size:15.4px}
.rs-tools b{font-size:15.4px}
.rs-tools em{font-size:13.5px}
.rp-leg span{font-size:13px}
.sos-intro .si-sub{font-size:17.1px}
.si-how b{font-size:16.5px}
.si-how span{font-size:14.3px}
.gx-pct{font-size:13.5px}
.gx-eb{font-size:13.5px}
.gx-hero p{font-size:17.1px}
.gx-meta span{font-size:13.8px}
.gx-tldr > em{font-size:13.5px}
.gx-tldr li{font-size:16.5px}
.gx-toc > em{font-size:13.5px}
.gx-toc button{font-size:16px}
.gx-toc button b{font-size:14.3px}
.gx-toc button i{font-size:19.1px}
.gx-sh b{font-size:16.5px}
.gx-body > p{font-size:17.1px}
.gx-body h4{font-size:17.5px}
.gx-body > ul,.gx-body > ol{font-size:16.5px}
.gx-body .g-key{font-size:16px}
.g-steps > div > b{font-size:15.4px}
.g-steps em{font-size:16.5px}
.g-steps p{font-size:15.4px}
.g-grid em{font-size:15.4px}
.g-grid p{font-size:13.8px}
.g-tip em,.g-warn em{font-size:13.5px}
.g-tip em::before{font-size:15.4px}
.g-warn em::before{font-size:14.3px}
.g-tip p,.g-warn p{font-size:16px}
.g-vs em{font-size:12.5px}
.g-vs p{font-size:15.4px}
.g-time span{font-size:13.5px}
.g-time p{font-size:15.4px}
.g-say p{font-size:18px}
.g-copy{font-size:13.5px}
.g-scale span{font-size:14.3px}
.g-path span{font-size:13.8px}
.g-cta{font-size:16.5px}
.g-cta::after{font-size:21.2px}
.gx-body .phrase p{font-size:16px}
.gx-todo > p{font-size:14.9px}
.gx-ck{font-size:16px}
.gx-done{font-size:14.3px}
.gx-done em{font-size:16px}
.gx-next em{font-size:13.5px}
.gx-next b{font-size:17.6px}
.gx-next i{font-size:23.3px}
.gx-li-t b{font-size:16px}
.gx-li-t em{font-size:13.8px}
.qsteps span{font-size:11.5px}
.qx-t b{font-size:16.5px}
.qx-t em{font-size:13.8px}
.qx-n{font-size:13.8px}
.qx-hab{font-size:14.3px}
.qx-hab > span{font-size:17.6px}
.qx-hab em{font-size:13px}
.qx-tile > span:not(.opt-dot){font-size:16.5px}
.rs-start em{font-size:14.3px}
.qd-q > b{font-size:16.5px}
.qd-q > b i{font-size:13.5px}
.qd-moods button{font-size:13px}
.qd-urge button{font-size:13.5px}
.qd-mom button{font-size:14.9px}
.qd-mom em{font-size:18px}
.qd-note label{font-size:14.9px}
.d1-h h3{font-size:21.2px}
.d1-n{font-size:15.4px}
.d1-tx b{font-size:16px}
.d1-tx em{font-size:13.8px}
.hx-l{font-size:13.8px}
.hx-v small{font-size:14.3px}
.hx-s{font-size:13.8px}
.rp-intro{font-size:16px}
.a4-logo{font-size:16.5px}
.a4-brand b{font-size:19.1px}
.a4-brand span,.a4-meta span{font-size:13px}
.a4-meta b{font-size:14.9px}
.a4-title p{font-size:13.5px}
.a4-kpi span{font-size:13px}
.a4-kpi em{font-size:12px}
.a4-sec h2{font-size:14.3px}
.a4-cap{font-size:12px}
.a4-leg{font-size:12px}
.rp-cal b{font-size:12.5px}
.rp-hb b{font-size:11.5px}
.rp-hb span{font-size:11px}
.rp-top div{font-size:13px}
.rp-top b{font-size:12.5px}
.rp-empty{font-size:13px}
.a4-obs ul{font-size:13.5px}
.a4-list{font-size:13px}
.a4-notes div{font-size:12.5px}
.a4-notes b{font-size:12.5px}
.a4-sign span{font-size:12.5px}
.a4-f{font-size:11px}
.a4-brand .a4-logo{font-size:15.4px}
.a4-ph b{font-size:13px}
.a4-ph span{font-size:11.5px}
.a4-sec h2{font-size:13.8px}
.cv-center span{font-size:22.3px}
.tvs-btn{font-size:13.5px}
.tvs-card .mono{font-size:11.5px}
.tvs-card > span:last-child{font-size:14.3px}
.cl-t b{font-size:17.1px}
.cl-t span{font-size:14.3px}
.st-pro{font-size:13.5px}
.ob-title .sos-ic{font-size:16.5px}
.lock-ph b{font-size:16px}
.lock-ph > span:last-child{font-size:13.8px}
.gp-save{font-size:13px}
.gem-packs .pack b.gp-save{font-size:13px}
/* Reloj: para qué es */
.hx-why{font-size:15.4px}
.pf-nav button{font-size:14.3px}
.pf-grp h2{font-size:20.1px}
.pf-grp p{font-size:14.3px}
.cv-bar button{font-size:14.9px}
.cv-bar button b{font-size:13.5px}
.cv-tx b{font-size:16.5px}
.cv-pv{font-size:14.3px}
.cv-tx em{font-size:13px}
.cv-open .chev{font-size:21.2px}
.cv-empty{font-size:15.4px}
.cv-lbl{font-size:13.8px}
.cv-all{font-size:14.9px}
.of-ot b{font-size:17.6px}
.of-ot span{font-size:13.8px}
.of-op b{font-size:19.1px}
.of-op em{font-size:13px}
.of-tag2{font-size:12.5px}

/* ===== Versión de tiendas ===== */
html,body{height:100%;overscroll-behavior:none}
body{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
input,textarea,[contenteditable]{-webkit-user-select:text;user-select:text}
@media (min-width:700px){.device{max-width:600px;margin:0 auto;border-left:1px solid var(--line);border-right:1px solid var(--line)}}
.ps-legal{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 8px;margin-top:14px;font-size:12.5px;color:var(--muted)}
.ps-legal .link{font-size:12.5px;color:var(--muted);text-decoration:underline;text-underline-offset:2px}
.ps-busy{opacity:.6;pointer-events:none;position:relative}
.ps-busy::after{content:"";position:absolute;right:16px;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:psSpin .8s linear infinite}
@keyframes psSpin{to{transform:rotate(360deg)}}
.ps-off h3{margin-top:8px;font-size:17px}
.ps-off .muted-s{margin-top:4px}
.ps-sh-prog{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:4px 8px;margin-top:14px;padding:12px 14px;border-radius:16px;background:var(--surface-2)}
.ps-sh-prog b{font-size:20px;font-family:var(--f-display)}
.ps-sh-prog span{color:var(--muted);font-size:13.5px}
.ps-sh-prog > i{grid-column:1/-1;height:6px;border-radius:9px;background:var(--tick-off);overflow:hidden}
.ps-sh-prog > i > i{display:block;height:100%;border-radius:9px;background:var(--ok);transition:width .4s}
.ps-sh-steps{display:grid;gap:10px;margin-top:14px}
.ps-sh{display:grid;gap:10px;padding:14px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}
.ps-sh.on{border-color:color-mix(in srgb,var(--ok) 45%,transparent)}
.ps-sh-h{display:grid;grid-template-columns:30px 1fr;gap:12px;align-items:start}
.ps-sh-h > b{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--sky) 18%,transparent);color:var(--sky);font-size:14px;font-weight:800}
.ps-sh.on .ps-sh-h > b{background:color-mix(in srgb,var(--ok) 22%,transparent);color:var(--ok)}
.ps-sh-h em{display:block;font-style:normal;font-weight:700;font-size:15.5px;line-height:1.3}
.ps-sh-h span{display:block;font-size:13.5px;color:var(--muted);margin-top:2px;line-height:1.4}
.ps-sh-how{font-size:14px;line-height:1.5}
.ps-sh .toggle{margin:0}
.ps-row{width:100%}

