/* Ferramentas interativas: teste de latência e calculadora (todas as línguas) */
.tool{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px;box-shadow:var(--shadow);margin:8px 0 24px}
.tool-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:16px}
.tool-actions .btn{cursor:pointer;border:0;font:inherit;font-weight:700}
.tool-actions .btn.ghost{border:1px solid var(--accent-ink)}
.tool-actions .btn[disabled]{opacity:.55;cursor:wait;transform:none}
.tool-status{color:var(--muted);font-size:.86rem}

/* Teste de latência */
.lat-list{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:8px}
.lat-row{display:grid;grid-template-columns:minmax(120px,1.3fr) 2fr 84px;gap:12px;align-items:center;font-size:.92rem}
.lat-row .city b{display:block;color:var(--text);font-weight:600}
.lat-row .city small{color:var(--muted);font-size:.75rem}
.lat-bar{height:10px;background:var(--panel2);border-radius:99px;overflow:hidden}
.lat-bar i{display:block;height:100%;width:0;border-radius:99px;background:var(--muted);transition:width .4s}
.lat-row.good .lat-bar i{background:var(--accent)}
.lat-row.ok .lat-bar i{background:var(--accent2)}
.lat-row.slow .lat-bar i{background:var(--warn)}
.lat-row.bad .lat-bar i{background:var(--bad)}
.lat-ms{text-align:right;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
.lat-ms small{display:block;font-weight:500;font-size:.7rem;color:var(--muted)}
.lat-row.pending .lat-ms{color:var(--muted);font-weight:500}
.lat-best{border-left:4px solid var(--accent);background:var(--panel2);border-radius:10px;padding:14px 16px;margin-top:18px}
.lat-best b{color:var(--text)}
.prov-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-top:14px}
.prov{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px}
.prov b{color:var(--text)}
.prov span{color:var(--muted);font-size:.82rem}
.prov .btn{text-align:center;margin-top:auto}

/* Calculadora */
.calc-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.calc-form label{display:flex;flex-direction:column;gap:6px;font-size:.84rem;color:var(--muted);font-weight:600}
.calc-form select,.calc-form input{font:inherit;font-size:.95rem;color:var(--text);background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:9px 10px;width:100%}
.calc-form small{font-weight:400;font-size:.74rem}
.calc-table td.num,.calc-table th.num{text-align:right;font-variant-numeric:tabular-nums}
.calc-table tr.best td{background:rgba(56,225,168,.10)}
.calc-table .tag{display:inline-block;font-size:.68rem;font-weight:800;text-transform:uppercase;background:var(--accent);color:var(--on-accent);border-radius:6px;padding:1px 7px;margin-left:6px;vertical-align:1px}
.calc-table .warn{color:var(--warn);font-size:.78rem;display:block;margin-top:3px}
.calc-table .btn{padding:6px 12px;font-size:.8rem}

/* Compartilhar (seletor, latência e calculadora) */
.share{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 14px}
.share button,.share a{font:inherit;font-size:.82rem;font-weight:600;cursor:pointer;background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:7px 12px;text-decoration:none}
.share button:hover,.share a:hover{border-color:var(--accent)}

@media (max-width:600px){
  .tool{padding:16px}
  .lat-row{grid-template-columns:1fr 70px;gap:4px 10px}
  .lat-row .lat-bar{grid-column:1/-1;grid-row:2}
}