/*!
 * Calculadora Alicia — estilos
 * Todas las variables están limitadas a .ca-root para no afectar al tema.
 */

.ca-root{
  /* ---- tema clásico (por defecto) ---- */
  --ca-fondo:#000000; --ca-panel:#141414;
  --ca-tinta:#FFFFFF; --ca-suave:#9A9A9A;
  --ca-linea:#2E2E2E; --ca-linea2:#6E6E6E;
  --ca-num:#FFE81F; --ca-num-txt:#000000;
  --ca-op:#3A3A3A; --ca-op-txt:#FFFFFF;
  --ca-esp:#5B4FE8; --ca-esp-txt:#FFFFFF;
  --ca-acento:#FF6B4A;
  --ca-res:#FFE81F; --ca-sub:#FF6B4A; --ca-rest:#5BD98C; --ca-carry:#FFB84A;
  --ca-borde:#2E2E2E;

  box-sizing:border-box;
  background:var(--ca-fondo);
  color:var(--ca-tinta);
  font-family:'Nunito',-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  border-radius:16px;
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:10px;
  max-width:520px;
  margin:0 auto 1.5em;
  line-height:1.5;
}
.ca-root[data-tema="cuaderno"]{
  --ca-fondo:#FDFCF7; --ca-panel:#FFFFFF;
  --ca-tinta:#1D2433; --ca-suave:#5A6478;
  --ca-linea:#C8D8E8; --ca-linea2:#8FA9C4;
  --ca-num:#FFFFFF; --ca-num-txt:#1D2433;
  --ca-op:#EEF3FA; --ca-op-txt:#2563C9;
  --ca-esp:#2563C9; --ca-esp-txt:#FFFFFF;
  --ca-acento:#2563C9;
  --ca-res:#2563C9; --ca-sub:#D64545; --ca-rest:#1E8E5A; --ca-carry:#C77D14;
  --ca-borde:#E2E6EC;
  border:1px solid #E2E6EC;
}
.ca-root *,.ca-root *::before,.ca-root *::after{box-sizing:border-box}
.ca-root button{font-family:inherit;margin:0}

/* ---------- cabecera ---------- */
.ca-top{display:flex;align-items:center;gap:8px}
.ca-marca{font-family:'Archivo Black','Nunito',sans-serif;
  font-size:clamp(1.05rem,4.4vw,1.35rem);line-height:1.05;text-transform:uppercase;
  letter-spacing:-.01em;margin:0;font-weight:900;color:var(--ca-tinta)}
.ca-marca em{font-style:normal;color:var(--ca-acento)}
.ca-marca small{display:block;font-family:inherit;font-size:.58rem;font-weight:700;
  color:var(--ca-suave);letter-spacing:.06em;text-transform:none;margin-top:3px}
.ca-tools{margin-left:auto;display:flex;gap:6px}
.ca-mini{background:var(--ca-panel);border:1px solid var(--ca-borde);color:var(--ca-suave);
  border-radius:9px;padding:8px 11px;cursor:pointer;font-size:.78rem;font-weight:700;
  transition:border-color .18s,color .18s;white-space:nowrap;line-height:1}
.ca-mini:hover{border-color:var(--ca-acento);color:var(--ca-acento)}

/* ---------- pantalla ---------- */
.ca-pantalla{background:var(--ca-panel);border:1px solid var(--ca-borde);border-radius:12px;
  padding:12px 14px;min-height:56px;display:flex;align-items:center;
  justify-content:space-between;gap:10px;overflow:hidden}
.ca-expr{font-family:'Roboto Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:clamp(1.15rem,4.8vw,1.6rem);font-weight:500;white-space:nowrap;
  overflow-x:auto;scrollbar-width:none;margin-left:auto;color:var(--ca-tinta)}
.ca-expr::-webkit-scrollbar{display:none}
.ca-expr.ca-vacio{color:var(--ca-suave);opacity:.45}
.ca-resumen{font-size:.8rem;color:var(--ca-rest);font-weight:800;white-space:nowrap;
  flex-shrink:0;order:-1;max-width:50%;overflow:hidden;text-overflow:ellipsis}

/* ---------- hoja ---------- */
.ca-wrap{background:var(--ca-panel);border:1px solid var(--ca-borde);border-radius:12px;
  overflow:auto;position:relative;min-height:210px;max-height:min(78vh,680px);
  display:flex;padding:16px}
.ca-hoja{margin:auto}   /* centrado que no recorta al desbordar */
.ca-hoja{position:relative;font-family:'Roboto Mono',ui-monospace,Menlo,monospace;flex-shrink:0;
  background-image:linear-gradient(var(--ca-linea) 1px,transparent 1px),
                   linear-gradient(90deg,var(--ca-linea) 1px,transparent 1px);
  background-size:var(--ca-cel,34px) var(--ca-cel,34px);background-position:0 0;
  outline:1px solid var(--ca-linea);border-radius:2px}
.ca-hoja:empty{background-image:none;outline:none}
.ca-cel{position:absolute;display:grid;place-items:center;
  width:var(--ca-cel);height:var(--ca-cel);
  font-size:calc(var(--ca-cel)*.56);font-weight:500;
  animation:ca-pop .22s ease-out backwards}
@keyframes ca-pop{from{opacity:0;transform:translateY(-4px) scale(.9)}to{opacity:1;transform:none}}
.ca-cel.d{color:var(--ca-tinta);font-weight:700}
.ca-cel.res{color:var(--ca-res);font-weight:800}
.ca-cel.work{color:var(--ca-suave)}
.ca-cel.sub,.ca-cel.op{color:var(--ca-sub);font-weight:700}
.ca-cel.carry{color:var(--ca-carry);font-size:calc(var(--ca-cel)*.4);font-weight:800;align-items:end}
.ca-cel.part{color:var(--ca-suave)}
.ca-cel.part.dim{opacity:.4}
.ca-cel.rest{color:var(--ca-rest);font-weight:800}
.ca-cel.bar{color:var(--ca-linea2);font-size:calc(var(--ca-cel)*.95);font-weight:400}
.ca-cel.coma{align-items:end;font-weight:800}
.ca-cel.tagright{color:var(--ca-rest);font-family:inherit;
  font-size:calc(var(--ca-cel)*.32);font-weight:800;width:auto;
  justify-content:flex-start;padding-left:2px;white-space:nowrap}
.ca-lin{position:absolute;height:2px;background:var(--ca-tinta);border-radius:2px;
  animation:ca-grow .3s ease-out backwards;transform-origin:left}
.ca-lin.thin{height:1.5px;background:var(--ca-linea2)}
@keyframes ca-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ca-aviso{color:var(--ca-sub);font-weight:700;text-align:center;
  padding:22px 14px;font-size:.92rem;max-width:32ch}
.ca-pista{color:var(--ca-suave);text-align:center;font-size:.88rem;
  line-height:1.75;max-width:30ch}
.ca-pista b{color:var(--ca-acento)}

/* ---------- controles ---------- */
.ca-acciones{display:flex;gap:6px;flex-wrap:wrap;align-items:center;min-height:36px}
.ca-seg{display:flex;background:var(--ca-panel);border:1px solid var(--ca-borde);
  border-radius:9px;padding:3px;gap:3px}
.ca-seg button{background:none;border:none;color:var(--ca-suave);padding:6px 11px;
  border-radius:7px;cursor:pointer;font-size:.73rem;font-weight:800;
  transition:background .18s,color .18s;white-space:nowrap;line-height:1.3}
.ca-seg button.on{background:var(--ca-esp);color:var(--ca-esp-txt)}
.ca-seg .ca-lbl{color:var(--ca-suave);font-size:.64rem;font-weight:800;
  padding:6px 4px 6px 8px;text-transform:uppercase;letter-spacing:.06em;align-self:center}

/* ---------- teclado ---------- */
.ca-teclado{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.ca-teclado.ca-oculto{display:none}
.ca-teclado button{border:none;border-radius:10px;padding:16px 4px;
  font-size:1.18rem;font-weight:800;cursor:pointer;user-select:none;line-height:1.2;
  transition:transform .09s,filter .16s;background:var(--ca-op);color:var(--ca-op-txt)}
.ca-teclado button:active{transform:scale(.93)}
.ca-teclado button:hover{filter:brightness(1.15)}
.ca-teclado .n{background:var(--ca-num);color:var(--ca-num-txt)}
.ca-teclado .e{background:var(--ca-esp);color:var(--ca-esp-txt)}
.ca-teclado .w2{grid-column:span 2}
.ca-teclado .w5{grid-column:span 5}
.ca-root[data-tema="cuaderno"] .ca-teclado .n,
.ca-root[data-tema="cuaderno"] .ca-teclado button:not(.n):not(.e){border:1px solid var(--ca-borde)}

.ca-credito{text-align:center;color:var(--ca-suave);font-size:.7rem;line-height:1.7;margin:0}
.ca-credito strong{color:var(--ca-tinta);font-weight:700}

@media(max-width:400px){
  .ca-root{padding:10px;gap:8px}
  .ca-teclado{gap:5px}
  .ca-teclado button{padding:14px 3px;font-size:1.05rem}
  .ca-wrap{min-height:172px;padding:12px 8px}
}
@media(prefers-reduced-motion:reduce){
  .ca-root *{animation:none!important;transition:none!important}
}
@media print{
  .ca-root{background:#fff!important;color:#000!important;border:none;padding:0;max-width:100%}
  .ca-top,.ca-teclado,.ca-acciones,.ca-credito,.ca-resumen{display:none!important}
  .ca-wrap{border:none;background:#fff!important;min-height:0;max-height:none;overflow:visible;padding:0}
  .ca-hoja{outline:none;background-image:none!important}
  .ca-cel.d,.ca-cel.work,.ca-cel.res,.ca-cel.part,.ca-cel.rest{color:#000!important}
  .ca-cel.sub,.ca-cel.op{color:#444!important}
  .ca-lin{background:#000!important}
  .ca-pantalla{border:none;padding:0 0 8px}
  .ca-expr{color:#000!important;font-size:1.1rem}
}