*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;background:#f1f5f9;color:#172b40}header{background:#10243a;color:#fff;padding:22px 18px;display:flex;justify-content:space-between;align-items:center;gap:10px}header h2{margin:0;font-size:19px}header p{font-size:11px;letter-spacing:2px}#connection{font-size:11px;color:#72e6ae}main{max-width:900px;margin:auto;padding:18px}h1{margin-bottom:5px}.date{color:#64748b}.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:22px 0}.stats article,.panel{background:#fff;padding:18px;border-radius:12px;box-shadow:0 2px 8px #0000000b}.stats span{display:block;color:#64748b;font-size:13px}.stats strong{display:block;margin-top:12px;font-size:19px;overflow-wrap:anywhere}.panel{margin-bottom:18px}input,select{width:100%;padding:14px;margin:7px 0;border:1px solid #cbd5e1;border-radius:8px;font-size:15px;background:#fff}button{width:100%;border:0;padding:14px;margin-top:8px;border-radius:8px;background:#087e63;color:#fff;font-weight:700;font-size:15px}.customer{padding:12px 0;border-bottom:1px solid #e2e8f0}.customer small{display:block;color:#64748b;margin-top:5px}@media(min-width:650px){.stats{grid-template-columns:repeat(4,1fr)}}label{display:block;margin-top:12px;font-size:13px;font-weight:700;color:#475569}.customer button{max-width:220px;background:#10243a}
