/* app.css — extraído de index.html (líneas 407-478). Orden preservado: NO reordenar los <link>. */
  /* ===== Re-skin editorial · blanco / negro / lime · Newsreader + DM Sans ===== */
  .h1,.h2,.greet,.hero h3,.login h1,.brand b{font-family:'Newsreader',serif !important;font-style:italic;font-weight:500;letter-spacing:-.3px}
  .greet em,.login h1 em,.hero h3 em{color:var(--cream)}
  .btn,.login .enter{font-family:'DM Sans',sans-serif !important;font-weight:700;letter-spacing:0}
  .eyebrow{color:var(--cream)}
  .brand .mark{background:#0c0d0b !important;border:0 !important;box-shadow:0 6px 16px -8px rgba(0,0,0,.4)}
  .brand .mark svg{fill:var(--accent)}
  .statusbar{color:var(--cream)}
  .device{box-shadow:0 40px 80px -36px rgba(0,0,0,.28), inset 0 0 0 1px var(--line) !important}
  .card{box-shadow:0 1px 0 rgba(0,0,0,.02)}
  .hero{background:#fff !important;border:1.5px solid var(--cream) !important}
  .hero .tag{background:var(--accent-soft) !important;color:#3f5a06 !important}
  .hero .meta{color:var(--cream)} .hero .meta span{color:var(--muted)}
  .note{background:var(--accent-soft) !important;border:1px solid var(--line) !important}
  .note p{color:var(--cream)} .note .who .a{background:#0c0d0b;color:var(--accent)}
  .cue{background:var(--accent-soft) !important;border:1px solid var(--line) !important;color:#1f2a0a !important}
  .vbtn{background:var(--accent-soft) !important;color:#0c0d0b !important;border:1px solid var(--line)}
  .addb{color:#0c0d0b}
  .blockhead .b{color:#3f5a06} .wnum{color:#3f5a06 !important}
  .photo{background:#f0f0ea !important}
  .banner{background:var(--accent-soft) !important;border:1px solid var(--line) !important;color:#3f5a06 !important}
  .soon .tagx{color:#3f5a06;border:1px solid var(--line)}
  .kpi.alert{border-color:var(--accent)} .kpi.alert .n{color:var(--cream)}
  .tabbar{background:rgba(255,255,255,.94) !important;border-top:1px solid var(--line)}
  .tab.on{color:var(--cream)} .tab.on svg{stroke:var(--cream)}
  .segbar button.on{background:#0c0d0b !important;color:#fff !important}
  .login{background:#fff !important}
  .login input{background:var(--card-2) !important;border:1.5px solid var(--line) !important;color:var(--cream) !important}
  .login input::placeholder{color:var(--muted-2)}
  .login .err{color:var(--red)}
  .login .hint{background:var(--card-2) !important;border:1px solid var(--line)}
  .login .hint code{color:#3f5a06}
  .login .lmark{box-shadow:0 12px 30px -12px rgba(0,0,0,.35)}

  /* ===== Pagos ===== */
  .paybanner{display:flex;align-items:center;justify-content:space-between;gap:12px;border-radius:14px;padding:12px 14px;margin:14px 0 2px}
  .paybanner b{font-family:'DM Sans';font-weight:700;font-size:14px;display:block}
  .paybanner span{font-size:12px;color:var(--muted);display:block;margin-top:2px}
  .paybanner .btn.sm{width:auto;flex:0 0 auto}
  .paybanner.warn{background:var(--accent-soft);border:1px solid var(--line)}
  .paybanner.ok{background:var(--card-2);border:1px solid var(--line)}
  .paybanner.bad{background:#fdecea;border:1px solid #f3c9c4}
  .paybanner.bad b{color:#a3271b}
  .paydot{width:12px;height:12px;border-radius:50%;flex:0 0 auto;margin-top:5px}
  .paydot.ok{background:var(--green)} .paydot.wait{background:var(--amber)} .paydot.bad{background:var(--red)}
  [data-locked="1"] #t-entreno,[data-locked="1"] #t-progreso{opacity:.4}
  [data-needcuest="1"] #t-entreno,[data-needcuest="1"] #t-progreso{opacity:.4}

  /* ===== Cuestionario ===== */
  .qprog{position:sticky;top:0;z-index:6;background:var(--bg);padding:12px 0 10px;margin:0 0 4px}
  .qprog .bar{height:6px;border-radius:99px;background:var(--card-2);overflow:hidden}
  .qprog .bar i{display:block;height:100%;background:var(--accent);width:0;transition:width .3s}
  .qprog .pct{font-family:'DM Sans';font-weight:700;font-size:12px;color:var(--muted);margin-top:6px;display:flex;justify-content:space-between}
  .qsec{margin-top:24px}
  .qsec > h3{font-family:'DM Sans';font-weight:800;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
  .qfield{margin-top:16px}
  .qfield .ql{display:block;font-family:'DM Sans';font-weight:600;font-size:14.5px;margin-bottom:8px;color:var(--cream)}
  .qfield .qhelp{font-size:12px;color:var(--muted);margin-top:7px;line-height:1.5}
  .qi{width:100%;border:1px solid var(--line);border-radius:13px;padding:12px 14px;font-family:'DM Sans';font-size:15px;background:var(--card);color:var(--cream);box-sizing:border-box}
  .qi:focus{outline:none;border-color:var(--accent)}
  textarea.qi{min-height:84px;resize:vertical;line-height:1.5}
  .qopts{display:flex;flex-wrap:wrap;gap:8px}
  .qopt{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:9px 14px;font-family:'DM Sans';font-weight:600;font-size:13.5px;color:var(--cream);cursor:pointer;transition:.12s}
  .qopt.on{background:var(--accent);border-color:var(--accent);color:#14180c}
  .qreq{color:var(--red)}
  .qdraft{font-size:11.5px;color:var(--muted-2);text-align:center;margin-top:14px}
  .qprompt{display:flex;align-items:center;gap:13px;cursor:pointer;margin-top:14px}
  .qprompt .ic{width:42px;height:42px;border-radius:50%;background:var(--accent-soft);display:grid;place-items:center;flex:0 0 auto;font-size:18px}
  .qprompt .qtxt{flex:1;min-width:0}
  .qprompt .qtxt .t{font-family:'DM Sans';font-weight:700;font-size:16px;margin-top:2px}
  .qprompt .qtxt .s{font-size:12px;color:var(--muted);margin-top:3px}
  .qprompt .chev{color:var(--muted-2);font-size:22px;flex:0 0 auto}