/* RadicalOne — estilos compartidos de herramientas (tema claro) */
:root{
  --brick:#B84545; --brick-dk:#9A3A3A; --steel:#7A8292;
  --bg:#FFFFFF; --bg-alt:#F5F3F0; --panel:#FFFFFF; --ink:#1E1B22; --text:#1E1B22;
  --muted:#5E6470; --line:rgba(20,18,25,0.10);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Outfit',sans-serif;background:var(--bg);color:var(--ink);min-height:100vh;line-height:1.6;font-size:17px;}
a{color:var(--brick);text-decoration:none;}
a:hover{color:var(--brick-dk);}

.thead{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:12px 24px;background:rgba(255,255,255,0.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.thead .left{display:flex;align-items:center;gap:18px;}
.thead .logo{height:56px;width:auto;display:block;}
.back{font-size:14px;color:var(--muted);font-weight:600;letter-spacing:.3px;}
.back:hover{color:var(--brick);}
.lang-toggle{background:rgba(184,69,69,.08);border:1px solid rgba(184,69,69,.3);color:var(--brick);
  padding:7px 15px;border-radius:6px;font-size:12px;font-weight:700;cursor:pointer;letter-spacing:2px;
  font-family:'Space Mono',monospace;transition:all .2s;}
.lang-toggle:hover{background:rgba(184,69,69,.16);}

.wrap{max-width:880px;margin:0 auto;padding:48px 24px 80px;}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:5px;text-transform:uppercase;color:var(--brick);
  font-family:'Space Mono',monospace;margin-bottom:14px;}
h1{font-size:clamp(30px,5vw,44px);font-weight:800;line-height:1.1;margin-bottom:16px;color:var(--ink);letter-spacing:-0.3px;}
.h1-row{display:flex;align-items:center;gap:13px;}
.h1-row h1{margin-bottom:0;}
.h1-ro{width:44px;height:44px;flex-shrink:0;display:block;}
.lead{font-size:18.5px;color:var(--muted);max-width:660px;margin-bottom:40px;}
.tool-hero{display:flex;align-items:center;gap:34px;margin-bottom:42px;}
.tool-hero-text{flex:1;min-width:0;}
.tool-hero-text .lead{margin-bottom:0;}
.tool-illus{flex-shrink:0;width:170px;height:170px;background:var(--bg-alt);border:1px solid var(--line);border-radius:20px;display:flex;align-items:center;justify-content:center;}
.tool-illus svg{width:104px;height:104px;color:var(--brick);}
@media(max-width:680px){.tool-hero{flex-direction:column;align-items:flex-start;gap:22px;}.tool-illus{width:120px;height:120px;}.tool-illus svg{width:74px;height:74px;}}

.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:28px;margin-bottom:24px;
  box-shadow:0 2px 12px rgba(20,18,25,0.05);}
.card h2{font-size:22px;font-weight:700;margin-bottom:6px;color:var(--ink);}
.card .hint{font-size:14.5px;color:var(--muted);margin-bottom:20px;}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;}
.field label{font-size:13px;font-weight:600;letter-spacing:.5px;color:var(--muted);text-transform:uppercase;}
input,select{width:100%;background:#fff;border:1px solid var(--line);border-radius:8px;
  padding:12px 14px;color:var(--ink);font-family:'Outfit',sans-serif;font-size:16px;transition:border-color .2s;}
input:focus,select:focus{outline:none;border-color:var(--brick);}
select{cursor:pointer;}
select option,select optgroup{background-color:#ffffff;color:var(--ink);}
select optgroup{font-weight:700;color:var(--brick);}
.inline{display:flex;gap:10px;}
.inline input{flex:2;}
.inline select{flex:1.2;}

.btn{background:var(--brick);color:#fff;border:none;border-radius:8px;padding:13px 26px;font-size:14px;
  font-weight:700;cursor:pointer;font-family:'Outfit',sans-serif;letter-spacing:.3px;transition:all .2s;
  box-shadow:0 6px 16px rgba(184,69,69,0.2);}
.btn:hover{background:var(--brick-dk);transform:translateY(-1px);}
.btn-ghost{background:#fff;border:1px solid var(--line);color:var(--ink);box-shadow:none;}
.btn-ghost:hover{background:var(--bg-alt);transform:none;border-color:var(--brick);color:var(--brick);}

.result{margin-top:22px;background:rgba(184,69,69,.05);border:1px solid rgba(184,69,69,.18);border-radius:12px;padding:24px;}
.result .big{font-size:34px;font-weight:900;color:var(--brick);font-family:'Space Mono',monospace;word-break:break-word;}
.result .sub{font-size:14px;color:var(--muted);margin-top:4px;}
.result-row{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--line);font-size:15px;}
.result-row:last-child{border-bottom:none;}
.result-row .k{color:var(--muted);}
.result-row .v{font-family:'Space Mono',monospace;color:var(--ink);font-weight:700;}

table{width:100%;border-collapse:collapse;font-size:15px;margin-top:8px;}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);}
th{color:var(--brick);font-size:11px;letter-spacing:1px;text-transform:uppercase;font-family:'Space Mono',monospace;}
td{color:var(--ink);}
td.num{font-family:'Space Mono',monospace;text-align:right;}

.note{font-size:14.5px;color:var(--muted);background:rgba(122,130,146,.10);border-left:3px solid var(--steel);
  border-radius:0 8px 8px 0;padding:14px 16px;margin-top:18px;}
.note strong{color:var(--ink);}
.formula{font-family:'Space Mono',monospace;font-size:15px;background:#15141A;border:1px solid var(--line);
  border-radius:8px;padding:14px 16px;margin:14px 0;color:#E8E4E0;overflow-x:auto;}

.prose{max-width:680px;}
.prose h2{font-size:24px;font-weight:800;margin:36px 0 12px;color:var(--ink);}
.prose h3{font-size:18px;font-weight:700;margin:24px 0 8px;color:#3A3640;}
.prose p{color:var(--muted);margin-bottom:14px;font-size:16.5px;}
.prose ul{color:var(--muted);margin:0 0 14px 20px;font-size:16.5px;}
.prose li{margin-bottom:6px;}

.tfooter{border-top:1px solid var(--line);padding:28px 24px;text-align:center;font-size:12px;color:var(--muted);}
.tfooter a{color:var(--brick);}

@media(max-width:680px){
  .grid2,.grid3{grid-template-columns:1fr;}
  .wrap{padding:32px 18px 60px;}
  .thead{padding:10px 16px;}
  .thead .logo{height:38px;}
  .back span{display:none;}
}
