*{box-sizing:border-box}body{margin:0;background:#ffffff;color:#172132;font:16px/1.6 system-ui,sans-serif}header,main,footer{max-width:1440px;margin:auto;padding:25px 5%}header{display:flex;justify-content:space-between;border-bottom:1px solid #dce0e6}a{color:#244875}header a{text-decoration:none;font-weight:750}header span,.eyebrow{font-size:12px;letter-spacing:2px;color:#617087}.intro{max-width:900px;padding:45px 0}h1{font-size:clamp(32px,4.5vw,58px);line-height:1.12;letter-spacing:-2px;margin:18px 0}h2{font-size:24px;line-height:1.3}button,.button{background:#244875;border:1px solid #244875;color:white;padding:12px 18px;border-radius:6px;cursor:pointer;font:600 14px system-ui;text-decoration:none;display:inline-block}.secondary{background:transparent;color:#244875}button:hover,.button:hover{filter:brightness(.9)}button:disabled{opacity:.4;cursor:not-allowed}.workspace{display:grid;grid-template-columns:340px minmax(0,1fr);gap:24px;align-items:start}form,#results{background:white;border:1px solid #dce0e6;border-radius:12px;padding:24px}label{display:block;font-size:13px;font-weight:600;margin:12px 0}input,select{display:block;width:100%;padding:10px;border:1px solid #cbd3df;border-radius:5px;margin-top:6px;font:15px system-ui;background:white;color:#172132}input[readonly]{background:#f4f6f9}.pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.load{border-top:1px solid #e1e5ea;padding-top:10px;margin-top:15px}.hint{font-size:12px;color:#637080}.load button{padding:6px 10px;background:white;color:#933;border-color:#e4cccc;font-size:12px}form>.button{width:100%;margin-top:24px}#error{color:#a12323}.results-head{display:flex;align-items:center;gap:15px;justify-content:space-between;flex-wrap:wrap}#metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:20px 0}.metric{padding:15px;background:#f0f3f8;border-radius:6px}.metric strong{display:block;font-size:20px}.metric span{font-size:12px}canvas{width:100%;height:auto;display:block}figure{margin:22px 0;border:1px solid #dce0e6;padding:12px;border-radius:8px}figure h3{font-size:15px;margin:4px 0}table{border-collapse:collapse;width:100%;font-size:13px}th,td{text-align:left;padding:10px;border-bottom:1px solid #ddd}.explain{max-width:1000px;margin:55px 0}.explain p{color:#596779}footer{font-size:13px;border-top:1px solid #ddd}#status{font-size:13px;color:#786020}@media(max-width:1000px){.workspace{grid-template-columns:1fr}#metrics{grid-template-columns:1fr 1fr}header span{display:none}}@media(max-width:500px){main{padding:15px}form,#results{padding:15px}#metrics{grid-template-columns:1fr}h1{letter-spacing:-1px}}

[hidden]{display:none!important}
body{background:#fff;color:#172132}.intro{padding:48px 0}.workspace{background:#f7f8fa;padding:24px;border-radius:12px;margin:0 -24px}form,#results{box-shadow:0 4px 18px #17213204}h1{font-weight:600}.eyebrow{color:#617087}.button,button{border-radius:4px}.secondary{background:white}.metric{border:1px solid #e1e6ee;background:#f5f7fa}.explain{border-top:1px solid #e1e5ea;padding-top:35px}header a{color:#172132}header span{color:#617087}@media(max-width:600px){.workspace{margin:0;padding:12px;gap:15px}h1{font-size:37px}.intro{padding:30px 0}form,#results{padding:16px}.results-head button{width:100%}}
