*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:#f4f7f8;color:#183440;font:15px/1.6 system-ui,-apple-system,"Segoe UI",sans-serif}
header{display:flex;align-items:center;gap:18px;padding:18px 4%;background:#fff;border-bottom:1px solid #dce5e8}
.brand{display:flex;align-items:center;gap:20px;flex-shrink:0}
header b{color:#007e78;letter-spacing:2px}
.brand span{color:#607680;font-size:14px}
#identity{margin-left:auto;text-align:right;font-size:14px;overflow-wrap:anywhere}
main{max-width:1440px;margin:36px auto;padding:0 24px}
h1{font-size:30px;line-height:1.35;margin:4px 0 10px;letter-spacing:-.6px}
p,small{color:#536b75}
.eyebrow{margin:0 0 8px;color:#00796f;letter-spacing:1.8px;font-size:12px;font-weight:700}
.panel{background:#fff;border:1px solid #dce5e8;border-radius:14px;padding:24px;box-shadow:0 3px 12px #18344004}
.login{max-width:440px;margin:70px auto 20px;padding:32px}
.login form{margin:24px 0 18px}
.login label{display:block;margin:18px 0 7px;font-size:14px;font-weight:600}
.login input,.login .primary{width:100%}
.login .primary{margin-top:24px}
.login small{display:block;font-size:13px}
input,button{font:inherit;border:1px solid #bccdd2;border-radius:8px;padding:10px 14px;min-height:44px}
button{background:#fff;color:#164b52;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s}
button:hover:not(:disabled){background:#edf6f4;border-color:#83b6af}
button:disabled{color:#7a8d96;background:#f3f6f7;border-color:#dde6e9;cursor:default}
input{background:#fff;min-width:0;color:#183440}
input::placeholder{color:#738891}
button.primary,nav button[aria-pressed=true]{background:#007f77;color:#fff;border-color:#007f77}
button.primary:hover:not(:disabled),nav button[aria-pressed=true]:hover{background:#006d66;border-color:#006d66}
button.primary:disabled{background:#8abdb7;border-color:#8abdb7;color:#fff}
button:focus-visible,input:focus-visible,.table-wrap:focus-visible{outline:3px solid #78cdbc;outline-offset:3px}
.workspace-heading{display:flex;align-items:center;justify-content:space-between;gap:24px}
.workspace-description{margin:0;max-width:800px;font-size:14px}
.client-context{display:flex;flex-direction:column;gap:3px;min-width:160px;max-width:300px;padding:12px 18px;border:1px solid #d5e7e3;border-radius:10px;background:#edf6f3}
.client-context span{color:#536b75;font-size:12px}
.client-context strong{color:#08675d;font-size:16px;overflow-wrap:anywhere}
nav{display:flex;gap:8px;margin:24px 0 18px}
nav button{min-width:112px}
.toolbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.toolbar form{display:flex;flex:1;gap:8px;max-width:650px;min-width:280px}
.search-field{display:flex;flex:1;gap:8px;min-width:0}
.search-field input{flex:1;width:100%}
#reset-search{padding:10px;white-space:nowrap;font-size:13px}
.toolbar-actions{display:flex;gap:8px;flex-shrink:0}
.result-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:18px 0 12px}
.result-meta p{margin:0;font-size:13px;overflow-wrap:anywhere;max-width:100%}
#count{color:#21434d;font-weight:600}
#updated-at{font-variant-numeric:tabular-nums;color:#617781}
.table-wrap{overflow:auto;border:1px solid #dfe8ea;border-radius:9px;background:#fff;max-height:620px}
table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;min-width:760px}
table[data-kind=orders]{min-width:1450px}
table[data-kind=history]{min-width:930px}
th{position:sticky;top:0;z-index:1;text-align:left;background:#edf4f4;color:#385761;font-size:12px;font-weight:700;white-space:nowrap;border-bottom:1px solid #d4e2e5}
th,td{padding:13px 16px;border-bottom:1px solid #e5ecee;vertical-align:middle}
td{max-width:380px;overflow-wrap:anywhere}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover td{background:#f7fafb}
.numeric{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.code-cell{font-variant-numeric:tabular-nums;white-space:nowrap}
.product-cell{min-width:200px;line-height:1.5}
.status-cell{white-space:nowrap;min-width:110px}
.status-badge{display:inline-block;padding:3px 8px;border-radius:5px;background:#edf2f4;color:#49626c;font-size:12px;font-weight:600}
.status-badge.success{background:#e6f5ec;color:#246b47}
.status-badge.pending{background:#fff3dc;color:#8d611d}
.status-badge.active{background:#e6f1fb;color:#235d8d}
.status-badge.muted{background:#f1f3f5;color:#677b85}
.table-state td{text-align:left;padding:38px 20px;white-space:normal}
.table-state strong{display:block;color:#385761;font-size:15px;margin-bottom:6px}
.table-state p{margin:0 0 16px;font-size:13px}
.table-state p:last-child{margin-bottom:0}
.table-state button{font-size:13px;min-height:38px;padding:6px 14px}
.paging{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:20px}
#page{min-width:78px;text-align:center;color:#536b75;font-size:14px;font-variant-numeric:tabular-nums}
.table-hint{margin:16px 0 0;text-align:center;font-size:12px;line-height:1.6}
#error{background:#fff0f2;border:1px solid #efc3cb;border-radius:9px;padding:12px 16px;color:#a2253d;font-size:14px;max-width:1392px;margin:18px auto 0;overflow-wrap:anywhere}
body:has(#workspace[hidden]) #error{max-width:440px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.workspace-heading{align-items:flex-start}.client-context{min-width:140px}.toolbar form{max-width:none}.toolbar-actions{margin-left:auto}}
@media(max-width:640px){header{gap:10px 14px;flex-wrap:wrap;padding:15px 16px}.brand{gap:12px}.brand b{font-size:14px}.brand span{font-size:12px}#identity{order:3;width:100%;text-align:left;margin-left:0;font-size:13px}#identity:empty{display:none}#logout{margin-left:auto;padding:6px 10px;min-height:36px;font-size:13px}main{margin:24px auto;padding:0 14px}.panel{padding:16px}.login{margin:36px auto 20px;padding:24px}.workspace-heading{flex-direction:column;gap:16px}.client-context{width:100%;max-width:none;flex-direction:row;align-items:center;gap:12px;padding:10px 14px}.client-context strong{font-size:14px}.workspace-description{font-size:13px}nav{gap:6px;margin:18px 0 14px}nav button{flex:1;min-width:0;padding:10px 5px;font-size:13px}.toolbar{gap:10px}.toolbar form{min-width:0;width:100%;flex-basis:100%}.toolbar form>button{padding:10px 12px}.toolbar-actions{width:100%;margin-left:0}.toolbar-actions button{flex:1;font-size:13px}#reset-search{padding:10px 7px;font-size:12px}.result-meta{gap:5px;align-items:flex-start;flex-direction:column;margin:16px 0 10px}.result-meta p{font-size:12px}h1{font-size:27px}th,td{padding:12px}.table-wrap{max-height:560px}.paging{gap:12px}.paging button{padding:8px 15px}.table-hint{text-align:left}}
@media(prefers-reduced-motion:reduce){button{transition:none}}