/* ── Focus Indicators (WCAG 2.4.7) — Phase 8: teal outline ── */
:focus-visible{outline:2px solid var(--brand-og-accent);outline-offset:2px;border-radius:4px;}
button:focus-visible,select:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--brand-og-accent);outline-offset:2px;}

/* ── HEADER ── */
header{display:flex;align-items:center;padding:0 28px;height:80px;background:#13161a;border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;z-index:var(--z-header);gap:16px;box-shadow:0 2px 8px rgba(0,0,0,.3);}
/* Phase 4 cleanup (2026-05-23): #notif-ov-btn / .notif-ov-* / #notif-ov-dropdown
   rules removed — header bell + dropdown surface deleted along with the
   /notifications page. Follow-Ups queue now lives in Dashboard Zone 2. */
.hdr-left{display:flex;align-items:center;gap:8px;justify-content:flex-start;}
.hdr-right{display:inline-flex;flex-direction:column;align-items:stretch;gap:4px;justify-content:center;margin-left:auto;}
.hdr-right-top{display:flex;align-items:center;gap:6px;}
.hdr-right-top .profile-btn{flex:1;justify-content:flex-start;}
.hdr-right-bottom{display:flex;align-items:center;gap:6px;}
.hdr-search-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);color:#FFFFFF;font-size:18px;cursor:pointer;transition:all .15s;flex-shrink:0;}
.hdr-search-icon:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.3);color:#FFFFFF;}

/* ── SCOUT LOGO ── */
.logo{display:flex;align-items:center;gap: 12px;flex-shrink:0;cursor:default;user-select:none;}
.logo-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;flex-shrink:0;}
.logo-icon img{display:block;}
.logo-wordmark{display:flex;flex-direction:column;line-height:1;}
.logo-full{display:flex;align-items:baseline;gap:1px;}
.logo-legacy{
  font-family:'Newsreader','Georgia',serif;
  font-size:24px;font-weight:500;letter-spacing:-.01em;
  color:var(--brand-brass);
  line-height:1;
}
.logo-flow{
  font-family:'Newsreader','Georgia',serif;
  font-size:24px;font-weight:400;font-style:italic;letter-spacing:0;
  color:var(--brand-brass);
  line-height:1;
}
.logo-sub{
  font-family:'JetBrains Mono',monospace;font-size:8px;
  color:rgba(255,255,255,.5);letter-spacing:.14em;text-transform:uppercase;
  margin-top:4px;
}

/* ── SYNC STATUS ── */
.sync-status{
  display:flex;align-items:center;gap: 4px;padding:4px 12px;border-radius:8px;
  font-size:11px;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:var(--muted);
  letter-spacing:.01em;
}
.sync-status:hover{border-color:rgba(255,255,255,.15);color:var(--text-on-dark);}
.sync-dot{width:6px;height:6px;border-radius:50%;background:rgba(135,135,135,.45);transition:background .3s;flex-shrink:0;}
.sync-dot.ok{background:var(--green);box-shadow:0 0 5px rgba(61,220,132,.5);}
.sync-dot.warn{background:var(--color-amber);box-shadow:0 0 5px rgba(var(--accent-rgb),.4);}
.sync-dot.err{background:var(--red);box-shadow:0 0 5px rgba(240,97,74,.4);}
.sync-dot.spin{background:var(--blue);animation:syncSpin .8s linear infinite;}
@keyframes syncSpin{0%{opacity:1}50%{opacity:.2}100%{opacity:1}}

/* ── USER PROFILE ── */
.profile-btn{
  display:flex;align-items:center;gap:8px;padding:6px 14px;
  border-radius:10px;font-size:12px;font-weight:600;cursor:pointer;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);color:#FFFFFF;
  transition:all .15s;white-space:nowrap;letter-spacing:.01em;
}
.profile-btn:hover{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.18);}
.profile-wrap{position:relative;}
.profile-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;width:280px;background:#1e2328;border:1px solid rgba(255,255,255,.12);border-radius:8px;box-shadow:var(--shadow-lg);z-index:300;overflow:hidden;transform-origin:top right;opacity:0;transition:transform .2s var(--ease-out-quart),opacity .15s ease;}
.profile-dropdown.open{display:block;transform:translateY(0);opacity:1;}
.pd-info{display:flex;align-items:center;gap:10px;padding:14px;border-bottom:1px solid rgba(255,255,255,.06);}
.pd-avatar{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;flex-shrink:0;}
.pd-details{min-width:0;}
.pd-name{font-size:13px;font-weight:700;color:#FFFFFF;}
.pd-role{font-size:10px;color:var(--accent);font-weight:600;text-transform:uppercase;letter-spacing:.06em;}
.pd-fields{padding:10px 14px;display:flex;flex-direction:column;gap:6px;}
.pd-field{display:flex;justify-content:space-between;align-items:center;}
.pd-label{font-size:10px;color:var(--muted);font-weight:600;}
.pd-val{font-size:11px;color:var(--text-on-dark);font-family:'JetBrains Mono',monospace;}
.pd-actions{display:flex;gap:6px;padding:10px 14px;border-top:1px solid rgba(255,255,255,.06);}
.pd-action-btn{flex:1;padding:6px 12px;border-radius:6px;border:1px solid rgba(var(--accent-rgb),.2);background:rgba(var(--accent-rgb),.06);color:var(--accent);font-size:10px;font-weight:700;cursor:pointer;font-family:inherit;text-align:center;transition:all .15s;}
.pd-action-btn:hover{background:rgba(var(--accent-rgb),.12);border-color:rgba(var(--accent-rgb),.35);}
.pd-signout{border-color:rgba(234,134,143,.2);background:rgba(234,134,143,.06);color:var(--color-red);}
.pd-signout:hover{background:rgba(234,134,143,.12);border-color:rgba(234,134,143,.35);}
.profile-avatar{
  width:24px;height:24px;border-radius:4px;display:flex;align-items:center;
  justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0;background:var(--brand-brass) !important;
}
.pm-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:var(--z-profile,1000);display:none;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.pm-overlay.open{display:flex;}
.pm-card{
  width:360px;max-width:92vw;background:#1A2332;border:1px solid rgba(255,255,255,.12);border-radius:16px;
  box-shadow:0 16px 48px rgba(0,0,0,.5);overflow:hidden;
}
.pm-card-hdr{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.06);}
.pm-card-title{font-size:13px;font-weight:700;color:rgba(255,255,255,.85);text-transform:uppercase;letter-spacing:.06em;}
.pm-header{display:flex;align-items:center;gap:12px;padding:18px 20px;background:rgba(255,255,255,.03);}
.pm-avatar-lg{
  width:44px;height:44px;border-radius:8px;display:flex;align-items:center;
  justify-content:center;font-size:18px;font-weight:700;color:#fff;flex-shrink:0;background:var(--brand-brass) !important;
}
.pm-name{font-size:16px;font-weight:700;color:rgba(255,255,255,.92);}
.pm-role{font-size:11px;color:rgba(255,255,255,.5);margin-top:2px;}
.pm-divider{height:1px;background:rgba(255,255,255,.06);margin:0;}
.pm-field{margin-bottom:12px;padding:0 20px;}
.pm-field:first-of-type{padding-top:16px;}
.pm-label{font-size:9px;font-weight:700;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.1em;margin-bottom:4px;font-family:'JetBrains Mono',monospace;}
.pm-input{width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:8px 12px;color:rgba(255,255,255,.9);font-size:12px;font-family:inherit,sans-serif;outline:none;transition:border-color .15s;box-sizing:border-box;}
.pm-input:focus{border-color:var(--brand-og-accent);box-shadow:0 0 0 2px rgba(var(--brand-og-accent-rgb),.25);}
.pm-input::placeholder{color:rgba(255,255,255,.3);}
.pm-save{width:calc(100% - 40px);margin:4px 20px 16px;padding:8px;border-radius:9px;background:var(--color-completed);color:#FFFFFF;font-size:12px;font-weight:700;cursor:pointer;border:none;font-family:inherit,sans-serif;transition:background .12s;}
.pm-save:hover{background:#34B873;}
/* Call log user badge */
.clog-user{
  display:inline-flex;align-items:center;gap:4px;
  padding:1px 6px;border-radius:8px;font-size:9px;font-weight:700;
  color:#0a0c10;margin-left:4px;vertical-align:middle;
}

/* ── SETUP OVERLAY ── */
.setup-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.88);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  z-index:var(--z-auth);display:flex;align-items:center;justify-content:center;
}
.setup-card{
  background:var(--s1);border:1px solid var(--border2);border-radius:20px;
  width:520px;padding:36px;text-align:center;
}
.setup-icon{font-size:48px;margin-bottom:16px;}
.setup-title{font-size:22px;font-weight:700;margin-bottom:8px;}
.setup-sub{font-size:13px;color:var(--muted);margin-bottom:28px;line-height:1.7;}
.setup-steps{
  background:var(--s2);border:1px solid var(--border);border-radius:12px;
  padding:16px 20px;margin-bottom:24px;text-align:left;
}
.setup-step{display:flex;gap:10px;margin-bottom:10px;font-size:12px;align-items:flex-start;}
.setup-step:last-child{margin-bottom:0;}
.step-num{
  width:20px;height:20px;border-radius:50%;background:var(--color-amber);color:#0a0c10;
  font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;
}
.step-txt{color:var(--text);line-height:1.5;}
.step-txt b{color:var(--accent);}
.setup-folder-display{
  background:var(--s2);border:1px solid var(--border);border-radius:8px;
  padding:8px 14px;font-family:'JetBrains Mono',monospace;font-size:10px;
  color:var(--brand-og-accent);margin-bottom:16px;word-break:break-all;display:none;text-align:left;
}
.setup-btns{display:flex;gap:8px;justify-content:center;}

/* ── PROFILE PICKER ── */
.pp-list{display:flex;flex-direction:column;gap:6px;margin-bottom:8px;max-height:320px;overflow-y:auto;}
.pp-card{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:10px;border:1px solid var(--border);cursor:pointer;transition:background .15s,border-color .15s;}
.pp-card:hover{background:rgba(var(--accent-rgb),.06);border-color:rgba(var(--accent-rgb),.3);}
.pp-avatar{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;flex-shrink:0;}
.pp-card span{font-size:14px;font-weight:600;color:var(--text);}
.pp-create-form{display:flex;flex-direction:column;gap:8px;padding:12px 0 0;}
.pp-color-row{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;}
.pp-color-dot{width:26px;height:26px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:border-color .15s,transform .15s;}
.pp-color-dot:hover{transform:scale(1.15);}
.pp-color-dot.selected{border-color:#fff;transform:scale(1.15);}
.pp-delete{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:24px;height:24px;border:none;background:none;color:var(--muted);cursor:pointer;font-size:14px;border-radius:50%;display:none;align-items:center;justify-content:center;}
.pp-card{position:relative;}
.pp-card:hover .pp-delete{display:flex;}
.pp-delete:hover{background:rgba(239,68,68,.15);color:var(--red);}
.pm-team-btn{width:calc(100% - 40px);margin:0 20px 0;padding:8px;border-radius:8px;background:rgba(110,168,254,.08);border:1px solid rgba(110,168,254,.2);color:var(--color-blue);font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;transition:background .12s,border-color .12s;font-family:inherit;}
.pm-team-btn:hover{background:rgba(110,168,254,.15);border-color:rgba(110,168,254,.35);}
.pm-switch{width:calc(100% - 40px);margin:0 20px 16px;padding:8px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:none;color:rgba(255,255,255,.6);font-size:12px;cursor:pointer;transition:all .15s;}
.pm-switch:hover{background:rgba(248,113,113,.08);border-color:rgba(248,113,113,.2);color:var(--red);}

/* ── PROFILE ROLE BADGE ── */
.profile-avatar-logo{width:24px;height:24px;border-radius:6px;object-fit:contain;flex-shrink:0;}
.profile-role-tag{font-size:9px;font-weight:600;color:rgba(255,255,255,.6);font-family:'JetBrains Mono',monospace;letter-spacing:.04em;}

/* ── TEAM MANAGEMENT MODAL ── */
.tm-overlay{display:none;position:fixed;inset:0;z-index:var(--z-modal);background:rgba(0,0,0,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);align-items:center;justify-content:center;}
.tm-overlay.open{display:flex;}
.tm-card{background:var(--s1);border:1px solid rgba(var(--accent-rgb),.15);border-radius:14px;width:520px;max-width:92vw;max-height:80vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 16px 64px rgba(0,0,0,.6);}
.tm-header{display:flex;align-items:center;justify-content:space-between;padding:18px 22px 14px;border-bottom:1px solid rgba(var(--accent-rgb),.1);}
.tm-title{font-size:15px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px;margin:0;}
.tm-close{background:none;border:none;color:var(--muted);font-size:16px;cursor:pointer;padding:4px 8px;border-radius:6px;transition:all .15s;}
.tm-close:hover{background:rgba(var(--accent-rgb),.1);color:var(--text);}

.tm-invite-section{padding:16px 22px;}
.tm-invite-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:8px;font-family:'JetBrains Mono',monospace;}
.tm-invite-row{display:flex;gap:8px;align-items:center;}
.tm-invite-input{flex:1;background:var(--s2);border:1px solid rgba(var(--accent-rgb),.15);border-radius:8px;padding:6px 10px;color:var(--text);font-size:12px;font-family:inherit;outline:none;transition:border-color .15s;}
.tm-invite-input:focus{border-color:var(--accent);}
.tm-invite-role-select{background:var(--s2);border:1px solid rgba(var(--accent-rgb),.15);border-radius:8px;padding:6px 10px;color:var(--text);font-size:11px;font-family:inherit;cursor:pointer;outline:none;}
.tm-invite-hint{font-size:10px;color:var(--dim);margin-top:6px;}

.tm-divider{height:1px;background:rgba(var(--accent-rgb),.08);margin:0 22px;}

.tm-members-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);padding:14px 22px 8px;font-family:'JetBrains Mono',monospace;}
.tm-member-list{overflow-y:auto;max-height:340px;padding:0 22px 16px;}
.tm-member-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid rgba(var(--accent-rgb),.06);}
.tm-member-row:last-child{border-bottom:none;}
.tm-member-avatar{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0;}
.tm-member-info{flex:1;min-width:0;}
.tm-member-name{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tm-member-email{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tm-role-badge{font-size:10px;font-weight:600;padding:2px 8px;border-radius:6px;white-space:nowrap;}
.tm-role-owner{background:rgba(var(--accent-rgb),.15);color:var(--accent);}
.tm-role-admin{background:rgba(var(--brand-og-accent-rgb),.15);color:var(--blue);}
.tm-role-member{background:rgba(74,222,128,.12);color:#4ade80;}
.tm-role-select{background:var(--s2);border:1px solid rgba(var(--accent-rgb),.15);border-radius:6px;padding:4px 8px;color:var(--text);font-size:10px;font-family:inherit;cursor:pointer;outline:none;}
.tm-remove-btn{background:none;border:1px solid rgba(239,68,68,.2);color:var(--muted);font-size:12px;cursor:pointer;padding:2px 6px;border-radius:6px;transition:all .15s;flex-shrink:0;}
.tm-remove-btn:hover{background:rgba(239,68,68,.12);color:var(--red);border-color:rgba(239,68,68,.4);}

/* ── LAYOUT ── */
.app{display:grid;grid-template-columns:240px 1fr;min-height:calc(100vh - 80px);transition:grid-template-columns .25s ease;}

/* ── SIDEBAR ── */
.sidebar{background:#13161a;border-right:1px solid rgba(255,255,255,.06);display:flex;flex-direction:column;position:sticky;top:80px;height:calc(100vh - 80px);overflow-x:visible;overflow-y:auto;transition:width var(--dur-med) var(--ease-out);width:240px;}
body.sb-collapsed .app{grid-template-columns:52px 1fr;}
body.sb-collapsed .sidebar{width:52px;overflow:hidden;}
body.sb-collapsed .sb-label,body.sb-collapsed .sb-proj-area,body.sb-collapsed .sb-divider{display:none;}
.sb-proj-icon{display:none;}
body.sb-collapsed .sb-proj-icon{display:flex;align-items:center;justify-content:center;padding:10px 0;margin:0 8px;cursor:pointer;color:rgba(255,255,255,.5);transition:all .15s;border-radius:8px;}
body.sb-collapsed .sb-proj-icon:hover{color:var(--text-on-dark);background:rgba(255,255,255,.06);}
body.sb-collapsed .sb-proj-icon.active{color:var(--brand-brass);background:rgba(var(--brand-brass-rgb),.10);}
body.sb-collapsed .sb-proj-icon.active svg{color:var(--brand-brass);}
body.sb-collapsed .gnav-count,body.sb-collapsed .gnav-left span:not(.gnav-icon),body.sb-collapsed .gnav-notif-dot,body.sb-collapsed .sb-nav-divider,body.sb-collapsed .gnav-pa-chevron,body.sb-collapsed .sb-proj-area,body.sb-collapsed .sb-user-info{display:none !important;}

/* Pending-count corner indicator — surfaces Approvals/My PSAs urgency in
   collapsed/hover sidebar modes where the numeric .gnav-count badge is hidden.
   Toggled by .has-pending class set in _setSidebarBadge() when count > 0. */
.gnav-icon{position:relative;}
.gnav-btn.has-pending .gnav-icon::after{content:'';position:absolute;top:-1px;right:-1px;width:7px;height:7px;border-radius:50%;background:var(--color-warning, oklch(0.55 0.18 55));border:1.5px solid #171B21;pointer-events:none;display:none;}
body.sb-collapsed .gnav-btn.has-pending .gnav-icon::after,body.sb-hover .gnav-btn.has-pending .gnav-icon::after{display:block;}
body.sb-hover .sidebar:hover .gnav-btn.has-pending .gnav-icon::after{display:none;}
body.sb-collapsed .sb-brand-name{display:none;}
body.sb-collapsed .sb-brand-byline{display:none;}
body.sb-collapsed .sb-brand-link{display:none;}
body.sb-collapsed .sb-brand{justify-content:center;padding:12px 0;}
body.sb-collapsed .sb-toggle-wrap{margin-left:0;margin-right:auto;overflow:visible;}
body.sb-collapsed .sb-footer{padding:0 0 8px;}
body.sb-collapsed .sb-user-hdr{justify-content:center;padding:10px 0;gap:0;}
body.sb-collapsed .sb-user-logo{width:32px;height:32px;}
body.sb-collapsed .sb-section{padding:6px 0;}
body.sb-collapsed .sb-nav-section{display:flex;flex-direction:column;align-items:center;padding:6px 0;}
body.sb-collapsed .gnav-btn{justify-content:center;padding:10px 0;margin:2px 0;border-radius:0;width:40px;}
body.sb-collapsed .gnav-left{gap:0;justify-content:center;font-size:0;}
body.sb-collapsed .gnav-left .gnav-icon{font-size:18px;line-height:1;color:rgba(255,255,255,.6);}
/* Phase 4 cleanup (2026-05-23): #gnav-notifications.urgent rule removed — sidebar item deleted with the /notifications page. */
@keyframes notifIconPulse{0%,100%{color:var(--color-red);}50%{color:#FCA5A5;}}
body.sb-collapsed #gnav-dashboard .gnav-icon{color:var(--brand-brass);}
body.sb-collapsed .gnav-btn.active{background:rgba(var(--brand-brass-rgb),.10);border-radius:8px;}
body.sb-collapsed .gnav-btn.active .gnav-icon{color:var(--brand-brass) !important;}
body.sb-collapsed #gnav-dashboard.active .gnav-icon{color:var(--brand-brass) !important;}
body.sb-collapsed #gnav-dashboard.active{background:rgba(var(--brand-brass-rgb),.10);}
body.sb-collapsed .gnav-btn:hover{background:rgba(255,255,255,.06);}
.sb-toggle{position:fixed;top:50%;left:300px;transform:translateY(-50%);z-index:var(--z-sidebar-toggle);width:16px;height:44px;background:var(--brand-brass);border:none;border-radius:0 6px 6px 0;color:#fff;font-size:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:left var(--dur-med) var(--ease-out),background .15s;padding:0;line-height:1;font-weight:700;}
.sb-toggle:hover{background:var(--brand-brass-hover);}
body.sb-collapsed .sb-toggle{left:52px;top:50%;width:16px;height:44px;border-radius:0 6px 6px 0;border:none;background:var(--brand-brass);color:#fff;}
/* Brand header — Scout, by OGLandman lockup (§6.3) */
.sb-brand{display:flex;align-items:center;justify-content:space-between;padding:14px 14px;border-bottom:1px solid rgba(255,255,255,.06);}
.sb-brand-text{display:flex;flex-direction:column;gap: 2px;min-width:0;}
.sb-brand-name{
  font-family:'Newsreader','Georgia',serif;
  color:#FFFFFF;
  font-size:24px;
  font-weight:500;
  letter-spacing:-.01em;
  line-height:1;
}
.sb-brand-iq{color:var(--brand-og-accent,#298084);}
/* "by OGLandman" byline — mono uppercase micro-text matching the
   marketing-site treatment. "OG" gets the brand accent color. */
.sb-brand-byline{
  font-family:'JetBrains Mono',monospace;
  font-size:9px;
  letter-spacing:.14em;
  color:rgba(255,255,255,.55);
  line-height:1;
  white-space:nowrap;
  padding-left:0.35em;
}
.sb-brand-og{
  color:var(--brand-og-accent,#298084);
  font-weight:700;
}
/* Sidebar search button */
.sb-search-btn{display:flex;align-items:center;gap:8px;width:calc(100% - 24px);margin:8px 12px;padding:6px 10px;border-radius:6px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:rgba(255,255,255,.4);cursor:pointer;font-size:12px;transition:all .15s;}
.sb-search-btn:hover{background:rgba(255,255,255,.08);color:rgba(255,255,255,.7);border-color:rgba(255,255,255,.12);}
.sb-search-text{flex:1;text-align:left;font-size:12px;}
.sb-search-kbd{font-family:'JetBrains Mono',monospace;font-size:9px;padding:1px 4px;border-radius:4px;background:rgba(255,255,255,.06);color:rgba(255,255,255,.3);}
body.sb-collapsed .sb-search-text,body.sb-collapsed .sb-search-kbd{display:none;}
body.sb-collapsed .sb-search-btn{width:auto;margin:4px auto;padding:8px;justify-content:center;}

/* Sidebar toggle button + dropdown */
.sb-toggle-wrap{position:relative;margin-left:auto;}
.sb-toggle-btn{width:28px;height:28px;border-radius:6px;border:none;background:transparent;color:rgba(255,255,255,.4);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;padding:0;}
.sb-toggle-btn:hover{background:rgba(255,255,255,.08);color:rgba(255,255,255,.8);}
/* position:fixed so the dropdown escapes .sidebar's overflow:hidden/auto
   clip. Top/left set inline via _openSidebarModeDropdown() from the
   wrap's getBoundingClientRect at open time. */
.sb-mode-dropdown{display:none;position:fixed;background:#1E2128;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:10px 4px 4px;min-width:130px;z-index:500;box-shadow:0 8px 24px rgba(0,0,0,.4);}
.sb-mode-dropdown.open{display:block;}
.sb-mode-opt{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:6px;cursor:pointer;font-size:11px;font-weight:500;color:rgba(255,255,255,.65);transition:all .12s;}
.sb-mode-opt:hover{background:rgba(255,255,255,.06);color:#FFFFFF;}
.sb-mode-opt.active{color:var(--brand-brass);}
/* Footer (profile, pushed to bottom) */
.sb-footer{margin-top:auto !important;flex-shrink:0;}
/* User profile */
.sb-user-hdr{display:flex;align-items:center;gap:10px;padding:12px 14px;border-top:1px solid rgba(255,255,255,.06);transition:background .15s;}
.sb-user-logo{width:40px;height:40px;border-radius:10px;object-fit:contain;flex-shrink:0;}
.sb-user-hdr:hover{background:rgba(255,255,255,.04);}
.sb-user-hdr.active{background:rgba(var(--accent-rgb),.06);border-bottom-color:rgba(var(--accent-rgb),.15);}
/* Sidebar user avatar — initials in a 32x32 colored circle (audit
   §3.3 P1 + §3.13 P0). Background color set by JS from a 6-color
   palette keyed by user-id; fallback to neutral gray if JS hasn't
   run yet. NOT the OG mark — the avatar identifies the user. */
.sb-user-avatar{width:32px;height:32px;border-radius:50%;background:#6B7280;display:flex;align-items:center;justify-content:center;font-family:'Geist Sans',system-ui,sans-serif;font-size:12px;font-weight:600;color:#FFFFFF;flex-shrink:0;letter-spacing:.02em;}
.sb-user-info{flex:1;min-width:0;}
.sb-user-name{font-size:12px;font-weight:600;color:var(--text-on-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sb-user-role{font-size:9px;color:var(--muted);margin-top:1px;}

.sb-section{padding:14px 14px 6px;}
.sb-nav-section{background:transparent;border-radius:0;margin:0;padding:8px 10px;}
.sb-label{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:0 4px;margin-bottom:8px;font-weight:700;}
/* IA Batch A (2026-06-02): sidebar nav area groups. display:contents keeps
   the eyebrow headers + buttons participating directly in .sb-nav-section's
   flex layout (so collapsed/hover rail centering + the .sb-label hide rules
   still apply); the group wrapper itself renders no box. */
.sb-nav-group{display:contents;}
.sb-nav-section .sb-label{margin-top:14px;}
.sb-nav-section .sb-nav-group:first-child .sb-label{margin-top:4px;}
/* A gnav-btn carrying the HTML `hidden` attribute (e.g. Outreach, hidden
   until the feature ships) must actually hide — .gnav-btn's own display
   would otherwise win over the low-specificity [hidden] default. */
.gnav-btn[hidden]{display:none !important;}
.sb-nav-label{display:none;}
.sb-nav-divider{height:1px;background:rgba(255,255,255,.06);margin:6px 14px;}
/* Hover mode — icon-only rail that expands on hover */
body.sb-hover .app{grid-template-columns:52px 1fr;}
body.sb-hover .sidebar{width:52px;overflow:hidden;transition:width .2s ease;}
body.sb-hover .sidebar:hover{width:240px;overflow:visible;box-shadow:4px 0 24px rgba(0,0,0,.25);z-index:400;}
body.sb-hover .sb-toggle{display:none;}
/* When not hovered, hide text like collapsed mode */
body.sb-hover .sb-label,body.sb-hover .sb-proj-area,body.sb-hover .sb-nav-divider{display:none;}
body.sb-hover .sidebar:hover .sb-label,body.sb-hover .sidebar:hover .sb-nav-divider{display:block;}
body.sb-hover .sidebar:hover .sb-proj-area{display:block;}
body.sb-hover .gnav-count,body.sb-hover .gnav-left span:not(.gnav-icon),body.sb-hover .gnav-notif-dot,body.sb-hover .gnav-pa-chevron{display:none;}
body.sb-hover .sidebar:hover .gnav-count,body.sb-hover .sidebar:hover .gnav-left span:not(.gnav-icon){display:inline;}
body.sb-hover .sidebar:hover .gnav-pa-chevron{display:inline;}
body.sb-hover .sb-user-info,body.sb-hover .sb-search-text,body.sb-hover .sb-search-kbd{display:none;}
body.sb-hover .sb-search-btn{width:auto;margin:4px auto;padding:8px;justify-content:center;}
body.sb-hover .sidebar:hover .sb-user-info,body.sb-hover .sidebar:hover .sb-search-text{display:block;}
body.sb-hover .sidebar:hover .sb-search-kbd{display:inline;}
body.sb-hover .sidebar:hover .sb-search-btn{width:calc(100% - 24px);margin:8px 12px;padding:6px 10px;justify-content:flex-start;}
body.sb-hover .sb-brand-name{display:none;}
body.sb-hover .sb-brand-byline{display:none;}
body.sb-hover .sb-brand-link{display:none;}
body.sb-hover .sb-brand{justify-content:center;padding:12px 0;}
body.sb-hover .sb-toggle-wrap{margin-left:0;}
body.sb-hover .sidebar:hover .sb-brand-name{display:inline;}
body.sb-hover .sidebar:hover .sb-brand-byline{display:inline;}
body.sb-hover .sidebar:hover .sb-brand-link{display:inline-flex;}
body.sb-hover .sidebar:hover .sb-brand{justify-content:space-between;padding:18px 14px;}
body.sb-hover .sidebar:hover .sb-toggle-wrap{margin-left:auto;}
body.sb-hover .gnav-btn{justify-content:center;padding:12px 0;margin:0;border-radius:0;border-left:none;}
body.sb-hover .sidebar:hover .gnav-btn{justify-content:flex-start;padding:8px 12px 8px 8px;margin:1px 0;border-left:1px solid transparent;}
body.sb-hover .gnav-left{gap:0;justify-content:center;font-size:0;}
body.sb-hover .sidebar:hover .gnav-left{gap:10px;justify-content:flex-start;font-size:13px;}
body.sb-hover .gnav-left .gnav-icon{font-size:18px;line-height:1;}
body.sb-hover .sb-footer{padding:0 0 8px;}
body.sb-hover .sidebar:hover .sb-footer{padding:0 14px 14px;}
body.sb-hover .sb-user-hdr{justify-content:center;padding:14px 0;gap:0;}
body.sb-hover .sb-user-logo{width:32px;height:32px;}
body.sb-hover .sidebar:hover .sb-user-logo{width:40px;height:40px;}
body.sb-hover .sidebar:hover .sb-user-hdr{justify-content:flex-start;padding:16px;gap:10px;}
.sb-divider{display:none;}

/* Global nav (§6.3 — brass-muted active halo, no border-left stripe) */
/* CO-032/Fix 6 — perm-gated hide-then-reveal pattern (FOUC-free).
   Before perm-gate.js completes its first full-page pass, cloak every
   [data-perm] host. After body.perm-ready, per-element class/inline display
   controls visibility so flex/grid/table hosts keep their own display type. */
body:not(.perm-ready) [data-perm]{display:none!important;}
/* Nav remains default-hidden after perm-ready and is explicitly revealed as
   flex when allowed, because these rail buttons have a fixed display mode. */
.gnav-btn[data-perm]{display:none;}
.gnav-btn[data-perm].perm-allowed{display:flex;}
/* Same hide-then-reveal for perm-gated sidebar GROUP HEADERS (e.g. the
   IMPORT eyebrow). :not(.perm-allowed) keeps it hidden until perm-gate.js
   adds .perm-allowed, then lets it fall through to the normal .sb-label
   cascade (so collapsed/hover rail rules still hide it). Prevents an
   orphan "Import" eyebrow flashing for Agent/Viewer/scoped-PM before JS. */
.sb-label[data-perm]:not(.perm-allowed){display:none;}
/* P1-12 slice 1b: nav items are native <button> (keyboard-focusable + activatable).
   Reset the UA button chrome so geometry/look is byte-identical to the prior divs.
   Padding is owned above (not reset). Width: a block <div> auto-filled its container
   (239px .sb-nav-section − 12px margin = 227px), but a <button> shrink-to-fits to its
   content; and width:100% would overflow (239 + 12px margin > 240px sidebar). So fill
   the container MINUS the margin via fill-available/stretch → exactly 227px, no overflow
   (verified live). The sb-collapsed/sb-hover 40px width overrides still win (more
   specific selectors). Focus ring: intentionally NOT set here — the buttons inherit the
   app-wide teal focus-visible system above (lines 1-3, WCAG 2.4.7) for consistency. */
.gnav-btn{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-radius:6px;cursor:pointer;transition:background-color .15s,color .15s;border:none;margin-bottom:2px;appearance:none;-webkit-appearance:none;background:transparent;font:inherit;color:inherit;text-align:left;width:-webkit-fill-available;width:-moz-available;width:stretch;}
.gnav-btn:hover{background:rgba(255,255,255,.06);}
.gnav-btn.active{background:rgba(var(--brand-brass-rgb),.10);}
.gnav-left{display:flex;align-items:center;gap: 8px;font-size:12.5px;font-weight:500;color:var(--muted);}
.gnav-btn:hover .gnav-left{color:var(--text-on-dark);}
.gnav-btn.active .gnav-left{color:var(--brand-brass);font-weight:600;}
.gnav-btn .gnav-icon{color:var(--muted);transition:color .12s;}
.gnav-btn:hover .gnav-icon{color:var(--text-on-dark);}
.gnav-btn.active .gnav-icon{color:var(--brand-brass);}
#gnav-dashboard .gnav-icon{color:var(--brand-brass);}
#gnav-dashboard:hover .gnav-icon{color:var(--brand-brass-hover);}
#gnav-dashboard.active .gnav-icon{color:var(--brand-brass);}
.gnav-pa-chevron{font-size:8px;color:var(--muted);transition:transform .2s ease;margin-left:auto;margin-right:2px;line-height:1;}
.gnav-count{font-family:'JetBrains Mono',monospace;font-size:9px;padding:2px 6px;border-radius:6px;background:rgba(255,255,255,.06);color:var(--muted);font-weight:600;}
.gnav-btn.active .gnav-count{background:rgba(var(--brand-brass-rgb),.15);color:var(--brand-brass);}
.gnav-count-notif{background:rgba(234,134,143,.12) !important;color:var(--color-red) !important;}
.gnav-count-overdue{background:rgba(234,134,143,.15) !important;color:var(--color-red) !important;}
#gnav-deals-cnt{background:rgba(var(--brand-brass-rgb),.15);color:var(--brand-brass);}
.gnav-count.hot{background:rgba(239,68,68,.15);color:#FCA5A5;}
/* Phase 4 cleanup (2026-05-23): #gnav-notifications.urgent + notifBadgePulse +
   .gnav-notif-dot rules removed — sidebar item + badge deleted with the
   /notifications page. notifIconPulse keyframes retained above for any other consumer. */

/* Project group */
.proj-group{margin-bottom:2px;}
.proj-header{display:flex;align-items:center;justify-content:space-between;padding:6px 10px;border-radius:8px;cursor:pointer;transition:all .12s;border:none;position:relative;}
.proj-header:hover{background:rgba(var(--accent-rgb),.06);}
.proj-header.active-group{background:rgba(var(--accent-rgb),.1);border-radius:8px 8px 0 0;}
.proj-header-left{display:flex;align-items:center;gap: 6px;min-width:0;}

.proj-name-wrap{min-width:0;}
.proj-name{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:rgba(255,255,255,.95);}
.proj-meta{font-family:'JetBrains Mono',monospace;font-size:9px;color:rgba(255,255,255,.5);}
.proj-header-right{display:flex;align-items:center;gap: 4px;flex-shrink:0;}
.proj-badge{font-family:'JetBrains Mono',monospace;font-size:9px;padding:2px 6px;border-radius:10px;background:rgba(255,255,255,.12);color:rgba(255,255,255,.7);}
.proj-badge.warn{background:rgba(239,68,68,.15);color:#FCA5A5;}
.proj-chevron{font-size:10px;color:rgba(255,255,255,.45);transition:transform .2s,color .12s;border-radius:4px;}
.proj-chevron:hover{color:rgba(255,255,255,.6);}
.proj-chevron.open{transform:rotate(90deg);color:rgba(255,255,255,.5);}
.proj-actions{display:flex;gap: 2px;margin-left:2px;}
.proj-action-btn{width:20px;height:20px;border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:10px;cursor:pointer;background:transparent;border:none;transition:all .12s;opacity:0;color:rgba(255,255,255,.4);}
.proj-header:hover .proj-action-btn{opacity:1;}
.proj-action-btn:hover{color:#FFF;background:rgba(255,255,255,.1);}

/* Well sub-items */
.well-list{overflow:hidden;max-height:0;transition:max-height .25s ease;}
.well-list.open{max-height:2000px;overflow-y:auto;background:transparent;border-radius:0;margin:0;padding:0 0 4px;}
.well-item{display:flex;align-items:center;justify-content:space-between;padding:4px 10px 4px 32px;border-radius:6px;cursor:pointer;transition:background .1s;margin:0 4px;}
.well-item:hover{background:rgba(var(--accent-rgb),.06);}
.well-item.active{background:rgba(var(--accent-rgb),.1);}
.well-left{display:flex;align-items:center;gap: 6px;}
.well-pip{width:6px;height:6px;border-radius:50%;}
.well-name{font-size:11.5px;color:rgba(255,255,255,.75);font-weight:400;}
.well-item.active .well-name{color:#FFF;font-weight:500;}
.well-count{font-family:'JetBrains Mono',monospace;font-size:9px;color:rgba(255,255,255,.5);}

/* County sub-folders within well lists */
.well-county-group{margin:0;}
.well-county-hdr{display:flex;align-items:center;gap:4px;padding:4px 10px 2px 12px;cursor:pointer;user-select:none;transition:background .12s;}
.well-county-hdr:hover{background:rgba(var(--accent-rgb),.05);}
.well-county-chevron{color:var(--dim);font-size:8px;transition:transform .2s;display:inline-flex;align-items:center;width:8px;flex-shrink:0;}
.well-county-chevron.open{transform:rotate(90deg);}
.well-county-name{font-size:9px;font-weight:700;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-family:'JetBrains Mono',monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;}
.well-county-badge{font-size:8px;color:var(--dim);font-family:'JetBrains Mono',monospace;flex-shrink:0;}
.well-county-group .well-item{padding-left:28px;}

/* Project Areas section */
.sb-proj-area{background:#10131a;padding:8px;flex:1;min-height:0;overflow-y:auto;border-radius:8px;margin:0 8px 8px;border:1px solid rgba(255,255,255,.05);box-shadow:inset 0 1px 4px rgba(0,0,0,.3);}
.sb-proj-area .proj-name{color:rgba(255,255,255,.95);}
.sb-proj-area .proj-meta{color:rgba(255,255,255,.5);}
.sb-proj-area .well-name{color:rgba(255,255,255,.75) !important;}
.sb-proj-area .well-count{color:rgba(255,255,255,.5) !important;}
.sb-proj-area .well-pip{border:none;}
.sb-proj-area .sb-county-name{color:rgba(255,255,255,.8);}
.sb-proj-area .sb-county-chevron{color:rgba(255,255,255,.45);}
.sb-proj-area .sb-county-badge{background:rgba(255,255,255,.12);color:rgba(255,255,255,.7);}
.sb-proj-area .sb-county-items{border-left-color:rgba(255,255,255,.06);}
/* dt-* tree overrides for dark sidebar */
.sb-proj-area .dt-row{color:var(--text-on-dark);}
.sb-proj-area .dt-row:hover{background:rgba(255,255,255,.04);}
.sb-proj-area .dt-row.active{background:rgba(255,255,255,.08);}
.sb-proj-area .dt-label{color:var(--muted);}
.sb-proj-area .dt-client-label{color:var(--text-on-dark);}
.sb-proj-area .dt-aoi-label{color:var(--text-on-dark);}
.sb-proj-area .dt-county .dt-label{color:#c9cdd2;}
.sb-proj-area .dt-well .dt-label{color:#b8bcc1;}
.sb-proj-area .dt-chevron{color:var(--accent);}
.sb-proj-area .dt-icon{color:var(--muted);}
.sb-proj-area .dt-count{background:rgba(255,255,255,.06);color:var(--muted);}
.sb-proj-area .dt-warn{color:var(--color-red);}
.sb-proj-area .dt-children{border-left-color:rgba(255,255,255,.06);}
.sb-proj-area .dt-empty{color:var(--muted);}
.sb-proj-area .dt-well-dot{border:1px solid rgba(255,255,255,.1);}
.sb-proj-area .dt-edit-btn{background:rgba(255,255,255,.06);color:var(--muted);}
.sb-proj-area .dt-edit-btn:hover{background:rgba(255,255,255,.1);color:var(--text-on-dark);}
.sb-proj-area .dpi-view-btn{display:none;} /* hide View button in sidebar */
.sb-proj-area .dt-sb-active>.dt-row:first-child{background:rgba(var(--brand-og-accent-rgb),.12);box-shadow:inset 2px 0 0 var(--brand-og-accent);}
.sb-proj-area .proj-card{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.06);overflow:hidden;border-radius:8px;}
.sb-proj-area .proj-card-header{background:var(--s1);border-radius:7px 7px 0 0;}
.sb-proj-area .proj-card-header:hover{background:var(--s1);}
.sb-proj-area .proj-card-name{color:#FFFFFF;}
.sb-proj-area .proj-card-meta{color:rgba(255,255,255,.6);}
.sb-proj-area .proj-card .proj-badge{background:rgba(255,255,255,.12);color:rgba(255,255,255,.7);}
.sb-proj-area .proj-card .proj-chevron{color:rgba(255,255,255,.4);}
.sb-proj-area .proj-card .proj-action-btn{background:transparent;border:none;color:rgba(255,255,255,.4);}
.sb-proj-area .proj-card .proj-action-btn:hover{color:#FFF;background:rgba(255,255,255,.1);}
.sb-proj-area .proj-card .well-list{background:rgba(255,255,255,.02);border-top:1px solid rgba(255,255,255,.04);}
.sb-proj-county-label{display:flex;align-items:center;gap: 4px;padding:4px 10px 2px 20px;font-size:9px;font-weight:600;color:rgba(255,255,255,.4);text-transform:uppercase;letter-spacing:.06em;}
.sb-proj-area .proj-card .well-name{color:rgba(255,255,255,.75) !important;}
.sb-proj-area .proj-card .well-count{color:rgba(255,255,255,.5) !important;}
.sb-proj-area .proj-header{background:transparent;border-radius:8px;border:none;padding:6px 10px;}
.sb-proj-area .proj-header:hover{background:rgba(var(--brand-og-accent-rgb),.06);}
.sb-proj-area .proj-header .proj-name{color:rgba(255,255,255,.95);}
.sb-proj-area .proj-header .proj-meta{color:rgba(255,255,255,.5);}
.sb-proj-area .proj-header .proj-chevron{color:rgba(255,255,255,.45);}
.sb-proj-area .proj-header .proj-badge{background:rgba(255,255,255,.12);color:rgba(255,255,255,.7);}
.sb-proj-area .proj-header .proj-action-btn{background:transparent;border:none;color:rgba(255,255,255,.4);}
.sb-proj-area .proj-header.active-group{background:rgba(var(--brand-og-accent-rgb),.09);border-radius:8px 8px 0 0;box-shadow:inset 2px 0 0 var(--brand-og-accent);}
.sb-proj-area .well-list.open{background:transparent;}
.sb-proj-area .well-item:hover{background:rgba(var(--brand-og-accent-rgb),.05);}
.sb-proj-area .well-item.active{background:rgba(var(--brand-og-accent-rgb),.09) !important;box-shadow:inset 2px 0 0 var(--brand-og-accent);}
.sb-proj-area .proj-card .well-item:hover{background:rgba(255,255,255,.04);}
.sb-proj-area .proj-card .well-item.active{background:rgba(255,255,255,.06) !important;}
.sb-proj-label{background:none;color:var(--text-on-dark) !important;padding:8px 4px 6px;margin:0 0 8px -2px;border-radius:0;font-size:9px;width:auto;box-shadow:none;letter-spacing:.1em;border-bottom:1px solid rgba(255,255,255,.06);font-weight:700;}

/* Project cards */
.proj-card{background:rgba(255,255,255,.04);border-radius:8px;border:1px solid rgba(255,255,255,.06);margin-bottom:6px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:box-shadow .15s,border-color .15s;}
.proj-card:last-child{margin-bottom:0;}
.proj-card:hover{box-shadow:0 2px 8px rgba(0,0,0,.3);border-color:rgba(255,255,255,.1);}
.proj-card.proj-card-active{box-shadow:0 2px 8px rgba(0,0,0,.3);border-color:rgba(var(--accent-rgb),.2);}
.proj-card-header{display:flex;align-items:center;cursor:pointer;overflow:hidden;min-height:40px;}
.proj-card-accent{width:3px;align-self:stretch;flex-shrink:0;}
.proj-card-info{flex:1;min-width:0;padding:8px 6px 8px 10px;}
.proj-card-name{font-size:12px;font-weight:600;color:rgba(255,255,255,.95);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.proj-card-meta{font-family:'JetBrains Mono',monospace;font-size:9px;color:rgba(255,255,255,.5);margin-top:2px;}
.proj-card-right{display:flex;align-items:center;gap:4px;padding-right:8px;flex-shrink:0;}
.proj-card .proj-badge{background:rgba(255,255,255,.12);color:rgba(255,255,255,.7);}
.proj-card .proj-badge.warn{background:rgba(239,68,68,.15);color:#FCA5A5;}
.proj-card .proj-action-btn{background:transparent;border:none;color:rgba(255,255,255,.3);opacity:0;width:20px;height:20px;border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:10px;cursor:pointer;transition:all .12s;}
.proj-card-header:hover .proj-action-btn{opacity:1;}
.proj-card .proj-action-btn:hover{color:#FFF;background:rgba(255,255,255,.1);}
.proj-card .proj-chevron{color:rgba(255,255,255,.3);font-size:10px;transition:transform .2s,color .12s;border-radius:4px;padding:2px 4px;cursor:pointer;}
.proj-card .proj-chevron:hover{color:rgba(255,255,255,.6);}
.proj-card .proj-chevron.open{transform:rotate(90deg);}
.proj-card .well-list{background:rgba(255,255,255,.02);border-top:1px solid rgba(255,255,255,.04);}
.proj-card .well-item{padding:4px 10px 4px 20px;margin:0;border-radius:0;}
.proj-card .well-item:hover{background:rgba(255,255,255,.04);}
.proj-card .well-item.active{background:rgba(var(--accent-rgb),.08);}
.proj-card .well-name{color:rgba(255,255,255,.75);}
.proj-card .well-count{color:rgba(255,255,255,.5);}

/* Sidebar county folders */
.sb-county-folder{margin-bottom:2px;}
.sb-county-hdr{display:flex;align-items:center;gap:6px;padding:6px 8px 6px 6px;cursor:pointer;transition:background .1s;user-select:none;border-radius:6px;margin:0 2px;}
.sb-county-hdr:hover{background:rgba(var(--accent-rgb),.06);}
.sb-county-chevron{color:rgba(255,255,255,.45);transition:transform .2s,color .12s;display:flex;align-items:center;flex-shrink:0;width:10px;}
.sb-county-chevron.open{transform:rotate(90deg);color:rgba(255,255,255,.65);}
.sb-county-icon{color:var(--accent);display:flex;align-items:center;flex-shrink:0;}
.sb-county-name{font-size:10px;font-weight:600;color:rgba(255,255,255,.8);flex:1;letter-spacing:.06em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sb-county-badge{font-size:9px;color:rgba(255,255,255,.7);font-family:'JetBrains Mono',monospace;background:rgba(255,255,255,.12);border-radius:10px;padding:2px 6px;flex-shrink:0;}
.sb-county-items{padding-left:8px;border-left:1px solid rgba(255,255,255,.06);margin-left:14px;margin-top:2px;margin-bottom:2px;}
.sb-archived-folder{margin-top:8px;border-top:1px solid rgba(255,255,255,.06);padding-top:6px;}
.sb-archived-folder .sb-county-icon{color:rgba(255,255,255,.2);}
.sb-archived-folder .sb-county-name{color:rgba(255,255,255,.2);}
.sb-unarchive-btn{background:none;border:1px solid rgba(var(--brand-brass-rgb),.25);border-radius:5px;padding:2px 6px;cursor:pointer;color:var(--brand-brass);display:flex;align-items:center;transition:background-color .15s,border-color .15s;}
.sb-unarchive-btn:hover{background:rgba(var(--brand-brass-rgb),.10);border-color:var(--brand-brass);}

/* Sidebar footer */
.sb-footer{padding:0 14px 14px;background:transparent;border-top:1px solid rgba(255,255,255,.06);margin:0;border-radius:0;}
.sb-footer .sb-mini-label{color:rgba(255,255,255,.6);}
.sb-footer .sb-mini-nums{color:rgba(255,255,255,.85);}
.sb-footer .sb-mini-bar-wrap{background:rgba(255,255,255,.06);}
.sb-footer-label{background:none;color:var(--muted) !important;padding:8px 4px 6px;margin:0 0 8px -4px;border-radius:0;font-size:9px;width:auto;box-shadow:none;letter-spacing:.1em;border-bottom:1px solid rgba(255,255,255,.06);font-weight:700;}
.sb-stat-row{display:flex;justify-content:space-between;margin-bottom:6px;}
.sb-stat-label{font-size:11px;color:rgba(255,255,255,.6);}
.sb-stat-val{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--accent);font-weight:600;}
.sb-mini-stat{margin-bottom:10px;}
.sb-mini-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;}
.sb-mini-label{font-size:10px;color:var(--muted);font-weight:500;}
.sb-mini-nums{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--text-on-dark);font-weight:600;}
.sb-mini-bar-wrap{height:4px;background:rgba(255,255,255,.06);border-radius:4px;overflow:hidden;}
.sb-mini-bar{height:100%;border-radius:4px;transition:width .5s ease;width:0%;}
/* #2 Call tracker mini */
.sb-call-mini{display:flex;align-items:center;gap:10px;background:#13161a;border:1px solid rgba(255,255,255,.06);border-radius:6px;padding:8px 10px;margin-bottom:10px;}
.sb-call-mini-num{font-size:20px;font-weight:700;color:var(--text-on-dark);font-family:'JetBrains Mono',monospace;flex-shrink:0;min-width:28px;text-align:center;}
.sb-call-mini-info{flex:1;min-width:0;}
.sb-call-mini-lbl{font-size:9px;color:var(--muted);margin-bottom:4px;}
.sb-call-mini-bar{height:4px;background:rgba(255,255,255,.06);border-radius:2px;overflow:hidden;}
.sb-call-mini-fill{height:100%;border-radius:2px;background:var(--color-green);transition:width .4s ease;}
/* Wave A: removed .sb-call-wrap / .sb-start-call-btn / .sb-call-dropdown plus
   the .sb-call-dropdown .sc-divider / .sc-option-all overrides — the sidebar
   Start Calling dropdown is dead surface (no DOM element creates these classes;
   handlers toggleSbCallMenu + renderSbCallDropdown deleted in this wave). */

/* ── MAIN ── */
.main{overflow-y:auto;height:calc(100vh - 80px);background:var(--s2);}
.view{display:none;padding:22px 26px;}
.view.active{display:block;animation:viewFadeIn .25s cubic-bezier(.2,.9,.3,1);}
@keyframes viewFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* ════════════════════════════════════════════════════════════════
   R3 — MOBILE REBUILD (audit §5.1-5.3)
   Sidebar collapses behind a hamburger at <768px; .app drops to single
   column; sidebar slides in over content with a tap-dismiss backdrop.
   ════════════════════════════════════════════════════════════════ */

/* Hamburger lives in the header at all sizes but only visible <768px */
.hdr-mobile-toggle{display:none;align-items:center;justify-content:center;width:40px;height:40px;background:none;border:none;color:var(--text-on-dark);cursor:pointer;border-radius:6px;margin-right:8px;flex-shrink:0;transition:background .15s;}
.hdr-mobile-toggle:hover{background:rgba(255,255,255,.08);}
.hdr-mobile-toggle:active{background:rgba(255,255,255,.14);}
.sb-mobile-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:399;opacity:0;transition:opacity .2s ease;pointer-events:none;}

@media (max-width: 768px){
  /* Bring the header back at <768px (theme-light.css hides it globally for
     the desktop dark-sidebar layout). Mobile needs the header to host the
     brand mark + hamburger toggle since the sidebar is hidden by default. */
  header{display:flex !important;height:56px;padding:0 12px;}
  .hdr-left{flex:1;min-width:0;}
  .logo-icon img{width:36px !important;height:36px !important;}
  .logo-full,.logo-sub{font-size:14px;}
  .hdr-mobile-toggle{display:inline-flex;}
  /* Single-column app — sidebar overlays content instead of taking a column */
  .app{grid-template-columns:1fr;min-height:calc(100vh - 56px);}
  .main{height:calc(100vh - 56px);}
  .sidebar{position:fixed;top:56px;left:0;width:min(80vw,300px);height:calc(100vh - 56px);transform:translateX(-100%);z-index:400;transition:transform .25s var(--ease-out);box-shadow:none;}
  body.sb-mobile-open .sidebar{transform:translateX(0);box-shadow:8px 0 32px rgba(0,0,0,.25);}
  body.sb-mobile-open .sb-mobile-backdrop{display:block;opacity:1;pointer-events:auto;}
  /* Disable desktop hover-mode behavior at mobile */
  body.sb-hover .sidebar{width:min(80vw,300px);}
  body.sb-hover .sidebar:hover{box-shadow:none;}
  body.sb-collapsed .app{grid-template-columns:1fr;}
  body.sb-collapsed .sidebar{width:min(80vw,300px);}
  /* View padding tighter on mobile */
  .view{padding:16px 14px;}

  /* ─── Project View — owner card-list at <768px (audit §5.1) ─────
     Drop the dense 8-column desktop table; render each row as a card.
     Layout: lead icon column, then name+offer top, well/property mid,
     NRA · status · due meta below. Last-call/pin/phone hidden — low
     signal on a phone. Whole card opens the owner modal (<tr> already
     has data-action="openOwnerModal"). */
  #view-project .tbl-wrap{background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible;max-height:none;}
  #pv-tbl table{display:block;width:100%;border-collapse:separate;border-spacing:0;background:transparent;box-shadow:none;}
  #pv-tbl colgroup,#pv-tbl thead{display:none;}
  #pv-tbl tbody{display:block;}
  #pv-tbl tr{
    display:grid;
    grid-template-columns:18px 1fr auto;
    grid-template-areas:
      "lead name   offer"
      "lead props  props"
      "lead nra    due"
      "lead status status";
    column-gap:10px;
    row-gap:4px;
    padding:12px 14px;
    margin-bottom:8px;
    background:#fff;
    border:1px solid var(--border,#E5E7EB);
    border-radius:10px;
    box-shadow:0 1px 2px rgba(0,0,0,.04);
    cursor:pointer;
    -webkit-tap-highlight-color:rgba(30,58,95,.08);
  }
  #pv-tbl tr.row-pinned{border-color:rgba(var(--brand-og-accent-rgb),.45);box-shadow:0 1px 3px rgba(var(--brand-og-accent-rgb),.18);}
  #pv-tbl tr.row-overdue{border-color:rgba(220,38,38,.35);background:rgba(220,38,38,.02);}
  #pv-tbl tr.row-completed,#pv-tbl tr.row-skip,#pv-tbl tr.row-snoozed{opacity:.55;}
  #pv-tbl tr:nth-child(even){background:#fff;}
  #pv-tbl tr:hover{background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.06);}
  #pv-tbl td{display:block;padding:0;border:0;color:#111827;background:transparent;}
  #pv-tbl td[data-cell="lead"]{grid-area:lead;align-self:start;text-align:left;}
  #pv-tbl td[data-cell="name"]{grid-area:name;min-width:0;}
  #pv-tbl td[data-cell="name"] .td-name{font-size:14px;font-weight:600;line-height:1.3;display:flex;flex-wrap:wrap;align-items:center;gap:4px;}
  #pv-tbl td[data-cell="name"] .td-sub{font-size:11px;color:#6B7280;margin-top:2px;line-height:1.35;}
  #pv-tbl td[data-cell="offer"]{grid-area:offer;align-self:start;text-align:right;font-family:'JetBrains Mono',monospace;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;color:#111827;}
  #pv-tbl td[data-cell="offer"] .offer-val{font-size:14px;}
  #pv-tbl td[data-cell="well"]{grid-area:props;font-size:12px;color:#374151;line-height:1.35;}
  #pv-tbl td[data-cell="well"] span{font-size:12px !important;}
  #pv-tbl td[data-cell="nra"]{grid-area:nra;justify-self:start;display:inline-flex;align-items:center;gap:6px;font-size:11px;color:#6B7280;font-family:'JetBrains Mono',monospace;font-variant-numeric:tabular-nums;}
  #pv-tbl td[data-cell="nra"]::before{content:'NRA';font-family:'Geist Sans',system-ui,sans-serif;font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:#9CA3AF;}
  #pv-tbl td[data-cell="due"]{grid-area:due;justify-self:end;font-size:11px;color:#6B7280;}
  #pv-tbl td[data-cell="status"]{grid-area:status;justify-self:start;margin-top:2px;}
  #pv-tbl td[data-cell="lastcall"],
  #pv-tbl td[data-cell="pin"],
  #pv-tbl td[data-cell="phone"],
  #pv-tbl td[data-cell="project"]{display:none;}
  #pv-tbl .pager{display:flex;flex-wrap:wrap;gap:8px;padding:12px 4px;font-size:12px;}
  #pv-tbl .pager-info{flex:1 1 100%;text-align:center;color:#6B7280;}

  /* ─── Sticky bottom metric bar at <768px (audit §5.1) ──────────
     Detach .pv-hero-metrics from the project hero (which gets
     horizontally cramped at 390px) and pin it to the bottom of the
     viewport as a horizontal scrollable row. Same data, less crowding
     at the top, better one-thumb visibility while scrolling owners. */
  #view-project .pv-hero-metrics{
    position:fixed;
    left:0;right:0;bottom:0;
    z-index:90;
    display:flex;
    align-items:center;
    gap:14px;
    padding:8px 14px calc(8px + env(safe-area-inset-bottom)) 14px;
    background:#fff;
    border-top:1px solid var(--border,#E5E7EB);
    box-shadow:0 -2px 8px rgba(0,0,0,.06);
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  #view-project .pv-hero-metrics::-webkit-scrollbar{display:none;}
  #view-project .pv-metric{flex:0 0 auto;min-width:auto;text-align:center;}
  #view-project .pv-metric-chart{gap:8px;}
  #view-project .pv-metric-val{font-size:14px;}
  #view-project .pv-metric-lbl{font-size:9px;}
  #view-project .pv-metric-divider{height:24px;}
  /* Reserve bottom space so the last card / pager isn't hidden under the bar */
  #view-project{padding-bottom:calc(64px + env(safe-area-inset-bottom));}

  /* ─── Stack filter / table-controls row at <768px (audit §5.1) ──
     The .tbl-top inside #pv-tbl carries inline flex styles in index.html
     (`align-items:center;padding:8px 12px;gap:8px;justify-content:stretch`)
     plus `flex:1` on each of three inner wrapper divs. Inline styles win
     over normal CSS — !important is required to re-flow at mobile.
     Stack each control group on its own line, search input full width. */
  #view-project .tbl-top{flex-wrap:wrap !important;gap:10px !important;padding:12px !important;}
  #view-project .tbl-top > div{flex:1 1 100% !important;justify-content:flex-start !important;}
  #view-project .tbl-top .search-box{flex:1 1 100% !important;max-width:none !important;margin-bottom:0;}
  #view-project .tbl-top .search-box input{flex:1 1 auto;min-width:0;}
  /* County + wells filter pills bar (#pv-tracts-bar): keep horizontal scroll
     for chip rows (already implemented), but allow the .pv-filter-bar wrapper
     to stack vertically so county and wells are on separate lines. */
  #view-project .pv-filter-bar{flex-direction:column;align-items:stretch;gap:8px;}
  #view-project .pv-filter-group{flex-wrap:wrap;}

  /* 2026-05-24: Daily Playbook FAB safe-area clearance removed
     alongside the drawer. */
}
