:root{--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0f1115;--surface:#1a1d24;--surface-2:#23272f;--text:#f5f6f8;--text-dim:#9aa4b2;--primary:#4f46e5;--danger:#dc2626;--radius:14px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.screen{max-width:640px;padding:16px;padding-bottom:calc(24px + env(safe-area-inset-bottom));min-height:100%;margin:0 auto}.app-header{padding-top:env(safe-area-inset-top);justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.app-header h1{margin:0;font-size:1.6rem}.header-actions{align-items:center;gap:8px;display:flex}.header-actions .btn{padding:8px 12px;font-size:.9rem}.status-toast{background:var(--surface-2);color:var(--text);text-align:center;border-radius:10px;margin-bottom:16px;padding:10px 14px;font-size:.9rem}.btn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:10px;padding:10px 18px;font-size:1rem;font-weight:600}.btn:disabled{opacity:.5}.btn-secondary{background:var(--surface-2)}.btn-ghost{color:var(--text-dim);background:0 0}.btn-danger{background:var(--danger);width:100%;margin-top:24px}.card-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;display:grid}.card-tile{border-radius:var(--radius);aspect-ratio:8/5;color:#fff;text-align:left;cursor:pointer;border:none;flex-direction:column;justify-content:space-between;padding:14px;display:flex;box-shadow:0 4px 14px #0000004d}.card-tile-name{font-size:1.1rem;font-weight:700}.card-tile-code{opacity:.85;font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap;font-size:.85rem;overflow:hidden}.empty{text-align:center;color:var(--text-dim);flex-direction:column;align-items:center;gap:16px;margin-top:20vh;display:flex}.card-form{flex-direction:column;gap:16px;display:flex}.card-form h2{margin:0 0 8px}.card-form label{color:var(--text-dim);flex-direction:column;gap:6px;font-size:.9rem;display:flex}.card-form input,.card-form select{background:var(--surface);border:1px solid var(--surface-2);color:var(--text);border-radius:10px;padding:12px;font-size:1rem}.input-row{gap:8px;display:flex}.input-row input{flex:1}.hint{color:var(--text-dim);margin:-8px 0 0;font-size:.8rem}.color-picker{color:var(--text-dim);flex-direction:column;gap:8px;font-size:.9rem;display:flex}.swatches{flex-wrap:wrap;gap:10px;display:flex}.swatch{cursor:pointer;border:2px solid #0000;border-radius:50%;width:34px;height:34px}.swatch.selected{border-color:#fff;transform:scale(1.1)}.preview{border-radius:var(--radius);background:#fff;justify-content:center;padding:16px;display:flex}.form-actions{justify-content:flex-end;gap:10px;display:flex}.barcode-wrap{justify-content:center;align-items:center;display:flex}.barcode-error{color:var(--danger);text-align:center;padding:12px;font-size:.85rem}.detail-overlay{background:var(--bg);z-index:20;flex-direction:column;display:flex;position:fixed;inset:0}.detail-header{padding:calc(12px + env(safe-area-inset-top)) 12px 12px;color:#fff;align-items:center;gap:12px;display:flex}.detail-header h2{flex:1;margin:0;font-size:1.2rem}.icon-btn{color:#fff;cursor:pointer;background:#fff3;border:none;border-radius:50%;width:40px;height:40px;font-size:1.2rem}.detail-body{flex-direction:column;flex:1;align-items:center;padding:24px 20px;display:flex}.barcode-card{border-radius:var(--radius);background:#fff;justify-content:center;width:100%;max-width:420px;padding:24px;display:flex}.detail-note{color:var(--text);margin-top:18px}.detail-hint{color:var(--text-dim);text-align:center;font-size:.85rem}.scanner-overlay{z-index:30;background:#000;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:20px;display:flex;position:fixed;inset:0}.scanner-frame{aspect-ratio:4/3;border-radius:var(--radius);width:100%;max-width:480px;position:relative;overflow:hidden}.scanner-video{object-fit:cover;background:#111;width:100%;height:100%}.scanner-loading{color:#fff;justify-content:center;align-items:center;font-size:.95rem;display:flex;position:absolute;inset:0}.scanner-reticle{border:3px solid #ffffffd9;border-radius:12px;position:absolute;inset:20% 10%;box-shadow:0 0 0 100vmax #00000059}.scanner-hint{color:#fff}.scanner-error{color:#ff7b7b;text-align:center}.brand-mark{letter-spacing:-.02em;text-align:center;border-radius:12px;justify-content:center;align-items:center;font-weight:800;line-height:1;display:inline-flex;overflow:hidden}.brand-logo{object-fit:contain;width:100%;height:100%;padding:6px}.choose-store-btn{width:100%}.picker-overlay{background:var(--bg);z-index:40;flex-direction:column;display:flex;position:fixed;inset:0}.picker-header{padding:calc(12px + env(safe-area-inset-top)) 12px 12px;align-items:center;gap:10px;display:flex}.picker-search{background:var(--surface);border:1px solid var(--surface-2);color:var(--text);border-radius:10px;flex:1;padding:12px;font-size:1rem}.picker-scroll{flex:1;padding:8px 16px 24px;overflow-y:auto}.picker-section{margin-top:8px}.picker-category{text-transform:uppercase;letter-spacing:.04em;color:var(--text-dim);margin:18px 4px 8px;font-size:.8rem}.picker-empty{margin-top:16px}.picker-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:14px;display:grid}.picker-item{background:var(--surface);border:1px solid var(--surface-2);border-radius:var(--radius);cursor:pointer;color:var(--text);flex-direction:column;align-items:center;gap:10px;padding:14px 8px;display:flex}.picker-name{text-align:center;font-size:.8rem}.warn{color:#ffd777;background:#3a2a00;border:1px solid #7a5c00;border-radius:10px;margin:0;padding:10px 12px;font-size:.85rem}.scan-info{color:#7ee0a0;margin:-8px 0 0;font-size:.85rem}.preview-format{text-align:center;color:#111;margin:8px 0 0;font-size:.8rem}.detail-format{color:var(--text-dim);margin:12px 0 0;font-size:.85rem}.brand-preview{justify-content:center;display:flex}
