:root {
    --primary: #0052A4;
    --secondary: #009AC8;
    --accent: #038C7F;
    --heading: #002F66;
    --bg: #f4f7fa;
    --card: #ffffff;
    --border: #dce4ec;
    --muted: #697989;
    --danger: #b42318;
    --warning: #8a5a00;
    --success: #087a63;
    --shadow: 0 8px 26px rgba(0, 47, 102, .08);
}
* { box-sizing: border-box; }
body { margin:0; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:#1b2b3b; background:var(--bg); }
a { color:inherit; }
.topbar { height:72px; padding:0 24px; display:grid; grid-template-columns:220px 1fr 260px; align-items:center; gap:20px; background:#fff; border-bottom:1px solid var(--border); position:sticky; top:0; z-index:20; }
.brand { font-size:22px; line-height:1; font-weight:800; color:var(--primary); }.brand span{font-weight:600;color:var(--heading)}.version{font-size:11px;color:var(--muted);margin-top:5px}.topbar nav{display:flex;justify-content:center;gap:6px}.topbar nav a{text-decoration:none;padding:10px 14px;border-radius:9px;color:var(--muted);font-weight:650}.topbar nav a.active,.topbar nav a:hover{background:#edf5fc;color:var(--primary)}.actor{text-align:right;font-size:12px;color:var(--muted)}
.flash{margin:14px 24px 0;padding:12px 16px;border-radius:10px;border:1px solid}.flash-success{background:#ecfdf8;border-color:#a4e7d5;color:#066650}.flash-error{background:#fff1f0;border-color:#ffc8c3;color:var(--danger)}
.workspace{display:grid;grid-template-columns:340px minmax(0,1fr);min-height:calc(100vh - 72px)}.orders-panel{background:#fff;border-right:1px solid var(--border);min-height:calc(100vh - 72px)}.panel-heading{padding:22px 18px 16px;display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid var(--border)}.panel-heading h1{font-size:17px;margin:0;color:var(--heading)}.panel-heading p{font-size:12px;margin:4px 0 0;color:var(--muted)}.count-badge{min-width:30px;height:30px;padding:0 8px;border-radius:15px;background:#edf5fc;color:var(--primary);display:grid;place-items:center;font-weight:700}.order-list{padding:10px}.order-card{display:block;text-decoration:none;padding:14px;border:1px solid transparent;border-radius:12px;margin-bottom:8px}.order-card:hover{background:#f7fafc}.order-card.selected{background:#edf5fc;border-color:#b8d5ef}.order-card-top,.order-meta{display:flex;justify-content:space-between;gap:10px;align-items:center}.order-card-top strong{color:var(--heading)}.order-card-top span,.order-meta{font-size:11px;color:var(--muted)}.order-name{font-size:13px;margin:5px 0 10px}.assignment-mini{font-weight:650}.assignment-mini.done{color:var(--success)}.empty-list{padding:22px;color:var(--muted);font-size:13px}
.detail-panel{padding:28px;max-width:1240px;width:100%;margin:0 auto}.welcome-card{min-height:450px;border:1px dashed #b9cad8;border-radius:18px;display:grid;place-items:center;align-content:center;text-align:center;padding:40px;color:var(--muted)}.welcome-card h2{margin:10px 0 5px;color:var(--heading)}.welcome-card p{max-width:560px}.welcome-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#e8f5f3;color:var(--accent);font-size:28px}.detail-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px}.eyebrow{text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:800;color:var(--secondary)}.detail-head h2,.settings-head h1{margin:4px 0;color:var(--heading);font-size:28px}.detail-head p,.settings-head p{margin:0;color:var(--muted);font-size:13px}.status-pill{padding:8px 11px;border-radius:999px;background:#eef2f6;font-size:12px;font-weight:700;text-transform:capitalize}.status-ready_for_postage{background:#e8f8f3;color:var(--success)}.status-packing{background:#fff8e6;color:var(--warning)}.notice{padding:13px 15px;border-radius:10px;margin-bottom:18px;font-size:13px}.notice.warning{background:#fff7e8;color:#775000;border:1px solid #ffe0a0}.grid-two{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.box{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:var(--shadow)}.box-title{font-size:14px;font-weight:800;color:var(--heading);margin-bottom:14px}.small-hint{font-size:11px;color:var(--muted);margin-top:8px}.progress-row,.metric{display:flex;justify-content:space-between;gap:15px;font-size:13px}.progress{height:8px;border-radius:8px;background:#edf1f4;overflow:hidden;margin:9px 0 16px}.progress span{display:block;height:100%;background:var(--accent);border-radius:8px}.metric{padding:8px 0;border-top:1px solid #edf1f4}.items-box,.units-box{margin-bottom:16px}.items-table{width:100%;border-collapse:collapse;font-size:13px}.items-table th{text-align:left;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em;padding:0 10px 9px}.items-table td{border-top:1px solid #edf1f4;padding:11px 10px}.box-title-row{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.ready-badge{background:#e8f8f3;color:var(--success);padding:8px 10px;border-radius:9px;font-size:12px;font-weight:750}.unit-list{border-top:1px solid #edf1f4}.unit-row{display:grid;grid-template-columns:minmax(220px,1fr) minmax(180px,auto) auto;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid #edf1f4}.unit-row:last-child{border-bottom:0}.unit-name{font-weight:700;color:var(--heading)}.unit-sub{font-size:11px;color:var(--muted);margin-top:3px}.unit-code{display:flex;align-items:center;gap:10px;color:var(--success)}.unit-code .check{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#e8f8f3;font-weight:900}.unit-code small{display:block;color:var(--muted);margin-top:2px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.btn{border:0;border-radius:9px;padding:10px 13px;font:inherit;font-size:12px;font-weight:750;cursor:pointer;text-decoration:none;display:inline-flex;justify-content:center;align-items:center}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:#00458a}.btn-secondary{background:#edf1f4;color:#34495e}.btn-success{background:var(--accent);color:#fff}.btn:disabled{opacity:.45;cursor:not-allowed}.future-action{display:flex;gap:14px;align-items:center;padding:4px 0 30px}.future-action span{font-size:12px;color:var(--muted)}
.modal{display:none;position:fixed;inset:0;z-index:100}.modal.open{display:block}.modal-backdrop{position:absolute;inset:0;background:rgba(1,28,54,.58)}.modal-card{position:relative;background:#fff;width:min(520px,calc(100% - 30px));margin:6vh auto;padding:24px;border-radius:18px;box-shadow:0 24px 80px rgba(0,0,0,.25);z-index:2}.modal-close{position:absolute;right:14px;top:10px;border:0;background:transparent;font-size:28px;cursor:pointer;color:#6b7d8f}.modal-card h2{margin:4px 0;color:var(--heading)}.modal-subtitle{margin:0 0 15px;color:var(--muted)}.camera-wrap{height:260px;background:#071827;border-radius:14px;overflow:hidden;position:relative;margin:15px 0}.camera-wrap video{width:100%;height:100%;object-fit:cover}.scan-frame{position:absolute;left:50%;top:50%;width:210px;height:120px;transform:translate(-50%,-50%);border:2px solid rgba(255,255,255,.85);border-radius:12px}.camera-message{position:absolute;left:10px;right:10px;bottom:10px;background:rgba(0,0,0,.58);color:#fff;font-size:11px;padding:8px 10px;border-radius:8px;text-align:center}.full{width:100%;margin-bottom:8px}.hidden{display:none!important}.or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:11px;margin:12px 0}.or:before,.or:after{content:"";height:1px;background:#e1e7ed;flex:1}.text-input,.form-grid input,.fine-tune input{width:100%;border:1px solid #cbd7e1;border-radius:9px;padding:10px 11px;font:inherit;background:#fff}.modal label,.form-grid label,.fine-tune label{font-size:11px;font-weight:700;color:#526476;display:block}.modal .text-input{margin:6px 0 9px}
.settings-page{max-width:1180px;margin:0 auto;padding:32px 24px 60px}.settings-head{margin-bottom:20px}.settings-head p{max-width:800px;line-height:1.55}.settings-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:20px;margin-bottom:16px;box-shadow:var(--shadow)}.settings-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.settings-card-head h2{margin:0;color:var(--heading);font-size:18px}.switch-label{font-size:12px;color:var(--muted)}.form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}.form-grid label input{margin-top:5px}.fine-tune{display:grid;grid-template-columns:minmax(280px,1fr) 140px 140px;gap:12px;align-items:end;background:#f4f9fd;border:1px solid #d7e9f6;padding:14px;border-radius:12px;margin-bottom:16px}.fine-tune strong{display:block;color:var(--heading);font-size:13px}.fine-tune span{display:block;color:var(--muted);font-size:11px;margin-top:3px;line-height:1.4}.new-profile{border-style:dashed}
@media(max-width:900px){.topbar{grid-template-columns:1fr auto}.actor{display:none}.topbar nav{justify-content:flex-end}.workspace{grid-template-columns:1fr}.orders-panel{min-height:auto;border-right:0;border-bottom:1px solid var(--border)}.order-list{display:flex;overflow:auto}.order-card{min-width:260px}.grid-two{grid-template-columns:1fr}.unit-row{grid-template-columns:1fr}.form-grid{grid-template-columns:repeat(2,1fr)}.fine-tune{grid-template-columns:1fr 1fr}}@media(max-width:560px){.topbar{padding:0 14px}.brand{font-size:18px}.topbar nav a{padding:8px}.detail-panel,.settings-page{padding:18px 12px}.form-grid,.fine-tune{grid-template-columns:1fr}}
