*{box-sizing:border-box}body{margin:0;background:#f5f7fa;color:#17202a;font-family:-apple-system,BlinkMacSystemFont,Arial,sans-serif;padding-bottom:84px}header{height:68px;background:#fff;border-bottom:1px solid #ddd;padding:12px 18px;position:sticky;top:0;z-index:5}header b{display:block;color:#123b67;font-size:18px}header small{color:#718096;letter-spacing:2px}.page{display:none;max-width:760px;margin:auto;padding:18px}.page.active{display:block}h1{font-size:29px;margin:4px 0}h2{font-size:18px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.cards>div{background:#fff;border-radius:15px;padding:13px;font-size:12px}.cards strong{display:block;font-size:19px;margin-top:8px}.cards small{color:#8793a0}.cards>div:nth-child(1) strong{color:#16834b}.cards>div:nth-child(2) strong{color:#c83d3d}.cards>div:nth-child(3) strong{color:#1768a8}.grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}button{border:0;border-radius:12px;padding:13px;font-weight:700;background:#123b67;color:#fff}.toolbar{display:grid;grid-template-columns:1fr 1.5fr;gap:8px;margin:10px 0}.head{display:flex;justify-content:space-between;align-items:center}.head button{padding:10px}input,select,textarea{width:100%;padding:12px;border:1px solid #d7dfe7;border-radius:10px;background:#fff;font-size:15px}label{display:block;font-size:12px;color:#657383;margin:11px 0}label input,label select,label textarea{margin-top:5px}.tx,.customer,.cargo{background:#fff;border:1px solid #e6ebf0;border-radius:14px;padding:13px;margin:9px 0}.tx{display:flex;gap:10px}.info{flex:1}.name{font-weight:700}.desc{font-size:12px;color:#778594}.amt{font-weight:700}.green{color:#16834b}.red{color:#c83d3d}.customer{display:flex;justify-content:space-between;gap:10px}.customer small{display:block;color:#8995a2}.cargo .top{display:flex;justify-content:space-between}.cargo .meta{font-size:12px;color:#758291}.numbers{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px;font-size:12px}.numbers b{display:block;font-size:14px}.seg{display:grid;grid-template-columns:1fr 1fr;background:#e5eaf0;padding:3px;border-radius:10px}.seg button{background:transparent;color:#566575}.seg .sel{background:#fff;color:#123b67}.modal{display:none;position:fixed;inset:0;background:#0008;z-index:20;align-items:flex-end}.modal.show{display:flex}.sheet{background:#f7f8fa;width:100%;max-height:94vh;overflow:auto;border-radius:22px 22px 0 0;padding:18px}.sheet button{width:100%;margin-top:8px}nav{position:fixed;bottom:0;left:0;right:0;height:78px;background:#fff;border-top:1px solid #ddd;display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr;z-index:10}nav button{background:transparent;color:#718096;border-radius:0;font-size:21px}nav button small{display:block;font-size:10px}nav .add{width:54px;height:54px;align-self:center;justify-self:center;border-radius:50%;background:#123b67;color:#fff}@media(min-width:700px){.modal{align-items:center}.sheet{max-width:600px;border-radius:20px}}