/* Botón flotante Herramientas de apoyo — arrastrable por la pantalla */
:root{
  --fab-support:#F4A574;
  --fab-support-hover:#EE945E;
  --fab-support-active:#E8844A;
  --fab-support-ink:#5C2E14;
  --fab-support-ring:#FFD7B8;
  --fab-support-glow:rgba(244,165,116,.45);
  --fab-support-soft:#FFE9D6;
}
body:has(.tools-fab) .access-fab{display:none}
body.practice-open .access-fab{display:flex!important}
body.practice-open .tools-fab-backdrop,
body:has(dialog#tool[open]) .tools-fab-backdrop{display:none!important}
body.practice-open .tools-fab{opacity:.4;pointer-events:none}
body:has(dialog#tool[open]) .tools-fab{opacity:.4;pointer-events:none}
.tools-fab-backdrop{
  position:fixed;
  inset:0;
  z-index:1190;
  border:0;
  padding:0;
  margin:0;
  background:rgba(15,23,42,.28);
  cursor:pointer;
  display:none;
}
.tools-fab-backdrop.is-open{display:block}

.tools-fab{
  position:fixed;
  right:24px;
  bottom:max(24px, env(safe-area-inset-bottom, 0px));
  z-index:1200;
  pointer-events:auto;
  touch-action:none;
  user-select:none;
}
.tools-fab.is-dragging{z-index:1300;cursor:grabbing}
.tools-fab:not(.is-open) .tools-fab-panel{display:none}

.tools-fab-grip{
  width:10px;
  height:14px;
  margin-right:2px;
  flex-shrink:0;
  opacity:.75;
  background-image:radial-gradient(circle, currentColor 1.15px, transparent 1.3px);
  background-size:5px 5px;
  background-position:0 0;
}

button.tools-fab-btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:52px;
  padding:12px 18px 12px 14px;
  border:0;
  border-radius:999px;
  background:var(--fab-support);
  color:var(--fab-support-ink);
  font-size:14px;
  font-weight:700;
  letter-spacing:.01em;
  box-shadow:0 8px 24px rgba(194,65,12,.38);
  outline:2px solid color-mix(in srgb, var(--fab-support-ring) 55%, transparent);
  filter:none;
  white-space:nowrap;
  cursor:grab;
  touch-action:none;
}
button.tools-fab-btn:hover:not(:disabled){
  background:var(--fab-support-hover);
  transform:scale(1.04);
  filter:none;
}
.tools-fab.is-dragging button.tools-fab-btn{
  cursor:grabbing;
  transform:scale(1.05);
  background:var(--fab-support-hover);
}
button.tools-fab-btn:active:not(:disabled){background:var(--fab-support-active);transform:scale(1)}
button.tools-fab-btn:focus-visible{outline:3px solid #1558A0;outline-offset:3px}
.tools-fab.is-open .tools-fab-ico{transform:rotate(45deg)}
.tools-fab-ico{width:22px;height:22px;flex-shrink:0;transition:transform .2s ease}

.tools-fab-panel{
  position:absolute;
  right:0;
  bottom:calc(100% + 12px);
  width:min(360px, calc(100vw - 32px));
  background:#fff;
  border:1px solid #D5DEE8;
  border-radius:16px;
  box-shadow:0 18px 48px rgba(15,23,42,.18);
  overflow:hidden;
}
.tools-fab-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:8px;
  padding:12px 12px 10px 14px;
  background:#1D4ED8;
  color:#fff;
}
.tools-fab-head h3{
  margin:0;font-size:13px;font-weight:800;letter-spacing:.04em;
  text-transform:uppercase;color:#fff;
}
.tools-fab-head p{margin:4px 0 0;font-size:12px;color:#DBEAFE;font-weight:500;text-transform:none;letter-spacing:0}
.tools-fab-close{
  width:32px;height:32px;border-radius:999px;padding:0;
  background:rgba(255,255,255,.18);color:#fff;font-size:20px;line-height:1;
}
.tools-fab-list{display:flex;flex-direction:column;gap:8px;padding:12px}
.tools-fab-list .support-card{
  width:100%;margin:0;text-align:left;
  display:flex;align-items:center;gap:10px;
}
.tools-fab-open{
  margin-left:auto;
  font-size:11px;font-weight:800;color:#64748B;
}

@media(max-width:767px){
  .tools-fab{right:16px;bottom:max(16px, env(safe-area-inset-bottom, 0px))}
}
@media(prefers-reduced-motion:reduce){
  button.tools-fab-btn:hover:not(:disabled){transform:none}
  .tools-fab.is-open .tools-fab-ico{transform:none}
}

body[data-screen=module][data-station="1"] .module-layout,
body[data-screen=module][data-station="2"] .module-layout,
body[data-screen=module][data-station="3"] .module-layout,
body[data-screen=module][data-station="4"] .module-layout,
body[data-screen=module][data-station="5"] .module-layout,
.module-layout.is-wide{
  grid-template-columns:minmax(0,1fr);
}

/* Header pedagógico de progreso · "Mi ruta de aprendizaje" */
/* Header de estado del módulo (reemplazo de la ruta) */
.avance-strip{
  --a2-ink:#071F45;
  --a2-green:#2FA36B;
  --a2-green-soft:#EAF7EF;
  --a2-mint:#F0FAF4;
  --a2-lavender:#F2F3FC;
  --a2-indigo:#4F5BD5;
  --a2-line:#D5DEEA;
  --a2-muted:#0B3A6B;
  display:grid;grid-template-columns:minmax(240px,1.15fr) minmax(200px,1fr) minmax(200px,1fr);
  gap:14px;align-items:stretch;margin:14px 0 18px;
}
.av2-ident{display:flex;gap:12px;min-width:0;align-items:flex-start}
.av2-ident-badge{
  width:44px;height:44px;flex-shrink:0;display:grid;place-items:center;
  border-radius:13px;background:#EAF3FF;border:1.5px solid #A5C6F0;color:#2B6FC3;
}
.av2-ident-badge .work-ico{width:22px;height:22px}
.av2-ident-badge .work-ico svg{width:22px;height:22px}
.av2-ident-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.av2-mod-pill{align-self:flex-start;background:var(--a2-green-soft);color:#1F7A4E;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:3px 10px;border-radius:999px}
.av2-mod-title{font-size:15px;line-height:1.25;color:var(--a2-ink);font-weight:800}
.av2-ae{font-size:12px;color:var(--a2-muted);font-weight:600}
.av2-card{
  border-radius:18px;padding:13px 15px;
  display:flex;flex-direction:column;gap:10px;
  position:relative;overflow:hidden;
}
.av2-aprendizaje{background:var(--a2-mint)}
.av2-logro{background:var(--a2-lavender)}
.av2-card-head{
  display:flex;align-items:center;gap:8px;
  font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--a2-green);
}
.av2-logro .av2-card-head{color:var(--a2-indigo)}
.av2-leaf,.av2-star{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;flex-shrink:0}
.av2-leaf{background:var(--a2-green)}
.av2-star{background:var(--a2-indigo)}
.av2-leaf .work-ico,.av2-star .icon{width:12px;height:12px}
.av2-leaf .work-ico svg{width:12px;height:12px}
.av2-apre-body{display:flex;align-items:center;gap:12px;flex:1}
.av2-book{
  width:46px;height:46px;border-radius:50%;background:#fff;border:1.5px solid var(--a2-green);
  display:grid;place-items:center;color:var(--a2-green);flex-shrink:0;
}
.av2-book .work-ico{width:22px;height:22px}
.av2-book .work-ico svg{width:22px;height:22px}
.av2-apre-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.av2-label{font-size:10px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--a2-muted)}
.av2-value{font-size:22px;font-weight:800;color:var(--a2-green);line-height:1}
.av2-bar{height:8px;border-radius:99px;background:#fff;border:1px solid var(--a2-line);overflow:hidden}
.av2-bar i{display:block;height:100%;background:var(--a2-green);border-radius:99px}
.av2-motive{font-style:italic;font-size:12px;color:#2F7A52;font-weight:700;margin:2px 0 0}
.av2-logro-body{display:flex;align-items:center;gap:12px;flex:1}
.av2-pct{
  width:52px;height:52px;border-radius:50%;background:#fff;border:2px solid #B9C2F2;
  display:grid;place-items:center;font-size:16px;font-weight:800;color:var(--a2-indigo);flex-shrink:0;
}
.av2-logro-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.av2-logro-copy b{font-size:13px;font-weight:800;color:var(--a2-ink)}
.av2-logro-copy small{font-size:11px;color:var(--a2-muted);line-height:1.25}
.av2-card::after{
  content:"";position:absolute;top:9px;right:12px;width:18px;height:18px;
  background:radial-gradient(circle at 50% 50%, color-mix(in srgb,var(--a2-green) 62%,#fff) 32%, transparent 33%) center/contain no-repeat;
  opacity:.9;
}
.av2-logro::after{
  background:radial-gradient(circle at 50% 50%, color-mix(in srgb,var(--a2-indigo) 62%,#fff) 32%, transparent 33%) center/contain no-repeat;
}
@media(max-width:900px){
  .avance-strip{
  --a2-ink:#071F45;
  --a2-green:#2FA36B;
  --a2-green-soft:#EAF7EF;
  --a2-mint:#F0FAF4;
  --a2-lavender:#F2F3FC;
  --a2-indigo:#4F5BD5;
  --a2-line:#D5DEEA;
  --a2-muted:#0B3A6B;
  display:grid;grid-template-columns:minmax(240px,1.15fr) minmax(200px,1fr) minmax(200px,1fr);
  gap:14px;align-items:stretch;margin:14px 0 18px;
}
  .av2-ident{grid-column:1 / -1}
}
@media(max-width:600px){
  .avance-strip{
  --a2-ink:#071F45;
  --a2-green:#2FA36B;
  --a2-green-soft:#EAF7EF;
  --a2-mint:#F0FAF4;
  --a2-lavender:#F2F3FC;
  --a2-indigo:#4F5BD5;
  --a2-line:#D5DEEA;
  --a2-muted:#0B3A6B;
  display:grid;grid-template-columns:minmax(240px,1.15fr) minmax(200px,1fr) minmax(200px,1fr);
  gap:14px;align-items:stretch;margin:14px 0 18px;
}
}

/* Rediseño · progresión de 6 etapas de aprendizajes (estación 2) */
.progression .learning-route{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:14px;
}
.progression .learning-step{
  position:relative;
  flex:1 1 132px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  padding:14px 12px 12px;
  border-radius:16px;
  border:1px solid #E2E8F0;
  background:#fff;
  box-shadow:0 4px 12px rgba(15,23,42,.05);
  text-align:center;
  min-height:120px;
}
.progression .learning-step:not(:last-child)::after{
  content:"";
  position:absolute;
  right:-12px;top:50%;
  transform:translateY(-50%);
  width:8px;height:8px;
  border-top:2.5px solid #B6C4D8;
  border-right:2.5px solid #B6C4D8;
  transform:translateY(-50%) rotate(45deg);
  z-index:2;
  background:#fff;
}
.progression .learning-step > span:first-child{
  width:28px;height:28px;border-radius:50%;
  display:grid;place-items:center;
  background:#EAF3FF;color:#2563EB;font-weight:800;font-size:13px;
}
.progression .learning-step:nth-child(3) > span:first-child{background:#F1EDFB;color:#7C3AED}
.progression .learning-step:nth-child(4) > span:first-child{background:#FFF4E0;color:#C47A12}
.progression .learning-step:nth-child(5) > span:first-child{background:#E6F6EE;color:#1F8A5B}
.progression .learning-step:nth-child(6) > span:first-child{background:#DFF2F4;color:#0F766E}
.progression .learning-step > .icon{width:22px;height:22px;color:#2563EB}
.progression .learning-step:nth-child(3) > .icon{color:#7C3AED}
.progression .learning-step:nth-child(4) > .icon{color:#C47A12}
.progression .learning-step:nth-child(5) > .icon{color:#1F8A5B}
.progression .learning-step:nth-child(6) > .icon{color:#0F766E}
.progression .learning-step b{font-size:13px;color:#1B3A6B}
.progression .learning-step:nth-child(3) b{color:#6D28D9}
.progression .learning-step:nth-child(4) b{color:#A15C12}
.progression .learning-step:nth-child(5) b{color:#15803D}
.progression .learning-step:nth-child(6) b{color:#0F766E}
.progression .learning-step small{
  margin-top:auto;
  font-style:normal;
  font-size:10px;font-weight:700;
  padding:3px 10px;border-radius:999px;
  background:#EAF3FF;color:#2563EB;
}
.progression .learning-step.done small{background:#E6F6EE;color:#15803D}
.progression .learning-step.active{
  border:2px solid #1F8A5B;
  background:linear-gradient(180deg,#2563EB,#1D4ED8);
  box-shadow:0 8px 20px rgba(37,99,235,.25);
}
.progression .learning-step.active b{color:#fff}
.progression .learning-step.active > .icon{color:#fff}
.progression .learning-step.active > span:first-child{background:rgba(255,255,255,.22);color:#fff}
.progression .learning-step.active small{background:#D9F4E4;color:#145A39}
.progression .info-strip{
  margin-top:14px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:14px;
  background:#EAF3FF;
  color:#1B3A6B;
  font-size:13px;
}
@media(max-width:600px){
  .progression .learning-route{flex-direction:column}
  .progression .learning-step{flex-basis:auto;min-height:auto}
  .progression .learning-step:not(:last-child)::after{display:none}
}

/* Ruta numerada de la estación 2 · UBÍCATE → REVISA → ANALIZA → ACTÚA */
.ae-route{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:0 0 16px;
  padding:0;
}
.ae-route-step{
  flex:1 1 176px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  background:#fff;
  border:1px solid #E2E8F0;
  box-shadow:0 4px 12px rgba(15,23,42,.05);
}
.ae-route-step.s1{--ar:#2563EB;--ar-soft:#EAF3FF}
.ae-route-step.s2{--ar:#1F9E5C;--ar-soft:#E7F7EF}
.ae-route-step.s3{--ar:#7C3AED;--ar-soft:#F1EDFB}
.ae-route-step.s4{--ar:#C47A12;--ar-soft:#FFF4E0}
.ae-route-step .ae-route-n{
  width:36px;height:36px;flex-shrink:0;
  display:grid;place-items:center;
  border-radius:50%;
  background:var(--ar);color:#fff;
  font-size:18px;font-weight:900;
}
.ae-route-step .ae-route-ico{
  width:34px;height:34px;flex-shrink:0;
  display:grid;place-items:center;border-radius:50%;
  background:var(--ar-soft);color:var(--ar);
}
.ae-route-step .ae-route-ico .work-ico{width:18px;height:18px}
.ae-route-step .ae-route-ico .work-ico svg{width:18px;height:18px}
.ae-route-step .ae-route-txt{display:flex;flex-direction:column;min-width:0}
.ae-route-step .ae-route-txt b{font-size:13px;color:var(--ar);font-weight:800}
.ae-route-step .ae-route-txt small{font-size:11px;color:#64748B;line-height:1.25}
.ae-route-arrow{
  width:20px;height:20px;flex-shrink:0;
  display:grid;place-items:center;
}
.ae-route-arrow span{
  width:9px;height:9px;
  border-top:2.5px solid #94A3B8;
  border-right:2.5px solid #94A3B8;
  transform:rotate(45deg);
}
@media(max-width:700px){
  .ae-route{flex-direction:column;align-items:stretch}
  .ae-route-arrow{justify-self:center;margin:0 auto;transform:rotate(90deg)}
  .ae-route-arrow span{transform:rotate(135deg)}
}

/* Orientación pedagógica · hacer ahora (experiencia del AE) */
.act-now{
  position:relative;
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin:12px 0 16px;
  padding:14px 16px;
  border-radius:16px;
  background:linear-gradient(115deg,#E7F7FF,#F0FAFF);
  border:1px solid #B7E0F7;
  border-left:5px solid #15803D;
  box-shadow:0 4px 14px rgba(15,23,42,.05);
}
.act-now-kicker{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:#0B6E3A;
}
.act-now-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:54px;
  padding:3px 10px;border-radius:999px;
  background:#15803D;color:#fff;font-size:12px;font-weight:800;
}
.act-prompt-title{color:#0B3A6B;margin-top:6px}
.act-spot-note{
  margin-top:8px;
  padding:8px 12px;
  border-radius:12px;
  background:#EAF6FF;color:#1B3FA0;
  font-size:12px;font-weight:700;
  border:1px solid #CDE7FA;
}

/* Pulido visual · motor de actividades (pedagógico e innovador) */
.act-card,
.act-task{
  border-radius:20px;
  border:1px solid #E6EEF8;
  background:linear-gradient(180deg,#FFFFFF,#F6FAFF);
  box-shadow:0 12px 32px rgba(15,23,42,.06);
  overflow:hidden;
}
.act-card .ped-step{
  border-radius:18px;
  border:1px solid #E6EEF8;
  background:#fff;
  box-shadow:0 6px 18px rgba(15,23,42,.05);
}
.act-meta-item{
  border-radius:999px;
  background:color-mix(in srgb, var(--hero-accent,#2563EB) 7%, #fff);
  border:1px solid color-mix(in srgb, var(--hero-accent,#2563EB) 22%, #fff);
}
.act-meta-item .work-ico{
  border-radius:50%;
  background:color-mix(in srgb, var(--hero-accent,#2563EB) 14%, #fff);
  color:var(--hero-accent,#2563EB);
}
.act-step-n,
.ped-num,
.ctx-step-n{
  width:30px;height:30px;
  border-radius:50%;
  background:#2563EB;
  color:#fff;
  font-weight:800;
  box-shadow:0 4px 10px rgba(37,99,235,.22);
}
.act-step-label{
  display:flex;align-items:center;gap:8px;
}
.act-spot{
  width:30px;height:30px;border-radius:50%;
  background:#fff;border:2px solid #2563EB;color:#2563EB;
  font-weight:800;font-size:11px;
  box-shadow:0 4px 10px rgba(37,99,235,.2);
  display:grid;place-items:center;
}
.act-spot.is-on{
  background:#2563EB;color:#fff;
  border-color:#2563EB;
}
.act-hotspot-alt{
  border-radius:14px;
  background:#F4F9FF;
  border:1px solid #DCEAF9;
  padding:10px 12px;
  margin-top:8px;
}
.act-hotspot-alt summary{
  font-weight:700;color:#1B3FA0;cursor:pointer;
}
.act-feedback{
  margin-top:10px;
  padding:10px 14px;
  border-radius:12px;
  background:#F0FDF4;
  border:1px solid #C6EBD2;
  color:#166534;
  font-weight:600;
}
.work-card{
  border-radius:18px;
  border:1px solid #E6EEF8;
  background:#fff;
  box-shadow:0 6px 18px rgba(15,23,42,.05);
}

/* Tipografía AulaTP · Inter + Atkinson Hyperlegible */
h1,h2,h3,h4,
.panel-title h2,
.atp-hero-copy h1,
.work-card h3,
.work-activity-head h3,
.lr-name,
.lr-head-text h3,
.lr-head-text h2,
.av2-mod-title,
.fb-figure,
.act-prompt-title,
.fb-card h3,
.soft h3,
.exam-title h2,
.ae-info h2{
  font-family:'Inter','Atkinson Hyperlegible',sans-serif;
  font-weight:800;
  letter-spacing:-.01em;
}
.work-kicker,.eyebrow,.act-now-kicker,.fb-k,.av2-label,.lr-head-lead,
.atp-hero-kicker,.atp-hero-detail,.panel-title .time{
  font-family:'Inter',sans-serif;
  font-weight:600;
}
button,
a.primary,a.outline,a.journey-button,a.back-link,a.atp-hero-back,
.tabs,.tabs > span,.badge,.lr-cta,.av-chip,.av2-mod-pill,.av-mod-pill,
.act-now-badge,.act-meta-item small,label,.option b{
  font-family:'Inter',sans-serif;
  font-weight:600;
}

/* Cambios 10 · 6 · 4 — coherencia de color por etapa y menor carga cognitiva */
.act-task > .ped-step,
.act-task > .act-decide,
.act-task > .act-observe{
  margin-bottom:14px;
}
.act-now{max-width:60rem}
.act-now .act-prompt-title{font-size:16px;line-height:1.4;max-width:54ch}
.act-flow{
  display:flex;align-items:center;justify-content:center;
  font-size:18px;color:#94A3B8;margin:4px 0;
}
.act-task .act-meta{
  display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px;padding:0;list-style:none;
}
.act-meta-item{
  display:inline-flex;align-items:center;gap:8px;
  padding:5px 12px 5px 6px;
}
.work-zone,
.act-task{padding:6px 2px}
@media(max-width:600px){
  .act-meta-item span b{font-size:11px}
}

.av2-ident-copy{max-width:calc(100% - 84px)}
}

/* av2-layout-fix-20260919 */
.avance-strip{
  gap:14px !important;
  align-items:stretch !important;
}
.av2-ident{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:12px 14px;
  align-items:center;
  position:relative;
  overflow:hidden;
  background:#fff;
  border:1.5px solid var(--a2-line);
  border-radius:18px;
  padding:14px 16px;
  box-shadow:0 8px 22px rgba(11,58,107,.06);
}
.av2-ident::after{content:none !important;display:none !important}
.av2-ident-copy{
  position:relative;
  z-index:1;
  max-width:none !important;
  min-width:0;
}
.av2-ident-art{
  width:96px;
  height:78px;
  object-fit:cover;
  object-position:center;
  border-radius:12px;
  border:1px solid #D7E3F2;
  background:#F5F9FF;
  flex-shrink:0;
  display:block;
}
.av2-card{
  border:1.5px solid var(--a2-line);
  box-shadow:0 8px 22px rgba(11,58,107,.06);
  min-height:118px;
  isolation:isolate;
}
.av2-aprendizaje{
  background:linear-gradient(180deg,#F3FBF6 0%,#EAF7EF 100%);
  border-color:#C8E6D4;
}
.av2-logro{
  background:linear-gradient(180deg,#F5F6FD 0%,#EEF0FB 100%);
  border-color:#D0D5F0;
}
.av2-ae,
.av2-label,
.av2-logro-copy small{
  color:#0B3A6B !important;
  font-weight:700;
}
.av2-mod-title,
.av2-logro-copy b{
  color:#071F45 !important;
  font-weight:900;
}
@media (max-width:900px){
  .av2-ident{grid-template-columns:auto minmax(0,1fr); grid-template-rows:auto auto}
  .av2-ident-art{grid-column:2; width:84px; height:68px; justify-self:end}
}
@media (max-width:600px){
  .av2-ident{grid-template-columns:auto minmax(0,1fr)}
  .av2-ident-art{width:72px;height:60px}
}

/* ux-icons-20260919 */
.av2-ident-badge{
  background:linear-gradient(180deg,#2F7FE8,#1A5FBE) !important;
  border-color:#1A5FBE !important;
  color:#fff !important;
  box-shadow:0 6px 14px rgba(26,95,190,.28);
}
.av2-ident-badge .work-ico{color:#fff !important}
.av2-leaf{
  background:linear-gradient(180deg,#3EC87A,#1F9A55) !important;
  box-shadow:0 4px 10px rgba(31,154,85,.28);
}
.av2-star{
  background:linear-gradient(180deg,#6B75E8,#4A55C8) !important;
  box-shadow:0 4px 10px rgba(74,85,200,.28);
}
.av2-book{
  border-color:#2F7FE8 !important;
  color:#1A5FBE !important;
  background:#EAF3FF !important;
  box-shadow:0 4px 10px rgba(47,127,232,.16);
}
.av2-ident-art{
  border:1.5px solid #8BBCF0 !important;
  box-shadow:0 6px 14px rgba(26,95,190,.16);
  filter:saturate(1.15) contrast(1.05);
}
.av2-ident,
.av2-card{
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.av2-ident:hover,
.av2-card:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(11,58,107,.12);
  border-color:#8BBCF0;
}
.av2-mod-pill{
  background:#D9F5E6 !important;
  color:#0F6B3E !important;
  font-weight:900 !important;
}
.av2-ae,
.av2-label,
.av2-logro-copy small{
  color:#0B3A6B !important;
  font-weight:750 !important;
}

/* av2-icons-color-20260919b */
.avance-strip{
  --a2-ink:#071F45;
  --a2-blue:#1E6FE8;
  --a2-blue-deep:#0B4FBF;
  --a2-green:#1F9A55;
  --a2-green-deep:#0F7A40;
  --a2-indigo:#4A55C8;
  --a2-indigo-deep:#343F9E;
  --a2-mint:#E8F8EF;
  --a2-lavender:#ECEEFB;
  --a2-line:#C9D7EA;
  --a2-muted:#0B3A6B;
}
.av2-ident{
  background:#fff;
  border:1.5px solid var(--a2-line);
  border-radius:18px;
  padding:14px 14px 14px 12px;
  box-shadow:0 8px 20px rgba(7,31,69,.06);
  align-items:center;
}
.av2-ident-badge{
  width:48px !important;height:48px !important;
  border-radius:14px !important;
  background:linear-gradient(160deg,#2F7FE8 0%,#0B4FBF 100%) !important;
  border:0 !important;
  color:#fff !important;
  box-shadow:0 8px 16px rgba(11,79,191,.28);
}
.av2-ident-badge .work-ico,
.av2-ident-badge .work-ico svg{color:#fff !important;stroke:#fff}
.av2-mod-pill{
  background:#D4F3E3 !important;
  color:#0F7A40 !important;
  font-weight:900 !important;
}
.av2-mod-title{color:#071F45 !important;font-weight:900 !important}
.av2-ae{color:#0B3A6B !important;font-weight:700 !important}
.av2-ident-art{
  width:100px !important;height:80px !important;
  object-fit:cover !important;
  border-radius:12px !important;
  border:1.5px solid #9EC4F0 !important;
  box-shadow:0 6px 14px rgba(11,79,191,.14);
}
.av2-card{
  border:1.5px solid var(--a2-line);
  box-shadow:0 8px 20px rgba(7,31,69,.06);
}
.av2-aprendizaje{
  background:linear-gradient(180deg,#F3FBF6,#E8F8EF) !important;
  border-color:#B7E2C9 !important;
}
.av2-logro{
  background:linear-gradient(180deg,#F5F6FD,#ECEEFB) !important;
  border-color:#C5CAF2 !important;
}
.av2-leaf{
  width:26px !important;height:26px !important;
  background:linear-gradient(160deg,#3EC87A,#1F9A55) !important;
  box-shadow:0 4px 10px rgba(31,154,85,.3);
}
.av2-star{
  width:26px !important;height:26px !important;
  background:linear-gradient(160deg,#6B75E8,#4A55C8) !important;
  box-shadow:0 4px 10px rgba(74,85,200,.3);
}
.av2-book{
  width:50px !important;height:50px !important;
  border:2.5px solid #1F9A55 !important;
  background:#fff !important;
  color:#1F9A55 !important;
  box-shadow:0 4px 12px rgba(31,154,85,.16);
}
.av2-pct{
  width:56px !important;height:56px !important;
  border:3px solid #4A55C8 !important;
  color:#4A55C8 !important;
  background:#fff !important;
  box-shadow:0 4px 12px rgba(74,85,200,.14);
}
.av2-pct.is-empty{border-style:dashed !important;opacity:.9}
.av2-card-head{font-weight:900 !important}
.av2-aprendizaje .av2-card-head{color:#0F7A40 !important}
.av2-logro .av2-card-head{color:#343F9E !important}
.av2-label{color:#0B3A6B !important;font-weight:800 !important}
.av2-value{color:#1F9A55 !important}
.av2-bar{border-color:#B7E2C9 !important}
.av2-bar i{background:linear-gradient(90deg,#3EC87A,#1F9A55) !important}
.av2-motive{color:#0F7A40 !important}
.av2-logro-copy b{color:#071F45 !important}
.av2-logro-copy small{color:#0B3A6B !important;font-weight:650 !important}
.av2-ident:hover,
.av2-card:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(7,31,69,.12);
}
.av2-ident,
.av2-card{transition:transform .15s ease,box-shadow .15s ease}


/* fab-pastel-float-20260919 */
.tools-fab{
  animation: fabDrift 5.5s ease-in-out infinite;
  will-change: transform;
  filter: drop-shadow(0 10px 22px var(--fab-support-glow));
}
.tools-fab.is-dragging,
.tools-fab.is-open{
  animation: none;
  filter: drop-shadow(0 12px 24px rgba(232,132,74,.35));
}
@keyframes fabDrift{
  0%,100%{ transform: translateY(0) rotate(0deg); }
  25%{ transform: translateY(-7px) rotate(-1.2deg); }
  50%{ transform: translateY(-3px) rotate(.8deg); }
  75%{ transform: translateY(-9px) rotate(-.6deg); }
}
button.tools-fab-btn{
  background: linear-gradient(160deg, #FFC69A 0%, var(--fab-support) 48%, #E8925A 100%) !important;
  color: var(--fab-support-ink) !important;
  border: 2px solid color-mix(in srgb, #fff 55%, var(--fab-support-ring)) !important;
  box-shadow:
    0 0 0 6px color-mix(in srgb, var(--fab-support-soft) 70%, transparent),
    0 12px 28px var(--fab-support-glow),
    inset 0 1px 0 rgba(255,255,255,.55) !important;
  position: relative;
  overflow: visible;
}
button.tools-fab-btn::before{
  content:"";
  position:absolute;
  inset:-10px;
  border-radius:inherit;
  background: radial-gradient(circle, var(--fab-support-glow) 0%, transparent 68%);
  opacity:.55;
  animation: fabPulse 2.8s ease-in-out infinite;
  z-index:-1;
  pointer-events:none;
}
@keyframes fabPulse{
  0%,100%{ transform:scale(.92); opacity:.35; }
  50%{ transform:scale(1.08); opacity:.7; }
}
button.tools-fab-btn:hover:not(:disabled){
  background: linear-gradient(160deg, #FFD0AB 0%, var(--fab-support-hover) 50%, #E07D42 100%) !important;
  transform: translateY(-2px) scale(1.04);
  box-shadow:
    0 0 0 8px color-mix(in srgb, var(--fab-support-soft) 75%, transparent),
    0 16px 32px rgba(232,132,74,.4),
    inset 0 1px 0 rgba(255,255,255,.65) !important;
}
.tools-fab.is-dragging button.tools-fab-btn{
  background: linear-gradient(160deg, #FFC69A 0%, var(--fab-support-hover) 100%) !important;
  transform: scale(1.05);
}
.tools-fab-label{
  color: var(--fab-support-ink) !important;
  font-weight: 800 !important;
  letter-spacing: .01em;
  text-shadow: 0 1px 0 rgba(255,255,255,.35);
}
.tools-fab-ico{
  color: var(--fab-support-ink) !important;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.35));
}
@media (prefers-reduced-motion: reduce){
  .tools-fab,
  button.tools-fab-btn::before{
    animation: none !important;
  }
}




/* fab-module45-fix-20260919 */
.tools-fab,
.tools-fab.is-fab-live{
  position:fixed !important;
  right:18px !important;
  bottom:22px !important;
  left:auto !important;
  top:auto !important;
  z-index:2147483000 !important;
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  transform:none !important;
  animation: fabFloatSoft 4.2s ease-in-out infinite !important;
  filter: drop-shadow(0 10px 24px rgba(232,132,74,.55)) !important;
}
@keyframes fabFloatSoft{
  0%,100%{ transform: translateY(0); }
  50%{ transform: translateY(-9px); }
}
.tools-fab.is-open,
.tools-fab.is-dragging{ animation:none !important; }
button.tools-fab-btn{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  min-height:56px !important;
  padding:12px 18px !important;
  border-radius:999px !important;
  border:2.5px solid #FFE0C2 !important;
  background:linear-gradient(160deg,#FFC69A 0%,#F4A574 48%,#E8925A 100%) !important;
  color:#5C2E14 !important;
  font-weight:800 !important;
  font-size:14px !important;
  line-height:1.15 !important;
  white-space:nowrap !important;
  box-shadow:0 0 0 6px rgba(255,200,150,.5), 0 12px 28px rgba(232,132,74,.45) !important;
  cursor:grab !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}
.tools-fab-label{ display:inline !important; color:#5C2E14 !important; font-weight:800 !important; }
.tools-fab-panel{ z-index:2147483001 !important; }
.tools-fab-backdrop{ z-index:2147482999 !important; }
@media (prefers-reduced-motion: reduce){
  .tools-fab{ animation:none !important; }
}


/* fab-recover-visible-20260919 */
.tools-fab,
.tools-fab.is-fab-live,
#aula-tools-fab{
  position:fixed !important;
  right:18px !important;
  bottom:22px !important;
  left:auto !important;
  top:auto !important;
  z-index:2147483000 !important;
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  animation: aulaFabFloat 4s ease-in-out infinite !important;
  filter: drop-shadow(0 12px 26px rgba(232,132,74,.55)) !important;
}
@keyframes aulaFabFloat{
  0%,100%{ transform: translateY(0); }
  50%{ transform: translateY(-10px); }
}
.tools-fab.is-open,
.tools-fab.is-dragging{ animation:none !important; }
button.tools-fab-btn,
.tools-fab .tools-fab-btn,
.tools-fab > button{
  display:inline-flex !important;
  visibility:visible !important;
  opacity:1 !important;
  align-items:center !important;
  gap:10px !important;
  min-height:58px !important;
  padding:14px 20px !important;
  border-radius:999px !important;
  border:2.5px solid #FFE0C2 !important;
  background:linear-gradient(160deg,#FFC69A 0%,#F4A574 45%,#E8925A 100%) !important;
  color:#5C2E14 !important;
  font-weight:800 !important;
  font-size:15px !important;
  box-shadow:0 0 0 7px rgba(255,200,150,.55), 0 14px 32px rgba(232,132,74,.5) !important;
  cursor:grab !important;
  pointer-events:auto !important;
}
.tools-fab-label{ display:inline !important; color:#5C2E14 !important; font-weight:800 !important; }
.tools-fab:not(.is-open) .tools-fab-panel{ display:none !important; }
.tools-fab-backdrop{ display:none !important; }
.tools-fab-backdrop.is-open{ display:block !important; }
body.practice-open .tools-fab{ opacity:.45 !important; pointer-events:none !important; animation:none !important; }
@media (prefers-reduced-motion: reduce){
  .tools-fab{ animation:none !important; }
}


/* fab-all-pages-zoom-20260919 */
.tools-fab,
.tools-fab.is-fab-live{
  position: fixed !important;
  z-index: 2147483000 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  /* no transform on outer — keeps drag + zoom stable */
  transform: none !important;
  filter: drop-shadow(0 12px 26px rgba(232,132,74,.5)) !important;
}
.tools-fab-float{
  display: inline-flex !important;
  animation: aulaFabBob 4s ease-in-out infinite !important;
  will-change: transform;
}
.tools-fab.is-open .tools-fab-float,
.tools-fab.is-dragging .tools-fab-float,
.tools-fab.is-dragging{
  animation: none !important;
}
@keyframes aulaFabBob{
  0%,100%{ transform: translateY(0); }
  50%{ transform: translateY(-10px); }
}
button.tools-fab-btn,
.tools-fab .tools-fab-btn{
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 58px !important;
  padding: 14px 20px !important;
  border-radius: 999px !important;
  border: 2.5px solid #FFE0C2 !important;
  background: linear-gradient(160deg,#FFC69A 0%,#F4A574 45%,#E8925A 100%) !important;
  color: #5C2E14 !important;
  font-weight: 800 !important;
  font-size: 15px !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  box-shadow: 0 0 0 7px rgba(255,200,150,.55), 0 14px 32px rgba(232,132,74,.5) !important;
  cursor: grab !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  -webkit-tap-highlight-color: transparent;
}
.tools-fab-label{ display:inline !important; color:#5C2E14 !important; font-weight:800 !important; }
.tools-fab-panel{
  position: absolute !important;
  z-index: 2147483001 !important;
  width: min(360px, calc(100vw - 24px)) !important;
  max-height: min(70vh, 520px) !important;
  overflow: auto !important;
  background: #fff !important;
  border: 1px solid #D5DEE8 !important;
  border-radius: 16px !important;
  box-shadow: 0 18px 48px rgba(15,23,42,.18) !important;
  display: none !important;
}
.tools-fab.is-open .tools-fab-panel{
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.tools-fab-backdrop{
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147482990 !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: rgba(15,23,42,.28) !important;
  display: none !important;
  cursor: pointer !important;
}
.tools-fab-backdrop.is-open{ display: block !important; }
.tools-fab-list{ display:flex; flex-direction:column; gap:8px; padding:12px; }
.tools-fab-list .support-card{
  width:100%; margin:0; text-align:left;
  display:flex; align-items:center; gap:10px;
  padding:12px; border-radius:12px; border:1px solid #E2E8F0;
  background:#F8FAFC; cursor:pointer;
}
.tools-fab-list .support-card:hover{ background:#EFF6FF; border-color:#BFDBFE; }
body.practice-open .tools-fab{ opacity:.4 !important; pointer-events:none !important; }
body.practice-open .tools-fab-backdrop{ display:none !important; }
body[data-screen="login"] .tools-fab,
body[data-screen="login"] .tools-fab-backdrop{ display:none !important; }
@media (prefers-reduced-motion: reduce){
  .tools-fab-float{ animation: none !important; }
}

/* tools-panel-redesign-20260919 — match HERRAMIENTAS mockup (color cards + tags) */
.tools-fab-panel{
  width:min(380px, calc(100vw - 28px)) !important;
  border:0 !important;
  border-radius:22px !important;
  box-shadow:0 22px 56px rgba(15,55,110,.22) !important;
  background:#F7FBFF !important;
  overflow:hidden !important;
}
.tools-fab-head{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:10px !important;
  padding:16px 16px 14px !important;
  background:linear-gradient(135deg,#D9ECFF 0%,#EAF4FF 55%,#F3F9FF 100%) !important;
  color:#0B2A5C !important;
  border-bottom:1px solid #C9DEF5 !important;
}
.tools-fab-head-main{display:flex;align-items:flex-start;gap:12px;min-width:0}
.tools-fab-head-ico{
  flex-shrink:0;width:42px;height:42px;border-radius:14px;
  display:grid;place-items:center;
  background:#fff;color:#0E4BB5;
  box-shadow:0 2px 8px rgba(14,75,181,.12);
}
.tools-fab-head-ico svg{width:24px;height:24px}
.tools-fab-head h3{
  margin:0 !important;
  font-size:14px !important;
  font-weight:900 !important;
  letter-spacing:.04em !important;
  text-transform:uppercase !important;
  color:#0B2A5C !important;
}
.tools-fab-head p{
  margin:4px 0 0 !important;
  font-size:12px !important;
  font-weight:500 !important;
  color:#3B5F8A !important;
  text-transform:none !important;
  letter-spacing:0 !important;
  line-height:1.35 !important;
}
.tools-fab-close{
  width:32px !important;height:32px !important;border-radius:999px !important;
  background:#fff !important;color:#0B2A5C !important;
  border:1px solid #C9DEF5 !important;
  font-size:20px !important;line-height:1 !important;
  box-shadow:0 1px 4px rgba(15,55,110,.08);
}
.tools-fab-list{
  display:flex !important;flex-direction:column !important;
  gap:10px !important;padding:14px !important;
  background:#F7FBFF !important;
}
.tools-fab-list .support-card{
  width:100% !important;margin:0 !important;text-align:left !important;
  display:grid !important;
  grid-template-columns:48px minmax(0,1fr) auto !important;
  align-items:center !important;gap:12px !important;
  padding:12px 12px 12px 10px !important;
  border-radius:16px !important;
  border:1px solid transparent !important;
  cursor:pointer !important;
  box-shadow:0 2px 10px rgba(15,55,110,.06) !important;
  transition:transform .15s ease, box-shadow .15s ease;
}
.tools-fab-list .support-card:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(15,55,110,.12) !important;
}
.tools-fab-list .support-ico{
  width:44px;height:44px;border-radius:14px;
  display:grid;place-items:center;
  background:#fff;
}
.tools-fab-list .support-ico svg{width:24px;height:24px}
.tools-fab-list .support-copy{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;
}
.tools-fab-list .support-tag{
  display:inline-flex;align-items:center;
  padding:2px 8px;border-radius:999px;
  font-size:9px;font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;line-height:1.4;
}
.tools-fab-list .support-copy b{
  font-size:14px;font-weight:800;color:#0B2A5C;line-height:1.25;
}
.tools-fab-list .support-copy small{
  font-size:11px;color:#5B7290;line-height:1.3;font-weight:500;
}
.tools-fab-list .tools-fab-open{
  margin-left:0 !important;
  display:inline-flex;align-items:center;gap:1px;
  padding:4px 7px;border-radius:999px;
  font-size:7px;font-weight:800;color:#fff !important;
  white-space:nowrap;
  line-height:1.2;
  letter-spacing:.02em;
}

.tools-fab-list .support-card.tone-ok{
  background:#E8F8EF !important;border-color:#B7E5C8 !important;
}
.tools-fab-list .support-card.tone-ok .support-ico{color:#1B8A4A;background:#D7F5E4}
.tools-fab-list .support-card.tone-ok .support-tag{background:#C6EFDA;color:#147A3E}
.tools-fab-list .support-card.tone-ok .tools-fab-open{background:#22A85A}

.tools-fab-list .support-card.tone-amber{
  background:#FFF6E8 !important;border-color:#F5D9A8 !important;
}
.tools-fab-list .support-card.tone-amber .support-ico{color:#C47A12;background:#FFE9C7}
.tools-fab-list .support-card.tone-amber .support-tag{background:#FFE0A8;color:#A86200}
.tools-fab-list .support-card.tone-amber .tools-fab-open{background:#E89B20}

.tools-fab-list .support-card.tone-violet{
  background:#F3EEFF !important;border-color:#D5C6F5 !important;
}
.tools-fab-list .support-card.tone-violet .support-ico{color:#6B3BC7;background:#E6DBFF}
.tools-fab-list .support-card.tone-violet .support-tag{background:#DDD0FF;color:#5A2FB0}
.tools-fab-list .support-card.tone-violet .tools-fab-open{background:#7B4FD6}

.tools-fab-list .support-card.tone-sky{
  background:#EAF5FF !important;border-color:#B9D9F5 !important;
}
.tools-fab-list .support-card.tone-sky .support-ico{color:#1A6FBF;background:#D5EBFF}
.tools-fab-list .support-card.tone-sky .support-tag{background:#C7E4FF;color:#0E5AA0}
.tools-fab-list .support-card.tone-sky .tools-fab-open{background:#2F8FD8}

.tools-fab-list .support-card.tone-blue{
  background:#FFF6E8 !important;border-color:#F5D9A8 !important;
}
.tools-fab-list .support-card.tone-blue .support-ico{color:#C47A12;background:#FFE9C7}
.tools-fab-list .support-card.tone-blue .support-tag{background:#FFE0A8;color:#A86200}
.tools-fab-list .support-card.tone-blue .tools-fab-open{background:#E89B20}
.tools-fab-list .support-card.tone-cyan{
  background:#F3EEFF !important;border-color:#D5C6F5 !important;
}
.tools-fab-list .support-card.tone-cyan .support-ico{color:#6B3BC7;background:#E6DBFF}
.tools-fab-list .support-card.tone-cyan .support-tag{background:#DDD0FF;color:#5A2FB0}
.tools-fab-list .support-card.tone-cyan .tools-fab-open{background:#7B4FD6}

/* abrir-as-arrow-20260919 */
.tools-fab-list .tools-fab-open{
  padding:6px !important;
  width:28px !important;
  height:28px !important;
  min-width:28px !important;
  justify-content:center !important;
  align-items:center !important;
  font-size:0 !important;
  gap:0 !important;
}
.tools-fab-list .tools-fab-open-arrow{
  width:16px;
  height:16px;
  display:block;
}

/* tools-fab-pastel-draggable-v47 */
:root{
  --fab-support:#FFD9C2;
  --fab-support-hover:#FFC9A8;
  --fab-support-active:#F5B890;
  --fab-support-ink:#6B3A22;
  --fab-support-ring:#FFEFE4;
  --fab-support-glow:rgba(255,201,168,.55);
  --fab-support-soft:#FFF4EC;
}
/* Default dock — only when not user-placed */
.tools-fab:not(.is-placed):not(.is-dragging),
.tools-fab.is-fab-live:not(.is-placed):not(.is-dragging),
#aula-tools-fab:not(.is-placed):not(.is-dragging){
  position:fixed !important;
  right:18px !important;
  bottom:max(22px, env(safe-area-inset-bottom, 0px)) !important;
  left:auto !important;
  top:auto !important;
}
/* While dragging / after place: honor left/top from JS */
.tools-fab.is-placed,
.tools-fab.is-dragging,
.tools-fab.is-fab-live.is-placed,
.tools-fab.is-fab-live.is-dragging,
#aula-tools-fab.is-placed,
#aula-tools-fab.is-dragging{
  right:auto !important;
  bottom:auto !important;
  animation:none !important;
}
.tools-fab,
.tools-fab.is-fab-live,
#aula-tools-fab{
  position:fixed !important;
  z-index:2147483000 !important;
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  filter:drop-shadow(0 10px 22px rgba(245,184,144,.45)) !important;
}
.tools-fab:not(.is-placed):not(.is-dragging):not(.is-open),
.tools-fab.is-fab-live:not(.is-placed):not(.is-dragging):not(.is-open){
  animation:aulaFabFloatSoft 4.4s ease-in-out infinite !important;
}
@keyframes aulaFabFloatSoft{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-8px); }
}
button.tools-fab-btn,
.tools-fab .tools-fab-btn,
.tools-fab-float .tools-fab-btn{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  min-height:54px !important;
  padding:12px 18px 12px 14px !important;
  border-radius:999px !important;
  border:2px solid #FFE8D6 !important;
  background:linear-gradient(165deg,#FFE6D4 0%,#FFD4B8 42%,#FFC4A0 100%) !important;
  color:#6B3A22 !important;
  font-weight:800 !important;
  font-size:14px !important;
  line-height:1.15 !important;
  white-space:nowrap !important;
  box-shadow:
    0 0 0 5px rgba(255,236,220,.7),
    0 10px 24px rgba(245,184,144,.42) !important;
  cursor:grab !important;
  transition:background .15s ease, transform .15s ease, box-shadow .15s ease !important;
}
button.tools-fab-btn:hover:not(:disabled),
.tools-fab .tools-fab-btn:hover:not(:disabled){
  background:linear-gradient(165deg,#FFDCC6 0%,#FFC9A8 45%,#F5B890 100%) !important;
  transform:scale(1.03) !important;
  box-shadow:
    0 0 0 6px rgba(255,232,214,.85),
    0 12px 28px rgba(245,184,144,.5) !important;
}
button.tools-fab-btn:active:not(:disabled),
.tools-fab.is-dragging button.tools-fab-btn{
  background:linear-gradient(165deg,#FFD0B0 0%,#F5B890 55%,#E8A678 100%) !important;
  cursor:grabbing !important;
  transform:scale(1.02) !important;
}
.tools-fab-label{
  display:inline !important;
  color:#6B3A22 !important;
  font-weight:800 !important;
}
.tools-fab-grip,
.tools-fab-btn .tools-fab-grip{
  width:10px;height:16px;flex-shrink:0;opacity:.55;
  background-image:radial-gradient(circle,#6B3A22 1.1px, transparent 1.25px);
  background-size:5px 5px;
}
@media (prefers-reduced-motion: reduce){
  .tools-fab,
  .tools-fab.is-fab-live{ animation:none !important; }
}

/* tools-fab-drag-unlock-v48 */
.tools-fab.is-placed,
.tools-fab.is-dragging,
#aula-tools-fab.is-placed,
#aula-tools-fab.is-dragging{
  left: var(--fab-left, auto) !important; /* overridden by inline !important from JS */
  top: var(--fab-top, auto) !important;
  right: auto !important;
  bottom: auto !important;
  animation: none !important;
  transform: none !important;
}


/* Práctica libre — microanimación de respiración (guía Codex) */
@keyframes pf-breathe {
  0%, 100% { transform: scale(1); box-shadow: 0 4px 14px rgba(34,168,90,.18); }
  50% { transform: scale(1.03); box-shadow: 0 8px 22px rgba(34,168,90,.28); }
}
.tools-fab-list .support-card.tone-ok {
  animation: pf-breathe 3.6s ease-in-out infinite;
  will-change: transform;
}
.tools-fab-list .support-card.tone-ok:hover {
  transform: scale(1.04);
  animation-play-state: paused;
  box-shadow: 0 10px 24px rgba(34,168,90,.32);
}
.tools-fab-list .support-card.tone-ok:active {
  transform: scale(0.98);
}
@media (prefers-reduced-motion: reduce) {
  .tools-fab-list .support-card.tone-ok { animation: none; }
}
body.reduce-motion .tools-fab-list .support-card.tone-ok { animation: none; }

.support-card.tone-ok[data-action="practice"] {
  animation: pf-breathe 3.6s ease-in-out infinite;
  will-change: transform;
}
.support-card.tone-ok[data-action="practice"]:hover {
  transform: scale(1.04);
  animation-play-state: paused;
  box-shadow: 0 10px 24px rgba(34,168,90,.32);
}
.support-card.tone-ok[data-action="practice"]:active { transform: scale(0.98); }
@media (prefers-reduced-motion: reduce) {
  .support-card.tone-ok[data-action="practice"] { animation: none; }
}