:root{font-family:Georgia,Songti SC,serif;color:#272a24;background:#f7f2e8}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}header{height:82px;padding:0 4vw;display:grid;grid-template-columns:180px 1fr auto;align-items:center;border-bottom:1px solid #a6a492}header a{font:bold 18px/1}header p{font:10px Arial;letter-spacing:4px}header div{font:12px Arial;color:#6d7065}main{max-width:1400px;margin:auto;padding:45px 4vw 90px}.hero{display:grid;grid-template-columns:1.4fr .6fr;align-items:end;margin-bottom:55px}.hero span{font:11px Arial;letter-spacing:3px;color:#ea5d3a}.hero h1{font-size:clamp(45px,6vw,85px);line-height:1;margin:12px 0;letter-spacing:-4px}.factor{border-left:1px solid #aaa797;padding-left:35px}.factor label,.factor small{display:block;font:12px Arial;color:#686b61}.factor>div{display:flex;align-items:baseline;margin:14px 0}.factor>div input{width:90px;border:0;border-bottom:2px solid;background:none;font:700 48px Georgia}.factor b{font:16px Arial}.range{width:100%;accent-color:#ea5d3a}.routes{display:grid;grid-template-columns:1fr 1fr;gap:20px}.routes>article{border-top:8px solid var(--route);background:#fffdf7;padding:24px;box-shadow:0 7px 25px #48483e18}.routeTitle{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.routeTitle input{border:0;background:none;font:700 30px Georgia;width:70%}.routeTitle span{font:10px Arial;letter-spacing:2px}.thead,.segment{display:grid;grid-template-columns:45px repeat(3,1fr) 24px;gap:8px;align-items:center}.thead{font:10px Arial;color:#77796e;padding:7px 0}.segment{border-top:1px solid #d8d5ca;padding:9px 0}.segment b{font:12px Arial;color:var(--route)}.segment input{width:100%;min-width:0;border:1px solid #d3d0c4;padding:8px;background:#f8f5ed}.segment button{border:0;background:none;font-size:20px;cursor:pointer}.add{border:1px dashed #a9a69a;background:none;width:100%;padding:10px;margin-top:8px;cursor:pointer}.totals{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:25px}.totals div{display:grid;border-left:2px solid var(--route);padding-left:8px}.totals small{font:10px Arial;color:#7a7c72}.totals b,.totals strong{margin-top:5px}.totals strong{font-size:22px;color:var(--route)}.viz{margin-top:70px;border-top:1px solid;padding-top:30px}.viztitle{display:flex;justify-content:space-between}.viztitle small,.saved small{font:10px Arial;letter-spacing:3px;color:#777}.viztitle h2,.saved h2{font-size:35px;margin:7px 0}.verdict{text-align:right;display:grid}.verdict span{font:10px Arial}.verdict b{font-size:32px;color:#ea5d3a}.verdict em{font:12px Arial}.charts{display:grid;grid-template-columns:1.3fr .7fr;gap:40px}.profiles{display:grid;grid-template-columns:1fr 1fr;gap:15px}.profiles label{font:700 13px Arial}.profiles svg{width:100%;background:#fffdf7;margin-top:8px}.profiles line{stroke:#aaa}.profiles polyline{fill:none;stroke-width:4}.bars{background:#272a24;color:#fff;padding:30px;display:grid;align-content:center;gap:30px}.barrow label{display:flex;justify-content:space-between;font:13px Arial;margin-bottom:9px}.barrow>div{height:30px;background:#4c5048;position:relative}.barrow span{display:block;height:100%}.barrow i{position:absolute;top:-4px;height:38px;border-left:2px solid white;font:9px Arial;padding:2px}.bars p{font:10px Arial;color:#b7bbaf}.saved{margin-top:70px;padding-top:30px;border-top:1px solid;display:grid;grid-template-columns:1fr 1fr;gap:50px}.savebox{display:flex}.savebox input{padding:12px;border:1px solid;width:65%}.savebox button{background:#ea5d3a;color:#fff;border:0;padding:12px;cursor:pointer}.savedlist article{border-top:1px solid #bbb8ac;display:grid;grid-template-columns:1fr auto}.savedlist button{border:0;background:none;text-align:left;padding:13px;display:grid;cursor:pointer}.savedlist span{font:11px Arial;color:#777;margin-top:4px}.savedlist .del{color:#a13d2b}@media(max-width:800px){header{grid-template-columns:1fr auto}header p{display:none}main{padding:30px 14px}.hero,.routes,.charts,.saved{grid-template-columns:1fr}.factor{border-left:0;border-top:1px solid;padding:25px 0 0;margin-top:25px}.routes{gap:35px}.routes>article{padding:15px}.totals{grid-template-columns:1fr 1fr;gap:15px}.profiles{grid-template-columns:1fr}.viztitle{display:block}.verdict{text-align:left;margin:20px 0}.saved{gap:20px}.thead,.segment{grid-template-columns:34px repeat(3,1fr) 20px}.segment input{padding:6px;font-size:13px}}
