footer a{color:#fff}
*,*::before,*::after{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,sans-serif;color:#243447;background:#f5f8fb;line-height:1.55}header,footer{color:#fff;text-align:center;background:linear-gradient(135deg,#0b3047,#176b87);padding:2rem 1rem}header{position:relative}header h1{font-size:clamp(1.5rem,4vw,2.25rem);margin:.4rem 0}header p,footer p{margin:.25rem 0}.back{position:absolute;left:1rem;top:1rem;color:#fff;text-decoration:none;font-size:.9rem}.container{max-width:920px;margin:2rem auto;padding:0 1rem}.intro,.panel,.result,.related{background:#fff;border:1px solid #dbe4ec;border-radius:10px;padding:1.25rem;box-shadow:0 4px 18px rgba(30,70,100,.07)}.intro{border-left:4px solid #1686a3;margin-bottom:1.25rem}.tabs{display:flex;gap:.4rem;margin-bottom:1rem;overflow-x:auto}.tabs button{border:1px solid #b9cad7;background:#fff;color:#31566e;border-radius:7px;padding:.65rem 1rem;cursor:pointer;white-space:nowrap}.tabs button.active{background:#176b87;color:#fff;border-color:#176b87}.tab{display:none}.tab.active{display:block}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.field{display:flex;flex-direction:column;gap:.3rem}.field label{font-weight:600;font-size:.88rem}.field small{color:#637788}.field input,.field select{width:100%;padding:.62rem;border:1px solid #b9cad7;border-radius:6px;font:inherit;background:#fff}.calculate{grid-column:1/-1;border:0;border-radius:7px;padding:.78rem 1rem;background:#176b87;color:#fff;font-weight:700;cursor:pointer}.calculate:hover{background:#11566e}.result{display:none;margin-top:1rem}.result.error{display:block;color:#a61b1b;border-left:4px solid #c53030;background:#fff7f7}.stats{display:flex;flex-wrap:wrap;gap:.75rem}.stat{min-width:135px;flex:1;background:#e9f7fa;border-radius:8px;padding:.8rem;text-align:center}.stat strong{display:block;color:#11566e;font-size:1.45rem}.note{margin:.9rem 0 0;color:#536777}.copy{margin-top:.8rem;border:1px solid #9fb3c1;background:#fff;border-radius:5px;padding:.4rem .75rem;cursor:pointer}.related{margin:1.5rem 0}.related ul{display:flex;flex-wrap:wrap;gap:.7rem;padding:0;list-style:none}.related a,.faq-link{color:#126882}.method-note{font-size:.86rem;color:#536777;margin-top:1rem}footer{margin-top:2rem;font-size:.82rem}@media(max-width:600px){.grid{grid-template-columns:1fr}.container{margin:1rem auto}.back{position:static;display:block;text-align:left}header{padding:1rem}.panel,.intro,.result,.related{padding:1rem}.stat{min-width:120px}}