:root{font-family:Montserrat,Arial,sans-serif;color:#292a2c;background:#faf7f1;--line:#e4ded3;--accent:#f39200}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}button,select{font:inherit}button,a,select{touch-action:manipulation}button{cursor:pointer;border:1px solid #d6cec0;border-radius:9px;background:white;color:#292a2c;padding:12px 16px;font-weight:700;min-height:44px}button:hover{background:#fff1d8}button:disabled{opacity:.6;cursor:wait}.primary-btn{background:#f39200;border-color:#f39200}.primary-btn:hover{background:#e88b00}:focus-visible{outline:3px solid #805200;outline-offset:3px}a{color:inherit}.app-shell{max-width:1320px;margin:auto;padding:24px}.hero{max-width:850px;padding:24px 0 30px}.library-link{font-size:.85rem}.brand-block{display:flex;gap:16px;align-items:center;margin-top:24px}.brand-block img{object-fit:contain}.eyebrow{font-size:.7rem;letter-spacing:.12em;font-weight:800;color:#796044;margin:0 0 7px}h1{font-size:clamp(1.8rem,4vw,2.75rem);margin:0;letter-spacing:-.04em}h2{font-size:1.18rem;margin:0 0 16px}p{line-height:1.65}.subtitle{font-size:1.2rem;margin-bottom:8px}.hero>p:last-child{color:#655f56;margin-bottom:0}.workspace{display:grid;grid-template-columns:300px minmax(0,1fr);gap:26px;align-items:start}.control-panel{background:white;border:1px solid var(--line);border-radius:14px;padding:24px;position:sticky;top:16px}.controls{display:grid;gap:18px}.controls label{display:grid;gap:8px;font-size:.86rem;font-weight:700}select{width:100%;min-height:46px;border:1px solid #d6cec0;border-radius:8px;padding:10px;background:#fff;color:inherit}.help{font-size:.78rem;color:#676157}.teacher-note{padding:14px;background:#fff6e7;border-radius:8px;font-size:.82rem;margin-bottom:0}.activity-panel{min-width:0}.preview-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:10px 0}.preview-heading h2{margin-bottom:0}#sheet-count{white-space:nowrap;font-size:.8rem;color:#6b6256}.output-actions{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}#status{font-size:.84rem;min-height:22px;margin:8px 0}.sheet{background:#fff;color:#292a2c;max-width:794px;margin:auto;padding:32px;border:1px solid #e4ded3;box-shadow:0 8px 28px #48361909}.sheet-header{border-bottom:2px solid #f39200;padding-bottom:18px}.sheet-header h2{font-size:1.6rem;margin:8px 0}.sheet-header p{margin:6px 0}.student{display:flex;gap:24px;margin-top:22px;font-size:.85rem}.student span:first-child{flex:1}.exercises{display:grid;gap:12px;margin:22px 0;padding:0;list-style:none;counter-reset:exercise}.exercise{border:1px solid #ddd7ce;border-radius:8px;padding:16px;display:flex;align-items:center;gap:16px;min-height:65px;break-inside:avoid;counter-increment:exercise}.exercise:before{content:counter(exercise,decimal-leading-zero);font-size:.72rem;color:#71695e}.words{display:flex;justify-content:space-around;flex:1;gap:14px;flex-wrap:wrap;font-size:1.2rem;font-weight:600}.blend{font-size:1.6rem;letter-spacing:.12em}.answer-line{display:inline-block;width:95px;border-bottom:1px solid #777;height:1.3em}.sheet-footer{display:flex;justify-content:space-between;font-size:.68rem;color:#6f685e;border-top:1px solid #ded8cf;padding-top:12px}.explanation{max-width:900px;margin:54px auto 0;padding:28px;background:#fff;border:1px solid var(--line);border-radius:14px}.explanation li{margin:12px 0;line-height:1.5}.explanation h2:not(:first-child){margin-top:28px}details{border-top:1px solid var(--line);padding:16px 0}summary{cursor:pointer;font-weight:600;line-height:1.5}footer{text-align:center;font-size:.8rem;color:#6e665b;padding:30px}
@media(max-width:820px){.app-shell{padding:14px}.workspace{grid-template-columns:minmax(0,1fr);gap:22px}.control-panel{position:static;padding:20px}.hero{padding-top:14px}.sheet{padding:22px}.explanation{margin-top:30px;padding:20px}.account-widget{max-width:100%}.account-widget-actions{flex-wrap:wrap}}
@media(max-width:480px){.brand-block{gap:10px}.brand-block img{width:44px;height:44px}.eyebrow{letter-spacing:.06em}.preview-heading{align-items:start}.sheet{padding:16px}.sheet-header h2{font-size:1.3rem}.student{flex-direction:column;gap:12px}.words{font-size:1rem;gap:12px}.exercise{padding:14px 10px;gap:10px}.output-actions button{width:100%}.sheet-footer{gap:10px}.blend{font-size:1.35rem}}
@page{size:A4 portrait;margin:12mm}
@media print{html,body{background:white}.app-shell{display:none!important}body.print-authorized .print-root{display:block!important}.print-root{display:none}.sheet{border:0;box-shadow:none;width:186mm;max-width:none;padding:4mm;margin:0;font-family:Montserrat,Arial,sans-serif}.sheet-header{padding-bottom:4mm}.sheet-header h2{font-size:20pt}.sheet-header p{font-size:10pt}.student{flex-direction:row;margin-top:5mm}.exercises{gap:3mm;margin:5mm 0}.exercise{min-height:16mm;padding:3mm;gap:4mm}.words{font-size:14pt;flex-wrap:nowrap}.sheet-footer{font-size:8pt}.blend{font-size:20pt}.sheet *{print-color-adjust:exact;-webkit-print-color-adjust:exact}}
.print-root{display:none}

/* Línea editorial de Calendarios y Marcadores. Solo presentación en pantalla;
   la hoja A4 conserva sus medidas y reglas de impresión. */
@media screen {
  :root{background:#f7f5f0;--line:#dedbd4;--muted:#696a67}
  html{scroll-behavior:smooth;scroll-padding-top:24px}
  body{-webkit-font-smoothing:antialiased;border-top:3px solid #f39200}
  .app-shell{max-width:1240px;padding:0 30px}
  .site-header{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line)}
  .site-brand{display:flex;align-items:center;gap:11px;text-decoration:none}
  .site-brand img{object-fit:contain}
  .site-brand>span{display:grid;gap:5px}
  .site-brand strong{font-size:24px;letter-spacing:-1.2px;line-height:1}
  .site-brand em{font-style:normal;color:#e58a00}
  .site-brand small{font-size:9px;color:#70716e;font-weight:600}
  .site-header nav{display:flex;align-items:center;gap:26px}
  .site-header nav a{font-size:11px;font-weight:700;text-decoration:none;padding:12px 0}
  .site-header nav .nav-create{padding:12px 17px;border:1px solid #c9c5bc;border-radius:6px}
  .nav-create span{color:#aa6000;margin-left:12px}
  .app-shell>.account-widget{margin:14px 0 0;border-radius:8px;background:#ffffffa8;box-shadow:none}
  .hero{max-width:none;padding:66px 0 58px;display:grid;grid-template-columns:1.12fr 1fr;gap:70px;align-items:center}
  .eyebrow{font-size:10px;letter-spacing:.14em;color:#777264;font-weight:800}
  .hero-copy>.eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:24px}
  .hero-copy>.eyebrow:before{content:'';width:28px;height:2px;background:#f39200;flex-shrink:0}
  .hero h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(50px,5.7vw,78px);line-height:1.01;letter-spacing:-3px}
  .hero h1 em{font-weight:400;color:#b96b00}
  .hero .subtitle{font-size:18px;line-height:1.55;margin:25px 0 12px;font-weight:500;letter-spacing:-.25px}
  .hero-description{font-size:13px;color:#6a6a64;max-width:425px;line-height:1.85;margin:0 0 27px}
  .hero-cta{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;padding:17px 23px;border-radius:6px;background:#292a2c;color:white;text-decoration:none;font-size:12px;font-weight:700;box-shadow:0 5px 12px #292a2c0d}
  .hero-cta:hover{background:#41423f}.hero-cta span{color:#ffc36b;font-size:18px}
  .hero-note{font-size:10px;color:#76746c;margin-top:17px}.hero-note span{margin:0 8px}
  .hero-visual{position:relative;padding:30px 34px 0;background:#ece9df;border-radius:180px 180px 12px 12px}
  .sound-specimen{background:#fffefa;padding:25px 28px 20px;transform:rotate(3deg);border:1px solid #ded9cd;box-shadow:0 22px 40px #433b2821}
  .specimen-top,.specimen-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:8px;letter-spacing:.12em;font-weight:700;color:#706a5e}
  .specimen-top{padding-bottom:15px;border-bottom:1px solid #dad4c7}
  .specimen-caption{font-family:Georgia,serif;font-size:26px;line-height:1.2;letter-spacing:-.7px;margin:23px 0 21px}
  .sound-equation{display:flex;align-items:center;justify-content:center;gap:15px}
  .sound-equation>span{display:grid;place-items:center;width:98px;height:105px;border-radius:9px;font-size:66px;font-weight:600;letter-spacing:-4px;background:#ebeede;color:#4b5d45}
  .sound-equation>span:last-child{background:#fce8c8;color:#96601d}
  .sound-equation>b{font-size:25px;font-weight:400;color:#7c786e}
  .sound-result{display:grid;justify-items:center;gap:1px;padding:10px 0 24px}
  .sound-result>span{font-size:25px;color:#8c887c}
  .sound-result strong{font-family:Georgia,serif;font-size:58px;letter-spacing:-2px;font-weight:400;line-height:1.1}
  .sound-result small{font-size:9px;color:#777264;margin-top:8px}
  .specimen-bottom{padding-top:14px;border-top:1px solid #dad4c7;font-size:7px}.specimen-bottom span:last-child{font-family:Georgia,serif;font-size:17px}
  .visual-caption{text-align:center;font-size:10px;color:#706d62;margin:25px 0 15px}
  .feature-strip{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0;gap:20px}
  .feature-strip>div{display:flex;align-items:center;justify-content:center;gap:16px;border-right:1px solid var(--line)}.feature-strip>div:last-child{border:0}
  .feature-strip strong{font-size:26px;font-weight:500;letter-spacing:-1px;white-space:nowrap}.feature-strip>div:last-child strong{font-size:19px}
  .feature-strip span{font-size:10px;line-height:1.65;color:#716f66}
  .section-heading{padding:70px 0 28px}.section-heading .eyebrow{margin-bottom:13px}
  .section-heading h2,.guide-intro h2,.faq h2{font:400 38px/1.15 Georgia,serif;letter-spacing:-1px;margin:0}
  .section-heading>p:last-child{font-size:13px;color:#71716a;margin:14px 0 0}
  .workspace{grid-template-columns:300px minmax(0,1fr);gap:22px}
  .control-panel{padding:24px;border-radius:12px;box-shadow:0 8px 20px #433b2805;top:20px}
  .panel-title{display:flex;gap:12px;align-items:center;margin:-24px -24px 24px;padding:22px 20px;background:#30332f;border-radius:11px 11px 0 0;color:white}
  .panel-title>span{font-size:11px;border:1px solid #72776b;border-radius:6px;padding:10px 8px;color:#f8c87b}
  .panel-title h2{font-size:14px;margin:0;letter-spacing:-.3px}.panel-title p{font-size:9px;color:#ccd0c7;margin:5px 0 0}
  .controls{gap:20px}.controls label{font-size:11px;gap:9px;color:#595b55}
  .controls select{border-radius:6px;min-height:46px;padding:11px;font-size:12px;color:#292a2c;font-weight:500;background:#fdfcf9}
  button{border-radius:6px;font-size:11px;min-height:44px;padding:12px 15px}
  .controls .primary-btn{margin-top:3px;min-height:48px;font-size:12px;background:#f39200;border-color:#f39200}
  .control-panel .help{font-size:10px;line-height:1.8;margin:17px 0 20px;color:#78766c}
  .teacher-note{font-size:10px;line-height:1.8;background:#f0f2eb;border-radius:7px;color:#666e5e;padding:15px}
  .teacher-note strong{display:block;color:#47513e;margin-bottom:7px;font-size:11px}
  .activity-panel{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#eeece6;padding:0 24px 16px}
  .preview-heading{margin:0 -24px;padding:22px 24px;background:white;border-bottom:1px solid var(--line)}
  .preview-heading .eyebrow{font-size:8px;margin-bottom:6px}.preview-heading h2{font-size:16px;letter-spacing:-.3px}
  #sheet-count{font-size:9px;padding:7px 10px;border:1px solid #dfdfd4;border-radius:20px;background:#f9f9f4;color:#5d6554}
  .output-actions{margin:18px 0 0;gap:8px;justify-content:flex-end}.output-actions button{font-size:10px;min-height:39px}
  #print{background:#292a2c;color:white;border-color:#292a2c}#print:hover{background:#454642}
  #status{font-size:9px;color:#6b6c63;margin:11px 0 15px;min-height:16px;line-height:1.6}
  #preview .sheet{padding:32px;border-color:#dad6ce;box-shadow:0 8px 20px #433b2810}
  #preview .sheet-header .eyebrow{font-size:8px;color:#787161;letter-spacing:.13em}
  #preview .sheet-header h2{font-family:Georgia,serif;font-size:27px;letter-spacing:-.5px;font-weight:400}
  #preview .sheet-header p:not(.eyebrow){font-size:11px;line-height:1.65}
  #preview .student{font-size:10px;margin-top:22px}
  #preview .exercise{border-color:#e4dfd5;border-radius:5px;min-height:61px}
  #preview .exercise:before{font-size:9px}
  #preview .words{font-size:16px;gap:16px}
  #preview .sheet-footer{font-size:8px;gap:12px;line-height:1.5}
  .activity-panel>.help{font-size:9px;text-align:center;margin:16px 10px 0;line-height:1.7}
  .explanation{display:grid;grid-template-columns:1fr 1fr;gap:65px;max-width:none;margin:80px 0 0;padding:56px 0;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;background:transparent}
  .guide-intro>.eyebrow{margin-bottom:18px}.guide-intro>p:last-child{font-size:13px;line-height:1.9;color:#77746c;max-width:450px;margin-top:22px}
  .benefits{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:28px 26px}
  .explanation .benefits li{margin:0;font-size:11px;line-height:1.8;color:#77746c;border-top:1px solid #d9d4c8;padding-top:15px}
  .benefits span{display:block;font-size:8px;letter-spacing:.1em;color:#8d641c;font-weight:700}
  .benefits strong{display:block;font-size:13px;line-height:1.5;color:#3c4037;margin:9px 0}
  .faq{max-width:820px;margin:65px auto 75px}.faq>.eyebrow{text-align:center}.faq h2{text-align:center;margin:15px 0 30px}.faq details{padding:20px 0}.faq summary{font-size:12px}.faq details p{font-size:12px;line-height:1.9;color:#716f66}
  footer{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:28px 0 32px;color:#6f7069}
  footer>strong{font-size:21px;letter-spacing:-1px;color:#292a2c}footer>strong span{color:#c17700}footer p,footer a{font-size:10px}footer a{text-decoration:none}
}
@media screen and (max-width:1000px){.hero{gap:36px}.hero-visual{padding:26px 20px 0}.sound-specimen{padding:22px}.feature-strip>div{gap:10px}.feature-strip strong{font-size:23px}.feature-strip>div:last-child strong{font-size:16px}.workspace{grid-template-columns:270px minmax(0,1fr)}#preview .sheet{padding:24px}#preview .words{font-size:14px}.activity-panel{padding-inline:18px}.preview-heading{margin-inline:-18px;padding-inline:18px}.explanation{gap:35px}}
@media screen and (max-width:820px){.app-shell{padding:0 20px}.site-header nav>a:not(.nav-create){display:none}.hero{padding:45px 0;gap:30px}.hero h1{font-size:55px}.hero .subtitle{font-size:15px}.hero-description{font-size:12px}.hero-copy>.eyebrow{font-size:8px}.specimen-caption{font-size:23px}.sound-equation{gap:10px}.sound-equation>span{width:75px;height:84px;font-size:52px}.sound-result strong{font-size:48px}.feature-strip{grid-template-columns:1fr 1fr;row-gap:22px}.feature-strip>div{justify-content:start;padding-left:20px}.feature-strip>div:nth-child(2){border:0}.workspace{grid-template-columns:minmax(0,1fr)}.control-panel{position:static}.controls{grid-template-columns:1fr 1fr;gap:18px}.controls select{font-size:16px}.controls button{grid-column:1/-1}.panel-title{padding:20px 24px}.control-panel .help{margin-bottom:14px}.teacher-note{font-size:11px}.section-heading{padding-top:45px}.section-heading h2,.guide-intro h2,.faq h2{font-size:32px}.activity-panel{padding-inline:22px}.preview-heading{margin-inline:-22px;padding-inline:22px}#preview .sheet{padding:30px}#preview .words{font-size:17px}.explanation{gap:35px;margin-top:50px;padding:40px 0;grid-template-columns:1fr}.guide-intro>p:last-child{max-width:650px}.faq{margin:45px auto}.site-brand small{font-size:8px}footer{flex-wrap:wrap}}
@media screen and (max-width:560px){.app-shell{padding:0 16px}.site-header{min-height:76px;gap:10px}.site-brand img{width:34px;height:34px}.site-brand{gap:7px}.site-brand strong{font-size:21px}.site-brand small{font-size:7px}.site-header nav .nav-create{font-size:9px;padding:10px}.nav-create span{margin-left:4px}.hero{grid-template-columns:1fr;padding:36px 0 30px;gap:30px}.hero h1{font-size:62px;letter-spacing:-2.5px}.hero-copy>.eyebrow{font-size:8px;margin-bottom:21px}.hero .subtitle{font-size:17px;margin-top:20px}.hero-description{font-size:12px;max-width:360px}.hero-cta{padding:15px 20px;font-size:12px}.hero-note{font-size:9px}.hero-visual{max-width:320px;width:100%;justify-self:center;padding:20px 30px 0;border-radius:135px 135px 10px 10px}.sound-specimen{padding:19px}.specimen-caption{font-size:23px;margin:16px 0}.specimen-top{font-size:7px;padding-bottom:12px}.sound-equation>span{width:76px;height:77px;font-size:49px}.sound-result{padding-bottom:14px}.sound-result strong{font-size:44px}.specimen-bottom{font-size:6px}.visual-caption{font-size:8px;margin-top:21px}.feature-strip{gap:18px 10px;padding:21px 0}.feature-strip>div{padding-left:4px;gap:10px}.feature-strip strong{font-size:23px}.feature-strip>div:last-child strong{font-size:15px}.feature-strip span{font-size:8px}.section-heading{padding:36px 0 22px}.section-heading h2{font-size:31px;max-width:300px}.section-heading>p:last-child{font-size:11px}.section-heading .eyebrow{font-size:8px}.control-panel{padding:20px}.panel-title{margin:-20px -20px 20px;padding:20px}.controls{gap:16px;grid-template-columns:1fr}.controls label{font-size:11px}.controls button{font-size:12px}.activity-panel{padding:0 12px 15px}.preview-heading{padding:18px 15px;margin:0 -12px}.preview-heading h2{font-size:15px}#sheet-count{font-size:8px}.output-actions{gap:8px;margin-top:13px}.output-actions button{width:auto;flex:1;font-size:9px;padding:10px 7px}#status{font-size:9px;margin-block:10px}#preview .sheet{padding:18px 12px}#preview .sheet-header h2{font-size:24px}#preview .sheet-header p:not(.eyebrow){font-size:10px}#preview .student{font-size:9px;gap:12px}#preview .words{font-size:13px;gap:12px}#preview .exercise{min-height:64px;padding:12px 9px;gap:9px}#preview .sheet-footer{font-size:7px}#preview .blend{font-size:20px}.answer-line{width:70px}.activity-panel>.help{font-size:8px}.benefits{gap:25px 20px}.benefits strong{font-size:12px}.explanation .benefits li{font-size:10px}.guide-intro h2{font-size:32px}.guide-intro>p:last-child{font-size:12px}.faq h2{font-size:30px}.faq summary{font-size:12px}.faq details p{font-size:11px}footer{justify-content:center;text-align:center;gap:7px;flex-direction:column}footer p{margin:4px 0 10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media screen {
  .control-panel .output-actions{display:grid;grid-template-columns:1fr;gap:9px;margin:14px 0 0;padding-top:14px;border-top:1px solid var(--line)}
  .control-panel .output-actions button{width:100%;min-height:44px;font-size:12px}
  .control-panel #pdf{background:#292a2c;color:#fff;border-color:#292a2c}
  .control-panel #pdf:hover{background:#454642}
  .control-panel #print{background:white;color:#292a2c;border-color:#d6cec0}
  .control-panel #print:hover{background:#fff1d8}
  .activity-panel #status{margin-top:17px}
}

/* Tipografía de la ficha: color por fila, nunca por respuesta. */
.sheet .sheet-header h2,
#preview .sheet-header h2{font-family:Montserrat,Arial,sans-serif;font-weight:800;letter-spacing:-.8px;color:#176a70;font-size:29px;line-height:1.2}
.sheet .sheet-header .eyebrow,
#preview .sheet-header .eyebrow{color:#a35d00;font-weight:800;letter-spacing:.14em}
.sheet .words,
#preview .words{font-family:Montserrat,Arial,sans-serif;font-weight:750;font-size:20px;letter-spacing:-.25px}
.sheet .exercise:nth-child(3n+1){--sound-ink:#176a70;--sound-tint:#edf6f5}
.sheet .exercise:nth-child(3n+2){--sound-ink:#76508e;--sound-tint:#f5eff8}
.sheet .exercise:nth-child(3n){--sound-ink:#2d639a;--sound-tint:#eef4fa}
.sheet .exercise .words,.sheet .exercise .blend{color:var(--sound-ink)}
.sheet .exercise:before{color:var(--sound-ink);background:var(--sound-tint);font-weight:800;border-radius:7px;min-width:26px;height:28px;display:grid;place-items:center}
.sheet .blend{font-family:Montserrat,Arial,sans-serif;font-weight:750}
@media screen and (max-width:1000px) and (min-width:821px){#preview .words{font-size:16px}}
@media screen and (max-width:560px){#preview .sheet-header h2{font-size:25px}#preview .words{font-size:15px}#preview .exercise:before{min-width:21px;height:25px}#preview .blend{font-size:20px}}
@media print{.sheet .sheet-header h2{font-size:22pt}.sheet .words{font-size:15pt}.sheet .exercise:before{min-width:7mm;height:7mm}}

/* Colonnes de largeur identique et identification soignée. */
.sheet .words,#preview .words{display:grid;grid-template-columns:repeat(var(--word-count,3),minmax(0,1fr));align-items:center;gap:0;width:100%;min-width:0;text-align:center}
.sheet .words>span{display:block;text-align:center;min-width:0;padding:4px 3px;overflow-wrap:anywhere}
.sheet .student,#preview .student{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(0,1fr);gap:32px;margin-top:25px;align-items:end}
.student-field{display:grid;gap:6px;min-width:0}
.student-field>span{font-size:9px;font-weight:700;letter-spacing:.12em;color:#66716f}
.student-field>i{display:block;height:22px;border-bottom:1px solid #a8b5b1}
@media screen and (max-width:560px){.sheet .student,#preview .student{gap:18px;margin-top:20px}.student-field>span{font-size:8px}.student-field>i{height:21px}.sheet .words>span{padding-inline:2px}}
@media print{.sheet .student{gap:10mm;margin-top:6mm}.student-field>span{font-size:8pt}.student-field>i{height:6mm}}

/* Fichas visuales: imágenes legibles y páginas equilibradas. */
#preview{display:grid;gap:22px}
.sheet .picture-options,#preview .picture-options{gap:10px}
.picture-option{display:grid;place-items:center;min-width:0;padding:3px}
.picture-option img{display:block;width:90px;height:90px;max-width:100%;overflow:visible}
.sheet.picture-sheet .exercise,#preview .picture-sheet .exercise{min-height:110px;padding:7px 12px}
#teacher-reference{background:#fff;border:1px solid #dedbd4;border-radius:7px;padding:14px;margin-top:20px;color:#596354}
#teacher-reference summary{font-size:11px;line-height:1.6}
#teacher-reference p,#teacher-reference li{font-size:11px;line-height:1.8}
#teacher-reference ol{padding-left:22px}
@media screen and (max-width:560px){.picture-option img{width:66px;height:66px}.sheet .picture-options,#preview .picture-options{gap:3px}.sheet.picture-sheet .exercise,#preview .picture-sheet .exercise{padding:6px;min-height:83px;gap:4px}.picture-option{padding:0}}
@media print{.print-root .sheet{break-after:page;page-break-after:always}.print-root .sheet:last-child{break-after:auto;page-break-after:auto}.sheet.picture-sheet .exercise{height:26mm;min-height:26mm;padding:1mm 3mm}.picture-option img{width:23mm;height:23mm}.picture-sheet .exercises{gap:3mm}#teacher-reference{display:none!important}}

.picture-option img{object-fit:contain;background:#fff;}
@media print{
  .sheet.oral-sheet .exercise{height:16mm;min-height:16mm;padding:2mm 3mm}
  .sheet.oral-sheet .blend{font-size:18pt;line-height:1.2}
  .sheet.oral-sheet .exercises{gap:2.5mm}
}

/* La vista previa es una hoja A4 completa, escalada como una unidad. */
@media screen{
  #preview{justify-items:stretch}
  #preview .a4-preview{position:relative;width:100%;max-width:794px;aspect-ratio:210/297;margin:0 auto;min-width:0;background:white;box-shadow:0 8px 20px #433b2810}
  #preview .a4-preview>.sheet{position:absolute;left:0;top:0;width:794px;max-width:none;height:1122.942857px;margin:0;padding:60px;box-sizing:border-box;transform:scale(var(--sheet-scale,1));transform-origin:top left;box-shadow:none}
  #preview .a4-preview .sheet-header{padding-bottom:18px}
  #preview .a4-preview .sheet-header h2{font-size:29px;line-height:1.2;margin:8px 0}
  #preview .a4-preview .sheet-header .eyebrow{font-size:11px}
  #preview .a4-preview .sheet-header p:not(.eyebrow){font-size:12px;line-height:1.65}
  #preview .a4-preview .student{gap:32px;margin-top:25px;grid-template-columns:minmax(0,2.1fr) minmax(0,1fr)}
  #preview .a4-preview .student-field>span{font-size:9px}
  #preview .a4-preview .student-field>i{height:22px}
  #preview .a4-preview .exercises{gap:10px;margin:20px 0}
  #preview .a4-preview .picture-sheet .exercise{height:106px;min-height:106px;padding:7px 12px;gap:16px}
  #preview .a4-preview .oral-sheet .exercise{height:57px;min-height:57px;padding:8px 12px;gap:16px}
  #preview .a4-preview .exercise:before{font-size:10px;min-width:26px;height:28px}
  #preview .a4-preview .picture-options{gap:10px}
  #preview .a4-preview .picture-option{padding:3px}
  #preview .a4-preview .picture-option img{width:90px;height:90px}
  #preview .a4-preview .blend{font-size:24px;line-height:1.2}
  #preview .a4-preview .answer-line{width:95px}
  #preview .a4-preview .sheet-footer{font-size:10px;line-height:1.5;padding-top:12px;gap:12px}
}

/* La propuesta original: palabra completa acompañada por su imagen. */
.sheet .picture-option{padding:0;gap:3px;align-content:center}
.sheet .picture-word{display:block;text-align:center;font:700 14px/1.2 Montserrat,Arial,sans-serif;letter-spacing:0;color:var(--sound-ink);white-space:nowrap}
@media screen{
  #preview .a4-preview .picture-option{padding:0;gap:3px}
  #preview .a4-preview .picture-option img{width:70px;height:70px}
  #preview .a4-preview .picture-word{font-size:14px;line-height:1.2}
}
@media print{
  .sheet .picture-option img{width:18mm;height:18mm}
  .sheet .picture-word{font-size:10pt;line-height:1.2}
}

/* Portada: una muestra del material como protagonista. */
@media screen{
  .hero-showcase{position:relative;isolation:isolate;margin:25px -20px 0;padding:62px 30px 58px;grid-template-columns:1fr 1fr;gap:24px;border-radius:24px;background:radial-gradient(ellipse at 88% 28%,#ffebc4 0,transparent 49%),linear-gradient(120deg,#fffdf8,#f5f1e7)}
  .hero-showcase .hero-copy{position:relative;z-index:2}
  .hero-showcase .hero-copy>.eyebrow{font-size:9px;line-height:1.7;letter-spacing:.09em;color:#657061;gap:8px;margin:0 0 24px;max-width:440px}
  .hero-showcase .hero-copy>.eyebrow:before{display:none}
  .hero-dot{width:7px;height:7px;background:#f39200;border-radius:50%;flex-shrink:0}
  .hero-showcase h1{font-family:Montserrat,Arial,sans-serif;font-size:clamp(46px,5.5vw,70px);font-weight:850;line-height:1.03;letter-spacing:-3.8px;color:#263d35}
  .hero-showcase h1 em{font-style:normal;font-weight:850;color:#c16b00}
  .title-dot{color:#f39200}
  .hero-showcase .subtitle{font-size:23px;font-weight:600;line-height:1.4;letter-spacing:-.7px;color:#38483e;margin:25px 0 16px}
  .hero-showcase .hero-description{font-size:13px;line-height:1.85;max-width:420px;color:#727467;margin-bottom:26px}
  .hero-actions{display:flex;flex-wrap:wrap;gap:19px;align-items:center}
  .hero-showcase .hero-cta{background:#f39200;color:#292a2c;padding:18px 21px;font-size:12px;gap:24px;border-radius:9px;box-shadow:0 9px 22px #cc7b0020}
  .hero-showcase .hero-cta:hover{background:#ffad2d;transform:translateY(-2px)}
  .hero-showcase .hero-cta span{color:#292a2c}
  .hero-guide{font-size:10px;font-weight:700;color:#52624e;text-decoration:none;padding:12px 0;border-bottom:1px solid #c4ccb9}
  .hero-guide span{margin-left:7px}
  .hero-assurances{display:flex;flex-wrap:wrap;gap:8px 15px;margin-top:24px;color:#71776a;font-size:9px}
  .hero-assurances span{display:flex;gap:7px;align-items:center}.hero-assurances span:before{content:'✓';color:#537754;font-weight:800}
  .hero-art{position:relative;min-width:0;width:100%;aspect-ratio:1/1.09;container-type:inline-size}
  .hero-orbit{position:absolute;inset:7% -1% 5% 1%;border-radius:50%;background:linear-gradient(145deg,#f9d48f,#ede7ce);border:1px solid #e6cca180}
  .hero-paper{position:absolute;top:3%;left:16%;width:66%;aspect-ratio:210/297;padding:5%;background:white;border:1px solid #dcd9cc;box-shadow:8px 22px 35px #68532321;transform:rotate(5deg)}
  .paper-brand{font-size:2.2cqw;font-weight:850;letter-spacing:-.03em;color:#304336;display:flex;align-items:center;justify-content:space-between;padding-bottom:3%;border-bottom:1px solid #e9e3d5}
  .paper-brand span{font-size:1cqw;letter-spacing:.06em;color:#81867a}
  .paper-kicker{font-size:1.1cqw;letter-spacing:.09em;color:#b27020;margin:8% 0 3%;font-weight:800}
  .hero-paper h2{font:800 4.2cqw/1.2 Montserrat,Arial,sans-serif;letter-spacing:-.06em;color:#176a70;margin:0}
  .paper-instruction{font-size:1.5cqw;color:#778078;margin:4% 0 6%}
  .paper-identification{display:grid;grid-template-columns:2fr 1fr;gap:15%;font-size:1.1cqw;color:#7b8177;margin-bottom:7%;padding-bottom:4%;border-bottom:2px solid #f2b753}
  .paper-identification span{border-bottom:1px solid #cbd3c8;padding-bottom:6%}
  .paper-examples{display:grid;gap:9px}
  .paper-examples>div{display:grid;grid-template-columns:9% 1fr 1fr;gap:5%;align-items:center;padding:3%;border:1px solid #e6e1d8;border-radius:5px}
  .paper-examples b{font-size:1.3cqw;color:#617c74}
  .paper-examples figure{margin:0;text-align:center;min-width:0}
  .paper-examples img{width:100%;height:12cqw;object-fit:contain;display:block}
  .paper-examples figcaption{font-size:1.8cqw;line-height:1.5;font-weight:750;color:#386660}
  .paper-signoff{font-size:1cqw;color:#929489;border-top:1px solid #e4e5dc;margin-top:8%;padding-top:4%}
  .hero-letter{position:absolute;left:-2%;top:13%;width:30%;padding:4%;border-radius:13px;background:#325547;color:#fff;transform:rotate(-8deg);box-shadow:0 16px 25px #21403020}
  .hero-letter>span{display:block;font-size:1.15cqw;letter-spacing:.1em;color:#d8e5c6}
  .hero-letter>strong{font-size:12cqw;letter-spacing:-.07em;line-height:1.3;font-weight:800;display:block;color:#ffcc77}
  .hero-letter>strong span{font-size:8cqw;margin-left:4%}
  .hero-letter small{font-size:1.2cqw;display:block;color:#e2e9d9;line-height:1.5}
  .hero-butterfly{position:absolute;right:-1%;top:52%;width:28%;padding:3%;border-radius:14px;background:#fff;box-shadow:0 12px 32px #54442624;transform:rotate(-9deg);text-align:center;border:1px solid #e9dfc9}
  .hero-butterfly img{width:100%;height:auto;display:block}.hero-butterfly>span{display:block;font-size:2.2cqw;font-weight:750;color:#aa6617}
  .hero-ready{position:absolute;left:7%;bottom:-1%;display:flex;align-items:center;gap:12px;padding:15px 19px;background:#fffefa;border:1px solid #e6dfcd;border-radius:12px;box-shadow:0 10px 20px #53472d0a}
  .hero-ready>span{display:grid;place-items:center;background:#eaf0df;color:#597147;border-radius:50%;width:30px;height:30px;font-weight:800;font-size:14px}
  .hero-ready strong{display:block;color:#42503e;font-size:11px}.hero-ready small{font-size:9px;color:#85877a;display:block;margin-top:5px}
  .hero-showcase+.feature-strip{margin-top:28px}
}
@media screen and (max-width:1000px){.hero-showcase{padding:40px 20px;gap:15px}.hero-showcase h1{font-size:55px;letter-spacing:-3px}.hero-showcase .subtitle{font-size:20px}.hero-ready{padding:10px 13px;gap:8px}.hero-ready strong{font-size:10px}.hero-ready small{font-size:8px}}
@media screen and (max-width:820px){.hero-showcase{grid-template-columns:1fr;margin:20px -6px 0;padding:36px 24px;gap:34px}.hero-showcase .hero-copy{max-width:570px}.hero-showcase h1{font-size:64px}.hero-showcase .hero-description{max-width:460px}.hero-art{max-width:480px;justify-self:center}.hero-showcase .hero-copy>.eyebrow{max-width:450px}.hero-ready strong{font-size:11px}.hero-ready small{font-size:9px}}
@media screen and (max-width:480px){.hero-showcase{padding:28px 18px 35px;margin-inline:-6px;border-radius:16px;gap:26px}.hero-showcase h1{font-size:clamp(38px,10.5vw,50px);letter-spacing:-2.6px}.hero-showcase .hero-copy>.eyebrow{font-size:7px;margin-bottom:18px;letter-spacing:.07em}.hero-showcase .subtitle{font-size:20px;line-height:1.4;margin:20px 0 12px}.hero-showcase .hero-description{font-size:12px}.hero-actions{gap:10px}.hero-showcase .hero-cta{font-size:11px;padding:16px 18px;gap:25px}.hero-guide{font-size:10px}.hero-assurances{font-size:8px;gap:8px 12px;margin-top:18px}.hero-ready{padding:10px 12px;left:5%;bottom:-2%;gap:8px}.hero-ready>span{width:24px;height:24px;font-size:11px}.hero-ready strong{font-size:9px}.hero-ready small{font-size:8px}.paper-examples{gap:6px}.hero-letter{border-radius:9px}.hero-butterfly{border-radius:10px}}

/* Centrar la ficha incluso si el navegador cambia los márgenes de impresión. */
@media print{
  .print-root{width:100%;margin:0;padding:0}
  .print-root .sheet{margin-left:auto;margin-right:auto}
}
.export-status{font-size:12px;line-height:1.6;padding:12px;border:1px solid #c6d8ca;border-radius:7px;background:#edf5ef;color:#284b38}.export-status.is-error{background:#fff1ed;border-color:#ecc7b9;color:#8a3422}