:root { color-scheme: light; }
* { box-sizing: border-box; }
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; background:#f3f4f6; color:#1f2430; }
button { font-size:16px; padding:12px 18px; border-radius:10px; border:0; background:#2563eb; color:#fff; font-weight:600; }
main { padding:12px; max-width:720px; margin:0 auto; }

/* topo */
header.topo { background:#1f2937; color:#fff; padding:14px 16px; position:sticky; top:0; z-index:5; }
.topline { display:flex; justify-content:space-between; align-items:center; gap:10px; }
header.topo .topline { margin-bottom:10px; }
.topline .tit { display:flex; align-items:center; gap:12px; min-width:0; }
.topline h1 { margin:0; font-size:18px; }
a.voltar { color:#93c5fd; text-decoration:none; font-size:14px; white-space:nowrap; }
form.logout { display:flex; align-items:center; gap:8px; font-size:13px; color:#d1d5db; margin:0; }
form.logout button { padding:6px 12px; font-size:13px; background:#4b5563; }

/* login */
body.login-body { background:#1f2937; min-height:100vh; display:flex; align-items:center; justify-content:center; padding:16px; }
.login { background:#fff; border-radius:16px; padding:24px 20px; width:100%; max-width:380px; box-shadow:0 10px 30px rgba(0,0,0,.3); }
.login h1 { margin:0 0 4px; font-size:20px; }
.login p { margin:0 0 18px; color:#6b7280; font-size:14px; }
.login label { display:block; font-size:13px; font-weight:600; margin:12px 0 4px; }
.login select, .login input[type=password] { width:100%; font-size:17px; padding:12px; border-radius:10px; border:1px solid #d1d5db; background:#fff; }
.login button { width:100%; margin-top:18px; font-size:17px; padding:13px; }
.login .err { background:#fee2e2; color:#b91c1c; border-radius:10px; padding:10px 12px; font-size:14px; margin-bottom:6px; text-align:left; }

/* menu */
.menu { display:grid; gap:12px; padding:16px; max-width:520px; margin:0 auto; }
.menu h2 { margin:8px 0 0; font-size:18px; }
a.opcao { display:block; background:#fff; border-radius:16px; padding:20px; text-decoration:none; color:inherit; box-shadow:0 1px 3px rgba(0,0,0,.1); border-left:6px solid #2563eb; }
a.opcao.pix { border-left-color:#16a34a; }
a.opcao strong { display:block; font-size:19px; margin-bottom:4px; }
a.opcao span { color:#6b7280; font-size:14px; }

/* consulta de produtos */
form.busca { display:flex; gap:8px; }
form.busca input[type=search] { flex:1; min-width:0; font-size:18px; padding:12px 14px; border-radius:10px; border:0; }
.card { background:#fff; border-radius:14px; padding:14px 16px; margin-bottom:12px; box-shadow:0 1px 3px rgba(0,0,0,.08); }
.card h2 { margin:0 0 4px; font-size:17px; }
.meta { color:#6b7280; font-size:13px; margin-bottom:10px; word-break:break-word; }
.grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.box { background:#f8fafc; border-radius:10px; padding:8px 10px; }
.box .label { font-size:11px; color:#6b7280; text-transform:uppercase; letter-spacing:.04em; }
.box .value { font-size:16px; font-weight:700; margin-top:2px; }
.box.venda .value { color:#16a34a; }
.box .value.neg { color:#dc2626; }
.forn { margin-top:10px; font-size:13px; color:#374151; }
.pill { display:inline-block; font-size:11px; padding:2px 8px; border-radius:999px; font-weight:600; margin-left:6px; vertical-align:middle; }
.pill-red { background:#fee2e2; color:#b91c1c; }
.empty, .err { text-align:center; color:#6b7280; padding:40px 16px; }
.err { color:#b91c1c; }
#btnScan { background:#374151; flex:0 0 auto; display:flex; align-items:center; gap:6px; }
#scanOverlay { position:fixed; inset:0; background:#000; z-index:50; display:flex; flex-direction:column; }
#scanOverlay[hidden] { display:none; }
#scanVideo { flex:1; width:100%; object-fit:cover; background:#000; }
.scan-bar { padding:14px 16px; display:flex; justify-content:space-between; align-items:center; background:#111827; color:#fff; }
.scan-status { font-size:14px; color:#d1d5db; }
.scan-cancel { background:#dc2626; }

/* pix */
.tools { display:flex; gap:8px; }
.tools input[type=search] { flex:1; min-width:0; font-size:17px; padding:11px 13px; border-radius:10px; border:0; }
.sub { display:flex; justify-content:space-between; align-items:center; margin-top:8px; font-size:13px; color:#d1d5db; }
.sub label { display:flex; align-items:center; gap:6px; }
.item { background:#fff; border-radius:14px; padding:12px 16px; margin-bottom:10px; box-shadow:0 1px 3px rgba(0,0,0,.08); border-left:6px solid #16a34a; }
.item.wait { border-left-color:#d97706; }
.item.bad { border-left-color:#dc2626; opacity:.8; }
.linha1 { display:flex; justify-content:space-between; align-items:center; }
.valor { font-size:24px; font-weight:800; }
.item.ok .valor { color:#15803d; }
.item .nome { margin-top:2px; font-size:15px; font-weight:600; }
.item .meta { margin:4px 0 0; font-size:12px; }
.item .pill { font-size:12px; font-weight:700; padding:3px 10px; margin:0; }
.pill.ok { background:#dcfce7; color:#166534; }
.pill.wait { background:#fef3c7; color:#92400e; }
.pill.bad { background:#fee2e2; color:#991b1b; }
pre.raw { background:#111827; color:#d1d5db; padding:12px; border-radius:10px; font-size:11px; overflow:auto; }