/* ════════════════════════════════════════════════════════════
   THE NAIJA CONCIERGE — OWNER CONSOLE v2 (2026-10-19)
   Loaded after naija-theme.css on admin-dashboard.html, together with owner-console.js.
   Everything is scoped to body.oc so the other dashboards are untouched.
   ════════════════════════════════════════════════════════════ */

body.oc{background:#F4F5F2;font-feature-settings:'cv11','ss01'}
body.oc .content{padding:28px 32px 56px;max-width:1480px;width:100%}

/* ── Sidebar ── */
body.oc .sidebar{background:linear-gradient(180deg,#0F3D2E 0%,#0B3024 100%)}
body.oc .nav-item{border-radius:10px;padding:9px 11px}
body.oc .nav-item.active{background:rgba(229,196,107,.12);color:#fff;box-shadow:inset 3px 0 0 #E5C46B}
body.oc .nav-item .count{background:#E5C46B;color:#0B2A1F}
body.oc .nav-label{color:rgba(255,255,255,.4)}

/* ── Topbar ── */
body.oc .topbar{height:64px;background:rgba(244,245,242,.82);backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid rgba(16,24,38,.06)}
body.oc .topbar h1{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:1.12rem;letter-spacing:-.005em}
body.oc .searchbox{width:340px;height:40px;background:#fff;border-color:var(--line);cursor:pointer;box-shadow:var(--shadow-sm);transition:border-color .15s,box-shadow .15s}
body.oc .searchbox:hover{border-color:#C9D3CD}
body.oc .searchbox input{cursor:pointer}
body.oc .searchbox kbd,.oc-kbd{font:600 .66rem/1 'Inter',sans-serif;color:var(--muted);background:var(--bg);border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;padding:3px 6px;white-space:nowrap}

/* ── Page headings (tncLivePanel) ── */
body.oc .page-head{margin-bottom:22px;align-items:flex-end}
body.oc .page-head h2{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:1.65rem;letter-spacing:-.015em;color:var(--ink)}
body.oc .page-head .t-meta{font-size:.84rem;margin-top:4px}

/* ── Cards, tables, badges ── */
body.oc .card{border-radius:16px;border-color:rgba(16,24,38,.07);box-shadow:0 1px 2px rgba(16,24,38,.04),0 6px 20px -12px rgba(16,24,38,.12)}
body.oc .table th{background:#FAFAF8;font-size:.66rem;padding:12px 16px;position:sticky;top:0;z-index:1}
body.oc .table td{padding:14px 16px}
body.oc .table tr:hover td{background:#FAFBF9}
body.oc .stat{border-radius:16px;padding:20px}
body.oc .stat .val{font-size:1.85rem;letter-spacing:-.01em}
body.oc .btn{border-radius:10px}
body.oc .btn-primary{box-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 6px 14px -8px rgba(15,61,46,.7)}

/* ── Skeleton loading ── */
.oc-skel{display:grid;gap:14px}
.oc-skel i{display:block;height:16px;border-radius:8px;background:linear-gradient(90deg,#ECEEEA 0%,#F6F7F4 40%,#ECEEEA 80%);background-size:200% 100%;animation:ocShimmer 1.3s linear infinite}
.oc-skel i.h{height:34px;width:38%}.oc-skel i.w6{width:60%}.oc-skel i.w8{width:80%}
.oc-skel .row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.oc-skel .row i{height:96px;border-radius:16px}
@keyframes ocShimmer{to{background-position:-200% 0}}

/* ── Detail side panel (re-skins the shared #detailModal) ── */
body.oc #detailModal.overlay{justify-content:flex-end;align-items:stretch;padding:0;background:rgba(11,20,16,.38);backdrop-filter:blur(2px)}
body.oc #detailModal .modal{height:100vh;max-height:100vh!important;border-radius:20px 0 0 20px;width:min(100%,var(--oc-drawer-w,720px));display:flex;flex-direction:column;animation:ocSlide .26s cubic-bezier(.2,.8,.2,1)}
body.oc #detailModal .modal-head{position:sticky;top:0;background:#fff;z-index:2;padding:18px 24px}
body.oc #detailModal .modal-head h3{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:1.2rem}
body.oc #detailModal .modal-body{flex:1;max-height:none!important;overflow-y:auto;padding:22px 24px 40px}
@keyframes ocSlide{from{transform:translateX(40px);opacity:.4}to{transform:none;opacity:1}}

/* ── Row "⋯" menus for risky actions ── */
.oc-more{position:relative;display:inline-flex}
.oc-more > button{width:32px;height:32px;border-radius:9px;border:1px solid var(--line);background:#fff;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;font-weight:700;letter-spacing:.06em}
.oc-more > button:hover{border-color:#C9D3CD;color:var(--ink)}
.oc-menu{display:none;position:absolute;right:0;top:calc(100% + 6px);z-index:50;min-width:190px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px;box-shadow:0 18px 40px -16px rgba(16,24,38,.35)}
.oc-more.open .oc-menu{display:flex;flex-direction:column;gap:2px}
.oc-menu .btn{justify-content:flex-start;width:100%;border:none!important;background:none;box-shadow:none;padding:9px 10px;color:var(--ink)}
.oc-menu .btn:hover{background:var(--bg)}
.oc-menu .btn.oc-danger,.oc-menu [data-tnc-action="delete-user"],.oc-menu [data-status="banned"]{color:var(--red)!important}
.oc-menu .oc-menu-note{font-size:.68rem;color:var(--faint);padding:6px 10px 2px;text-transform:uppercase;letter-spacing:.08em;font-weight:700}

/* ── Command palette (⌘K) ── */
.oc-pal{position:fixed;inset:0;z-index:1500;display:none;align-items:flex-start;justify-content:center;padding:12vh 16px 16px;background:rgba(11,20,16,.42);backdrop-filter:blur(3px)}
.oc-pal.open{display:flex}
.oc-pal-box{width:100%;max-width:640px;background:#fff;border-radius:18px;box-shadow:0 40px 100px -30px rgba(11,20,16,.6);overflow:hidden;animation:ocPop .16s ease}
@keyframes ocPop{from{transform:translateY(-6px) scale(.985);opacity:0}to{transform:none;opacity:1}}
.oc-pal-in{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--line)}
.oc-pal-in .icon{width:20px;height:20px;color:var(--muted)}
.oc-pal-in input{flex:1;border:none;outline:none;font-size:1.02rem;color:var(--ink);background:none}
.oc-pal-list{max-height:min(58vh,520px);overflow-y:auto;padding:8px}
.oc-pal-group{font-size:.64rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);padding:10px 10px 4px}
.oc-pal-item{display:flex;align-items:center;gap:12px;padding:10px;border-radius:11px;cursor:pointer}
.oc-pal-item.on{background:var(--green-50)}
.oc-pal-ic{width:34px;height:34px;border-radius:10px;background:var(--bg);color:var(--green);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.72rem;font-weight:700}
.oc-pal-item.on .oc-pal-ic{background:var(--green);color:#E5C46B}
.oc-pal-ic .icon{width:17px;height:17px}
.oc-pal-main{flex:1;min-width:0}
.oc-pal-main b{display:block;color:var(--ink);font-size:.9rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oc-pal-main small{display:block;color:var(--muted);font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oc-pal-empty{padding:28px;text-align:center;color:var(--muted);font-size:.86rem}
.oc-pal-foot{display:flex;gap:16px;padding:10px 16px;border-top:1px solid var(--line);font-size:.72rem;color:var(--faint)}

/* ── Overview: range picker + trend cards ── */
.oc-range{display:inline-flex;background:#fff;border:1px solid var(--line);border-radius:11px;padding:3px;box-shadow:var(--shadow-sm)}
.oc-range button{padding:7px 13px;border-radius:8px;font-size:.78rem;font-weight:600;color:var(--muted)}
.oc-range button.on{background:var(--green);color:#fff}
.oc-trends{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-bottom:16px}
@media (max-width:1280px){.oc-trends{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:620px){.oc-trends{grid-template-columns:repeat(2,minmax(0,1fr))}}
.oc-kpi{background:#fff;border:1px solid rgba(16,24,38,.07);border-radius:16px;padding:16px 18px;box-shadow:0 1px 2px rgba(16,24,38,.04),0 6px 20px -12px rgba(16,24,38,.12)}
.oc-kpi .k{font-size:.74rem;color:var(--muted);font-weight:500}
.oc-kpi .v{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:1.75rem;color:var(--ink);margin-top:6px;letter-spacing:-.01em;line-height:1.1}
.oc-kpi .fx{font-size:.72rem;color:var(--faint);margin-top:2px}
.oc-delta{display:inline-flex;align-items:center;gap:4px;font-size:.72rem;font-weight:700;margin-top:8px;padding:2px 8px;border-radius:100px}
.oc-delta.up{background:var(--pos-bg);color:var(--pos)}.oc-delta.down{background:var(--red-bg);color:var(--red)}.oc-delta.flat{background:var(--bg);color:var(--muted)}
.oc-chart{background:#fff;border:1px solid rgba(16,24,38,.07);border-radius:16px;padding:16px 18px 10px;margin-bottom:16px;box-shadow:0 1px 2px rgba(16,24,38,.04),0 6px 20px -12px rgba(16,24,38,.12)}
.oc-chart-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.oc-chart-head h3{font-size:.92rem}
.oc-legend{display:flex;gap:14px;font-size:.74rem;color:var(--muted)}
.oc-legend span{display:inline-flex;align-items:center;gap:6px}
.oc-legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
.oc-chart svg{width:100%;height:150px;display:block}

/* ── Gigster pipeline board ── */
.oc-view{display:inline-flex;background:#fff;border:1px solid var(--line);border-radius:11px;padding:3px}
.oc-view button{padding:7px 13px;border-radius:8px;font-size:.78rem;font-weight:600;color:var(--muted)}
.oc-view button.on{background:var(--green);color:#fff}
.oc-board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(232px,1fr);gap:12px;overflow-x:auto;padding-bottom:10px;align-items:start}
.oc-col{background:#ECEEE9;border-radius:16px;padding:10px;min-height:120px}
.oc-col-head{display:flex;justify-content:space-between;align-items:center;padding:4px 6px 10px}
.oc-col-head b{font-size:.78rem;color:var(--ink)}
.oc-col-head small{display:block;font-size:.66rem;color:var(--muted);font-weight:500;margin-top:1px}
.oc-col-head .n{font-size:.7rem;font-weight:700;background:#fff;color:var(--ink);padding:2px 9px;border-radius:100px}
.oc-col.ready{background:#E1EFE7}
.oc-gcard{background:#fff;border-radius:13px;padding:12px;margin-bottom:9px;box-shadow:0 1px 2px rgba(16,24,38,.06);cursor:pointer;border:1px solid transparent;transition:border-color .15s,box-shadow .15s,transform .12s}
.oc-gcard:hover{border-color:#CFE0D6;box-shadow:0 8px 22px -12px rgba(16,24,38,.3);transform:translateY(-1px)}
.oc-gtop{display:flex;align-items:center;gap:10px}
.oc-av{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#14503B,#0F3D2E);color:#E5C46B;font-weight:700;font-size:.72rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.oc-gname{flex:1;min-width:0}
.oc-gname b{display:block;font-size:.84rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oc-gname small{display:block;font-size:.7rem;color:var(--muted)}
.oc-ring{width:36px;height:36px;flex-shrink:0;position:relative}
.oc-ring svg{width:36px;height:36px;transform:rotate(-90deg)}
.oc-ring span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:700;color:var(--ink)}
.oc-miss{display:flex;flex-wrap:wrap;gap:4px;margin-top:9px}
.oc-miss span{font-size:.66rem;font-weight:600;color:#7A5E12;background:var(--gold-50);border:1px solid #EFDFAE;border-radius:100px;padding:2px 8px}
.oc-miss span.team{color:var(--green);background:var(--green-50);border-color:#D6E5DC}
.oc-key{display:inline-flex;gap:10px;align-items:center;font-size:.72rem;color:var(--muted);margin-left:8px}
.oc-key i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:4px;vertical-align:-1px}
.oc-miss span.ok{color:var(--pos);background:var(--pos-bg);border-color:#CDE6D8}
.oc-gfoot{display:flex;gap:6px;margin-top:10px}
.oc-gfoot .btn{padding:5px 10px;font-size:.72rem}
.oc-wait{font-size:.66rem;color:var(--faint);margin-left:auto;align-self:center}
.oc-wait.late{color:var(--amber);font-weight:700}

/* ── Review panel (inside the side panel) ── */
.oc-evidence{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}
/* Owner console has its own evidence tiles, so hide the ops-desk compare button inside the review */
.oc-review [data-tnc-action="kyc-compare"]{display:none}
.oc-ev{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--bg)}
.oc-ev-head{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;font-size:.74rem;font-weight:600;color:var(--ink);background:#fff;border-bottom:1px solid var(--line)}
.oc-ev-body{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;color:var(--faint);font-size:.78rem;text-align:center;padding:10px}
.oc-ev-body img,.oc-ev-body video{width:100%;height:100%;object-fit:contain;background:#0b1410}
.oc-ev-body.has{padding:0}
.oc-trail{margin:4px 0 18px;border:1px solid var(--line);border-radius:14px;padding:6px 14px}
.oc-trail-row{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line-soft);font-size:.8rem}
.oc-trail-row:last-child{border-bottom:none}
.oc-trail-row span{color:var(--muted)}
.oc-sec{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin:6px 0 8px}
.oc-review .vet-card{border:none;box-shadow:none;padding:0}
.oc-review .vet-head{display:none}

@media (max-width:1000px){
  body.oc .content{padding:20px 16px 48px}
  .oc-evidence{grid-template-columns:1fr}
  body.oc #detailModal .modal{border-radius:0;width:100%}
}

/* ══ Phase 2 ══ */
/* Client panel */
.oc-ch{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px;flex-wrap:wrap}
.oc-av-lg{width:52px;height:52px;font-size:1rem}
.oc-alert{background:var(--red-bg);color:#A3322A;border:1px solid rgba(216,69,59,.22);border-radius:12px;padding:10px 14px;font-size:.82rem;margin-bottom:16px}
.oc-stats4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:20px}
.oc-stats4 > div{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:12px}
.oc-stats4 b{display:block;font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:1.05rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oc-stats4 span{display:block;font-size:.7rem;color:var(--muted);margin-top:2px}
.oc-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:18px}
.oc-tag{display:inline-flex;align-items:center;gap:4px;background:var(--green-50);color:var(--green);border-radius:100px;padding:4px 6px 4px 10px;font-size:.74rem;font-weight:600}
.oc-tag button{width:18px;height:18px;border-radius:50%;color:var(--green);font-size:.9rem;line-height:1}
.oc-tag button:hover{background:rgba(15,61,46,.12)}
.oc-tag-in{border:1px dashed var(--line);border-radius:100px;padding:5px 12px;font-size:.76rem;outline:none;min-width:220px}
.oc-tag-in:focus{border-color:var(--green)}
.oc-tl{display:flex;flex-direction:column}
.oc-tl-row{display:flex;gap:12px;padding:9px 0;border-bottom:1px solid var(--line-soft);font-size:.82rem;color:var(--body)}
.oc-tl-row:last-child{border-bottom:none}
.oc-tl-ic{width:26px;height:26px;border-radius:50%;background:var(--bg);color:var(--muted);display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700;flex-shrink:0}
.oc-k-order .oc-tl-ic,.oc-k-verified .oc-tl-ic{background:var(--pos-bg);color:var(--pos)}
.oc-k-bounced .oc-tl-ic{background:var(--red-bg);color:var(--red)}
.oc-k-note .oc-tl-ic{background:var(--gold-50);color:var(--gold-600)}
.oc-k-message .oc-tl-ic{background:var(--blue-bg);color:var(--blue)}
/* Orders + lead cards */
.oc-ocard-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}
.oc-ocard-top .kc-id{font-size:.68rem;color:var(--faint);font-weight:700;letter-spacing:.04em}
.oc-ocard-title{display:block;font-size:.86rem;color:var(--ink);margin-bottom:2px}
.oc-ocard-foot{display:flex;justify-content:space-between;align-items:center;margin-top:8px;font-size:.74rem;color:var(--muted)}
.oc-ocard-foot b{color:var(--ink)}
.oc-lcard .btn-wa{padding:5px 10px;font-size:.72rem}
/* Filters row */
.oc-filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:16px}
.oc-filters > button{padding:7px 13px;border-radius:100px;border:1px solid var(--line);background:#fff;font-size:.78rem;font-weight:600;color:var(--body)}
.oc-filters > button span{color:var(--faint);margin-left:4px}
.oc-filters > button.on{background:var(--green);border-color:var(--green);color:#fff}
.oc-filters > button.on span{color:rgba(255,255,255,.7)}
.oc-filters .input{width:auto;min-width:150px;padding:7px 11px;font-size:.8rem}
.oc-filters input.input{min-width:220px;flex:1;max-width:320px}
/* Gigster directory */
.oc-dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.oc-dcard{background:#fff;border:1px solid rgba(16,24,38,.07);border-radius:16px;padding:16px;box-shadow:0 1px 2px rgba(16,24,38,.04),0 6px 20px -12px rgba(16,24,38,.12)}
.oc-skills{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px;min-height:24px}
.oc-skills span{font-size:.68rem;font-weight:600;background:var(--bg);border:1px solid var(--line);color:var(--body);border-radius:100px;padding:3px 9px}
.oc-skills span.none{color:var(--faint)}
.oc-dstats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line-soft)}
.oc-dstats b{display:block;font-family:'Fraunces',Georgia,serif;font-weight:600;color:var(--ink);font-size:1rem}
.oc-dstats span{font-size:.68rem;color:var(--muted)}
/* Bell */
.oc-bellpop{display:none;position:absolute;top:calc(100% + 8px);right:0;width:380px;max-width:92vw;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 70px -24px rgba(16,24,38,.45);z-index:300;overflow:hidden}
.oc-bellpop.open{display:block;animation:ocPop .16s ease}
.oc-bell-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line)}
.oc-bell-list{max-height:60vh;overflow-y:auto;padding:6px}
.oc-bell-item{display:flex;gap:10px;padding:10px;border-radius:11px;cursor:pointer;font-size:.82rem;color:var(--ink)}
.oc-bell-item:hover{background:var(--bg)}
.oc-bell-item.new{background:var(--gold-50)}
@media (max-width:700px){ .oc-stats4{grid-template-columns:repeat(2,1fr)} }

/* ══ Phase 3 ══ */
/* Settings */
.oc-settings{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:16px}
.oc-set{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid var(--line-soft)}
.oc-set:last-child{border-bottom:none}
.oc-set b{display:block;font-size:.84rem;color:var(--ink);font-weight:600}
.oc-set small{display:block;font-size:.68rem;color:var(--faint);font-family:ui-monospace,Menlo,monospace;margin-top:2px}
.oc-set-in{display:flex;align-items:center;gap:8px;flex-shrink:0}
.oc-set-in .input{width:150px;text-align:right}
.oc-set-in span{font-size:.72rem;color:var(--muted);min-width:56px}
/* Plans & services */
.oc-plans{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.oc-pcard,.oc-scard{background:#fff;border:1px solid rgba(16,24,38,.08);border-radius:16px;padding:16px;box-shadow:0 1px 2px rgba(16,24,38,.04),0 6px 20px -12px rgba(16,24,38,.12)}
.oc-pcard.off,.oc-scard.off{opacity:.62;background:var(--surface-2)}
.oc-big{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:1.02rem;border-color:transparent;padding:6px 8px;margin-left:-8px}
.oc-big:hover{border-color:var(--line)}
.oc-switch .input{width:auto;padding:5px 8px;font-size:.74rem}
.oc-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
.oc-row4{display:grid;grid-template-columns:1.2fr 1fr .7fr 1fr;gap:10px;margin-top:8px}
.oc-row2 label,.oc-row4 label,.oc-lab{display:flex;flex-direction:column;gap:5px;font-size:.7rem;font-weight:600;color:var(--muted)}
.oc-lab small{font-weight:400;color:var(--faint)}
.oc-pre{display:flex;align-items:center;gap:4px;color:var(--muted)}
.oc-svcs{display:flex;flex-direction:column;gap:10px}
.oc-scard{display:flex;gap:12px;padding:14px 16px}
.oc-scard.dragging{opacity:.4;outline:2px dashed var(--gold)}
.oc-drag{cursor:grab;color:var(--faint);font-weight:700;letter-spacing:-2px;padding-top:8px;user-select:none}
.oc-scard-main{flex:1;min-width:0}
.oc-home{font-size:.72rem;color:var(--green);background:var(--green-50);border-radius:100px;padding:3px 10px}
.oc-pcard .oc-menu,.oc-scard .oc-menu{bottom:auto}
/* Users */
.oc-userwrap{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start}
.oc-side{display:flex;flex-direction:column;gap:14px;position:sticky;top:84px}
.oc-role{width:auto;min-width:130px;padding:6px 9px;font-size:.8rem}
.oc-perm{width:100%;border-collapse:collapse;font-size:.76rem}
.oc-perm th{font-size:.64rem;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);padding:4px;text-align:center}
.oc-perm td{padding:7px 4px;border-top:1px solid var(--line-soft);text-align:center;color:var(--body)}
.oc-perm td:first-child{text-align:left}
.oc-yes{color:var(--pos);font-weight:700}.oc-no{color:var(--faint)}
.oc-qr{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;display:flex;justify-content:center}
.oc-qr img{width:180px;height:180px}
/* Live indicator */
.oc-live{display:inline-flex;align-items:center;gap:6px;font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--pos);background:var(--pos-bg);border-radius:100px;padding:4px 10px}
.oc-live i{width:7px;height:7px;border-radius:50%;background:#16A34A;box-shadow:0 0 0 0 rgba(22,163,74,.5)}
.oc-live.pulse i{animation:ocLive 1.2s ease-out}
.oc-live.off{color:var(--muted);background:var(--bg)}.oc-live.off i{background:var(--faint)}
@keyframes ocLive{0%{box-shadow:0 0 0 0 rgba(22,163,74,.55)}100%{box-shadow:0 0 0 10px rgba(22,163,74,0)}}
/* Mobile */
#ocSearchBtn{display:none}
@media (max-width:1100px){ .oc-userwrap{grid-template-columns:1fr} .oc-side{position:static} .oc-settings{grid-template-columns:1fr} }
@media (max-width:1000px){
  #ocSearchBtn{display:flex}
  .oc-live{display:none}
  .oc-board{grid-auto-columns:minmax(260px,82vw);scroll-snap-type:x mandatory}
  .oc-col{scroll-snap-align:start}
  body.oc .page-head{align-items:flex-start}
  .oc-row4{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  body.oc .topbar .btn-gold{padding:8px 10px}
  .oc-trends{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .oc-kpi .v{font-size:1.35rem}
  .oc-set{flex-direction:column;align-items:stretch}
  .oc-set-in .input{width:100%}
  .oc-filters input.input{min-width:0;width:100%}
}
@media (max-width:560px){
  body.oc .topbar .btn-gold{font-size:0;gap:0;padding:9px;width:38px;height:38px;justify-content:center}
  body.oc .topbar .btn-gold .icon{width:18px;height:18px}
  body.oc .topbar{gap:6px}
}
.oc-mfa-row{display:flex;gap:8px;flex-wrap:wrap}
.oc-mfa-row .input{flex:1;min-width:140px;letter-spacing:.2em;font-variant-numeric:tabular-nums}
/* side cards never wider than their column */
.oc-side .card{min-width:0;overflow-wrap:anywhere}
@media (max-width:1100px){ .oc-userwrap{grid-template-columns:minmax(0,1fr)} }
@media (max-width:1280px){ body.oc .searchbox{width:240px} }
/* Chat safety flag on staff conversation cards */
.oc-flag{background:var(--red-bg,#FDECEA);border:1px solid rgba(216,69,59,.25);border-radius:12px;padding:10px 12px;margin:0 0 12px;font-size:.8rem;color:#7A2620}
.oc-flag b{display:block;margin-bottom:4px;color:#A3322A}
.oc-flag div{margin:3px 0;line-height:1.45}
.oc-flag span{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#A3322A;margin-right:4px}
.oc-flag small{display:block;margin-top:6px;color:#9A5A55}
/* Send push (2026-10-24) */
.oc-push{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,1fr);gap:18px;align-items:start}
.oc-push-form{display:flex;flex-direction:column;gap:8px}
.oc-push-form .oc-filters{margin-bottom:4px}
.oc-push-l{font-size:.78rem;font-weight:700;color:var(--ink);margin-top:8px;display:flex;justify-content:space-between}
.oc-push-l small{font-weight:500;color:var(--faint)}
.oc-push-row{display:flex;gap:8px;flex-wrap:wrap}
.oc-push-row[hidden]{display:none}
.oc-push-row .input{flex:1;min-width:180px}
.oc-push-form textarea.input{resize:vertical;min-height:92px;font-family:inherit}
.oc-push-check{display:block;font-size:.84rem;margin-top:6px;cursor:pointer;line-height:1.5}
.oc-push-check input{margin:0 8px 0 0;vertical-align:-2px}
.oc-push-reach{background:var(--green-50);border-radius:12px;padding:12px 14px;font-size:.84rem;line-height:1.45;margin:8px 0 4px}
.oc-push-split{display:flex;flex-direction:column;gap:3px;margin-top:6px;font-size:.8rem}
.oc-push-split i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#C5CCD6;margin-right:7px}
.oc-push-split i.ok{background:var(--green-600)}
.oc-push-bad{color:#B42318}
.oc-push-form .btn[data-push-send]{align-self:flex-start;display:inline-flex;gap:8px;align-items:center}
.oc-push-side{display:flex;flex-direction:column;gap:14px}
.oc-push-phone{background:linear-gradient(160deg,#0F3D2E,#14503B 55%,#B8901F);border-radius:28px;padding:22px 14px 40px;min-height:230px;box-shadow:0 10px 30px rgba(16,24,38,.15)}
.oc-push-time{color:#fff;text-align:center;font-size:2.4rem;font-weight:300;letter-spacing:-.02em;margin-bottom:18px}
.oc-push-note{display:flex;gap:10px;background:rgba(255,255,255,.88);backdrop-filter:blur(10px);border-radius:16px;padding:11px 12px;align-items:flex-start}
.oc-push-note img{width:34px;height:34px;border-radius:8px;flex:none}
.oc-push-note > div{min-width:0;flex:1}
.oc-push-app{display:flex;justify-content:space-between;font-size:.62rem;letter-spacing:.04em;color:#5B6472;margin-bottom:2px}
.oc-push-note b{display:block;font-size:.84rem;color:#101826;overflow-wrap:anywhere}
.oc-push-note p{margin:2px 0 0;font-size:.8rem;color:#2A3342;line-height:1.35;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.oc-push-hist{margin-top:8px;display:flex;flex-direction:column}
.oc-push-h{padding:9px 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.oc-push-h:first-child{border-top:0}
.oc-push-h b{color:var(--ink);font-size:.82rem;display:block}
.oc-push-h span{font-size:.74rem}
.oc-push-hn{font-size:.74rem;color:var(--green-600)}
@media (max-width:900px){.oc-push{grid-template-columns:1fr}}
