:root{--bg:#0f1115;--surface:#171a21;--surface-2:#1e222b;--surface-3:#262b36;--border:#2a2f3a;--text:#e8eaf0;--muted:#9aa3b2;--muted-dim:#6f7787;--accent:#4c8dff;--danger:#ef4444;--warn:#f59e0b;--ok:#22c55e;--map-blue:#3b82f6;--map-blue-soft:#3b82f624;--map-red:#ef4444;--map-red-soft:#ef444429;--radius-sm:8px;--radius:12px;--radius-lg:18px;--shadow:0 8px 24px #0006;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:16px;line-height:1.45}button{font:inherit;color:inherit;cursor:pointer}input,select,textarea{font:inherit;color:inherit;font-size:max(16px,1rem)}.app{flex-direction:column;min-height:100dvh;display:flex}.shell{width:100%;max-width:900px;padding:0 16px calc(32px + env(safe-area-inset-bottom));flex:1;margin:0 auto}.topbar{z-index:20;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding-top:env(safe-area-inset-top);background:#0f1115db;position:sticky;top:0}.topbar-inner{align-items:center;gap:12px;width:100%;max-width:900px;margin:0 auto;padding:12px 16px;display:flex}.topbar-title{letter-spacing:-.01em;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;margin:0;font-size:1.05rem;font-weight:650;overflow:hidden}.back-btn{background:var(--surface-2);border:1px solid var(--border);border-radius:999px;flex:none;place-items:center;width:34px;height:34px;padding:0;display:grid}.back-btn:hover{background:var(--surface-3)}.mode-toggle{background:var(--surface-2);border:1px solid var(--border);border-radius:999px;flex:none;gap:3px;padding:3px;display:flex}.mode-toggle button{color:var(--muted);white-space:nowrap;background:0 0;border:0;border-radius:999px;padding:6px 14px;font-size:.85rem;font-weight:600;transition:background .15s,color .15s}.mode-toggle button[aria-pressed=true]{background:var(--text);color:#10131a}.sync-badge{background:var(--surface-2);border:1px solid var(--border);color:var(--muted);white-space:nowrap;border-radius:999px;flex:none;align-items:center;gap:6px;padding:6px 10px;font-size:.78rem;font-weight:600;display:inline-flex}.sync-badge:hover{background:var(--surface-3);color:var(--text)}.sync-dot{background:var(--muted-dim);border-radius:999px;flex:none;width:8px;height:8px}.sync-badge[data-status=synced] .sync-dot{background:var(--ok)}.sync-badge[data-status=syncing] .sync-dot,.sync-badge[data-status=starting] .sync-dot{background:var(--accent);animation:1s ease-in-out infinite sync-pulse}.sync-badge[data-status=offline] .sync-dot,.sync-badge[data-status=local-only] .sync-dot{background:var(--warn)}.sync-badge[data-status=error] .sync-dot{background:var(--danger)}@keyframes sync-pulse{50%{opacity:.35}}@media (width<=560px){.sync-label{display:none}.sync-badge{padding:7px}.topbar-inner{gap:8px;padding:12px}.mode-toggle button{padding:6px 11px}.topbar-title{font-size:.98rem}}.page-head{padding:24px 0 16px}.page-head h2{letter-spacing:-.02em;margin:0 0 4px;font-size:1.6rem}.page-head p{color:var(--muted);margin:0;font-size:.92rem}.card-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;display:grid}.dest-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:left;color:inherit;align-items:stretch;gap:0;min-height:96px;padding:0;text-decoration:none;transition:transform .12s,border-color .15s,background .15s;display:flex;position:relative;overflow:hidden}.dest-card:hover{background:var(--surface-2);border-color:var(--surface-3);transform:translateY(-2px)}.dest-card:active{transform:translateY(0)}.accent-bar{background:var(--card-accent);border-radius:0;flex:none;align-self:stretch;width:8px}.dest-card[data-all=true] .accent-bar{box-shadow:inset -1px 0 #ffffff47}.dest-body{flex-direction:column;flex:1;justify-content:center;gap:4px;min-width:0;padding:14px 16px;display:flex}.dest-name{letter-spacing:-.01em;font-weight:640;line-height:1.25}.dest-count{color:var(--muted);font-size:.83rem}.search-wrap{top:calc(59px + env(safe-area-inset-top));z-index:10;background:var(--bg);margin-bottom:4px;padding:12px 0;position:sticky}.search-field{align-items:center;display:flex;position:relative}.search-field svg{color:var(--muted-dim);pointer-events:none;position:absolute;left:13px}.search-field input{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);outline:none;width:100%;padding:12px 40px;transition:border-color .15s}.search-field input:focus{border-color:var(--accent)}.search-field input::placeholder{color:var(--muted-dim)}.clear-btn{background:var(--surface-3);width:24px;height:24px;color:var(--muted);border:0;border-radius:999px;place-items:center;padding:0;display:grid;position:absolute;right:8px}.clear-btn:hover{color:var(--text)}.item-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.item-row{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);text-align:left;align-items:center;gap:12px;width:100%;padding:12px 14px;transition:background .15s;display:flex}.item-row:hover{background:var(--surface-2)}.item-swatch{background:var(--card-accent);border-radius:999px;flex:none;align-self:stretch;width:4px;min-height:34px}.item-main{flex:1;min-width:0;display:block}.item-name{letter-spacing:-.01em;text-overflow:ellipsis;white-space:nowrap;font-weight:600;display:block;overflow:hidden}.item-brand{color:var(--muted);font-weight:400}.item-place{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin-top:2px;font-size:.82rem;display:block;overflow:hidden}.item-meta{flex-direction:column;flex:none;align-items:flex-end;gap:3px;display:flex}.qty-pill{background:var(--surface-3);white-space:nowrap;border-radius:999px;padding:3px 10px;font-size:.8rem;font-weight:600}.expiry{color:var(--muted-dim);white-space:nowrap;font-size:.72rem}.expiry[data-state=soon]{color:var(--warn)}.expiry[data-state=past]{color:var(--danger)}.empty{text-align:center;color:var(--muted);padding:48px 20px}.empty strong{color:var(--text);margin-bottom:6px;font-size:1.05rem;display:block}.result-count{color:var(--muted-dim);padding:4px 2px 10px;font-size:.82rem}.modal-backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:100;background:#0000009e;justify-content:center;align-items:flex-end;padding:0;display:flex;position:fixed;inset:0}@media (width>=640px){.modal-backdrop{align-items:center;padding:24px}}.modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg) var(--radius-lg) 0 0;width:100%;max-width:560px;max-height:92dvh;box-shadow:var(--shadow);padding-bottom:env(safe-area-inset-bottom);overflow-y:auto}@media (width>=640px){.modal{border-radius:var(--radius-lg)}}.modal-head{background:var(--surface);border-bottom:1px solid var(--border);z-index:1;align-items:flex-start;gap:12px;padding:16px 18px 12px;display:flex;position:sticky;top:0}.modal-head h3{letter-spacing:-.02em;flex:1;min-width:0;margin:0;font-size:1.15rem}.modal-head .sub{color:var(--muted);margin-top:2px;font-size:.86rem;font-weight:400}.icon-btn{background:var(--surface-2);border:1px solid var(--border);width:30px;height:30px;color:var(--muted);border-radius:999px;flex:none;place-items:center;padding:0;display:grid}.icon-btn:hover{color:var(--text);background:var(--surface-3)}.modal-body{padding:16px 18px 20px}.modal-actions{gap:8px;padding:0 18px 18px;display:flex}.map-section+.map-section{margin-top:22px}.map-title{text-transform:uppercase;letter-spacing:.07em;color:var(--muted-dim);margin:0 0 10px;font-size:.78rem;font-weight:700}.unit{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:8px;padding:10px;display:flex}.shelf-slab{border:2px solid var(--map-blue);background:var(--map-blue-soft);border-radius:var(--radius);min-height:52px;color:var(--text);text-align:left;justify-content:space-between;align-items:center;gap:10px;width:100%;padding:10px 12px;transition:transform .12s,filter .15s;display:flex}.shelf-slab[data-target=true]{border-color:var(--map-red);background:var(--map-red-soft)}.shelf-slab[data-clickable=true]:hover{filter:brightness(1.25)}.shelf-slab[data-clickable=true]:active{transform:scale(.99)}.shelf-slab-name{font-size:.95rem;font-weight:600}.shelf-slab-note{color:var(--muted);font-size:.78rem}.shelf-slab[data-target=true] .shelf-slab-note{color:#ffb4b4}.zone-grid{gap:8px;display:grid}.zone-cell{border:2px solid var(--map-blue);background:var(--map-blue-soft);border-radius:var(--radius);min-height:64px;color:var(--text);flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:12px 8px;transition:transform .12s,filter .15s;display:flex}.zone-cell[data-target=true]{border-color:var(--map-red);background:var(--map-red-soft)}.zone-cell[data-clickable=true]:hover{filter:brightness(1.25)}.zone-cell[data-clickable=true]:active{transform:scale(.97)}.zone-id{letter-spacing:-.01em;font-size:1.05rem;font-weight:700}.zone-sub{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:.68rem}.zone-cell[data-target=true] .zone-sub{color:#ffb4b4}.zone-count{color:var(--muted-dim);font-size:.68rem}.depth-row-label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted-dim);margin:6px 0;font-size:.68rem;font-weight:700}.map-legend{color:var(--muted);gap:16px;margin-top:12px;font-size:.78rem;display:flex}.map-legend span{align-items:center;gap:6px;display:inline-flex}.legend-dot{border:2px solid var(--map-blue);background:var(--map-blue-soft);border-radius:3px;width:10px;height:10px}.legend-dot[data-target=true]{border-color:var(--map-red);background:var(--map-red-soft)}.facts{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:4px;display:grid}.fact{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:9px 11px}.fact dt{text-transform:uppercase;letter-spacing:.06em;color:var(--muted-dim);margin:0 0 2px;font-size:.7rem;font-weight:700}.fact dd{overflow-wrap:anywhere;margin:0;font-size:.92rem;font-weight:600}.form-grid{gap:14px;display:grid}.row-2{grid-template-columns:1fr 1fr;gap:10px;display:grid}.field label{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:6px;font-size:.78rem;font-weight:700;display:block}.field input,.field select,.field textarea{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);outline:none;width:100%;padding:11px 12px;transition:border-color .15s}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent)}.field textarea{resize:vertical;min-height:68px}.hint{color:var(--muted-dim);margin-top:6px;font-size:.76rem}.autocomplete{position:relative}.suggestions{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow);z-index:30;max-height:260px;margin:0;padding:4px;list-style:none;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto}.suggestions li button{text-align:left;background:0 0;border:0;border-radius:6px;justify-content:space-between;align-items:center;gap:10px;width:100%;padding:9px 10px;display:flex}.suggestions li button:hover,.suggestions li button[data-active=true]{background:var(--surface-3)}.suggestion-where{color:var(--muted-dim);white-space:nowrap;font-size:.75rem}.btn{border:1px solid var(--border);background:var(--surface-2);border-radius:var(--radius-sm);justify-content:center;align-items:center;gap:8px;padding:12px 16px;font-weight:600;transition:background .15s,opacity .15s;display:inline-flex}.btn:hover:not(:disabled){background:var(--surface-3)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--accent);border-color:var(--accent);color:#08101f}.btn-primary:hover:not(:disabled){background:#6ba0ff;border-color:#6ba0ff}.btn-danger{color:#ffb4b4;background:#2a1a1d;border-color:#46262a}.btn-danger:hover:not(:disabled){background:#3a2226}.btn-block{width:100%}.btn-scan{background:var(--surface-3)}.scanner{border:1px solid var(--border);border-radius:var(--radius);aspect-ratio:4/3;background:#000;position:relative;overflow:hidden}.scanner video{object-fit:cover;width:100%;height:100%;display:block}.reticle{border-radius:var(--radius);pointer-events:none;border:2px solid #ffffffd9;position:absolute;inset:18% 10%;box-shadow:0 0 0 9999px #00000059}.scanner-status{color:var(--muted);text-align:center;padding:10px 12px;font-size:.84rem}.scanner-status[data-error=true]{color:#ffb4b4}.steps{color:var(--muted-dim);align-items:center;gap:8px;padding:16px 0 4px;font-size:.78rem;font-weight:600;display:flex}.step[data-state=current]{color:var(--text)}.step[data-state=done]{color:var(--muted)}.step-sep{color:var(--muted-dim)}.picked-summary{background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--card-accent);border-radius:var(--radius-sm);margin-bottom:16px;padding:11px 13px}.picked-summary .label{text-transform:uppercase;letter-spacing:.06em;color:var(--muted-dim);font-size:.72rem;font-weight:700}.picked-summary .value{margin-top:2px;font-weight:600}.sticky-actions{background:linear-gradient(to top, var(--bg) 60%, color-mix(in srgb, var(--bg) 70%, transparent));padding:14px 0 calc(14px + env(safe-area-inset-bottom));gap:8px;margin-top:20px;display:flex;position:sticky;bottom:0}.sticky-actions .btn:not(.btn-block){white-space:nowrap;flex:none}.toast{left:50%;bottom:calc(24px + env(safe-area-inset-bottom));background:var(--surface-3);border:1px solid var(--border);box-shadow:var(--shadow);z-index:200;border-radius:999px;align-items:center;gap:8px;max-width:calc(100vw - 32px);padding:11px 20px;font-size:.9rem;font-weight:600;display:flex;position:fixed;transform:translate(-50%)}.toast svg{color:var(--ok);flex:none}.settings-row{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);justify-content:space-between;align-items:center;gap:12px;padding:14px;display:flex}.settings-row+.settings-row{margin-top:10px}.settings-row .label{font-weight:600}.settings-row .desc{color:var(--muted);margin-top:2px;font-size:.8rem}.link-btn{color:var(--muted);background:0 0;border:0;padding:4px;font-size:.85rem;text-decoration:underline}.link-btn:hover{color:var(--text)}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
