@import url("./styles/third-eye-tokens.css");

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'Söhne', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  background: var(--bg);
  color: var(--ink);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }

.wrap { max-width: 1120px; margin: 0 auto; padding: 0 32px; }

/* Nav */
.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px 32px;
  max-width: 1120px;
  margin: 0 auto;
}
.brand {
  display: flex;
  align-items: center;
  gap: 11px;
  color: var(--ink);
}
.brand-word {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -0.04em;
  line-height: 1;
  color: var(--ink);
}
.nav-links {
  display: flex;
  align-items: center;
  gap: 20px;
  font-size: 14px;
  color: var(--ink-soft);
}
.nav-main-links {
  display: flex;
  align-items: center;
  gap: 18px;
}
.nav-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px;
  border: 1px solid #c9d0dc;
  border-radius: 12px;
  background: #eaeff6;
}
.nav-auth {
  border-radius: 10px;
  padding: 9px 14px;
  min-height: 38px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.nav-auth-ghost {
  border: 1px solid #c3cad6;
  background: #fbfcfd;
  color: #2c3a52;
}
.nav-auth-ghost:hover {
  border-color: #acb7c9;
  background: #edf1f7;
}
.nav-auth-solid {
  border: 1px solid transparent;
  background: transparent;
  color: #2d3b54;
}
.nav-auth-solid:hover {
  border-color: #b1bbcd;
  background: #d7dfec;
  color: #1c2535;
}
.nav-links a:hover { color: var(--ink); }
.brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 0;
  box-shadow: none;
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20aria-hidden%3D%22true%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22te-tile%22%20x1%3D%222%22%20y1%3D%222%22%20x2%3D%2222%22%20y2%3D%2222%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%230c1220%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23151c2e%22%2F%3E%3C%2FlinearGradient%3E%3CradialGradient%20id%3D%22te-iris%22%20cx%3D%220.38%22%20cy%3D%220.34%22%20r%3D%220.72%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%239cc2ff%22%2F%3E%3Cstop%20offset%3D%220.55%22%20stop-color%3D%22%232f6fed%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%231d4ed8%22%2F%3E%3C%2FradialGradient%3E%3C%2Fdefs%3E%3Crect%20x%3D%221%22%20y%3D%221%22%20width%3D%2222%22%20height%3D%2222%22%20rx%3D%227%22%20fill%3D%22url(%23te-tile)%22%2F%3E%3Crect%20x%3D%221%22%20y%3D%221%22%20width%3D%2222%22%20height%3D%2222%22%20rx%3D%227%22%20stroke%3D%22%23fff%22%20stroke-opacity%3D%220.08%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%224.15%22%20stroke%3D%22%233b82f6%22%20stroke-opacity%3D%220.2%22%20stroke-width%3D%220.6%22%20stroke-dasharray%3D%222%201.5%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222.95%22%20stroke%3D%22%233b82f6%22%20stroke-opacity%3D%220.34%22%20stroke-width%3D%220.55%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228.5%22%20r%3D%220.42%22%20fill%3D%22%233b82f6%22%20fill-opacity%3D%220.72%22%2F%3E%3Ccircle%20cx%3D%2215.03%22%20cy%3D%2213.75%22%20r%3D%220.38%22%20fill%3D%22%233b82f6%22%20fill-opacity%3D%220.48%22%2F%3E%3Ccircle%20cx%3D%228.97%22%20cy%3D%2213.75%22%20r%3D%220.38%22%20fill%3D%22%233b82f6%22%20fill-opacity%3D%220.48%22%2F%3E%3Cpath%20d%3D%22M7.25%2012C7.25%209.35%209.45%207.75%2012%207.75C14.55%207.75%2016.75%209.35%2016.75%2012C16.75%2014.65%2014.55%2016.25%2012%2016.25C9.45%2016.25%207.25%2014.65%207.25%2012Z%22%20fill%3D%22%23f3f6fb%22%20fill-opacity%3D%220.11%22%2F%3E%3Cpath%20d%3D%22M7.25%2012C7.25%209.35%209.45%207.75%2012%207.75C14.55%207.75%2016.75%209.35%2016.75%2012C16.75%2014.65%2014.55%2016.25%2012%2016.25C9.45%2016.25%207.25%2014.65%207.25%2012Z%22%20stroke%3D%22%23e8eef8%22%20stroke-width%3D%221.15%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M8.75%2010.35C10.15%209.15%2013.85%209.15%2015.25%2010.35%22%20stroke%3D%22%23e8eef8%22%20stroke-opacity%3D%220.28%22%20stroke-width%3D%220.55%22%20stroke-linecap%3D%22round%22%20fill%3D%22none%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222.55%22%20fill%3D%22%233b82f6%22%20fill-opacity%3D%220.14%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222.35%22%20fill%3D%22url(%23te-iris)%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222.35%22%20stroke%3D%22%2393c5fd%22%20stroke-opacity%3D%220.38%22%20stroke-width%3D%220.35%22%20fill%3D%22none%22%2F%3E%3Ccircle%20cx%3D%2212.55%22%20cy%3D%2211.45%22%20r%3D%220.58%22%20fill%3D%22%23f3f6fb%22%20fill-opacity%3D%220.52%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.brand-mark svg {
  display: block;
  width: 100%;
  height: 100%;
}
.brand-mark:not(:empty) {
  background: none;
}
.nav-cta {
  background: var(--ink); color: var(--paper);
  padding: 10px 18px; border-radius: 999px;
  font-size: 14px; font-weight: 500;
  transition: transform .15s ease;
}
.nav-links .nav-cta:hover {
  color: var(--paper);
  transform: translateY(-1px);
}
.nav-demo-cta {
  padding: 9px 15px;
  min-height: 36px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 12px -10px rgba(26, 23, 21, 0.7);
}

/* Hero */
.hero { padding: 56px 0 54px; }
.hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 30px;
  align-items: start;
}
.hero-copy {
  padding-top: 8px;
}
.hero-kicker {
  font-size: 14px;
  letter-spacing: 0.1em;
  font-weight: 700;
  color: var(--accent);
  font-family: inherit;
  text-transform: uppercase;
  margin-bottom: 20px;
}
.hero h1 {
  font-size: clamp(40px, 5.5vw, 72px);
  line-height: 1.02;
  letter-spacing: -0.035em;
  font-weight: 500;
  margin: 0 0 28px;
  max-width: 14ch;
}
.hero h1 em {
  font-style: normal;
  color: var(--accent);
  position: relative;
}
.hero-sub {
  font-size: 21px;
  line-height: 1.5;
  color: var(--ink-soft);
  max-width: 42ch;
  margin: 0 0 22px;
}
.hero-positioning {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  max-width: 100%;
  margin: 0 0 6px;
  border: 1px solid #c5cedd;
  border-radius: 999px;
  background: #fbfcfd;
  padding: 8px 12px;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.2;
  box-shadow: 0 8px 18px -16px rgba(26, 23, 21, 0.25);
}
.hero-positioning span,
.hero-positioning strong {
  white-space: nowrap;
}
.hero-positioning strong {
  color: var(--ink);
  font-weight: 700;
}
.hero-positioning span::after {
  content: "→";
  color: var(--accent);
  font-weight: 800;
  margin-left: 12px;
}
.hero-ctas { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.hero-ctas .btn-primary,
.hero-ctas .btn-secondary {
  padding: 10px 18px;
  min-height: 40px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
}
.hero-ctas .btn-primary {
  border: 1px solid #131923;
  box-shadow: 0 8px 18px -14px rgba(26, 23, 21, 0.55);
}
.hero-ctas .btn-secondary {
  border-color: #d5deea;
  background: #fbfcfd;
  color: #1b2331;
}
.hero-ctas .btn-secondary:hover {
  border-color: #93a1ba;
  background: #f2f5f9;
}
.hero-note {
  margin: 14px 0 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink-soft);
}
.hero-proof {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  margin-top: 18px;
}
.hero-proof > div {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 13px;
  color: var(--ink-soft);
  white-space: nowrap;
}
.hero-proof span {
  color: var(--ink);
  font-weight: 600;
}
@media (max-width: 980px) {
  .hero-proof {
    flex-wrap: wrap;
  }
}
@media (max-width: 520px) {
  .hero-positioning {
    display: grid;
    width: 100%;
    border-radius: 8px;
    gap: 4px;
    padding: 10px 12px;
  }
  .hero-positioning span,
  .hero-positioning strong {
    white-space: normal;
  }
  .hero-positioning span::after {
    content: "";
    margin-left: 0;
  }
  .hero-positioning strong::before {
    content: "→";
    color: var(--accent);
    font-weight: 800;
    margin-right: 8px;
  }
}
.hero-showcase {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 12px;
  margin-top: 0;
  max-width: 920px;
}
.hero-layout .hero-showcase {
  max-width: none;
}
.hero-showcase-compact {
  max-width: 860px;
}
.showcase-video-card,
.showcase-phone-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px;
  box-shadow: var(--shadow);
}
.showcase-video-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}
.showcase-video-head span,
.showcase-phone-head {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-faint);
  font-weight: 700;
}
.visual-muted-label {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 12px;
  color: var(--ink-soft);
  background: #f5f7fb;
}
.showcase-video-screen {
  min-height: 150px;
  border-radius: 10px;
  border: 1px solid #ccd2dd;
  background: linear-gradient(140deg, #1c2534 0%, #28354b 45%, #234a8a 160%);
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
}
.showcase-video-screen::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,0.18), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,0.05), transparent 58%);
}
.hero-cinematic {
  grid-template-columns: 1fr;
}
.hero-cinematic .showcase-video-screen {
  min-height: 530px;
  display: block;
}
.cinematic-flow {
  position: absolute;
  inset: 10px 10px 76px 10px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
  z-index: 1;
}
.cinematic-panel {
  border: 1px solid rgba(236, 240, 247, 0.72);
  border-radius: 10px;
  background: rgba(246, 248, 251, 0.9);
  padding: 10px;
  backdrop-filter: blur(2px);
  display: flex;
  flex-direction: column;
  min-height: 0;
  gap: 8px;
  overflow: hidden;
  position: relative;
  z-index: 2;
}
.cinematic-title {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #28354b;
  margin-bottom: 8px;
  font-weight: 700;
}
.cinematic-subline {
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(40, 53, 75, 0.7);
  margin-bottom: 8px;
}
.cinematic-chat-bubble {
  border-radius: 8px;
  padding: 8px;
  font-size: 11px;
  line-height: 1.3;
  white-space: normal;
  overflow-wrap: anywhere;
  max-width: 100%;
}
.cinematic-chat-bubble.bot {
  background: #d8dfeb;
  color: #19212f;
  margin-right: 8px;
}
.chat-stream {
  display: grid;
  gap: 8px;
}
.cinematic-chat-bubble.user {
  background: #d3e6d2;
  color: #1e3521;
  margin: 6px 0 0 8px;
  opacity: 1;
  transform: none;
  animation: none;
}
.cinematic-chat-bubble.bot.soft {
  margin-right: 14px;
  background: rgba(216, 223, 235, 0.7);
  color: rgba(25, 33, 47, 0.86);
  font-size: 11px;
}
.typing-line {
  display: block;
  max-width: none;
  white-space: normal;
  overflow: visible;
  animation: none;
}
.chat-composer {
  margin-top: 8px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 999px;
  padding: 6px 8px;
  background: rgba(8, 8, 8, 0.2);
}
.chat-composer span {
  display: block;
  height: 6px;
  width: 64%;
  border-radius: 999px;
  background: rgba(235, 239, 246, 0.56);
}
.ai-tag-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ai-tag {
  border-radius: 999px;
  border: 1px solid rgba(40, 53, 75, 0.28);
  background: rgba(245, 247, 251, 0.9);
  color: #212b3d;
  font-size: 11px;
  padding: 4px 8px;
  opacity: 1;
  transform: none;
  animation: none;
}
.ai-tag.t1 { animation-delay: 1.1s; }
.ai-tag.t2 { animation-delay: 1.4s; }
.ai-tag.t3 { animation-delay: 1.7s; }
.ai-tag.t4 { animation-delay: 2s; }
.ai-tag.t5 { animation-delay: 2.3s; }
.ai-signal-stack {
  margin-top: 8px;
  display: grid;
  gap: 6px;
}
.ai-signal-stack div {
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 7px;
  padding: 5px 6px;
  background: rgba(255, 255, 255, 0.07);
}
.ai-signal-stack span {
  display: block;
  font-size: 10px;
  color: #2b3950;
  margin-bottom: 4px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.ai-signal-stack i {
  display: block;
  height: 5px;
  border-radius: 999px;
  background: linear-gradient(90deg, #a4c3f5, #e1e7f1);
}
.insight-film-card {
  border-radius: 8px;
  border: 1px solid rgba(40, 53, 75, 0.24);
  background: rgba(250, 251, 253, 0.96);
  color: #1b2331;
  padding: 10px;
  font-size: 13px;
  line-height: 1.35;
  opacity: 1;
  transform: none;
  animation: none;
}
.insight-film-card span {
  display: block;
  margin-top: 8px;
  color: #204581;
}
.insight-action-list {
  margin-top: 8px;
  display: grid;
  gap: 5px;
}
.insight-action-list div {
  border: 1px solid rgba(40, 53, 75, 0.2);
  border-radius: 7px;
  background: rgba(249, 250, 252, 0.95);
  color: #1b2331;
  font-size: 12px;
  line-height: 1.25;
  padding: 6px 7px;
}
.cinematic-flow-line {
  position: absolute;
  top: 50%;
  left: 33.5%;
  width: 14.5%;
  height: 2px;
  background: linear-gradient(90deg, rgba(223, 229, 240, 0.04), rgba(223, 229, 240, 0.26), rgba(223, 229, 240, 0.04));
  transform: translateY(-50%);
  z-index: 1;
  pointer-events: none;
}
.cinematic-flow-line.second { left: 66.7%; }
.cinematic-pulse {
  position: absolute;
  top: calc(50% - 4px);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #d4dceb;
  box-shadow: 0 0 0 6px rgba(212, 220, 235, 0.16);
  opacity: 0;
  animation: pulseMoveFlow 5.2s infinite;
  z-index: 1;
  pointer-events: none;
}
.cinematic-pulse.p1 { left: 33.5%; animation-delay: 0s; }
.cinematic-pulse.p2 { left: 40%; animation-delay: 0.4s; }
.cinematic-pulse.p3 { left: 47%; animation-delay: 0.8s; }
.cinematic-pulse.p4 { left: 66.8%; animation-delay: 2.2s; }
.cinematic-pulse.p5 { left: 73.5%; animation-delay: 2.6s; }
.cinematic-pulse.p6 { left: 80%; animation-delay: 3s; }
@keyframes cinematicReveal {
  0%, 8% { opacity: 0; transform: translateY(8px); }
  14%, 80% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(8px); }
}
@keyframes typingFlow {
  0%, 15% { max-width: 0; }
  28%, 78% { max-width: 44ch; }
  100% { max-width: 0; }
}
@keyframes tagPopFlow {
  0%, 10% { opacity: 0; transform: scale(0.9) translateY(6px); }
  16%, 84% { opacity: 1; transform: scale(1) translateY(0); }
  100% { opacity: 0; transform: scale(0.95) translateY(4px); }
}
@keyframes insightRevealFlow {
  0%, 26% { opacity: 0; transform: translateY(10px); }
  34%, 84% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(8px); }
}
@keyframes pulseMoveFlow {
  0% { opacity: 0; transform: scale(0.82); }
  15% { opacity: 1; transform: scale(1); }
  35% { opacity: 0; transform: scale(0.85); }
  100% { opacity: 0; transform: scale(0.85); }
}
.showcase-film {
  position: absolute;
  inset: 10px 10px 34px 10px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  overflow: hidden;
  z-index: 1;
}
.film-track {
  display: grid;
  grid-template-columns: repeat(3, 100%);
  width: 300%;
  height: 100%;
  animation: filmFlow 12s infinite;
}
.film-scene {
  position: relative;
  display: grid;
  place-items: center;
  padding: 12px;
}
.film-scene:nth-child(1) {
  background: linear-gradient(130deg, rgba(18, 22, 18, 0.56), rgba(54, 74, 56, 0.3));
}
.film-scene:nth-child(2) {
  background: linear-gradient(130deg, rgba(19, 25, 35, 0.58), rgba(43, 61, 92, 0.32));
}
.film-scene:nth-child(3) {
  background: linear-gradient(130deg, rgba(16, 20, 24, 0.6), rgba(45, 64, 81, 0.34));
}
.film-phone {
  width: 120px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.34);
  background: rgba(18, 18, 18, 0.3);
  padding: 10px 8px 8px;
}
.film-phone-top {
  width: 36px;
  height: 4px;
  border-radius: 999px;
  margin: 0 auto 10px;
  background: rgba(255, 255, 255, 0.34);
}
.film-wa {
  height: 16px;
  border-radius: 8px;
  margin-bottom: 7px;
}
.film-wa.bot {
  width: 74%;
  background: #dde3ed;
}
.film-wa.user {
  width: 82%;
  margin-left: auto;
  background: #cfe3cf;
}
.film-wa.short {
  width: 58%;
}
.film-ai-core {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #d3dceb, #3169c3 72%);
  box-shadow: 0 0 0 10px rgba(210, 219, 235, 0.08);
}
.film-chip {
  position: absolute;
  width: 74px;
  height: 22px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.34);
  background: rgba(255, 255, 255, 0.14);
  animation: chipOrbit 4s ease-in-out infinite;
}
.film-chip.chip-a { animation-delay: 0s; }
.film-chip.chip-b { animation-delay: 0.5s; }
.film-chip.chip-c { animation-delay: 1s; }
.film-chip.chip-d { animation-delay: 1.5s; }
.film-dash {
  width: 160px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.08);
  padding: 10px;
}
.film-dash-head {
  height: 10px;
  width: 48%;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.5);
  margin-bottom: 10px;
}
.film-dash-row {
  height: 9px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.2);
  margin-bottom: 8px;
  overflow: hidden;
}
.film-dash-row i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #bac8e0, #dfe6f1);
}
.film-stages {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  z-index: 2;
}
.film-stages span {
  text-align: center;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(234, 238, 245, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 999px;
  padding: 3px 5px;
  background: rgba(8, 8, 8, 0.15);
}
@keyframes filmFlow {
  0%, 24% { transform: translateX(0); }
  33%, 57% { transform: translateX(-33.3333%); }
  66%, 90% { transform: translateX(-66.6666%); }
  100% { transform: translateX(0); }
}
@keyframes chipOrbit {
  0%, 100% { opacity: 0.52; transform: scale(1) translate(var(--tx, 0), var(--ty, 0)); }
  50% { opacity: 0.95; transform: scale(1.06) translate(var(--tx, 0), var(--ty, 0)); }
}
.film-chip.chip-a { --tx: -62px; --ty: -36px; }
.film-chip.chip-b { --tx: 62px; --ty: -20px; }
.film-chip.chip-c { --tx: -54px; --ty: 32px; }
.film-chip.chip-d { --tx: 52px; --ty: 40px; }
.video-loop-frame {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 16px;
  z-index: 1;
  opacity: 0;
  transform: translateY(8px);
  animation: showcaseLoop 9s infinite;
}
.video-loop-frame small {
  display: inline-block;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: #d2dbeb;
  margin-bottom: 7px;
}
.video-loop-frame strong {
  display: block;
  color: #f3f5f9;
  font-size: 18px;
  letter-spacing: -0.015em;
  margin-bottom: 6px;
}
.video-loop-frame p {
  margin: 0;
  color: #d8e0ed;
  font-size: 13px;
  max-width: 34ch;
}
.video-loop-frame.frame-2 {
  animation-delay: 3s;
}
.video-loop-frame.frame-3 {
  animation-delay: 6s;
}
@keyframes showcaseLoop {
  0%, 8% {
    opacity: 0;
    transform: translateY(8px);
  }
  14%, 29% {
    opacity: 1;
    transform: translateY(0);
  }
  35%, 100% {
    opacity: 0;
    transform: translateY(-4px);
  }
}
.showcase-play {
  width: 56px;
  height: 56px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.14);
  color: #f3f5f9;
  display: grid;
  place-items: center;
  font-size: 20px;
  position: relative;
  z-index: 1;
}
.showcase-video-caption {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 28px;
  font-size: 13px;
  color: #e1e7f2;
  z-index: 1;
}
.showcase-video-track {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 12px;
  height: 4px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.25);
  overflow: hidden;
  z-index: 1;
}
.showcase-video-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #e0e6f1;
}
.showcase-video-foot {
  margin-top: 10px;
  color: var(--ink-soft);
  font-size: 13px;
}
.role-strip-wrap {
  padding: 0 0 36px;
}
.role-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.role-strip-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px;
  box-shadow: var(--shadow);
}
.role-strip-card span {
  display: block;
  color: var(--accent);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.role-strip-card strong {
  display: block;
  font-size: 16px;
  line-height: 1.35;
  letter-spacing: -0.01em;
}
.showcase-phone-head {
  margin-bottom: 10px;
}
.showcase-bubble {
  border-radius: 12px;
  padding: 9px 11px;
  font-size: 13px;
  line-height: 1.35;
  margin-bottom: 8px;
}
.showcase-bubble.bot {
  background: #d8dfea;
  color: #19212f;
  margin-right: 18px;
}
.showcase-bubble.user {
  background: #d9ecd8;
  color: #1f3922;
  margin-left: 18px;
}
.btn-primary {
  background: var(--ink); color: var(--paper);
  padding: 14px 24px; border-radius: 999px;
  font-size: 16px; font-weight: 500;
  display: inline-flex; align-items: center; gap: 8px;
  transition: transform .15s ease;
}
.btn-primary:hover { transform: translateY(-1px); }
.btn-secondary {
  background: transparent; color: var(--ink);
  padding: 14px 24px; border-radius: 999px;
  font-size: 16px; font-weight: 500;
  border: 1px solid var(--ink);
}

/* Product flow */
.product-flow {
  padding-top: 24px;
}
.flow-grid {
  display: grid;
  grid-template-columns: minmax(380px, 0.84fr) minmax(0, 1.4fr);
  gap: 64px;
  align-items: start;
}
.flow-demo {
  display: grid;
  grid-template-columns: minmax(240px, 0.95fr) auto minmax(300px, 1.05fr);
  gap: 16px;
  align-items: start;
  margin-left: 18px;
}
.flow-personas {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}
.flow-persona {
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink-soft);
  border-radius: 999px;
  padding: 8px 12px;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.flow-persona:hover {
  border-color: var(--ink);
  color: var(--ink);
}
.flow-persona.active,
.flow-persona.active:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}
.phone-frame,
.brief-frame,
.workspace-preview {
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}
.phone-frame {
  border-radius: 24px;
  padding: 16px;
  min-height: 300px;
}
.phone-head,
.brief-head {
  color: var(--ink-faint);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 14px;
}
.wa-bubble {
  border-radius: 14px;
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.35;
  margin-bottom: 8px;
}
.wa-bubble.bot {
  background: #dee3ec;
  color: var(--ink);
  margin-right: 24px;
}
.wa-bubble.user {
  background: #dcefdc;
  color: #223c24;
  margin-left: 24px;
}
.flow-arrow {
  color: var(--accent);
  font-size: 24px;
  font-weight: 700;
}
.brief-frame {
  border-radius: 8px;
  padding: 18px;
  min-height: 300px;
}
.brief-signal {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  font-size: 14px;
  margin-bottom: 8px;
}
.brief-signal span {
  display: block;
  color: var(--ink-faint);
  font-size: 12px;
  margin-top: 3px;
}
.brief-signal .brief-signal-action {
  color: var(--accent);
  font-weight: 600;
}
.brief-signal.critical {
  border-color: rgba(47, 111, 237, 0.35);
  background: #f7f8fb;
}

/* Product tour */
.product-journey {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 28px;
}
.journey-card,
.role-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 20px;
}
.journey-step {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: var(--accent);
  color: var(--paper);
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 18px;
}
.journey-card h3,
.role-card h3 {
  margin: 0 0 10px;
  font-size: 21px;
  line-height: 1.2;
}
.journey-card p,
.role-card p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.55;
}
.role-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 28px;
}
.role-card span {
  display: inline-block;
  color: var(--accent);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  margin-bottom: 16px;
}
.role-example {
  margin-top: 18px;
  border-left: 3px solid var(--accent);
  background: var(--bg);
  padding: 12px 14px;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.45;
}

/* Manager console page */
.console-surface {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  overflow: hidden;
  margin-top: 28px;
}
.console-topline {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-start;
  padding: 22px;
  border-bottom: 1px solid var(--line);
}
.console-topline span,
.panel-heading span {
  display: block;
  color: var(--accent);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  margin-bottom: 8px;
}
.console-topline h3 {
  margin: 0 0 6px;
  font-size: 32px;
  line-height: 1.1;
}
.console-topline p {
  margin: 0;
  color: var(--ink-soft);
}
.console-topline a {
  border: 1px solid var(--ink);
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 600;
  white-space: nowrap;
}
.console-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--line);
}
.console-kpis div {
  background: var(--paper);
  padding: 18px 22px;
  color: var(--ink-soft);
}
.console-kpis span {
  display: block;
  color: var(--ink);
  font-size: 34px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 6px;
}
.console-brief-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  padding: 18px;
}
.console-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  background: var(--bg);
}
.console-card h4 {
  margin: 10px 0;
  font-size: 22px;
  line-height: 1.2;
}
.console-card p {
  margin: 0;
  color: var(--ink-soft);
}
.manager-decision-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 14px;
  margin-top: 28px;
}
.manager-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
}
.panel-heading {
  margin-bottom: 16px;
}
.panel-heading strong {
  font-size: 22px;
}
.manager-action {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  border-top: 1px solid var(--line-soft);
}
.manager-action p {
  margin: 4px 0 0;
  color: var(--ink-soft);
}
.manager-action > span {
  flex: 0 0 150px;
  text-align: right;
  color: var(--accent);
  font-size: 13px;
  font-weight: 700;
}
.site-row {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) 86px;
  gap: 12px;
  align-items: center;
  padding: 14px 0;
  border-top: 1px solid var(--line-soft);
}
.site-row span {
  font-weight: 600;
}
.site-row div {
  height: 9px;
  border-radius: 999px;
  background: var(--bg);
  overflow: hidden;
}
.site-row i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}
.site-row b {
  font-size: 13px;
  color: var(--ink-soft);
  text-align: right;
}
.evidence-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 28px;
}
.evidence-grid blockquote {
  margin: 0;
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  border-radius: 8px;
  padding: 18px;
  color: var(--ink);
  line-height: 1.5;
}
.evidence-grid span {
  display: block;
  color: var(--ink-faint);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  margin-bottom: 12px;
}

/* Problem section */
.section { padding: 96px 0; border-top: 1px solid var(--line); }
.section-dark {
  background: #0a1020;
  color: #e8eef8;
  border-top: none;
}
.section-dark .section-label { color: #5eead4; }
.section-dark .section-lead { color: #b9c6dc; }
.section-dark h2 { color: #f4f8ff; }
.section-label {
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 12px;
  color: var(--ink-faint);
  margin-bottom: 24px;
  font-weight: 500;
}
.section h2 {
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.1;
  letter-spacing: -0.025em;
  font-weight: 500;
  margin: 0 0 24px;
  max-width: 22ch;
}
.section-lead {
  font-size: 19px;
  color: var(--ink-soft);
  max-width: 64ch;
  margin: 0 0 48px;
}

.problem-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.pain-kpis {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 0 0 12px;
}
.pain-kpis > div {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
}
.pain-kpis span {
  display: block;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-faint);
}
.pain-kpis strong {
  display: block;
  margin-top: 6px;
  font-size: 21px;
  letter-spacing: -0.01em;
}
.pain-simple-visual {
  margin-top: 10px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 14px;
}
.pain-stack {
  border: 1px solid #cbd3df;
  border-radius: 12px;
  background: linear-gradient(180deg, #fffdfa 0%, #f0f3f8 100%);
  padding: 12px;
  display: grid;
  gap: 9px;
  box-shadow: 0 12px 24px -22px rgba(16, 22, 31, 0.45);
}
.pain-chip {
  border: 1px solid #c5cddc;
  border-radius: 9px;
  background: #ecf0f6;
  padding: 9px 10px 9px 32px;
  font-size: 14px;
  color: #28344a;
  position: relative;
}
.pain-chip::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 50%;
  width: 10px;
  height: 10px;
  transform: translateY(-50%);
  border-radius: 999px;
  background: #2a5eb1;
  box-shadow: 0 0 0 3px rgba(42, 94, 177, 0.16);
}
.pain-stack-focus {
  border-color: #89abe1;
  background: linear-gradient(180deg, #f4f6fa 0%, #ecf0f6 100%);
}
.pain-stack-focus .pain-chip {
  background: #fbfcfd;
}
.pain-stack-focus .pain-chip::before {
  background: #2f6f48;
  box-shadow: 0 0 0 3px rgba(47, 111, 72, 0.16);
}
.pain-arrow {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid #b9d3f5;
  background: #e8f0ff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 700;
  color: #2f6fed;
  box-shadow: 0 8px 18px -14px rgba(47, 111, 237, 0.6);
}
.pain-simple-metrics {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.pain-mini {
  border: 1px solid #c9d0dd;
  border-radius: 10px;
  background: linear-gradient(180deg, #fbfcfd 0%, #eff2f8 100%);
  padding: 10px 12px;
  box-shadow: 0 8px 16px -14px rgba(16, 22, 31, 0.35);
}
.pain-mini span {
  display: block;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-faint);
}
.pain-mini strong {
  display: block;
  margin-top: 6px;
  font-size: 22px;
  letter-spacing: -0.01em;
}
.pain-simple-metrics .pain-mini:nth-child(1) strong {
  color: #8d2d2d;
}
.pain-simple-metrics .pain-mini:nth-child(2) strong {
  color: #273f68;
}
.pain-simple-metrics .pain-mini:nth-child(3) strong {
  color: #244d8e;
}
.pain-fragments {
  display: grid;
  grid-template-columns: 1fr auto 0.9fr;
  gap: 10px;
  margin: 0 0 12px;
  align-items: center;
}
.fragment-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
.fragment {
  background: #e4e9f0;
  border: 1px solid #c6ceda;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 13px;
  color: #273348;
}
.fragment .mini {
  margin-top: 4px;
  font-size: 11px;
  color: #697180;
}
.fragment-arrow {
  color: var(--accent);
  font-weight: 700;
  font-size: 22px;
}
.operating-view-card {
  border: 1px solid #b8c3d4;
  border-radius: 10px;
  padding: 10px;
  background: #f6f8fb;
}
.operating-view-card span {
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  font-size: 10px;
  color: #2a5baa;
  font-weight: 700;
  margin-bottom: 8px;
}
.operating-view-card div {
  border: 1px solid #ccd5e4;
  border-radius: 7px;
  padding: 7px 8px;
  font-size: 13px;
  color: #242f42;
  margin-bottom: 6px;
}
.operating-view-card div:last-child {
  margin-bottom: 0;
}
.problem-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 22px;
}
.problem-card h3 {
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-faint);
  margin: 0 0 10px;
}
.problem-card p {
  margin: 0;
  color: var(--ink);
  font-size: 17px;
  line-height: 1.5;
}
.problem-grid-visual .problem-card p {
  font-size: 16px;
}
.problem-meter {
  margin-top: 12px;
  height: 8px;
  border-radius: 999px;
  background: #dae0ea;
  overflow: hidden;
}
.problem-meter i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #1d5ad6, #93c5fd);
}
.problem-meter.warn i {
  background: linear-gradient(90deg, #68707f, #9fa6b2);
}
.signal-radar {
  margin-top: 18px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
}
.radar-head {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--accent);
  font-weight: 700;
  margin-bottom: 2px;
}
.radar-row {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr) 74px;
  align-items: center;
  gap: 12px;
  padding: 9px 0;
  border-top: 1px solid var(--line-soft);
}
.radar-row:first-child {
  border-top: none;
}
.radar-row span {
  font-size: 13px;
  color: var(--ink-soft);
  font-weight: 600;
}
.radar-row div {
  height: 8px;
  border-radius: 999px;
  background: #dadfe9;
  overflow: hidden;
}
.radar-row i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #1d5ad6, #93c5fd);
}
.radar-row b {
  text-align: right;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-faint);
}

/* Problem quote */
.quote-card {
  background: var(--paper);
  border: 1px solid var(--line);
  padding: 40px 44px;
  border-radius: 4px;
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: -0.012em;
  color: var(--ink);
  max-width: 720px;
  position: relative;
}
.quote-card::before {
  content: "";
  position: absolute; left: -1px; top: 24px; bottom: 24px; width: 3px;
  background: var(--accent);
}

/* How it works */
.how-visual-flow {
  margin-top: 22px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 60px minmax(0, 1fr) 60px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
}
.how-node {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px;
  box-shadow: var(--shadow);
}
.how-node-order {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: var(--ink);
  color: var(--paper);
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 12px;
}
.how-card {
  min-height: 120px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: linear-gradient(180deg, #fafbfd 0%, #e9edf5 100%);
  padding: 12px;
  position: relative;
  overflow: hidden;
}
.how-node h3 {
  margin: 12px 0 0;
  font-size: 17px;
  letter-spacing: -0.01em;
  text-transform: capitalize;
}
.how-node-note {
  margin: 8px 0 0;
  font-size: 14px;
  line-height: 1.35;
  color: var(--ink-soft);
}
.how-link {
  height: 2px;
  background: linear-gradient(90deg, rgba(47, 111, 237, 0.2), rgba(47, 111, 237, 0.86), rgba(47, 111, 237, 0.2));
  position: relative;
}
.how-link::after {
  content: "";
  position: absolute;
  right: -1px;
  top: 50%;
  transform: translateY(-50%);
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 7px solid rgba(47, 111, 237, 0.82);
}
.how-card-chat {
  display: grid;
  gap: 8px;
}
.chat-top {
  display: flex;
  gap: 4px;
  margin-bottom: 4px;
}
.chat-top i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #acb6c7;
  display: block;
}
.how-card-chat .bubble {
  height: 18px;
  border-radius: 9px;
}
.how-card-chat .bubble.bot {
  width: 78%;
  background: #d7dde7;
}
.how-card-chat .bubble.user {
  width: 84%;
  margin-left: auto;
  background: #d2e7d2;
}
.how-card-chat .bubble.short {
  width: 62%;
}
.how-card-chat .bubble.tiny {
  width: 56%;
  height: 14px;
}
.how-card-ai {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-content: center;
  position: relative;
}
.how-card-ai .ai-core {
  position: absolute;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #98baf2, #2a5fb4);
  top: calc(50% - 13px);
  left: calc(50% - 13px);
  box-shadow: 0 0 0 8px rgba(42, 95, 180, 0.14);
}
.how-card-ai span {
  display: block;
  height: 22px;
  border-radius: 999px;
  border: 1px solid #bbc5d5;
  background: #fff;
}
.how-card-ai span:last-child {
  grid-column: span 2;
  width: 65%;
}
.how-card-action {
  display: grid;
  gap: 8px;
}
.how-card-action div {
  height: 26px;
  border-radius: 8px;
  border: 1px solid #bbc5d5;
  background: #fff;
  position: relative;
}
.how-card-action div i {
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2f6fed;
}

/* Differentiation row */
.compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border: 1px solid #c8cfdb;
  border-radius: 10px;
  background: var(--paper);
  overflow: hidden;
  margin-top: 24px;
  box-shadow: 0 14px 36px -28px rgba(26, 23, 21, 0.4);
}
.compare > div { padding: 36px 36px; }
.compare > div:first-child {
  background: linear-gradient(180deg, #e5eaf1 0%, #dce1ea 100%);
  border-right: 1px solid #c8cfdb;
}
.compare > div:last-child {
  background: linear-gradient(180deg, #f5f7fa 0%, #edf1f7 52%, #e2e8f2 100%);
  position: relative;
  box-shadow: inset 0 0 0 1px rgba(47, 111, 237, 0.2), inset 0 22px 34px -30px rgba(47, 111, 237, 0.3);
}
.compare > div:last-child::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 6px;
  background: linear-gradient(180deg, #1d5ad6 0%, #60a5fa 100%);
}
.compare h4 {
  font-size: 13px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--ink-faint);
  margin: 0 0 14px;
}
.compare h3 {
  font-size: 24px;
  letter-spacing: -0.015em;
  margin: 0 0 16px;
  font-weight: 500;
}
.compare > div:last-child h3 {
  color: #162339;
  font-weight: 600;
}
.compare > div:last-child h4 {
  color: #27549d;
  font-weight: 700;
}
.compare p { color: var(--ink-soft); margin: 0; }
.compare-points {
  display: grid;
  gap: 8px;
  margin-top: 16px;
}
.compare-points > div {
  display: grid;
  grid-template-columns: 20px 1fr;
  align-items: start;
  gap: 8px;
  border: 1px solid #d5deea;
  border-radius: 8px;
  padding: 9px 10px;
  background: rgba(255, 255, 255, 0.7);
  color: #1c2638;
  font-size: 14px;
  line-height: 1.35;
}
.compare-points > div span {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}
.compare-points-negative > div span {
  background: rgba(61, 75, 99, 0.12);
  color: #3d4b63;
}
.compare-points-negative > div {
  opacity: 0.9;
}
.compare-points-positive > div {
  border-color: rgba(47, 111, 237, 0.42);
  background: rgba(249, 251, 253, 0.98);
  box-shadow: 0 6px 14px -16px rgba(47, 111, 237, 0.58);
}
.compare-points-positive > div span {
  background: rgba(47, 111, 237, 0.22);
  color: #1d5ad6;
}

.insight-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
.insight-item {
  background: #ffffff;
  border: 1px solid #d5deea;
  border-radius: 10px;
  padding: 16px 18px;
  position: relative;
  box-shadow: 0 14px 26px -24px rgba(16, 21, 30, 0.55);
}
.insight-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  border-radius: 10px 0 0 10px;
  background: #2f6fed;
}
.insight-item p {
  margin: 10px 0 0;
  color: var(--ink);
  line-height: 1.4;
}
.insight-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #d3e2fb;
  border-radius: 999px;
  background: #e8f0ff;
  padding: 4px 9px;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
  font-family: inherit;
  font-weight: 700;
}
.insight-tag::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.7;
}
.insight-meta {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.insight-meta span {
  font-size: 11px;
  color: #535a67;
  border: 1px solid #ccd4e0;
  border-radius: 999px;
  background: #fafbfd;
  padding: 3px 8px;
}
.insight-item-risk::before,
.insight-item-customer::before {
  background: #2f6fed;
}
.insight-item-ops::before,
.insight-item-location::before {
  background: #8d5c1d;
}
.insight-item-training::before,
.insight-item-sentiment::before {
  background: #2f6f48;
}

.workspace-preview {
  display: grid;
  grid-template-columns: 220px 1fr;
  border-radius: 8px;
  overflow: hidden;
}
.preview-sidebar {
  background: #121720;
  color: #e7ecf4;
  padding: 18px;
}
.preview-nav {
  width: 100%;
  display: block;
  background: transparent;
  border: 1px solid #273348;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 14px;
  margin-bottom: 8px;
  color: #c0c9d8;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}
.preview-nav.active {
  background: var(--accent);
  color: #f3f5f9;
  border-color: var(--accent);
}
.preview-nav:hover {
  border-color: rgba(231, 236, 244, 0.5);
  color: #f3f5f9;
}
.preview-main {
  padding: 22px;
  min-height: 310px;
}
.preview-top {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 16px;
}
.preview-top.compact {
  margin-bottom: 18px;
}
.preview-top h3 {
  margin: 0;
  font-size: 30px;
  line-height: 1.1;
}
.preview-pill {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  color: var(--ink-soft);
  font-size: 13px;
}
.preview-kpis {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 12px;
}
.preview-kpis div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  color: var(--ink-soft);
  font-size: 13px;
}
.preview-kpis span {
  display: block;
  color: var(--ink);
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 6px;
}
.preview-insight {
  border-left: 3px solid var(--accent);
  background: var(--bg);
  padding: 14px 16px;
  color: var(--ink-soft);
}
.preview-feed {
  display: grid;
  gap: 10px;
}
.preview-feed-item {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px;
  color: var(--ink);
  background: var(--paper);
}
.preview-feed-item span {
  display: block;
  margin-bottom: 6px;
  color: var(--ink-faint);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.preview-chatline {
  max-width: 72%;
  border-radius: 14px;
  padding: 13px 15px;
  line-height: 1.45;
  margin-bottom: 12px;
}
.preview-chatline.user {
  margin-left: auto;
  background: var(--ink);
  color: var(--paper);
  border-bottom-right-radius: 4px;
}
.preview-chatline.agent {
  background: var(--bg);
  border-left: 3px solid var(--accent);
  color: var(--ink);
  border-bottom-left-radius: 4px;
}
.preview-chatline span {
  display: block;
  margin-top: 10px;
  color: var(--ink-faint);
  font-size: 12px;
}
.preview-training-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.preview-training-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  color: var(--ink);
  min-height: 104px;
}
.preview-training-card span {
  display: block;
  color: var(--accent);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  margin-bottom: 10px;
}

/* Built for */
.audience {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 48px;
  row-gap: 16px;
  margin-top: 24px;
}
.aud-row {
  display: grid;
  grid-template-columns: minmax(120px, auto) minmax(0, 1fr);
  align-items: baseline;
  column-gap: 22px;
  padding: 18px 0;
  border-bottom: 1px solid var(--line-soft);
}
.aud-tag {
  font-family: inherit;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
  white-space: nowrap;
}
.aud-text { color: var(--ink); font-size: 17px; }
.audience-leader-grid {
  margin-top: 30px;
  row-gap: 14px;
}
.aud-leader-row {
  grid-template-columns: 1fr;
  row-gap: 12px;
  border: 1px solid #cbd2dd;
  border-radius: 10px;
  background: linear-gradient(180deg, #fffdfa 0%, #eff2f8 100%);
  padding: 18px 18px 16px;
  box-shadow: 0 12px 28px -26px rgba(26, 23, 21, 0.46);
}
.aud-leader-row .aud-tag {
  font-size: 12px;
  letter-spacing: 0.1em;
}
.aud-leader-row .aud-text {
  font-size: 26px;
  line-height: 1.45;
  color: #1a222f;
  letter-spacing: -0.01em;
}
.audience-tiles {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 26px;
}
.audience-tiles > div {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 16px;
}
.audience-tiles span {
  display: block;
  color: var(--accent);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  margin-bottom: 10px;
}
.audience-tiles strong {
  display: block;
  font-size: 18px;
  letter-spacing: -0.015em;
  line-height: 1.3;
}
.audience-usecases-block {
  margin-top: 34px;
}
.sector-chips {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}
.sector-chips > div {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 10px 12px;
  text-align: center;
  font-size: 14px;
  color: var(--ink-soft);
  background: var(--paper);
}

.pilot-points {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.pilot-layout {
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: 24px;
  align-items: start;
}
.pilot-copy {
  min-width: 0;
}
.pilot-points-shell {
  border: 1px solid rgba(148, 178, 230, 0.2);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.015));
  padding: 16px;
  box-shadow: 0 18px 36px -30px rgba(0, 0, 0, 0.85);
}
.pilot-points-head {
  margin: 0 0 12px;
  padding: 0 2px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.13em;
  color: #8fa6c8;
  font-weight: 600;
}
.pilot-point-card {
  border: 1px solid rgba(148, 178, 230, 0.26);
  border-radius: 10px;
  padding: 13px 14px;
  color: #e8eef8;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.01));
  box-shadow: 0 10px 24px -22px rgba(0, 0, 0, 0.82);
}
.pilot-point-index {
  width: max-content;
  border: 1px solid rgba(45, 212, 191, 0.5);
  border-radius: 999px;
  background: rgba(45, 212, 191, 0.12);
  color: #5eead4;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
}
.pilot-point-card h3 {
  margin: 8px 0 6px;
  font-size: 20px;
  line-height: 1.15;
  letter-spacing: -0.015em;
  font-weight: 500;
  color: #f4f8ff;
}
.pilot-point-card p {
  margin: 0;
  font-size: 14px;
  line-height: 1.35;
  color: #b9c6dc;
}
.pilot-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.pilot-meta span {
  border: 1px solid rgba(148, 178, 230, 0.3);
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 500;
  color: #d6e2f5;
  background: rgba(255, 255, 255, 0.03);
}
.pilot-fit-note {
  margin: 14px 0 0;
  color: #b9c6dc;
  font-size: 14px;
  line-height: 1.45;
  max-width: 68ch;
}
.pilot-fit-note strong {
  color: #f4f8ff;
  font-weight: 600;
}

.waitlist-wrap {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 24px;
  align-items: start;
}
.waitlist-copy .section-lead {
  margin-bottom: 20px;
}
.waitlist-benefits {
  display: grid;
  gap: 8px;
}
.waitlist-benefits > div {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--paper);
  font-size: 14px;
  color: var(--ink-soft);
}
.waitlist-benefits span {
  display: inline-block;
  margin-right: 8px;
  color: var(--accent);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.waitlist-form {
  background: var(--paper);
  border: 1px solid #c8cfdb;
  border-radius: 12px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: 0 16px 28px -24px rgba(26, 23, 21, 0.45);
}
.waitlist-form-head {
  margin-bottom: 6px;
}
.waitlist-form-head strong {
  display: block;
  font-size: 18px;
  letter-spacing: -0.01em;
}
.waitlist-form-head span {
  display: block;
  margin-top: 4px;
  font-size: 13px;
  color: var(--ink-faint);
}
.waitlist-form label {
  font-size: 12px;
  color: var(--ink-faint);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.waitlist-form input {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px;
  font-size: 15px;
  font-family: inherit;
  margin-bottom: 10px;
  background: #fffdfa;
}
.waitlist-form .btn-primary {
  width: 100%;
  justify-content: center;
  border: 1px solid #161d29;
  border-radius: 12px;
  padding: 13px 18px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.01em;
  background: linear-gradient(180deg, #1c2535 0%, #10151e 100%);
  box-shadow: 0 12px 24px -18px rgba(12, 16, 22, 0.65);
  cursor: pointer;
  transition: transform .14s ease, box-shadow .14s ease, filter .14s ease, background .14s ease, border-color .14s ease;
}
.waitlist-form .btn-primary:hover:not(:disabled) {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow: 0 14px 28px -18px rgba(12, 16, 22, 0.75);
}
.waitlist-form .btn-primary:disabled {
  cursor: not-allowed;
  opacity: 1;
  border-color: #c4cbd6;
  background: linear-gradient(180deg, #a8aeb8 0%, #8f97a4 100%);
  box-shadow: none;
}
.form-note {
  margin: 2px 0 0;
  color: var(--ink-faint);
  font-size: 13px;
}
.waitlist-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 2px;
}
.waitlist-trust span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 10px;
  background: #f1f4f9;
  color: #4b515b;
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.waitlist-form.submitted {
  border-color: rgba(102, 199, 131, 0.45);
}
.waitlist-form.submitted .form-note {
  color: #2f7d4b;
  font-weight: 600;
}
.waitlist-next-step {
  margin-top: 2px;
  padding: 8px 10px;
  border: 1px solid #c6ccd7;
  border-radius: 8px;
  background: #f2f5f9;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.waitlist-next-step[hidden] {
  display: none !important;
}
.waitlist-next-step p {
  margin: 0;
  font-size: 12px;
  color: #2a374d;
  line-height: 1.35;
}
.waitlist-next-step-action {
  min-height: 34px;
  padding: 7px 12px;
  font-size: 12px;
  white-space: nowrap;
}
@media (max-width: 920px) {
  .waitlist-next-step {
    flex-direction: column;
    align-items: flex-start;
  }
}

.centered-cta {
  text-align: center;
}
.centered-cta h2,
.centered-cta .section-lead {
  margin-left: auto;
  margin-right: auto;
}
.subtle-link {
  border-color: var(--line);
}

/* Footer */
.foot {
  border-top: 1px solid var(--line);
  padding: 40px 0 60px;
  color: var(--ink-faint);
  font-size: 14px;
}
.foot-inner {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}
.foot-links {
  display: flex;
  gap: 14px;
}
.foot-links a { color: var(--ink-faint); }
.foot-links a:hover { color: var(--ink-soft); }

/* ============ DEMO PAGE ============ */
.demo-bar {
  border-bottom: 1px solid var(--line);
  background: var(--bg);
  position: sticky; top: 0; z-index: 10;
}
.demo-bar-inner {
  max-width: 1280px; margin: 0 auto;
  padding: 16px 32px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 24px;
}
.persona-switch {
  display: flex; gap: 4px;
  background: var(--paper);
  border: 1px solid var(--line);
  padding: 4px; border-radius: 999px;
  flex-wrap: wrap;
}
.persona-btn {
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13.5px;
  cursor: pointer;
  border: none; background: transparent;
  color: var(--ink-soft);
  font-family: inherit;
  white-space: nowrap;
}
.persona-btn.active {
  background: var(--ink);
  color: var(--paper);
}
.persona-meta {
  font-size: 13px;
  color: var(--ink-faint);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
}

.demo-grid {
  max-width: 1280px;
  margin: 0 auto;
  padding: 32px;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 24px;
  min-height: calc(100vh - 80px);
}

/* Chat panel */
.chat {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 4px;
  display: flex; flex-direction: column;
  overflow: hidden;
  min-height: 600px;
}
.chat-head {
  padding: 20px 24px;
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 12px;
}
.chat-head-copy {
  min-width: 0;
}
.chat-head .brand-mark { width: 18px; height: 18px; }
.chat-head h3 {
  margin: 0; font-size: 16px; font-weight: 600;
}
.chat-head p {
  margin: 4px 0 0;
  color: var(--ink-soft);
  font-size: 13px;
}
.chat-head .sub {
  font-size: 12px;
  color: var(--ink-faint);
  max-width: 280px;
  text-align: right;
}
.chat-head-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}
.chat-head-actions .chat-clear-btn {
  border: 1px solid #b8c2d4;
  background: #e6ebf4;
  color: #303f5a;
  border-radius: 999px;
  padding: 6px 12px;
  font-family: inherit;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
  white-space: nowrap;
}
.chat-head-actions .chat-clear-btn:hover {
  background: #d5ddec;
  border-color: #97a7c2;
}
.chat-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 24px;
  display: flex; flex-direction: column; gap: 20px;
}
.msg-user, .msg-agent { max-width: 88%; }
.msg-user {
  align-self: flex-end;
  background: var(--ink);
  color: var(--paper);
  padding: 12px 16px;
  border-radius: 14px 14px 2px 14px;
  font-size: 15px;
}
.msg-agent {
  align-self: flex-start;
  font-size: 15px;
  line-height: 1.55;
  width: min(92%, 900px);
}
.msg-agent .agent-label {
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 8px;
  font-weight: 500;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
}
.agent-answer-card {
  border: 1px solid #c9d1de;
  border-radius: 10px;
  background: #fbfcfd;
  padding: 12px;
}
.agent-mode-pill {
  display: inline-flex;
  margin-bottom: 8px;
  border: 1px solid #bfc7d5;
  border-radius: 999px;
  padding: 3px 8px;
  font-size: 11px;
  color: #535b68;
  background: #ebeff6;
}
.agent-paragraph {
  margin: 0 0 10px;
  color: var(--ink);
  line-height: 1.5;
}
.agent-paragraph:last-of-type {
  margin-bottom: 0;
}
.agent-paragraph-secondary {
  color: #49505c;
}
.agent-quote-list {
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}
.agent-quote-list li {
  border: 1px solid #cdd7e7;
  border-radius: 8px;
  background: #fffefb;
  padding: 8px 10px;
}
.agent-quote-meta {
  display: block;
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #606877;
  margin-bottom: 4px;
  font-weight: 600;
}
.agent-quote-body {
  display: block;
  font-size: 13px;
  line-height: 1.45;
  color: #1c2433;
}
.agent-sop-question-list {
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}
.agent-sop-question-list li {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 8px;
  align-items: start;
  border: 1px solid #cdd7e7;
  border-radius: 8px;
  background: #fffefb;
  padding: 8px 10px;
}
.agent-sop-rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #dde4f0;
  color: #20447e;
  font-size: 11px;
  font-weight: 700;
}
.agent-sop-question {
  display: block;
  font-size: 13px;
  line-height: 1.4;
  color: #1c2433;
  margin-bottom: 4px;
}
.agent-sop-meta {
  display: block;
  font-size: 11px;
  line-height: 1.35;
  color: #59606c;
}
.agent-followup-table {
  margin-top: 10px;
  border: 1px solid #cdd7e7;
  border-radius: 10px;
  background: #fffefb;
  overflow: hidden;
}
.agent-followup-table-head,
.agent-followup-row-card {
  display: grid;
  grid-template-columns: 28px 72px minmax(130px, 1.1fr) minmax(110px, 0.95fr) 84px minmax(150px, 1.2fr);
  gap: 8px 10px;
  align-items: center;
}
.agent-followup-table-head {
  padding: 8px 10px;
  border-bottom: 1px solid #cdd7e7;
  background: #e8edf5;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #606877;
}
.agent-followup-target-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.agent-followup-row-card {
  padding: 10px;
  border-bottom: 1px solid #dae1ee;
}
.agent-followup-row-card:last-child {
  border-bottom: 0;
}
.agent-followup-rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #dde4f0;
  color: #20447e;
  font-size: 11px;
  font-weight: 700;
}
.agent-followup-priority {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.agent-followup-priority.is-high {
  background: #e8ecf4;
  color: #1d4d9a;
}
.agent-followup-priority.is-medium {
  background: #dee5f0;
  color: #7a5a1f;
}
.agent-followup-person strong {
  display: block;
  font-size: 13px;
  line-height: 1.3;
  color: #1c2433;
}
.agent-followup-person span {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  color: #59606c;
}
.agent-followup-location,
.agent-followup-manager {
  font-size: 12px;
  line-height: 1.35;
  color: #2e3c55;
}
.agent-followup-action {
  font-size: 12px;
  line-height: 1.4;
  color: #1c2433;
  font-weight: 600;
}
.agent-followup-owner-head {
  padding: 8px 10px 6px;
  border-top: 1px solid #cdd7e7;
  background: #f1f4f9;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #606877;
}
.agent-followup-owner-list {
  margin: 0;
  padding: 8px 10px 10px;
  list-style: none;
  display: grid;
  gap: 8px;
}
.agent-followup-owner-card {
  border: 1px solid #cdd7e7;
  border-radius: 8px;
  background: #f8f9fc;
  padding: 8px 10px;
}
.agent-followup-owner-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.agent-followup-owner-top strong {
  font-size: 12px;
  color: #1c2433;
}
.agent-followup-owner-scope,
.agent-followup-owner-action {
  margin: 4px 0 0;
  font-size: 11px;
  line-height: 1.4;
  color: #49505c;
}
.agent-followup-owner-action {
  font-weight: 600;
  color: #1c2433;
}
@media (max-width: 900px) {
  .agent-followup-table-head {
    display: none;
  }
  .agent-followup-row-card {
    grid-template-columns: 28px 1fr;
    grid-template-areas:
      "rank priority"
      "rank person"
      "rank location"
      "rank manager"
      "rank action";
    align-items: start;
  }
  .agent-followup-rank { grid-area: rank; }
  .agent-followup-priority { grid-area: priority; justify-self: start; }
  .agent-followup-person { grid-area: person; }
  .agent-followup-location { grid-area: location; }
  .agent-followup-manager { grid-area: manager; }
  .agent-followup-manager::before {
    content: "Manager · ";
    font-weight: 600;
    color: #606877;
  }
  .agent-followup-action { grid-area: action; }
  .agent-followup-action::before {
    content: "Next step · ";
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #1c488f;
    margin-bottom: 2px;
  }
}
.agent-inline-kicker {
  color: #234c8f;
  font-weight: 700;
}
.agent-emphasis {
  color: #275db4;
  font-weight: 700;
}
.agent-section {
  margin-bottom: 10px;
}
.agent-section:last-child {
  margin-bottom: 0;
}
.agent-section h4 {
  margin: 0 0 4px;
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-faint);
}
.agent-section p {
  margin: 0;
  color: var(--ink);
}
.agent-action-list {
  margin: 0;
  padding-left: 18px;
  color: var(--ink-soft);
}
.agent-owner-badge {
  display: inline-flex;
  align-items: center;
  margin-bottom: 10px;
  border: 1px solid #bbc4d4;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  color: #4f5764;
  background: #f2f5f9;
}
.agent-locked-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}
.agent-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.agent-cta-btn {
  margin-top: 0;
  border-radius: 7px;
  border-color: #c7cedb;
  background: #fffdfa;
  color: #212b3d;
  padding: 5px 10px;
  min-height: 28px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.85) inset;
}
.agent-cta-btn:hover {
  border-color: #90a1be;
  background: #f2f5f9;
}
.agent-cta-btn:focus-visible {
  outline: none;
  border-color: #3972cd;
  box-shadow: 0 0 0 3px rgba(57, 114, 205, 0.2);
}
.agent-followup-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
}
.chip-followup {
  font-size: 12px;
  padding: 7px 12px;
}
.evidence {
  background: var(--bg);
  border-left: 2px solid var(--accent);
  padding: 10px 14px;
  margin: 6px 0;
  font-size: 13.5px;
  color: var(--ink-soft);
  font-style: italic;
}
.thinking {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--ink-faint);
  font-size: 14px;
  font-style: italic;
}
.thinking .dots {
  display: inline-flex; gap: 3px;
}
.thinking .dots span {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--accent);
  animation: blink 1.2s infinite ease-in-out;
}
.thinking .dots span:nth-child(2) { animation-delay: .15s; }
.thinking .dots span:nth-child(3) { animation-delay: .3s; }
@keyframes blink {
  0%, 60%, 100% { opacity: .25; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-2px); }
}
.fade-in { animation: fadeIn .35s ease both; }
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}
.evidence .src {
  display: block;
  margin-top: 6px;
  font-style: normal;
  font-size: 11px;
  color: var(--ink-faint);
  letter-spacing: 0.04em;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
}

.suggested {
  padding: 8px 14px;
  border-top: 1px solid var(--line);
  background: var(--bg);
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex-shrink: 0;
}
.suggested-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}
.suggested-label {
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-faint);
  white-space: nowrap;
}
.suggested-more-btn {
  display: none;
  border: 1px solid #bac4d5;
  background: #fafbfd;
  color: #464d58;
  border-radius: 999px;
  padding: 4px 10px;
  font: inherit;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}
.suggested-more-btn:hover {
  border-color: #97a5be;
  background: #f1f4f9;
}
.suggested-chips {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: nowrap;
  gap: 6px;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
  padding: 0;
}
.chip {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 11px;
  font-size: 12px;
  flex: 0 0 auto;
  white-space: nowrap;
  cursor: pointer;
  color: var(--ink);
  font-family: inherit;
  transition: all .12s ease;
}
.chip:hover { border-color: var(--accent); color: var(--accent); }

.chat-input {
  display: flex;
  border-top: 1px solid var(--line);
  padding: 9px 12px;
  gap: 8px;
  background: var(--paper);
}
.chat-input input {
  flex: 1;
  border: none;
  background: var(--bg);
  border-radius: 999px;
  padding: 9px 14px;
  font-size: 14px;
  font-family: inherit;
  color: var(--ink);
  outline: none;
}
.chat-input button {
  background: var(--ink); color: var(--paper);
  border: none; border-radius: 999px;
  padding: 0 16px; cursor: pointer;
  font-family: inherit; font-size: 13px;
}
.chat-input .chat-clear-btn {
  background: #dee3ed;
  color: var(--ink-soft);
}
.chat-input .chat-clear-btn:hover {
  background: #ccd4e3;
}
#agentAccessNote {
  display: none !important;
}

/* Side panel */
.side {
  display: flex; flex-direction: column; gap: 20px;
}
.card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 20px;
}
.card h4 {
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-faint);
  margin: 0 0 14px;
  font-weight: 500;
}
.card .question-of-day {
  font-size: 17px;
  line-height: 1.4;
  letter-spacing: -0.012em;
  color: var(--ink);
  margin-bottom: 16px;
}
.responses {
  display: flex; flex-direction: column; gap: 14px;
  max-height: 380px;
  overflow-y: auto;
}
.response {
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink-soft);
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line-soft);
}
.response:last-child { border-bottom: none; padding-bottom: 0; }
.response .who {
  display: block;
  font-size: 11px;
  color: var(--ink-faint);
  margin-bottom: 4px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.response .body { color: var(--ink); }

.stat-row { display: flex; gap: 24px; }
.stat .num {
  font-size: 28px;
  letter-spacing: -0.02em;
  font-weight: 500;
  color: var(--ink);
  display: block;
  line-height: 1;
}
.stat .label {
  font-size: 11px;
  color: var(--ink-faint);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-top: 6px;
  display: block;
}

/* Question library */
.qlib {
  display: flex; flex-wrap: wrap; gap: 6px;
}
.qchip {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 8px 12px;
  font-size: 13px;
  color: var(--ink-soft);
  cursor: pointer;
  font-family: inherit;
}
.qchip.on {
  background: var(--accent);
  color: var(--paper);
  border-color: var(--accent);
}

/* Mobile */
@media (max-width: 880px) {
  .nav-links {
    display: none;
  }
  .hero {
    padding: 40px 0 36px;
  }
  .hero-layout {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .hero h1 {
    max-width: 11ch;
  }
  .flow-grid,
  .flow-demo,
  .workspace-preview {
    grid-template-columns: 1fr;
  }
  .flow-demo {
    margin-left: 0;
  }
  .flow-personas {
    justify-content: flex-start;
  }
  .flow-arrow {
    transform: rotate(90deg);
    justify-self: center;
  }
  .preview-kpis {
    grid-template-columns: 1fr;
  }
  .preview-training-grid {
    grid-template-columns: 1fr;
  }
  .preview-chatline {
    max-width: 100%;
  }
  .hero-showcase {
    grid-template-columns: 1fr;
  }
  .hero-cinematic .showcase-video-screen {
    min-height: 240px;
  }
  .cinematic-flow {
    grid-template-columns: 1fr;
    inset: 10px 10px 54px 10px;
  }
  .cinematic-flow-line,
  .cinematic-pulse {
    display: none;
  }
  .film-stages {
    grid-template-columns: 1fr;
  }
  .role-strip {
    grid-template-columns: 1fr;
  }
  .product-journey,
  .role-grid {
    grid-template-columns: 1fr;
  }
  .console-topline {
    flex-direction: column;
  }
  .console-kpis,
  .console-brief-grid,
  .manager-decision-grid,
  .evidence-grid {
    grid-template-columns: 1fr;
  }
  .manager-action {
    flex-direction: column;
  }
  .manager-action > span {
    flex-basis: auto;
    text-align: left;
  }
  .problem-grid { grid-template-columns: 1fr; }
  .pain-kpis { grid-template-columns: 1fr; }
  .pain-simple-visual {
    grid-template-columns: 1fr;
  }
  .pain-arrow {
    justify-self: center;
    transform: rotate(90deg);
  }
  .pain-simple-metrics {
    grid-template-columns: 1fr;
  }
  .pain-fragments {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .fragment-grid {
    grid-template-columns: 1fr;
  }
  .fragment-arrow {
    display: none;
  }
  .radar-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .radar-row b {
    text-align: left;
  }
  .how-visual-flow {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .how-link {
    width: 2px;
    height: 24px;
    margin: 0 auto;
  }
  .how-link::after {
    right: auto;
    left: 50%;
    top: auto;
    bottom: -1px;
    transform: translateX(-50%);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 7px solid rgba(47, 111, 237, 0.82);
    border-bottom: none;
  }
  .insight-list { grid-template-columns: 1fr; }
  .compare { grid-template-columns: 1fr; }
  .compare > div:first-child { border-right: none; border-bottom: 1px solid var(--line); }
  .audience { grid-template-columns: 1fr; }
  .audience-tiles { grid-template-columns: 1fr; }
  .sector-chips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aud-row {
    grid-template-columns: 1fr;
    row-gap: 8px;
  }
  .pilot-points { grid-template-columns: 1fr; }
  .pilot-layout { grid-template-columns: 1fr; }
  .waitlist-wrap { grid-template-columns: 1fr; }
  .foot-inner { flex-direction: column; align-items: flex-start; }
  .demo-grid { grid-template-columns: 1fr; }
  .demo-bar-inner { flex-direction: column; align-items: flex-start; gap: 12px; }
}

/* ============ WORKSPACE DEMO V2 ============ */
.workspace-app-body,
.demo-workspace-body {
  background: #f3f2ee;
  min-height: 100vh;
}
.workspace-app-body,
.demo-workspace-body {
  --workspace-body-text-size: 13px;
}
.demo-workspace-body .tab-panel p,
.demo-workspace-body .tab-panel li,
.demo-workspace-body .tab-panel .issue-meta,
.demo-workspace-body .tab-panel .preview-lock-banner,
.demo-workspace-body .tab-panel .ops-list li,
.demo-workspace-body .tab-panel .ops-table > div,
.demo-workspace-body .tab-panel .ops-card label,
.demo-workspace-body .tab-panel input,
.demo-workspace-body .tab-panel select,
.demo-workspace-body .tab-panel textarea {
  font-size: var(--workspace-body-text-size);
}
.demo-workspace-body .section-label,
.demo-workspace-body .kpi-label,
.demo-workspace-body .sidebar-pilot-label,
.demo-workspace-body .feed-who,
.demo-workspace-body .agent-label,
.demo-workspace-body .suggested-label,
.demo-workspace-body .demo-auth-form label,
.demo-workspace-body .severity {
  font-family: inherit;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.login-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 12, 10, 0.62);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 50;
  padding: 20px;
}
.login-overlay.hidden {
  display: none;
}

/* Auth modal — landing sign up / log in (Honen-style) */
body.auth-modal-open {
  overflow: hidden;
}

.auth-overlay {
  z-index: 200;
  background: rgba(13, 17, 25, 0.44);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.auth-modal {
  position: relative;
  width: min(420px, 100%);
  padding: 32px 32px 28px;
  border-radius: 20px;
  border: 1px solid rgba(212, 217, 225, 0.95);
  background: #fffefb;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.7) inset,
    0 28px 64px -36px rgba(12, 16, 22, 0.42);
}

.auth-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ink-faint);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.auth-step h2 {
  margin: 0 0 8px;
  font-size: 1.35rem;
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: var(--ink);
}

.auth-sub {
  margin: 0 0 22px;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--ink-soft);
}

.auth-social {
  display: grid;
  gap: 10px;
}

.auth-social-btn,
.auth-email-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: 46px;
  padding: 0 16px;
  border: 1px solid #d4d9e2;
  border-radius: 12px;
  background: #fffefb;
  color: var(--ink);
  font: inherit;
  font-size: 0.9375rem;
  font-weight: 500;
  cursor: pointer;
}

.auth-or {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 18px 0;
  color: var(--ink-faint);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
}

.auth-or::before,
.auth-or::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #d6dce6;
}

.auth-email-form {
  display: grid;
  gap: 10px;
}

.auth-email-form label {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--ink-soft);
}

.auth-email-form input {
  width: 100%;
  padding: 11px 13px;
  border: 1px solid #dadee6;
  border-radius: 10px;
  background: #f5f6f9;
  font: inherit;
  font-size: 0.9375rem;
}

.auth-continue-btn {
  margin-top: 4px;
  width: 100%;
  min-height: 46px;
  border: 0;
  border-radius: 12px;
  background: var(--ink);
  color: #f8f9fc;
  font: inherit;
  font-size: 0.9375rem;
  font-weight: 600;
  cursor: pointer;
}

.auth-continue-btn:disabled {
  opacity: 0.38;
  cursor: not-allowed;
}

.login-overlay-centered {
  align-items: center;
  justify-content: center;
  padding: max(20px, env(safe-area-inset-top, 0px)) 20px max(20px, env(safe-area-inset-bottom, 0px));
}
.login-overlay-centered .login-card {
  margin: auto;
  max-height: min(88dvh, calc(100dvh - 40px));
}

/* Demo gate — minimal premium modal on landing */
.demo-gate-overlay {
  background: rgba(13, 17, 25, 0.42);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 24px;
  animation: demoGateFadeIn 0.22s ease;
}
.demo-gate-overlay.hidden {
  animation: none;
}
@keyframes demoGateFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.demo-gate-card {
  width: min(400px, 100%);
  padding: 32px 32px 28px;
  border-radius: 20px;
  border: 1px solid rgba(212, 217, 225, 0.9);
  background: #fffefb;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.65) inset,
    0 28px 64px -36px rgba(12, 16, 22, 0.38);
  animation: demoGateCardIn 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes demoGateCardIn {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
.demo-gate-card h2 {
  margin: 0 0 8px;
  font-size: 1.35rem;
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: var(--ink);
}
.demo-gate-lead {
  margin: 0 0 22px;
  font-size: 0.9375rem;
  line-height: 1.55;
  font-weight: 400;
  color: var(--ink-soft);
}
.demo-gate-form {
  gap: 14px;
}
.demo-gate-field {
  display: grid;
  gap: 6px;
}
.demo-gate-form.demo-auth-form label,
.demo-gate-field label {
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-soft);
}
.demo-gate-optional {
  font-weight: 400;
  color: var(--ink-faint);
}
.demo-gate-form input {
  margin: 0;
  padding: 11px 13px;
  border-radius: 10px;
  border: 1px solid #dadee6;
  background: #f5f6f9;
  font-size: 0.9375rem;
  color: var(--ink);
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.demo-gate-form input::placeholder {
  color: #a4aab5;
}
.demo-gate-form input:hover {
  border-color: #cbd1db;
}
.demo-gate-form input:focus {
  outline: none;
  border-color: #b2bac7;
  background: #fffefb;
  box-shadow: 0 0 0 3px rgba(26, 23, 21, 0.06);
}
.demo-gate-submit {
  width: 100%;
  margin-top: 6px;
  border: 0;
  border-radius: 999px;
  padding: 12px 18px;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: #f8f9fc;
  background: #1a1715;
  box-shadow: none;
  cursor: pointer;
  transition: background 0.15s ease, opacity 0.15s ease, transform 0.15s ease;
}
.demo-gate-submit:hover:not(:disabled) {
  background: #1a2331;
  transform: translateY(-1px);
  filter: none;
  box-shadow: none;
}
.demo-gate-submit:disabled {
  opacity: 0.38;
  cursor: not-allowed;
  transform: none;
  background: #1a1715;
  border: 0;
  color: #f8f9fc;
}
.demo-gate-dismiss {
  display: block;
  width: 100%;
  margin-top: 2px;
  padding: 8px;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--ink-faint);
  cursor: pointer;
  transition: color 0.15s ease;
}
.demo-gate-dismiss:hover {
  color: var(--ink-soft);
}

.login-card {
  width: min(640px, 100%);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 28px;
  box-shadow: var(--shadow);
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.company-setup-card {
  width: min(960px, 97vw);
  padding: 20px;
  max-height: calc(100vh - 80px);
  border-radius: 14px;
  border: 1px solid #ced5e2;
  background: linear-gradient(180deg, #fffdfa 0%, #f5f7fb 100%);
  box-shadow: 0 24px 44px -30px rgba(26, 23, 21, 0.5);
}
.company-setup-card h2 {
  margin-bottom: 2px;
  font-size: 22px;
  line-height: 1.12;
  letter-spacing: -0.015em;
}
.company-setup-card p {
  margin-bottom: 8px;
  font-size: 13px;
  color: #585f6b;
}
.login-card [hidden] {
  display: none !important;
}
.setup-progress-card {
  width: min(520px, 100%);
}
.setup-progress-card h2 {
  margin-bottom: 10px;
}
.setup-progress-card p {
  margin-bottom: 14px;
}
.setup-progress-bar {
  width: 100%;
  height: 10px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid #bdc5d4;
  background: #e5eaf2;
}
.setup-progress-fill {
  display: block;
  height: 100%;
  width: 28%;
  border-radius: 999px;
  background: linear-gradient(90deg, #1c2433 0%, #2964c4 100%);
  animation: setupProgress 9.4s linear forwards;
}
.setup-progress-footnote {
  margin-top: 10px;
  font-size: 12px;
  color: var(--ink-faint);
}
@keyframes setupProgress {
  from { width: 10%; }
  to { width: 100%; }
}
.auth-mode-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  background: #e3e8ef;
  border: 1px solid #c9d0db;
  border-radius: 12px;
  padding: 6px;
  margin-bottom: 18px;
}
.login-card .auth-mode-btn,
.login-card .subscriber-auth-btn {
  border: 0;
  border-radius: 9px;
  padding: 10px 12px;
  background: transparent;
  color: #4c525d;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.2;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.login-card .auth-mode-btn:hover,
.login-card .subscriber-auth-btn:hover {
  background: rgba(26, 23, 21, 0.08);
  color: #1c2433;
}
.login-card .auth-mode-btn.active,
.login-card .subscriber-auth-btn.active {
  background: #131923;
  color: var(--paper);
  box-shadow: 0 6px 14px -10px rgba(0, 0, 0, 0.6);
}
.login-card .auth-mode-btn:focus-visible,
.login-card .subscriber-auth-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.28);
}
.auth-mode-panel h2 {
  margin: 0 0 8px;
  line-height: 1.15;
}
.subscriber-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 8px;
}
.subscriber-panel-head h2 {
  margin: 0;
}
.auth-mode-panel p {
  margin: 0 0 20px;
  color: var(--ink-soft);
}
.login-card h2 {
  margin: 0 0 8px;
  line-height: 1.15;
}
.login-card p {
  margin: 0 0 20px;
  color: var(--ink-soft);
}
.demo-auth-form {
  display: grid;
  gap: 8px;
}
.company-setup-form {
  gap: 9px;
}
.setup-steps-head {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 4px;
  padding: 5px;
  border: 1px solid #d1d9e7;
  border-radius: 10px;
  background: #f1f3f8;
}
.setup-step-pill {
  border: 1px solid #c2cbda;
  border-radius: 8px;
  padding: 4px 9px;
  font-size: 11px;
  letter-spacing: 0.02em;
  color: #5e6673;
  background: #eef1f7;
}
.setup-step-pill.active {
  background: linear-gradient(180deg, #1c2535 0%, #131822 100%);
  border-color: #19212e;
  color: #f3f6fa;
}
.setup-step {
  display: none;
  gap: 8px;
}
.setup-step.active {
  display: grid;
}
.demo-auth-form label {
  font-size: 12px;
  color: var(--ink-faint);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.demo-auth-form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]) {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
  font-size: 14px;
  margin-bottom: 6px;
  font-family: inherit;
}
.demo-auth-form input[type="hidden"] {
  display: none;
}
.demo-auth-form select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
  font-size: 14px;
  margin-bottom: 6px;
  font-family: inherit;
  background: var(--paper);
}
.setup-select-dropdown {
  position: relative;
}
.setup-select-trigger {
  width: 100%;
  border: 1px solid #bbc6d8;
  border-radius: 10px;
  padding: 10px 34px 10px 12px;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.25;
  color: #253146;
  background: #fffefb;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  text-align: left;
  cursor: pointer;
  position: relative;
}
.setup-select-trigger::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 14px;
  height: 14px;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%2361503f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}
.setup-select-dropdown.is-open .setup-select-trigger,
.setup-select-trigger:hover {
  border-color: #9eacc4;
}
.setup-select-trigger:focus {
  outline: none;
  border-color: #5988d5;
  box-shadow: 0 0 0 3px rgba(89, 136, 213, 0.16);
}
.setup-select-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 45;
  border: 1px solid #b4c0d5;
  border-radius: 10px;
  background: #fffefb;
  box-shadow: 0 14px 26px -20px rgba(15, 23, 38, 0.5);
  padding: 6px;
  display: grid;
  gap: 3px;
  max-height: 220px;
  overflow-y: auto;
}
.setup-select-menu[hidden] {
  display: none !important;
}
.setup-select-option {
  border: 0;
  background: transparent;
  color: #253146;
  font: inherit;
  font-size: 13px;
  text-align: left;
  border-radius: 7px;
  padding: 7px 8px;
  cursor: pointer;
}
.setup-select-option:hover {
  background: #e3e8f2;
}
.setup-select-option.is-active {
  background: #c6d2e6;
  color: #1b2331;
}
.setup-row-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.setup-inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.file-upload-btn {
  display: inline-flex;
  align-items: center;
}
.setup-list {
  display: grid;
  gap: 8px;
}
.setup-list-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  padding: 4px 2px 2px;
  margin-bottom: 2px;
}
.setup-list-toolbar.hidden {
  display: none;
}
.setup-select-all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  color: #2e3c55;
  cursor: pointer;
}
.setup-select-all input {
  margin: 0;
  width: auto;
}
.setup-list-count {
  flex: 1;
  min-width: 90px;
  font-size: 12px;
  font-weight: 600;
  color: #525a67;
}
.setup-list-toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.setup-danger-btn {
  border-color: #a0b1ce;
  color: #26539a;
  background: #f5f7fb;
}
.setup-danger-btn:hover {
  border-color: #2f64ba;
  background: #eaeef6;
  color: #28416b;
}
.setup-item-row-location {
  grid-template-columns: minmax(150px, 1.2fr) minmax(150px, 1.2fr) minmax(180px, 1.25fr) minmax(130px, .8fr) auto;
}
.setup-item-row-location .setup-row-check {
  display: none;
}
.setup-list.setup-list--bulk .setup-item-row-location {
  grid-template-columns: 32px minmax(130px, 1.05fr) minmax(130px, 1.05fr) minmax(160px, 1.15fr) minmax(110px, .75fr) auto;
  column-gap: 10px;
  row-gap: 8px;
  padding: 8px 10px;
}
.setup-list.setup-list--bulk .setup-item-row-location .setup-row-check {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
}
.setup-row-check {
  margin: 0;
  padding: 0;
  cursor: pointer;
}
.setup-row-select {
  width: 16px;
  height: 16px;
  min-width: 16px;
  max-width: 16px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 4px;
  background: transparent;
  box-shadow: none;
  flex-shrink: 0;
  cursor: pointer;
  accent-color: #19212e;
}
.setup-inline-actions .mini-action-btn.hidden {
  display: none;
}
.setup-item-row {
  border: 1px solid #c9d1de;
  border-radius: 8px;
  background: #f9fbfd;
  padding: 6px;
  display: grid;
  grid-template-columns: minmax(150px, 1.2fr) minmax(150px, 1.2fr) minmax(180px, 1.25fr) minmax(130px, .8fr) auto;
  gap: 6px;
}
.setup-item-row-employee {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.setup-item-row input {
  margin-bottom: 0;
  min-width: 0;
}
.setup-item-row .remove-setup-row {
  align-self: center;
  justify-self: end;
}
.csv-preview-box {
  border: 1px dashed #bbc5d6;
  border-radius: 8px;
  background: #f4f6fa;
  padding: 10px 12px;
  color: #525a67;
  font-size: 13px;
}
.csv-preview-box p {
  margin: 6px 0 0;
}
.workspace-preview-card {
  border: 1px solid #c4ccda;
  border-radius: 8px;
  background: #f7f9fc;
  padding: 14px;
}
.workspace-preview-card h4 {
  margin: 0 0 8px;
}
.workspace-preview-card p {
  margin: 0 0 10px;
}
.company-setup-actions {
  margin-top: 2px;
}
.industry-picker {
  margin-bottom: 6px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.industry-picker-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.industry-picker-row--bottom {
  display: flex;
  justify-content: center;
  gap: 8px;
}
.industry-picker-row--bottom .industry-pill {
  flex: 0 0 calc((100% - 18px) / 4);
  max-width: calc((100% - 18px) / 4);
}
.industry-pill {
  border: 1px solid #c7cedb;
  border-radius: 8px;
  background: #f6f8fb;
  color: #2e3c55;
  padding: 7px 10px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  cursor: pointer;
  text-align: center;
  transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}
.industry-pill:hover {
  border-color: #8c9ab2;
  background: #e1e7f2;
  color: #1b2433;
}
.industry-pill.active {
  border-color: #1a2230;
  background: #19212e;
  color: #f3f5f9;
  box-shadow: 0 8px 16px -14px rgba(12, 16, 22, 0.75);
}
.industry-pill:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.26);
}
.role-picker {
  margin-bottom: 6px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.role-pill {
  border: 1px solid #c7cedb;
  border-radius: 8px;
  background: #f6f8fb;
  color: #2e3c55;
  padding: 7px 10px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  cursor: pointer;
  text-align: center;
  transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}
.role-pill:hover {
  border-color: #8c9ab2;
  background: #e1e7f2;
  color: #1b2433;
}
.role-pill.active {
  border-color: #1a2230;
  background: #19212e;
  color: #f3f5f9;
  box-shadow: 0 8px 16px -14px rgba(12, 16, 22, 0.75);
}
.setup-other-field {
  display: none;
  width: 100%;
  margin-top: 0.55rem;
}

.setup-other-field.is-visible {
  display: block;
}

.role-pill:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.26);
}
.demo-setup-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.priority-grid {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f9fafc;
  padding: 10px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 8px;
}
.priority-grid label {
  margin: 0;
  color: var(--ink-soft);
  font-size: 12px;
  text-transform: none;
  letter-spacing: 0;
  display: flex;
  align-items: flex-start;
  gap: 6px;
}
.priority-grid input {
  width: auto;
  margin: 2px 0 0;
}
.modal-actions {
  margin-top: 8px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.modal-actions .btn-primary,
.modal-actions .btn-secondary {
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.25;
  padding: 10px 16px;
  border-radius: 10px;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-decoration: none;
}
.modal-actions .btn-secondary {
  border: 1px solid var(--line);
  background: #fffefb;
  color: var(--ink);
}
.modal-actions .btn-primary {
  border: 1px solid var(--ink);
  background: var(--ink);
  color: var(--paper);
}
.modal-actions .btn-primary:hover,
.modal-actions .btn-secondary:hover {
  transform: translateY(-1px);
}
.upgrade-card .modal-actions {
  justify-content: flex-start;
}
.password-field {
  position: relative;
  display: block;
  width: 100%;
  margin-bottom: 8px;
}
.password-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.password-col {
  min-width: 0;
}
.password-field input {
  display: block;
  width: 100%;
  margin-bottom: 0;
  padding-right: 44px;
}
.password-toggle {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #5c6370;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.password-toggle:hover {
  background: rgba(26, 23, 21, 0.08);
  color: #1c2433;
}
.password-toggle:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.28);
}
.password-toggle svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.password-toggle .icon-eye-off {
  display: none;
}
.password-toggle.is-visible .icon-eye {
  display: none;
}
.password-toggle.is-visible .icon-eye-off {
  display: block;
}
.demo-auth-form .btn-primary:disabled {
  opacity: 0.52;
  cursor: not-allowed;
  transform: none;
}
.login-card .demo-auth-form .btn-primary {
  width: 100%;
  justify-content: center;
  border: 1px solid #161d29;
  border-radius: 12px;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: -0.01em;
  background: linear-gradient(180deg, #1c2433 0%, #10151d 100%);
  box-shadow: 0 12px 24px -18px rgba(12, 16, 22, 0.65);
  transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

/* Compact premium tuning for company setup modal only */
.company-setup-card .section-label {
  font-size: 10px;
  margin-bottom: 6px;
}
.company-setup-card .demo-auth-form label {
  font-size: 10px;
  letter-spacing: 0.06em;
}
.required-mark {
  color: #1d5ad6;
  font-weight: 700;
  margin-left: 2px;
  font-size: 11px;
}
.company-setup-card .demo-auth-form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.company-setup-card .demo-auth-form select,
.company-setup-card .setup-select-trigger {
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 13px;
  margin-bottom: 4px;
  background: #fffefb;
}
.company-setup-card .demo-auth-form select:focus,
.company-setup-card .setup-select-trigger:focus {
  outline: none;
  border-color: #5586d5;
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.14);
}
.company-setup-card .demo-auth-form select option {
  background: #f7f8fb;
  color: #1c2535;
}
.company-setup-card .csv-preview-box,
.company-setup-card .workspace-preview-card {
  border-radius: 10px;
  font-size: 12px;
}
.company-setup-card .company-setup-actions {
  position: sticky;
  bottom: -18px;
  padding-top: 10px;
  padding-bottom: 2px;
  background: linear-gradient(180deg, rgba(249, 250, 252, 0), #f7f8fb 45%);
}
.company-setup-card .setup-next-hint {
  flex: 1 1 auto;
  margin: 0;
  color: #1c488f;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  text-align: left;
}
.company-setup-card .setup-next-hint[hidden] {
  display: none;
}
.company-setup-actions #cancelDemoSetupBtn,
.company-setup-actions #setupNextBtn {
  border-color: #151b26;
  background: linear-gradient(180deg, #1c2535 0%, #131822 100%);
  color: #f3f6fa;
  opacity: 1;
}
.company-setup-actions #cancelDemoSetupBtn:hover,
.company-setup-actions #setupNextBtn:hover:not(:disabled) {
  border-color: #232e40;
  background: linear-gradient(180deg, #232e40 0%, #19212e 100%);
  color: #f3f6fa;
}
.company-setup-actions #setupNextBtn:disabled {
  border-color: #cad0db;
  background: linear-gradient(180deg, #dfe4eb 0%, #ced3db 100%);
  color: #8f97a4;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}
.company-setup-card .setup-label-missing {
  color: #1c488f;
}
.company-setup-card .demo-auth-form input.setup-field-missing:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.company-setup-card .setup-select-trigger.setup-field-missing {
  border-color: #5082d3 !important;
  box-shadow: 0 0 0 2px rgba(47, 111, 237, 0.1) !important;
}
.company-setup-card .industry-picker.setup-field-missing,
.company-setup-card .role-picker.setup-field-missing {
  margin: -2px -6px 4px;
  padding: 6px;
  border-radius: 10px;
  background: rgba(28, 72, 143, 0.05);
  outline: none;
  box-shadow: none;
}
.company-setup-actions #setupNextBtn.is-disabled {
  border-color: #cad0db;
  background: linear-gradient(180deg, #dfe4eb 0%, #ced3db 100%);
  color: #8f97a4;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}
.company-setup-actions #setupNextBtn.is-disabled:hover {
  border-color: #cad0db;
  background: linear-gradient(180deg, #dfe4eb 0%, #ced3db 100%);
  color: #8f97a4;
  transform: none;
}
.login-card .demo-auth-form .btn-primary:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px -18px rgba(12, 16, 22, 0.75);
  filter: brightness(1.05);
}
.login-card .demo-auth-form .btn-primary:disabled {
  border-color: #c4cbd6;
  background: linear-gradient(180deg, #a8aeb8 0%, #8f97a4 100%);
  color: #f4f6fa;
  box-shadow: none;
}
.demo-gate-card.login-card .demo-auth-form .btn-primary.demo-gate-submit {
  width: 100%;
  margin-top: 6px;
  border: 0;
  border-radius: 999px;
  padding: 12px 18px;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: #f8f9fc;
  background: #1a1715;
  box-shadow: none;
}
.demo-gate-card.login-card .demo-auth-form .btn-primary.demo-gate-submit:hover:not(:disabled) {
  background: #1a2331;
  transform: translateY(-1px);
  filter: none;
  box-shadow: none;
}
.demo-gate-card.login-card .demo-auth-form .btn-primary.demo-gate-submit:disabled {
  opacity: 0.38;
  cursor: not-allowed;
  transform: none;
  background: #1a1715;
  border: 0;
  color: #f8f9fc;
}
.subscriber-auth-switch {
  display: inline-grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding: 5px;
  border: 1px solid #c9d0db;
  border-radius: 11px;
  background: #e3e8ef;
  margin-bottom: 0;
  min-width: 190px;
}
.subscriber-auth-switch .subscriber-auth-btn {
  white-space: nowrap;
  min-width: 0;
  text-align: center;
}
.auth-status-note {
  margin: 24px 0 0;
  color: var(--ink-faint);
  font-size: 13px;
  font-style: italic;
}

.workspace-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 24px;
  background: #0f141d;
  color: #e7ecf3;
  border-bottom: 1px solid #1a2230;
  position: sticky;
  top: 0;
  z-index: 20;
}
.access-tier-banner {
  margin: 12px 18px 0;
  border: 1px solid #c2cbdb;
  background: linear-gradient(180deg, #f7f8fb 0%, #e5ebf4 100%);
  border-radius: 8px;
  padding: 10px 12px;
  color: #2d3b54;
  font-size: 13px;
  line-height: 1.45;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.access-tier-banner strong {
  color: #19212e;
}
.access-tier-banner-text {
  min-width: 0;
}
.access-tier-banner--setup .access-tier-banner-text {
  flex: 1 1 auto;
}
.access-tier-actions {
  display: inline-flex;
  gap: 8px;
  flex-shrink: 0;
}
.mini-action-btn {
  border: 1px solid #bac4d5;
  background: #fafbfd;
  color: #253145;
  border-radius: 999px;
  padding: 7px 11px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.mini-action-btn:hover {
  border-color: #97a5be;
  background: #f1f4f9;
}
.mini-action-btn-solid {
  background: #131923;
  color: #f4f6fa;
  border-color: #131923;
}
.mini-action-btn-solid:hover {
  background: #19212f;
  border-color: #19212f;
  color: #f4f6fa;
}
.mini-action-btn-solid:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.25);
}
.mini-action-btn.active {
  box-shadow: 0 0 0 2px rgba(47, 111, 237, 0.2);
}
.mini-action-btn.is-disabled,
.mini-action-btn[aria-disabled="true"] {
  opacity: 0.6;
  pointer-events: none;
}
.access-subscriber .access-tier-banner {
  border-color: rgba(90, 142, 98, 0.35);
  background: linear-gradient(180deg, #f7fcf8 0%, #eff7f0 100%);
}
.access-tier-note {
  margin-top: 10px;
  border: 1px dashed #c2cbda;
  border-radius: 8px;
  padding: 10px 12px;
  color: #585f6c;
  font-size: 13px;
  font-style: italic;
  line-height: 1.45;
  background: #f8f9fc;
}
.workspace-subbrand {
  color: #9ca5b5;
  margin-left: 10px;
  padding-left: 12px;
  border-left: 1px solid #2c3a51;
  font-family: inherit;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}
.workspace-controls {
  display: flex;
  align-items: center;
  gap: 10px;
}
.notifications-wrap {
  position: relative;
}
.notifications-btn {
  width: 34px;
  height: 34px;
  border: 1px solid #354562;
  color: #f4f6fa;
  background: rgba(239, 242, 248, 0.06);
  border-radius: 999px;
  display: grid;
  place-items: center;
  cursor: pointer;
  position: relative;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.notifications-btn svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.notifications-btn:hover,
.notifications-btn[aria-expanded="true"] {
  background: #eff2f8;
  border-color: #eff2f8;
  color: #0f141d;
}
.notifications-count {
  position: absolute;
  top: -4px;
  right: -2px;
  min-width: 16px;
  height: 16px;
  border-radius: 999px;
  background: #2f6ccf;
  color: #f8f9fc;
  border: 1px solid #0f141d;
  font-size: 10px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
}
.notifications-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: min(360px, calc(100vw - 30px));
  border: 1px solid #c8d1e0;
  border-radius: 12px;
  background: #fbfcfd;
  box-shadow: 0 20px 42px -26px rgba(0, 0, 0, 0.6);
  z-index: 30;
  padding: 10px;
}
.notifications-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  padding: 2px 2px 8px;
  border-bottom: 1px solid #d8e0ec;
}
.notifications-head strong {
  font-size: 13px;
  color: #1d2635;
}
.notifications-head span {
  font-size: 11px;
  color: #687284;
}
.notifications-list {
  margin-top: 8px;
  display: grid;
  gap: 7px;
}
.notification-item {
  border: 1px solid #cdd7e7;
  border-radius: 9px;
  background: #f7f8fb;
  padding: 8px 9px;
}
.notification-item-action {
  width: 100%;
  text-align: left;
  font: inherit;
  cursor: pointer;
  transition: border-color .14s ease, background .14s ease, transform .14s ease;
}
.notification-item-action:hover {
  border-color: #a0b1cf;
  background: #eff2f8;
  transform: translateY(-1px);
}
.notification-item strong {
  display: block;
  margin-bottom: 4px;
  font-size: 12px;
  color: #1d2635;
}
.notification-item p {
  margin: 0;
  font-size: 12px;
  color: #49505c;
}
.notification-item .notification-level {
  display: inline-flex;
  margin-bottom: 4px;
  border-radius: 999px;
  border: 1px solid #b6c3d8;
  padding: 2px 7px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.notification-level.high {
  color: #8d2d2d;
  border-color: #efc0c0;
  background: #fdeeee;
}
.notification-level.medium {
  color: #273f68;
  border-color: #b2c1dc;
  background: #ecf0f7;
}
.notification-level.low {
  color: #2f6a3e;
  border-color: #c1dec7;
  background: #edf8ef;
}
.mono-label {
  font-family: inherit;
  color: #9ca5b5;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.workspace-company-static {
  display: flex;
  align-items: center;
  gap: 10px;
}
.workspace-company-pill {
  min-width: 188px;
  border: 1px solid #253146;
  background: #161d28;
  color: #eff2f8;
  border-radius: 999px;
  padding: 9px 14px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
}
.persona-picker {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
}
.persona-button {
  min-width: 188px;
  border: 1px solid #253146;
  background: #161d28;
  color: #eff2f8;
  border-radius: 999px;
  padding: 9px 36px 9px 14px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  position: relative;
  text-align: left;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.persona-button:hover,
.persona-picker.open .persona-button {
  background: #1a2331;
  border-color: #4f596b;
}
.persona-button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(34, 96, 196, 0.34);
}
.persona-chevron {
  position: absolute;
  right: 13px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid #bfc7d5;
  border-bottom: 1.5px solid #bfc7d5;
  transform: translateY(-65%) rotate(45deg);
  transition: transform .15s ease;
}
.persona-picker.open .persona-chevron {
  transform: translateY(-35%) rotate(225deg);
}
.persona-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  width: 236px;
  background: #141a24;
  border: 1px solid #2c3a51;
  border-radius: 8px;
  padding: 6px;
  box-shadow: 0 18px 44px rgba(10, 8, 6, 0.38);
  display: none;
  z-index: 40;
}
.persona-picker.open .persona-menu {
  display: grid;
  gap: 2px;
}
.persona-option {
  width: 100%;
  border: 0;
  background: transparent;
  color: #e7ecf4;
  border-radius: 6px;
  padding: 10px 12px;
  font: inherit;
  font-size: 14px;
  line-height: 1.2;
  text-align: left;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.persona-option:hover,
.persona-option.active {
  background: #2260c4;
  color: #f5f7fa;
}
.persona-option.active::after {
  content: "";
  width: 6px;
  height: 11px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
}
.user-pill {
  color: #bac4d4;
  font-size: 13px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 4px 8px 10px;
}
.user-pill::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #66c783;
  box-shadow: 0 0 0 3px rgba(102, 199, 131, 0.12);
}
.ghost-btn {
  border: 1px solid #354562;
  color: #f4f6fa;
  background: rgba(239, 242, 248, 0.06);
  border-radius: 999px;
  padding: 9px 14px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.ghost-btn:hover {
  background: #eff2f8;
  border-color: #eff2f8;
  color: #0f141d;
}
.ghost-btn-muted {
  border-color: #253145;
  color: #acb7c9;
  background: rgba(239, 242, 248, 0.02);
}
.ghost-btn-muted:hover {
  color: #f4f6fa;
  border-color: #27539a;
  background: rgba(239, 242, 248, 0.08);
}
.ghost-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(34, 96, 196, 0.34);
}

.workspace-shell {
  display: grid;
  grid-template-columns: 212px 1fr;
  gap: 18px;
  padding: 18px;
  transition: grid-template-columns .18s ease;
}
:root {
  --workspace-pane-height: calc(100dvh - 92px);
}
.workspace-shell.sidebar-collapsed {
  grid-template-columns: 68px 1fr;
}
.workspace-sidebar {
  background: linear-gradient(180deg, #131822 0%, #0e1219 100%);
  color: #e7ecf4;
  border: 1px solid #1c2535;
  border-radius: 10px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-height: var(--workspace-pane-height);
  max-height: var(--workspace-pane-height);
  position: sticky;
  top: 84px;
  overflow: auto;
  transition: padding .18s ease;
}
.sidebar-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #1d2636;
}
.sidebar-block .section-label {
  color: #929bab;
  margin-bottom: 0;
}
.sidebar-toggle {
  width: 28px;
  height: 28px;
  border: 1px solid #273348;
  border-radius: 7px;
  background: #171e2a;
  color: #d7dfec;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.sidebar-toggle:hover {
  background: #1e2838;
  border-color: #224987;
}
.sidebar-toggle span {
  width: 8px;
  height: 8px;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  margin-left: 3px;
}
.nav-tab {
  width: 100%;
  text-align: left;
  border: 1px solid #273348;
  background: #171e2b;
  color: #d7dfec;
  border-radius: 10px;
  padding: 9px 10px;
  margin-bottom: 8px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  position: relative;
  transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}
.nav-tab:hover {
  border-color: #244d90;
  background: #1d2635;
  transform: translateY(-1px);
}
.nav-tab-icon {
  width: 26px;
  height: 26px;
  border-radius: 7px;
  background: rgba(239, 242, 248, 0.08);
  color: #bac4d4;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 700;
}
.nav-tab-icon svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.nav-tab-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nav-tab-soon-badge {
  flex: 0 0 auto;
  margin-left: auto;
  border-radius: 999px;
  background: rgba(47, 104, 197, 0.14);
  color: #24519a;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1;
  padding: 3px 6px;
  text-transform: uppercase;
}
.nav-tab.active .nav-tab-soon-badge {
  background: rgba(243, 245, 249, 0.2);
  color: #f3f5f9;
}
.whatsapp-coming-soon-banner {
  margin-bottom: 14px;
}
.whatsapp-coming-soon-banner strong {
  display: block;
  margin-bottom: 4px;
  color: #232e41;
}
#whatsappRegistrationCard.whatsapp-bot-locked {
  opacity: 0.58;
  pointer-events: none;
  user-select: none;
}
.nav-tab.active {
  background: linear-gradient(180deg, #2f68c5 0%, #275cb2 100%);
  border-color: #487cd1;
  color: #f3f5f9;
  box-shadow: 0 10px 18px -14px rgba(47, 104, 197, 0.75);
}
.nav-tab.active::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 999px;
  background: rgba(243, 245, 249, 0.95);
}
.nav-tab.locked {
  background: #161d28;
  border-color: #253146;
  color: #a3abba;
}
.nav-tab.locked .nav-tab-icon {
  background: rgba(239, 242, 248, 0.03);
  color: #828c9c;
}
.nav-tab.locked:hover {
  border-color: #244d8f;
  background: #1b2331;
}
.nav-lock {
  margin-left: 4px;
  font-size: 11px;
}
.access-subscriber .nav-lock {
  display: none;
}
.nav-tab.active .nav-tab-icon {
  background: rgba(255, 255, 255, 0.16);
  color: #f3f5f9;
}
.workspace-shell.sidebar-collapsed .workspace-sidebar {
  padding: 12px;
}
.workspace-shell.sidebar-collapsed .sidebar-title-row {
  justify-content: center;
}
.workspace-shell.sidebar-collapsed .sidebar-title-row .section-label,
.workspace-shell.sidebar-collapsed .nav-tab-text,
.workspace-shell.sidebar-collapsed .sidebar-block:not(:first-child),
.workspace-shell.sidebar-collapsed .sidebar-pilot-card {
  display: none;
}
.workspace-shell.sidebar-collapsed .sidebar-toggle {
  transform: rotate(180deg);
}
.workspace-shell.sidebar-collapsed .nav-tab {
  justify-content: center;
  padding: 9px;
}
.workspace-shell.sidebar-collapsed .nav-tab-icon {
  width: 28px;
  height: 28px;
}
.sidebar-pilot-card {
  margin-top: auto;
  border-top: 1px solid #1f293a;
  padding-top: 14px;
  background: rgba(239, 242, 248, 0.03);
  border-radius: 10px;
  padding: 14px 12px 12px;
}
.sidebar-pilot-label {
  color: #929bab;
  font-family: inherit;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.sidebar-pilot-card p {
  color: #bac4d4;
  font-size: 13px;
  line-height: 1.45;
  margin: 0 0 12px;
}

.sidebar-pilot-link-wrap {
  margin-bottom: 10px;
}

.sidebar-pilot-url-shell {
  display: flex;
  align-items: stretch;
  gap: 0;
  border: 1px solid #2c3a53;
  border-radius: 9px;
  background: #121822;
  overflow: hidden;
}

.sidebar-pilot-channel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 0 8px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #25d366;
  background: rgba(37, 211, 102, 0.12);
  border-right: 1px solid #2c3a53;
}

.sidebar-pilot-url-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 8px 10px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #dfe5f0;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 10px;
  line-height: 1.35;
  text-overflow: ellipsis;
}

.sidebar-cta {
  display: inline-flex;
  width: 100%;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  border: 1px solid #354562;
  border-radius: 9px;
  background: #171f2c;
  color: #eff2f8;
  font-size: 13px;
  font-weight: 600;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.sidebar-cta:hover {
  background: #eff2f8;
  border-color: #eff2f8;
  color: #0f141d;
}

.workspace-content {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
  overflow-x: clip;
}
.demo-workspace-body .workspace-content {
  overflow: visible;
}
.workspace-content > * {
  min-width: 0;
}
.tab-panel,
.ops-card,
.daily-brief-card,
.kpi-card,
.issue-card,
.joiner-card,
.leave-request-card,
.whatsapp-group-item,
.whatsapp-workflow-item,
.reports-library-item,
.documents-template-card {
  min-width: 0;
}
.ops-card h4,
.daily-brief-card h3,
.issue-card h4,
.panel-title-row h3,
.kpi-value,
.brief-bullet,
.issue-summary,
.issue-meta,
.joiner-card p,
.leave-request-card p,
.ops-list li {
  overflow-wrap: anywhere;
  word-break: normal;
}
.leave-request-actions {
  align-items: center;
}
.leave-request-actions .preview-lock-btn {
  max-width: 100%;
}
.ops-table {
  overflow-x: auto;
  scrollbar-width: thin;
}
.workspace-header-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 20px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.workspace-header-card h1 {
  margin: 0 0 6px;
  line-height: 1.15;
}
.workspace-header-card p {
  margin: 0;
  color: var(--ink-faint);
}
.workspace-current-date {
  margin: 2px 0 8px;
  font-size: 12px;
  color: #5c6677;
  letter-spacing: 0.01em;
}
.mini-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.mini-badge {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 13px;
  color: var(--ink-soft);
}
.mini-badge span {
  color: var(--ink);
  font-weight: 700;
}

.tab-panel {
  display: none;
}
.tab-panel.active {
  display: block;
}
.tab-panel .workspace-header-card {
  margin-bottom: 12px;
}
.third-eye-insight-card {
  margin-bottom: 12px;
  border: 1px solid #bcc7da;
  border-radius: 10px;
  background: linear-gradient(180deg, #fbfcfd 0%, #eff2f8 100%);
  padding: 12px 14px;
  box-shadow: 0 10px 20px -18px rgba(26, 23, 21, 0.35);
}
.third-eye-insight-head {
  margin: 0 0 6px;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #255094;
  font-weight: 700;
}
.third-eye-insight-card p {
  margin: 0;
  color: #2f3e57;
  line-height: 1.45;
}
.third-eye-insight-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
}
.third-eye-insight-item {
  display: grid;
  grid-template-columns: 12px 1fr;
  gap: 8px;
  align-items: start;
  padding: 8px 10px;
  border: 1px solid #c9d3e3;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.65);
}
.third-eye-insight-item span {
  color: #3066be;
  font-weight: 700;
  line-height: 1.2;
}
.third-eye-insight-item p {
  margin: 0;
  color: #28354b;
  line-height: 1.4;
}
.third-eye-focus-block {
  margin-top: 10px;
  border: 1px solid rgba(47, 111, 237, 0.28);
  border-left: 3px solid #1d5ad6;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(245, 247, 250, 0.95) 0%, rgba(238, 242, 248, 0.95) 100%);
  padding: 9px 10px;
  display: grid;
  gap: 4px;
}
.third-eye-focus-label {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #254f93;
  font-weight: 700;
}
.third-eye-focus-block strong {
  font-size: 13px;
  line-height: 1.4;
  color: #1a2331;
}
.third-eye-focus-block em {
  font-style: normal;
  font-size: 12px;
  color: #28559e;
}
.third-eye-focus-actions {
  margin-top: 4px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.third-eye-focus-btn {
  border: 1px solid #b8c4d8;
  border-radius: 7px;
  background: #fbfcfd;
  color: #232e40;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  padding: 5px 9px;
  cursor: pointer;
}
.third-eye-focus-btn:hover {
  border-color: #608ed7;
  background: #eef2f8;
}
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}
.kpi-card {
  background: linear-gradient(180deg, #fffefb 0%, #f3f5f9 100%);
  border: 1px solid #d1d7e2;
  border-radius: 10px;
  padding: 14px 14px 13px;
  position: relative;
  box-shadow: 0 8px 20px -18px rgba(26, 23, 21, 0.38);
}
.kpi-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 3px;
  border-radius: 10px 10px 0 0;
  background: linear-gradient(90deg, rgba(47, 111, 237, 0.75), rgba(47, 111, 237, 0.2));
}
.kpi-label {
  font-size: 12px;
  color: #727b8b;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 700;
}
.kpi-value {
  font-size: 34px;
  font-weight: 800;
  line-height: 1.1;
  margin-top: 8px;
  letter-spacing: -0.02em;
  color: #131923;
}
.kpi-value-preview {
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: -0.01em;
}

.daily-brief-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
}
.daily-brief-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
}
.daily-brief-card h3 {
  margin: 0 0 14px;
  font-size: 20px;
  line-height: 1.2;
}
.brief-bullets {
  display: grid;
  gap: 8px;
}
.brief-bullet {
  background: var(--bg);
  border-left: 3px solid var(--accent);
  padding: 10px 12px;
  color: var(--ink-soft);
  font-size: 14px;
}
.brief-bullet-action {
  width: 100%;
  text-align: left;
  border-top: 0;
  border-right: 0;
  border-bottom: 0;
  border-left: 3px solid var(--accent);
  font: inherit;
  cursor: pointer;
}
.brief-bullet-action:hover {
  background: #eaeef5;
  color: var(--ink);
}
.action-queue {
  display: grid;
  gap: 8px;
}
.action-item {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
}
.action-item p {
  margin: 3px 0 0;
  color: var(--ink-soft);
  font-size: 13px;
}
.action-item span {
  flex: 0 0 auto;
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
}

.issue-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.issue-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}
.issue-toggle {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  padding: 14px;
  cursor: pointer;
}
.issue-toggle:hover {
  background: #f3f5f9;
}
.issue-card h4 {
  margin: 0;
}
.issue-summary {
  margin: 10px 0;
  color: var(--ink-soft);
}
.issue-head {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px;
}
.issue-head .severity {
  flex: 0 0 auto;
  white-space: nowrap;
}
.severity {
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-family: inherit;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: 1px solid transparent;
}
.severity-critical {
  color: #8a2f2f;
  background: #fdf0f0;
  border-color: #edc3c3;
}
.severity-high {
  color: #283f68;
  background: #f1f3f8;
  border-color: #b2c1dc;
}
.severity-medium {
  color: #484f5c;
  background: #e9edf3;
  border-color: #c7cfdc;
}
.severity-low {
  color: #2f6e3f;
  background: #eff9f1;
  border-color: #c3e4ca;
}
.preview-badge {
  color: #4d5666;
  background: #e2e8f2;
  border: 1px solid #b6c3d8;
  font-weight: 700;
  letter-spacing: 0.03em;
}
.issue-expand-hint {
  display: inline-block;
  color: #727b8b;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.issue-details {
  border-top: 1px solid var(--line-soft);
  padding: 10px 14px 12px;
  background: #fffdfa;
}
.issue-details .ops-list {
  margin-top: 8px;
}
.issue-meta {
  font-size: 13px;
  color: var(--ink-soft);
  margin-top: 6px;
}

.panel-title-row {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 12px;
}
.panel-title-row h3 {
  margin: 0 0 8px;
}
.panel-title-row p {
  margin: 0;
  color: var(--ink-soft);
}
.panel-title-row h3 {
  margin: 0 0 6px;
}
.subscriber-only[hidden] {
  display: none !important;
}
.ops-grid-two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.tab-panel[data-panel="locations"] .ops-grid-two {
  align-items: stretch;
}
.tab-panel[data-panel="locations"] .ops-grid-two > .ops-card {
  height: clamp(520px, 72vh, 780px);
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.settings-workspace-card {
  padding: 0;
  overflow: hidden;
}
.settings-workspace-section {
  padding: 22px 24px;
  border-bottom: 1px solid #dae0ea;
}
.settings-workspace-section:last-of-type {
  border-bottom: none;
}
.settings-section-head {
  margin-bottom: 14px;
}
.settings-section-head h4 {
  margin: 0 0 4px;
  font-size: 15px;
}
.settings-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.settings-form-grid-single {
  grid-template-columns: 1fr;
  max-width: 280px;
}
.settings-theme-row {
  max-width: 280px;
}
.settings-brand-grid {
  margin-top: 14px;
  align-items: end;
}
.settings-section-note {
  margin: 0;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.45;
}
.settings-workspace-section-preview {
  background: linear-gradient(180deg, #fffdfb 0%, #f1f3f8 100%);
}
.settings-workspace-footer {
  padding: 18px 24px 22px;
  border-top: 1px solid #dae0ea;
  background: #fffefb;
}
.settings-footer-note {
  margin: 0 0 14px;
  border: none;
  background: transparent;
  padding: 0;
  color: #626a77;
  font-size: 13px;
}
.settings-workspace-actions {
  justify-content: flex-start;
}
.settings-form-grid label {
  display: grid;
  gap: 6px;
  color: var(--ink-soft);
  font-size: 12px;
}
.settings-form-grid input,
.settings-form-grid select {
  width: 100%;
  border: 1px solid #bbc6d8;
  border-radius: 10px;
  padding: 9px 12px;
  font: inherit;
  font-size: 13px;
  color: var(--ink);
  background: #fffefb;
}
.settings-form-grid input[type="color"] {
  width: 64px;
  height: 36px;
  padding: 2px;
}
.settings-select-dropdown {
  position: relative;
}
.settings-select-trigger {
  width: 100%;
  border: 1px solid #bbc6d8;
  border-radius: 10px;
  padding: 9px 34px 9px 12px;
  font: inherit;
  font-size: 13px;
  color: #253146;
  text-align: left;
  background: #fffefb;
  cursor: pointer;
  position: relative;
}
.settings-select-trigger::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 14px;
  height: 14px;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%2361503f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}
.settings-select-dropdown.is-open .settings-select-trigger {
  border-color: #5988d5;
  box-shadow: 0 0 0 3px rgba(89, 136, 213, 0.16);
}
.settings-select-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 35;
  border: 1px solid #b4c0d5;
  border-radius: 10px;
  background: #fffefb;
  box-shadow: 0 12px 24px -16px rgba(22, 29, 41, 0.45);
  max-height: 240px;
  overflow-y: auto;
  padding: 4px;
}
.settings-select-menu[hidden] {
  display: none !important;
}
.settings-select-option {
  width: 100%;
  border: none;
  border-radius: 7px;
  background: transparent;
  text-align: left;
  padding: 7px 8px;
  font-family: inherit;
  font-size: 12px;
  color: #2d3b53;
  cursor: pointer;
}
.settings-select-option:hover {
  background: #e7ecf4;
}
.settings-select-option.is-active {
  background: #d4ddec;
  color: #222d3f;
  font-weight: 600;
}
.settings-form-full {
  grid-column: 1 / -1;
}
.settings-departments-field {
  margin-top: 2px;
}
.settings-departments-input {
  border: 1px solid #bbc6d8;
  border-radius: 10px;
  padding: 10px 12px;
  background: #fffefb;
  display: grid;
  gap: 10px;
}
.settings-departments-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 28px;
}
.settings-departments-tags:empty::before {
  content: "No departments added yet";
  color: #8b93a0;
  font-size: 13px;
}
.settings-dept-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid #c2cbdb;
  border-radius: 999px;
  padding: 4px 6px 4px 12px;
  font-size: 12px;
  color: #222d3f;
  background: #e7ecf4;
}
.settings-dept-tag-remove {
  border: none;
  background: transparent;
  color: #6d7787;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  padding: 0 4px;
}
.settings-dept-tag-remove:hover {
  color: #464d5a;
}
.settings-departments-add-row {
  display: flex;
  gap: 8px;
}
.settings-departments-add-row input {
  flex: 1;
  min-width: 0;
  width: auto;
}
.settings-dept-add-btn {
  flex-shrink: 0;
  border: 1px solid #bbc6d8;
  border-radius: 10px;
  background: #e7ecf4;
  padding: 9px 14px;
  font: inherit;
  font-size: 13px;
  color: #2d3b53;
  cursor: pointer;
}
.settings-dept-add-btn:hover {
  border-color: #5988d5;
  background: #d8e0ec;
}
.settings-checkbox {
  grid-column: 1 / -1;
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
}
.settings-checkbox input {
  width: auto;
}
.settings-preview-table > div {
  grid-template-columns: 1fr 1.2fr;
}
.workspace-density-compact .ops-card {
  padding: 10px;
}
.workspace-density-compact .panel-title-row p {
  font-size: 12px;
}
.ops-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
}
.ops-card h4 {
  margin: 0 0 10px;
  font-size: 20px;
  line-height: 1.2;
}
.locations-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.locations-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #c2cdde;
  background: #f4f6fa;
  color: #224988;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.locations-jump-form {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  flex: 1 1 420px;
}
.locations-jump-form input {
  min-width: 320px;
  flex: 1 1 320px;
  border: 1px solid #b5c2d8;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 12px;
  color: var(--ink);
  background: #fff;
}
.locations-jump-status {
  margin: 0 0 8px;
  font-size: 12px;
  color: #2958a3;
}
.locations-jump-matches {
  width: 100%;
  margin-top: -2px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.locations-jump-match-btn {
  border: 1px solid #b5c2d8;
  background: #f7f8fb;
  color: #2b3950;
  border-radius: 999px;
  padding: 5px 10px;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
  transition: background .14s ease, border-color .14s ease, transform .14s ease;
}
.locations-jump-match-btn:hover {
  background: #e2e8f2;
  border-color: #98a8c3;
  transform: translateY(-1px);
}
.locations-jump-empty {
  font-size: 12px;
  color: #2958a3;
}
.employees-toolbar {
  display: grid;
  gap: 8px;
  margin-bottom: 8px;
}
.employees-filters {
  display: grid;
  grid-template-columns: 1.4fr repeat(5, minmax(0, 1fr));
  gap: 8px;
  padding: 8px;
  border: 1px solid #ccd4e3;
  border-radius: 12px;
  background: #fbfcfd;
}
.employees-filters input,
.employees-filters select,
.employees-jump-form input {
  width: 100%;
  border: 1px solid #c7cfde;
  border-radius: 9px;
  padding: 8px 10px;
  font-family: inherit;
  font-size: 12px;
  line-height: 1.25;
  color: #2d3b53;
  background: #ffffff;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.employees-filters input::placeholder,
.employees-jump-form input::placeholder {
  color: #838b99;
}
.employee-filter-dropdown {
  position: relative;
}
.employee-filter-trigger {
  width: 100%;
  border: 1px solid #c7cfde;
  border-radius: 9px;
  padding: 8px 30px 8px 10px;
  font-family: inherit;
  font-size: 12px;
  line-height: 1.25;
  color: #2d3b53;
  background: #ffffff;
  text-align: left;
  cursor: pointer;
  position: relative;
}
.employee-filter-trigger::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 12px;
  height: 12px;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%2361503f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
}
.employee-filter-trigger:hover {
  border-color: #acb7cb;
}
.employee-filter-dropdown.is-open .employee-filter-trigger {
  border-color: #8d9db8;
  box-shadow: 0 0 0 3px rgba(89, 136, 213, 0.14);
}
.employee-filter-menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  border: 1px solid #b7c2d5;
  border-radius: 10px;
  background: #fffefb;
  box-shadow: 0 10px 22px -16px rgba(22, 29, 41, 0.45);
  max-height: 240px;
  overflow-y: auto;
  padding: 4px;
}
.employee-filter-option {
  width: 100%;
  border: none;
  border-radius: 7px;
  background: transparent;
  text-align: left;
  padding: 7px 8px;
  font-family: inherit;
  font-size: 12px;
  color: #2d3b53;
  cursor: pointer;
}
.employee-filter-option:hover {
  background: #e7ecf4;
}
.employee-filter-option.is-active {
  background: #d4ddec;
  color: #222d3f;
  font-weight: 600;
}
.employees-filters select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 30px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%2361503f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 9px center;
  background-size: 13px;
}
.employees-filters input:hover,
.employees-filters select:hover,
.employees-jump-form input:hover {
  border-color: #acb7cb;
}
.employees-filters input:focus,
.employees-filters select:focus,
.employees-jump-form input:focus {
  outline: none;
  border-color: #8d9db8;
  box-shadow: 0 0 0 3px rgba(89, 136, 213, 0.14);
}
.employees-jump-form {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 2px 0;
}
.employees-jump-form .mini-action-btn {
  border-radius: 9px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  min-width: 118px;
}
.employees-jump-status {
  margin: 0 0 8px;
  font-size: 11px;
  color: #6c7687;
}
.employees-manager-score-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}
.employees-score-note {
  margin: 0 0 10px;
  font-size: 12px;
  color: #535b69;
}
.employee-score-info-btn {
  width: 16px;
  height: 16px;
  margin-left: 6px;
  border: 1px solid #b7c2d4;
  border-radius: 999px;
  background: #f5f7fb;
  color: #4f5867;
  font: inherit;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  vertical-align: middle;
}
.employee-score-info-btn:hover {
  border-color: #93a3bf;
  background: #e2e8f2;
}
.employee-score-info-overlay {
  position: fixed;
  inset: 0;
  z-index: 1200;
  background: rgba(14, 18, 26, 0.34);
  display: grid;
  place-items: center;
  padding: 16px;
}
.employee-score-info-overlay[hidden] {
  display: none !important;
}
.employee-score-info-window {
  width: min(420px, 100%);
  border: 1px solid #c0cadc;
  border-radius: 12px;
  background: #fbfcfd;
  box-shadow: 0 20px 48px -30px rgba(0, 0, 0, 0.55);
  padding: 12px;
}
.employee-score-info-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.employee-score-info-close {
  border: 1px solid #bfc9da;
  border-radius: 999px;
  background: #f4f6fa;
  color: #49505c;
  padding: 4px 9px;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}
.employee-score-info-close:hover {
  border-color: #94a4c1;
  background: #e1e7f1;
}
.employee-score-info-window p {
  margin: 0;
  color: #334460;
}
.employee-score-info-foot {
  margin-top: 8px;
  font-size: 12px;
  color: #555d6b;
}
.employee-manager-score-card {
  border: 1px solid #c2cdde;
  border-radius: 8px;
  background: #f7f8fb;
  padding: 10px;
  display: grid;
  gap: 4px;
}
.employee-manager-score-card span {
  font-size: 11px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ink-faint);
}
.employee-manager-score-card strong {
  font-size: 22px;
  line-height: 1;
}
.employee-manager-score-card p {
  margin: 0;
  font-size: 12px;
  color: var(--ink-soft);
}
.employee-table > div:not(.employee-inline-detail) {
  grid-template-columns: 1.2fr 1fr 1fr .9fr .7fr .8fr !important;
}
.employee-score-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  border-radius: 999px;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid transparent;
}
.employee-score-pill.excellent {
  color: #2f6a2f;
  background: #edf8ed;
  border-color: #c1dec1;
}
.employee-score-pill.good {
  color: #3c5f8e;
  background: #edf4fd;
  border-color: #c5d8f3;
}
.employee-score-pill.watch {
  color: #735c2b;
  background: #ecf0f7;
  border-color: #afbfdb;
}
.employee-score-pill.risk {
  color: #8e2c2c;
  background: #fdecec;
  border-color: #efc2c2;
}
.employee-row.is-target {
  border-color: #4278d0 !important;
  background: #f4f6fa;
}
.employee-row-clickable {
  cursor: pointer;
  transition: border-color .14s ease, background .14s ease, transform .14s ease;
}
.employee-row-clickable:hover {
  border-color: #afbcd2;
  background: #f7f8fb;
  transform: translateY(-1px);
}
.employee-row-clickable.is-selected {
  border-color: #4278d0 !important;
  background: #eef1f7;
}
.employee-inline-detail {
  grid-column: 1 / -1;
  width: 100%;
  max-width: none;
  justify-self: stretch;
  display: grid;
  align-items: start;
  gap: 10px 14px;
  grid-template-columns: minmax(220px, 0.95fr) minmax(0, 2.05fr) !important;
  border: 1px solid #cad2e0 !important;
  border-radius: 10px;
  background: #fbfcfd;
  margin-top: -2px;
  padding: 10px 12px !important;
}
.employee-table > .employee-inline-detail {
  display: grid !important;
  grid-template-columns: minmax(230px, .9fr) minmax(0, 2.1fr) !important;
}
.employee-inline-summary {
  display: grid;
  align-content: start;
  gap: 6px;
}
.employee-inline-summary h5 {
  margin: 0 0 6px;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #2958a3;
}
.employee-inline-summary p {
  margin: 0 0 8px;
  max-width: none;
}
.employee-detail-structured {
  display: grid;
  gap: 8px;
  width: 100%;
}
.employee-detail-section {
  border: 1px solid #d0d9e8;
  border-radius: 8px;
  background: #fff;
  padding: 8px 9px;
  display: grid;
  gap: 7px;
}
.employee-detail-section h6 {
  margin: 0;
  font-size: 10px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #2b5cac;
}
.employee-detail-kv-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 12px;
}
.employee-detail-kv {
  margin: 0;
  display: grid;
  gap: 2px;
}
.employee-detail-kv span {
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #667286;
}
.employee-detail-kv strong {
  font-size: 12px;
  line-height: 1.4;
  color: #1d2635;
  font-weight: 600;
}
.employee-detail-kv-full {
  grid-column: 1 / -1;
}
.employee-inline-detail .ops-list {
  margin: 0;
  padding-left: 18px;
}
@media (max-width: 1060px) {
  .employee-table > .employee-inline-detail {
    grid-template-columns: 1fr !important;
  }
  .employee-detail-kv-grid {
    grid-template-columns: 1fr;
  }
}
.ops-card p {
  margin: 0;
  color: var(--ink-soft);
}
.locations-alert-card {
  border-color: #85a8e1;
  background: linear-gradient(180deg, #fbfcfd 0%, #f2f5f9 100%);
  box-shadow: 0 12px 28px -22px rgba(34, 90, 180, 0.55);
}
.locations-alert-card h4 {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #23375b;
}
.locations-alert-card h4::before {
  content: "!";
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #2b65c2;
  color: #f3f5f9;
  font-size: 12px;
  font-weight: 800;
  display: grid;
  place-items: center;
  box-shadow: 0 0 0 4px rgba(43, 101, 194, 0.14);
  animation: attentionPulse 1.6s ease-in-out infinite;
}
.ai-branch-alert-frame {
  margin-top: 4px;
  border: 1px solid #86a9e1;
  background: linear-gradient(180deg, #f4f6fa 0%, #ecf0f6 100%);
  border-radius: 10px;
  padding: 10px 12px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.65);
}
.ai-branch-alert-frame p {
  margin: 0;
  color: #213558;
  font-size: 13px;
  line-height: 1.45;
  font-weight: 600;
}
.ops-table {
  display: grid;
  gap: 8px;
}
.ops-table > div {
  display: grid;
  grid-template-columns: 1.5fr .8fr .8fr .8fr;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  font-size: 13px;
}
.ops-table > div:first-child {
  background: #f3f5f9;
  color: var(--ink-faint);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
}
.ops-table .locations-row {
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.ops-table .locations-row.risk-critical {
  border-left: 3px solid #2a60b7;
  background: #f7f8fb;
}
.ops-table .locations-row.risk-watch {
  border-left: 3px solid #b18439;
  background: #f5f7fb;
}
.ops-table .locations-row.risk-stable {
  border-left: 3px solid #7a9b6a;
}
.ops-table .locations-row:hover {
  border-color: #b1bed4;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
}
.ops-table .locations-row.is-active {
  border-color: #4278d0;
  background: #f4f6fa;
}
.locations-row-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.locations-issue-cell strong {
  color: #5d2c2c;
}
.location-risk-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid transparent;
  padding: 2px 8px;
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
}
.location-risk-pill.critical {
  color: #8e2c2c;
  background: #fdecec;
  border-color: #e9bcbc;
}
.location-risk-pill.watch {
  color: #725b2a;
  background: #ecf0f6;
  border-color: #acbcd9;
}
.location-risk-pill.stable {
  color: #3f6a3f;
  background: #eef8ee;
  border-color: #bfdcbe;
}
.locations-focus-strip {
  margin-top: 10px;
  border: 1px solid #7aa0de;
  border-radius: 10px;
  background: linear-gradient(180deg, #f1f4f9 0%, #e7ecf4 100%);
  padding: 10px;
  box-shadow: 0 12px 24px -20px rgba(35, 89, 176, 0.45);
}
.locations-focus-strip-top {
  margin-top: 0;
  margin-bottom: 10px;
}
.locations-focus-title {
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #224a8a;
  font-weight: 800;
  margin-bottom: 8px;
}
.locations-focus-items {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.locations-focus-btn {
  border: 1px solid #a9bbd9;
  border-radius: 8px;
  background: #f6f8fb;
  text-align: left;
  padding: 8px;
  display: grid;
  gap: 4px;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.locations-focus-btn:hover {
  transform: translateY(-1px);
  border-color: #618fd8;
  box-shadow: 0 8px 18px -14px rgba(35, 89, 176, 0.45);
}
.locations-focus-btn span {
  font-size: 12px;
  color: #32425e;
}
.locations-focus-btn strong {
  font-size: 13px;
}
.locations-focus-btn.critical strong {
  color: #992c24;
}
.locations-focus-btn.watch strong {
  color: #7c5d1e;
}

.locations-chip-row {
  margin-top: 10px;
}
.locations-chip-row .ops-chip {
  border-width: 1.5px;
  border-radius: 10px;
  padding: 6px 10px;
  font-weight: 700;
  background: #fff;
}
#locationsChipTotal {
  border-color: #adb6c6;
  color: #49505b;
}
#locationsChipRisk {
  border-color: #d99595;
  background: #fff0f0;
  color: #8f2f2f;
}
#locationsChipSupport {
  border-color: #dfbf89;
  background: #eff2f8;
  color: #775723;
}

@keyframes attentionPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(43, 101, 194, 0.25); }
  50% { box-shadow: 0 0 0 7px rgba(43, 101, 194, 0.08); }
}
.location-detail-card {
  margin-top: 12px;
  border: 1px solid #c3cddf;
  border-radius: 10px;
  background: #fbfcfd;
  padding: 12px;
  display: grid;
  gap: 10px;
  font-size: 13px;
}
.location-detail-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
.location-detail-head strong {
  font-size: 13px;
}
.location-detail-head span {
  font-size: 13px;
  color: var(--ink-faint);
}
.location-detail-card p,
.location-detail-card .ops-list li {
  font-size: 13px;
  line-height: 1.45;
}
.location-issues-list {
  gap: 6px;
}
.location-issues-list li {
  list-style: none;
}
.location-issue-btn {
  width: 100%;
  border: 1px solid #cad2e0;
  border-radius: 8px;
  background: #fffdfa;
  color: #2d3b53;
  padding: 7px 9px;
  font: inherit;
  font-size: 13px;
  line-height: 1.4;
  text-align: left;
  cursor: pointer;
  transition: background .14s ease, border-color .14s ease, box-shadow .14s ease;
}
.location-issue-btn:hover {
  border-color: #a5b5d2;
  background: #f4f6fa;
}
.location-issue-btn.is-active {
  border-color: #4278d0;
  background: #eef1f7;
  box-shadow: inset 0 0 0 1px rgba(66, 120, 208, 0.18);
}
.location-issue-detail {
  border: 1px solid #c3cddf;
  border-radius: 10px;
  background: #f4f6fa;
  padding: 10px;
  display: grid;
  gap: 8px;
  font-size: 13px;
}
.location-issue-detail h5 {
  margin: 0;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #2958a3;
}
.location-issue-detail p {
  margin: 0;
}
.location-issue-detail .ops-list {
  margin: 0;
  padding-left: 18px;
}
.location-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.location-action-playbook {
  border: 1px solid #c7d0e0;
  border-radius: 9px;
  background: #f6f8fb;
  padding: 8px;
  display: grid;
  gap: 8px;
}
.location-playbook-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.location-playbook-head strong {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #214682;
}
.location-playbook-head span {
  font-size: 11px;
  color: #2d61b5;
}
.location-playbook-step {
  border: 1px solid #d1d9e7;
  border-radius: 8px;
  background: #fbfcfd;
  padding: 8px;
  display: grid;
  gap: 5px;
}
.location-playbook-step.is-complete {
  border-color: #c8dcbc;
  background: #f4faf1;
}
.location-playbook-step-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.location-playbook-step h6 {
  margin: 0;
  font-size: 12px;
  color: #1c2535;
}
.location-playbook-step p {
  margin: 0;
  font-size: 12px;
  color: #344561;
  line-height: 1.4;
}
.location-owner-options {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.location-owner-chip {
  border: 1px solid #b7c3d8;
  border-radius: 999px;
  background: #fafbfd;
  color: #2b3951;
  font: inherit;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 8px;
  cursor: pointer;
}
.location-owner-chip:hover {
  border-color: #5f8dd7;
  background: #edf1f7;
}
.location-owner-chip.is-active {
  border-color: #2f66be;
  background: #d5ddec;
  color: #1a273d;
}
.location-step-status {
  border: 1px solid #b8c3d5;
  border-radius: 999px;
  padding: 2px 7px;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #2857a2;
  background: #e6ebf4;
}
.location-playbook-step.is-complete .location-step-status {
  border-color: #b8d2a8;
  background: #e8f3e2;
  color: #38623d;
}
.location-quick-btn {
  border: 1px solid #b2bfd4;
  border-radius: 8px;
  background: #fbfcfd;
  color: #242f43;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 9px;
  cursor: pointer;
}
.location-quick-btn-primary {
  border-color: #181f2c;
  background: #1c2433;
  color: #f3f5f9;
}
.location-quick-btn-primary:hover {
  border-color: #121720;
  background: #151b26;
}
.location-quick-btn.location-quick-btn-primary:hover {
  border-color: #121720;
  background: #151b26;
}
.location-quick-btn:disabled,
.location-quick-btn[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.58;
}
.location-quick-btn.location-quick-btn-primary:disabled,
.location-quick-btn.location-quick-btn-primary[aria-disabled="true"] {
  border-color: #bec6d4;
  background: #e0e5ef;
  color: #7b8597;
}
.location-quick-btn:not(.location-quick-btn-primary):hover {
  border-color: #5a8ad6;
  background: #ebeff6;
}
.location-quick-feedback {
  border: 1px solid #b9c3d5;
  border-radius: 8px;
  background: #e6ebf4;
  color: #334460;
  font-size: 12px;
  padding: 7px 9px;
}
.location-quick-feedback.is-visible {
  border-color: #477cd1;
  background: #d1daea;
  color: #1c273a;
}
.location-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.location-detail-item {
  border: 1px solid #d1d9e7;
  border-radius: 8px;
  padding: 8px;
  background: #fff;
  display: grid;
  gap: 4px;
}
.location-detail-item span {
  color: var(--ink-faint);
  font-size: 13px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.location-detail-item strong {
  font-size: 13px;
}
.location-report-frame {
  border: 1px solid #c3cddf;
  border-radius: 10px;
  background: #f4f6fa;
  padding: 10px;
  display: grid;
  gap: 8px;
  font-size: 13px;
}
.location-report-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.location-report-head strong {
  font-size: 13px;
}
.location-report-head span {
  font-size: 13px;
  color: #254f93;
}
.location-report-frame p,
.location-report-frame .ops-list li {
  font-size: 13px;
  line-height: 1.45;
}
.location-report-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.location-report-item {
  border: 1px solid #d1d9e7;
  border-radius: 8px;
  background: #fbfcfd;
  padding: 8px;
  display: grid;
  gap: 4px;
}
.location-report-item span {
  color: var(--ink-faint);
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.location-report-item strong {
  font-size: 13px;
}
.location-report-frame h5 {
  margin: 2px 0 0;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #2958a3;
}
.issue-table > div {
  grid-template-columns: 1.4fr 1fr .7fr .9fr .8fr;
}
.ops-priority-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 78px;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  border: 1px solid transparent;
}
.ops-priority-tag.high {
  color: #8d2d2d;
  background: #fdeeee;
  border-color: #efc0c0;
}
.ops-priority-tag.medium {
  color: #273f68;
  background: #ecf0f7;
  border-color: #b2c1dc;
}
.ops-status-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  border: 1px solid transparent;
}
.ops-status-tag.in-progress {
  color: #225f92;
  background: #e9f3ff;
  border-color: #b9d8fb;
}
.ops-status-tag.escalated {
  color: #8d2d2d;
  background: #fdeeee;
  border-color: #efc0c0;
}
.ops-status-tag.planned {
  color: #273f68;
  background: #ecf0f7;
  border-color: #b2c1dc;
}
.issues-interactive-table .issues-row {
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.issues-interactive-table .issues-row:hover {
  border-color: #b1bed4;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
}
.issues-interactive-table .issues-row.is-active {
  border-color: #4278d0;
  background: #f4f6fa;
}
.issues-detail-card h5 {
  margin: 10px 0 6px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #2958a3;
}
.leave-mode-badge {
  display: inline-flex;
  margin-top: 10px;
  border: 1px solid #bbc5d6;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  color: #4f5663;
  background: #f2f5f9;
}
.leave-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.leave-summary-grid .ops-card h4 {
  margin: 0 0 8px;
}
.leave-summary-grid .ops-card p {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: var(--ink);
}
.leave-filters {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}
.leave-select-trigger,
.leave-filters input {
  width: 100%;
  border: 1px solid #bbc6d8;
  border-radius: 10px;
  padding: 10px 12px;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.25;
  color: #253146;
  background: #fffefb;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.leave-select-dropdown {
  position: relative;
}
.leave-select-trigger {
  display: block;
  text-align: left;
  padding-right: 34px;
  cursor: pointer;
  position: relative;
}
.leave-select-trigger::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 14px;
  height: 14px;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%2361503f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}
.leave-select-dropdown.is-open .leave-select-trigger {
  border-color: #5988d5;
  box-shadow: 0 0 0 3px rgba(89, 136, 213, 0.16);
}
.leave-select-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 32;
  border: 1px solid #b4c0d5;
  border-radius: 10px;
  background: #fffefb;
  box-shadow: 0 14px 26px -20px rgba(15, 23, 38, 0.5);
  padding: 6px;
  display: none;
  gap: 3px;
}
.leave-select-menu[hidden] {
  display: none !important;
}
.leave-select-dropdown.is-open .leave-select-menu {
  display: grid;
}
.leave-select-option {
  border: 0;
  background: transparent;
  color: #253146;
  font: inherit;
  font-size: 13px;
  text-align: left;
  border-radius: 7px;
  padding: 7px 8px;
  cursor: pointer;
}
.leave-select-option:hover {
  background: #e3e8f2;
}
.leave-select-option.is-active {
  background: #c6d2e6;
  color: #1b2331;
}
.leave-date-menu {
  min-width: 280px;
  padding: 8px;
  gap: 8px;
}
.leave-date-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.leave-date-grid label {
  display: grid;
  gap: 4px;
  font-size: 11px;
  color: #265196;
}
.leave-date-grid input[type="date"] {
  width: 100%;
  border: 1px solid #b6c3d8;
  border-radius: 8px;
  padding: 6px 8px;
  font: inherit;
  font-size: 12px;
  color: #253146;
  background: #fffefb;
}
.leave-date-actions {
  display: inline-flex;
  gap: 6px;
}
.joiners-filters select,
.reports-builder-grid select,
.whatsapp-form-grid select,
.demo-auth-form select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 34px;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%2361503f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6'/%3E%3C/svg%3E"), linear-gradient(180deg, #fffefc 0%, #e6ebf4 100%);
  background-repeat: no-repeat, repeat;
  background-position: right 10px center, center;
  background-size: 14px, auto;
}
.leave-select-trigger:hover,
.joiners-filters select:hover,
.reports-builder-grid select:hover,
.whatsapp-form-grid select:hover,
.demo-auth-form select:hover,
.leave-filters input:hover {
  border-color: #9eacc4;
}
.leave-select-trigger:focus,
.joiners-filters select:focus,
.reports-builder-grid select:focus,
.whatsapp-form-grid select:focus,
.demo-auth-form select:focus,
.leave-filters input:focus {
  outline: none;
  border-color: #5988d5;
  box-shadow: 0 0 0 3px rgba(89, 136, 213, 0.16);
}
.leave-queue {
  display: grid;
  gap: 10px;
}
.leave-request-card {
  border: 1px solid #cbd3e1;
  border-radius: 10px;
  background: #fbfcfd;
  padding: 12px;
}
.leave-request-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.leave-request-card p {
  margin: 4px 0;
  color: var(--ink-soft);
}
.leave-request-actions {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.leave-calendar-grid {
  margin-top: 6px;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}
.leave-calendar-grid > div {
  border: 1px solid #cbd3e1;
  border-radius: 8px;
  background: #fafbfd;
  padding: 8px;
  text-align: center;
  font-size: 12px;
  color: var(--ink-soft);
}
.leave-calendar-grid > div:nth-child(-n+7) {
  font-weight: 700;
  color: var(--ink-faint);
}
.leave-calendar-risk {
  border-color: #efc0c0 !important;
  background: #fdf0f0 !important;
  color: #8b3232 !important;
}
.joiners-mode-badge {
  display: inline-flex;
  margin-top: 10px;
  border: 1px solid #bbc5d6;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  color: #4f5663;
  background: #f2f5f9;
}
.joiners-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.joiners-summary-grid .ops-card h4 {
  margin: 0 0 8px;
}
.joiners-summary-grid .ops-card p {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: var(--ink);
}
.joiners-filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}
.joiners-filters select {
  width: 100%;
  border: 1px solid #bbc6d8;
  border-radius: 10px;
  padding: 10px 34px 10px 12px;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.25;
  color: #253146;
  background-color: #fffefb;
}
.joiners-list {
  display: grid;
  gap: 10px;
}
.joiner-card {
  border: 1px solid #cbd3e1;
  border-radius: 10px;
  background: #fbfcfd;
  padding: 12px;
}
.joiner-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.joiner-card p {
  margin: 4px 0;
  color: var(--ink-soft);
}
.joiners-pipeline-grid {
  margin-top: 8px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.joiners-stage-chip {
  width: 100%;
  text-align: left;
  border: 1px solid #ccd3e0;
  border-radius: 8px;
  background: #fafbfd;
  padding: 10px;
  font-family: inherit;
  color: var(--ink);
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.joiners-stage-chip:hover {
  border-color: #96a6c3;
  background: #f3f6fa;
}
.joiners-stage-chip.is-active {
  border-color: #4d80d2;
  background: #e8edf5;
  box-shadow: 0 0 0 1px rgba(77, 128, 210, 0.2);
}
.joiners-pipeline-grid strong {
  display: block;
  font-size: 20px;
  line-height: 1;
  margin-bottom: 6px;
}
.joiners-pipeline-grid span {
  font-size: 12px;
  color: var(--ink-soft);
}
.joiners-stage-members {
  margin-top: 10px;
  border: 1px solid #ccd3e0;
  border-radius: 10px;
  background: #fbfcfd;
  padding: 10px 12px;
}
.joiners-stage-members h5 {
  margin: 0 0 6px;
  font-size: 13px;
}
.joiners-stage-members ul {
  margin: 0;
  padding-left: 16px;
  display: grid;
  gap: 4px;
}
.joiners-stage-members li,
.joiners-stage-members p {
  margin: 0;
  color: #344460;
  font-size: 13px;
}
.joiners-stage-members li {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
}
.joiners-member-main {
  color: #344460;
}
.joiners-member-date {
  color: #5c6677;
  font-size: 12px;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.joiners-member-date::before {
  content: "·";
  margin-right: 6px;
  color: #8c9ab1;
}
.joiners-admin-toolbar {
  margin-bottom: 10px;
  display: grid;
  grid-template-columns: auto minmax(200px, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}
.tab-panel[data-panel="joiners"] .ops-card + .ops-card {
  margin-top: 8px;
}
.joiners-success-message {
  margin: 0 0 10px;
  border: 1px solid #b9d6bf;
  background: linear-gradient(180deg, #f6fcf6 0%, #eef8ef 100%);
  color: #1e5a2f;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 13px;
  line-height: 1.4;
}
.joiners-success-message[hidden] {
  display: none !important;
}
.joiners-selected-count {
  font-size: 12px;
  color: #555d6c;
  font-weight: 600;
}
.joiners-admin-toolbar input {
  border: 1px solid #bbc6d8;
  border-radius: 8px;
  padding: 8px 10px;
  font: inherit;
  font-size: 12px;
  color: #253146;
  background: #fffefb;
}
.joiners-simple-table > div {
  grid-template-columns: .45fr 1.1fr 1fr 1fr .8fr 1fr .7fr 1.2fr .9fr;
}
.joiners-completion-cell {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.joiners-completion-info-btn {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid #b5c2d7;
  background: #f6f8fb;
  color: #224a8a;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.joiners-completion-info-btn:hover {
  border-color: #6994d9;
  background: #e5eaf3;
  color: #2a384f;
}
.joiners-completion-overlay {
  position: fixed;
  inset: 0;
  z-index: 95;
  background: rgba(18, 23, 33, 0.46);
  display: grid;
  place-items: center;
  padding: 16px;
}
.joiners-completion-overlay[hidden] {
  display: none !important;
}
.joiners-completion-window {
  width: min(580px, 100%);
  border: 1px solid #c0cadc;
  border-radius: 12px;
  background: #fbfcfd;
  padding: 14px;
  display: grid;
  gap: 10px;
  box-shadow: 0 14px 34px rgba(20, 28, 42, 0.2);
}
.joiners-completion-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.joiners-completion-head strong {
  font-size: 14px;
}
.joiners-completion-close {
  border: 1px solid #b5c1d5;
  background: #f4f6fa;
  color: #344562;
  border-radius: 8px;
  min-height: 28px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.joiners-completion-close:hover {
  border-color: #6591d8;
  background: #e1e7f1;
}
.joiners-completion-body {
  display: grid;
  gap: 10px;
}
.joiners-completion-summary h5 {
  margin: 0 0 4px;
  font-size: 13px;
}
.joiners-completion-summary p {
  margin: 0;
  color: #2959a5;
}
.joiners-completion-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.joiners-completion-metrics span {
  border: 1px solid #d2d9e6;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
  font-size: 12px;
  color: #1f427a;
}
.joiners-completion-metrics strong {
  font-size: 13px;
}
.joiners-completion-status-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.joiners-completion-status-grid article {
  border: 1px solid #d1d9e7;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
  display: grid;
  gap: 3px;
}
.joiners-completion-status-grid span {
  font-size: 10px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #657186;
}
.joiners-completion-status-grid strong {
  font-size: 12px;
  color: #242f42;
}
.joiners-completion-process h6 {
  margin: 0 0 6px;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #2959a5;
}
.joiners-completion-process ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
}
.joiners-completion-step {
  border: 1px solid #d1d9e7;
  border-radius: 8px;
  background: #fff;
  padding: 7px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
}
.joiners-completion-step.is-done {
  border-color: #c9dfc0;
  background: #f2faef;
}
.joiners-completion-next {
  margin: 0;
  border: 1px solid #c8d1e0;
  border-radius: 8px;
  background: #f2f5f9;
  padding: 8px 9px;
  font-size: 12px;
  color: #344460;
}
.joiners-simple-table input[type="checkbox"] {
  width: 14px;
  height: 14px;
}
.joiners-training-cell {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.joiners-inline-send-btn {
  margin-top: 0;
  min-height: 20px;
  padding: 2px 8px;
  font-size: 11px;
  border-radius: 6px;
  border-color: #c1cbdb;
  background: #fffefa;
  font-weight: 500;
}
.joiners-inline-send-btn:hover {
  border-color: #9eacc4;
  background: #ecf0f7;
}
.leave-requests-table > div {
  grid-template-columns: 1.08fr 0.96fr 0.98fr 0.92fr 0.9fr 0.8fr 1.34fr 1.02fr;
  gap: 10px;
  align-items: center;
}
.leave-requests-table > div:not(:first-child) > span {
  align-self: center;
}
.leave-requests-table .status-pill {
  align-self: center;
  margin-top: 0;
}
.status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: start;
  align-self: center;
  width: max-content;
  border-radius: 999px;
  padding: 3px 8px;
  font-size: 11px;
  font-family: inherit;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1;
  border: 1px solid transparent;
}
.status-pending {
  color: #283f68;
  background: #f1f3f8;
  border-color: #b2c1dc;
}
.status-approved {
  color: #2f6e3f;
  background: #eff9f1;
  border-color: #c3e4ca;
}
.status-declined {
  color: #8a2f2f;
  background: #fdf0f0;
  border-color: #edc3c3;
}
.leave-empty-row {
  grid-template-columns: 1fr !important;
}
.leave-empty-row span {
  color: var(--ink-soft);
}
.leave-admin-actions {
  display: grid;
  grid-template-columns: repeat(2, max-content);
  align-content: start;
  gap: 6px;
}
.leave-admin-actions .leave-action-btn[data-leave-action="comment"] {
  grid-column: 1 / -1;
}
.leave-action-btn {
  border-radius: 7px;
  padding: 5px 8px;
  font-size: 11px;
  border-color: #b7c3d7;
  background: #f6f8fb;
}
.leave-action-btn:hover {
  border-color: #93a3c0;
  background: #e2e8f2;
}
.leave-comment-overlay {
  position: fixed;
  inset: 0;
  z-index: 1200;
  background: rgba(14, 18, 26, 0.36);
  display: grid;
  place-items: center;
  padding: 18px;
}
.leave-comment-overlay[hidden] {
  display: none !important;
}
.leave-comment-modal {
  width: min(520px, 100%);
  border: 1px solid #bdc7d9;
  border-radius: 12px;
  background: #fbfcfd;
  box-shadow: 0 22px 52px -34px rgba(0, 0, 0, 0.55);
  padding: 14px;
  display: grid;
  gap: 10px;
}
.leave-comment-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.leave-comment-close {
  border: 1px solid #bdc7d9;
  border-radius: 999px;
  background: #f4f6fa;
  color: #49505c;
  padding: 4px 9px;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}
.leave-comment-close:hover {
  border-color: #94a4c1;
  background: #e1e7f1;
}
.leave-comment-modal textarea {
  width: 100%;
  min-height: 94px;
  border: 1px solid #b5c1d6;
  border-radius: 8px;
  padding: 9px 10px;
  font: inherit;
  font-size: 13px;
  color: #1c2535;
  resize: vertical;
}
.leave-comment-modal textarea:focus {
  outline: none;
  border-color: #5988d5;
  box-shadow: 0 0 0 3px rgba(90, 138, 214, 0.16);
}
.leave-comment-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.training-mode-badge {
  display: inline-flex;
  margin-top: 10px;
  border: 1px solid #bbc5d6;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  color: #4f5663;
  background: #f2f5f9;
}
.documents-mode-badge {
  display: inline-flex;
  margin-top: 10px;
  border: 1px solid #bbc5d6;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  color: #4f5663;
  background: #f2f5f9;
}
.whatsapp-mode-badge {
  display: inline-flex;
  margin-top: 10px;
  border: 1px solid #bbc5d6;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  color: #4f5663;
  background: #f2f5f9;
}
.whatsapp-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.whatsapp-summary-grid .ops-card {
  padding: 12px;
}
.whatsapp-summary-grid h4 {
  margin: 0 0 8px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-soft);
}
.whatsapp-summary-grid p {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
}
#whatsappRegistrationCard {
  display: grid;
  gap: 10px;
}
#whatsappRegistrationCard .ops-grid-two {
  gap: 12px;
  margin-top: 4px;
}
#whatsappRegistrationCard .whatsapp-subcard + .whatsapp-subcard {
  margin-top: 2px;
}
.whatsapp-subcard {
  border: 1px solid #cdd7e7;
  border-radius: 10px;
  padding: 14px;
  background: #fbfcfd;
}
.whatsapp-subcard h5 {
  margin: 0 0 8px;
  font-size: 14px;
}
.whatsapp-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.whatsapp-field {
  display: grid;
  gap: 5px;
}
.whatsapp-field > span {
  font-size: 11px;
  font-weight: 600;
  color: #4e5767;
  letter-spacing: 0.01em;
}
.whatsapp-field-full {
  grid-column: 1 / -1;
}
.field-required-icon {
  color: #255db6;
  font-weight: 700;
  margin-left: 2px;
}
.whatsapp-required-note {
  margin-top: 8px;
  font-size: 12px;
  color: #5a6476;
}
#whatsappRegistrationCard .leave-request-actions {
  margin-bottom: 8px;
}
#whatsappAddEmployeeSuccess {
  margin-top: 8px;
  margin-bottom: 8px;
}
.whatsapp-form-grid input,
.whatsapp-paste-area {
  width: 100%;
  border: 1px solid #b6c3d8;
  border-radius: 8px;
  padding: 8px 10px;
  font: inherit;
  font-size: 13px;
  color: var(--ink);
  background: #fff;
}
.whatsapp-type-dropdown {
  position: relative;
}
.whatsapp-type-trigger {
  width: 100%;
  border: 1px solid #b6c3d8;
  border-radius: 8px;
  padding: 8px 34px 8px 10px;
  font: inherit;
  font-size: 13px;
  color: #565e6c;
  text-align: left;
  background: #fffefb;
  cursor: pointer;
  position: relative;
}
.whatsapp-type-trigger::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 14px;
  height: 14px;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%2361503f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}
.whatsapp-type-dropdown.is-open .whatsapp-type-trigger {
  border-color: #5988d5;
  box-shadow: 0 0 0 3px rgba(89, 136, 213, 0.18);
}
.whatsapp-type-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 50;
  border: 1px solid #b0bdd4;
  border-radius: 10px;
  background: #fffefc;
  box-shadow: 0 14px 26px -20px rgba(15, 23, 38, 0.5);
  padding: 6px;
  display: grid;
  gap: 3px;
  max-height: min(300px, 48vh);
  overflow-y: auto;
}
.whatsapp-type-menu[hidden] {
  display: none !important;
}
.whatsapp-type-option {
  border: 0;
  background: transparent;
  color: #253145;
  font: inherit;
  font-size: 13px;
  text-align: left;
  border-radius: 7px;
  padding: 7px 8px;
  cursor: pointer;
}
.whatsapp-type-option:hover {
  background: #e3e8f2;
}
.whatsapp-type-option.is-active {
  background: #c6d2e6;
  color: #1b2331;
}
.whatsapp-form-grid select {
  width: 100%;
  border: 1px solid #b6c3d8;
  border-radius: 8px;
  padding: 8px 34px 8px 10px;
  font: inherit;
  font-size: 13px;
  color: var(--ink);
  background-color: #fffefb;
}
.whatsapp-form-grid input:focus,
.whatsapp-form-grid select:focus,
.whatsapp-paste-area:focus {
  outline: none;
  border-color: #5988d5;
  box-shadow: 0 0 0 3px rgba(89, 136, 213, 0.18);
}
.whatsapp-form-grid > input:last-child {
  grid-column: 1 / -1;
}
.whatsapp-added-list {
  margin-top: 10px;
  border: 1px solid #c4cede;
  border-radius: 10px;
  background: #f7f8fb;
  padding: 10px 12px;
}
.whatsapp-added-list h6 {
  margin: 0 0 8px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #5b6577;
}
.whatsapp-added-list-grid {
  display: grid;
  gap: 8px;
}
.whatsapp-added-item {
  border: 1px solid #d2dae9;
  border-radius: 8px;
  background: #fff;
  padding: 8px 10px;
  display: grid;
  gap: 3px;
}
.whatsapp-added-item strong {
  font-size: 13px;
  color: #1b2331;
}
.whatsapp-added-item span {
  font-size: 12px;
  color: #575f6c;
}
.whatsapp-dropzone {
  border: 1px dashed #acbad0;
  border-radius: 8px;
  padding: 14px;
  background: #f7f8fb;
  color: #535b6a;
  font-size: 13px;
}
.whatsapp-paste-area {
  margin-top: 10px;
  min-height: 92px;
  resize: vertical;
}
.whatsapp-group-grid,
.whatsapp-workflow-grid {
  display: grid;
  gap: 10px;
}
.whatsapp-group-item,
.whatsapp-workflow-item {
  border: 1px solid #cdd7e7;
  border-radius: 10px;
  padding: 12px;
  background: #fbfcfd;
}
.whatsapp-group-item strong,
.whatsapp-workflow-item strong {
  display: block;
  margin-bottom: 6px;
}
.whatsapp-group-item p,
.whatsapp-workflow-item p {
  margin: 0 0 6px;
}
.whatsapp-message-box {
  margin-top: 12px;
  border: 1px solid #cdd7e7;
  border-radius: 10px;
  padding: 12px;
  background: #fbfcfd;
}
.whatsapp-message-box p {
  margin: 0 0 8px;
}
.whatsapp-message-box p:last-child {
  margin-bottom: 0;
}
.reports-mode-badge {
  display: inline-flex;
  margin-top: 10px;
  border: 1px solid #bbc5d6;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  color: #4f5663;
  background: #f2f5f9;
}
.reports-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.reports-status-grid .ops-card {
  padding: 12px;
}
.reports-status-grid h4 {
  margin: 0 0 8px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-soft);
}
.reports-status-grid p {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
}
.reports-builder-grid {
  display: grid;
  grid-template-columns: minmax(220px, 280px) auto;
  gap: 10px;
  margin: 12px 0;
  align-items: end;
}
.reports-builder-grid label {
  display: grid;
  gap: 6px;
  font-size: 12px;
  color: var(--ink-soft);
}
.reports-actions-inline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.reports-frequency-dropdown {
  position: relative;
}
.reports-frequency-trigger {
  width: 100%;
  border: 1px solid #b6c3d8;
  border-radius: 10px;
  padding: 9px 34px 9px 12px;
  font: inherit;
  font-size: 13px;
  color: var(--ink);
  line-height: 1.25;
  text-align: left;
  background: #fffefb;
  cursor: pointer;
  position: relative;
}
.reports-frequency-trigger::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 14px;
  height: 14px;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%2361503f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 9l6 6l6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}
.reports-frequency-dropdown.is-open .reports-frequency-trigger {
  border-color: #5988d5;
  box-shadow: 0 0 0 3px rgba(89, 136, 213, 0.16);
}
.reports-frequency-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 30;
  border: 1px solid #b4c0d5;
  border-radius: 10px;
  background: #fffefb;
  box-shadow: 0 14px 26px -20px rgba(15, 23, 38, 0.5);
  padding: 6px;
  display: none;
  gap: 3px;
}
.reports-frequency-menu[hidden] {
  display: none !important;
}
.reports-frequency-dropdown.is-open .reports-frequency-menu {
  display: grid;
}
.reports-frequency-option {
  border: 0;
  background: transparent;
  color: #253146;
  font: inherit;
  font-size: 13px;
  text-align: left;
  border-radius: 7px;
  padding: 7px 8px;
  cursor: pointer;
}
.reports-frequency-option:hover {
  background: #e3e8f2;
}
.reports-frequency-option.is-active {
  background: #c6d2e6;
  color: #1b2331;
}
.reports-preview-banner {
  display: grid;
  gap: 2px;
  margin: 10px 0 12px;
  padding: 10px 12px;
  border: 1px solid #d2d9e6;
  border-radius: 10px;
  background: #f4f6fa;
}
.reports-preview-banner strong {
  font-size: 12px;
  color: #232e40;
}
.reports-preview-banner span {
  font-size: 12px;
  line-height: 1.4;
  color: #59606c;
}
.reports-preview-banner.is-live {
  background: #f3f8f4;
  border-color: #d5e5d8;
}
.reports-preview-banner.is-live strong {
  color: #2f4a35;
}
.reports-generation-steps {
  display: grid;
  gap: 14px;
}
.reports-step-label {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #606877;
}
.reports-cadence-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.reports-cadence-card {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #c7cedb;
  border-radius: 10px;
  background: #fffefb;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.reports-cadence-card:hover:not(:disabled) {
  border-color: #8c9ab2;
  background: #f7f8fb;
}
.reports-cadence-card.is-active {
  border-color: #1a2230;
  background: #19212e;
  box-shadow: 0 10px 20px -16px rgba(12, 16, 22, 0.55);
}
.reports-cadence-card.is-active .reports-cadence-title,
.reports-cadence-card.is-active .reports-cadence-period {
  color: #f3f5f9;
}
.reports-cadence-card.is-active .reports-cadence-quota:not(.is-locked) {
  border-color: rgba(243, 245, 249, 0.35);
  color: #d9e1ee;
  background: rgba(255, 255, 255, 0.08);
}
.reports-cadence-card.is-locked {
  opacity: 0.72;
  cursor: not-allowed;
}
.reports-cadence-title {
  font-size: 14px;
  font-weight: 700;
  color: #1c2433;
}
.reports-cadence-period {
  font-size: 12px;
  color: #59606c;
}
.reports-cadence-quota {
  display: inline-flex;
  width: fit-content;
  margin-top: 2px;
  border: 1px solid #c7d1e2;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 600;
  color: #214886;
  background: #ecf0f6;
}
.reports-cadence-quota.is-used {
  color: #1c488f;
  background: #ebeff6;
  border-color: #bfcce2;
}
.reports-cadence-quota.is-locked {
  color: #49505c;
  background: #e5e9ef;
}
.reports-scope-panel {
  border: 1px solid #cdd7e7;
  border-radius: 10px;
  background: #fffefb;
  padding: 12px;
}
.reports-scope-lede {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.45;
  color: #2e3c55;
}
.reports-scope-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}
.reports-scope-stats span {
  border: 1px solid #d2d9e6;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 600;
  color: #49505c;
  background: #f1f4f9;
}
.reports-scope-signal {
  margin: 0 0 8px;
  font-size: 12px;
  line-height: 1.4;
  color: #59606c;
}
.reports-scope-list {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 4px;
  font-size: 12px;
  line-height: 1.4;
  color: #2e3c55;
}
.reports-builder-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.reports-step-note {
  margin: 8px 0 0;
  font-size: 11px;
  line-height: 1.4;
  color: #606877;
}
.reports-library-head {
  margin-bottom: 10px;
}
.reports-library-hint {
  margin: 4px 0 0;
  font-size: 12px;
  line-height: 1.4;
  color: var(--ink-soft);
}
.reports-library-empty {
  margin: 0;
  padding: 10px 0 0;
  font-size: 13px;
  line-height: 1.45;
  color: #59606c;
}
.panel-title-row-compact {
  margin-bottom: 10px;
}
.panel-title-row-compact p {
  display: none;
}
.reports-compose-card.ops-card,
.reports-library-card.ops-card {
  padding: 14px 16px;
}
.reports-compose {
  display: grid;
  gap: 10px;
}
.reports-cadence-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  padding: 4px;
  border: 1px solid #ced5e2;
  border-radius: 10px;
  background: #eaeef5;
}
.reports-cadence-tab {
  border: 0;
  border-radius: 8px;
  padding: 8px 10px;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  color: #49505c;
  background: transparent;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.reports-cadence-tab:hover:not(:disabled) {
  background: #f7f8fb;
  color: #1c2433;
}
.reports-cadence-tab.is-active {
  background: #19212e;
  color: #f3f5f9;
  box-shadow: 0 6px 14px -12px rgba(12, 16, 22, 0.6);
}
.reports-cadence-tab.is-locked {
  opacity: 0.45;
  cursor: not-allowed;
}
.reports-compose-meta {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
  color: #59606c;
}
.reports-compose-cta {
  width: 100%;
  border: 0;
  border-radius: 10px;
  padding: 11px 14px;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  color: #f3f5f9;
  background: #19212e;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.15s ease;
}
.reports-compose-cta:hover:not(:disabled) {
  background: #232e40;
}
.reports-compose-cta:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.reports-compose-gate {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
  color: #214886;
}
.reports-compose-feedback {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.45;
}
.reports-compose-feedback--success {
  border: 1px solid #c8dcc9;
  background: #eef6ef;
  color: #2f4a35;
}
.reports-compose-feedback--info {
  border: 1px solid #ced5e2;
  background: #f1f4f9;
  color: #49505c;
}
.reports-compose-feedback--error {
  border: 1px solid #bfcce2;
  background: #ebeff6;
  color: #1c488f;
}
.reports-feedback-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  border-radius: 999px;
  background: #3d7a4a;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}
.reports-compose-link {
  border: 0;
  padding: 0;
  font: inherit;
  font-size: inherit;
  font-weight: 600;
  color: #1c488f;
  background: transparent;
  cursor: pointer;
  text-decoration: underline;
}
.reports-library-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.reports-library-toolbar h4 {
  margin: 0;
  font-size: 14px;
}
.reports-library-count {
  font-size: 12px;
  font-weight: 600;
  color: #606877;
}
.reports-compose.is-generating .reports-cadence-tab {
  opacity: 0.55;
  pointer-events: none;
}
.reports-generate-progress {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid #ced5e2;
  border-radius: 10px;
  background: #f7f8fb;
}
.reports-generate-progress-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 13px;
  color: #1c2433;
}
.reports-generate-progress-head span {
  font-size: 12px;
  font-weight: 700;
  color: #214886;
}
.reports-generate-progress-bar {
  height: 8px;
  border-radius: 999px;
  background: #dce2ed;
  overflow: hidden;
}
.reports-generate-progress-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #232e40 0%, #214886 100%);
  transition: width 0.35s ease;
}
.reports-generate-progress-step {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
  color: #59606c;
}
.reports-history-table-rich > div {
  grid-template-columns: minmax(0, 1fr) 76px 64px 64px minmax(156px, auto);
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
}
.reports-library-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
}
.reports-delete-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border: 1px solid #cbd5e5;
  border-radius: 8px;
  padding: 0;
  color: #1d4d9a;
  background: #f7f9fc;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.reports-delete-btn:hover {
  border-color: #8bace2;
  background: #eef1f7;
  color: #28416b;
}
.reports-history-table-rich .reports-library-headrow {
  padding: 8px 12px;
  font-size: 10px;
}
.reports-history-table-rich .reports-library-headrow span {
  text-align: center;
}
.reports-history-table-rich .reports-library-headrow span:first-child {
  text-align: left;
}
.reports-library-row.is-latest {
  border-color: #b4bed0;
  background: #f7f8fb;
  box-shadow: inset 3px 0 0 #19212e;
}
.reports-library-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.reports-library-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.reports-library-main strong {
  font-size: 13px;
  line-height: 1.3;
  color: #1c2433;
}
.reports-library-main span {
  font-size: 11px;
  line-height: 1.35;
  color: #59606c;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.reports-library-metric {
  display: block;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  color: #232e40;
}
.reports-library-metric.is-alert {
  color: #1d4d9a;
}
.reports-library-badge {
  display: inline-flex;
  flex-shrink: 0;
  border: 1px solid #ced5e2;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #59606c;
  background: #eaeef5;
}
.reports-library-badge.is-live {
  border-color: #c8dcc9;
  color: #2f4a35;
  background: #eef6ef;
}
.reports-history-table-rich .reports-preview-btn {
  width: 100%;
  border: 1px solid #c7cedb;
  border-radius: 8px;
  padding: 6px 10px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  color: #232e40;
  background: #fffefb;
  cursor: pointer;
}
.reports-history-table-rich .reports-preview-btn:hover {
  border-color: #8c9ab2;
  background: #f7f8fb;
}
@media (max-width: 960px) {
  .reports-history-table-rich > div {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "main preview"
      "metrics metrics"
      "meta meta";
  }
  .reports-history-table-rich .reports-library-headrow {
    display: none;
  }
  .reports-library-row .reports-library-main { grid-area: main; }
  .reports-library-row .reports-library-metric { display: none; }
  .reports-library-row .reports-library-actions { grid-area: preview; }
}
.reports-history-table-compact > div {
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto;
}
.reports-history-table-compact .reports-preview-btn {
  border: 1px solid #c7cedb;
  border-radius: 8px;
  padding: 5px 10px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  color: #232e40;
  background: #fffefb;
  cursor: pointer;
}
.reports-history-table-compact .reports-preview-btn:hover {
  border-color: #8c9ab2;
  background: #f7f8fb;
}
.reports-deck-preview {
  margin-top: 12px;
  border-top: 1px solid #cdd7e7;
  padding-top: 12px;
}
.reports-deck-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.reports-deck-toolbar strong {
  font-size: 13px;
  color: #1c2433;
}
.reports-deck-toolbar-actions {
  display: inline-flex;
  gap: 6px;
}
.reports-deck-frame {
  border: 1px solid #ced5e2;
  border-radius: 10px;
  overflow: hidden;
  background: #f4f7fb;
}
.reports-deck-frame iframe {
  display: block;
  width: 100%;
  height: min(52vh, 420px);
  border: 0;
}
.reports-generation-shell {
  border: 1px solid #c2ccde;
  border-radius: 10px;
  background: #f5f7fa;
  padding: 10px 11px;
  margin: 8px 0 10px;
  display: grid;
  gap: 8px;
}
.reports-generation-meta {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
}
.reports-generation-badge {
  border: 1px solid #b4c1d8;
  border-radius: 999px;
  padding: 3px 8px;
  background: #fffefb;
  font-size: 11px;
  color: #1f427b;
}
.reports-generation-hint {
  margin: 0;
  font-size: 12px;
  color: #244d8e;
}
.reports-builder-grid-clean {
  align-items: end;
}
.reports-generation-gate {
  margin-top: 10px;
  border: 1px solid #b9c7df;
  border-radius: 9px;
  background: #f1f3f8;
  padding: 9px 10px;
  display: grid;
  gap: 8px;
}
.reports-generation-gate p {
  margin: 0;
  font-size: 12px;
  color: #344561;
}
.reports-check-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}
.reports-check-grid label {
  display: flex;
  gap: 6px;
  align-items: center;
  font-size: 12px;
  color: var(--ink-soft);
}
.reports-theme-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 10px;
  margin-top: 10px;
}
.reports-theme-card {
  border: 1px solid #cdd7e7;
  border-radius: 10px;
  padding: 10px;
  background: #fbfcfd;
}
.reports-theme-card p {
  margin: 6px 0 0;
}
.reports-risk-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.reports-risk-grid > div {
  border: 1px solid #cdd7e7;
  border-radius: 10px;
  padding: 10px;
  background: #fbfcfd;
}
.reports-risk-grid p {
  margin: 8px 0 0;
  color: var(--ink-soft);
}
.reports-library-list {
  display: grid;
  gap: 10px;
}
.reports-library-item {
  border: 1px solid #cdd7e7;
  border-radius: 10px;
  padding: 10px;
  background: #fbfcfd;
}
.reports-library-item p {
  margin: 6px 0;
}
.reports-history-table > div {
  grid-template-columns: 1.7fr .8fr 1fr .7fr .7fr;
}
.reports-html-preview {
  border: 1px solid #cdd7e7;
  border-radius: 10px;
  background: #fbfcfd;
  padding: 12px;
  margin-top: 10px;
}
.reports-html-preview h5 {
  margin: 0 0 6px;
}
.reports-html-preview p {
  margin: 0 0 8px;
}
.reports-deck-preview {
  margin-top: 12px;
  border: 1px solid #bcc7da;
  border-radius: 10px;
  background: linear-gradient(180deg, #fbfcfd 0%, #eff2f8 100%);
  padding: 12px;
}
.reports-deck-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.reports-deck-head strong {
  color: #1c2433;
}
.reports-deck-head span {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #5d6777;
  border: 1px solid #bfc9db;
  border-radius: 999px;
  padding: 3px 8px;
  background: #f4f6fa;
}
.reports-deck-preview > p {
  margin: 0 0 10px;
  color: #49505d;
}
.reports-deck-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.reports-deck-download {
  margin-top: 0;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}
.reports-deck-download.is-disabled {
  pointer-events: none;
  opacity: 0.6;
  cursor: not-allowed;
}
.reports-deck-frame {
  border: 1px solid #bec9db;
  border-radius: 10px;
  overflow: hidden;
  background: #1a1d23;
}
.reports-deck-frame iframe {
  width: 100%;
  min-height: 700px;
  border: 0;
  display: block;
  background: #1a1d23;
}
.reports-deck-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.reports-deck-card {
  border: 1px solid #c6d0e1;
  border-radius: 10px;
  background: #fffefb;
  padding: 10px;
}
.reports-deck-card h5 {
  margin: 0 0 6px;
  color: #222d3f;
}
.reports-deck-card .ops-list {
  margin: 0;
  padding-left: 16px;
  color: #434a57;
}
.documents-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.tab-panel[data-panel="settings"] .ops-grid-two {
  gap: 16px;
  margin-bottom: 16px;
}
.tab-panel[data-panel="settings"] .ops-card {
  padding: 14px;
}
.settings-save-feedback {
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #cde7d4;
  border-radius: 8px;
  background: linear-gradient(180deg, #f4fbf6 0%, #ecf8ef 100%);
  color: #1f5d35;
  font-size: 12px;
  font-weight: 600;
  padding: 7px 10px;
}
.settings-save-feedback::before {
  content: "✓";
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: #e0f2e6;
  color: #207543;
  font-size: 11px;
  font-weight: 700;
}
.settings-save-feedback.settings-save-feedback-info {
  border-color: #d7dce4;
  background: linear-gradient(180deg, #f7f9fc 0%, #eef2f7 100%);
  color: #3f4e64;
}
.settings-save-feedback.settings-save-feedback-info::before {
  content: "i";
  background: #e7edf6;
  color: #4b607d;
}
.settings-save-feedback[hidden] {
  display: none !important;
}
.tab-panel[data-panel="documents"] .ops-grid-two {
  gap: 16px;
}
.tab-panel[data-panel="documents"] .ops-grid-two + .ops-grid-two {
  margin-top: 16px;
}
.tab-panel[data-panel="documents"] #documentsTemplatesCard {
  margin-top: 16px;
}
.tab-panel[data-panel="documents"] .ops-card {
  padding: 14px;
}
.tab-panel[data-panel="documents"] .preview-lock-btn {
  margin-top: 2px;
  min-height: 28px;
  padding: 5px 9px;
  border-radius: 7px;
  border-color: #c0cada;
  background: #eaeef5;
  font-size: 12px;
  font-weight: 600;
}
.tab-panel[data-panel="documents"] .preview-lock-btn:hover {
  border-color: #95a5c1;
  background: #d4ddec;
}
.tab-panel[data-panel="bot"] .preview-lock-btn,
.tab-panel[data-panel="reports"] .preview-lock-btn,
.tab-panel[data-panel="settings"] .preview-lock-btn {
  margin-top: 2px;
  min-height: 28px;
  padding: 5px 9px;
  border-radius: 7px;
  border-color: #c0cada;
  background: #eaeef5;
  font-size: 12px;
  font-weight: 600;
}
.tab-panel[data-panel="bot"] .preview-lock-btn:hover,
.tab-panel[data-panel="reports"] .preview-lock-btn:hover,
.tab-panel[data-panel="settings"] .preview-lock-btn:hover {
  border-color: #95a5c1;
  background: #d4ddec;
}
.tab-panel[data-panel="bot"] .mini-action-btn,
.tab-panel[data-panel="reports"] .mini-action-btn,
.tab-panel[data-panel="settings"] .mini-action-btn {
  min-height: 26px;
  padding: 4px 8px;
  border-radius: 7px;
  font-size: 12px;
}
.tab-panel[data-panel="bot"] #whatsappRegistrationCard .leave-request-actions .preview-lock-btn {
  margin-top: 0;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 6px;
  border-color: #c7d0df;
  background: #f1f3f8;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0;
}
.tab-panel[data-panel="bot"] #whatsappRegistrationCard .leave-request-actions .preview-lock-btn:hover {
  border-color: #9cacc9;
  background: #dae2ef;
}
.tab-panel[data-panel="bot"] #whatsappRegistrationCard .mini-action-btn {
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 11px;
}
.tab-panel[data-panel="bot"] #whatsappRegistrationCard .whatsapp-micro-btn {
  min-height: 28px !important;
  padding: 5px 11px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  line-height: 1.2;
}
.documents-action-feedback {
  margin-top: 8px;
  border: 1px solid #bbc6d8;
  border-radius: 8px;
  background: #e8ecf4;
  color: #344561;
  font-size: 12px;
  line-height: 1.4;
  padding: 7px 9px;
}
.documents-action-feedback[hidden] {
  display: none !important;
}
.documents-inline-form {
  margin-top: 8px;
  border: 1px solid #c5cede;
  border-radius: 9px;
  background: #fbfcfd;
  padding: 9px;
  display: grid;
  gap: 8px;
}
.documents-inline-form h5 {
  margin: 0;
  font-size: 12px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #224a89;
}
.documents-inline-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.documents-inline-form-grid input {
  width: 100%;
  border: 1px solid #c0cadc;
  border-radius: 8px;
  padding: 8px 10px;
  font: inherit;
  font-size: 13px;
  background: #fffefb;
}
.documents-inline-form-actions {
  display: inline-flex;
  gap: 6px;
}
.documents-import-preview {
  margin-top: 10px;
  border: 1px solid #c6cfde;
  border-radius: 9px;
  background: #fbfcfd;
  padding: 10px;
  display: grid;
  gap: 8px;
}
.documents-import-preview-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.documents-import-preview-head strong {
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #234b8c;
}
.documents-import-preview-head span {
  font-size: 12px;
  color: #254f92;
}
.documents-import-preview-table > div {
  grid-template-columns: 1.25fr 1fr 1fr .9fr .75fr;
}
.documents-import-preview-note {
  margin: 0;
  font-size: 12px;
  color: #234c8d;
}
.documents-import-preview-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.documents-import-registered-note {
  margin-top: 8px;
  border: 1px dashed #b8c3d5;
  border-radius: 8px;
  background: #f4f6fa;
  color: #334460;
  font-size: 12px;
  padding: 7px 9px;
}
.documents-summary-grid .ops-card {
  padding: 12px;
}
.documents-summary-grid h4 {
  margin: 0 0 8px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-soft);
}
.documents-summary-grid p {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
}
.documents-checklist-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.documents-checklist-progress-label {
  display: inline-flex;
  align-items: center;
  border: 1px solid #bcc7da;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 11px;
  color: #255094;
  background: #f3f5f9;
}
.documents-checklist-progress {
  height: 7px;
  border-radius: 999px;
  background: #dae1ee;
  overflow: hidden;
  margin-bottom: 10px;
}
.documents-checklist-progress > span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #81a6e0 0%, #4178d0 100%);
}
.documents-checklist-items {
  display: grid;
  gap: 7px;
}
.documents-checklist-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid #cad4e5;
  border-radius: 8px;
  background: #fbfcfd;
  padding: 7px 9px;
  font-size: 12px;
  color: #2b3950;
}
.documents-checklist-pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid #b8c3d6;
  padding: 1px 7px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.documents-checklist-pill-complete {
  border-color: #b8d9c4;
  background: #edf8f1;
  color: #2f6e49;
}
.documents-checklist-pill-missing {
  border-color: #bac8e0;
  background: #eef1f7;
  color: #2958a4;
}
.documents-checklist-pill-preview {
  border-color: #cfc6e9;
  background: #f4f0fd;
  color: #5f4e93;
}
.documents-checklist-pill-access {
  border-color: #bdc6d6;
  background: #ecf0f7;
  color: #2a5aa7;
}
.documents-template-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}
.documents-template-card {
  border: 1px solid #cdd7e7;
  border-radius: 10px;
  padding: 12px;
  background: #fbfcfd;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.documents-hr-health-grid {
  margin-top: 8px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.documents-hr-health-item {
  border: 1px solid #c9d3e5;
  border-radius: 8px;
  background: #f7f8fb;
  padding: 8px 9px;
  display: grid;
  gap: 3px;
}
.documents-hr-health-item strong {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #244d90;
}
.documents-hr-health-item span {
  font-size: 12px;
  color: #2f3d56;
}
.documents-hr-actions {
  margin-top: 10px;
}
.documents-library-table > div {
  grid-template-columns: 2fr .9fr .9fr .9fr .8fr .7fr;
}
.documents-preview-note {
  margin-top: 10px;
  border: 1px solid #b6c1d5;
  border-radius: 10px;
  background: #f4f6fa;
  padding: 10px 12px;
}
.documents-preview-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  border: 1px solid #b5c0d4;
  border-radius: 999px;
  padding: 5px 11px;
  margin: 0;
  font-family: inherit;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #2e3d56;
  background: #f6f8fb;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}
.documents-preview-btn:hover {
  background: #dee5f0;
  border-color: #759cdc;
  color: #253145;
  transform: translateY(-1px);
}
.documents-preview-note-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}
.documents-preview-note strong {
  display: block;
  color: #234c8f;
  margin-bottom: 4px;
}
.documents-preview-note h5 {
  margin: 2px 0 6px;
  font-size: 14px;
  color: #1c2535;
}
.documents-preview-note p {
  margin: 0;
  color: #49505c;
}
.documents-preview-close {
  border: 1px solid #bcc7db;
  background: #f6f8fb;
  color: #4b5463;
  border-radius: 999px;
  padding: 4px 9px;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}
.documents-preview-close:hover {
  border-color: #93a5c3;
  background: #e3e8f2;
}
.documents-preview-cta-row {
  margin-top: 8px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.documents-preview-cta-row span {
  color: #4e5662;
  font-size: 12px;
}
.documents-preview-frame {
  margin-top: 8px;
  border: 1px solid #b9c4d8;
  border-radius: 10px;
  overflow: hidden;
  background: #fbfcfd;
}
.documents-preview-frame iframe {
  width: 100%;
  min-height: 420px;
  border: 0;
  display: block;
}
.template-columns {
  margin: 0;
  color: var(--ink-soft);
  font-size: 12px;
  line-height: 1.45;
}
.training-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.training-summary-grid .ops-card h4 {
  margin: 0 0 8px;
}
.training-summary-grid .ops-card p {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
}
.training-questions-table > div {
  grid-template-columns: 2.2fr 1fr 1fr .5fr;
}
.training-action-list {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 8px;
}
.ops-chip-row {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ops-chip {
  border: 1px solid #c2cbdb;
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 12px;
  color: #585f6c;
  background: #f4f6fa;
}
.ops-chip.active {
  border-color: #5988d5;
  background: #cfd9ea;
  color: #222d3f;
}
.ops-list {
  margin: 0;
  padding-left: 18px;
  color: var(--ink-soft);
  display: grid;
  gap: 6px;
}
.preview-lock-banner {
  margin-top: 12px;
  border: 1px dashed #b8c2d4;
  border-radius: 8px;
  background: #f5f7fa;
  color: #505865;
  font-size: 13px;
  line-height: 1.45;
  padding: 10px 12px;
}
.preview-lock-banner-inline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.preview-lock-banner-inline .preview-lock-btn {
  margin-top: 0;
  white-space: nowrap;
}
.preview-lock-btn {
  margin-top: 10px;
  border: 1px solid #b8c2d4;
  border-radius: 8px;
  background: #dce3ef;
  color: #232e41;
  padding: 8px 12px;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.preview-lock-btn[aria-disabled="true"] {
  opacity: 0.82;
}
.preview-lock-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  border-color: #c2cad8;
  background: #e5e9f1;
}
.preview-lock-btn:disabled:hover {
  border-color: #c2cad8;
  background: #e5e9f1;
}
.preview-lock-btn:hover {
  border-color: #92a0b8;
  background: #cad4e6;
}
.reports-history-table .reports-preview-btn {
  margin-top: 0;
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 7px;
  border-color: #c7cedb;
  background: #fffdfa;
  color: #212b3d;
  font-size: 12px;
  font-weight: 600;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.85) inset;
}
.reports-history-table .reports-preview-btn:hover {
  border-color: #90a1be;
  background: #f2f5f9;
}
.ops-kpi-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.ops-kpi-row div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
}
.ops-kpi-row strong {
  display: block;
  font-size: 26px;
  line-height: 1;
}
.ops-kpi-row span {
  color: var(--ink-faint);
  font-size: 12px;
}
.feed-hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
}
.feed-hero h3 {
  font-size: 24px;
}
.feed-question {
  flex: 0 0 min(420px, 42%);
  border: 1px solid #c7d0df;
  border-radius: 10px;
  padding: 13px 14px 13px 42px;
  background: linear-gradient(180deg, #f7f8fb 0%, #e8ecf4 100%);
  position: relative;
  box-shadow: 0 8px 24px -18px rgba(42, 67, 110, 0.45);
}
.feed-question::before {
  content: "?";
  position: absolute;
  left: 13px;
  top: 14px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: rgba(47, 111, 237, 0.15);
  color: #2857a2;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}
.feed-question span {
  display: block;
  color: #2d62b6;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.feed-question strong {
  display: block;
  color: #1a2230;
  font-size: 17px;
  line-height: 1.32;
  letter-spacing: -0.01em;
}
.feed-intel-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(240px, 0.7fr);
  gap: 12px;
  margin-bottom: 12px;
}
.feed-ai-card,
.feed-metrics,
.feed-cluster-card,
.feed-section-head {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}
.feed-ai-card {
  padding: 18px;
}
.feed-ai-card h3 {
  margin: 0 0 10px;
  font-size: 22px;
  line-height: 1.2;
}
.feed-ai-card p {
  margin: 0;
  color: var(--ink-soft);
}
.feed-metrics {
  padding: 14px;
  display: grid;
  gap: 10px;
}
.feed-metrics div {
  border-bottom: 1px solid var(--line-soft);
  padding-bottom: 10px;
  color: var(--ink-soft);
  font-size: 14px;
}
.feed-metrics div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.feed-metrics span {
  display: block;
  color: var(--ink);
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 4px;
}
.feed-cluster-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}
.feed-calendar-shell {
  display: grid;
  grid-template-columns: 1.4fr .9fr;
  gap: 12px;
  margin-bottom: 12px;
  align-items: stretch;
  height: clamp(560px, 70vh, 700px);
}
.feed-monthly-shell {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.feed-monthly-shell .ops-card {
  padding: 14px;
}
.feed-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 10px;
}
.feed-panel-head h4 {
  margin: 0;
}
.feed-period-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  border: 1px solid #cbd2de;
  border-radius: 999px;
  background: #ecf0f6;
}
.feed-period-toggle button {
  border: 0;
  background: transparent;
  color: #255094;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  cursor: pointer;
  transition: background .16s ease, color .16s ease, box-shadow .16s ease;
}
.feed-period-toggle button.is-active {
  background: #ffffff;
  color: #1a2331;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}
.feed-period-toggle button:focus-visible {
  outline: 2px solid rgba(38, 100, 201, 0.38);
  outline-offset: 1px;
}
.feed-calendar-card {
  padding: 16px;
  height: 100%;
}
.feed-calendar-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.feed-calendar-controls {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.feed-calendar-controls .mini-action-btn {
  padding: 5px 10px;
  font-size: 11px;
}
.feed-calendar-head h4 {
  margin: 0;
}
.feed-calendar-head span {
  font-size: 13px;
  font-weight: 700;
  color: #254f93;
}
.feed-calendar-note {
  margin: 0 0 10px;
  font-size: 13px;
  color: var(--ink-soft);
}
.feed-month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}
.feed-weekday-head {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-faint);
  text-align: center;
  padding: 2px 0;
}
.feed-day-empty {
  min-height: 78px;
}
.feed-day-cell {
  border: 1px solid #c6d0e1;
  border-radius: 10px;
  min-height: 78px;
  background: #fafbfd;
  display: grid;
  gap: 4px;
  align-content: start;
  padding: 8px;
  text-align: left;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.feed-day-cell:hover {
  transform: translateY(-1px);
  border-color: #6390d8;
  box-shadow: 0 8px 18px -14px rgba(33, 72, 134, 0.45);
}
.feed-day-cell.is-active {
  border-color: #2d60b3;
  background: linear-gradient(180deg, #eff2f8 0%, #e1e7f1 100%) !important;
  box-shadow: 0 0 0 3px rgba(45, 96, 179, 0.28), 0 10px 20px -14px rgba(39, 63, 104, 0.5);
  transform: translateY(-1px);
}
.feed-day-cell.is-active span {
  color: #254f93;
}
.feed-day-cell.is-active strong {
  color: #161d2a;
}
.feed-day-cell.is-active p {
  color: #303f5a;
}
.feed-day-cell:not(.is-active):hover {
  background: #f6f8fb;
}
.feed-day-cell span {
  font-size: 11px;
  color: var(--ink-faint);
  text-transform: uppercase;
}
.feed-day-cell strong {
  font-size: 18px;
  line-height: 1;
  color: var(--ink);
}
.feed-day-cell p {
  margin: 0;
  font-size: 12px;
  color: var(--ink-soft);
}
.feed-day-cell.high {
  border-color: #e0b7b7;
  background: #fdf2f2;
}
.feed-day-cell.medium {
  border-color: #b9c7e0;
  background: #f2f5f9;
}
.feed-day-cell.low {
  border-color: #cfe0ca;
  background: #f4faf1;
}
.feed-day-cell.is-future {
  opacity: 0.55;
  background: #f6f7fa;
  border-color: #d6dbe5;
  cursor: default;
  transform: none !important;
  box-shadow: none !important;
}
.feed-day-detail-card {
  padding: 14px;
  display: grid;
  gap: 10px;
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.feed-day-detail-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.feed-day-detail-head h4 {
  margin: 0;
  font-size: 18px;
}
.feed-day-level {
  border: 1px solid #b8c2d4;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
}
.feed-day-level.high {
  color: #8c2d2d;
  border-color: #e1b7b7;
  background: #fdf1f1;
}
.feed-day-level.medium {
  color: #7a6127;
  border-color: #b0c0dc;
  background: #eff2f8;
}
.feed-day-level.low {
  color: #466d43;
  border-color: #c8ddc4;
  background: #f1f9ef;
}
.feed-day-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.feed-day-kpis > div {
  border: 1px solid #c8d1e1;
  border-radius: 8px;
  background: #fafbfd;
  padding: 8px;
  display: grid;
  gap: 3px;
}
.feed-day-kpis span {
  font-size: 11px;
  color: var(--ink-faint);
  text-transform: uppercase;
}
.feed-day-kpis strong {
  font-size: 18px;
}
.feed-day-section h5 {
  margin: 0 0 6px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #2958a3;
}
.feed-gap-item-btn {
  border: 1px solid #bcc7d9;
  border-radius: 8px;
  background: #fbfcfd;
  color: #232e40;
  font: inherit;
  font-size: 12px;
  padding: 5px 8px;
  cursor: pointer;
}
.feed-gap-item-btn:hover {
  border-color: #6b96da;
  background: #edf1f7;
}
.feed-gap-item-btn.is-active {
  border-color: #3972cd;
  background: #e0e6f1;
  color: #1a222f;
}
.feed-gap-issue-detail {
  margin-top: 8px;
  border: 1px solid #c3cdde;
  border-radius: 10px;
  background: #f4f6fa;
  padding: 8px 10px;
}
.feed-gap-issue-detail h5 {
  margin-bottom: 6px;
}
.feed-gap-issue-detail p {
  margin: 0;
}
.feed-action-table > div {
  grid-template-columns: .8fr 1fr 1fr .6fr;
}
.feed-action-table {
  margin-bottom: 6px;
}
.feed-manager-note {
  margin-top: 14px;
  margin-bottom: 0;
  padding: 9px 11px;
  border-left: 3px solid #4b7fd2;
  border-radius: 6px;
  background: #f1f3f8;
  font-style: italic;
  font-weight: 500;
  color: #30415e;
}
.feed-day-issues-table > div {
  grid-template-columns: 1.7fr 1.1fr .8fr .9fr;
}
.feed-day-training-table > div {
  grid-template-columns: 1fr .9fr .5fr 1.8fr;
}
.feed-monthly-issues-table > div {
  grid-template-columns: 1.65fr 1.15fr .72fr .85fr .83fr;
}
.feed-monthly-training-table > div {
  grid-template-columns: .95fr .86fr .48fr .58fr .72fr 1.3fr;
}
.feed-monthly-issues-table > div:first-child span,
.feed-monthly-training-table > div:first-child span {
  white-space: nowrap;
}
.feed-monthly-row {
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
}
.feed-monthly-row:hover {
  border-color: #b1bed4;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
}
.feed-monthly-row.is-active {
  border-color: #4278d0;
  background: #f4f6fa;
}
.feed-monthly-inline-detail {
  grid-template-columns: 1fr !important;
  border: 1px solid #cad2e0 !important;
  background: #fbfcfd;
  margin-top: -2px;
}
.feed-monthly-inline-detail h5 {
  margin: 0 0 6px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #2958a3;
}
.feed-monthly-inline-detail p {
  margin: 0 0 8px;
}
.feed-monthly-inline-detail h6 {
  margin: 8px 0 6px;
  font-size: 12px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #255095;
}
.feed-monthly-inline-detail .ops-list {
  margin: 0;
  padding-left: 18px;
}
.feed-training-guide-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 8px;
}
.feed-training-guide-step {
  border: 1px solid #d0d8e5;
  border-radius: 8px;
  background: linear-gradient(180deg, #fffefc 0%, #f3f5f9 100%);
  padding: 8px 9px;
  display: grid;
  gap: 4px;
}
.feed-training-guide-step span {
  font-size: 10px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #2c5fb1;
  font-weight: 600;
}
.feed-training-guide-step strong {
  font-size: 12px;
  color: #232e40;
  line-height: 1.35;
}
.feed-training-guide-step p {
  margin: 0;
  font-size: 12px;
  color: #204581;
  line-height: 1.4;
}
.feed-required-checklist {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 7px;
}
.feed-required-checklist li {
  display: grid;
  grid-template-columns: 16px 1fr;
  align-items: start;
  gap: 8px;
  border: 1px solid #d1d9e7;
  border-radius: 8px;
  background: #fff;
  padding: 8px 9px;
}
.feed-required-checklist-box {
  width: 14px;
  height: 14px;
  border-radius: 4px;
  border: 1px solid #a4b1c8;
  background: #fffefb;
  margin-top: 2px;
}
.feed-required-checklist li strong {
  font-size: 12px;
  color: #222c3e;
  line-height: 1.35;
}
.feed-required-checklist li p {
  margin: 2px 0 0;
  font-size: 12px;
  color: #204581;
  line-height: 1.35;
}
.feed-issue-analysis-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 4px;
}
.feed-issue-analysis-grid article {
  border: 1px solid #d1d9e7;
  border-radius: 8px;
  background: #fff;
  padding: 7px 8px;
  display: grid;
  gap: 3px;
}
.feed-issue-analysis-grid article span {
  font-size: 11px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #2b5dad;
}
.feed-issue-analysis-grid article strong {
  font-size: 12px;
  line-height: 1.35;
  color: #212b3d;
  font-weight: 600;
}
.feed-issue-analysis-full {
  grid-column: 1 / -1;
}
.feed-monthly-detail-card {
  margin-top: 10px;
  border: 1px solid #cad2e0;
  border-radius: 10px;
  background: #fbfcfd;
  padding: 10px 12px;
}
.feed-monthly-detail-card h5 {
  margin: 0 0 6px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #2958a3;
}
.feed-monthly-detail-card p {
  margin: 0 0 8px;
}
.feed-monthly-detail-card .ops-list {
  margin: 0;
  padding-left: 18px;
}
.feed-cluster-card {
  padding: 14px;
}
.feed-cluster-card h4 {
  margin: 10px 0 8px;
  font-size: 18px;
  line-height: 1.2;
}
.feed-signal-label {
  display: inline-flex;
  color: var(--accent);
  background: rgba(34, 96, 196, 0.08);
  border: 1px solid rgba(34, 96, 196, 0.18);
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.feed-cluster-card p {
  margin: 0 0 12px;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.45;
}
.feed-cluster-card div {
  color: var(--ink-soft);
  font-size: 13px;
}
.feed-section-head {
  padding: 14px 16px;
  margin-bottom: 12px;
}
.feed-section-head span {
  display: block;
  color: var(--ink);
  font-weight: 700;
  margin-bottom: 4px;
}
.feed-section-head p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 14px;
}
.live-feed {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.feed-item {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 14px;
}
.feed-time {
  font-family: inherit;
  font-size: 12px;
  color: var(--ink-faint);
}
.feed-who {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-faint);
  margin-bottom: 4px;
}
.feed-content p {
  margin: 0;
}

.workspace-chat {
  height: var(--workspace-pane-height);
  max-height: var(--workspace-pane-height);
  min-height: 0;
}
.training-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.training-header-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  margin-bottom: 12px;
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 14px;
}
.training-header-card h3 {
  margin: 0 0 8px;
  font-size: 25px;
  line-height: 1.15;
}
.training-header-card p {
  margin: 0;
  color: var(--ink-soft);
}
.training-header-metrics {
  display: grid;
  gap: 8px;
}
.training-header-metrics div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 13px;
  color: var(--ink-soft);
}
.training-header-metrics span {
  display: block;
  color: var(--ink);
  font-size: 24px;
  line-height: 1;
  font-weight: 700;
  margin-bottom: 4px;
}
.training-card-lg h4 {
  margin-bottom: 10px;
}
.training-actions-grid {
  margin-top: 12px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.training-action-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
}
.training-action-card h4 {
  margin: 10px 0;
  font-size: 20px;
  line-height: 1.2;
}
.training-action-card ul {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 7px;
  color: var(--ink-soft);
}

@media (max-width: 1100px) {
  .workspace-shell {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .workspace-shell.sidebar-collapsed {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    height: calc(100dvh - var(--workspace-mobile-nav-top, 120px) - 16px);
    max-height: calc(100dvh - var(--workspace-mobile-nav-top, 120px) - 16px);
    min-height: 0;
    overflow: hidden;
    padding-bottom: 8px;
  }
  .workspace-shell.sidebar-collapsed > .workspace-sidebar,
  .workspace-shell.sidebar-collapsed > .workspace-content {
    min-width: 0;
    max-width: 100%;
  }
  .workspace-shell.sidebar-collapsed .workspace-content {
    flex: 1 1 auto;
    min-height: 0;
    width: auto;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  }
  .workspace-shell.sidebar-collapsed .settings-workspace-footer {
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  }
  .workspace-shell.sidebar-collapsed .workspace-sidebar {
    flex: 0 0 58px;
    position: relative;
    top: auto;
    align-self: stretch;
    width: 58px;
    min-height: 0;
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 10px 6px;
  }
  .workspace-shell:not(.sidebar-collapsed) {
    display: grid;
    grid-template-columns: 1fr;
    height: auto;
    max-height: none;
    overflow: visible;
  }
  .workspace-shell:not(.sidebar-collapsed) .workspace-content {
    overflow: visible;
    max-height: none;
  }
  .workspace-shell.sidebar-collapsed .nav-tab-soon-badge {
    display: none;
  }
  .workspace-shell:not(.sidebar-collapsed) .workspace-sidebar {
    position: fixed;
    left: 0;
    top: var(--workspace-mobile-nav-top, 120px);
    bottom: 0;
    z-index: 200;
    width: min(300px, 88vw);
    max-height: none;
    min-height: 0;
    margin: 0;
    border-radius: 0 12px 12px 0;
    box-shadow: 12px 0 40px rgba(0, 0, 0, 0.28);
    overflow-y: auto;
  }
  .workspace-shell:not(.sidebar-collapsed)::before {
    content: "";
    position: fixed;
    inset: var(--workspace-mobile-nav-top, 120px) 0 0 0;
    z-index: 190;
    background: rgba(15, 12, 10, 0.45);
    pointer-events: auto;
  }
  .workspace-shell.sidebar-collapsed::before {
    display: none;
  }
  .workspace-sidebar {
    position: static;
    min-height: unset;
  }
  .demo-workspace-body .workspace-content {
    overflow-x: visible;
    max-width: 100%;
  }
  .demo-workspace-body .workspace-chat {
    height: auto;
    max-height: min(72dvh, calc(100dvh - var(--workspace-mobile-nav-top, 120px) - 40px));
    min-height: 280px;
  }
  .demo-workspace-body .suggested {
    grid-template-columns: 1fr;
    min-width: 0;
    flex-shrink: 0;
  }
  .kpi-grid {
    grid-template-columns: 1fr 1fr;
  }
  .issue-grid {
    grid-template-columns: 1fr;
  }
  .daily-brief-grid {
    grid-template-columns: 1fr;
  }
  .feed-hero {
    flex-direction: column;
  }
  .feed-question {
    flex-basis: auto;
    width: 100%;
  }
  .feed-intel-grid,
  .feed-cluster-grid,
  .feed-calendar-shell {
    grid-template-columns: 1fr;
    height: auto;
  }
  .feed-calendar-card,
  .feed-day-detail-card {
    height: auto;
  }
  .feed-day-detail-card {
    overflow-y: visible;
  }
  .feed-monthly-shell {
    grid-template-columns: 1fr;
  }
  .feed-panel-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
  .feed-month-grid {
    grid-template-columns: 1fr 1fr;
  }
  .feed-day-kpis {
    grid-template-columns: 1fr;
  }
  .feed-training-guide-grid {
    grid-template-columns: 1fr;
  }
  .training-grid {
    grid-template-columns: 1fr;
  }
  .training-header-card,
  .training-actions-grid {
    grid-template-columns: 1fr;
  }
  .access-tier-banner {
    flex-direction: column;
    align-items: flex-start;
  }
  .access-tier-banner--setup {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    margin: 8px 10px 0;
    padding: 8px 10px;
    font-size: 12px;
    line-height: 1.35;
  }
  .access-tier-banner--setup .access-tier-banner-text strong {
    display: inline;
    margin-right: 0.2em;
  }
  .access-tier-banner--setup .access-tier-actions {
    display: none;
  }
  .access-tier-actions {
    width: 100%;
    flex-wrap: wrap;
  }
  .demo-setup-row,
  .priority-grid,
  .role-picker {
    grid-template-columns: 1fr;
  }
  .industry-picker-row,
  .industry-picker-row--bottom {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .industry-picker-row--bottom .industry-pill {
    flex: initial;
    max-width: none;
  }
  .industry-picker-row--bottom .industry-pill[data-value="other"] {
    grid-column: 1 / -1;
  }
  .setup-item-row,
  .setup-item-row-employee {
    grid-template-columns: 1fr;
  }
  .ops-grid-two,
  .ops-kpi-row {
    grid-template-columns: 1fr;
  }
  .tab-panel[data-panel="locations"] .ops-grid-two > .ops-card {
    height: auto;
    overflow-y: visible;
  }
  .settings-form-grid {
    grid-template-columns: 1fr;
  }
  .settings-workspace-card {
    overflow: visible;
  }
  .settings-workspace-section {
    padding-left: 14px;
    padding-right: 14px;
  }
  .settings-workspace-footer {
    padding-left: 14px;
    padding-right: 14px;
  }
  .settings-form-grid-single,
  .settings-theme-row {
    max-width: none;
  }
  .workspace-content .ops-card,
  .workspace-content .tab-panel,
  .workspace-content .settings-workspace-card {
    max-width: 100%;
  }
  .workspace-content input,
  .workspace-content select,
  .workspace-content textarea,
  .workspace-content .settings-select-trigger {
    max-width: 100%;
    box-sizing: border-box;
  }
  .employees-filters {
    grid-template-columns: 1fr 1fr;
  }
  .employees-manager-score-grid {
    grid-template-columns: 1fr 1fr;
  }
  .leave-summary-grid {
    grid-template-columns: 1fr 1fr;
  }
  .leave-filters {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .joiners-summary-grid {
    grid-template-columns: 1fr 1fr;
  }
  .joiners-admin-toolbar {
    grid-template-columns: 1fr 1fr;
  }
  .joiners-pipeline-grid {
    grid-template-columns: 1fr 1fr;
  }
  .whatsapp-summary-grid {
    grid-template-columns: 1fr 1fr;
  }
  .reports-status-grid {
    grid-template-columns: 1fr 1fr;
  }
  .reports-builder-grid {
    grid-template-columns: 1fr;
  }
  .reports-cadence-grid {
    grid-template-columns: 1fr;
  }
  .reports-deck-grid {
    grid-template-columns: 1fr;
  }
  .reports-check-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .reports-risk-grid {
    grid-template-columns: 1fr;
  }
  .whatsapp-form-grid {
    grid-template-columns: 1fr;
  }
  .documents-summary-grid {
    grid-template-columns: 1fr 1fr;
  }
  .training-summary-grid {
    grid-template-columns: 1fr 1fr;
  }
  .ops-table > div,
  .issue-table > div {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .employee-table > div {
    grid-template-columns: 1.2fr 1fr 1fr .9fr .7fr .8fr !important;
    gap: 8px;
  }
}

@media (max-width: 760px) {
  .chat-head {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .chat-head-actions {
    margin-left: 0;
    width: 100%;
    justify-content: space-between;
  }
  .chat-head .sub {
    max-width: none;
    text-align: left;
  }
  .demo-workspace-body .workspace-chat {
    height: auto;
    max-height: min(72dvh, calc(100dvh - var(--workspace-mobile-nav-top, 120px) - 40px));
    min-height: 280px;
  }
  .demo-workspace-body .chat {
    min-height: 0;
  }
  .demo-workspace-body .chat-head-copy p {
    display: none;
  }
  .demo-workspace-body .workspace-chat {
    display: flex;
    flex-direction: column;
  }
  .demo-workspace-body .chat-body {
    flex: 1 1 auto;
    min-height: 0;
  }
  .demo-workspace-body .suggested--compact {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 6px 8px !important;
    min-height: 38px;
    overflow: visible;
  }
  .demo-workspace-body .suggested--compact .suggested-head {
    margin: 0 !important;
    flex: 0 0 auto;
  }
  .demo-workspace-body .suggested--compact .suggested-label {
    font-size: 9px !important;
    letter-spacing: 0.12em !important;
    white-space: nowrap !important;
    max-width: none;
    line-height: 1;
  }
  .demo-workspace-body .suggested--compact .suggested-more-btn {
    display: none !important;
  }
  .demo-workspace-body .suggested--compact .suggested-chips {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    min-width: 0 !important;
    gap: 6px !important;
    padding: 1px 2px 1px 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 14px), transparent 100%);
  }
  .demo-workspace-body .suggested--compact .suggested-chips::-webkit-scrollbar {
    display: none;
  }
  .demo-workspace-body .suggested--compact .suggested-chips .chip {
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    white-space: nowrap !important;
    overflow: visible;
    text-overflow: clip;
    padding: 5px 10px !important;
    font-size: 11px !important;
    line-height: 1.25 !important;
  }
  .demo-workspace-body .chat-input {
    flex-shrink: 0;
    padding: 8px;
    gap: 6px;
    min-width: 0;
  }
  .demo-workspace-body .chat-input input {
    min-width: 0;
    font-size: 13px;
    padding: 8px 12px;
  }
  .demo-workspace-body .chat-input button[type="submit"] {
    flex-shrink: 0;
    padding: 0 14px;
    font-size: 13px;
  }
  .demo-workspace-body .agent-followup-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .demo-workspace-body .agent-followup-row .chip {
    flex: 0 0 auto;
    max-width: min(240px, 72vw);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .suggested-actions {
    justify-self: end;
  }
  .locations-jump-form input {
    min-width: 100%;
    width: 100%;
  }
  .employees-jump-form {
    flex-direction: column;
    align-items: stretch;
  }
  .employees-filters {
    grid-template-columns: 1fr;
  }
  .employees-manager-score-grid {
    grid-template-columns: 1fr;
  }
  .location-detail-grid {
    grid-template-columns: 1fr;
  }
  .locations-focus-items {
    grid-template-columns: 1fr;
  }
  .location-report-grid {
    grid-template-columns: 1fr;
  }
  .login-overlay:not(.login-overlay-centered) {
    align-items: flex-start;
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .login-overlay-centered {
    align-items: center;
    justify-content: center;
    padding: max(16px, env(safe-area-inset-top, 0px)) 14px max(16px, env(safe-area-inset-bottom, 0px));
  }
  .login-overlay-centered .login-card {
    max-height: min(86dvh, calc(100dvh - 32px));
    margin: auto;
  }
  .login-overlay:not(.login-overlay-centered) .login-card {
    max-height: calc(100vh - 28px);
    padding: 20px;
  }
  .demo-gate-card {
    padding: 26px 22px 22px;
    border-radius: 16px;
  }
  .demo-gate-card h2 {
    font-size: 1.2rem;
  }
  .password-row {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .subscriber-panel-head {
    flex-direction: column;
    align-items: stretch;
  }
  .workspace-topbar {
    flex-direction: column;
    align-items: flex-start;
  }
  .workspace-controls {
    width: 100%;
    flex-wrap: wrap;
  }
  .notifications-wrap {
    margin-left: auto;
  }
  .leave-summary-grid,
  .leave-filters,
  .leave-calendar-grid,
  .joiners-summary-grid,
  .joiners-filters,
  .joiners-pipeline-grid,
  .whatsapp-summary-grid,
  .reports-status-grid,
  .documents-summary-grid,
  .documents-template-grid,
  .training-summary-grid {
    grid-template-columns: 1fr;
  }
  .joiners-admin-toolbar {
    grid-template-columns: 1fr;
  }
  .reports-builder-grid,
  .reports-check-grid {
    grid-template-columns: 1fr;
  }
  .modal-actions {
    flex-direction: column-reverse;
    align-items: stretch;
  }
  .kpi-grid {
    grid-template-columns: 1fr;
  }
  .workspace-header-card {
    flex-direction: column;
  }
}

/* ============ ADMIN LOGINS ============ */
.admin-body {
  min-height: 100vh;
  background:
    radial-gradient(1200px 380px at 20% -10%, rgba(210, 170, 120, 0.12) 0%, rgba(210, 170, 120, 0) 58%),
    radial-gradient(900px 300px at 100% 0%, rgba(120, 105, 185, 0.08) 0%, rgba(120, 105, 185, 0) 55%),
    #f3f2ee;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #1c2534;
}
.admin-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 28px;
  background: #0f141d;
  color: #e7ecf3;
  border-bottom: 1px solid #1a2230;
  box-shadow: 0 10px 30px -24px rgba(0, 0, 0, 0.7);
}
.admin-shell {
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
  padding: 30px 0 58px;
}
.admin-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}
.admin-metric-card {
  background: linear-gradient(180deg, #fffefc 0%, #f4f6fa 100%);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px 16px;
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}
.admin-metric-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, #4177cf 0%, #85a8e0 45%, rgba(133, 168, 224, 0) 100%);
}
.admin-metric-label {
  color: #67707e;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  font-weight: 600;
}
.admin-metric-value {
  font-size: 32px;
  line-height: 1.1;
  font-weight: 650;
  margin-top: 6px;
}
.admin-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  background: linear-gradient(180deg, #fffefc 0%, #f3f5f9 100%);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px;
  box-shadow: var(--shadow);
}
.admin-search-wrap {
  flex: 1 1 auto;
}
.admin-search-label {
  display: block;
  margin-bottom: 6px;
  color: #67707e;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  font-weight: 600;
}
.admin-search-wrap input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  padding: 10px 12px;
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink);
}
.admin-search-wrap input:focus-visible {
  outline: none;
  border-color: #5988d5;
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.12);
}
.admin-export-btn {
  border: 1px solid #c5cdda;
  background: #fffdfa;
  color: #232e41;
  border-radius: 10px;
  padding: 8px 12px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  min-height: 36px;
  white-space: nowrap;
  letter-spacing: 0.01em;
}
.admin-export-btn:hover {
  border-color: #96a1b4;
  background: #eef2f8;
  color: #131923;
}
.admin-hero {
  background: linear-gradient(180deg, #fffefc 0%, #f4f6fa 100%);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 24px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}
.admin-hero::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, #3770cd 0%, #85a8e1 40%, rgba(133, 168, 225, 0) 100%);
}
.admin-hero h1 {
  margin: 6px 0 8px;
  font-size: 42px;
  line-height: 1.04;
  letter-spacing: -0.02em;
  font-weight: 700;
}
.admin-hero p {
  margin: 0;
  color: var(--ink-soft);
  max-width: 74ch;
  font-size: 16px;
  line-height: 1.45;
}
.admin-clear-btn {
  border: 1px solid #ccd4e1;
  background: #f7f8fb;
  color: #214886;
  border-radius: 10px;
  padding: 8px 12px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  min-height: 36px;
  white-space: nowrap;
  letter-spacing: 0.01em;
}
.admin-clear-btn:hover {
  border-color: #739bdc;
  background: #eef2f8;
  color: #27539b;
}
.admin-topbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.admin-login-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 20px;
  background:
    radial-gradient(900px 420px at 12% -8%, rgba(47, 111, 237, 0.28) 0%, rgba(47, 111, 237, 0) 58%),
    #0c1220;
}
.admin-login-shell {
  width: min(440px, 100%);
}
.admin-login-card {
  background: #121a2b;
  border: 1px solid #243049;
  border-radius: 16px;
  padding: 28px 28px 24px;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.8) inset,
    0 18px 40px -28px rgba(22, 29, 41, 0.35);
  position: relative;
  overflow: hidden;
}
.admin-login-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, #2f6fed 0%, #6aa4ff 45%, rgba(106, 164, 255, 0) 100%);
}
.admin-login-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 22px;
}
.admin-login-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #f4f7fb;
  font-weight: 650;
  text-decoration: none;
}
.admin-login-brand .workspace-subbrand {
  color: #b7c4d8;
  font-weight: 600;
}
.admin-login-badge {
  border: 1px solid #243049;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #b7c4d8;
  background: #0c1220;
  white-space: nowrap;
}
.admin-login-copy {
  margin-bottom: 22px;
}
.admin-login-copy h1 {
  margin: 0 0 8px;
  font-size: 28px;
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #f4f7fb;
}
.admin-login-copy p {
  margin: 0;
  color: #b7c4d8;
  font-size: 14px;
  line-height: 1.55;
}
.admin-login-form {
  display: grid;
  gap: 10px;
}
.admin-login-label {
  display: block;
  color: #8ea0bb;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  font-weight: 600;
}
.admin-login-form input {
  width: 100%;
  border: 1px solid #243049;
  border-radius: 12px;
  padding: 12px 14px;
  font: inherit;
  font-size: 14px;
  color: #f4f7fb;
  background: #0c1220;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.admin-login-password-field {
  margin-bottom: 0;
}
.admin-login-password-field input {
  padding-right: 44px;
}
.admin-login-form input:focus-visible {
  outline: none;
  border-color: #3d8bff;
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.28);
}
.admin-login-submit {
  margin-top: 4px;
  width: 100%;
  border: 1px solid #2f6fed;
  border-radius: 12px;
  background: #2f6fed;
  color: #fff;
  padding: 12px 14px;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.admin-login-submit:hover:not(:disabled) {
  background: #1d5ad6;
  border-color: #1d5ad6;
}
.admin-login-submit:disabled {
  opacity: 0.7;
  cursor: wait;
}
.admin-login-error {
  margin: 0;
  color: #a33;
  font-size: 13px;
}
.admin-card {
  background: linear-gradient(180deg, #fffefc 0%, #f4f6fa 100%);
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: var(--shadow);
}
.admin-card + .admin-card {
  margin-top: 16px;
}
.admin-card-health .admin-table-head {
  border-bottom-color: rgba(76, 127, 210, 0.28);
}
.admin-health-body {
  padding: 14px 18px;
}
.admin-health-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
}
.admin-health-item {
  border: 1px solid #c8d2e2;
  border-radius: 9px;
  background: linear-gradient(180deg, #fffdfa 0%, #f0f3f8 100%);
  padding: 10px 11px;
  display: grid;
  gap: 4px;
}
.admin-health-item-label {
  color: var(--ink-faint);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 10px;
  font-weight: 600;
}
.admin-health-item-value {
  color: var(--ink);
  font-size: 22px;
  line-height: 1.1;
  font-weight: 700;
}
.admin-health-empty {
  border: 1px dashed #b5c0d4;
  border-radius: 8px;
  background: #f4f6fa;
  color: #4b5463;
  font-size: 13px;
  padding: 10px 12px;
}
.admin-card-signins .admin-table-head {
  border-bottom-color: rgba(102, 199, 131, 0.32);
}
.admin-card-events .admin-table-head {
  border-bottom-color: rgba(47, 111, 237, 0.24);
}
.admin-card-requests .admin-table-head {
  border-bottom-color: rgba(112, 98, 175, 0.26);
}
.admin-card-company-setup .admin-table-head {
  border-bottom-color: rgba(47, 104, 61, 0.24);
}
.admin-setup-detail {
  margin: 0 18px 18px;
  border: 1px solid #d2d9e6;
  border-radius: 8px;
  background: #fffefb;
  padding: 12px 14px;
}
.admin-setup-detail.hidden {
  display: none;
}
.admin-setup-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.admin-setup-detail-title {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.admin-setup-detail-title strong {
  font-size: 14px;
  color: #253146;
}
.admin-setup-detail-title span {
  font-size: 12px;
  color: #6f7887;
}
.admin-setup-detail-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #dce2ed;
  font-size: 12px;
  color: #4a515d;
}
.admin-setup-detail-fields em {
  font-style: normal;
  color: #7f8897;
  margin-right: 4px;
}
.admin-setup-detail-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.admin-setup-detail-section-head {
  margin-bottom: 6px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #6f7887;
}
.admin-setup-detail-empty {
  margin: 0;
  font-size: 12px;
  color: #8b93a0;
}
.admin-setup-detail-more {
  margin: 6px 0 0;
  font-size: 11px;
  color: #7f8897;
}
.admin-setup-mini-table-wrap {
  overflow: auto;
  max-height: 160px;
  border: 1px solid #dce2ed;
  border-radius: 6px;
  background: #fff;
}
.admin-setup-mini-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}
.admin-setup-mini-table th,
.admin-setup-mini-table td {
  padding: 5px 8px;
  border-bottom: 1px solid #e3e8f1;
  text-align: left;
  white-space: nowrap;
}
.admin-setup-mini-table th {
  position: sticky;
  top: 0;
  background: #f1f3f8;
  color: #6f7887;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 10px;
}
.admin-setup-mini-table tr:last-child td {
  border-bottom: none;
}
.admin-setup-detail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.admin-setup-detail-grid span {
  display: block;
  font-size: 11px;
  color: #626a77;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.admin-setup-detail-block {
  margin-top: 10px;
}
.admin-setup-detail-block pre {
  margin: 8px 0 0;
  padding: 10px;
  border-radius: 8px;
  background: #eaeef6;
  overflow: auto;
  font-size: 12px;
  line-height: 1.45;
}
@media (max-width: 900px) {
  .admin-setup-detail-columns {
    grid-template-columns: 1fr;
  }
}
.admin-table-setup th:last-child,
.admin-table-setup td:last-child {
  width: 90px;
  text-align: right;
}
.admin-table-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
  color: #59616e;
  background: linear-gradient(180deg, #fffdfa 0%, #eaeef6 100%);
}
.admin-table-head span {
  color: var(--ink);
  font-weight: 650;
}
.admin-table-head small {
  color: #727c8c;
  font-size: 11px;
  margin-left: 6px;
}
.admin-empty {
  padding: 44px 18px;
  color: var(--ink-faint);
  text-align: center;
  font-size: 14px;
  letter-spacing: 0.01em;
}
.admin-table-wrap {
  overflow-x: auto;
}
.admin-table {
  width: 100%;
  border-collapse: collapse;
}
.admin-table th,
.admin-table td {
  text-align: left;
  padding: 13px 18px;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
  font-size: 13px;
}
.admin-table th {
  color: #697180;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.admin-table td {
  color: #1c2534;
  font-weight: 500;
}
.admin-table tbody tr:nth-child(even) td {
  background: #f7f8fb;
}
.admin-table tbody tr:hover td {
  background: #eaeff6;
}
.admin-table tr:last-child td {
  border-bottom: 0;
}
.admin-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 62px;
  padding: 4px 10px;
  border: 1px solid #ccd3e0;
  border-radius: 999px;
  background: #e5eaf2;
  color: #454b55;
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.admin-card-signins .admin-badge {
  background: #edf7ef;
  border-color: #cde7d2;
  color: #2f6f48;
}
.admin-card-events .admin-badge {
  background: #eaeef6;
  border-color: #c9d4e6;
  color: #224a89;
}
.admin-card-requests .admin-badge {
  background: #f1eefc;
  border-color: #d7cfef;
  color: #57478f;
}
@media (max-width: 920px) {
  .admin-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .admin-toolbar {
    flex-direction: column;
    align-items: stretch;
  }
}

/* --- Internal outreach pipeline (/internal/pipeline) --- */
.pipeline-topbar-links {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.pipeline-region-link.is-active {
  border-color: #85a8e0;
  background: rgba(133, 168, 224, 0.18);
  color: #e7ecf3;
}
.pipeline-metrics {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.pipeline-metrics--region {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.pipeline-filters--region {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.pipeline-hub-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.pipeline-hub-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: linear-gradient(180deg, #fffefc 0%, #f4f6fa 100%);
  box-shadow: var(--shadow);
  text-decoration: none;
  color: inherit;
  position: relative;
  overflow: hidden;
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.pipeline-hub-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, #3770cd 0%, #85a8e1 40%, rgba(133, 168, 225, 0) 100%);
}
.pipeline-hub-card:hover {
  border-color: #739bdc;
  transform: translateY(-1px);
}
.pipeline-hub-label {
  color: #67707e;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  font-weight: 600;
}
.pipeline-hub-card h2 {
  margin: 0;
  font-size: 28px;
  line-height: 1.1;
  letter-spacing: -0.02em;
}
.pipeline-hub-card p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.45;
  flex: 1;
}
.pipeline-hub-cta {
  color: #214886;
  font-size: 13px;
  font-weight: 600;
}
.pipeline-toolbar-actions {
  display: flex;
  align-items: end;
  gap: 8px;
  flex-shrink: 0;
}
.pipeline-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
  background: linear-gradient(180deg, #fffefc 0%, #f3f5f9 100%);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px;
  box-shadow: var(--shadow);
}
.pipeline-select-native {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.pipeline-custom-select {
  position: relative;
  width: 100%;
}
.pipeline-custom-select-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  padding: 10px 12px;
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink);
  cursor: pointer;
  text-align: left;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.pipeline-custom-select-trigger:hover {
  border-color: #b5bfd1;
  background: #fffdfa;
}
.pipeline-custom-select.is-open .pipeline-custom-select-trigger,
.pipeline-custom-select-trigger:focus-visible {
  outline: none;
  border-color: #5988d5;
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.12);
}
.pipeline-custom-select-value {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pipeline-custom-select-chevron {
  width: 8px;
  height: 8px;
  border-right: 1.5px solid #727c8c;
  border-bottom: 1.5px solid #727c8c;
  transform: rotate(45deg) translateY(-2px);
  flex-shrink: 0;
  transition: transform 0.15s ease;
}
.pipeline-custom-select.is-open .pipeline-custom-select-chevron {
  transform: rotate(-135deg) translateY(1px);
}
.pipeline-custom-select-menu {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 260px;
  overflow-y: auto;
  border: 1px solid #ccd3e0;
  border-radius: 10px;
  background: #fffefc;
  box-shadow: 0 14px 36px -12px rgba(28, 37, 52, 0.28);
  padding: 6px;
}
.pipeline-custom-select-option {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  padding: 9px 10px;
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}
.pipeline-custom-select-option:hover {
  background: #eaeff6;
}
.pipeline-custom-select-option.is-selected {
  background: #eaeef6;
  color: #224a89;
  font-weight: 600;
}
.pipeline-custom-select-option.is-selected::after {
  content: "";
  width: 6px;
  height: 10px;
  border-right: 2px solid #3770cd;
  border-bottom: 2px solid #3770cd;
  transform: rotate(45deg);
  flex-shrink: 0;
}
.pipeline-custom-select--compact .pipeline-custom-select-trigger {
  padding: 8px 10px;
  font-size: 12px;
  border-radius: 8px;
}
.pipeline-custom-select--compact .pipeline-custom-select-menu {
  max-height: 220px;
}
.pipeline-table td .pipeline-custom-select {
  min-width: 150px;
}
.admin-card-pipeline .admin-table-head {
  border-bottom-color: rgba(65, 119, 207, 0.3);
}
.pipeline-table th,
.pipeline-table td {
  white-space: normal;
  vertical-align: top;
}
.pipeline-company-cell {
  min-width: 180px;
  font-weight: 600;
}
.pipeline-website-link {
  color: #224a89;
  font-weight: 600;
  text-decoration: none;
}
.pipeline-website-link:hover {
  text-decoration: underline;
}
.pipeline-updated-cell {
  min-width: 130px;
  color: #59606c;
  font-size: 12px;
}
.pipeline-notes-cell {
  min-width: 160px;
  max-width: 240px;
}
.pipeline-notes-wrap {
  display: grid;
  gap: 6px;
}
.pipeline-note-text {
  margin: 0;
  color: #232e41;
  font-size: 12px;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}
.pipeline-note-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.pipeline-note-btn {
  border: 1px dashed #b5bfd1;
  background: #f4f6fa;
  color: #224a89;
  border-radius: 8px;
  padding: 7px 10px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.pipeline-note-btn:hover {
  border-color: #739bdc;
  background: #eef2f8;
}
.pipeline-note-link {
  border: 0;
  background: transparent;
  color: #224a89;
  padding: 0;
  font: inherit;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.pipeline-note-link--muted {
  color: #727c8c;
}
.pipeline-notes-input {
  width: 100%;
  min-width: 160px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fffdfa;
  padding: 8px 10px;
  font: inherit;
  font-size: 12px;
  color: var(--ink);
  resize: vertical;
  line-height: 1.4;
}
.pipeline-notes-input:focus-visible {
  outline: none;
  border-color: #5988d5;
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.1);
}
.pipeline-priority {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border: 1px solid transparent;
}
.pipeline-priority--high {
  background: #eaeef6;
  border-color: #c9d4e6;
  color: #224a89;
}
.pipeline-priority--medium {
  background: #e5eaf2;
  border-color: #ccd3e0;
  color: #454b55;
}
.pipeline-priority--low {
  background: #edf2f7;
  border-color: #d5dee8;
  color: #4f5f6d;
}
.pipeline-standards-card {
  margin-bottom: 14px;
  background: linear-gradient(180deg, #fffefc 0%, #f4f6fa 100%);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 18px 20px;
  box-shadow: var(--shadow);
}
.pipeline-standards-title {
  margin: 4px 0 14px;
  font-size: 22px;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.pipeline-standards-grid {
  display: grid;
  grid-template-columns: minmax(220px, 0.9fr) minmax(0, 1.4fr);
  gap: 14px;
}
.pipeline-standard-block {
  padding: 14px 16px;
  border: 1px solid #d2d9e6;
  border-radius: 10px;
  background: #fffdfa;
}
.pipeline-standard-block-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.pipeline-standard-label {
  margin: 0 0 10px;
  color: #67707e;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.pipeline-standard-block-head .pipeline-standard-label {
  margin-bottom: 0;
}
.pipeline-standard-text {
  margin: 0;
  color: #232e41;
  font-size: 14px;
  line-height: 1.55;
}
.pipeline-standard-hint {
  margin: 10px 0 0;
  color: #67707e;
  font-size: 12px;
  line-height: 1.4;
}
.pipeline-copy-btn--done {
  border-color: #cde7d2;
  background: #edf7ef;
  color: #2f6f48;
}
.pipeline-table-wrap {
  -webkit-overflow-scrolling: touch;
}
@media (max-width: 1100px) {
  .pipeline-metrics,
  .pipeline-metrics--region {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pipeline-filters,
  .pipeline-filters--region {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pipeline-hub-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .pipeline-metrics,
  .pipeline-metrics--region {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pipeline-filters,
  .pipeline-filters--region {
    grid-template-columns: 1fr;
  }
  .pipeline-standards-grid {
    grid-template-columns: 1fr;
  }
  .pipeline-standard-block-head {
    flex-direction: column;
    align-items: stretch;
  }
  .pipeline-toolbar-actions {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }
}

/* Pilot workspace command center */
.pilot-command-center {
  display: grid;
  gap: 16px;
}

.pilot-command-center[data-pilot-phase="launch"] {
  gap: 12px;
}

.pilot-command-center[data-pilot-phase="launch"] .pilot-header-card {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 4px 2px 0;
}

.pilot-command-center[data-pilot-phase="launch"] .pilot-header-card .mini-badges {
  display: none;
}

.pilot-command-start,
.pilot-command-brief {
  border-radius: 18px;
  border: 1px solid rgba(26, 23, 21, 0.08);
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(239, 242, 248, 0.55) 0%, transparent 52%),
    linear-gradient(180deg, #fffdfa 0%, #f3f5f9 100%);
  box-shadow:
    0 1px 2px rgba(26, 23, 21, 0.04),
    0 18px 40px rgba(26, 23, 21, 0.06);
}

.pilot-command-start-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(240px, 0.85fr);
  gap: 28px;
  padding: 28px;
}

.pilot-command-main .pilot-launch-status {
  margin-bottom: 16px;
}

.pilot-launch-status.is-ready {
  border-color: rgba(47, 107, 63, 0.2);
  background: rgba(244, 250, 245, 0.95);
  color: #2f6b3f;
}

.pilot-launch-status.is-ready .pilot-launch-status-dot {
  background: #3f8f52;
  box-shadow: 0 0 0 3px rgba(63, 143, 82, 0.18);
}

.pilot-command-title {
  margin: 0 0 12px;
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.15;
  letter-spacing: -0.03em;
  font-weight: 600;
  max-width: 28ch;
}

.pilot-command-lead {
  margin: 0 0 20px;
  max-width: 52ch;
  color: var(--ob-ink-soft, #505661);
  font-size: 15px;
  line-height: 1.55;
}

.pilot-command-actions {
  margin-top: 4px;
}

.pilot-command-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.pilot-command-cta-row-primary {
  gap: 8px;
}

.pilot-command-action-btn {
  min-height: 40px;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 600;
  border-radius: 10px;
}

.pilot-command-center .btn-primary,
.pilot-command-center .pilot-launch-inline-copy {
  background: #2a61b9;
  border-color: #2a61b9;
  color: #fafbfd;
  box-shadow: 0 4px 14px rgba(42, 97, 185, 0.22);
}

.pilot-command-center .btn-primary:hover,
.pilot-command-center .pilot-launch-inline-copy:hover {
  background: #2455a3;
  border-color: #2455a3;
}

.pilot-command-center .btn-secondary {
  border-color: rgba(26, 23, 21, 0.14);
  background: #fff;
  color: #1a1715;
}

.pilot-command-center .btn-secondary:hover {
  background: #faf8f5;
  border-color: rgba(26, 23, 21, 0.22);
}

.pilot-command-cta-row-compact {
  margin-top: 18px;
}

.pilot-command-secondary {
  margin: 14px 0 0;
}

.pilot-command-secondary-link {
  color: var(--ob-ink-soft, #505661);
  font-size: 13px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.pilot-command-secondary-link:hover {
  color: #1a1715;
}

.pilot-command-link-btn {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}

.pilot-command-aside {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.pilot-status-cards {
  display: grid;
  gap: 12px;
}

.pilot-status-card {
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(26, 23, 21, 0.1);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 1px 2px rgba(26, 23, 21, 0.04);
}

.pilot-status-card--responses {
  border-color: rgba(42, 97, 185, 0.14);
  background: linear-gradient(135deg, #fffdfa 0%, #f6f8fb 100%);
}

.pilot-status-card--brief {
  background: linear-gradient(135deg, #fff 0%, #faf8f5 100%);
}

.pilot-status-progress {
  height: 6px;
  margin: 10px 0 8px;
  border-radius: 999px;
  background: rgba(26, 23, 21, 0.08);
  overflow: hidden;
}

.pilot-status-progress-fill {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2c66c4 0%, #2a61b9 100%);
  transition: width 0.35s ease;
}

.pilot-flow-steps-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 0 0 0.5rem;
}

.pilot-status-card--bot {
  border-color: rgba(53, 111, 205, 0.22);
  background: linear-gradient(180deg, rgba(53, 111, 205, 0.06) 0%, rgba(255, 255, 255, 0.98) 100%);
}

.pilot-bot-panel {
  margin-bottom: 20px;
}

.pilot-bot-panel-inner {
  padding: 20px;
  border-radius: 16px;
  border: 1px solid rgba(26, 23, 21, 0.1);
  background: linear-gradient(180deg, #fffdfa 0%, #f3f5f9 100%);
}

.pilot-bot-panel-lead {
  margin: 0 0 16px;
  color: var(--ob-ink-soft, #505661);
  font-size: 14px;
  line-height: 1.5;
}

.pilot-status-card-label {
  display: block;
  margin-bottom: 6px;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ob-ink-soft, #505661);
}

.pilot-status-card-value {
  display: block;
  font-size: 22px;
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin-bottom: 4px;
}

.pilot-status-card-meta {
  margin: 0;
  font-size: 13px;
  color: var(--ob-ink-soft, #505661);
}

.pilot-launch-step.is-complete .pilot-launch-step-num {
  background: #2f6b3f;
  color: #fff;
}

.pilot-brief-ready-banner {
  padding: 22px 28px 0;
}

.pilot-brief-ready-banner h2 {
  margin: 0 0 8px;
  font-size: 28px;
  letter-spacing: -0.03em;
}

.pilot-brief-ready-banner p {
  margin: 0;
  color: var(--ob-ink-soft, #505661);
}

.pilot-brief-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 18px 28px 0;
}

.pilot-brief-summary-card {
  padding: 16px;
  border-radius: 14px;
  border: 1px solid rgba(26, 23, 21, 0.1);
  background: rgba(255, 255, 255, 0.78);
}

.pilot-brief-summary-value {
  margin: 8px 0 0;
  font-size: 15px;
  line-height: 1.45;
}

.pilot-brief-ready-grid {
  padding: 18px 28px 0;
}

.pilot-evidence-card {
  margin: 18px 28px 0;
}

.pilot-evidence-list {
  display: grid;
  gap: 12px;
}

.pilot-evidence-item {
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(26, 23, 21, 0.08);
  background: #faf8f5;
}

.pilot-evidence-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin-bottom: 8px;
  font-size: 12px;
  color: var(--ob-ink-soft, #505661);
}

.pilot-evidence-source {
  font-weight: 650;
  color: #234b8b;
}

.pilot-action-item {
  align-items: flex-start;
}

.pilot-action-evidence {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: var(--ob-ink-soft, #505661);
}

.pilot-action-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.pilot-manual-modal {
  width: min(520px, calc(100vw - 32px));
  padding: 22px 24px;
  border-radius: 16px;
  background: #fffdfa;
  border: 1px solid rgba(26, 23, 21, 0.1);
  box-shadow: 0 24px 60px rgba(26, 23, 21, 0.18);
}

.pilot-manual-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.pilot-manual-modal-head h2 {
  margin: 0;
  font-size: 22px;
}

.pilot-manual-modal-close {
  border: 0;
  background: transparent;
  color: var(--ob-ink-soft, #505661);
  font-weight: 600;
  cursor: pointer;
}

.pilot-manual-modal-lead {
  margin: 0 0 16px;
  color: var(--ob-ink-soft, #505661);
  font-size: 14px;
  line-height: 1.45;
}

.pilot-manual-form {
  display: grid;
  gap: 10px;
}

.pilot-manual-label {
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ob-ink-soft, #505661);
}

.pilot-manual-input,
.pilot-manual-textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border: 1px solid rgba(26, 23, 21, 0.12);
  border-radius: 10px;
  font: inherit;
  background: #fff;
}

.pilot-manual-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 8px;
}

.pilot-action-toast {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 12000;
  padding: 12px 16px;
  border-radius: 10px;
  background: #131923;
  color: #f4f6fa;
  font-size: 14px;
  box-shadow: 0 12px 30px rgba(26, 23, 21, 0.2);
}

.pilot-command-brief .pilot-questions-card {
  margin: 18px 28px 0;
}

@media (max-width: 900px) {
  .pilot-command-start-inner,
  .pilot-brief-summary-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .pilot-launch-link-row.pilot-link-row {
    flex-direction: column;
  }

  .pilot-launch-inline-copy {
    width: 100%;
    min-width: 0;
  }

  .pilot-command-cta-row-primary {
    flex-direction: column;
    align-items: stretch;
  }

  .pilot-command-action-btn {
    width: 100%;
    justify-content: center;
  }
}

.pilot-launch-panel {
  border-radius: 18px;
  border: 1px solid rgba(26, 23, 21, 0.08);
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(239, 242, 248, 0.55) 0%, transparent 52%),
    linear-gradient(180deg, #fffdfa 0%, #f3f5f9 100%);
  box-shadow:
    0 1px 2px rgba(26, 23, 21, 0.04),
    0 18px 40px rgba(26, 23, 21, 0.06);
}

.pilot-launch-panel-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(240px, 0.85fr);
  gap: 28px;
  padding: 28px 28px 26px;
}

.pilot-launch-main {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}

.pilot-launch-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  margin-bottom: 14px;
  padding: 6px 12px 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(47, 107, 63, 0.16);
  background: rgba(244, 250, 245, 0.9);
  color: #2f6b3f;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.01em;
}

.pilot-launch-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #3f8f52;
  box-shadow: 0 0 0 3px rgba(63, 143, 82, 0.18);
}

.pilot-launch-title {
  margin: 0 0 10px;
  font-size: clamp(24px, 2.6vw, 32px);
  line-height: 1.12;
  letter-spacing: -0.03em;
  font-weight: 600;
  max-width: 16ch;
}

.pilot-launch-lead {
  margin: 0 0 18px;
  max-width: 44ch;
  color: var(--ob-ink-soft, #505661);
  font-size: 15px;
  line-height: 1.55;
}

.pilot-launch-link-block {
  margin-top: 4px;
  padding: 16px;
  border-radius: 16px;
  border: 1px solid rgba(26, 23, 21, 0.1);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.pilot-launch-link-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.pilot-launch-link-label {
  display: block;
  margin: 0;
  color: var(--ob-ink-soft, #505661);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.pilot-launch-channel-pill {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(37, 211, 102, 0.35);
  background: rgba(37, 211, 102, 0.1);
  color: #1a7a42;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.pilot-launch-link-row.pilot-link-row {
  margin-bottom: 0;
  align-items: stretch;
  gap: 8px;
}

.pilot-launch-url-shell {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  border: 1px solid rgba(26, 23, 21, 0.12);
  border-radius: 11px;
  background: #faf8f5;
  overflow: hidden;
}

.pilot-launch-url-shell .pilot-link-input {
  border: 0;
  border-radius: 0;
  background: transparent;
  min-height: 44px;
}

.pilot-launch-inline-copy {
  flex-shrink: 0;
  min-height: 44px;
  min-width: 96px;
  padding: 0 16px;
  border-radius: 11px;
  font-size: 13px;
  font-weight: 650;
  white-space: nowrap;
}

.pilot-launch-link-hint {
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--ob-ink-soft, #505661);
}

.pilot-launch-url-field {
  background: transparent;
  color: #1a1715;
  -webkit-text-fill-color: #1a1715;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px;
  line-height: 1.35;
  min-height: 44px;
}

.pilot-launch-status.is-pending {
  border-color: rgba(47, 111, 237, 0.2);
  background: rgba(241, 244, 249, 0.95);
  color: #234b8b;
}

.pilot-launch-status.is-pending .pilot-launch-status-dot {
  background: #2c66c4;
  box-shadow: 0 0 0 3px rgba(44, 102, 196, 0.18);
}

.pilot-launch-copy-btn {
  flex-shrink: 0;
  min-width: 72px;
  white-space: nowrap;
}

.pilot-launch-link-foot {
  margin-top: 10px;
}

.pilot-link-input.is-empty {
  color: #747e8e;
  font-style: italic;
}

.pilot-launch-copy-btn:disabled,
.sidebar-cta:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.pilot-launch-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 18px;
}

.pilot-launch-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 22px;
  font-size: 15px;
  font-weight: 650;
  border-radius: 11px;
}

.pilot-launch-cta-icon {
  display: inline-flex;
  width: 18px;
  height: 18px;
}

.pilot-launch-cta-icon svg {
  width: 18px;
  height: 18px;
}

.pilot-launch-secondary {
  color: var(--ob-ink-soft, #505661);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid rgba(80, 86, 97, 0.28);
  transition: color 0.15s ease, border-color 0.15s ease;
}

.pilot-launch-secondary:hover {
  color: var(--ink, #1a1715);
  border-color: rgba(26, 23, 21, 0.45);
}

.pilot-launch-secondary.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}

.pilot-launch-steps {
  list-style: none;
  margin: 0;
  padding: 18px 18px 16px;
  border-radius: 14px;
  border: 1px solid rgba(26, 23, 21, 0.07);
  background: rgba(255, 255, 255, 0.72);
  display: grid;
  gap: 0;
}

.pilot-launch-step {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 14px 0;
  position: relative;
}

.pilot-launch-step:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 15px;
  top: 42px;
  bottom: -2px;
  width: 1px;
  background: rgba(26, 23, 21, 0.1);
}

.pilot-launch-step.is-active .pilot-launch-step-num {
  background: #2a61b9;
  color: #fafbfd;
  border-color: #2a61b9;
  box-shadow: 0 4px 12px rgba(42, 97, 185, 0.22);
}

.pilot-launch-step.is-active strong {
  color: var(--ink, #1a1715);
}

.pilot-launch-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  border: 1px solid rgba(26, 23, 21, 0.12);
  background: #faf8f5;
  color: var(--ob-ink-soft, #505661);
  font-size: 13px;
  font-weight: 700;
}

.pilot-launch-step-copy strong {
  display: block;
  margin-bottom: 2px;
  font-size: 14px;
  color: var(--ob-ink-soft, #505661);
}

.pilot-launch-step-copy p {
  margin: 0;
  color: var(--ob-ink-faint, #747e8e);
  font-size: 13px;
  line-height: 1.4;
}

body.pilot-dashboard-launch .sidebar-pilot-card {
  background: rgba(239, 242, 248, 0.04);
}

body.pilot-dashboard-launch .sidebar-pilot-card p {
  margin-bottom: 0;
}

body.pilot-dashboard-collecting .sidebar-pilot-label,
body.pilot-dashboard-launch .sidebar-pilot-label {
  color: #a7b1c1;
}

.pilot-command-center[data-pilot-phase="collecting"] .pilot-home-grid,
.pilot-command-center[data-pilot-phase="building"] .pilot-home-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  max-width: 720px;
}

.pilot-command-center[data-pilot-phase="launch"] #pilotHomeGrid,
.pilot-command-center[data-pilot-phase="launch"] #pilotMainGrid,
.pilot-command-center[data-pilot-phase="launch"] #pilotStatusStrip {
  display: none !important;
}

.pilot-command-center[data-pilot-phase="collecting"] #pilotMainGrid,
.pilot-command-center[data-pilot-phase="building"] #pilotMainGrid {
  display: none !important;
}

.pilot-command-center[data-pilot-phase="tour"] #pilotEmptyState {
  display: none !important;
}

.pilot-command-center[data-pilot-phase="tour"] .pilot-main-grid {
  grid-template-columns: 1fr;
  max-width: 720px;
}

#pilotLaunchHero[hidden],
#pilotStatusStrip[hidden],
#pilotHomeGrid[hidden],
#pilotMainGrid[hidden],
.pilot-home-card[hidden],
#pilotEmptyState[hidden],
#pilotBriefReady[hidden] {
  display: none !important;
}

.pilot-header-card {
  margin-bottom: 0;
}

.pilot-badge-live span {
  color: #2f6b3f;
  font-weight: 650;
}

.pilot-status-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(47, 107, 63, 0.14);
  background: #f4faf5;
  color: #355a40;
  font-size: 14px;
  line-height: 1.45;
}

.pilot-status-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #3f8f52;
  flex-shrink: 0;
}

.pilot-home-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.pilot-home-card {
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(26, 23, 21, 0.08);
  background: #fff;
  box-shadow: 0 1px 2px rgba(26, 23, 21, 0.04);
}

.pilot-home-card-label {
  color: var(--ob-ink-faint, #747e8e);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.pilot-home-card h3 {
  margin: 0 0 10px;
  font-size: 15px;
  line-height: 1.3;
}

.pilot-home-stat {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.1;
  margin-bottom: 4px;
}

.pilot-home-meta {
  margin: 0;
  color: var(--ob-ink-soft, #505661);
  font-size: 13px;
  line-height: 1.4;
}

.pilot-link-row {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}

.pilot-link-input {
  flex: 1;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid rgba(26, 23, 21, 0.12);
  border-radius: 10px;
  font: inherit;
  font-size: 13px;
  background: #faf8f5;
}

.pilot-link-actions,
.pilot-empty-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pilot-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, 0.8fr);
  gap: 14px;
  align-items: start;
}

.pilot-empty-state {
  padding: 22px 20px;
  border-radius: 16px;
  border: 1px dashed rgba(26, 23, 21, 0.14);
  background: linear-gradient(180deg, #faf8f5 0%, #fff 100%);
}

.pilot-empty-state h2 {
  margin: 0 0 8px;
  font-size: 20px;
  line-height: 1.2;
}

.pilot-empty-state p {
  margin: 0 0 14px;
  color: var(--ob-ink-soft, #505661);
  font-size: 14px;
  line-height: 1.5;
  max-width: 52ch;
}

.pilot-questions-card {
  padding: 16px;
  border-radius: 14px;
  border: 1px solid rgba(26, 23, 21, 0.08);
  background: #fff;
}

.pilot-questions-list {
  margin: 8px 0 0;
  padding-left: 18px;
  color: var(--ob-ink-soft, #505661);
  font-size: 13px;
  line-height: 1.5;
}

.pilot-panel-empty {
  padding: 8px 0;
  color: var(--ob-ink-soft, #505661);
  font-size: 14px;
  line-height: 1.5;
}

.pilot-responses-list {
  display: grid;
  gap: 10px;
}

.pilot-response-item {
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(26, 23, 21, 0.08);
  background: #faf8f5;
}

.pilot-response-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
  font-size: 12px;
}

.pilot-response-meta span {
  color: var(--ob-ink-faint, #747e8e);
}

.pilot-response-item p {
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
}

.settings-add-contact-btn {
  display: inline-flex;
  align-items: center;
  padding: 10px 12px;
  border: 1px dashed rgba(26, 23, 21, 0.18);
  border-radius: 10px;
  background: #faf8f5;
  color: var(--ob-ink-soft, #505661);
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}

.settings-add-contact-btn:hover {
  border-color: rgba(47, 111, 237, 0.28);
  color: var(--ob-accent, #1d5ad6);
}

.is-hidden {
  display: none !important;
}

body.pilot-workspace-mode .nav-tab-advanced {
  display: none;
}

body.pilot-workspace-mode .tab-panel[data-panel="brief"] > .workspace-header-card,
body.pilot-workspace-mode .tab-panel[data-panel="brief"] > .third-eye-insight-card,
body.pilot-workspace-mode .tab-panel[data-panel="brief"] > .kpi-grid,
body.pilot-workspace-mode .tab-panel[data-panel="brief"] > .daily-brief-grid,
body.pilot-workspace-mode .tab-panel[data-panel="brief"] > #issueGrid {
  display: none !important;
}

body.pilot-workspace-mode #pilotCommandCenter:not([hidden]) {
  display: grid !important;
}

.pilot-empty-hint {
  margin: 0 0 14px;
  font-size: 0.875rem;
  color: var(--ink-soft, #4d535e);
  line-height: 1.45;
}

/* Workspace product tour */
.workspace-tour {
  position: fixed;
  inset: 0;
  z-index: 12000;
  pointer-events: none;
}

.workspace-tour:not([hidden]) {
  pointer-events: auto;
}

.workspace-tour-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(16, 14, 12, 0.32);
  backdrop-filter: blur(7px) saturate(0.88);
  -webkit-backdrop-filter: blur(7px) saturate(0.88);
  pointer-events: none;
  animation: workspace-tour-fade-in 0.32s ease;
  transition: clip-path 0.38s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes workspace-tour-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes workspace-tour-coach-in {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.workspace-tour-spotlight {
  position: fixed;
  box-sizing: border-box;
  border-radius: 14px;
  background: transparent;
  box-shadow:
    0 0 0 1px rgba(249, 251, 253, 0.95),
    0 0 0 1px rgba(47, 111, 237, 0.16),
    0 0 0 9999px rgba(16, 14, 12, 0.28);
  pointer-events: none;
  z-index: 1;
  transition:
    top 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    left 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    width 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    height 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.24s ease,
    border-radius 0.3s ease;
}

.workspace-tour-spotlight.is-sidebar {
  border-radius: 0 16px 16px 0;
}

.workspace-tour-spotlight.is-nav-tab {
  border-radius: 10px;
  box-shadow:
    0 0 0 1px rgba(249, 251, 253, 0.95),
    0 0 0 2px rgba(47, 111, 237, 0.28);
}

.workspace-tour-target-active {
  position: relative;
  z-index: 12001;
}

body.workspace-tour-active.workspace-tour-nav-step .workspace-sidebar .nav-tab:not(.workspace-tour-target-active),
body.workspace-tour-active.workspace-tour-nav-step .workspace-sidebar .sidebar-title-row,
body.workspace-tour-active.workspace-tour-nav-step .workspace-sidebar .sidebar-pilot-card {
  opacity: 0.12;
  filter: blur(3px);
  pointer-events: none;
}

body.workspace-tour-active.workspace-tour-nav-step .workspace-sidebar .sidebar-block .section-label {
  opacity: 0.12;
  filter: blur(3px);
}

body.workspace-tour-active .workspace-tour-target-active.nav-tab {
  position: relative;
  z-index: 12003;
  opacity: 1 !important;
  filter: none !important;
}

.workspace-tour-sidebar-scrim {
  position: fixed;
  z-index: 1;
  background: rgba(12, 10, 8, 0.62);
  backdrop-filter: blur(12px) saturate(0.7);
  -webkit-backdrop-filter: blur(12px) saturate(0.7);
  pointer-events: none;
  border-radius: 10px;
  transition:
    top 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    left 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    width 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    height 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    clip-path 0.38s cubic-bezier(0.22, 1, 0.36, 1);
}

.workspace-tour-target-active.pilot-questions-card {
  border-radius: 14px;
}

.workspace-tour-coach {
  position: fixed;
  z-index: 2;
  width: min(400px, calc(100vw - 32px));
  border-radius: 16px;
  background: rgba(249, 251, 253, 0.98);
  border: 1px solid rgba(26, 23, 21, 0.07);
  box-shadow:
    0 20px 56px rgba(16, 14, 12, 0.16),
    0 4px 16px rgba(16, 14, 12, 0.06);
  pointer-events: auto;
  overflow: visible;
  animation: workspace-tour-coach-in 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  transition:
    top 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    left 0.38s cubic-bezier(0.22, 1, 0.36, 1);
}

.workspace-tour-coach.is-docked-bottom {
  left: 50%;
  bottom: max(24px, env(safe-area-inset-bottom, 0px));
  top: auto;
  transform: translateX(-50%);
}

.workspace-tour-coach.is-docked-bottom .workspace-tour-arrow {
  display: none;
}

.workspace-tour-coach-accent {
  position: absolute;
  top: 14px;
  bottom: 14px;
  left: 0;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(180deg, #1d5ad6 0%, #93c5fd 100%);
}

.workspace-tour-coach-inner {
  padding: 20px 22px 18px 24px;
}

.workspace-tour-coach-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.workspace-tour-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.workspace-tour-brand-mark {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(135deg, #1d5ad6, #93c5fd);
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.1);
  flex-shrink: 0;
}

.workspace-tour-step-label {
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  font-variant-numeric: tabular-nums;
  color: var(--ink-faint, #747e8e);
}

.workspace-tour-dismiss {
  border: none;
  background: rgba(26, 23, 21, 0.04);
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  color: var(--ink-soft, #4d535e);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.workspace-tour-dismiss:hover {
  background: rgba(26, 23, 21, 0.08);
  color: var(--ink, #1a1715);
}

.workspace-tour-progress {
  margin-bottom: 14px;
}

.workspace-tour-progress-track {
  height: 3px;
  border-radius: 999px;
  background: rgba(26, 23, 21, 0.08);
  overflow: hidden;
}

.workspace-tour-progress-fill {
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #1d5ad6, #93c5fd);
  transition: width 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.workspace-tour-title {
  margin: 0 0 8px;
  font-size: 1.125rem;
  font-weight: 650;
  letter-spacing: -0.02em;
  line-height: 1.3;
  color: var(--ink, #1a1715);
}

.workspace-tour-body {
  margin: 0 0 18px;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--ink-soft, #4d535e);
}

.workspace-tour-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

#workspaceTourBack:not([hidden]) {
  margin-right: auto;
}

.workspace-tour-arrow {
  position: absolute;
  width: 14px;
  height: 14px;
  background: rgba(249, 251, 253, 0.98);
  border: 1px solid rgba(26, 23, 21, 0.07);
  border-right: none;
  border-bottom: none;
  transform: rotate(45deg);
  box-shadow: -2px -2px 8px rgba(16, 14, 12, 0.05);
  pointer-events: none;
}

.wt-btn {
  appearance: none;
  border: 1px solid transparent;
  border-radius: 10px;
  min-height: 38px;
  padding: 0 16px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition:
    background 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease;
}

.wt-btn-ghost {
  background: transparent;
  border-color: rgba(26, 23, 21, 0.1);
  color: var(--ink-soft, #4d535e);
}

.wt-btn-ghost:hover {
  background: rgba(26, 23, 21, 0.04);
  color: var(--ink, #1a1715);
}

.wt-btn-primary {
  background: var(--ink, #1a1715);
  border-color: var(--ink, #1a1715);
  color: var(--paper, #f9fbfd);
}

.wt-btn-primary:hover {
  background: #1d2636;
}

body.workspace-tour-active {
  overflow: hidden;
}

body.workspace-tour-active .pilot-empty-state,
body.workspace-tour-active #pilotEmptyState {
  display: none !important;
}

body.workspace-tour-active .pilot-empty-actions,
body.workspace-tour-active .pilot-link-actions,
body.workspace-tour-active #sidebarPilotCard {
  visibility: hidden;
  pointer-events: none;
}

@media (max-width: 980px) {
  .pilot-launch-panel-inner {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 22px 18px 20px;
  }

  .pilot-launch-title {
    max-width: none;
  }

  .pilot-home-grid {
    grid-template-columns: 1fr;
  }

  .pilot-main-grid {
    grid-template-columns: 1fr;
  }

  .workspace-tour-coach {
    width: calc(100vw - 20px);
  }

  .workspace-tour-coach:not(.is-docked-bottom) {
    left: 50% !important;
    top: auto !important;
    bottom: max(16px, env(safe-area-inset-bottom, 0px)) !important;
    transform: translateX(-50%) !important;
  }

  .workspace-tour-coach-inner {
    padding: 18px 18px 16px 20px;
  }

  #workspaceTourBack:not([hidden]) {
    margin-right: auto;
  }
}