:root{
  --ink:#181818;
  --paper:#f7f6f3;
  --paper-2:#ffffff;
  --copper:#ad5a25;
  --copper-dark:#8a4419;
  --patina:#5f7d64;
  --patina-dark:#485f4c;
  --line:#dcd8d0;
  --muted:#6b6455;
  --white:#ffffff;
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans', sans-serif;
  -webkit-font-smoothing:antialiased;
}

/* ===== HEADER: ancho completo, logo + texto + búsqueda + botón ===== */
header{
  width:100%;
  display:flex;align-items:center;gap:24px;
  border-bottom:2px solid var(--ink);
  padding:18px 32px;
  background:var(--paper);
  flex-wrap:wrap;
}
.brand-block{display:flex;align-items:center;gap:14px;flex-shrink:0;}
.brand-block img{height:50px;width:auto;display:block;}
.brand-eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);margin-bottom:4px;
}
h1{
  font-family:'IBM Plex Sans',sans-serif;font-weight:600;font-size:20px;
  margin:0;letter-spacing:-.01em;color:var(--ink);
}
h1 span{color:var(--ink);}

.lookup-input{
  flex:1;min-width:180px;
  font-family:'IBM Plex Mono',monospace;font-size:14px;
  padding:12px 14px;border:1px solid var(--line);border-radius:2px;
  background:var(--white);color:var(--ink);
}
.lookup-input::placeholder{color:#a89f8a;}

/* switch de modo de sesión: Monedas / Billetes */
.mode-toggle{
  display:flex;background:var(--paper-2);border:1px solid var(--line);
  border-radius:2px;overflow:hidden;flex-shrink:0;
}
.mode-btn{
  font-family:'IBM Plex Sans',sans-serif;font-weight:600;font-size:12.5px;
  padding:10px 16px;border:none;background:transparent;color:var(--muted);
  cursor:pointer;transition:background .15s ease,color .15s ease;
}
.mode-btn.active{background:var(--ink);color:var(--white);}
.mode-btn:disabled{cursor:not-allowed;opacity:.55;}
.mode-btn:not(.active):hover:not(:disabled){background:var(--line);}

.btn{
  font-family:'IBM Plex Sans',sans-serif;font-weight:600;font-size:13.5px;
  border:none;border-radius:2px;padding:12px 20px;cursor:pointer;
  letter-spacing:.01em;transition:opacity .15s ease;flex-shrink:0;white-space:nowrap;
}
.btn:hover{opacity:.88;}
.btn:disabled{opacity:.45;cursor:not-allowed;}
.btn-copper{background:var(--copper);color:var(--white);}
.btn-patina{background:var(--patina);color:var(--white);}
.btn-ghost{background:transparent;color:var(--muted);border:1px solid var(--line);}

/* ===== contenido centrado debajo del header ===== */
.shell{max-width:1180px;margin:0 auto;padding:28px 24px 80px;}

.step{
  background:var(--paper-2);
  border:1px solid var(--line);
  border-radius:3px;
  margin-bottom:18px;
}
.step-head{padding:14px 18px;border-bottom:1px solid var(--line);}
.step-title{font-weight:600;font-size:14.5px;letter-spacing:.01em;}
.step-sub{font-size:12px;color:var(--muted);margin-top:1px;}
.step-body{padding:18px;}

/* layout macro: field-grid pareado (a la izquierda) + columna lateral fija con fotos y botones */
/* stretch (default) para que ambas columnas midan lo mismo de alto */
.content-grid{display:grid;grid-template-columns:1fr 300px;gap:28px;}

/* grilla de 2 columnas pareadas: la izquierda (título/país/metal/valor/condición) más ancha
   que la derecha (año/tipo/costo/conmemorativa/precio), que son valores cortos */
.field-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:14px 20px;}
.field{display:flex;flex-direction:column;gap:5px;}
.field label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:500;}
.field input, .field select{
  font-family:'IBM Plex Sans',sans-serif;font-size:14px;
  padding:9px 11px;border:1px solid var(--line);border-radius:2px;
  background:var(--white);color:var(--ink);width:100%;
}
.field input:disabled{background:#e2dbc9;color:#8f8875;border-style:dashed;}
.field.manual label::after{content:" · manual";color:var(--patina);font-style:italic;text-transform:none;letter-spacing:0;}

/* en modo Billetes, se ocultan los campos que solo aplican a Monedas
   (Metal, ¿Conmemorativa?) — el resto de la grilla se reacomoda solo */
.field-grid.mode-billetes .field-coins-only{display:none;}

.col-side{display:flex;flex-direction:column;height:100%;}

.photo-row{display:grid;grid-template-columns:repeat(5, 1fr);gap:8px;}
.coin-thumb{
  width:100%;aspect-ratio:1/1;border-radius:50%;
  background-size:cover;background-position:center;
  border:2px dashed var(--copper);
  display:flex;align-items:center;justify-content:center;
  font-family:'IBM Plex Mono',monospace;font-size:9px;color:var(--copper-dark);
  overflow:hidden;
}
.coin-thumb.inactive{background:transparent;border:2px dashed var(--line);color:#b7b0a0;}

/* botonera anclada al piso de la columna de fotos (queda a la altura de Condición/Precio) */
.actions-group{display:flex;gap:8px;margin-top:auto;padding-top:16px;}
.actions-group .btn{flex:1;min-width:0;padding:11px 6px;font-size:11.5px;}
.btn-icon{display:flex;align-items:center;justify-content:center;gap:5px;}
.btn-icon svg{flex-shrink:0;}

/* ===== panel CALCULAR VALOR ===== */
.calc-panel{border:1px solid var(--line);border-radius:3px;overflow:hidden;margin:14px 0;}
.calc-panel-head{
  background:var(--ink);color:var(--white);text-align:center;
  font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;
  padding:8px;
}
.calc-panel-body{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);}
.calc-col{background:var(--paper-2);display:flex;flex-direction:column;}
.calc-col-label{
  background:#efece4;text-align:center;font-size:9.5px;text-transform:uppercase;
  letter-spacing:.06em;padding:6px 4px;color:var(--muted);font-weight:600;
}
.calc-col input{
  border:none;text-align:center;font-family:'IBM Plex Mono',monospace;font-size:16px;
  padding:9px 4px;width:100%;background:transparent;color:var(--ink);
  -webkit-appearance:none;appearance:none;
}
.calc-apply-btn{
  background:var(--patina);color:var(--white);border:none;padding:8px 4px;
  font-size:10.5px;font-weight:600;cursor:pointer;text-transform:uppercase;
  letter-spacing:.04em;font-family:'IBM Plex Sans',sans-serif;
}
.calc-apply-btn:hover{opacity:.88;}

/* descripción a ancho completo, de borde a borde del bloque */
.field-full{display:flex;flex-direction:column;gap:5px;margin-top:18px;}
.field-full label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:500;}
.field-full textarea{
  width:100%;font-family:'IBM Plex Sans',sans-serif;font-size:14px;
  padding:11px 12px;border:1px solid var(--line);border-radius:2px;
  background:var(--white);color:var(--ink);min-height:90px;resize:vertical;
}
.field-full textarea:disabled{background:#e2dbc9;color:#8f8875;border-style:dashed;}

/* ===== bloque de valores fijos ===== */
.fixed-block{border-radius:3px;overflow:hidden;margin-bottom:18px;}
.fixed-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 18px;background:var(--ink);color:var(--white);flex-wrap:wrap;gap:8px;
}
.fixed-head .step-title{color:var(--white);}
.fixed-head .step-sub{color:#c9c2ad;}
.unlock{
  font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--white);
  display:flex;align-items:center;gap:6px;cursor:pointer;
}
.fixed-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(150px,1fr));gap:1px;background:var(--line);}
.fixed-cell{background:var(--paper-2);padding:12px 14px;}
.fixed-cell .k{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);display:block;margin-bottom:4px;}
.fixed-cell input{
  font-family:'IBM Plex Mono',monospace;font-size:13.5px;width:100%;
  border:1px solid transparent;background:transparent;padding:2px 4px;color:var(--ink);
}
.fixed-cell input:disabled{color:var(--ink);}
.fixed-cell.editing input{border-color:var(--copper);background:var(--white);border-radius:2px;}
.fixed-cell .dual-inputs{display:flex;gap:6px;}
.fixed-cell .dual-inputs input:first-child{width:38%;}
.fixed-cell .dual-inputs input:last-child{width:62%;}

/* subsección: valores internos de cálculo, no van al Excel */
.internal-note{
  background:#eef1ec;padding:10px 18px;font-size:11px;color:var(--patina-dark);
  font-family:'IBM Plex Mono',monospace;letter-spacing:.03em;
  border-top:2px solid var(--patina);
}
.fixed-grid.internal .fixed-cell{background:#f4f6f2;}
.fixed-grid.internal .fixed-cell input:disabled{color:var(--patina-dark);}
.fixed-grid.internal.editing .fixed-cell input{border-color:var(--patina);}

.status-msg{padding:10px 4px;font-size:13px;font-family:'IBM Plex Mono',monospace;}
.status-msg.error{color:#a3372e;}
.status-msg.ok{color:var(--patina-dark);}

footer{margin-top:20px;font-size:11.5px;color:var(--muted);text-align:center;font-family:'IBM Plex Mono',monospace;}