*{box-sizing:border-box}body{margin:0;background:#ece9ec;font-family:Inter,system-ui;color:#231d21}main{width:min(520px,100%);margin:auto;min-height:100vh;background:#fff}header{background:#241c22;color:#fff;padding:calc(22px + env(safe-area-inset-top)) 22px 22px;display:flex;justify-content:space-between;align-items:center}header b{display:block;font-size:20px}header small{color:#c6bfc3}button{border:0;border-radius:12px;background:#e72b78;color:#fff;padding:15px;font-weight:800;font-size:15px;width:100%}section{padding:24px}h1{font-size:29px}.login{display:grid;place-items:center;padding:24px;background:#241c22}.login form{width:100%;background:#fff;padding:30px;border-radius:20px}.login form>b{color:#e72b78;font-size:23px}label{display:block;margin:16px 0;font-weight:700}input{width:100%;padding:14px;margin-top:7px;border:1px solid #d8d1d5;border-radius:10px;font:inherit}.error{color:#b42318;background:#fff0f0;padding:12px}.logout,.back{width:auto;background:#443840}.back{font-size:27px;padding:4px 14px}.job{display:flex;gap:15px;align-items:center;text-align:left;background:#faf8fa;color:#231d21;margin:10px 0}.job>span{color:#e72b78;font-weight:900}.job p{flex:1;margin:0}.job small{display:block;color:#746b70;margin-top:5px}.job>.job-message{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;color:#0f4b8c}.job>.job-message.unread{color:#ea2e81}.job-message svg{width:27px;height:27px}.route{display:grid;grid-template-columns:32px 1fr;gap:6px 10px}.route span{width:30px;height:30px;background:#241c22;color:#fff;border-radius:50%;display:grid;place-items:center}.route p{margin:0 0 24px}.route small,.customer small{display:block;color:#746b70;margin-bottom:4px}.navigate{display:block;text-align:center;padding:14px;border:2px solid #e72b78;border-radius:12px;color:#d91d6b;font-weight:800;text-decoration:none}.customer{padding:18px;background:#f6f3f5;border-radius:12px;margin:22px 0}.customer b,.customer a{display:block;margin-top:5px;color:#231d21}.pod{margin-top:24px;padding-top:10px;border-top:1px solid #eee}.photo{border:2px dashed #d3cbd0;padding:16px;border-radius:12px}.photo img{width:100%;margin-top:12px;border-radius:8px}.check{display:flex;align-items:center;gap:10px}.check input{width:auto;margin:0}.done{text-align:center;color:#16824d;font-size:50px;padding:50px 0}.done h2,.done p{color:#231d21;font-size:22px}.done p{font-size:15px}.messages{margin-top:28px;padding-top:20px;border-top:1px solid #eee}.messages h2{margin-bottom:12px}.message-list{display:grid;gap:9px;max-height:360px;overflow:auto;padding:4px}.message-list article{justify-self:start;max-width:88%;padding:10px 12px;border-radius:13px 13px 13px 3px;background:#f0ecef}.message-list article.mine{justify-self:end;border-radius:13px 13px 3px;background:#ffe1ee}.message-list article b,.message-list article small{display:block}.message-list article small{margin-top:2px;color:#746b70;font-weight:400}.message-list article p{margin:7px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}.message-receipt{display:flex;justify-content:flex-end;margin:3px 0 -4px;color:#8b8187}.message-receipt svg{width:19px;height:19px}.message-receipt.read{color:#0f4b8c}.message-list .empty{color:#746b70}.messages form{display:grid;gap:8px;margin-top:10px}.messages textarea{min-height:78px;resize:vertical;padding:12px;border:1px solid #d8d1d5;border-radius:10px;font:inherit}