:root{color-scheme:light dark;--page: #f9f9f7;--surface: #fcfcfb;--text-primary: #0b0b0b;--text-secondary: #52514e;--text-muted: #898781;--border: rgba(11, 11, 11, .1);--border-strong: rgba(11, 11, 11, .2);--accent: #007aff;--accent-deep: #0062cc;--accent-tint: rgba(0, 122, 255, .1);--accent-ring: rgba(0, 122, 255, .28);--success: #006300;--danger: #d03b3b;--st-queued: #b45309;--st-ordered: #2a78d6;--st-delivered: #006300;--st-buffered: #4a3aa7;font-family:system-ui,-apple-system,Segoe UI,sans-serif}@media (prefers-color-scheme: dark){:root{--page: #0d0d0d;--surface: #1a1a19;--text-primary: #ffffff;--text-secondary: #c3c2b7;--text-muted: #898781;--border: rgba(255, 255, 255, .1);--border-strong: rgba(255, 255, 255, .22);--accent: #0a84ff;--accent-deep: #3395ff;--accent-tint: rgba(10, 132, 255, .16);--accent-ring: rgba(10, 132, 255, .32);--success: #0ca30c;--danger: #e66767;--st-queued: #d97706;--st-ordered: #3987e5;--st-delivered: #0ca30c;--st-buffered: #9085e9}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--page);color:var(--text-primary);line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::selection{background:var(--accent-ring)}.shell{min-height:100vh}.app{max-width:720px;margin:0 auto;padding:20px 16px 88px}.topbar{position:sticky;top:0;z-index:50;background:var(--page);border-bottom:1px solid var(--border)}.topbar-inner{max-width:720px;margin:0 auto;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;gap:11px;min-width:0}.brand-mark{flex:0 0 auto;width:32px;height:32px;display:grid;place-items:center;border-radius:9px;color:#fff;background:var(--accent)}.brand-mark svg{width:18px;height:18px;display:block}.brand-text{min-width:0}.brand-text h1{font-size:15px;font-weight:600;margin:0;line-height:1.2;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand-sub{display:block;font-size:11.5px;color:var(--text-muted);margin-top:1px}.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--surface);border-top:1px solid var(--border-strong);box-shadow:0 -2px 12px #0000001a;padding-bottom:env(safe-area-inset-bottom,0px)}.tabbar-inner{max-width:720px;margin:0 auto;display:flex;gap:8px;padding:8px 16px;justify-content:space-between;overflow-x:auto;scrollbar-width:none}.tabbar-inner::-webkit-scrollbar{display:none}button.tab,.tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:transparent;color:var(--text-secondary);font:inherit;font-size:13.5px;font-weight:500;padding:7px 14px;border-radius:999px;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;box-shadow:none;transition:color .15s,background .15s,border-color .15s}.tab-icon{width:15px;height:15px;flex:0 0 auto;opacity:.85}.tab.active .tab-icon{opacity:1;color:var(--accent)}button.tab:hover{background:var(--surface);color:var(--text-primary);filter:none;box-shadow:none;transform:none}button.tab.active,button.tab.active:hover{background:var(--surface);color:var(--text-primary);border-color:var(--text-muted);font-weight:600}button.tab:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent-ring)}button.tab:active{transform:none;filter:none}.tab-count{display:inline-block;margin-left:6px;min-width:18px;padding:1px 6px;border-radius:999px;font-size:11px;font-weight:700;line-height:1.4;font-variant-numeric:tabular-nums;background:var(--accent-tint);color:var(--accent)}.tab.active .tab-count{background:var(--accent);color:#fff}.subtabs{display:inline-flex;gap:4px;padding:3px;margin:4px 0 14px;border:1px solid var(--border);border-radius:999px;background:var(--surface)}button.subtab,.subtab{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;color:var(--text-secondary);font:inherit;font-size:13px;font-weight:500;padding:5px 18px;border-radius:999px;cursor:pointer;box-shadow:none;transition:color .15s,background .15s}button.subtab:hover{background:var(--page);color:var(--text-primary);filter:none;box-shadow:none;transform:none}button.subtab.active,button.subtab.active:hover{background:var(--accent);color:#fff;font-weight:600}button.subtab:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent-ring)}.card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:20px;margin-bottom:16px}button.card-close{position:absolute;top:14px;right:14px;width:36px;height:36px;padding:0;display:grid;place-items:center;border-radius:50%;background:transparent;border:1px solid var(--border-strong);color:var(--text-secondary)}button.card-close:hover{background:var(--surface);color:var(--text-primary);filter:none}button.card-close svg{width:15px;height:15px;display:block}.card h2{font-size:15px;font-weight:700;margin:0 0 4px;color:var(--text-primary)}.card h2+.muted{margin-top:0;margin-bottom:4px}.vendor-group-title{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--accent-deep);margin:4px 0 12px}.vendor-group-title:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);flex:0 0 auto}.vendor-group-title .group-meta{margin-left:auto;color:var(--text-muted);font-weight:500;font-size:12.5px;font-variant-numeric:tabular-nums;white-space:nowrap}h2.section{font-size:15px;font-weight:700;margin:26px 2px 10px;color:var(--text-primary)}label{display:block;font-size:12px;font-weight:500;color:var(--text-secondary);margin:14px 0 5px}input,select,textarea{width:100%;padding:10px 12px;border:1px solid var(--border-strong);border-radius:8px;font-size:15px;font-family:inherit;color:var(--text-primary);background:var(--page);transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;-moz-appearance:none;appearance:none}input::placeholder,textarea::placeholder{color:var(--text-muted)}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring)}select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5L6 8l3.5-3.5' fill='none' stroke='%23898781' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:34px;cursor:pointer}input[type=checkbox]{-webkit-appearance:checkbox;-moz-appearance:auto;appearance:auto;width:22px;height:22px;accent-color:var(--accent);cursor:pointer;flex:0 0 auto;padding:0}.line.selectable{cursor:pointer}.row{display:flex;gap:14px;flex-wrap:wrap}.row>div{flex:1;min-width:130px}button{font-family:inherit;font-size:14px;font-weight:600;padding:10px 18px;border-radius:8px;border:1px solid var(--accent);background:var(--accent);color:#fff;cursor:pointer;transition:filter .15s,background .15s,border-color .15s,color .15s}button:hover{filter:brightness(1.06)}button:active{filter:brightness(.95)}button:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent-ring)}button.secondary{background:var(--surface);color:var(--accent-deep);border-color:var(--border-strong)}button.secondary:hover{background:var(--accent-tint);filter:none}button.ghost{background:transparent;color:var(--text-secondary);border-color:var(--border-strong)}button.ghost:hover{background:var(--surface);color:var(--text-primary);filter:none}button.danger{background:transparent;color:var(--danger);border-color:color-mix(in srgb,var(--danger) 45%,transparent);padding:8px 14px;font-size:13.5px}button.danger:hover{background:color-mix(in srgb,var(--danger) 10%,transparent);filter:none}button:disabled{opacity:.5;cursor:not-allowed;filter:none}.btn-row{display:flex;gap:10px;flex-wrap:wrap}label.btn-file{display:inline-block;font-size:14px;font-weight:600;padding:10px 18px;border-radius:8px;border:1px solid var(--accent);background:var(--accent);color:#fff;cursor:pointer;margin:0}label.btn-file:hover{filter:brightness(1.06)}button.inquiry-bar{display:block;width:100%;padding:9px 14px;margin-bottom:12px;background:var(--surface);color:var(--accent-deep);border:1px solid var(--border-strong);border-radius:10px;font-size:13.5px;font-weight:600;text-align:center}button.inquiry-bar:hover{background:var(--accent-tint);border-color:var(--accent);filter:none}.invoice-drop{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px;padding:14px;border:2px dashed var(--border-strong);border-radius:12px;transition:border-color .15s,background .15s}.invoice-drop.drag{border-color:var(--accent);background:var(--accent-tint)}.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 9px 3px 8px;border-radius:999px;font-size:11.5px;font-weight:600;vertical-align:middle}.badge:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.9}.badge.queued{color:var(--st-queued);background:color-mix(in srgb,var(--st-queued) 12%,transparent)}.badge.ordered{color:var(--st-ordered);background:color-mix(in srgb,var(--st-ordered) 12%,transparent)}.badge.delivered{color:var(--st-delivered);background:color-mix(in srgb,var(--st-delivered) 12%,transparent)}.badge.buffered{color:var(--st-buffered);background:color-mix(in srgb,var(--st-buffered) 12%,transparent)}.badge.cancelled{color:var(--text-muted);background:color-mix(in srgb,var(--text-muted) 14%,transparent)}.badge.short{color:var(--vcol-2);background:color-mix(in srgb,var(--vcol-2) 12%,transparent)}.fav-hint{margin:12px 0 8px}.fav-block{margin-bottom:10px}:root{--vcol-0: #2fa8dc;--vcol-1: #1baf7a;--vcol-2: #eda100;--vcol-3: #4a3aa7;--vcol-4: #e34948;--vcol-5: #0d9488;--vcol-6: #e87ba4;--vcol-7: #898781}@media (prefers-color-scheme: dark){:root{--vcol-0: #54c1ea;--vcol-1: #199e70;--vcol-2: #c98500;--vcol-3: #9085e9;--vcol-4: #e66767;--vcol-5: #14b8a6;--vcol-6: #d55181;--vcol-7: #898781}}.vcol-0{--vcol: var(--vcol-0)}.vcol-1{--vcol: var(--vcol-1)}.vcol-2{--vcol: var(--vcol-2)}.vcol-3{--vcol: var(--vcol-3)}.vcol-4{--vcol: var(--vcol-4)}.vcol-5{--vcol: var(--vcol-5)}.vcol-6{--vcol: var(--vcol-6)}.vcol-7{--vcol: var(--vcol-7)}.fav-group{margin-bottom:8px}button.fav-group-head{display:flex;align-items:center;gap:8px;width:100%;padding:8px 10px;background:transparent;border:1px solid var(--border);border-radius:9px;color:var(--text-primary);font-size:13.5px;font-weight:700;text-align:left;box-shadow:none}button.fav-group-head:hover{background:var(--surface);filter:none}.fav-group-dot{width:9px;height:9px;border-radius:50%;background:var(--vcol);flex:0 0 auto}.fav-group-count{color:var(--text-muted);font-weight:500;font-size:12px}.fav-chev{margin-left:auto;color:var(--text-muted);font-size:12px;transition:transform .15s}.fav-chev.open{transform:rotate(90deg)}.fav-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;margin:6px 0 2px}button.fav-btn{display:flex;align-items:baseline;gap:6px;min-height:38px;padding:8px 10px;text-align:left;background:var(--surface);color:var(--text-primary);border:1px solid var(--border);border-left:3px solid var(--vcol, var(--border-strong));border-radius:9px;font-size:12.5px;font-weight:600}button.fav-btn:hover{background:var(--accent-tint);border-color:var(--accent);border-left-color:var(--vcol);filter:none}button.fav-btn:active{filter:brightness(.96)}button.fav-btn.supply-short{border-color:color-mix(in srgb,var(--vcol-2) 55%,transparent);border-left-color:var(--vcol-2);background:color-mix(in srgb,var(--vcol-2) 8%,var(--surface))}button.fav-btn.supply-short .fav-name{color:color-mix(in srgb,var(--text-primary) 72%,var(--vcol-2))}button.fav-btn.supply-short small{color:var(--vcol-2);font-weight:600}.supply-warn{margin:0 0 6px;padding:8px 12px;border-radius:9px;font-size:13px;font-weight:600;color:var(--vcol-2);background:color-mix(in srgb,var(--vcol-2) 10%,transparent);border:1px solid color-mix(in srgb,var(--vcol-2) 35%,transparent)}.fav-btn .fav-name{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-width:0}.fav-btn small{margin-left:auto;color:var(--text-muted);font-size:11px;font-weight:400;font-variant-numeric:tabular-nums;flex:0 0 auto}.search-box{position:relative}.suggestions{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 6px);background:var(--surface);border:1px solid var(--border);border-radius:12px;max-height:300px;overflow-y:auto;box-shadow:0 4px 16px #00000024;padding:5px}.suggestion{padding:9px 11px;border-radius:8px;cursor:pointer;font-size:14.5px;color:var(--text-primary);transition:background .12s}.suggestion:hover{background:var(--accent-tint)}.suggestion small{color:var(--text-muted);display:block;font-size:12px;margin-top:1px}.suggestion.muted{color:var(--text-muted);cursor:default}.suggestion.muted:hover{background:transparent}.line{display:flex;align-items:center;gap:14px;padding:11px 4px;margin:0 -4px;border-radius:8px;border-bottom:1px solid var(--border);transition:background .12s}.line:hover{background:color-mix(in srgb,var(--text-muted) 8%,transparent)}.line:last-child{border-bottom:none}.line .grow{flex:1;min-width:0;font-size:14.5px;font-weight:500}.line small{color:var(--text-muted);font-size:12.5px;font-weight:400}.muted{color:var(--text-muted);font-size:13px;line-height:1.6}.center{text-align:center}.mt{margin-top:18px}.empty{text-align:center;color:var(--text-muted);padding:40px 20px;font-size:14px;border:1px dashed var(--border-strong);border-radius:14px;margin-bottom:16px}.loading{display:grid;place-items:center;gap:14px;padding:22vh 0;color:var(--text-muted)}.spinner{width:26px;height:26px;border-radius:50%;border:2.5px solid var(--border);border-top-color:var(--accent);animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%);background:var(--surface);color:var(--text-primary);border:1px solid var(--border-strong);padding:12px 20px;border-radius:999px;font-size:14px;font-weight:500;z-index:100;box-shadow:0 4px 16px #0000002e;max-width:calc(100vw - 40px);cursor:pointer}.toast.error{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 45%,transparent)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#00000061;display:grid;place-items:center;padding:20px}.modal{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:24px;width:100%;max-width:620px;max-height:88vh;overflow-y:auto;box-shadow:0 12px 40px #00000038}.modal h2{font-size:17px;font-weight:700;margin:0 0 6px}.modal textarea{font-family:inherit}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.guide-lead{background:var(--accent-tint);border:1px solid var(--accent);border-radius:10px;padding:10px 14px;font-size:13.5px;font-weight:600;margin:10px 0 6px;line-height:1.6}.guide-step{display:flex;gap:12px;margin:14px 0}.guide-num{flex:0 0 auto;width:27px;height:27px;border-radius:50%;background:var(--accent);color:#fff;font-weight:700;font-size:14px;display:grid;place-items:center}.guide-step h3{font-size:14px;margin:2px 0}.guide-step p{font-size:13px;color:var(--text-secondary);margin:0;line-height:1.6}.gate{min-height:100vh;display:grid;place-items:center;padding:24px}.gate .card{width:100%;max-width:380px;padding:36px 32px;text-align:center}.gate .brand-mark{width:54px;height:54px;border-radius:14px;margin:0 auto 18px}.gate .brand-mark svg{width:28px;height:28px}.gate h1{font-size:21px;font-weight:700;margin:0 0 4px}.gate .muted{margin:0 0 22px}.gate input{text-align:center;font-size:16px;padding:12px}@media (max-width: 560px){.app{padding:16px 12px 80px}.topbar-inner{padding:11px 12px}.brand-text h1{font-size:14.5px}.tab{padding:7px 12px;font-size:12.5px}}
