/* tc-manual-reader.css — the manual reader's chapter look (web manual-reader.html
   AND the native iOS/Android readers load this same file; 2026-10-23).
   The reader keeps its own copy of the lesson look on purpose (CLAUDE.md §2.51,
   Daniel 2026-10-11). Edit here, bump ?v= on manual-reader.html and the apps. */
  :root{--blue:var(--teal,#0061D4);--navym:var(--navy,#0B3F82);--sky:#E3EFFC;--cream:#FFF8EC;--sun:#F4B731;--sunsoft:#FFF1C9;--terra:#D9734E;--terrasoft:#FBE6DC;
    --green:#12A36B;--greensoft:#DDF5EA;--red:#C62828;--redsoft:#FDECEC;--ink:#1F2D3D;--sub:#55657A;--line:#E6DCC8}
  .mr{display:grid;grid-template-columns:250px 1fr;gap:28px;max-width:1120px;margin:0 auto;padding:8px 4px 60px}
  .toc{position:sticky;top:12px;align-self:start;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px}
  .toc h1{font-family:'Nunito',sans-serif;font-weight:900;font-size:1.1rem;color:var(--navym);margin:0 0 4px}
  .toc .ver{font-size:.8rem;color:var(--sub);margin-bottom:10px}
  /* 2026-10-19 (Daniel): chapter list as a numbered rail. Number circle on the
     left (green check when every question of the chapter is solved), title,
     badges on the right; the open chapter is a soft sky row with a navy bar. */
  #list{display:flex;flex-direction:column;gap:2px;margin-top:4px}
  .toc button{display:flex;gap:10px;align-items:center;width:100%;text-align:left;background:none;border:0;border-radius:12px;padding:7px 8px 7px 6px;font:inherit;font-size:.9rem;line-height:1.3;color:var(--ink);cursor:pointer;position:relative;transition:background .12s}
  .toc button:hover{background:var(--sky)}
  .toc button.on{background:var(--sky);color:var(--navym);font-weight:800}
  .toc button.on::before{content:"";position:absolute;left:-6px;top:8px;bottom:8px;width:4px;border-radius:4px;background:var(--navym)}
  .toc button .num{flex:none;width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:'Nunito',sans-serif;font-weight:900;font-size:.8rem;background:var(--sunsoft);color:#8A5A00;border:1.5px solid rgba(244,183,49,.55)}
  .toc button .num svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
  .toc button .num.pre{background:var(--sky);color:var(--navym);border-color:rgba(11,63,130,.25)}
  .toc button .num.done{background:var(--green);color:#fff;border-color:var(--green)}
  .toc button.locked{color:var(--sub)}
  .toc button.locked .num{background:#F1F3F6;color:#8A94A3;border-color:#DFE4EA}
  .toc button.on .num{box-shadow:0 0 0 2px #fff}
  .toc button .lk{margin-left:auto;font-size:.72rem;color:var(--sub);display:inline-flex;align-items:center;gap:3px}
  .toc button .lk svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
  .toc button.on .lk{color:var(--navym)}
  .toc .tocprog{height:5px;border-radius:99px;background:#EEF2F7;margin:2px 0 10px;overflow:hidden}
  .toc .tocprog>i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--green),#4FD39B);width:0;transition:width .4s}
  .toc .actions{border-top:1px solid var(--line);margin-top:10px;padding-top:10px;display:grid;gap:8px}
  .mbtn{display:block;text-align:center;font-family:'Nunito',sans-serif;font-weight:900;border-radius:99px;padding:10px 14px;text-decoration:none;border:0;cursor:pointer;font-size:.95rem}
  .mbtn.p{background:var(--blue);color:#fff}
  .mbtn.s{background:var(--sky);color:var(--navym)}
  .nextstep{background:var(--cream);border-radius:12px;padding:10px 12px;font-size:.88rem;display:grid;gap:4px}.nextstep b{color:var(--navym)}.nextstep a{color:var(--blue);font-weight:700;text-decoration:none}
  .owner{background:var(--sunsoft);border-radius:10px;padding:8px 10px;font-size:.8rem;color:#6a4700;margin-top:8px}
  article{font-family:'Atkinson Hyperlegible',system-ui,sans-serif;color:var(--ink);font-size:1.1rem;line-height:1.6;background:#fff;border:1px solid var(--line);border-radius:18px;padding:30px 34px;min-height:60vh}
  article h2{font-family:'Nunito',sans-serif;font-weight:900;color:var(--navym);font-size:1.8rem;line-height:1.15;margin:0 0 12px}
  article h3{font-family:'Nunito',sans-serif;font-weight:800;color:var(--navym);font-size:1.25rem;display:flex;gap:10px;align-items:center;margin:26px 0 8px}
  article p{margin:0 0 12px} article ul,article ol{margin:6px 0 12px 22px} article li{margin:5px 0}
  article ol.big>li{margin:10px 0}
  .ic{width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:none}
  .ic svg{width:19px;height:19px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
  .chead{display:flex;gap:16px;align-items:flex-end;margin-bottom:10px}
  .chapnum{font-family:'Nunito',sans-serif;font-weight:900;font-size:5.5rem;line-height:.8;color:var(--sun)}
  .pill{display:inline-block;font-family:'Nunito',sans-serif;font-weight:900;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;padding:4px 12px;border-radius:99px;background:var(--sunsoft);color:#8a5a00;margin-bottom:6px}
  .pill.blue{background:var(--blue);color:#fff}.pill.gold{background:#E0A11B;color:#fff}.pill.greenp{background:var(--green);color:#fff}
  .goal{background:var(--sky);border-left:7px solid var(--blue);border-radius:12px;padding:14px 18px;font-weight:700;color:var(--navym);font-size:1.15rem;margin:10px 0 14px}
  .goal small{display:block;font-family:'Nunito',sans-serif;font-weight:900;font-size:.72rem;letter-spacing:.08em;color:var(--blue);text-transform:uppercase}
  img.hero{width:100%;height:auto;border-radius:16px;margin:6px 0 12px}
  img.side{float:right;width:38%;max-width:260px;height:auto;border-radius:14px;margin:0 0 10px 16px}
  .lede{font-size:1.25rem}
  .box{border-radius:14px;padding:14px 18px;margin:12px 0;clear:both}
  article table,.tbl,.two,.three{clear:both}
  .box.navy{background:var(--navym);color:#fff}.box.navy .big{font-size:1.15rem;color:var(--sun)}
  .box.sky{background:var(--sky)}.box.sun{background:var(--sunsoft)}.box.cream{background:var(--cream)}
  .box.green{background:var(--greensoft)}.box.terra{background:var(--terrasoft)}
  .box.row{display:flex;gap:16px;align-items:center}.bignum{font-family:'Nunito',sans-serif;font-weight:900;font-size:2.6rem;color:var(--blue)}
  .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.three{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  .stepc{display:flex;gap:10px;margin:10px 0}.stepc .sn{flex:none;width:34px;height:34px;border-radius:50%;color:#fff;font-family:'Nunito',sans-serif;font-weight:900;display:flex;align-items:center;justify-content:center}
  .stepc span{font-size:.95rem}
  .stop{background:var(--redsoft);border:2.5px solid var(--red);border-radius:14px;padding:14px 18px;display:flex;gap:14px;align-items:flex-start;margin:14px 0}
  .stop .hand{flex:none;width:46px;height:46px;background:var(--red);border-radius:50%;display:flex;align-items:center;justify-content:center}
  .stop .hand svg{width:26px;height:26px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
  .stop h4{font-family:'Nunito',sans-serif;font-weight:900;color:var(--red);font-size:1.1rem;margin:0 0 2px}
  .note{background:#FFE98A;border-radius:8px;padding:10px 14px;font-weight:700;color:#5a4500;margin:10px 0}
  .note:before{content:'NOTA PARA DANIEL (solo tú la ves) · ';font-weight:900;color:#9a6b00}
  .diagram{max-width:620px;margin:8px auto}
  .chk{list-style:none;margin:6px 0!important}.chk li{display:flex;gap:10px}
  .chk li:before{content:'';flex:none;width:22px;height:22px;border:2.5px solid var(--green);border-radius:5px;margin-top:3px}
  .tablewrap{overflow-x:auto}
  table.sheet{border-collapse:collapse;width:100%;font-size:.95rem}
  table.sheet th,table.sheet td{border:1.5px solid #C9BFAA;padding:8px 6px;height:34px;text-align:center}
  table.sheet th{background:var(--navym);color:#fff;font-family:'Nunito',sans-serif}
  table.sheet .l{text-align:left}
  .gaugerow{display:grid;grid-template-columns:220px 1fr;gap:16px;align-items:center;margin:12px 0}
  .ev{background:#F4F1EA;border-radius:14px;padding:12px 18px;font-size:.98rem;margin-top:18px}.ev h3{margin-top:4px}.ev .rev{font-size:.8rem;color:var(--sub)}
  .instr{background:var(--greensoft);border:2px dashed var(--green);border-radius:14px;padding:12px 18px;margin-top:18px}.instr h3{margin-top:4px}
  .sign{font-family:'Nunito',sans-serif;font-weight:900;font-size:1.4rem;color:var(--navym)}.sign span{font-family:'Atkinson Hyperlegible',sans-serif;font-weight:400;font-size:1rem;color:var(--sub)}
  .muted{color:var(--sub);font-size:.92rem}
  .locked{text-align:center;padding:40px 10px}.locked h2{margin-bottom:8px}
  .msg{max-width:640px;margin:60px auto;text-align:center;background:#fff;border:1px solid var(--line);border-radius:18px;padding:34px}
  .navrow{display:flex;justify-content:space-between;gap:10px;margin-top:22px}
  .pfoot{display:none}
  .ptable,.ptable>tbody,.ptable>tbody>tr,.ptable>tbody>tr>td{display:block}.ptable>tfoot{display:none}
  .tocbtn{display:none;width:100%;margin-bottom:6px}
  /* 2026-10-11 TOC badges: Gratis pill + Ponte a prueba progress */
  .toc .tocbtn{display:none}
  .mqf:focus{outline:none}
  .toc button>span.tt{flex:1;min-width:0}
  .toc .rt{display:inline-flex;gap:5px;align-items:center;flex:none}
  .toc .rt .lk{margin-left:0}
  .fr{font-family:'Nunito',sans-serif;font-weight:900;font-size:.66rem;letter-spacing:.05em;text-transform:uppercase;padding:2px 7px;border-radius:99px;background:var(--greensoft);color:#0B6B45}
  .mqd{display:inline-flex;align-items:center;gap:3px;font-size:.72rem;font-weight:700;color:var(--sub)}
  .mqd.ok{color:#0B6B45}.mqd svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
  .toc button.on .fr{background:#fff;color:#0B6B45}.toc button.on .mqd{color:var(--navym)}
  /* 2026-10-11 reader header: points + Tu avance */
  .rbar{position:sticky;top:0;z-index:5;display:flex;gap:10px;align-items:center;justify-content:space-between;background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:8px 10px 8px 14px;margin-bottom:12px}
  .pts{display:inline-flex;align-items:center;gap:7px;font-family:'Nunito',sans-serif;font-weight:900;color:var(--navym);font-size:1rem}
  .pts svg{width:22px;height:22px;flex:none}
  .pts.bump b{animation:mqbump .6s ease}
  .rbar .mbtn{padding:9px 16px;min-height:44px}
  .rbr{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
  .fbnote{background:var(--sunsoft);border-radius:10px;padding:8px 12px;font-size:.9rem;margin:0 0 12px}
  @keyframes mqbump{0%{transform:scale(1)}40%{transform:scale(1.45);color:var(--green)}100%{transform:scale(1)}}
  .pts b{display:inline-block}
  /* 2026-10-11 Ponte a prueba cards */
  .mqc{background:var(--cream);border:2px solid var(--sun);border-radius:16px;padding:16px 18px;margin:22px 0;font-size:1.02rem}
  .mqh{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:6px}
  .mqh .muted{font-size:.85rem}
  .mqi+.mqi{border-top:1.5px dashed var(--line);margin-top:14px;padding-top:14px}
  .mqq{font-weight:700;color:var(--ink);margin:4px 0 10px!important}
  .mqos{display:grid;gap:8px}
  .mqo{display:flex;gap:10px;align-items:center;width:100%;min-height:48px;text-align:left;font:inherit;font-size:1rem;color:var(--ink);background:#fff;border:2px solid var(--line);border-radius:12px;padding:9px 12px;cursor:pointer;line-height:1.35}
  .mqo:hover:not([disabled]){border-color:var(--blue);background:var(--sky)}
  .mqo:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
  .mqo[disabled]{cursor:default}
  .mqo .mql{flex:none;width:28px;height:28px;border-radius:50%;background:var(--sky);color:var(--navym);font-family:'Nunito',sans-serif;font-weight:900;display:flex;align-items:center;justify-content:center;font-size:.9rem}
  .mqo .mk{margin-left:auto;flex:none;width:22px;height:22px;display:none}
  .mqo .mk svg{width:22px;height:22px;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
  .mqo.right{border-color:var(--green);background:var(--greensoft)}.mqo.right .mql{background:var(--green);color:#fff}.mqo.right .mk.y{display:block}.mqo.right .mk svg{stroke:var(--green)}
  .mqo.wrong{border-color:var(--terra);background:var(--terrasoft)}.mqo.wrong .mql{background:var(--terra);color:#fff}.mqo.wrong .mk.n{display:block}.mqo.wrong .mk svg{stroke:#A4462A}
  .mqo.dim{opacity:.6}
  .mqo.off{opacity:.45;border-style:dashed}.mqo.off>span:nth-child(2){text-decoration:line-through}
  .mqhint{display:block;margin-top:8px;background:#fff;border:2px dashed var(--sun);border-radius:10px;padding:8px 12px;color:var(--ink)}
  .mqhint b{color:#8a5a00}
  .mqf{position:relative;margin-top:10px;border-radius:12px;padding:0;font-size:.98rem}
  .mqf:empty{display:none}
  .mqf.good{background:var(--greensoft);padding:10px 14px}.mqf.bad{background:var(--terrasoft);padding:10px 14px}
  .mqf b.v{font-family:'Nunito',sans-serif;font-weight:900;margin-right:4px}.mqf.good b.v{color:#0B6B45}.mqf.bad b.v{color:#A4462A}
  .mqf .mbtn{display:inline-block;margin-top:8px;padding:9px 16px;min-height:44px}
  .mqf .muted{display:block;margin-top:4px;font-size:.85rem}
  .pop{position:absolute;right:12px;top:-6px;font-family:'Nunito',sans-serif;font-weight:900;font-size:1.3rem;color:var(--green);pointer-events:none;animation:mqpop 1.1s ease-out forwards}
  @keyframes mqpop{0%{opacity:0;transform:translateY(8px) scale(.8)}20%{opacity:1;transform:translateY(0) scale(1.15)}100%{opacity:0;transform:translateY(-30px) scale(1)}}
  .toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--navym);color:#fff;border-radius:99px;padding:12px 20px;font-family:'Nunito',sans-serif;font-weight:900;z-index:60;box-shadow:0 6px 24px rgba(0,0,0,.2);max-width:calc(100vw - 32px);text-align:center}
  @media (prefers-reduced-motion:reduce){.pop,.pts.bump b{animation:none}.pop{display:none}}
  /* 2026-10-11 paid chapter preview */
  .pvcover{background:var(--navym);border-radius:18px;padding:28px 26px;display:flex;gap:18px;align-items:flex-end;min-height:190px;margin-bottom:16px;position:relative;overflow:hidden}
  .pvcover .chapnum{font-size:7rem}
  .pvcover .pvt{font-family:'Nunito',sans-serif;font-weight:900;color:#fff;font-size:1.5rem;line-height:1.15;padding-bottom:6px}
  .pvcover:after{content:'';position:absolute;right:-40px;top:-40px;width:160px;height:160px;border-radius:50%;background:var(--sun);opacity:.18}
  .pv .mbtn{display:inline-block}
  /* 2026-10-11 Tu avance panel */
  .ovl{position:fixed;inset:0;background:rgba(11,25,45,.55);z-index:50;display:flex;align-items:flex-start;justify-content:center;padding:24px 16px;overflow-y:auto}
  .ovl[hidden]{display:none}
  .avp{background:#fff;border-radius:20px;max-width:620px;width:100%;padding:22px 24px;font-family:'Atkinson Hyperlegible',system-ui,sans-serif;color:var(--ink);box-sizing:border-box}
  .avp h2{font-family:'Nunito',sans-serif;font-weight:900;color:var(--navym);font-size:1.5rem;margin:0}
  .avh{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
  .avh .mbtn{min-height:44px}
  /* 2026-10-12 progress rings (Daniel): big ring in the panel, mini ring per chapter, tiny ring in the Tu avance button */
  .avtop{display:flex;gap:16px;align-items:center;background:var(--sky);border-radius:16px;padding:14px 16px;margin:4px 0 12px}
  .ring{position:relative;flex:none}
  .ring svg{display:block;transform:rotate(-90deg)}
  .ring .ring-bg{fill:none;stroke:#fff;stroke-width:10}
  .ring .ring-fg{fill:none;stroke:var(--green);stroke-width:10;stroke-linecap:round;transition:stroke-dashoffset .6s ease}
  .ring .ring-txt{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Nunito',sans-serif;font-weight:900;color:var(--navym);font-size:1.35rem}
  .avtop .avtxt b{display:block;font-family:'Nunito',sans-serif;font-weight:900;font-size:1.15rem;color:var(--navym);line-height:1.2}
  .avtop .avtxt span{display:block;font-size:.9rem;color:var(--sub)}
  .avl li .mini{display:inline-flex;align-items:center;gap:8px}
  .mini .ring .ring-bg{stroke:var(--line);stroke-width:4}.mini .ring .ring-fg{stroke-width:4}
  #avBtn .ring{display:inline-block;vertical-align:middle;margin-right:7px}
  #avBtn .ring .ring-bg{stroke:rgba(11,63,130,.15);stroke-width:4}#avBtn .ring .ring-fg{stroke:var(--green);stroke-width:4}
  .avs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0 12px}
  .avs div{background:var(--sky);border-radius:14px;padding:12px 14px}
  .avs b{display:block;font-family:'Nunito',sans-serif;font-weight:900;font-size:1.9rem;color:var(--navym);line-height:1.1}
  .avs span{font-size:.9rem;color:var(--sub)}
  .bdg{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:8px 0 14px}
  .bdg div{border:2px solid var(--line);border-radius:14px;padding:10px;display:flex;gap:8px;align-items:center;font-size:.9rem}
  .bdg div svg{width:30px;height:30px;flex:none}
  .bdg div.on{border-color:var(--sun);background:var(--sunsoft)}
  .bdg div.off{color:var(--sub)}.bdg div.off svg{opacity:.35;filter:grayscale(1)}
  .bdg b{display:block;color:var(--navym)}.bdg div.off b{color:var(--sub)}
  .avl{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:4px;max-height:260px;overflow-y:auto}
  .avl li{display:flex;justify-content:space-between;gap:10px;font-size:.92rem;padding:5px 2px;border-bottom:1px solid var(--line)}
  .avf{background:var(--cream);border-radius:14px;padding:12px 14px;font-size:.95rem}.avf a{color:var(--blue);font-weight:700}
  @media screen and (max-width:520px){.pvcover{padding:20px 18px;min-height:150px}.pvcover .chapnum{font-size:4.6rem}.pvcover .pvt{font-size:1.2rem}.mqc{padding:14px 12px}.avp{padding:18px 16px}.rbar .mbtn{padding:9px 12px}}
  @media screen and (max-width:860px){.mr{grid-template-columns:minmax(0,1fr)}.mr>*{min-width:0}#list{display:none}#list.open{display:block}.tocbtn{display:block!important}.toc{position:static}.two,.three{grid-template-columns:1fr}article{padding:20px 16px}.gaugerow{grid-template-columns:1fr}img.side{float:none;width:100%;max-width:none;margin:0 0 10px}}
  @media print{
    .sheetbtn{display:none!important}
    @page{size:letter;margin:.55in .6in .45in}
    .ptable{display:table!important;width:100%;border-collapse:collapse}.ptable>tbody{display:table-row-group!important}.ptable>tbody>tr{display:table-row!important}.ptable>tbody>tr>td{display:table-cell!important;padding:0}
    .ptable>tfoot{display:table-footer-group!important}.ptable>tfoot td{height:.8in}
    body{background:#fff!important}
    .toc,.navrow,.tc-ver-pill,#tc-sidebar,.tc-sidebar,nav,header,.tc-user-pill,.rbar,.mqc,.ovl,.toast{display:none!important}
    .content,.mr{display:block!important;margin:0!important;padding:0!important;max-width:none!important}
    article{border:0;padding:0;font-size:12.5pt}
    article h3,.goal,.stop,.box,.instr,.ev,.stepc,table.sheet tr,.diagram,img{break-inside:avoid}
    *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
    .pfoot{display:flex;position:fixed;left:0;right:0;bottom:0;background:#fff;align-items:center;gap:12px;font-family:'Atkinson Hyperlegible',sans-serif;font-size:8.5pt;color:#55657A;border-top:1.5px solid #E6DCC8;padding-top:6px}
    .pfoot img{width:.55in;height:.55in}.pfoot div{flex:1}.pfoot b{color:#0B3F82}
  }