/* Native interactive tools (2026-10-16) */
.tl{margin:8px 0 28px;padding:20px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow)}
.tl fieldset{border:0;margin:0 0 18px;padding:0}
.tl legend{font-weight:600;margin:0 0 8px;padding:0;line-height:1.4}
.tl .tl-area{display:inline-block;font-size:.75rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);margin:0 0 4px}
.tl-opts{display:grid;gap:8px}
@media(min-width:640px){.tl-opts--4{grid-template-columns:repeat(2,1fr)}}
.tl-opt{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line-2);border-radius:10px;cursor:pointer;font-size:.95rem;line-height:1.4;background:var(--surface)}
.tl-opt:hover{border-color:var(--accent)}
.tl-opt input{margin-top:3px;accent-color:var(--accent);flex:none}
.tl-opt:has(input:checked){border-color:var(--accent);background:#eef3fd}
.tl-opt:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.tl-grid{display:grid;gap:14px;margin:0 0 18px}
@media(min-width:640px){.tl-grid{grid-template-columns:repeat(2,1fr)}}
.tl label.tl-f{display:block;font-weight:600;font-size:.93rem;line-height:1.35}
.tl label.tl-f small{display:block;font-weight:400;color:var(--muted);font-size:.82rem}
.tl input[type=number]{display:block;width:100%;margin-top:6px;padding:10px 12px;font:inherit;border:1px solid var(--line-2);border-radius:10px;background:var(--surface);color:var(--ink)}
.tl input[type=number]:focus-visible{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
.tl-err{color:#b42318;font-size:.9rem;margin:8px 0 0}
.tl-progress{height:6px;border-radius:99px;background:var(--line);overflow:hidden;margin:0 0 16px}
.tl-progress span{display:block;height:100%;width:0;background:var(--accent);transition:width .3s}
.tl-res{margin:8px 0 28px;padding:22px;border:1px solid var(--line);border-radius:var(--radius-lg);background:linear-gradient(180deg,#f3f7ff,#fff);box-shadow:var(--shadow-md)}
.tl-res:focus{outline:none}
.tl-big{font-size:2.6rem;font-weight:700;line-height:1.1;margin:4px 0 6px;letter-spacing:-.02em}
.tl-big small{font-size:1rem;font-weight:500;color:var(--muted)}
.tl-bars{display:grid;gap:10px;margin:14px 0}
.tl-bar{display:grid;grid-template-columns:minmax(110px,34%) 1fr auto;gap:10px;align-items:center;font-size:.92rem}
.tl-bar i{display:block;height:10px;border-radius:99px;background:var(--line);overflow:hidden}
.tl-bar i b{display:block;height:100%;background:var(--accent);transition:width .5s}
.tl-bar.is-gap i b{background:#d97706}
.tl-kpis{display:grid;gap:12px;margin:14px 0}
@media(min-width:640px){.tl-kpis{grid-template-columns:repeat(3,1fr)}}
.tl-kpi{padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.tl-kpi p{margin:0;font-size:.85rem;color:var(--muted);line-height:1.35}
.tl-kpi strong{display:block;font-size:1.45rem;color:var(--ink);margin:2px 0}
.tl-flags{list-style:none;padding:0;margin:12px 0;display:grid;gap:10px}
.tl-flags li{padding:12px 14px;border-left:4px solid #d97706;background:var(--surface);border-radius:8px;font-size:.95rem}
.tl-flags li.ok{border-left-color:#16a34a}
.tl-note{font-size:.85rem;color:var(--muted);margin:10px 0 0}
.tl-badge{display:inline-block;font-size:.75rem;font-weight:600;padding:2px 8px;border-radius:99px;background:#fff7ed;color:#9a3412;border:1px solid #fed7aa}
.tl-hub{display:grid;gap:16px;margin:16px 0 28px}
@media(min-width:720px){.tl-hub{grid-template-columns:repeat(2,1fr)}}
.tl-hub a.tl-card{display:block;padding:18px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);color:var(--ink);text-decoration:none;box-shadow:var(--shadow)}
.tl-hub a.tl-card:hover,.tl-hub a.tl-card:focus-visible{border-color:var(--accent)}
.tl-hub h2{font-size:1.1rem;margin:0 0 6px}.tl-hub p{margin:0;font-size:.93rem;color:var(--muted)}
.tl-rates{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0 0 14px}
@media(min-width:640px){.tl-rates{grid-template-columns:repeat(8,1fr)}}
@media (prefers-reduced-motion:reduce){.tl-progress span,.tl-bar i b{transition:none}}
.tl-res{scroll-margin-top:calc(var(--nav-h) + 12px)}.article-body .tl-flags{padding-left:0}.article-body .tl-flags li{margin:0}
/* Explainer */
.tx-wrap{margin:32px 0}
.tx-wrap h2{margin-bottom:6px}
.tx{border:1px solid var(--line);border-radius:var(--radius-lg);background:linear-gradient(160deg,#0f172a,#1e293b);color:#f8fafc;padding:18px;box-shadow:var(--shadow-md)}
.tx-stage{background:#fff;color:var(--ink);border-radius:12px;min-height:250px;padding:18px;display:flex;align-items:center;overflow:hidden}
.tx-scene{width:100%;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s}
.tx-scene.in,.tx-all{opacity:1;transform:none}
.tx-scene [data-at]{opacity:0;transform:translateY(6px);transition:opacity .45s,transform .45s,background .3s,border-color .3s}
.tx-scene [data-at].on,.tx-all [data-at]{opacity:1;transform:none}
.tx-q{margin:0 0 10px;line-height:1.35}
.tx-q b{display:block;font-size:1.02rem}
.tx-o{display:block;padding:8px 12px;margin:6px 0;border:1px solid var(--line-2);border-radius:10px;font-size:.92rem}
.tx-row{display:flex;gap:8px}.tx-row .tx-o{flex:1;text-align:center;margin:0}
.tx-pick.on,.tx-all .tx-pick{border-color:var(--accent);background:#eef3fd;font-weight:600}
.tx-prog{height:8px;background:var(--line);border-radius:99px;margin-top:12px;overflow:hidden}
.tx-prog i,.tx-bar i{display:block;height:100%;width:0;background:var(--accent);border-radius:99px;transition:width .9s ease}
.tx-prog i.on,.tx-all .tx-prog i{width:var(--w)}
.tx-bar{margin:8px 0;font-size:.9rem}.tx-bar i{height:10px;margin-top:4px;background:var(--accent)}
.tx-bar{background:none}.tx-bar.on i,.tx-all .tx-bar i{width:var(--w)}
.tx-bar::after{content:"";display:block}
.tx-gap i{background:#d97706!important}
.tx-k{font-size:.8rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin:0 0 4px}
.tx-big{font-size:2.6rem;font-weight:700;letter-spacing:-.02em;line-height:1.1;margin:2px 0 6px}
.tx-big small{font-size:1rem;font-weight:500;color:var(--muted)}
.tx-list{margin:6px 0 0;padding-left:1.2rem;font-size:.93rem}
.tx-rates{display:flex;gap:8px;flex-wrap:wrap}.tx-rates b{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line-2);border-radius:10px;font-size:1.1rem}
.tx-flag{padding:10px 12px;margin:6px 0;border-left:4px solid #d97706;background:#fff7ed;border-radius:8px;font-size:.93rem}
.tx-ok{border-left-color:#16a34a;background:#f0fdf4}
.tx-card{padding:14px;border:1px solid var(--line);border-radius:12px;background:#f8fafc}.tx-card p{margin:0}
.tx-cta{display:inline-block;margin:14px 0 0;padding:8px 14px;border-radius:99px;background:var(--ink);color:#fff;font-weight:600;font-size:.92rem}
.tx-in{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;margin:6px 0;border:1px solid var(--line-2);border-radius:10px;font-size:.93rem}
.tx-cap{margin:14px 2px 8px;font-weight:600;font-size:1.05rem;min-height:1.6em;color:#f8fafc}
.tx-ctl{display:flex;align-items:center;gap:12px}
.tx-btn{font:600 .85rem var(--font);color:#0f172a;background:#f8fafc;border:0;border-radius:99px;padding:6px 14px;cursor:pointer}
.tx-btn:focus-visible{outline:2px solid #93c5fd;outline-offset:2px}
.tx-dots{display:flex;gap:6px}.tx-dots i{width:22px;height:4px;border-radius:99px;background:rgba(255,255,255,.25)}.tx-dots i.on{background:#93c5fd}
.tx--static .tx-steps{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.tx--static .tx-scene{background:#fff;color:var(--ink);border-radius:12px;padding:14px}
.tx--static .tx-cap{margin:0 0 6px}
@media (prefers-reduced-motion:reduce){.tx-scene,.tx-scene [data-at],.tx-prog i,.tx-bar i{transition:none}}
