.ra-tool{
  --ra-bg:#f7f8fa;
  --ra-card:#fff;
  --ra-text:#111827;
  --ra-muted:#667085;
  --ra-line:#e5e7eb;
  --ra-accent:#111827;
  --ra-soft:#eef2f6;
  color:var(--ra-text);
  font-family:inherit;
}
.ra-tool *{box-sizing:border-box}
.ra-card{
  max-width:860px;
  margin:24px auto;
  background:var(--ra-card);
  border:1px solid var(--ra-line);
  border-radius:24px;
  box-shadow:0 18px 50px rgba(17,24,39,.06);
  overflow:hidden;
}
.ra-tabs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--ra-line);background:#fbfbfc}
.ra-tab{appearance:none;border:0;background:transparent;padding:17px 12px;font:inherit;font-weight:750;color:var(--ra-muted);cursor:pointer}
.ra-tab.is-active{background:#fff;color:var(--ra-text);box-shadow:inset 0 -2px 0 var(--ra-text)}
.ra-panel{padding:28px}
.ra-quick{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.ra-quick button,.ra-copy{border:1px solid var(--ra-line);background:#fff;border-radius:999px;padding:8px 12px;font:inherit;font-weight:650;cursor:pointer}
.ra-quick button:hover,.ra-copy:hover{background:var(--ra-soft)}
.ra-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ra-tool label{display:block;font-size:.88rem;color:var(--ra-muted);font-weight:700;margin-bottom:7px}
.ra-field{background:#fff;border:1px solid #d7dce2;border-radius:14px;padding:14px;width:100%;font:inherit;color:var(--ra-text);outline:none}
.ra-field:focus{border-color:#98a2b3;box-shadow:0 0 0 4px rgba(152,162,179,.15)}
.ra-time-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ra-pace-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ra-suffix{font-size:.82rem;color:var(--ra-muted);margin-top:5px}
.ra-primary{border:0;border-radius:14px;padding:15px 18px;font:inherit;font-weight:800;cursor:pointer;background:var(--ra-accent);color:#fff;width:100%;margin-top:22px}
.ra-primary:hover{opacity:.92}
.ra-error{display:none;margin:16px 0 0;padding:12px 14px;border-radius:12px;background:#fff4f2;color:#b42318;font-size:.92rem}
.ra-results{display:none;border-top:1px solid var(--ra-line);padding:28px;background:#fcfcfd}
.ra-result-main{display:grid;grid-template-columns:1.1fr .9fr;gap:16px}
.ra-metric{border:1px solid var(--ra-line);background:#fff;border-radius:18px;padding:18px}
.ra-k{font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ra-muted);font-weight:800}
.ra-v{font-size:clamp(1.65rem,5vw,2.6rem);font-weight:850;letter-spacing:-.045em;margin-top:5px}
.ra-v-small{font-size:1.55rem}
.ra-s{font-size:.88rem;color:var(--ra-muted)}
.ra-submetrics{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ra-section-title{font-size:1.15rem;margin:26px 0 12px}
.ra-table-wrap{overflow-x:auto}
.ra-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--ra-line)}
.ra-table th,.ra-table td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--ra-line)}
.ra-table th{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ra-muted);background:#fafafa}
.ra-table tr:last-child td{border-bottom:0}
.ra-copy-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px}
.ra-copy{border-radius:12px;padding:10px 12px;font-weight:700}
.ra-note{font-size:.88rem;color:var(--ra-muted)}
@media(max-width:700px){
  .ra-panel,.ra-results{padding:20px}
  .ra-grid,.ra-result-main{grid-template-columns:1fr}
  .ra-tabs{grid-template-columns:1fr}
  .ra-tab.is-active{box-shadow:inset 3px 0 0 var(--ra-text)}
  .ra-copy-row{align-items:flex-start;flex-direction:column}
}
