.hv-tool{
  --t-sand: var(--sand,#E8DCC4); --t-clay: var(--clay,#C9683E);
  --t-ink: var(--ink,#2B2622); --t-muted: var(--muted,#8A8175);
  --t-mono: var(--mono,"JetBrains Mono",monospace);
  position:relative; background:var(--t-sand); border:1px solid var(--t-clay);
  border-radius:12px; padding:20px 22px; margin:28px 0; color:var(--t-ink);
}
.hv-tool__mark{position:absolute; top:14px; right:16px; font-size:18px; opacity:.7}
.hv-tool__title{font-family:var(--display,Lora,serif); font-size:22px; margin:0 0 6px}
.hv-tool__intro{color:var(--t-muted); margin:0 0 14px}
.hv-tool__field{display:flex; flex-direction:column; gap:6px; margin:0 0 12px}
.hv-tool__label{font-size:14px; color:var(--t-muted)}
.hv-tool__input{display:flex; align-items:center; gap:8px}
.hv-tool__input input{flex:1; min-height:44px; padding:8px 12px; border:1px solid var(--line-strong,rgba(43,38,34,.24)); border-radius:10px; background:var(--card,#fffdf8); color:inherit; font:inherit}
.hv-tool__input input:focus-visible{outline:3px solid color-mix(in srgb,var(--t-clay) 72%,white); outline-offset:2px}
.hv-tool__unit{font-size:14px; color:var(--t-muted); min-width:max-content}
.hv-tool__radios{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 12px}
.hv-tool__radios label{display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:6px 12px; border:1px solid var(--line,rgba(43,38,34,.14)); border-radius:10px; cursor:pointer}
.hv-tool__radios input{accent-color:var(--t-clay)}
.hv-tool__result{min-height:64px; margin-top:14px; padding-top:12px; border-top:1px solid var(--line,rgba(43,38,34,.14)); display:flex; flex-direction:column; gap:4px}
.hv-tool__big{font-family:var(--t-mono); font-size:30px; line-height:1.1; color:var(--t-clay)}
.hv-tool__note{color:var(--t-muted); font-size:14px}
.hv-tool__formula{margin-top:12px; font-size:14px; color:var(--t-muted)}
.hv-tool__formula summary{cursor:pointer}
.hv-tool__disclaimer{margin-top:10px; font-size:13px; color:var(--t-muted)}
.hv-tool__btn,.hv-tool .hv-tool__btn{min-height:44px; padding:10px 18px; border:0; border-radius:10px; background:var(--t-clay); color:#fff; font:inherit; cursor:pointer}
.hv-quiz__bartrack{height:6px; border-radius:6px; background:var(--line,rgba(43,38,34,.14)); margin:0 0 14px; overflow:hidden}
.hv-quiz__bar{height:100%; width:0; background:var(--t-clay); transition:width .25s}
.hv-quiz__q{font-weight:600; margin:0 0 10px}
.hv-quiz__opt{display:block; width:100%; text-align:left; min-height:44px; margin:0 0 8px; padding:10px 14px; border:1px solid var(--line-strong,rgba(43,38,34,.24)); border-radius:10px; background:var(--card,#fffdf8); color:inherit; font:inherit; cursor:pointer}
.hv-quiz__opt:hover{border-color:var(--t-clay)}
.hv-quiz__alts{font-size:14px; color:var(--t-muted)}
.hv-check__list{display:flex; flex-direction:column; gap:2px}
.hv-check__item{display:flex; align-items:center; gap:10px; min-height:44px; width:100%; text-align:left; padding:6px 10px; border:0; background:none; color:inherit; font:inherit; cursor:pointer}
.hv-check__box{width:22px; height:22px; flex:none; border:2px solid var(--t-clay); border-radius:6px}
.hv-check__item[aria-pressed="true"] .hv-check__box{background:var(--t-clay)}
.hv-check__item[aria-pressed="true"] .hv-check__text{text-decoration:line-through; color:var(--t-muted)}
@media (prefers-reduced-motion:reduce){ .hv-quiz__bar{transition:none} }