/* StoreWatch additions on top of the AFF Back Office stylesheet */
.wh{color:#fff}.mt6{margin-top:6px}.mt12{margin-top:12px}.mb12{margin-bottom:12px}
.extlink{color:#cfe0ff;font-weight:700}
.extlink:hover{color:#fff}
.store-card{padding:14px 16px;cursor:pointer;transition:.12s}
.store-card:hover{border-color:var(--blue);box-shadow:0 3px 10px rgba(10,49,97,.12)}
.store-card .nm{font-weight:900;font-size:15px;color:var(--navy)}
.store-card .ad{font-size:11.5px;color:var(--muted);margin-bottom:10px}
.store-card .row{display:flex;justify-content:space-between;font-size:12.5px;padding:4px 0;border-top:1px dashed var(--line)}
.sev{display:inline-block;width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.sev-critical{background:#b91c1c;box-shadow:0 0 0 3px rgba(185,28,28,.18)}
.sev-high{background:#ea580c}.sev-medium{background:#d97706}.sev-low{background:#64748b}
.typ{font-size:10px;font-weight:800;padding:2px 7px;border-radius:6px;letter-spacing:.3px;text-transform:uppercase}
.typ-theft{background:#fbe4e4;color:#b91c1c}.typ-temp{background:#e0f2fe;color:#0369a1}
.typ-prod{background:#ede9fe;color:#6d28d9}.typ-system{background:#eceff4;color:#475569}
.alert-row{display:flex;gap:12px;align-items:flex-start;padding:11px 16px;border-bottom:1px solid var(--line);cursor:pointer}
.alert-row:hover{background:var(--panel)}
.alert-row .tm{width:70px;flex:0 0 auto;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}
.alert-row .tt{font-weight:800;font-size:13px}
.alert-row .ds{font-size:12px;color:var(--muted)}
.alert-row.new{animation:flash 1.6s ease}
@keyframes flash{0%{background:#fff4d6}100%{background:transparent}}
.ch{font-size:10.5px;color:var(--muted);font-weight:700;margin-left:6px}
.ailead{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;border-radius:8px;padding:7px 10px;font-size:12px;font-weight:700;margin:8px 0}
.coach{background:#f5f3ff;border:1px solid #ddd6fe;color:#5b21b6;border-radius:8px;padding:7px 10px;font-size:12px;font-weight:700;margin:8px 0}
.camgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.cam{border-radius:10px;overflow:hidden;border:1px solid var(--line);background:#fff}
.cam .tile{height:108px;background:repeating-linear-gradient(135deg,#1b2a44 0 12px,#1f3050 12px 24px);position:relative;display:flex;align-items:center;justify-content:center;color:#8fa6c9;font-size:26px}
.cam .tile.off{background:repeating-linear-gradient(135deg,#3b2323 0 12px,#452828 12px 24px);color:#e7a1a1}
.cam .tile .lbl{position:absolute;left:8px;top:7px;font-size:10px;font-weight:800;color:#cfe0ff;letter-spacing:.3px}
.cam .tile .rec{position:absolute;right:8px;top:7px;font-size:10px;font-weight:800;color:#86efac}
.cam .tile .ph{position:absolute;bottom:6px;left:8px;font-size:9.5px;color:#8fa6c9}
.cam .meta{padding:8px 10px}
.cam .meta .n{font-weight:800;font-size:12.5px}
.cam .meta .m{font-size:11px;color:var(--muted)}
.cam .tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:5px}
.spark{width:120px;height:30px}
.drawer-bg{position:fixed;inset:0;background:rgba(10,20,40,.35);z-index:60}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(520px,100%);background:#fff;z-index:61;overflow-y:auto;box-shadow:-8px 0 30px rgba(0,0,0,.15)}
.drawer .dh{padding:16px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;position:sticky;top:0;background:#fff}
.drawer .db{padding:16px 18px}
.drawer .clip{height:200px;border-radius:10px;background:repeating-linear-gradient(135deg,#1b2a44 0 14px,#1f3050 14px 28px);color:#cfe0ff;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:800;gap:6px;text-align:center;padding:10px}
.drawer .clip small{font-weight:600;color:#8fa6c9}
.kv{display:grid;grid-template-columns:130px 1fr;gap:6px 12px;font-size:12.5px;margin:12px 0}
.kv .k{color:var(--muted);font-weight:700}
.msg{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:12px;margin-top:8px;white-space:pre-wrap;font-family:ui-monospace,Menlo,Consolas,monospace}
.btnrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--navy);color:#fff;padding:10px 16px;border-radius:10px;font-weight:700;font-size:13px;z-index:80;box-shadow:0 6px 20px rgba(0,0,0,.2)}
.set-row{display:flex;align-items:center;gap:12px;padding:11px 16px;border-bottom:1px solid var(--line);font-size:13px}
.set-row:last-child{border-bottom:none}
.set-row .lab{flex:1}
.set-row .lab .h{font-weight:800}
.set-row .lab .d{font-size:11.5px;color:var(--muted)}
.set-row.locked{background:#fafbfd}
.lock{font-size:10.5px;font-weight:800;color:#9a3412;background:#fff7ed;border:1px solid #fed7aa;border-radius:6px;padding:2px 7px}
.sw.locked{opacity:.55;cursor:not-allowed}
.num-in{border:1px solid var(--line);border-radius:7px;padding:5px 8px;font-size:13px;width:72px;text-align:right}
.sel-in{border:1px solid var(--line);border-radius:7px;padding:5px 8px;font-size:13px;background:#fff}
.matrix td,.matrix th{text-align:center}.matrix td:first-child,.matrix th:first-child{text-align:left}
.check{display:flex;gap:10px;padding:9px 16px;border-bottom:1px solid var(--line);font-size:12.5px;align-items:flex-start}
.check .bx{width:18px;height:18px;border-radius:5px;border:2px solid var(--line);flex:0 0 auto;margin-top:1px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;color:#fff}
.check .bx.on{background:var(--good);border-color:var(--good)}
.check .src{font-size:11px;color:var(--muted)}
.pbar{height:8px;background:var(--panel);border-radius:5px;overflow:hidden;margin-top:6px}
.pbar i{display:block;height:100%;background:linear-gradient(90deg,var(--navy),var(--blue))}
.note{font-size:11.5px;color:var(--muted);padding:10px 16px}
.tabs{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}

/* staff sign-in — same navy / card language as AFF Back Office */
.signin{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  padding:28px 16px;background:linear-gradient(180deg,var(--navy),#072348);
}
.signin-card{
  width:100%;max-width:420px;background:#fff;color:var(--ink);
  border-radius:14px;box-shadow:0 16px 40px rgba(0,0,0,.28);padding:22px 22px 18px;
}
.signin-brand{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.signin-brand .mark{width:38px;height:38px;border-radius:9px;background:#fff;color:var(--red);font-weight:900;
  display:flex;align-items:center;justify-content:center;font-size:15px;box-shadow:inset 0 0 0 2px var(--red)}
.signin-brand h1{font-size:16px;margin:0;font-weight:800}
.signin-brand .sub{font-size:12px;color:var(--muted);font-weight:700}
.signin p.lead{margin:0 0 14px;color:var(--muted);font-size:12.5px;font-weight:600}
.signin label{display:block;margin:12px 0 4px;font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}
.signin .search{width:100%;font-size:16px}
.pw-field{position:relative}
.pw-field .search{padding-right:46px}
.pw-toggle{
  position:absolute;right:2px;top:50%;transform:translateY(-50%);
  width:40px;height:36px;margin:0;padding:0;border:0;border-radius:8px;
  background:transparent;color:var(--navy);cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
}
.pw-toggle:hover{background:var(--panel)}
.pw-toggle:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.pw-toggle .eye-off{display:none}
.pw-toggle[aria-pressed="true"] .eye-open{display:none}
.pw-toggle[aria-pressed="true"] .eye-off{display:block}
.setup-hint{margin:12px 0 0;text-align:center;font-size:13px;font-weight:700}
.signin .setup-hint a{color:var(--blue);text-decoration:underline}
.signin .setup-hint a:hover{color:var(--navy)}
.signin-actions{margin-top:16px;display:flex;flex-direction:column;gap:8px}
.signin-actions .btn{justify-content:center}
.signin .constraint{margin:-6px 0 14px;font-size:12px;font-weight:700;color:#9a3412;background:#fff7ed;border:1px solid #fed7aa;border-radius:8px;padding:8px 10px}
.qr-box{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;text-align:center;margin:10px 0}
.qr-box img{width:220px;height:220px;image-rendering:pixelated}
.keyline{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;font-weight:700;
  letter-spacing:.3px;word-break:break-all;background:var(--panel);border:1px solid var(--line);
  border-radius:8px;padding:8px 10px;margin-top:4px}
#signinCode{letter-spacing:.35em;font-weight:800;text-align:center}
.signout{
  display:inline-flex;margin-top:8px;background:transparent;color:#fff;
  border:1px solid rgba(255,255,255,.35);border-radius:8px;padding:4px 8px;
  font-size:11px;font-weight:800;cursor:pointer;
}
.signout:hover{background:rgba(255,255,255,.08)}
.constraint-pill{background:#fff7ed;color:#9a3412;border:1px solid #fed7aa;font-size:11px;font-weight:800;
  padding:5px 11px;border-radius:20px;letter-spacing:.2px;white-space:nowrap}

/* mobile topbar */
@media (max-width: 640px) {
  .topbar { flex-wrap: wrap; gap: 8px; }
  .topbar .sync-badge { display: none; }
  .topbar .store-filter { max-width: 140px; font-size: 13px; }
  .topbar .demo-pill { font-size: 10px; padding: 3px 8px; }
  .constraint-pill { white-space: normal; font-size: 10px; padding: 3px 8px; }
  .crumb { display: none; }
}
/* Live camera tiles (AFF1 liquor store) */
.camgrid.live{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.cam .tile.live{height:auto;aspect-ratio:16/9;background:#0b1220;cursor:pointer;overflow:hidden}
.tile.live video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#0b1220}
.tile.live .lbl{z-index:2;text-shadow:0 1px 2px #000}
.tile.live .live-st{position:absolute;right:8px;top:6px;z-index:2;font-size:10px}
.tile.live .live-msg{position:absolute;left:0;right:0;bottom:8px;text-align:center;z-index:2;font-size:11px;font-weight:700;color:#cfe0ff;text-shadow:0 1px 2px #000;padding:0 8px}
.tile.live.off{background:repeating-linear-gradient(135deg,#3b2323 0 12px,#452828 12px 24px)}
.tile.live.off video{visibility:hidden}
.drawer.wide{width:min(1100px,100%)}
.drawer .tile.live.big{position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#0b1220}
.tile.live:fullscreen{border-radius:0;aspect-ratio:auto;width:100vw;height:100vh}