@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root {
  --navy: #071f49;
  --navy-2: #052b61;
  --blue: #0b5cff;
  --blue-2: #1d4ed8;
  --ink: #071b4d;
  --muted: #5f6d8a;
  --line: #dbe4f2;
  --bg: #f6faff;
  --panel: #ffffff;
  --green: #087f5b;
  --orange: #f97316;
  --purple: #7c3aed;
  --red: #ef4444;
  --shadow: 0 10px 28px rgba(7, 31, 73, .10);
}

* { box-sizing: border-box; }
html { font-size: 16px; }
body { margin: 0; color: var(--ink); background: var(--bg); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; letter-spacing: 0; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }

.btn { border: 1px solid var(--line); border-radius: 7px; padding: .78rem 1.25rem; background: white; color: var(--ink); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; box-shadow: 0 3px 10px rgba(7,31,73,.06); }
.btn.primary { background: linear-gradient(180deg, #0b5cff, #094ad6); color: white; border-color: #094ad6; }
.btn.secondary { background: white; color: var(--blue-2); border-color: #c9d6eb; }
.btn.large { min-height: 58px; min-width: 210px; font-size: 1.05rem; }
.btn.full, .full { width: 100%; }
.brand-mark { width: 38px; height: 38px; border: 2px solid currentColor; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; font-size: .72rem; font-weight: 900; letter-spacing: 0; }

.marketing-header { height: 74px; display: flex; align-items: center; justify-content: space-between; padding: 0 4.2vw; background: rgba(255,255,255,.96); border-bottom: 1px solid #e8eef8; }
.public-logo { display: inline-flex; align-items: center; gap: .75rem; color: var(--ink); font-size: 1.55rem; font-weight: 900; }
.marketing-header nav { display: flex; gap: 3.5rem; font-weight: 800; }
.landing { padding: 0 3.6vw 1.2rem; }
.hero { min-height: 545px; display: grid; grid-template-columns: minmax(420px, 1fr) minmax(560px, .98fr); align-items: center; gap: 3rem; }
.hero h1 { font-size: clamp(3rem, 5.4vw, 5rem); line-height: 1.08; margin: 0 0 1.6rem; max-width: 800px; }
.hero-copy > p { color: #405071; font-size: 1.5rem; line-height: 1.45; max-width: 760px; margin: 0 0 2rem; }
.hero-actions, .button-row { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }
.trust-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-top: 2.2rem; }
.trust-row span { display: grid; grid-template-columns: 42px 1fr; column-gap: .7rem; align-items: center; }
.trust-row b { grid-row: span 2; color: #007a7a; border: 2px solid #007a7a; border-radius: 50%; width: 36px; height: 36px; display: grid; place-items: center; }
.trust-row small { color: var(--muted); }
.product-preview { min-height: 430px; display: grid; grid-template-columns: 170px 1fr; border: 1px solid #d6e0ee; border-radius: 14px; overflow: hidden; background: white; box-shadow: var(--shadow); }
.mini-sidebar { background: linear-gradient(180deg, var(--navy), var(--navy-2)); color: white; padding: 1.2rem; display: flex; flex-direction: column; gap: 1rem; }
.mini-sidebar .selected { background: var(--blue); border-radius: 7px; padding: .7rem; }
.mini-chat { padding: 1rem 1.2rem; }
.mini-top { display: flex; justify-content: space-between; margin-bottom: 1rem; }
.bubble.user { margin-left: auto; background: #dceaff; color: var(--ink); border-radius: 9px; padding: .85rem 1.2rem; max-width: 640px; }
.answer-card { border: 1px solid var(--line); border-radius: 10px; padding: 1rem 1.2rem; background: white; line-height: 1.55; box-shadow: 0 6px 20px rgba(7,31,73,.04); }
.source-row { display: flex; gap: .6rem; flex-wrap: wrap; }
.source-row span, .source-grid span { border: 1px solid var(--line); border-radius: 7px; padding: .65rem .8rem; background: #fbfdff; }
.fake-input { margin-top: 1rem; border: 1px solid var(--line); border-radius: 8px; padding: .9rem 1rem; color: var(--muted); display: flex; justify-content: space-between; }
.feature-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; margin-bottom: 1.2rem; }
.feature-grid article, .panel, .metric-card, .table-panel { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow); }
.feature-grid article { display: grid; grid-template-columns: 64px 1fr; padding: 1.25rem; gap: 1rem; align-items: center; }
.feature-grid h3 { margin: 0 0 .4rem; }
.feature-grid p { margin: 0; color: var(--muted); line-height: 1.5; }
.tile { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 14px; font-weight: 900; }
.tile.blue { color: var(--blue); background: #eaf1ff; }
.tile.green { color: var(--green); background: #e6f7ef; }
.tile.orange { color: var(--orange); background: #fff2df; }
.tile.purple { color: var(--purple); background: #f0e8ff; }
.tile.red { color: var(--red); background: #ffe9ec; }
.lower-grid { display: grid; grid-template-columns: 1.7fr 1fr .92fr; gap: 1.2rem; }
.panel { padding: 1.35rem; }
.benefits { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.2rem; }
.benefits h2 { grid-column: 1 / -1; margin: 0; }
.benefits div { display: grid; grid-template-columns: 48px 1fr; }
.benefits small, .testimonial span, .offer p { color: var(--muted); }
.testimonial p { font-size: 1.22rem; line-height: 1.35; }
.offer { text-align: center; padding: 0 1.2rem 1.4rem; overflow: hidden; }
.offer > strong { display: block; margin: 0 -1.2rem 1rem; padding: .55rem; background: var(--navy-2); color: white; letter-spacing: .12em; }
.offer h2 { font-size: 2.3rem; margin: 0; }
.offer h2 span { font-size: 1.2rem; font-weight: 500; }
.offer h3 { color: #047a80; font-size: 2.4rem; margin: 1rem 0 0; }
.marketing-footer { display: grid; grid-template-columns: 2fr repeat(3, 1fr) 2.3fr; gap: 2rem; margin-top: 1rem; padding: 1.8rem 4.2vw; background: linear-gradient(145deg, var(--navy), #062d64); color: white; }
.marketing-footer div { display: flex; flex-direction: column; gap: .55rem; }
.marketing-footer p, .marketing-footer a { color: #d9e5f8; margin: 0; }

.login-page { min-height: 100vh; display: grid; place-items: center; padding: 2rem; background: linear-gradient(135deg, #eef6ff, #ffffff); }
.login-card { width: min(430px, 100%); background: white; border: 1px solid var(--line); border-radius: 12px; padding: 2rem; box-shadow: var(--shadow); }
.login-card form, .form-panel { display: grid; gap: 1rem; }
label { display: grid; gap: .45rem; font-weight: 700; color: #26395f; }
input, select, textarea { width: 100%; border: 1px solid #ccd7e8; border-radius: 7px; padding: .78rem .9rem; color: var(--ink); background: white; }
.alert, .toast { padding: .8rem 1rem; border-radius: 8px; background: #fff2df; color: #9a3412; border: 1px solid #fed7aa; margin-bottom: 1rem; }
.alert.success { background: #ecfdf3; color: #067647; border-color: #bbf7d0; }
.alert a { color: var(--blue); font-weight: 800; text-decoration: underline; }
.register-card { width: min(560px, 100%); }

.app-body { min-height: 100vh; display: grid; grid-template-columns: 280px 1fr; background: #f8fbff; }
.sidebar { position: sticky; top: 0; height: 100vh; background: linear-gradient(180deg, #051b43, #062e66); color: white; padding: 2rem 1.1rem; display: flex; flex-direction: column; box-shadow: 8px 0 24px rgba(7,31,73,.14); }
.side-logo { display: flex; align-items: center; gap: .8rem; font-size: 1.65rem; font-weight: 900; margin-bottom: 2.2rem; padding: 0 .6rem; }
.side-nav { display: grid; gap: .65rem; }
.side-nav a { display: flex; gap: .9rem; align-items: center; padding: .95rem 1rem; border-radius: 8px; font-size: .81rem; font-weight: 700; color: #f6faff; }
.side-nav a.active { background: #0b56d9; outline: 1px solid rgba(255,255,255,.22); }
.icon { width: 24px; text-align: center; font-weight: 900; }
.user-card { margin-top: auto; display: grid; grid-template-columns: 50px 1fr auto; gap: .8rem; align-items: center; padding: .5rem; }
.user-card span { display: block; color: #cfdef5; font-size: .9rem; }
.user-card button { background: transparent; color: white; border: 0; font-size: 1.3rem; }
.avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--blue); color: white; display: grid; place-items: center; font-weight: 800; }
.avatar.small { width: 44px; height: 44px; display: inline-grid; }
.app-main { padding: 2.1rem 2rem 2.5rem; min-width: 0; }
.page-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.6rem; }
.page-head h1 { font-size: 2.35rem; margin: 0 .5rem .35rem 0; letter-spacing: 0; }
.page-head p { color: var(--muted); margin: 0; font-size: 1.12rem; }
.date-pill { border: 1px solid #cdd8e8; border-radius: 7px; padding: 1rem 1.4rem; background: white; color: #26395f; font-weight: 800; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.4rem; }
.metric-grid.compact { margin-bottom: 0; }
.metric-card { padding: 1.1rem; display: grid; grid-template-columns: 64px minmax(0, 1fr); align-items: center; gap: .75rem; min-height: 120px; min-width: 0; }
.metric-card span { color: #20335b; font-weight: 800; font-size: .98rem; }
.metric-card strong { display: block; font-size: 2.25rem; line-height: 1.1; margin: .3rem 0; }
.metric-card small { color: var(--green); }
.two-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem; margin-bottom: 1.4rem; }
.panel-title { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); padding-bottom: .9rem; margin-bottom: .6rem; }
.panel-title h2, .form-panel h2, .email-output h2 { margin: 0; font-size: 1.25rem; }
.panel-title a, .center-link { color: var(--blue); font-weight: 800; }
.center-link { display: block; text-align: center; margin-top: 1rem; }
.list-row { display: grid; grid-template-columns: 36px 1fr auto; gap: .8rem; align-items: center; padding: .9rem 0; border-bottom: 1px solid #e7edf6; }
.list-row b { font-weight: 650; }
.list-row small { color: #67779a; }
.list-row em { color: #e11d48; background: #fff1f2; border: 1px solid #fecdd3; font-style: normal; padding: .25rem .45rem; border-radius: 5px; font-size: .82rem; }
.mini-icon { color: var(--blue); background: #ebf2ff; border-radius: 8px; width: 30px; height: 30px; display: grid; place-items: center; }
.mini-icon.warning { color: var(--orange); background: #fff6e8; }

.top-tools { align-items: flex-start; }
.tool-icons { display: flex; align-items: center; gap: 1.4rem; color: #213461; font-size: 1.4rem; }
.chat-layout { display: grid; grid-template-columns: 340px 1fr; gap: 1.4rem; min-height: calc(100vh - 140px); }
.recent-panel { display: flex; flex-direction: column; }
.chat-row:first-of-type { border-left: 4px solid var(--blue); margin-left: -1.35rem; padding-left: 1.35rem; background: #f3f7ff; }
.chat-main { border: 1px solid var(--line); border-radius: 10px; background: white; padding: 1.4rem; box-shadow: var(--shadow); }
.bubble.large { max-width: 650px; margin-bottom: 1.6rem; }
.bubble small { display: block; margin-top: .8rem; color: #31508d; text-align: right; }
.assistant-wrap { display: grid; grid-template-columns: 50px 1fr; gap: 1rem; align-items: start; }
.bot-mark { color: var(--blue); border: 1px solid #cbd8ee; border-radius: 50%; width: 42px; height: 42px; display: grid; place-items: center; font-weight: 900; }
.chat-answer p { white-space: pre-line; }
.sources-title { margin: 1.1rem 0 .7rem; font-weight: 800; }
.source-grid { display: grid; grid-template-columns: repeat(4, 1fr) auto; gap: .75rem; align-items: center; }
.source-grid b, .source-grid small { display: block; }
.source-grid a { color: var(--blue); font-weight: 800; }
.feedback { color: #7080a1; margin: 1rem 0; }
.ask-box { display: grid; grid-template-columns: 1fr auto 58px; gap: .8rem; border: 1px solid #9fb1d1; border-radius: 10px; padding: .8rem; }
.ask-box input { border: 0; }
.send-btn { border: 0; border-radius: 8px; background: var(--blue); color: white; font-size: 1.5rem; }
.disclaimer { display: block; color: #7584a3; text-align: center; margin-top: 1rem; }

.email-layout, .settings-grid { display: grid; grid-template-columns: 420px 1fr; gap: 1.5rem; }
.attachment { display: grid; grid-template-columns: 45px 1fr auto; gap: .7rem; align-items: center; border: 1px solid var(--line); border-radius: 8px; padding: .75rem; }
.attachment small { display: block; color: var(--muted); }
.drop-zone { border: 1px dashed #9fb3d1; border-radius: 8px; text-align: center; color: var(--blue); padding: 1rem; }
.email-output p { white-space: pre-line; font-size: 1.05rem; line-height: 1.55; }
.email-output footer { border-top: 1px solid var(--line); color: #627292; padding-top: 1rem; margin-top: 2rem; }

.filter-row { display: grid; grid-template-columns: minmax(220px, 1.2fr) minmax(260px, 3fr) auto; gap: 1rem; margin-bottom: 1.3rem; }
.filter-row input:first-child { grid-column: span 1; }
.upload-inline { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.upload-inline input[type=file] { max-width: 260px; }
.table-panel { overflow: hidden; }
table { width: 100%; border-collapse: collapse; font-size: .95rem; }
th, td { text-align: left; padding: 1rem 1.2rem; border-bottom: 1px solid #e5edf7; vertical-align: middle; }
th { color: #516185; font-size: .86rem; background: #fbfdff; }
td small { display: block; color: #7080a1; margin-top: .25rem; }
.tag, .status { display: inline-flex; align-items: center; border-radius: 5px; padding: .25rem .48rem; font-size: .78rem; font-weight: 800; border: 1px solid #bfdbfe; color: var(--blue); background: #eff6ff; }
.tag.muted { color: #465773; border-color: #d9e2ef; background: #f2f6fb; }
.status.indexed { color: #067647; border-color: #bbf7d0; background: #ecfdf3; }
.status.processing { color: #b45309; border-color: #fed7aa; background: #fff7ed; }
.status.failed { color: #dc2626; border-color: #fecaca; background: #fff1f2; }
.icon-btn { border: 0; background: white; color: var(--blue); font-weight: 900; padding: .3rem .5rem; }
.pager { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.2rem; color: #536482; }
.pager nav { display: flex; gap: .6rem; align-items: center; }
.pager button, .pager b, .pager a { min-width: 34px; height: 34px; border: 1px solid #d7e1ef; border-radius: 6px; display: grid; place-items: center; background: white; }
.pager b { color: var(--blue); border-color: var(--blue); }
.tabs { display: flex; gap: 2rem; border-bottom: 1px solid var(--line); margin-bottom: 1rem; }
.tabs a { padding: .8rem 0; font-weight: 800; color: #314368; }
.tabs .active { color: var(--blue); border-bottom: 3px solid var(--blue); }
.stack { display: grid; gap: 1.2rem; }
.logo-upload { display: grid; grid-template-columns: 90px auto 1fr; gap: 1rem; align-items: center; }
.logo-upload div { width: 90px; height: 76px; display: grid; place-items: center; text-align: center; background: var(--navy); color: white; border-radius: 8px; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

/* Ask FirmBrain screen */
.ask-topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.4rem;
  margin: .35rem 0 1.9rem;
}

.ask-topbar h1 {
  margin: 0;
  color: #071846;
  font-size: 2.32rem;
  line-height: 1.05;
  font-weight: 800;
}

.ask-topbar svg,
.ask-layout svg,
.ask-composer svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ask-tools {
  display: flex;
  align-items: center;
  gap: .72rem;
}

.ask-tools button {
  position: relative;
  width: 42px;
  height: 42px;
  border: 1px solid #d8e2f1;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #21365f;
  background: #ffffff;
  box-shadow: 0 8px 20px rgba(7, 31, 73, .06);
}

.notification-tool span {
  position: absolute;
  top: -4px;
  right: -1px;
  min-width: 17px;
  height: 17px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #ef4444;
  color: #fff;
  border: 2px solid #fff;
  font-size: .62rem;
  font-weight: 800;
}

.ask-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #071846;
  color: #fff;
  font-size: .86rem;
  font-weight: 800;
}

.ask-layout {
  display: grid;
  grid-template-columns: minmax(265px, 316px) minmax(0, 1fr);
  gap: 1.22rem;
  align-items: stretch;
  min-height: calc(100vh - 245px);
}

.chat-history-card,
.ask-chat-panel {
  background: #ffffff;
  border: 1px solid #dbe5f2;
  border-radius: 11px;
  box-shadow: 0 10px 26px rgba(7, 31, 73, .08);
}

.chat-history-card {
  padding: 1.2rem 1rem;
  display: flex;
  flex-direction: column;
}

.chat-history-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 1.05rem;
}

.chat-history-card h2 {
  margin: 0;
  color: #071846;
  font-size: 1.19rem;
  font-weight: 800;
}

.chat-history-card header a {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #ffffff;
  background: #075ee8;
  box-shadow: 0 8px 16px rgba(7, 94, 232, .18);
}

.chat-history-card header svg {
  width: 18px;
  height: 18px;
}

.chat-history-list {
  display: grid;
  gap: .38rem;
}

.chat-history-item {
  min-height: 72px;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: .72rem;
  align-items: center;
  padding: .75rem .72rem;
  border-radius: 9px;
  color: #071846;
}

.chat-history-item span {
  grid-row: span 2;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: #075ee8;
  background: #edf4ff;
}

.chat-history-item span svg {
  width: 18px;
  height: 18px;
}

.chat-history-item b {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .98rem;
  line-height: 1.2;
  font-weight: 750;
}

.chat-history-item small {
  color: #687897;
  font-size: .82rem;
  line-height: 1.2;
}

.chat-history-item.selected {
  position: relative;
  background: #ffffff;
  border-radius: 0;
  outline: 0;
}

.chat-history-item.selected::before {
  content: "";
  position: absolute;
  left: -1rem;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #075ee8;
}

.view-all-chats {
  margin: auto .5rem .15rem;
  padding-top: 1rem;
  border-top: 1px solid #e8eef7;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .48rem;
  color: #075ee8;
  font-weight: 800;
  font-size: .95rem;
}

.view-all-chats svg {
  width: 18px;
  height: 18px;
}

.ask-chat-panel {
  min-height: 610px;
  padding: 1.35rem 1.48rem 1.15rem;
}

.ask-user-bubble {
  width: min(640px, 76%);
  margin: 0 0 1.45rem auto;
  border-radius: 11px;
  border-bottom-right-radius: 4px;
  background: #dcebff;
  color: #071846;
  padding: .92rem 1.15rem .68rem;
}

.ask-user-bubble p {
  margin: 0;
  font-size: .99rem;
  line-height: 1.42;
  font-weight: 520;
}

.ask-user-bubble small {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: .35rem;
  margin-top: .55rem;
  color: #405b8b;
  font-size: .78rem;
}

.ask-user-bubble small svg {
  width: 15px;
  height: 15px;
}

.assistant-message-wrap {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: .9rem;
  align-items: start;
}

.assistant-mark {
  width: 34px;
  height: 34px;
  margin-top: .22rem;
  display: grid;
  place-items: center;
  color: #0967ff;
}

.assistant-mark .logo-mark {
  width: 30px;
  height: 30px;
}

.assistant-response {
  max-width: 900px;
  border: 1px solid #dbe5f2;
  border-radius: 11px;
  padding: 1.25rem 1.35rem 1.1rem;
  background: #ffffff;
  color: #071846;
}

.assistant-response p {
  margin: 0 0 .78rem;
  font-size: .99rem;
  line-height: 1.5;
  font-weight: 520;
}

.answer-steps {
  margin: 0;
  padding-left: 1.18rem;
  display: grid;
  gap: .86rem;
}

.answer-steps li {
  padding-left: .18rem;
  line-height: 1.46;
  color: #22375f;
  font-size: .95rem;
}

.answer-steps strong {
  display: block;
  margin-bottom: .14rem;
  color: #071846;
  font-weight: 800;
}

.answer-steps span {
  color: #33486c;
}

.ask-sources {
  margin: 1.1rem 0 .75rem 0;
}

.ask-sources > button {
  border: 0;
  background: transparent;
  padding: 0;
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  color: #071846;
  font-weight: 800;
}

.ask-sources > button svg {
  width: 16px;
  height: 16px;
}

.ask-source-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: .72rem;
  align-items: stretch;
  margin-top: .72rem;
}

.ask-source-card {
  min-height: 92px;
  min-width: 0;
  border: 1px solid #dfe7f2;
  border-radius: 8px;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  grid-template-rows: auto auto 1fr;
  gap: .12rem .65rem;
  align-items: start;
  padding: .78rem .86rem;
  background: #fbfdff;
}

.ask-source-card span {
  grid-row: 1 / span 2;
  width: 32px;
  height: 36px;
  border-radius: 7px;
  display: grid;
  place-items: center;
}

.ask-source-card svg {
  width: 18px;
  height: 18px;
}

.ask-source-card b {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #071846;
  font-size: .86rem;
  line-height: 1.22;
  font-weight: 800;
}

.ask-source-card small {
  color: #6c7b99;
  font-size: .75rem;
  line-height: 1.2;
}

.ask-source-card p {
  grid-column: 1 / -1;
  margin: .42rem 0 0;
  color: #526486;
  font-size: .78rem;
  line-height: 1.35;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.ask-source-card.sop span,
.ask-source-card.document span {
  color: #075ee8;
  background: #e9f1ff;
}

.ask-source-card.checklist span {
  color: #f59e0b;
  background: #fff3dc;
}

.ask-source-card.template span {
  color: #0f9f70;
  background: #e7f8f0;
}

.ask-source-card.guide span {
  color: #6d28d9;
  background: #f0e8ff;
}

.ask-view-all {
  color: #075ee8;
  font-size: .92rem;
  font-weight: 800;
  white-space: nowrap;
}

.ask-feedback {
  display: flex;
  align-items: center;
  gap: .52rem;
  margin-left: 0;
  padding-top: .45rem;
}

.ask-feedback button {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #6d7b98;
  background: transparent;
}

.ask-feedback svg {
  width: 18px;
  height: 18px;
}

.ask-composer {
  margin: 1.06rem 0 0;
  min-height: 62px;
  border: 1px solid #c9d8ed;
  border-radius: 12px;
  background: #ffffff;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .8rem;
  padding: .58rem .58rem .58rem 1.05rem;
  box-shadow: 0 8px 22px rgba(7, 31, 73, .06);
}

.ask-composer input {
  min-width: 0;
  border: 0;
  border-radius: 0;
  padding: .65rem 0;
  color: #071846;
  font-size: .98rem;
  outline: 0;
}

.ask-composer input::placeholder {
  color: #7b88a3;
}

.ask-composer > div {
  display: flex;
  align-items: center;
  gap: .48rem;
}

.composer-round,
.add-context-btn,
.ask-send-btn {
  height: 42px;
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #075ee8;
  background: #edf4ff;
}

.composer-round {
  width: 42px;
  border-radius: 50%;
}

.add-context-btn {
  gap: .35rem;
  border-radius: 999px;
  padding: 0 .9rem;
  font-size: .92rem;
  font-weight: 800;
}

.add-context-btn svg {
  width: 17px;
  height: 17px;
}

.ask-send-btn {
  width: 42px;
  border-radius: 50%;
  background: #075ee8;
  color: #fff;
}

.ask-send-btn svg {
  width: 19px;
  height: 19px;
}

.ask-disclaimer {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: .25rem;
  margin: .82rem 0 0;
  color: #6b7a98;
  font-size: .84rem;
}

.ask-disclaimer a {
  color: #075ee8;
  font-weight: 800;
}

@media (max-width: 1100px) {
  .app-body { grid-template-columns: 92px 1fr; }
  .sidebar { padding: 1.2rem .7rem; }
  .side-logo span:not(.brand-mark), .side-nav a:not(.active), .side-nav a span + text, .user-card div { display: none; }
  .side-nav a { justify-content: center; }
  .hero, .lower-grid, .email-layout, .settings-grid, .chat-layout, .ask-layout { grid-template-columns: 1fr; }
  .metric-grid, .feature-grid { grid-template-columns: repeat(2, 1fr); }
  .ask-source-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ask-view-all { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .marketing-header nav { display: none; }
  .app-body { display: block; }
  .sidebar { position: static; height: auto; }
  .app-main { padding: 1rem; }
  .hero, .feature-grid, .lower-grid, .metric-grid, .two-grid, .source-grid, .filter-row, .ask-source-grid { grid-template-columns: 1fr; }
  .hero h1, .page-head h1 { font-size: 2.3rem; }
  .ask-topbar { align-items: flex-start; flex-direction: column; }
  .ask-topbar h1 { font-size: 2.1rem; }
  .ask-chat-panel { padding: 1rem; }
  .ask-user-bubble { width: 100%; }
  .assistant-message-wrap { grid-template-columns: 1fr; }
  .ask-sources, .ask-feedback { margin-left: 0; }
  .ask-composer { grid-template-columns: 1fr; }
  .ask-composer > div { justify-content: flex-end; flex-wrap: wrap; }
  .trust-row, .benefits { grid-template-columns: 1fr; }
  .product-preview { grid-template-columns: 1fr; }
  .mini-sidebar { display: none; }
  .marketing-footer { grid-template-columns: 1fr; }
  .page-head { align-items: stretch; flex-direction: column; }
  table { min-width: 760px; }
  .table-panel { overflow-x: auto; }
}

/* Landing page fidelity pass */
.public-body {
  background: #ffffff;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}

.logo-mark {
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.marketing-header {
  height: 64px;
  padding: 0 3.95vw;
  background: #ffffff;
  border-bottom: 1px solid #e7edf6;
  box-shadow: 0 1px 10px rgba(8, 31, 73, .03);
}

.public-logo {
  gap: .62rem;
  color: #061b4d;
  font-size: 1.48rem;
  line-height: 1;
  font-weight: 800;
  letter-spacing: -.02em;
}

.public-logo .logo-mark {
  color: #0967ff;
}

.marketing-header nav {
  gap: 3.15rem;
  margin-left: 7vw;
  font-size: .93rem;
  font-weight: 700;
  color: #071b4d;
}

.nav-actions {
  display: flex;
  align-items: center;
  gap: 1.15rem;
}

.landing-login-link {
  color: #071b4d;
  font-size: .95rem;
  font-weight: 800;
}

.nav-cta {
  min-width: 151px;
  min-height: 44px;
  padding: 0 1.25rem;
  border-radius: 7px;
  font-size: 1rem;
}

.landing {
  padding: 0 3.6vw 1.1rem;
  background:
    linear-gradient(180deg, #eef7ff 0, #f8fcff 445px, #ffffff 446px, #ffffff 100%);
}

.hero {
  min-height: 478px;
  grid-template-columns: minmax(545px, .98fr) minmax(560px, 1.02fr);
  gap: 1.9rem;
  align-items: center;
}

.hero h1 {
  color: #071b4d;
  font-size: clamp(2.85rem, 3.8vw, 3.85rem);
  line-height: 1.08;
  font-weight: 800;
  letter-spacing: -.035em;
  margin: 0 0 1.35rem;
  max-width: 650px;
}

.hero-copy > p {
  color: #465573;
  font-size: 1.36rem;
  line-height: 1.46;
  font-weight: 400;
  max-width: 660px;
  margin-bottom: 1.75rem;
}

.btn {
  border-radius: 7px;
  font-weight: 700;
  box-shadow: 0 8px 18px rgba(9, 84, 220, .09);
}

.btn.primary {
  background: linear-gradient(180deg, #0c63ff, #064ed6);
  border-color: #064ed6;
}

.btn.secondary {
  color: #0557e8;
  border-color: #0759e8;
  box-shadow: none;
}

.btn.large {
  min-width: 236px;
  min-height: 58px;
  font-size: 1.03rem;
}

.btn-icon {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.trust-row {
  max-width: 690px;
  grid-template-columns: 1fr 1.05fr 1fr;
  gap: 1.35rem;
  margin-top: 2rem;
}

.trust-row span {
  grid-template-columns: 36px 1fr;
  column-gap: .68rem;
  align-items: center;
}

.trust-row strong {
  color: #071b4d;
  font-size: .94rem;
  font-weight: 800;
}

.trust-row small {
  margin-top: .15rem;
  color: #52617d;
  font-size: .88rem;
}

.trust-icon {
  grid-row: span 2;
  width: 34px;
  height: 34px;
  color: #007c80;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.landing-preview {
  min-height: 455px;
  height: 455px;
  grid-template-columns: 154px 1fr;
  border-color: #d9e2ef;
  border-radius: 13px;
  box-shadow: 0 14px 26px rgba(7, 31, 73, .14);
}

.landing-preview .mini-sidebar {
  background: linear-gradient(180deg, #061d47 0%, #062f68 100%);
  padding: .95rem .86rem;
  gap: .52rem;
  font-size: .84rem;
}

.landing-preview .mini-sidebar strong {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin: 0 0 .5rem;
  font-size: 1rem;
  line-height: 1;
}

.landing-preview .mini-sidebar .logo-mark {
  width: 26px;
  height: 26px;
  color: #ffffff;
}

.landing-preview .mini-sidebar span {
  display: flex;
  align-items: center;
  gap: .62rem;
  color: #ffffff;
  font-weight: 650;
  min-height: 27px;
}

.landing-preview .mini-sidebar span svg,
.mini-top svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.landing-preview .mini-sidebar .selected {
  background: #075be7;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 7px;
  padding: .48rem .52rem;
  margin-bottom: .24rem;
}

.mini-user {
  margin-top: auto;
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: .55rem;
  align-items: center;
}

.mini-user > span {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid !important;
  place-items: center;
  background: #0b63ff;
  font-size: .72rem;
}

.mini-user div {
  font-size: .72rem;
  font-weight: 700;
}

.mini-user small {
  display: block;
  color: #cddbf4;
  font-size: .63rem;
  font-weight: 500;
}

.landing-preview .mini-chat {
  padding: 0;
  background: #ffffff;
}

.mini-top {
  height: 43px;
  border-bottom: 1px solid #e2e8f2;
  padding: 0 1.18rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0;
  color: #071b4d;
  font-size: .9rem;
}

.mini-top span {
  display: flex;
  align-items: center;
  gap: .9rem;
  color: #22335d;
}

.mini-top b {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #071b4d;
  color: #ffffff;
  font-size: .68rem;
}

.landing-preview .bubble.user {
  margin: .72rem 1.18rem .88rem auto;
  max-width: 420px;
  border-radius: 8px;
  padding: .62rem 1.05rem;
  background: #dbeaff;
  color: #071b4d;
  font-size: .84rem;
  line-height: 1.35;
}

.mini-answer-wrap {
  display: grid;
  grid-template-columns: 37px 1fr;
  align-items: start;
  gap: .8rem;
  margin: 0 1.18rem 0 1.08rem;
}

.mini-answer-wrap > .logo-mark {
  width: 28px;
  height: 28px;
  margin-top: .45rem;
  color: #0967ff;
}

.landing-preview .answer-card {
  max-width: 330px;
  min-height: 0;
  padding: .68rem .85rem;
  border-radius: 9px;
  font-size: .66rem;
  line-height: 1.32;
  color: #071b4d;
  box-shadow: none;
}

.landing-preview .answer-card p {
  margin: 0 0 .4rem;
}

.landing-preview .answer-card ul {
  margin: 0 0 .38rem .95rem;
  padding: 0;
}

.landing-preview .answer-card li {
  margin: .12rem 0;
}

.sources-label,
.all-sources {
  display: block;
  color: #071b4d;
  font-weight: 700;
  font-size: .68rem;
}

.landing-preview .source-row {
  flex-wrap: nowrap;
  gap: .34rem;
  margin: .22rem 0 .32rem;
}

.landing-preview .source-row span {
  display: grid;
  grid-template-columns: 18px 1fr;
  align-items: center;
  gap: .34rem;
  min-width: 78px;
  padding: .34rem .36rem;
  border-radius: 6px;
  font-size: .56rem;
  line-height: 1.15;
}

.landing-preview .source-row b {
  width: 18px;
  height: 22px;
  border-radius: 3px;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: .48rem;
  font-weight: 800;
}

.source-row .pdf { background: #ef4444; }
.source-row .doc { background: #2563eb; }
.source-row .xls { background: #16a34a; }
.all-sources { color: #0759e8; }

.landing-preview .fake-input {
  height: 37px;
  margin: .9rem 1.18rem 0;
  padding: 0 .8rem;
  align-items: center;
  border-color: #d4dfef;
  color: #7b879f;
  font-size: .8rem;
}

.landing-preview .fake-input svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: #425171;
  stroke-width: 1.7;
  stroke-linejoin: round;
}

.feature-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.7rem;
  margin: .65rem 0 1.08rem;
}

.feature-grid article {
  grid-template-columns: 60px 1fr;
  min-height: 106px;
  padding: 1.05rem 1.08rem;
  border-radius: 9px;
  border-color: #dfe7f2;
  box-shadow: 0 4px 16px rgba(7, 31, 73, .08);
}

.feature-grid h3 {
  color: #071b4d;
  font-size: 1rem;
  line-height: 1.2;
  font-weight: 800;
  margin-bottom: .42rem;
}

.feature-grid p {
  color: #405070;
  font-size: .82rem;
  line-height: 1.55;
  grid-column: 2;
}

.tile {
  width: 52px;
  height: 52px;
  border-radius: 13px;
}

.feature-grid .tile {
  grid-row: span 2;
}

.tile svg,
.benefits svg,
.offer b svg {
  width: 30px;
  height: 30px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.lower-grid {
  grid-template-columns: 1.82fr 1.16fr 1fr;
  gap: 1.35rem;
}

.panel {
  border-radius: 9px;
  border-color: #dfe7f2;
  box-shadow: 0 4px 16px rgba(7, 31, 73, .08);
}

.benefits {
  min-height: 220px;
  padding: 1.25rem 1.5rem;
  gap: 1rem 1.45rem;
}

.benefits h2 {
  color: #071b4d;
  font-size: 1.34rem;
  font-weight: 800;
}

.benefits div {
  grid-template-columns: 52px 1fr;
  align-items: center;
}

.benefits div span {
  grid-row: span 2;
  color: #007c80;
}

.benefits b {
  color: #071b4d;
  font-size: .92rem;
}

.benefits small {
  color: #52617d;
  font-size: .82rem;
}

.testimonial {
  min-height: 220px;
  padding: 1.25rem 1.5rem;
}

.quote-mark {
  color: #60a5fa;
  font-size: 3.2rem;
  line-height: .7;
  font-weight: 900;
}

.testimonial p {
  color: #17305a;
  font-size: 1.06rem;
  line-height: 1.35;
  margin: .35rem 0 1.1rem;
}

.testimonial-footer {
  display: flex;
  align-items: center;
  gap: .9rem;
}

.testimonial-footer strong,
.testimonial-footer span {
  display: block;
}

.testimonial-footer strong {
  color: #071b4d;
  font-size: .92rem;
}

.testimonial-footer span {
  color: #52617d;
  font-size: .82rem;
}

.smith-logo {
  width: 70px;
  height: 54px;
  border-radius: 5px;
  display: grid;
  place-items: center;
  background: #08285e;
  color: white;
  text-align: center;
  font-family: Georgia, serif;
  font-size: 1rem;
  line-height: .82;
}

.smith-logo small {
  font-size: .52rem;
}

.offer {
  min-height: 220px;
  border-radius: 9px;
}

.offer > strong {
  margin: 0 -1.2rem 1rem;
  padding: .55rem;
  background: #062f68;
  font-size: .82rem;
  letter-spacing: .16em;
}

.offer h2 {
  color: #071b4d;
  font-size: 2.05rem;
  font-weight: 700;
}

.offer h2 span {
  font-size: 1.05rem;
}

.offer h3 {
  color: #007c80;
  font-size: 2.15rem;
  line-height: 1;
}

.offer b {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: #0759e8;
  font-size: .9rem;
}

.offer b svg {
  width: 20px;
  height: 20px;
}

.marketing-footer {
  min-height: 153px;
  grid-template-columns: 2.1fr .9fr .9fr .95fr 2.6fr;
  gap: 2.2rem;
  margin-top: 1rem;
  padding: 1.72rem 4.35vw;
  background: linear-gradient(145deg, #062a62 0%, #05214f 100%);
  font-size: .9rem;
}

.marketing-footer .public-logo {
  color: white;
  font-size: 1.35rem;
}

.marketing-footer .logo-mark {
  color: white;
  width: 34px;
  height: 34px;
}

.marketing-footer strong {
  color: white;
  font-weight: 700;
}

.marketing-footer p,
.marketing-footer a {
  color: #d6e0f2;
  line-height: 1.45;
}

.footer-trust {
  justify-content: center;
  align-items: flex-start;
}

.footer-trust p:last-child {
  display: flex;
  align-items: center;
  gap: .72rem;
  margin-top: .7rem;
}

.footer-trust svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (max-width: 1180px) {
  .hero {
    grid-template-columns: 1fr;
    padding-top: 2rem;
  }

  .landing-preview {
    max-width: 720px;
  }
}

/* Dashboard fidelity pass */
body.app-body {
  --dash-ink: #061545;
  --dash-muted: #39476c;
  --dash-soft: #f8fbff;
  --dash-line: #dbe4f1;
  --dash-blue: #0757ff;
  --dash-green: #009969;
  --dash-purple: #6c22ff;
  --dash-orange: #ff980d;
  --dash-shadow: 0 8px 20px rgba(6, 21, 69, .08);
  grid-template-columns: 286px minmax(0, 1fr);
  background:
    radial-gradient(circle at 82% 7%, rgba(240, 247, 255, .9), rgba(255, 255, 255, 0) 28%),
    linear-gradient(180deg, #fbfdff 0%, #f7fbff 100%);
  color: var(--dash-ink);
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}

.app-body main {
  max-width: 1152px;
  margin: 0 auto;
}

.app-main {
  padding: 37px 44px 13px 32px;
  min-width: 0;
}

.sidebar {
  height: 100vh;
  padding: 38px 18px 27px 22px;
  background:
    radial-gradient(ellipse 90% 55% at 48% 84%, rgba(9, 89, 204, .22), rgba(9, 89, 204, 0) 56%),
    radial-gradient(ellipse 90% 70% at 58% 88%, rgba(19, 136, 255, .13), rgba(19, 136, 255, 0) 58%),
    linear-gradient(180deg, #061f4b 0%, #06295f 52%, #052551 100%);
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, .1), 8px 0 26px rgba(6, 21, 69, .08);
  overflow: hidden;
}

.sidebar::after {
  content: "";
  position: absolute;
  inset: auto -80px 120px -70px;
  height: 420px;
  opacity: .22;
  background:
    repeating-radial-gradient(ellipse at center, transparent 0 11px, rgba(68, 141, 255, .28) 12px 13px);
  transform: rotate(-18deg);
  pointer-events: none;
}

.side-logo {
  position: relative;
  z-index: 1;
  gap: 12px;
  margin: 0 0 43px 18px;
  padding: 0;
  color: #ffffff;
  font-size: 26px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: -.02em;
}

.side-logo .logo-mark {
  width: 43px;
  height: 43px;
  color: #ffffff;
  stroke-width: 1.7;
}

.side-nav {
  position: relative;
  z-index: 1;
  gap: 12px;
}

.side-nav a {
  min-height: 48px;
  gap: 14px;
  padding: 0 16px;
  border-radius: 8px;
  color: #ffffff;
  font-size: 13.5px;
  line-height: 1;
  font-weight: 650;
  letter-spacing: 0;
}

.side-nav a.active {
  background: linear-gradient(90deg, #1269f6 0%, #064ac8 100%);
  outline: 1px solid rgba(255, 255, 255, .18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 12px 22px rgba(0, 43, 128, .18);
}

.side-nav a.active .icon {
  width: 48px;
  height: 48px;
  margin-left: -16px;
  border-radius: 8px 28px 28px 8px;
  background: rgba(0, 83, 210, .45);
}

.icon {
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  color: #ffffff;
}

.icon svg,
.user-card button svg,
.dashboard-head svg,
.dash-stat svg,
.dash-panel svg,
.secure-note svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.side-nav .icon svg {
  width: 25px;
  height: 25px;
}

.user-card {
  position: relative;
  z-index: 1;
  grid-template-columns: 52px 1fr 22px;
  gap: 13px;
  padding: 0 6px;
  margin-top: auto;
  color: #ffffff;
}

.avatar {
  width: 52px;
  height: 52px;
  background: linear-gradient(180deg, #1269f6, #0751d0);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22);
  font-size: 18px;
  font-weight: 700;
}

.user-card strong {
  display: block;
  font-size: 16px;
  line-height: 1.25;
  font-weight: 700;
}

.user-card span {
  color: #dce7f7;
  font-size: 14px;
  line-height: 1.4;
}

.user-card button {
  width: 22px;
  height: 22px;
  padding: 0;
  background: transparent;
  border: 0;
  color: #ffffff;
}

.dashboard-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  margin: 0 0 25px;
}

.dashboard-head h1 {
  margin: 0 0 10px;
  color: var(--dash-ink);
  font-size: 34px;
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.025em;
}

.dashboard-head p {
  margin: 0;
  color: var(--dash-muted);
  font-size: 18px;
  line-height: 1.35;
  font-weight: 400;
}

.date-control {
  min-width: 287px;
  min-height: 52px;
  margin-top: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  border: 1px solid #cfdced;
  border-radius: 9px;
  background: #ffffff;
  color: var(--dash-ink);
  box-shadow: 0 9px 20px rgba(6, 21, 69, .08);
  font-size: 17px;
  font-weight: 650;
}

.date-control svg:first-child {
  width: 22px;
  height: 22px;
  color: #0b2358;
}

.date-control svg:last-child {
  width: 17px;
  height: 17px;
}

.dashboard-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 17px;
  margin-bottom: 18px;
}

.dash-stat,
.dash-panel,
.doc-stat-grid article {
  background: #ffffff;
  border: 1px solid var(--dash-line);
  border-radius: 10px;
  box-shadow: var(--dash-shadow);
}

.dash-stat {
  position: relative;
  min-height: 204px;
  padding: 28px 22px 20px;
  overflow: hidden;
}

.stat-menu {
  position: absolute;
  top: 17px;
  right: 14px;
  border: 0;
  background: transparent;
  color: #63739d;
  font-size: 24px;
  line-height: 1;
  padding: 0;
}

.stat-top {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
}

.stat-icon {
  width: 66px;
  height: 66px;
  display: grid;
  place-items: center;
  border-radius: 50%;
}

.stat-icon svg {
  width: 34px;
  height: 34px;
  stroke-width: 2.2;
}

.stat-icon.blue { color: var(--dash-blue); background: #e8efff; }
.stat-icon.green { color: #009465; background: #e2f5ec; }
.stat-icon.purple { color: var(--dash-purple); background: #efe4ff; }
.stat-icon.orange { color: var(--dash-orange); background: #fff0d9; }

.stat-top span {
  display: block;
  color: var(--dash-ink);
  font-size: 14px;
  line-height: 1.1;
  font-weight: 750;
}

.stat-top strong {
  display: block;
  margin-top: 8px;
  color: var(--dash-ink);
  font-size: 35px;
  line-height: .98;
  font-weight: 800;
  letter-spacing: -.025em;
}

.stat-top strong small {
  font-size: 20px;
  font-weight: 800;
}

.dash-stat p {
  margin: 25px 0 0;
  color: #364666;
  font-size: 14px;
  line-height: 1.2;
}

.dash-stat p b {
  color: #008a5e;
  font-weight: 700;
}

.dash-stat svg.spark {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 21px;
  width: calc(100% - 44px);
  height: 42px;
  margin: 0;
}

.dash-stat svg.spark path {
  fill: none;
  stroke-width: 2.1;
}

.dash-stat svg.spark.blue path { stroke: #074fff; }
.dash-stat svg.spark.green path { stroke: #009a68; }
.dash-stat svg.spark.purple path { stroke: #5a1cff; }

.storage-bar {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 34px;
  height: 8px;
  margin: 0;
  border-radius: 999px;
  background: #e7ecfb;
  overflow: hidden;
}

.storage-bar span {
  display: block;
  width: 50%;
  height: 100%;
  border-radius: inherit;
  background: var(--dash-orange);
}

.dashboard-panels {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.03fr);
  gap: 18px;
  margin-bottom: 17px;
}

.dash-panel {
  padding: 21px 23px 14px;
}

.dash-panel header {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid #dfe6f1;
}

.dash-panel header > div {
  display: flex;
  align-items: center;
  gap: 14px;
}

.dash-panel h2 {
  margin: 0;
  color: var(--dash-ink);
  font-size: 18px;
  line-height: 1;
  font-weight: 800;
}

.dash-panel header a,
.panel-bottom-link {
  color: #004fff;
  font-size: 15px;
  line-height: 1;
  font-weight: 650;
}

.panel-icon {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
}

.panel-icon svg {
  stroke-width: 2.2;
}

.panel-icon.blue { color: var(--dash-blue); }
.panel-icon.orange { color: #ff6400; }
.panel-icon.dark { color: var(--dash-ink); }

.question-list {
  min-height: 276px;
}

.question-row {
  display: grid;
  align-items: center;
  border-bottom: 1px solid #e3e9f2;
  color: var(--dash-ink);
}

.question-row.recent {
  grid-template-columns: 37px 1fr 72px;
  gap: 14px;
  min-height: 64px;
}

.question-row > span {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  border-radius: 7px;
}

.question-row.recent > span {
  color: var(--dash-blue);
  background: #edf3ff;
}

.question-row.unanswered > span {
  width: 29px;
  height: 29px;
  color: #ff6400;
  background: #ffffff;
}

.question-row svg {
  width: 22px;
  height: 22px;
  stroke-width: 2.2;
}

.question-row b {
  color: var(--dash-ink);
  font-size: 14px;
  line-height: 1.35;
  font-weight: 550;
}

.question-row small {
  justify-self: end;
  color: #344463;
  font-size: 13px;
  line-height: 1;
  font-weight: 400;
}

.question-row em {
  justify-self: end;
  border: 1px solid #ffc4c4;
  border-radius: 5px;
  padding: 7px 10px;
  background: #fff0f0;
  color: #e11919;
  font-size: 12px;
  line-height: 1;
  font-style: normal;
  font-weight: 550;
}

.question-row.unanswered {
  grid-template-columns: 33px minmax(0, 1fr) 91px 91px;
  gap: 14px;
  min-height: 81px;
}

.unanswered-list {
  padding-top: 8px;
  min-height: 292px;
}

.unanswered-list .question-row:last-child {
  border-bottom: 0;
}

.panel-bottom-link {
  display: block;
  margin: 14px auto 0;
  text-align: center;
}

.document-overview {
  padding-bottom: 11px;
}

.doc-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  padding-top: 16px;
}

.doc-stat-grid article {
  min-height: 90px;
  display: grid;
  grid-template-columns: 66px minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  padding: 10px 16px;
  box-shadow: none;
}

.doc-stat-grid .stat-icon {
  width: 52px;
  height: 52px;
  border-radius: 10px;
}

.doc-stat-grid .stat-icon svg {
  width: 31px;
  height: 31px;
}

.doc-stat-grid span:not(.stat-icon) {
  display: block;
  color: var(--dash-ink);
  font-size: 14px;
  line-height: 1;
  font-weight: 500;
}

.doc-stat-grid strong {
  display: block;
  margin-top: 8px;
  color: var(--dash-ink);
  font-size: 31px;
  line-height: .95;
  font-weight: 800;
  letter-spacing: -.025em;
}

.doc-stat-grid small {
  display: block;
  margin-top: 9px;
  color: #008a5e;
  font-size: 13px;
  line-height: 1;
  font-weight: 500;
}

.secure-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 10px 0 0;
  color: #3f4e70;
  font-size: 12px;
  line-height: 1;
}

.secure-note svg {
  width: 18px;
  height: 18px;
  color: #526a99;
}

@media (max-width: 1220px) {
  body.app-body {
    grid-template-columns: 250px minmax(0, 1fr);
  }

  .side-nav a {
    font-size: 12px;
  }

  .dashboard-stats,
  .doc-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  body.app-body {
    display: block;
  }

  .sidebar {
    position: relative;
    height: auto;
    min-height: 0;
  }

  .app-main {
    padding: 24px 16px;
  }

  .dashboard-head,
  .dashboard-panels {
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .date-control {
    width: 100%;
  }
}

@media (max-width: 620px) {
  .dashboard-stats,
  .doc-stat-grid {
    grid-template-columns: 1fr;
  }

  .question-row.unanswered {
    grid-template-columns: 33px 1fr;
  }

  .question-row.unanswered em,
  .question-row.unanswered small {
    justify-self: start;
    grid-column: 2;
  }
}

/* Documents module */
.documents-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
}

.documents-head h1 {
  margin: 0 0 9px;
  color: var(--dash-ink, #061545);
  font-size: 34px;
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.025em;
}

.documents-head p {
  margin: 0;
  color: var(--dash-muted, #39476c);
  font-size: 18px;
  line-height: 1.35;
}

.documents-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 3px;
}

.documents-icon-btn {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 9px;
  background: #ffffff;
  color: #526286;
  box-shadow: 0 7px 16px rgba(6, 21, 69, .06);
}

.documents-upload {
  min-height: 48px;
  padding-inline: 18px;
  gap: 10px;
}

.documents-upload svg,
.documents-icon-btn svg,
.documents-filter-panel svg,
.document-file-icon svg,
.document-row-actions svg,
.documents-stat svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.documents-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 17px;
  margin-bottom: 18px;
}

.documents-stat {
  min-height: 124px;
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr);
  align-items: center;
  gap: 17px;
  padding: 18px 21px;
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: var(--dash-shadow, 0 8px 20px rgba(6, 21, 69, .08));
}

.doc-stat-icon {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 13px;
}

.doc-stat-icon.blue { color: #0757ff; background: #e8efff; }
.doc-stat-icon.green { color: #008f63; background: #e2f5ec; }
.doc-stat-icon.orange { color: #e88a00; background: #fff3dd; }
.doc-stat-icon.red { color: #e12b3d; background: #ffe9ec; }

.documents-stat span:not(.doc-stat-icon) {
  display: block;
  color: var(--dash-ink, #061545);
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
}

.documents-stat strong {
  display: block;
  margin-top: 10px;
  color: var(--dash-ink, #061545);
  font-size: 33px;
  line-height: .95;
  font-weight: 800;
  letter-spacing: -.025em;
}

.documents-stat small {
  display: block;
  margin-top: 10px;
  color: #008a5e;
  font-size: 13px;
  line-height: 1;
  font-weight: 600;
}

.documents-filter-panel {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) 190px 160px auto;
  gap: 13px;
  align-items: center;
  margin-bottom: 18px;
  padding: 15px;
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 6px 17px rgba(6, 21, 69, .06);
}

.documents-search {
  position: relative;
  display: block;
  color: #697898;
  font-weight: 400;
}

.documents-search svg {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
}

.documents-filter-panel input,
.documents-filter-panel select {
  height: 44px;
  border: 1px solid #cfdced;
  border-radius: 8px;
  background: #ffffff;
  color: var(--dash-ink, #061545);
  font-size: 14px;
  font-weight: 500;
  box-shadow: none;
}

.documents-search input {
  padding-left: 43px;
}

.documents-filter-btn {
  height: 44px;
  gap: 9px;
  padding-inline: 15px;
  box-shadow: none;
}

.documents-table-panel {
  overflow: hidden;
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: var(--dash-shadow, 0 8px 20px rgba(6, 21, 69, .08));
}

.empty-state {
  display: flex;
  min-height: 180px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 32px;
  text-align: center;
  color: #52627f;
}

.empty-state strong {
  color: var(--dash-ink, #061545);
  font-size: 1.05rem;
}

.empty-state span {
  max-width: 440px;
  line-height: 1.55;
}

.empty-state.compact {
  min-height: 110px;
  align-items: flex-start;
  padding: 18px;
  text-align: left;
}

.documents-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--dash-ink, #061545);
  font-size: 14px;
}

.documents-table th {
  height: 48px;
  padding: 0 18px;
  border-bottom: 1px solid #e2e9f3;
  background: #fbfdff;
  color: #51617e;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .02em;
}

.documents-table td {
  height: 66px;
  padding: 0 18px;
  border-bottom: 1px solid #e5ebf4;
  vertical-align: middle;
  font-size: 14px;
}

.documents-table tbody tr:last-child td {
  border-bottom: 0;
}

.document-name-cell {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 300px;
}

.document-name-cell strong {
  color: var(--dash-ink, #061545);
  font-size: 14px;
  line-height: 1.25;
  font-weight: 700;
}

.document-row-note,
.document-error-note {
  display: block;
  margin-top: 4px;
  color: #667596;
  font-size: 12px;
  line-height: 1.3;
  font-weight: 600;
}

.document-error-note {
  max-width: 240px;
  color: #b42318;
}

.document-file-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 8px;
}

.document-file-icon.pdf,
.file-type-pill.pdf { color: #dc2626; background: #fff1f2; border-color: #fecaca; }
.document-file-icon.docx,
.file-type-pill.docx { color: #0757ff; background: #eff6ff; border-color: #bfdbfe; }
.document-file-icon.xlsx,
.file-type-pill.xlsx { color: #087f5b; background: #ecfdf3; border-color: #bbf7d0; }
.document-file-icon.pptx,
.file-type-pill.pptx { color: #ea580c; background: #fff7ed; border-color: #fed7aa; }
.document-file-icon.txt,
.file-type-pill.txt,
.document-file-icon.other,
.file-type-pill.other { color: #465773; background: #f2f6fb; border-color: #d9e2ef; }

.file-type-pill,
.document-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  height: 26px;
  padding: 0 9px;
  border: 1px solid;
  border-radius: 6px;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
}

.document-status-pill.indexed {
  color: #067647;
  border-color: #bbf7d0;
  background: #ecfdf3;
}

.document-status-pill.processing {
  color: #b45309;
  border-color: #fed7aa;
  background: #fff7ed;
}

.document-status-pill.failed {
  color: #dc2626;
  border-color: #fecaca;
  background: #fff1f2;
}

.document-status-pill.uploaded {
  color: #0757ff;
  border-color: #bfdbfe;
  background: #eff6ff;
}

.document-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.document-row-actions a {
  color: #0757ff;
  font-size: 13px;
  font-weight: 800;
}

.document-row-actions button {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid #d7e1ef;
  border-radius: 7px;
  background: #ffffff;
  color: #536482;
}

.document-row-actions form {
  margin: 0;
}

.document-row-actions .document-process-btn {
  width: auto;
  min-width: 72px;
  height: 34px;
  padding: 0 12px;
  color: #0757ff;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.document-ai-index-pill {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border: 1px solid #bbf7d0;
  border-radius: 999px;
  background: #f0fdf4;
  color: #047857;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.document-ai-index-pill.pending {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #c2410c;
}

.document-ai-index-pill.failed {
  border-color: #fecaca;
  background: #fef2f2;
  color: #dc2626;
}

.documents-pager {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 18px;
  border-top: 1px solid #e2e9f3;
  color: #536482;
  font-size: 14px;
}

.documents-pager nav {
  display: flex;
  align-items: center;
  gap: 7px;
}

.documents-pager button,
.documents-pager b,
.documents-pager a {
  min-width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid #d7e1ef;
  border-radius: 7px;
  background: #ffffff;
  color: #314368;
  font-weight: 700;
}

.documents-pager b {
  color: #0757ff;
  border-color: #0757ff;
}

.upload-head {
  margin-bottom: 18px;
}

.upload-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 18px;
  align-items: start;
}

.upload-card,
.upload-rules {
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(6, 21, 69, .07);
}

.upload-card {
  padding: 24px;
}

.upload-card-head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}

.upload-card-head h2,
.upload-rules h2 {
  margin: 0;
  color: var(--dash-ink, #061545);
  font-size: 20px;
  line-height: 1.2;
  font-weight: 800;
}

.upload-card-head p,
.upload-footer p,
.upload-rules dd {
  margin: 6px 0 0;
  color: var(--dash-muted, #39476c);
  font-size: 14px;
  line-height: 1.45;
}

.upload-icon {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 14px;
  color: #0757ff;
  background: #eaf1ff;
}

.upload-icon svg,
.upload-card svg,
.upload-rules svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.upload-dropzone {
  min-height: 180px;
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 28px;
  border: 1.5px dashed #aebfe0;
  border-radius: 10px;
  background: linear-gradient(180deg, #f9fbff 0%, #f2f7ff 100%);
  text-align: center;
  color: var(--dash-ink, #061545);
}

.upload-dropzone span {
  font-size: 18px;
  font-weight: 800;
}

.upload-dropzone small {
  max-width: 520px;
  color: var(--dash-muted, #39476c);
  font-size: 14px;
  line-height: 1.45;
}

.upload-dropzone input {
  max-width: 440px;
  margin-top: 10px;
  background: #ffffff;
}

.upload-fields {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 16px;
  margin-top: 18px;
}

.upload-fields label {
  color: var(--dash-ink, #061545);
  font-size: 14px;
  font-weight: 800;
}

.upload-fields input,
.upload-fields select {
  height: 46px;
  margin-top: 8px;
  border-color: #cfdced;
  border-radius: 8px;
}

.upload-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid #e5ebf4;
}

.upload-footer p {
  max-width: 560px;
  margin: 0;
}

.upload-rules {
  padding: 22px;
}

.upload-rules dl {
  display: grid;
  gap: 16px;
  margin: 18px 0 0;
}

.upload-rules div {
  padding-bottom: 15px;
  border-bottom: 1px solid #e5ebf4;
}

.upload-rules div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.upload-rules dt {
  color: var(--dash-ink, #061545);
  font-size: 14px;
  font-weight: 800;
}

.upload-alert ul {
  margin: 8px 0 0 18px;
  padding: 0;
}

/* Knowledge Library */
.knowledge-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
}

.knowledge-head h1 {
  margin: 0 0 9px;
  color: var(--dash-ink, #061545);
  font-size: 34px;
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.025em;
}

.knowledge-head p {
  margin: 0;
  color: var(--dash-muted, #39476c);
  font-size: 18px;
  line-height: 1.35;
}

.knowledge-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 3px;
}

.knowledge-folder-btn {
  min-height: 48px;
  padding-inline: 17px;
  gap: 9px;
  color: #0757ff;
}

.knowledge-filter-panel {
  display: grid;
  grid-template-columns: 220px minmax(320px, 1fr) auto;
  gap: 13px;
  align-items: center;
  margin-bottom: 18px;
  padding: 15px;
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 6px 17px rgba(6, 21, 69, .06);
}

.knowledge-filter-panel svg,
.knowledge-folder-btn svg,
.knowledge-table svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.knowledge-filter-panel input,
.knowledge-filter-panel select {
  height: 44px;
  border: 1px solid #cfdced;
  border-radius: 8px;
  background: #ffffff;
  color: var(--dash-ink, #061545);
  font-size: 14px;
  font-weight: 500;
  box-shadow: none;
}

.knowledge-table-panel {
  overflow: hidden;
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: var(--dash-shadow, 0 8px 20px rgba(6, 21, 69, .08));
}

.knowledge-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--dash-ink, #061545);
  font-size: 14px;
}

.knowledge-table th {
  height: 50px;
  padding: 0 18px;
  border-bottom: 1px solid #e2e9f3;
  background: #fbfdff;
  color: #51617e;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: .02em;
}

.knowledge-table th:last-child,
.knowledge-table td:last-child {
  text-align: right;
}

.knowledge-table td {
  height: 72px;
  padding: 0 18px;
  border-bottom: 1px solid #e5ebf4;
  vertical-align: middle;
  font-size: 14px;
}

.knowledge-table tbody tr:last-child td {
  border-bottom: 0;
}

.knowledge-name-cell {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 300px;
}

.knowledge-name-cell strong,
.knowledge-name-cell small {
  display: block;
}

.knowledge-name-cell strong {
  color: var(--dash-ink, #061545);
  font-size: 14px;
  line-height: 1.25;
  font-weight: 800;
}

.knowledge-name-cell small {
  margin-top: 4px;
  color: #667596;
  font-size: 12px;
  line-height: 1;
  font-weight: 600;
}

.knowledge-indexed-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 10px;
  border: 1px solid #bbf7d0;
  border-radius: 999px;
  background: #ecfdf3;
  color: #067647;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
}

.knowledge-indexed-pill svg {
  width: 15px;
  height: 15px;
}

.knowledge-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.knowledge-row-actions a,
.knowledge-row-actions button {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid #d7e1ef;
  border-radius: 7px;
  background: #ffffff;
}

.knowledge-row-actions a {
  color: #0757ff;
}

.knowledge-row-actions button {
  color: #536482;
}

.knowledge-row-actions svg {
  width: 18px;
  height: 18px;
}

.knowledge-pager nav span {
  min-width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  color: #536482;
  font-weight: 700;
}

.knowledge-pager button {
  min-width: 78px;
  padding-inline: 10px;
}

/* Templates screen */
.templates-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
}

.templates-head h1 {
  margin: 0 0 9px;
  color: var(--dash-ink, #061545);
  font-size: 34px;
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.025em;
}

.templates-head p {
  margin: 0;
  color: var(--dash-muted, #39476c);
  font-size: 16px;
  line-height: 1.35;
}

.templates-new-btn {
  min-height: 48px;
  padding-inline: 18px;
  gap: 9px;
}

.templates-head svg,
.templates-filter-panel svg,
.templates-table svg,
.templates-pager svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.templates-tabs {
  display: flex;
  align-items: center;
  gap: 34px;
  margin-bottom: 18px;
  border-bottom: 1px solid #dfe7f2;
}

.templates-tabs a {
  position: relative;
  padding: 0 0 13px;
  color: #334461;
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
}

.templates-tabs a.active {
  color: #0757ff;
}

.templates-tabs a.active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: #0757ff;
}

.templates-filter-panel {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) 190px 210px auto;
  gap: 13px;
  align-items: center;
  margin-bottom: 18px;
  padding: 15px;
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px 10px 0 0;
  background: #ffffff;
  box-shadow: 0 6px 17px rgba(6, 21, 69, .04);
}

.templates-search {
  position: relative;
  display: block;
  color: #697898;
  font-weight: 400;
}

.templates-search svg {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
}

.templates-filter-panel input,
.templates-filter-panel select {
  height: 44px;
  border: 1px solid #cfdced;
  border-radius: 8px;
  background: #ffffff;
  color: var(--dash-ink, #061545);
  font-size: 14px;
  font-weight: 500;
  box-shadow: none;
}

.templates-search input {
  padding-left: 42px;
}

.templates-filter-submit {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid #cfdced;
  border-radius: 8px;
  background: #ffffff;
  color: #536482;
}

.templates-table-panel {
  overflow: hidden;
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: var(--dash-shadow, 0 8px 20px rgba(6, 21, 69, .08));
}

.templates-filter-panel + .templates-table-panel {
  margin-top: -18px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.templates-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--dash-ink, #061545);
  font-size: 14px;
}

.templates-table th {
  height: 50px;
  padding: 0 18px;
  border-bottom: 1px solid #e2e9f3;
  background: #fbfdff;
  color: #51617e;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
  text-align: left;
}

.templates-table th:last-child,
.templates-table td:last-child {
  text-align: right;
}

.templates-table td {
  height: 72px;
  padding: 0 18px;
  border-bottom: 1px solid #e5ebf4;
  vertical-align: middle;
  font-size: 14px;
}

.templates-table td small {
  display: block;
  margin-top: 4px;
  color: #667596;
  font-size: 12px;
  line-height: 1.2;
}

.templates-table tbody tr:last-child td {
  border-bottom: 0;
}

.template-name-cell {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 350px;
}

.template-name-cell strong {
  color: #0757d8;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 800;
}

.template-file-icon {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: #0757ff;
}

.template-file-icon svg {
  width: 20px;
  height: 20px;
}

.template-type-pill,
.template-category-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 54px;
  height: 24px;
  padding: 0 9px;
  border: 1px solid #d5deeb;
  border-radius: 6px;
  background: #eef3fa;
  color: #334461;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
}

.template-type-pill.email {
  color: #31517f;
  border-color: #d2dceb;
  background: #edf2f9;
}

.template-type-pill.sop {
  color: #0757ff;
  border-color: #bfdbfe;
  background: #eff6ff;
}

.template-type-pill.checklist {
  color: #087f5b;
  border-color: #bbf7d0;
  background: #ecfdf3;
}

.template-type-pill.faq {
  color: #5b21b6;
  border-color: #ddd6fe;
  background: #f1edff;
}

.template-type-pill.other {
  color: #465773;
  border-color: #d9e2ef;
  background: #f2f6fb;
}

.template-category-pill {
  min-width: 0;
  background: #f1f5f9;
  color: #475569;
}

.template-action-btn {
  width: 36px;
  height: 36px;
  display: inline-grid;
  place-items: center;
  border: 1px solid #d7e1ef;
  border-radius: 7px;
  background: #ffffff;
  color: #536482;
}

.template-action-btn svg {
  width: 18px;
  height: 18px;
}

.templates-pager {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 18px;
  border-top: 1px solid #e2e9f3;
  color: #536482;
  font-size: 14px;
}

.templates-pager nav {
  display: flex;
  align-items: center;
  gap: 7px;
}

.templates-pager button,
.templates-pager b,
.templates-pager a,
.templates-pager span:not(:first-child) {
  min-width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid #d7e1ef;
  border-radius: 7px;
  background: #ffffff;
  color: #314368;
  font-weight: 700;
}

.templates-pager span:not(:first-child) {
  border-color: transparent;
  background: transparent;
  color: #536482;
}

.templates-pager b {
  color: #0757ff;
  border-color: #0757ff;
}

.templates-pager button svg {
  width: 17px;
  height: 17px;
}

/* Checklists screen */
.checklists-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
}

.checklists-head h1 {
  margin: 0 0 9px;
  color: var(--dash-ink, #061545);
  font-size: 34px;
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.025em;
}

.checklists-head p {
  margin: 0;
  color: var(--dash-muted, #39476c);
  font-size: 16px;
  line-height: 1.35;
}

.checklists-new-btn {
  min-height: 48px;
  padding-inline: 18px;
  gap: 9px;
}

.checklists-head svg,
.checklists-stat svg,
.checklists-filter-panel svg,
.checklists-table svg,
.checklists-pager svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.checklists-tabs {
  display: flex;
  align-items: center;
  gap: 34px;
  margin-bottom: 18px;
  border-bottom: 1px solid #dfe7f2;
}

.checklists-tabs a {
  position: relative;
  padding: 0 0 13px;
  color: #334461;
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
}

.checklists-tabs a.active {
  color: #0757ff;
}

.checklists-tabs a.active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: #0757ff;
}

.checklists-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 17px;
  margin-bottom: 18px;
}

.checklists-stat {
  min-height: 118px;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 17px;
  padding: 18px;
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: var(--dash-shadow, 0 8px 20px rgba(6, 21, 69, .08));
}

.checklist-stat-icon {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  border-radius: 13px;
}

.checklist-stat-icon.orange { color: #f59e0b; background: #fff3dd; }
.checklist-stat-icon.green { color: #008f63; background: #e2f5ec; }
.checklist-stat-icon.red { color: #ef4444; background: #ffe9ec; }

.checklists-stat span:not(.checklist-stat-icon) {
  display: block;
  color: var(--dash-ink, #061545);
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
}

.checklists-stat strong {
  display: block;
  margin-top: 10px;
  color: var(--dash-ink, #061545);
  font-size: 31px;
  line-height: .98;
  font-weight: 800;
  letter-spacing: -.025em;
}

.checklists-stat strong.compact {
  max-width: 190px;
  font-size: 15px;
  line-height: 1.22;
  letter-spacing: 0;
}

.checklists-stat small {
  display: block;
  margin-top: 10px;
  color: #008a5e;
  font-size: 13px;
  line-height: 1;
  font-weight: 600;
}

.checklists-filter-panel {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) 220px;
  gap: 13px;
  align-items: center;
  margin-bottom: 18px;
  padding: 15px;
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px 10px 0 0;
  background: #ffffff;
  box-shadow: 0 6px 17px rgba(6, 21, 69, .04);
}

.checklists-search {
  position: relative;
  display: block;
  color: #697898;
  font-weight: 400;
}

.checklists-search svg {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
}

.checklists-filter-panel input,
.checklists-filter-panel select {
  height: 44px;
  border: 1px solid #cfdced;
  border-radius: 8px;
  background: #ffffff;
  color: var(--dash-ink, #061545);
  font-size: 14px;
  font-weight: 500;
  box-shadow: none;
}

.checklists-search input {
  padding-left: 42px;
}

.checklists-table-panel {
  overflow: hidden;
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: var(--dash-shadow, 0 8px 20px rgba(6, 21, 69, .08));
}

.checklists-filter-panel + .checklists-table-panel {
  margin-top: -18px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.checklists-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--dash-ink, #061545);
  font-size: 14px;
}

.checklists-table th {
  height: 50px;
  padding: 0 18px;
  border-bottom: 1px solid #e2e9f3;
  background: #fbfdff;
  color: #51617e;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
  text-align: left;
}

.checklists-table th:last-child,
.checklists-table td:last-child {
  text-align: right;
}

.checklists-table td {
  height: 68px;
  padding: 0 18px;
  border-bottom: 1px solid #e5ebf4;
  vertical-align: middle;
  font-size: 14px;
}

.checklists-table tbody tr:last-child td {
  border-bottom: 0;
}

.checklist-name-cell {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 330px;
}

.checklist-name-cell strong {
  color: #0757d8;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 800;
}

.checklist-row-icon {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  color: #0757ff;
}

.checklist-row-icon svg {
  width: 19px;
  height: 19px;
}

.checklist-category-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 24px;
  padding: 0 9px;
  border: 1px solid #d5deeb;
  border-radius: 6px;
  background: #f1f5f9;
  color: #475569;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
}

.checklist-action-btn {
  width: 36px;
  height: 36px;
  display: inline-grid;
  place-items: center;
  border: 1px solid #d7e1ef;
  border-radius: 7px;
  background: #ffffff;
  color: #536482;
}

.checklist-action-btn svg {
  width: 18px;
  height: 18px;
}

.checklists-pager {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 18px;
  border-top: 1px solid #e2e9f3;
  color: #536482;
  font-size: 14px;
}

.checklists-pager nav {
  display: flex;
  align-items: center;
  gap: 7px;
}

.checklists-pager button,
.checklists-pager b,
.checklists-pager a {
  min-width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid #d7e1ef;
  border-radius: 7px;
  background: #ffffff;
  color: #314368;
  font-weight: 700;
}

.checklists-pager b {
  color: #0757ff;
  border-color: #0757ff;
}

.checklists-pager button svg {
  width: 17px;
  height: 17px;
}

/* Draft Email screen */
.draft-email-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 30px;
}

.draft-email-head h1 {
  margin: 0 0 9px;
  color: var(--dash-ink, #061545);
  font-size: 34px;
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.025em;
}

.draft-email-head p {
  margin: 0;
  color: var(--dash-muted, #39476c);
  font-size: 18px;
  line-height: 1.35;
}

.draft-email-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}

.draft-header-btn {
  min-height: 54px;
  min-width: 132px;
  gap: 10px;
  color: #071846;
  font-size: 16px;
  box-shadow: 0 7px 16px rgba(6, 21, 69, .06);
}

.draft-email-head svg,
.draft-email-card svg,
.draft-generate-btn svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.draft-email-layout {
  display: grid;
  grid-template-columns: minmax(360px, 430px) minmax(0, 1fr);
  gap: 26px;
  align-items: stretch;
}

.draft-email-card {
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 12px;
  background: #ffffff;
  box-shadow: var(--dash-shadow, 0 8px 20px rgba(6, 21, 69, .08));
}

.draft-email-card h2 {
  display: flex;
  align-items: center;
  gap: 13px;
  margin: 0 0 28px;
  color: var(--dash-ink, #061545);
  font-size: 20px;
  line-height: 1;
  font-weight: 800;
}

.draft-email-card h2 svg {
  color: #0757ff;
  width: 28px;
  height: 28px;
}

.draft-email-form {
  padding: 31px 22px 32px;
}

.draft-email-form label,
.draft-generated-card label {
  display: grid;
  gap: 10px;
  margin-bottom: 24px;
  color: #182a52;
  font-size: 16px;
  line-height: 1;
  font-weight: 500;
}

.draft-email-form input,
.draft-email-form select,
.draft-email-form textarea,
.draft-generated-card input {
  border: 1px solid #cfdced;
  border-radius: 8px;
  background: #ffffff;
  color: var(--dash-ink, #061545);
  font-size: 16px;
  font-weight: 500;
  box-shadow: none;
}

.draft-email-form select,
.draft-email-form input,
.draft-generated-card input {
  height: 48px;
}

.draft-email-form textarea {
  min-height: 108px;
  resize: vertical;
  line-height: 1.55;
}

.draft-label-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.draft-label-row svg {
  width: 16px;
  height: 16px;
  color: #7c8aa7;
}

.draft-attachments {
  display: grid;
  gap: 14px;
  margin: 0 0 28px;
}

.draft-attachments h3 {
  margin: 0;
  color: #182a52;
  font-size: 16px;
  font-weight: 500;
}

.draft-attachments h3 span {
  color: #667596;
}

.draft-attachment {
  min-height: 58px;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid #cfdced;
  border-radius: 8px;
  background: #ffffff;
}

.draft-pdf-icon {
  width: 28px;
  height: 34px;
  border-radius: 4px;
  display: grid;
  place-items: center;
  background: #dc2626;
  color: #ffffff;
  font-size: 9px;
  line-height: 1;
  font-weight: 900;
}

.draft-attachment strong,
.draft-attachment small {
  display: block;
}

.draft-attachment strong {
  color: #071846;
  font-size: 14px;
  line-height: 1.15;
  font-weight: 700;
}

.draft-attachment small {
  margin-top: 4px;
  color: #526286;
  font-size: 13px;
}

.draft-attachment button {
  border: 0;
  background: transparent;
  color: #536482;
  font-size: 20px;
  line-height: 1;
}

.draft-drop-zone {
  min-height: 84px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  border: 1px dashed #9fb1d1;
  border-radius: 8px;
  color: #0757ff;
  background: #ffffff;
}

.draft-drop-zone strong {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 16px;
  line-height: 1;
  font-weight: 700;
}

.draft-drop-zone strong svg {
  width: 20px;
  height: 20px;
}

.draft-drop-zone small {
  color: #526286;
  font-size: 14px;
}

.draft-drop-zone a {
  color: #0757ff;
  font-weight: 800;
}

.draft-generate-btn {
  width: 100%;
  min-height: 58px;
  gap: 11px;
  border-radius: 8px;
  font-size: 18px;
  font-weight: 800;
}

.draft-generated-card {
  min-height: 760px;
  padding: 31px 24px 24px;
}

.draft-generated-card label {
  margin-bottom: 38px;
}

.draft-generated-card input {
  width: 100%;
}

.draft-generated-body {
  color: #071846;
  font-size: 18px;
  line-height: 1.55;
}

.draft-generated-body p {
  margin: 0 0 24px;
}

.draft-generated-body strong {
  font-weight: 850;
}

.draft-generated-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.draft-generated-actions .btn {
  min-height: 44px;
  gap: 8px;
  font-size: 15px;
}

.draft-generated-card footer {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 70px;
  padding-top: 22px;
  border-top: 1px solid #dfe7f2;
  color: #536482;
  font-size: 15px;
}

.draft-generated-card footer svg {
  width: 22px;
  height: 22px;
  color: #536db0;
}

.draft-helper-note {
  margin: 14px 0 0;
  color: #526286;
  font-size: 14px;
  line-height: 1.45;
}

/* Settings screen */
.settings-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px;
}

.settings-head h1 {
  margin: 0 0 9px;
  color: var(--dash-ink, #061545);
  font-size: 34px;
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -.025em;
}

.settings-head p {
  margin: 0;
  color: var(--dash-muted, #39476c);
  font-size: 16px;
  line-height: 1.35;
}

.settings-tabs {
  display: flex;
  align-items: center;
  gap: 56px;
  margin-bottom: 22px;
  border-bottom: 1px solid #dfe7f2;
}

.settings-tabs a {
  position: relative;
  padding: 0 0 13px;
  color: #334461;
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
}

.settings-tabs a.active {
  color: #0757ff;
}

.settings-tabs a.active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: #0757ff;
}

.settings-layout {
  display: grid;
  grid-template-columns: minmax(340px, 1fr) minmax(420px, 1.08fr);
  gap: 24px;
  align-items: start;
}

.settings-card {
  border: 1px solid var(--dash-line, #dbe4f1);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: var(--dash-shadow, 0 8px 20px rgba(6, 21, 69, .08));
  padding: 22px 24px 24px;
}

.settings-card h2 {
  margin: 0 0 22px;
  color: var(--dash-ink, #061545);
  font-size: 18px;
  line-height: 1.1;
  font-weight: 800;
}

.settings-card label {
  display: grid;
  gap: 9px;
  margin-bottom: 17px;
  color: #182a52;
  font-size: 13px;
  line-height: 1;
  font-weight: 700;
}

.settings-card input,
.settings-card select {
  height: 42px;
  border: 1px solid #cfdced;
  border-radius: 7px;
  background: #ffffff;
  color: var(--dash-ink, #061545);
  font-size: 14px;
  font-weight: 500;
  box-shadow: none;
}

.settings-save-btn {
  min-height: 42px;
  padding-inline: 18px;
  margin-top: 3px;
  box-shadow: none;
}

.settings-side-stack {
  display: grid;
  gap: 24px;
}

.settings-field-label {
  display: block;
  margin-bottom: 10px;
  color: #182a52;
  font-size: 13px;
  line-height: 1;
  font-weight: 700;
}

.settings-logo-row {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 18px;
  align-items: center;
  margin-bottom: 20px;
}

.settings-logo-preview {
  width: 92px;
  height: 78px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #071846;
  color: #ffffff;
  text-align: center;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 17px;
  line-height: 1.05;
  letter-spacing: .02em;
  box-shadow: 0 10px 20px rgba(7, 24, 70, .18);
}

.settings-upload-btn {
  min-height: 40px;
  padding-inline: 16px;
  box-shadow: none;
}

.settings-logo-row small {
  display: block;
  margin-top: 10px;
  color: #667596;
  font-size: 12px;
}

.settings-color-row {
  display: grid;
  grid-template-columns: 32px minmax(0, 145px);
  gap: 9px;
  align-items: center;
}

.settings-color-swatch {
  width: 32px;
  height: 32px;
  border: 1px solid #cfdced;
  border-radius: 5px;
  display: block;
}

.settings-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

@media (max-width: 1160px) {
  .documents-stat-grid,
  .documents-filter-panel,
  .knowledge-filter-panel,
  .templates-filter-panel,
  .checklists-stat-grid,
  .checklists-filter-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .documents-table-panel,
  .knowledge-table-panel,
  .templates-table-panel,
  .checklists-table-panel {
    overflow-x: auto;
  }

  .documents-table,
  .knowledge-table,
  .templates-table,
  .checklists-table {
    min-width: 980px;
  }

  .draft-email-layout {
    grid-template-columns: 1fr;
  }

  .settings-layout {
    grid-template-columns: 1fr;
  }

  .upload-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .documents-head,
  .knowledge-head,
  .templates-head,
  .checklists-head,
  .templates-pager,
  .checklists-pager,
  .draft-email-head,
  .settings-head,
  .documents-pager {
    flex-direction: column;
    align-items: stretch;
  }

  .documents-actions,
  .knowledge-actions,
  .templates-tabs,
  .templates-pager nav,
  .checklists-tabs,
  .checklists-pager nav,
  .draft-email-actions,
  .settings-tabs,
  .documents-pager nav {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .documents-stat-grid,
  .documents-filter-panel,
  .knowledge-filter-panel,
  .templates-filter-panel,
  .checklists-stat-grid,
  .checklists-filter-panel {
    grid-template-columns: 1fr;
  }

  .settings-tabs {
    gap: 20px;
  }

  .settings-split,
  .settings-logo-row,
  .upload-fields,
  .upload-footer {
    grid-template-columns: 1fr;
  }

  .upload-footer {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (max-width: 760px) {
  .marketing-header {
    padding: 0 1rem;
  }

  .public-logo {
    font-size: 1.25rem;
  }

  .landing {
    padding: 0 1rem 1rem;
  }

  .hero h1 {
    font-size: 2.5rem;
  }

  .hero-copy > p {
    font-size: 1.05rem;
  }

  .landing-preview {
    height: auto;
    min-height: 0;
  }

  .feature-grid,
  .lower-grid {
    grid-template-columns: 1fr;
  }
}