:root{--red: #b8272c;--red-dark: #8f1e22;--bg: #f5f5f7;--surface: #ffffff;--surface-2: #f0f0f3;--text: #1c1c1e;--muted: #6b6b70;--border: #e2e2e6;--gold: #d99a2b;--green: #1f9d57;--shadow: 0 1px 3px rgba(0, 0, 0, .08), 0 1px 2px rgba(0, 0, 0, .04);--radius: 14px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}@media (prefers-color-scheme: dark){:root{--bg: #000000;--surface: #1c1c1e;--surface-2: #2c2c2e;--text: #f5f5f7;--muted: #98989f;--border: #38383a;--shadow: none}}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,PingFang SC,Microsoft YaHei,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;overscroll-behavior-y:contain}.app{max-width:640px;margin:0 auto;min-height:100%;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:20;background:var(--red);color:#fff;padding:calc(var(--safe-top) + 12px) 16px 12px;box-shadow:var(--shadow)}.topbar-row{display:flex;align-items:center;gap:12px}.topbar h1{font-size:18px;font-weight:650;margin:0;flex:1;line-height:1.2}.topbar .sub{font-size:12px;opacity:.85;margin-top:2px}.iconbtn{background:#ffffff29;border:none;color:#fff;width:38px;height:38px;border-radius:10px;font-size:18px;display:grid;place-items:center;cursor:pointer}.iconbtn:active{transform:scale(.94)}.status{display:flex;align-items:center;gap:8px;font-size:12px;padding:6px 16px;background:var(--surface-2);color:var(--muted);border-bottom:1px solid var(--border)}.dot{width:8px;height:8px;border-radius:50%;background:var(--green);flex:none}.dot.offline{background:var(--gold)}.dot.syncing{background:var(--red);animation:pulse 1s infinite}@keyframes pulse{50%{opacity:.3}}.content{flex:1;padding:16px 16px calc(96px + var(--safe-bottom))}.searchbar{display:flex;gap:8px;margin-bottom:12px}.searchbar input{flex:1}.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:12px;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}.chip{flex:none;border:1px solid var(--border);background:var(--surface);color:var(--text);padding:7px 14px;border-radius:999px;font-size:13px;cursor:pointer;white-space:nowrap}.chip.active{background:var(--red);border-color:var(--red);color:#fff}.card{display:block;color:inherit;text-decoration:none;background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--border);padding:14px 16px;margin-bottom:10px;cursor:pointer}.card:active{transform:scale(.995)}.card-head{display:flex;align-items:flex-start;gap:10px}.card-head .name{font-weight:620;font-size:16px;flex:1;line-height:1.25}.badge{font-size:11px;font-weight:600;padding:3px 8px;border-radius:999px;background:var(--surface-2);color:var(--muted);white-space:nowrap}.badge.status-quote{background:#fff3d6;color:#9a6b00}.badge.status-sample{background:#e2eefd;color:#1d63c4}.badge.status-ordered{background:#dff4e6;color:#1f7a45}.badge.status-skip{background:var(--surface-2);color:var(--muted)}@media (prefers-color-scheme: dark){.badge.status-quote{background:#453a17;color:#f2c94c}.badge.status-sample{background:#1c3151;color:#8ab6f5}.badge.status-ordered{background:#163a26;color:#74d79c}}.card-meta{color:var(--muted);font-size:13px;margin-top:6px;display:flex;flex-wrap:wrap;gap:4px 12px}.stars{color:var(--gold);letter-spacing:1px;font-size:13px;margin-top:6px}.stars .off{color:var(--border)}.field{margin-bottom:14px}.field label{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:6px}input,select,textarea{width:100%;font:inherit;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);outline:none}input:focus,select:focus,textarea:focus{border-color:var(--red)}textarea{min-height:84px;resize:vertical}.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:12px;padding:13px 18px;font:inherit;font-weight:600;cursor:pointer;background:var(--surface-2);color:var(--text)}.btn:active{transform:scale(.98)}.btn.primary{background:var(--red);color:#fff}.btn.danger{background:transparent;color:var(--red);border:1px solid var(--red)}.btn.block{width:100%}.btn.ghost{background:transparent;color:var(--red)}.btn:disabled{opacity:.5}.fab{position:fixed;right:max(16px,calc((100vw - 640px)/2 + 16px));bottom:calc(20px + var(--safe-bottom));width:58px;height:58px;border-radius:50%;background:var(--red);color:#fff;border:none;font-size:30px;box-shadow:0 6px 16px #b8272c66;cursor:pointer;z-index:30}.fab:active{transform:scale(.94)}.rating{display:flex;gap:6px;font-size:30px;color:var(--border)}.rating .on{color:var(--gold)}.rating span{cursor:pointer}.product{display:flex;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:10px;margin-bottom:8px}.product img,.product .noimg{width:56px;height:56px;border-radius:8px;object-fit:cover;flex:none;background:var(--surface-2);display:grid;place-items:center;color:var(--muted);font-size:20px}.product .p-body{flex:1;min-width:0}.product .p-name{font-weight:600;font-size:15px}.product .p-meta{color:var(--muted);font-size:13px;margin-top:2px}.detail-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:14px;box-shadow:var(--shadow)}.detail-section h3{margin:0 0 12px;font-size:14px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}.kv{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--border);font-size:15px}.kv:last-child{border-bottom:none}.kv .k{color:var(--muted)}.kv .v{text-align:right;word-break:break-word}.kv a{color:var(--red);text-decoration:none}.empty{text-align:center;color:var(--muted);padding:60px 20px}.empty .big{font-size:48px;margin-bottom:12px}.actions{display:flex;gap:10px;margin-top:8px}.actions .btn{flex:1}.hint{font-size:13px;color:var(--muted);margin-top:6px;line-height:1.5}.center-screen{min-height:100%;display:flex;flex-direction:column;justify-content:center;padding:24px;gap:16px}.logo-badge{width:72px;height:72px;border-radius:18px;background:var(--red);color:#fff;display:grid;place-items:center;font-size:36px;margin:0 auto 8px}.error{color:var(--red);font-size:13px}.toolbar{display:flex;gap:10px;margin-bottom:16px}.toolbar .btn{flex:1}.content.with-nav{padding-bottom:calc(84px + var(--safe-bottom))}.switcher select{width:100%;background:#ffffff29;color:#fff;border:none;border-radius:10px;padding:10px 12px;font-size:15px;font-weight:600;-moz-appearance:none;appearance:none;-webkit-appearance:none}.switcher select option{color:var(--text)}.iconbtn.dark{background:var(--surface-2);color:var(--text)}.pagehead{display:flex;align-items:center;gap:10px;margin:2px 0 14px}.pagetitle{margin:0;font-size:22px;font-weight:680;line-height:1.15}.pagesub{color:var(--muted);font-size:13px;margin-top:2px}.bottomnav{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;justify-content:space-around;background:var(--surface);border-top:1px solid var(--border);padding:6px 4px calc(6px + var(--safe-bottom));max-width:640px;margin:0 auto}.navitem{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 0;text-decoration:none;color:var(--muted);font-size:11px}.navitem .ico{font-size:20px;line-height:1}.navitem.active{color:var(--red)}.navitem.center .ico{background:var(--red);color:#fff;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;margin-top:-14px;box-shadow:0 4px 12px #b8272c66;font-size:24px}.navitem.center.active .ico{color:#fff}.statgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px 10px;text-align:center;text-decoration:none;color:var(--text)}.stat-n{font-size:26px;font-weight:700;color:var(--red)}.stat-l{font-size:12px;color:var(--muted);margin-top:2px}.menu{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;margin-bottom:16px}.menu-item{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--border);text-decoration:none;color:var(--text);font-size:15px;cursor:pointer}.menu-item:last-child{border-bottom:none}.menu-ico{font-size:18px;width:24px;text-align:center}.menu-arrow{color:var(--muted);font-size:20px}.section-label{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:6px 4px 8px}.dupe{background:#fff8e6;border:1px solid #f0d488;border-radius:var(--radius);padding:14px;margin-bottom:14px}@media (prefers-color-scheme: dark){.dupe{background:#3a3212;border-color:#6b5a1e}}.dupe-title{font-weight:700;margin-bottom:10px}.dupe-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid rgba(0,0,0,.08)}.checkrow{display:flex;align-items:center;gap:10px;margin-bottom:14px;font-size:15px}.checkrow input{width:20px;height:20px;flex:none}.timeline-item{border-left:3px solid var(--red);padding:8px 0 8px 12px;margin-bottom:8px;cursor:pointer}.muted{color:var(--muted);font-weight:400}.card.selected,.card.selected:active{border-color:var(--red);box-shadow:0 0 0 2px #b8272c40}.spinner{width:32px;height:32px;border:3px solid var(--border);border-top-color:var(--red);border-radius:50%;margin:0 auto 12px;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.badge.ex-active{background:#dff4e6;color:#1f7a45}.badge.ex-upcoming{background:#e2eefd;color:#1d63c4}.badge.ex-factory_visit{background:#fff3d6;color:#9a6b00}.badge.ex-completed,.badge.ex-archived,.badge.ex-planning{background:var(--surface-2);color:var(--muted)}@media (prefers-color-scheme: dark){.badge.ex-active{background:#163a26;color:#74d79c}.badge.ex-upcoming{background:#1c3151;color:#8ab6f5}.badge.ex-factory_visit{background:#453a17;color:#f2c94c}}.linkbox{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:10px 12px;font-size:13px;word-break:break-all;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.capture-buttons{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:12px}.capture-btn{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);font-size:11px;text-decoration:none;cursor:pointer}.capture-btn:active{transform:scale(.96)}.capture-btn:disabled{opacity:.5}.cap-ico{font-size:20px}.media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.media-cell{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--surface-2);border:1px solid var(--border);cursor:pointer}.media-cell img{width:100%;height:100%;object-fit:cover}.media-cell .noimg{width:100%;height:100%;display:grid;place-items:center;font-size:28px;color:var(--muted)}.media-badge{position:absolute;left:0;right:0;bottom:0;background:#0000008c;color:#fff;font-size:10px;padding:2px 6px;text-align:center}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;background:#00000080;display:flex;align-items:flex-end;justify-content:center}.sheet{background:var(--surface);width:100%;max-width:640px;border-radius:18px 18px 0 0;padding:18px 16px calc(18px + var(--safe-bottom));max-height:90vh;overflow-y:auto}.sheet h3{margin:0 0 12px}.sheet-img{width:100%;border-radius:12px;margin-bottom:12px;max-height:40vh;object-fit:contain;background:var(--surface-2)}.scanner{position:relative;width:100%;aspect-ratio:3 / 4;max-height:60vh;background:#000;border-radius:14px;overflow:hidden;margin-bottom:8px}.scanner video{width:100%;height:100%;object-fit:cover}.scan-frame{position:absolute;top:18%;right:18%;bottom:18%;left:18%;border:3px solid rgba(255,255,255,.85);border-radius:14px;box-shadow:0 0 0 100vmax #00000040}.syncbar{display:flex;align-items:center;gap:8px;font-size:12px;padding:5px 16px;background:var(--surface-2);color:var(--muted);border-bottom:1px solid var(--border)}.demo-ribbon{background:#1c3151;color:#cfe0ff;font-size:12px;padding:6px 16px;text-align:center;line-height:1.35}@media (prefers-color-scheme: dark){.demo-ribbon{background:#12203a}}label.mini{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);font-weight:600;margin-bottom:12px}label.mini input{margin-top:2px}.capbar{height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden}.capbar-fill{height:100%;border-radius:999px;transition:width .3s ease}.nowcard{background:var(--red);color:#fff;border-radius:var(--radius);padding:16px;box-shadow:0 6px 18px #b8272c59;margin-bottom:12px}.nowcard h2{color:#fff;font-size:22px}.nowcard .card-meta{color:#ffffffe6}.nowtag{font-size:12px;font-weight:700;letter-spacing:.08em;opacity:.9}.nowcard .btn{background:#ffffff2e;color:#fff}.nowcard .btn.primary{background:#fff;color:var(--red)}.nowcard a.btn{background:#ffffff2e;color:#fff}.nextcard{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:12px 14px;margin-bottom:8px;cursor:pointer}.nexttag{font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--muted);margin-bottom:2px}.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.analytics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px 10px}.analytics-grid span{display:flex;flex-direction:column;font-size:12px;color:var(--muted)}.analytics-grid b{font-size:19px;color:var(--text);font-weight:700;margin-top:2px}