:root{--tool-surface:#fff;--tool-soft:#edf3f7;--tool-border:#cbd8e1;--tool-good:#0a7b54;--tool-bad:#b63c32}
body.tool-body{background:#eef3f6;color:#0a1728}.tool-main{overflow:hidden}.tool-hero{padding:72px 0 84px;background:radial-gradient(circle at 82% 10%,rgba(52,215,247,.16),transparent 32%),linear-gradient(135deg,#06101f,#0b2138);color:#fff}.tool-shell{width:min(1180px,calc(100% - 48px));margin-inline:auto}.tool-intro{display:grid;grid-template-columns:minmax(0,.72fr) minmax(560px,1.28fr);gap:54px;align-items:start}.tool-copy{position:sticky;top:118px}.tool-eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 22px;color:#8fa8bb;font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.tool-eyebrow::before{content:'';width:28px;height:2px;background:#ffad32}.tool-copy h1{margin:0;font:850 clamp(2.7rem,5.2vw,5.4rem)/.98 Unbounded,sans-serif;letter-spacing:-.065em}.tool-copy h1 span{display:block;color:#ffad32}.tool-copy>p:not(.tool-eyebrow){max-width:520px;margin:28px 0 0;color:#bfd0dd;font-size:1.05rem;line-height:1.7}.privacy-note{display:flex;gap:10px;margin-top:24px;padding:14px 16px;border:1px solid rgba(52,215,247,.22);border-radius:8px;color:#91aabd;font-size:.78rem;line-height:1.5}.privacy-note::before{content:'●';color:#42d79b}.tool-card{padding:30px;border:1px solid rgba(83,197,240,.28);border-radius:16px;background:rgba(8,26,44,.94);box-shadow:0 34px 80px rgba(0,0,0,.32)}.tool-card h2{margin:0 0 8px;font:800 1.35rem/1.2 Unbounded,sans-serif}.tool-card>.helper{margin:0 0 24px;color:#89a0b3;font-size:.82rem;line-height:1.55}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:grid;gap:7px}.field-full{grid-column:1/-1}.field label,.field legend{color:#dbe7ef;font-size:.78rem;font-weight:750}.field small{color:#7891a5;font-size:.7rem}.field input{width:100%;min-height:48px;padding:0 13px;border:1px solid #31506a;border-radius:7px;background:#071521;color:#fff;outline:0}.field input:focus{border-color:#34d7f7;box-shadow:0 0 0 3px rgba(52,215,247,.12)}.field input[aria-invalid="true"]{border-color:#ff7468}.field-error{min-height:1.1em;color:#ff8a80;font-size:.7rem}.presets{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 22px}.preset-button,.tool-secondary,.tool-primary,.copy-button{min-height:42px;padding:0 14px;border-radius:6px;font-weight:800;cursor:pointer}.preset-button,.tool-secondary{border:1px solid #31506a;background:#0b2033;color:#d7e4ed}.preset-button:hover,.preset-button:focus-visible,.tool-secondary:hover,.tool-secondary:focus-visible{border-color:#34d7f7}.tool-options{display:flex;flex-wrap:wrap;gap:16px;margin:18px 0;color:#bdd0dc;font-size:.78rem}.tool-options label{display:flex;align-items:center;gap:8px}.tool-options input{width:18px;height:18px;accent-color:#ffad32}.tool-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.tool-primary,.copy-button{border:1px solid #ffad32;background:#ffad32;color:#071321}.tool-primary:hover,.tool-primary:focus-visible,.copy-button:hover,.copy-button:focus-visible{background:#ffc162}.tool-result{margin-top:24px;padding:18px;border:1px solid rgba(52,215,247,.22);border-radius:10px;background:#06101f}.tool-result-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px}.tool-result-head b{color:#fff}.tool-result-output{min-height:64px;margin:0;overflow-wrap:anywhere;color:#bfeefa;font:600 .82rem/1.6 Onest,sans-serif}.tool-status{min-height:1.2em;margin:9px 0 0;color:#8ca5b8;font-size:.72rem}.tool-status.is-error{color:#ff8a80}.tool-status.is-success{color:#62dfa7}.tool-content{padding:92px 0}.tool-section{display:grid;grid-template-columns:280px minmax(0,1fr);gap:64px;padding:56px 0;border-top:1px solid var(--tool-border)}.tool-section:first-child{padding-top:0;border-top:0}.tool-section h2{margin:0;font:800 clamp(1.8rem,3vw,3.1rem)/1.05 Unbounded,sans-serif;letter-spacing:-.045em}.tool-section-body{color:#435c70;line-height:1.75}.tool-section-body>:first-child{margin-top:0}.steps,.mistakes,.faq-list{display:grid;gap:12px}.steps{grid-template-columns:repeat(3,1fr);counter-reset:step}.step,.mistake,.faq-item,.example-box{padding:22px;border:1px solid var(--tool-border);border-radius:10px;background:#fff}.step{counter-increment:step}.step::before{content:'0' counter(step);display:block;margin-bottom:26px;color:#d77d00;font-weight:900}.step h3,.mistake h3,.faq-item h3{margin:0 0 9px;color:#0a1728;font-size:1rem}.step p,.mistake p,.faq-item p{margin:0}.mistakes{grid-template-columns:1fr 1fr}.example-box code{display:block;overflow-wrap:anywhere;color:#0c6577;line-height:1.65}.placeholder-links{display:grid;gap:10px;padding:18px;border-left:3px solid #ffad32;background:#fff7e9}.placeholder-links span{color:#62778a}.tool-footer-note{padding:28px;border-radius:12px;background:#0a1728;color:#dbe5eb}.tool-footer-note a{color:#ffad32}.romi-fields{grid-template-columns:1fr}.romi-results{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}.metric{padding:17px;border:1px solid #274359;border-radius:8px;background:#071521}.metric span{display:block;color:#7f98aa;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em}.metric strong{display:block;margin-top:6px;color:#fff;font-size:1.45rem}.metric-romi{grid-column:1/-1;border-color:#ffad32}.metric-romi strong{color:#ffad32;font-size:2.2rem}.romi-meaning{grid-column:1/-1;margin:0;padding:14px;border-left:3px solid #34d7f7;background:#0b2033;color:#c9d9e3;line-height:1.5}.romi-formula{display:block;margin-top:14px;padding:13px;border-radius:7px;background:#071521;color:#a9bfd0;font-size:.76rem;line-height:1.5}
@media(max-width:1000px){.tool-intro{grid-template-columns:1fr}.tool-copy{position:static}.tool-copy>p:not(.tool-eyebrow){max-width:760px}.tool-section{grid-template-columns:1fr;gap:28px}.steps{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.tool-hero{padding:46px 0 58px}.tool-shell{width:min(100% - 32px,1180px)}.tool-card{padding:20px}.field-grid,.steps,.mistakes,.romi-results{grid-template-columns:1fr}.field-full,.metric-romi,.romi-meaning{grid-column:auto}.tool-copy h1{font-size:clamp(2.45rem,12vw,3.7rem)}.tool-actions>*{width:100%}.copy-button{width:auto}.tool-content{padding:68px 0}.tool-section{padding:44px 0}.tool-result-head{align-items:flex-start}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.tool-copy h1{font-size:clamp(2.5rem,3.3vw,4rem);overflow-wrap:normal}
@media(max-width:700px){.tool-copy h1{font-size:clamp(2.35rem,10vw,3rem)}}
