/* Herramientas interactivas: estilos compartidos (usa las variables de landing.css) */
.tool-card{background:var(--surface,#fff);border:1px solid var(--line,#e5e7eb);border-radius:var(--radius-lg,12px);padding:22px;margin:0 0 28px;box-shadow:var(--shadow-sm,0 1px 3px rgba(0,0,0,.08))}
.tool-card>h2:first-child{margin-top:0}
.tool-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px 20px}
.tool-grid+.tool-grid{margin-top:16px}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>label,.field>.label{font-size:.85rem;font-weight:700;color:var(--muted-dark,#444)}
.field input,.field select{font:inherit;width:100%;padding:10px 12px;min-height:44px;border:1px solid var(--line,#d6d3d1);border-radius:var(--radius-md,8px);background:#fff;color:var(--text,#1f2937)}
.field input:focus,.field select:focus,.seg button:focus-visible,.tool-btn:focus-visible{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.field .hint{font-size:.78rem;color:var(--muted,#6b7280);line-height:1.4}
.seg{display:inline-flex;flex-wrap:wrap;border:1px solid var(--line,#d6d3d1);border-radius:999px;overflow:hidden;background:#fff}
.seg button{font:inherit;font-size:.88rem;font-weight:600;padding:9px 16px;min-height:40px;border:0;background:transparent;color:var(--muted-dark,#444);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--primary);color:#fff}
.tool-btn{font:inherit;font-weight:700;padding:11px 20px;min-height:44px;border-radius:var(--radius-md,8px);border:1px solid var(--primary);background:var(--primary);color:#fff;cursor:pointer}
.tool-btn:hover{background:var(--primary-dark)}
.tool-btn.secondary{background:#fff;color:var(--primary-dark)}
.tool-btn.secondary:hover{background:var(--primary-soft)}
.tool-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.tool-result{margin-top:22px;padding:18px 20px;background:var(--primary-xsoft,#f8fafc);border:1px solid var(--primary-soft,#e5e7eb);border-radius:var(--radius-lg,12px)}
.tool-result h3{margin:0 0 12px;font-size:1rem}
.result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px 18px}
.result-item .num{display:block;font-size:1.65rem;font-weight:800;line-height:1.15;color:var(--primary-dark)}
.result-item .lbl{display:block;font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted,#6b7280);margin-top:2px}
.tool-note{font-size:.88rem;color:var(--muted-dark,#444);line-height:1.6;margin:12px 0 0}
.tool-warn{font-size:.88rem;line-height:1.55;margin:12px 0 0;padding:10px 14px;border-radius:var(--radius-md,8px);background:#fff7ed;border:1px solid #fed7aa;color:#9a3412}
.tool-list{margin:12px 0 0;padding-left:20px;font-size:.93rem;line-height:1.6}
.tool-list li{margin:4px 0}
.tool-table-wrap{overflow-x:auto;margin-top:14px}
.tool-table{width:100%;border-collapse:collapse;font-size:.9rem}
.tool-table th,.tool-table td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line,#e5e7eb);vertical-align:top}
.tool-table th{font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted,#6b7280)}
.tool-table td.num,.tool-table th.num{text-align:right;white-space:nowrap}
.tool-table tr.best td{font-weight:700;background:var(--primary-soft)}
.bars{margin-top:14px}
.bar-row{display:grid;grid-template-columns:minmax(110px,190px) 1fr 84px;gap:10px;align-items:center;margin:9px 0;font-size:.88rem}
.bar-track{background:var(--line-soft,#f1f5f9);border-radius:7px;height:14px;overflow:hidden}
.bar-fill{height:100%;background:var(--primary);border-radius:7px;min-width:2px;transition:width .25s}
.bar-row.best .bar-fill{background:var(--primary-dark)}
.bar-row .val{text-align:right;font-weight:700;white-space:nowrap}
.scale{position:relative;margin:30px 0 8px}
.scale-track{display:flex;height:16px;border-radius:8px;overflow:hidden;border:1px solid var(--line,#e5e7eb)}
.scale-seg{flex:1}
.scale-pin{position:absolute;top:-9px;width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-top:9px solid var(--text,#111);transform:translateX(-7px)}
.scale-labels{display:flex;justify-content:space-between;font-size:.72rem;color:var(--muted,#6b7280);margin-top:4px}
.step-list{list-style:none;margin:16px 0 0;padding:0}
.step-list li{display:grid;grid-template-columns:64px 1fr;gap:12px;padding:10px 12px;border:1px solid var(--line,#e5e7eb);border-radius:var(--radius-md,8px);margin:8px 0;background:#fff}
.step-list li.done{opacity:.55}
.step-list li.now{border-color:var(--primary);background:var(--primary-soft);box-shadow:0 0 0 2px var(--primary-soft)}
.step-time{font-weight:800;font-variant-numeric:tabular-nums;color:var(--primary-dark)}
.timer-display{font-size:3rem;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;color:var(--primary-dark);margin:6px 0}
.timer-target{font-size:1.1rem;font-weight:700;margin:4px 0 0}
.choice-list{display:grid;gap:8px;margin-top:10px}
.choice-list label{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line,#e5e7eb);border-radius:var(--radius-md,8px);cursor:pointer;font-size:.93rem;line-height:1.45;background:#fff}
.choice-list input{margin-top:3px;min-height:0;width:auto}
.choice-list label:has(input:checked){border-color:var(--primary);background:var(--primary-soft)}
.hub-tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin:8px 0 28px}
.hub-tool{display:flex;flex-direction:column;gap:8px;padding:20px;border:1px solid var(--line,#e5e7eb);border-radius:var(--radius-lg,12px);background:var(--surface,#fff);box-shadow:var(--shadow-sm,0 1px 3px rgba(0,0,0,.08));color:inherit}
.hub-tool:hover{border-color:var(--primary);box-shadow:var(--shadow,0 2px 8px rgba(0,0,0,.1))}
.hub-tool strong{font-size:1.05rem;color:var(--primary-dark)}
.hub-tool span{font-size:.9rem;color:var(--muted-dark,#444);line-height:1.5}
.hub-tool em{margin-top:auto;font-style:normal;font-weight:700;font-size:.85rem;color:var(--primary)}
@media (max-width:560px){
  .bar-row{grid-template-columns:1fr 84px}
  .bar-row .bar-track{grid-column:1/-1;order:3}
  .step-list li{grid-template-columns:54px 1fr}
  .timer-display{font-size:2.4rem}
}
@media print{.tool-actions,.seg{display:none}}