/* Tools page. */
.toolnav { position: sticky; top: var(--nav-h); z-index: 20; border-block: 1px solid var(--line); background: rgba(5, 5, 8, .75); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); transition: top .5s var(--ease); }
.nav.is-hidden ~ main .toolnav { top: 0; }
.toolnav__inner { display: flex; gap: 6px; overflow-x: auto; padding: 10px 0; scrollbar-width: none; }
.toolnav__inner::-webkit-scrollbar { display: none; }
.toolnav a { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border-radius: 999px; text-decoration: none; color: var(--text-2); font-size: .88rem; white-space: nowrap; transition: all .2s; }
.toolnav a:hover { background: var(--surface); color: var(--text); }
.toolnav a.is-active { background: var(--text); color: #0b0b10; }
.toolnav .i { width: 16px; height: 16px; }
.tool { scroll-margin-top: calc(var(--nav-h) + 70px); }
.tool__head { display: grid; gap: 14px; max-width: 860px; margin-bottom: 30px; }
.tool__head .h2 { margin: 0; }
.tool__head .lead a { color: var(--gold-2); }
.tool-panel { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(0, 1.6fr); gap: 0; padding: 0; }
.tool-inputs { display: grid; gap: 16px; align-content: start; padding: clamp(22px, 2.6vw, 32px); border-right: 1px solid var(--line); }
.tool-inputs__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tool-result { padding: 16px 0 4px; border-top: 1px solid var(--line); }
.tool-result__big { margin: 0 0 6px; font-size: clamp(1.7rem, 2.6vw, 2.3rem); line-height: 1.12; letter-spacing: -.01em; }
.tool-result__big em { color: var(--gold-2); }
.tool-result p.muted { margin: 0; font-size: .9rem; }
.tool-stats { display: grid; gap: 10px; margin: 0; }
.tool-stats div { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--line); font-size: .92rem; }
.tool-stats dt { color: var(--muted); }
.tool-stats dd { margin: 0; }
.tool-chart-wrap { display: grid; grid-template-rows: auto minmax(320px, 1fr) auto; gap: 14px; padding: clamp(22px, 2.6vw, 32px); min-width: 0; }
.tool-chart { position: relative; min-height: 320px; }
.tool-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: .84rem; color: var(--text-2); }
.tool-legend span { display: inline-flex; align-items: center; gap: 8px; }
.tool-legend i { width: 18px; height: 3px; border-radius: 2px; display: inline-block; }
@media (max-width: 980px) { .tool-panel { grid-template-columns: 1fr; } .tool-inputs { border-right: 0; border-bottom: 1px solid var(--line); } }

.r72 { grid-template-columns: minmax(280px, .8fr) minmax(0, 1.6fr); }
.r72__controls { display: grid; gap: 18px; align-content: start; padding: clamp(22px, 2.6vw, 32px); border-right: 1px solid var(--line); }
.r72__controls .calc__label b { font-size: 1.3rem; }
.r72__out { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.r72__out > div { display: grid; gap: 6px; padding: 16px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255, 255, 255, .025); }
.r72__out b { font-size: 2.1rem; line-height: 1; font-weight: 400; }
.r72__out > div:first-child { border-color: rgba(255, 181, 74, .4); background: rgba(255, 181, 74, .06); }
.r72__ladder { display: flex; align-items: flex-end; gap: clamp(6px, 1vw, 14px); padding: clamp(22px, 2.6vw, 32px); min-height: 360px; overflow-x: auto; }
.rung { flex: 1; min-width: 54px; display: grid; justify-items: center; gap: 8px; }
.rung__bar { width: 100%; border-radius: 10px 10px 4px 4px; background: linear-gradient(180deg, #ffe9c2, #ffb54a 40%, #ff7a3d); box-shadow: 0 0 24px -6px rgba(255, 150, 60, .7); transition: height .7s var(--ease); min-height: 4px; }
.rung__v { font: 500 .78rem/1.2 var(--font-mono); color: var(--text); text-align: center; }
.rung__y { font: 500 .68rem/1.2 var(--font-mono); color: var(--muted); }
@media (max-width: 980px) { .r72 { grid-template-columns: 1fr; } .r72__controls { border-right: 0; border-bottom: 1px solid var(--line); } .r72__ladder { min-height: 280px; } }
