*{box-sizing:border-box}body{margin:0;background:#eef1e9;color:#233f43;font:15px/1.55 system-ui,sans-serif}main{max-width:1050px;margin:auto;padding:34px 25px}header{max-width:750px}.eyebrow{font-size:11px;letter-spacing:2px;color:#657a73}h1{font:53px/1.1 Georgia,serif;letter-spacing:-1px;margin:16px 0}header p{font-size:18px;color:#5c716c}h2{font:27px Georgia,serif;margin:12px 0}button,select{font:inherit;min-height:44px;border:1px solid #9db3aa;border-radius:8px;background:#fffdf5;color:#264b4c;padding:9px 12px}button{cursor:pointer}button:hover{background:#e4eeea}button:focus-visible,select:focus-visible{outline:3px solid #c07848;outline-offset:3px}.primary{background:#235b58;color:#fff}.primary:hover{background:#17433f;color:#fff}.brief,.route{padding:24px;background:#fffdf7;border:1px solid #c6d1c5;border-radius:18px;margin:24px 0}.bar,.routecontrols{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.bar label{margin-right:auto}.bar button{font-size:13px}.briefbody{display:grid;grid-template-columns:1fr 300px;gap:24px;align-items:center}.payload{background:url('route-card.webp') center/cover;min-height:210px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:35px 20px}.payload small{font-size:10px;color:#65816e}.payload strong{font:32px Georgia,serif;color:#234945}.how{border-left:3px solid #b9824c;background:#e4e9dd;padding:14px 18px;font-size:14px}#hinttext{font-size:13px;color:#7d613e}#catalog{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.stop{border:1px solid #c2cfc3;border-radius:13px;background:#f9fcf5;padding:18px}.stop h3{margin:0;font:22px Georgia,serif}.stop .meta{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#7c684c}.stop p{font-size:13px;margin-bottom:0}.stop code{font-size:15px;background:#e6ece2;padding:3px 6px;display:inline-block;margin-top:10px}.routecontrols label{font-size:12px;font-weight:600}.routecontrols select{display:block;min-width:170px;margin-top:4px}#cost{margin-left:auto;font-size:13px}.routecontrols .primary{align-self:flex-end}#feedback{color:#6e5c3e;min-height:24px}#outputs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.output{background:#f3f2e7;border:1px solid #d5d9c8;border-radius:10px;padding:13px;overflow-wrap:anywhere}.output small{font-size:11px;color:#6f7a6c}.output strong{font-size:23px;font-weight:500;display:block;line-height:1.8}.output .tag{font-size:11px;color:#8a5f42}#result{border:1px solid #9fbba4;background:#e4f0e4;padding:16px;border-radius:10px;margin:18px 0}details{margin-top:22px;border-top:1px solid #d8ded0;padding-top:16px;font-size:13px}summary{cursor:pointer;font-weight:600}footer{font-size:12px;color:#6b8173}a{color:#315f5a}@media(max-width:700px){main{padding:24px 12px}h1{font-size:39px}header p{font-size:16px}.brief,.route{padding:18px 13px}.briefbody{grid-template-columns:1fr;gap:0}.payload{min-height:170px;max-width:320px;width:100%;justify-self:center;background-size:100% 100%}#catalog{grid-template-columns:repeat(2,1fr);gap:8px}.stop{padding:12px}.stop h3{font-size:19px}.stop p{font-size:12px}.routecontrols{gap:8px}.routecontrols label{flex:1}.routecontrols select{min-width:0;width:100%;font-size:13px}.routecontrols>span:not(#cost){display:none}#cost{margin:10px 0}.routecontrols .primary{margin-left:auto}#outputs{grid-template-columns:repeat(2,1fr)}.output strong{font-size:22px}.bar label{width:100%;margin:0}.bar select{max-width:230px}.bar button{flex:1}}
@media(max-width:700px){.routecontrols{display:grid;grid-template-columns:1fr 1fr;align-items:end}.routecontrols label{min-width:0}.routecontrols select{min-height:48px}#cost{grid-column:1;margin:0}.routecontrols .primary{grid-column:2;width:100%}}
