* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.5 system-ui, sans-serif; color: #1b1b1b; background: #fff; }
.bar { display: flex; align-items: baseline; gap: 16px; padding: 18px 24px; border-bottom: 1px solid #e4e4e4; }
.bar h1 { margin: 0; font-size: 20px; }
.who { margin: 0; font-size: 13px; color: #9a9a9a; }
main { padding: 24px; }
.orders { width: 940px; border-collapse: collapse; }
.orders th, .orders td { padding: 10px 12px; text-align: left; border-bottom: 1px solid #ededed; }
.orders th { font-size: 13px; color: #767676; }
.state { font-size: 13px; color: #8d8d8d; }
.hint { margin: 16px 0 0; font-size: 13px; color: #a0a0a0; }
.actions { display: flex; gap: 12px; padding: 0 24px 24px; }
.btn { min-height: 44px; padding: 10px 18px; font: inherit; border: 1px solid #333; border-radius: 8px; background: #fff; cursor: pointer; }
.btn--primary { border-color: #1f6feb; background: #1f6feb; color: #fff; }
@media (max-width: 900px) { main { padding: 16px; } }
