:root{--bg:#0a0a0b;--surface:#161618;--surface-2:#1e1e21;--border:#2a2a2e;--border-hover:#3a3a3f;--text:#f4f4f5;--text-muted:#96969e;--accent:#5b8cff;--accent-hover:#7aa1ff;--win:#34c77b;--win-bg:rgba(52,199,123,0.12);--loss:#f2555a;--loss-bg:rgba(242,85,90,0.12);--radius:14px;--radius-sm:8px;--shadow:0 1px 2px rgba(0,0,0,0.3),0 8px 24px rgba(0,0,0,0.25);--font-sans:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,sans-serif}*{box-sizing:border-box}body,html{padding:0;margin:0}body{background:var(--bg);background-image:radial-gradient(circle at 15% 0,rgba(91,140,255,.08),transparent 40%);color:var(--text);font-family:var(--font-sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font-family:inherit}h1,h2,h3{margin:0;letter-spacing:-.02em}.page{max-width:1280px}.page,.page-narrow{margin:0 auto;padding:32px 24px 64px}.page-narrow{max-width:640px}.topbar{position:-webkit-sticky;position:sticky;top:0;z-index:10;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--border);background:rgba(10,10,11,.85);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.topbar,.topbar-brand{display:flex;align-items:center}.topbar-brand{gap:10px;font-weight:700;font-size:16px}.topbar-logo{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--accent),#8f6bff);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;color:#fff;flex-shrink:0}.topbar-nav-desktop,.topbar-right{display:flex;align-items:center;gap:16px}.topbar-menu-btn{display:none;align-items:center;justify-content:center;background:transparent;border:none;color:var(--text);padding:6px;cursor:pointer}.topbar-mobile-backdrop,.topbar-mobile-menu{display:none}@media (max-width:1200px){.topbar{padding:14px 16px}.topbar-brand{font-size:14px;white-space:nowrap}.topbar-nav-desktop,button.topbar-logout-desktop{display:none!important}.topbar-menu-btn{display:flex}.topbar-mobile-backdrop{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:15}.topbar-mobile-menu{display:flex;flex-direction:column;position:fixed;top:0;right:0;bottom:0;width:min(78vw,300px);background:var(--surface);border-left:1px solid var(--border);gap:4px;z-index:20;overflow-y:auto;padding:max(24px,env(safe-area-inset-top)) 20px 24px}.topbar-mobile-link{padding:12px 4px;font-size:15px;font-weight:600;border-bottom:1px solid var(--border)}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid transparent;border-radius:var(--radius-sm);padding:10px 16px;font-size:14px;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .1s ease,opacity .15s ease}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-secondary{background:var(--surface-2);border-color:var(--border);color:var(--text)}.btn-secondary:hover:not(:disabled){border-color:var(--border-hover);background:var(--surface)}.btn-danger{background:transparent;border-color:var(--loss);color:var(--loss)}.btn-danger:hover:not(:disabled){background:var(--loss-bg)}.btn-ghost{background:transparent;color:var(--text-muted)}.btn-ghost:hover:not(:disabled){color:var(--text)}.btn-sm{padding:6px 10px;font-size:13px}input,select,textarea{font-family:inherit;font-size:14px;background:var(--surface-2);border:1px solid var(--border);color:var(--text);border-radius:var(--radius-sm);padding:10px 12px;width:100%;transition:border-color .15s ease}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent)}input[type=checkbox],input[type=radio]{width:16px;height:16px;min-width:16px;padding:0;background:none;border:none;accent-color:var(--accent);cursor:pointer}input::placeholder,textarea::placeholder{color:var(--text-muted)}.field{display:flex;flex-direction:column;gap:6px}.field-label{font-size:13px;color:var(--text-muted);font-weight:500}.field-error{font-size:12px;color:var(--loss)}.field-row{display:grid;grid-template-columns:1fr 1fr;grid-gap:16px;gap:16px}@media (max-width:560px){.field-row{grid-template-columns:1fr}}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.card-pad{padding:20px}.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700}.badge-win{background:var(--win-bg);color:var(--win)}.badge-loss{background:var(--loss-bg);color:var(--loss)}.badge-dot{width:6px;height:6px;border-radius:50%;background:currentColor}.muted{color:var(--text-muted)}.skeleton{background:linear-gradient(90deg,var(--surface) 25%,var(--surface-2) 37%,var(--surface) 63%);background-size:400% 100%;animation:skeleton-loading 1.4s ease infinite;border-radius:var(--radius)}@keyframes skeleton-loading{0%{background-position:100% 50%}to{background-position:0 50%}}.delivery-track{display:flex;align-items:flex-start;overflow-x:auto;padding-bottom:4px}.delivery-step{display:flex;flex-direction:column;align-items:center;flex:1 0 110px;min-width:100px;position:relative}.delivery-step-line{position:absolute;top:13px;left:-50%;width:100%;height:3px;background:var(--border);z-index:0}.delivery-step-line-done{background:var(--win)}.delivery-step-dot{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--surface-2);border:2px solid var(--border);position:relative;z-index:1;transition:background .3s ease,border-color .3s ease}.delivery-step-done .delivery-step-dot{background:var(--win);border-color:var(--win)}.delivery-step-current .delivery-step-dot{border-color:var(--accent);background:var(--surface)}.delivery-step-pulse{width:10px;height:10px;border-radius:50%;background:var(--accent);animation:delivery-pulse 1.4s ease-in-out infinite}@keyframes delivery-pulse{0%{box-shadow:0 0 0 0 rgba(91,140,255,.5)}70%{box-shadow:0 0 0 8px rgba(91,140,255,0)}to{box-shadow:0 0 0 0 rgba(91,140,255,0)}}.delivery-step-label{margin-top:8px;text-align:center;display:flex;flex-direction:column;gap:2px;padding:0 4px}.delivery-step-label span:first-child{font-size:12px;font-weight:600;color:var(--text-muted)}.delivery-step-current .delivery-step-label span:first-child,.delivery-step-done .delivery-step-label span:first-child{color:var(--text)}.delivery-step-time{font-size:11px;color:var(--text-muted)}.scrollbar-thin::-webkit-scrollbar{height:6px;width:6px}.scrollbar-thin::-webkit-scrollbar-thumb{background:var(--border-hover);border-radius:999px}.animated-number{display:inline-block;transition:color .4s ease,transform .4s ease}.animated-number--up{color:var(--win);transform:scale(1.06)}.animated-number--down{color:var(--loss);transform:scale(1.06)}.live-dot{width:7px;height:7px;border-radius:999px;flex-shrink:0}.live-dot--live{background:var(--win);animation:live-pulse 2s ease-in-out infinite}.live-dot--connecting{background:var(--text-muted);animation:live-pulse 1s ease-in-out infinite}.live-dot--reconnecting{background:#f5a623;animation:live-pulse 1s ease-in-out infinite}.live-dot--offline{background:var(--loss)}@keyframes live-pulse{0%,to{box-shadow:0 0 0 0 rgba(52,199,123,.35)}50%{box-shadow:0 0 0 4px rgba(52,199,123,0)}}.barcode-print-sheet{display:none}.barcode-label{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:6px}.barcode-label-name{font-size:10px;font-weight:600;color:#000;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}@media print{.no-print{display:none!important}.barcode-print-sheet{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:8px;gap:8px;background:#fff}.barcode-label{page-break-inside:avoid;break-inside:avoid;border:1px dashed #ccc}.barcode-label svg{max-width:100%}}