/* ============================================================================
   Láminas "a mano" (2026-09-20) — las 5 que Nico eligió de los mockups:
   hoja_espiral (L3-A1), nota_avisos (N2-A1), nota_checklist (N3-1),
   nota_marcada (N5-1) y postits_monitor (M3-A2). Ver lib/laminasMano.js.

   OJO html2canvas 1.4.1 (es lo que exporta el carrusel a JPG/PNG): NO soporta
   mask, clip-path, filter, mix-blend-mode, backdrop-filter, conic-gradient ni
   repeating-gradient, y crslGenerarArchivos le saca TODAS las box-shadow.
   Por eso acá: los recortes son SVG o degradés, las sombras son un degradé
   radial suelto, las líneas del renglón son <i> sueltos y los colores de los
   íconos van como atributo (un SVG serializado no hereda el CSS de afuera).
   Colores FIJOS a propósito: imitan un objeto real (papel, app, monitor).
   ============================================================================ */
.lm{background:#000;color:#000;font-family:'Inter',sans-serif;font-size:16px;line-height:normal;text-align:left}
.lm *{box-sizing:border-box}
.lm p,.lm h3,.lm s{margin:0}
.lm i,.lm em{font-style:normal}
.lm svg{display:block}

/* ---------- hoja_espiral ---------- */
.lm-hoja{background:radial-gradient(circle at 80% 10%,#4a3a28 0,#16181b 62%)}
.lm-h-lite{position:absolute;inset:0;background:radial-gradient(circle at 100% 0,rgba(255,214,150,.42) 0,rgba(255,214,150,0) 60%)}
.lm-h-sombra{position:absolute;left:40px;top:150px;width:960px;height:1260px;background:radial-gradient(ellipse at 50% 50%,rgba(0,0,0,.5) 0,rgba(0,0,0,0) 68%)}
.lm-h-pg{position:absolute;left:100px;top:80px;width:880px;height:1190px;transform:rotate(1.4deg);background:#f6efd9}
.lm-h-rule{position:absolute;left:0;right:0;height:2px;background:rgba(100,150,190,.5)}
.lm-h-mar{position:absolute;left:118px;top:0;bottom:0;width:3px;background:rgba(214,70,70,.55)}
.lm-h-hole{position:absolute;left:-18px;width:36px;height:36px;border-radius:50%;background:#1a1c1f}
.lm-h-t{position:absolute;left:170px;top:120px;width:640px;max-height:930px;overflow:hidden;font-family:'Kalam','Caveat',cursive;font-weight:400}
.lm-h-a{color:#1f2b4d}
.lm-h-b{color:#cf2f2a}
.lm-h-ring{position:absolute;left:600px;top:840px;width:230px;height:230px;border-radius:50%;border:12px solid rgba(120,80,40,.11)}
.lm-h-ast{position:absolute;left:64px;top:150px;overflow:visible}
.lm-h-dog{position:absolute;right:0;bottom:0}
.lm-h-pen{position:absolute;left:400px;top:1225px;transform:rotate(-11deg);transform-origin:0 50%}
.lm-h-vig{position:absolute;inset:0;background:radial-gradient(ellipse at 60% 45%,rgba(0,0,0,0) 50%,rgba(0,0,0,.55) 100%)}
.lm-h-glow{position:absolute;right:-220px;top:-260px;width:700px;height:700px;border-radius:50%;background:radial-gradient(circle,rgba(255,214,150,.55) 0,rgba(255,214,150,0) 68%)}
.lm-h-lamp{position:absolute;right:-30px;top:-70px;width:280px;height:150px;border-radius:0 0 140px 140px;background:linear-gradient(#34343a,#101012)}
.lm-hoja .crsl-counter{top:18px;right:44px;background:rgba(0,0,0,.45);color:#f3e8d0;border:none;font-size:22px}
.lm-hoja .crsl-footer-handle{bottom:16px;color:rgba(255,236,200,.78);font-family:'Caveat',cursive;font-size:34px;font-weight:600}

/* ---------- base "app de notas de iPhone" (avisos / checklist / marcada) ---------- */
.lm-ios{letter-spacing:-.01em}
.lm-ios .lm-tm{position:absolute;left:96px;top:36px;font:600 46px/1 'Inter',sans-serif;letter-spacing:-.02em}
.lm-di{position:absolute;left:375px;top:32px;width:330px;height:98px;border-radius:50px;background:#000}
.lm-ic{position:absolute;right:80px;top:42px;display:flex;gap:16px;align-items:center;height:44px}
.lm-nv{position:absolute;left:0;right:0;top:130px;height:110px}
.lm-bk{position:absolute;left:38px;top:0;height:110px;display:flex;align-items:center;gap:14px;font:400 52px/1 'Inter',sans-serif}
.lm-ac{position:absolute;right:52px;top:0;height:110px;display:flex;align-items:center;gap:50px}
.lm-bd{position:absolute;left:64px;right:64px;overflow:hidden}
.lm-dt{text-align:center;font:500 32px/1.3 'Inter',sans-serif;color:#8e8e93;margin-bottom:30px}
.lm-ti{font:700 76px/1.14 'Inter',sans-serif;letter-spacing:-.025em}
.lm-tx{font:400 52px/1.34 'Inter',sans-serif;margin-top:28px}
.lm-tx p{margin:0 0 22px}
.lm-li{display:flex;gap:14px}
.lm-li .lm-n{flex:none;width:54px;text-align:right}
.lm-ios .crsl-counter{top:auto;bottom:34px;right:44px;border:none;font-size:21px}
.lm-ios .crsl-footer-handle{bottom:38px;font-size:23px}
.lm-ios-dark{background:#000;color:#fff}
.lm-ios-dark .crsl-counter{background:#1c1c1e;color:#8e8e93}
.lm-ios-dark .crsl-footer-handle{color:#48484a}
.lm-ios-light{background:#fff;color:#000}
.lm-ios-light .crsl-counter{background:#efeff0;color:#8e8e93}
.lm-ios-light .crsl-footer-handle{color:#c7c7cc}

/* ---------- nota_avisos ---------- */
.lm-ban{position:absolute;left:34px;right:34px;height:206px;border-radius:52px;background:#2c2c2e;display:flex;align-items:center;gap:26px;padding:0 34px;color:#fff}
.lm-wa{flex:none;width:118px;height:118px;border-radius:28px;display:flex;align-items:center;justify-content:center}
.lm-wa-w{background:#25d366}
.lm-wa-i{background:linear-gradient(45deg,#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5)}
.lm-ban-t{flex:1;min-width:0}
.lm-ban-t b{display:block;font:600 42px/1.2 'Inter',sans-serif}
.lm-ban-t span{display:block;font:400 38px/1.25 'Inter',sans-serif;color:#d1d1d6;max-height:96px;overflow:hidden}
.lm-ban em{position:absolute;right:38px;top:26px;font:400 32px/1 'Inter',sans-serif;color:#8e8e93}

/* ---------- nota_checklist ---------- */
.lm-prg{display:flex;align-items:center;gap:22px;margin-top:24px}
.lm-br{flex:1;height:20px;border-radius:10px;background:#ececf0;overflow:hidden}
.lm-br i{display:block;height:100%;background:#e0a100;border-radius:10px}
.lm-prg span{font:600 34px/1 'Inter',sans-serif;color:#8e8e93}
.lm-ck{display:flex;gap:26px;align-items:flex-start;margin:0 0 26px}
.lm-ck-c{flex:none;width:62px;height:62px;margin-top:6px}
.lm-ck-d span{color:#8e8e93;text-decoration:line-through}
.lm-caret{display:inline-block;width:5px;height:60px;background:#e0a100;vertical-align:-10px;margin-left:4px;border-radius:3px}

/* ---------- nota_marcada ---------- */
.lm-mk{position:relative;white-space:nowrap}
.lm-mk-o{position:absolute;left:-.3em;right:-.3em;top:-.08em;bottom:-.08em;border:5px solid #ff3b30;border-radius:50%;transform:rotate(-1.2deg)}
.lm-mk-ul{position:absolute;left:0;right:0;bottom:-.1em;height:5px;border-radius:3px;background:#ff3b30;transform:rotate(-.8deg)}
.lm-nb{display:inline-flex;align-items:center;justify-content:center;width:62px;height:62px;border-radius:50%;background:#ff3b30;color:#fff;font:700 38px/1 'Inter',sans-serif;margin-left:22px;vertical-align:middle;letter-spacing:0}
.lm-leg{position:absolute;left:64px;right:64px;bottom:96px;font:600 64px/1.1 'Caveat',cursive;color:#ff3b30;transform:rotate(-1.5deg)}
.lm-leg p{margin:0 0 18px;display:flex;gap:22px;align-items:center}
.lm-leg .lm-nb{margin:0;flex:none}

/* ---------- postits_monitor ---------- */
.lm-mon{background:#cfc7b8}
.lm-mon-b{position:absolute;left:36px;top:40px;width:1008px;height:1270px;border-radius:26px;background:#0d0d0f}
.lm-mon-s{position:absolute;left:22px;top:22px;right:22px;bottom:70px;border-radius:8px;background:linear-gradient(160deg,#27345a,#141a2e);overflow:hidden}
.lm-mon-s i{position:absolute;border-radius:10px;opacity:.7}
.lm-mon-r{position:absolute;inset:0;background:linear-gradient(118deg,rgba(255,255,255,.1) 30%,rgba(255,255,255,0) 30%)}
.lm-mon-l{position:absolute;inset:0;background:radial-gradient(circle at 0 0,rgba(255,232,170,.4) 0,rgba(255,232,170,0) 55%)}
.lm-pt{position:absolute;width:var(--w);height:var(--h);transform:rotate(var(--r))}
.lm-pt-sh{position:absolute;left:-18px;right:-18px;top:6px;bottom:-30px;background:radial-gradient(ellipse at 50% 50%,rgba(0,0,0,.42) 0,rgba(0,0,0,0) 70%)}
.lm-pt-p{position:absolute;inset:0;background:linear-gradient(180deg,var(--t) 0,var(--c) 14%,var(--c) 90%,var(--d) 100%);padding:34px 24px 24px;display:flex;align-items:center;justify-content:center;text-align:center;color:#22201c;line-height:1.06;font-family:'Caveat',cursive;font-weight:700;font-size:var(--f)}
.lm-pt-p .lm-tt{display:block;width:100%;position:relative;transform:rotate(-1.5deg)}
.lm-pt-p s{text-decoration:line-through}
.lm-pt-p .lm-ok{position:absolute;right:-6px;top:-46px;font:700 74px/1 'Caveat',cursive;color:#12924a;transform:rotate(8deg)}
.lm-pt-y{--c:#ffe561;--t:#fff08d;--d:#f3d448}
.lm-pt-x1{--c:#e6d571;--t:#efe197;--d:#d8c65f}
.lm-pt-x2{--c:#dba0b8;--t:#e6b8cb;--d:#c98ba3}
.lm-pt-x3{--c:#9ed0b0;--t:#b6dec5;--d:#88bd9b}
.lm-pt-x4{--c:#9dbfdc;--t:#b6d3ea;--d:#87abc9}
.lm-pt-x5{--c:#e0a970;--t:#ebc294;--d:#cd9860}
.lm-pt-hero .lm-pt-p{font-family:'Permanent Marker','Kalam',cursive;font-weight:400;line-height:1.12}
.lm-pt-cartel{position:absolute;left:290px;top:310px;font:400 76px/1 'Permanent Marker','Kalam',cursive;color:#e02020;transform:rotate(-3deg)}
.lm-pt-fl{position:absolute;left:530px;top:395px;overflow:visible}
.lm-mon .crsl-counter{top:auto;bottom:10px;right:50px;border:none;background:rgba(0,0,0,.35);color:#f1eee6;font-size:20px}
.lm-mon .crsl-footer-handle{bottom:20px;color:#9a9aa2;font-size:22px}
