:root {
  --ink: #172238;
  --muted: #637188;
  --line: #dbe3ee;
  --paper: #ffffff;
  --blue: #2765e8;
  --green: #0d8f68;
  --rose: #e1566f;
  --lemon: #f4c542;
  --sky: #cbeafe;
  --mint: #bdf3d6;
}

html { font-size: 14px; }
@media (min-width: 768px) { html { font-size: 16px; } }

body.lead-app {
  background:
    radial-gradient(circle at 8% 12%, rgba(255, 196, 87, .28), transparent 24rem),
    radial-gradient(circle at 92% 10%, rgba(45, 160, 232, .2), transparent 22rem),
    linear-gradient(180deg, #f7fbff 0%, #fff8f0 46%, #f4fbf7 100%);
  color: var(--ink);
  font-family: Tahoma, Geneva, sans-serif;
  letter-spacing: 0;
  margin: 0;
}

.app-width { max-width: 1360px; }
.app-nav {
  background: rgba(255,255,255,.96);
  border-bottom: 3px solid #ffbd59;
  box-shadow: 0 .8rem 1.8rem rgba(35,54,94,.08);
  margin-bottom: 1.2rem;
}
.nav-inner, .brand, .nav-user, .actions, .row-actions {
  align-items: center;
  display: flex;
  gap: .7rem;
}
.nav-inner { min-height: 4.2rem; justify-content: space-between; }
.brand { color: var(--ink); font-weight: 800; text-decoration: none; }
.logo-brand img {
  display: block;
  height: 3.05rem;
  max-width: min(22rem, 42vw);
  object-fit: contain;
}
.brand span, .brand-mark {
  align-items: center;
  background: linear-gradient(135deg, #0d8f68, #2765e8);
  border-radius: 8px;
  color: #fff;
  display: inline-flex;
  font-weight: 800;
  height: 2.1rem;
  justify-content: center;
  width: 2.1rem;
}
.app-nav nav { display: flex; gap: .25rem; }
.nav-toggle {
  background: #172238;
  border: 0;
  border-radius: 8px;
  color: #fff;
  display: none;
  font-family: Tahoma, Geneva, sans-serif;
  font-weight: 800;
  padding: .55rem .85rem;
}
.app-nav nav a, .nav-dropdown > button {
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: var(--ink);
  font-family: Tahoma, Geneva, sans-serif;
  font-weight: 650;
  padding: .48rem .72rem;
  text-decoration: none;
}
.app-nav nav a:hover, .nav-dropdown > button:hover { background: #eaf1ff; color: var(--blue); }
.nav-dropdown {
  position: relative;
}
.nav-dropdown-menu {
  background: rgba(255,255,255,.98);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 .9rem 1.8rem rgba(31,50,71,.13);
  display: none;
  left: 0;
  min-width: 11rem;
  padding: .35rem;
  position: absolute;
  top: 100%;
  z-index: 30;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu {
  display: grid;
}
.nav-user form, .row-actions form, .inline-form { margin: 0; }

.page-head {
  align-items: end;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin: .4rem 0 1rem;
}
.eyebrow { color: #6b4fd8; font-size: .78rem; font-weight: 800; margin: 0 0 .18rem; text-transform: uppercase; }
h1 { font-size: 2.1rem; font-weight: 800; margin: 0; }
h2 { font-size: 1.08rem; font-weight: 750; margin: 0; }

.panel {
  background: rgba(255,255,255,.96);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 1rem 2rem rgba(31,50,71,.08);
  margin-bottom: 1rem;
  padding: 1rem;
}
.panel-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: .7rem;
}
.panel-head span, .app-table small { color: var(--muted); }

.metric-grid {
  display: grid;
  gap: .85rem;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: 1rem;
}
.metric {
  border: 1px solid rgba(38,56,75,.1);
  border-radius: 8px;
  display: grid;
  min-height: 6.8rem;
  padding: .9rem;
  transition: transform .18s ease, box-shadow .18s ease;
}
.metric:hover { box-shadow: 0 1rem 1.8rem rgba(31,50,71,.12); transform: translateY(-2px); }
.metric span { color: #42546a; font-weight: 700; }
.metric strong { align-self: end; font-size: 1.85rem; line-height: 1; }
.mint { background: var(--mint); }
.sky { background: var(--sky); }
.green { background: #c8f0d7; }
.rose { background: #ffd5df; }
.lemon { background: #ffe991; }

.filter-row, .mis-filter {
  align-items: end;
  display: grid;
  gap: .65rem;
  margin-bottom: 1rem;
}
.filter-row { grid-template-columns: minmax(16rem, 1.5fr) repeat(3, minmax(10rem, .8fr)) auto; }
.mis-filter { grid-template-columns: repeat(7, minmax(9rem, 1fr)) auto; }
.form-grid {
  display: grid;
  gap: .85rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.form-grid .wide { grid-column: 1 / -1; }
.form-control, .form-select, .btn { border-radius: 8px; }
.btn { font-weight: 650; }
.stack-form { display: grid; gap: .75rem; }

.app-table { margin: 0; }
.app-table th { color: #526177; font-size: .8rem; text-transform: uppercase; white-space: nowrap; }
.app-table td strong, .app-table td small { display: block; }
.tag {
  background: #e7ddff;
  border-radius: 999px;
  color: #6245a6;
  display: inline-flex;
  font-size: .78rem;
  font-weight: 800;
  padding: .38rem .58rem;
}
.inline-form {
  display: grid;
  gap: .35rem;
  grid-template-columns: minmax(8rem, 1fr) auto;
  margin-top: .45rem;
}
.danger-panel { border-top: 4px solid #e1566f; }

.login-shell {
  align-items: center;
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: 1rem;
  position: relative;
  z-index: 1;
}
.login-panel {
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(219,227,238,.9);
  border-top: 5px solid #ffbd59;
  border-radius: 8px;
  box-shadow: 0 1.4rem 3rem rgba(31,50,71,.14);
  display: grid;
  gap: 1rem;
  max-width: 28rem;
  overflow: hidden;
  padding: 1.15rem;
  position: relative;
  width: min(100%, 28rem);
}
.login-panel::before {
  background: linear-gradient(90deg, rgba(39,101,232,.13), rgba(13,143,104,.12), rgba(255,189,89,.22));
  content: "";
  height: 4.6rem;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
}
.login-logo {
  display: block;
  height: 3.6rem;
  max-width: 100%;
  object-fit: contain;
  object-position: left center;
}
.login-copy {
  color: var(--muted);
  margin: -.45rem 0 0;
}
.login-page {
  min-height: 100vh;
  overflow: hidden;
  position: relative;
}
.login-page::before {
  animation: loginGlow 7s ease-in-out infinite;
  background: conic-gradient(from 120deg, rgba(39,101,232,.18), rgba(13,143,104,.18), rgba(255,189,89,.24), rgba(225,86,111,.15), rgba(39,101,232,.18));
  border-radius: 999px;
  content: "";
  filter: blur(18px);
  height: 32rem;
  left: 50%;
  position: absolute;
  top: 50%;
  translate: -50% -50%;
  width: 32rem;
}
.login-shape {
  animation: floaty 4.2s ease-in-out infinite;
  border-radius: 8px;
  box-shadow: 0 1rem 2rem rgba(31,50,71,.12);
  position: absolute;
  z-index: 0;
}
.shape-one {
  background: #2765e8;
  height: 5.2rem;
  left: 10%;
  top: 16%;
  transform: rotate(-12deg);
  width: 7.2rem;
}
.shape-two {
  animation-delay: .55s;
  background: #ffbd59;
  height: 4rem;
  right: 12%;
  top: 22%;
  transform: rotate(10deg);
  width: 5.6rem;
}
.shape-three {
  animation-delay: 1s;
  background: #0d8f68;
  bottom: 14%;
  height: 4.8rem;
  right: 18%;
  transform: rotate(-7deg);
  width: 6.4rem;
}
.login-stickers {
  height: 4.6rem;
  position: absolute;
  right: 1rem;
  top: .9rem;
  width: 5.8rem;
}
.login-stickers span {
  animation: floaty 3.2s ease-in-out infinite;
  border-radius: 8px;
  display: block;
  position: absolute;
}
.login-stickers span:nth-child(1) { background: #2765e8; height: 2.3rem; left: .3rem; top: 1.1rem; transform: rotate(-9deg); width: 3.6rem; }
.login-stickers span:nth-child(2) { animation-delay: .4s; background: #ffbd59; height: 2.1rem; right: .15rem; top: .15rem; transform: rotate(12deg); width: 2.8rem; }
.login-stickers span:nth-child(3) { animation-delay: .75s; background: #0d8f68; bottom: .15rem; height: 1.8rem; left: 1.2rem; transform: rotate(4deg); width: 3.2rem; }
.hint-box {
  background: #fbfdff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  display: grid;
  gap: .35rem;
  padding: .72rem;
}

.dashboard-hero {
  align-items: center;
  background: linear-gradient(135deg, #ffffff 0%, #f6fbff 38%, #fff1c7 100%);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 1rem 2rem rgba(31,50,71,.08);
  display: flex;
  justify-content: space-between;
  margin: .4rem 0 1rem;
  min-height: 10rem;
  overflow: hidden;
  padding: 1.3rem;
  position: relative;
}
.dashboard-hero h1 { font-size: 2.35rem; }
.dashboard-hero p:not(.eyebrow) { color: var(--muted); margin: .35rem 0 0; }
.hero-sticker {
  align-items: center;
  display: grid;
  height: 7rem;
  justify-items: center;
  position: relative;
  width: 12rem;
}
.hero-sticker span {
  border-radius: 8px;
  box-shadow: 0 .8rem 1.4rem rgba(31,50,71,.12);
  display: block;
  position: absolute;
}
.hero-sticker span:nth-child(1) { animation: floaty 3.4s ease-in-out infinite; background: #2765e8; height: 4rem; transform: rotate(-8deg); width: 6rem; }
.hero-sticker span:nth-child(2) { animation: floaty 3.4s ease-in-out .35s infinite; background: #ffbd59; height: 3.2rem; right: 1.4rem; top: .7rem; transform: rotate(10deg); width: 4.3rem; }
.hero-sticker span:nth-child(3) { animation: floaty 3.4s ease-in-out .7s infinite; background: #0d8f68; bottom: .6rem; height: 2.6rem; right: 4.3rem; transform: rotate(5deg); width: 5rem; }
.dashboard-metrics .metric { min-height: 5.7rem; }
.notification-grid {
  display: grid;
  gap: .85rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 1rem;
}
.notify-card {
  background: rgba(255,255,255,.96);
  border: 1px solid var(--line);
  border-left: 5px solid var(--blue);
  border-radius: 8px;
  box-shadow: 0 .8rem 1.5rem rgba(31,50,71,.08);
  color: var(--ink);
  display: grid;
  gap: .32rem;
  min-height: 6.2rem;
  padding: .9rem;
  position: relative;
  text-decoration: none;
}
.notify-card:hover { color: var(--ink); transform: translateY(-2px); }
.notify-card small { color: var(--muted); }
.notify-card.success { border-left-color: var(--green); }
.notify-card.warning { border-left-color: #f0a202; }
.notify-card.danger { border-left-color: var(--rose); }
.notify-dot {
  animation: pulse 1.6s ease-in-out infinite;
  background: currentColor;
  border-radius: 999px;
  height: .6rem;
  position: absolute;
  right: .85rem;
  top: .85rem;
  width: .6rem;
}
.reminder-list, .timeline {
  display: grid;
  gap: .65rem;
}
.reminder-item {
  align-items: center;
  background: #fbfdff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  display: grid;
  gap: .1rem .7rem;
  grid-template-columns: 4.4rem 1fr;
  padding: .7rem;
  text-decoration: none;
}
.reminder-item:hover { background: #eef7ff; color: var(--ink); }
.reminder-item strong, .reminder-item small { grid-column: 2; }
.reminder-item small, .timeline-item small, .timeline-item time { color: var(--muted); }
.calendar-chip {
  align-items: center;
  background: #e7ddff;
  border-radius: 8px;
  color: #6245a6;
  display: inline-flex;
  font-weight: 800;
  grid-row: 1 / span 2;
  height: 3rem;
  justify-content: center;
}
.reminder-item.late .calendar-chip { background: #ffd5df; color: #a62f4e; }
.reminder-item.today .calendar-chip { background: #ffe991; color: #694c00; }
.empty-state, .log-line {
  background: #fbfdff;
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--muted);
  padding: .8rem;
}
.detail-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.detail-list {
  display: grid;
  gap: .55rem .8rem;
  grid-template-columns: 8rem 1fr;
  margin: 0;
}
.detail-list dt { color: var(--muted); font-weight: 700; }
.detail-list dd { margin: 0; }
.followup-form {
  display: grid;
  gap: .7rem;
  grid-template-columns: 10rem 1fr 14rem auto;
}
.auto-fill-panel {
  border-top: 4px solid #2765e8;
}
.auto-fill-grid {
  display: grid;
  gap: .75rem;
  grid-template-columns: minmax(0, 1fr) auto;
}
.auto-fill-actions {
  align-content: start;
  display: grid;
  gap: .55rem;
  min-width: 8rem;
}
.timeline-item {
  border-left: 4px solid #cbeafe;
  background: #fbfdff;
  border-radius: 0 8px 8px 0;
  padding: .75rem .85rem;
}
.timeline-item strong, .timeline-item small, .timeline-item time { display: block; }
.timeline-item p { margin: .25rem 0 0; }
.permission-grid {
  display: grid;
  gap: .65rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.permission-grid label {
  background: #fbfdff;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-weight: 700;
  padding: .65rem;
}
.permission-grid input { margin-right: .45rem; }
.pulse-card { animation: breathe 2.2s ease-in-out infinite; }

.master-shell {
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) 25rem;
}
.master-form {
  border-top: 4px solid #0d8f68;
}
.master-section {
  background: #fbfdff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: .75rem;
  padding: .85rem;
}
.price-section-head {
  align-items: center;
  display: flex;
  gap: .65rem;
  justify-content: space-between;
}
.price-section-head h2 {
  margin: 0;
}
.currency-badge {
  background: #e8fff5;
  border: 1px solid #a7e4c9;
  border-radius: 999px;
  color: #08724e;
  font-size: .82rem;
  font-weight: 800;
  padding: .28rem .7rem;
}
.three-column {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.four-column {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.image-upload-grid {
  display: grid;
  gap: .85rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.image-upload-grid.single-upload {
  grid-template-columns: minmax(0, 1fr);
}
.upload-card {
  background: #fbfdff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: .55rem;
  padding: .85rem;
}
.upload-card img {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  max-height: 8rem;
  object-fit: contain;
  padding: .45rem;
  width: 100%;
}
.disabled-upload {
  opacity: .58;
}
.disabled-upload input {
  cursor: not-allowed;
}
.letterhead-card img {
  max-height: 16rem;
}
.master-list {
  align-self: start;
}
.pricing-shell {
  grid-template-columns: minmax(0, 1fr) 30rem;
}
.price-list-filter {
  background: #f8fbff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: .6rem;
  margin-bottom: .8rem;
  padding: .75rem;
}
.price-list-filter .form-label {
  font-size: .82rem;
  margin-bottom: .2rem;
}
.filter-actions {
  display: flex;
  gap: .45rem;
}
.list-summary {
  color: var(--muted);
  font-size: .84rem;
  margin-bottom: .55rem;
}
.feature-master-shell {
  grid-template-columns: minmax(0, 1fr) 26rem;
}
.template-master-shell {
  grid-template-columns: minmax(0, 1fr) 26rem;
}
.template-preview-card {
  background: #f8fbff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: .7rem;
  padding: .85rem;
}
.template-preview-frame {
  background: #f3f6fb;
  border: 1px solid var(--line);
  border-radius: 8px;
  height: 38rem;
  overflow: auto;
  padding: 1rem;
  width: 100%;
}
.template-preview-surface .preview-page {
  background: #fff;
  border: 1px solid #111;
  box-shadow: 0 .75rem 1.75rem rgba(31,50,71,.12);
  color: #111;
  font-family: Tahoma, Geneva, sans-serif;
  margin: 0 auto;
  max-width: 820px;
  min-height: 58rem;
  padding: 1.6rem;
}
.template-preview-surface table {
  border-collapse: collapse;
  width: 100%;
}
.template-preview-surface th,
.template-preview-surface td {
  border: 1px solid #555;
  font-size: .86rem;
  line-height: 1.45;
  padding: .38rem;
  vertical-align: top;
}
.template-preview-surface th {
  background: #eef5ff;
}
.template-preview-surface h1 {
  background: #fff200;
  border: 1px solid #111;
  font-size: 1.25rem;
  padding: .5rem;
  text-align: center;
}
.template-preview-surface h2 {
  border-bottom: 1px solid #333;
  font-size: 1rem;
  margin-top: 1.1rem;
  padding-bottom: .25rem;
}
.template-preview-surface h3 {
  font-size: .92rem;
  margin-bottom: .25rem;
}
.feature-editor-shell {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}
.feature-toolbar {
  align-items: center;
  background: #f7faff;
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  padding: .65rem;
}
.feature-toolbar .form-select {
  width: auto;
}
.feature-import-input {
  max-width: 16rem;
}
.feature-editor {
  background: #fff;
  min-height: 18rem;
  outline: none;
  overflow: auto;
  padding: 1rem;
}
.feature-editor table,
.proposal-feature-preview table {
  border-collapse: collapse;
  margin: .55rem 0;
  width: 100%;
}
.feature-editor th,
.feature-editor td,
.proposal-feature-preview th,
.proposal-feature-preview td {
  border: 1px solid #6b7280;
  padding: .45rem;
  vertical-align: top;
}
.feature-editor th,
.proposal-feature-preview th {
  background: #eef5ff;
  font-weight: 800;
  text-align: center;
}
.feature-editor .module-heading-row th,
.proposal-feature-preview .module-heading-row th,
.feature-editor tr:first-child th[colspan],
.proposal-feature-preview tr:first-child th[colspan] {
  background: #dcecff;
  font-size: 1rem;
  text-align: center;
}
.feature-preview-card {
  background: #fbfdff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: .75rem;
  padding: .85rem;
}
.proposal-feature-preview {
  background: #fff;
  border: 1px solid #111;
  color: #111;
  min-height: 12rem;
  padding: .85rem;
}
.proposal-feature-preview h3 {
  font-size: 1rem;
  font-weight: 800;
  margin: 0 0 .55rem;
}
.terms-preview h3 {
  border-bottom: 1px solid #333;
  padding-bottom: .3rem;
}
.terms-editor ul,
.terms-preview ul {
  margin: .4rem 0;
  padding-left: 1.3rem;
}
.feature-module-cards {
  display: grid;
  gap: .55rem;
}
.feature-module-card {
  background: #fbfdff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  display: grid;
  gap: .12rem;
  padding: .65rem;
  text-decoration: none;
}
.feature-module-card:hover {
  border-color: var(--blue);
}
.feature-module-card strong {
  font-weight: 800;
}
.feature-module-card small {
  color: var(--muted);
}
.feature-module-card span {
  color: #6245a6;
  font-size: .8rem;
  font-weight: 800;
}
.dynamic-section .panel-head {
  margin-bottom: 0;
}
.group-list, .point-list {
  display: grid;
  gap: .65rem;
}
.document-builder {
  display: grid;
  gap: .75rem;
  grid-template-columns: 12.5rem minmax(0, 1fr) 18rem;
}
.document-index, .document-preview {
  align-self: start;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: .65rem;
  padding: .75rem;
  position: sticky;
  top: 5rem;
}
.document-index {
  max-height: 34rem;
  overflow: auto;
}
.document-preview {
  max-height: 36rem;
  overflow: hidden;
}
.document-index h3, .word-page h3 {
  font-size: .95rem;
  font-weight: 800;
  margin: 0;
}
.document-index-list {
  display: grid;
  gap: .45rem;
}
.document-index-list button {
  background: #fbfdff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  display: grid;
  gap: .12rem;
  padding: .55rem;
  text-align: left;
}
.document-index-list button:hover {
  border-color: var(--blue);
}
.document-index-list button.active {
  background: #eaf3ff;
  border-color: var(--blue);
}
.document-index-list small {
  color: var(--muted);
}
.document-editor {
  max-height: 36rem;
  min-width: 0;
  overflow: auto;
  padding-right: .15rem;
}
.group-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: .7rem;
  padding: .8rem;
}
.group-card.saved {
  border-left: 5px solid var(--green);
}
.group-card.collapsed {
  background: #fbfdff;
}
.group-card.collapsed .point-list {
  display: none;
}
.group-card.collapsed .group-head {
  align-items: center;
}
.group-card.collapsed .form-label,
.group-card.collapsed .group-actions button:not([data-toggle-group]) {
  display: none;
}
.group-card.collapsed [data-group-title] {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  font-weight: 800;
  padding-left: 0;
}
.group-head {
  align-items: end;
  display: grid;
  gap: .7rem;
  grid-template-columns: minmax(0, 1fr) auto;
}
.group-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.word-import-input {
  max-width: 18rem;
}
.import-guidance {
  background: #f5f9ff;
  border: 1px solid #cfe1f8;
  border-radius: 8px;
  color: #31435a;
  font-size: .9rem;
  line-height: 1.45;
  margin-top: .65rem;
  padding: .65rem .75rem;
}
.document-editor .group-head {
  align-items: stretch;
  grid-template-columns: 1fr;
}
.document-editor .point-row,
.document-editor .point-row:has(.point-format) {
  grid-template-columns: 1fr;
}
.point-row {
  align-items: start;
  display: grid;
  gap: .55rem;
  grid-template-columns: minmax(0, 1fr) auto;
}
.point-row:has(.point-format) {
  grid-template-columns: 10rem minmax(0, 1fr) auto;
}
.point-row textarea {
  resize: vertical;
}
.word-page {
  background: #fff;
  border: 1px solid #111;
  box-shadow: 0 .7rem 1.2rem rgba(31,50,71,.1);
  color: #111;
  display: grid;
  font-family: Tahoma, Geneva, sans-serif;
  gap: .45rem;
  max-height: 34rem;
  min-height: 21rem;
  overflow: auto;
  padding: .7rem;
}
.word-page h3 {
  background: #fff200;
  border: 1px solid #111;
  margin: -.7rem -.7rem .3rem;
  padding: .22rem;
  text-align: center;
}
.word-page .doc-section {
  border-bottom: 1px solid #333;
  padding-bottom: .35rem;
}
.word-page h4 {
  font-size: .86rem;
  font-weight: 800;
  margin: 0 0 .2rem;
}
.word-page ul {
  margin: 0;
  padding-left: 1.1rem;
}
.word-page li, .word-page p, .doc-subpoint {
  font-size: .8rem;
  line-height: 1.45;
  margin: .08rem 0;
}
.doc-subpoint {
  padding-left: 1.4rem;
  position: relative;
}
.doc-subpoint::before {
  content: "-";
  left: .45rem;
  position: absolute;
}
.assignment-box {
  background: #f8fbff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: .8rem;
  padding: .9rem;
}
.assignment-mode-row {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
}
.assignment-mode-row label,
.product-check-group label {
  align-items: center;
  display: flex;
  gap: .45rem;
}
.assignment-pane {
  display: grid;
  gap: .65rem;
}
.product-check-grid {
  display: grid;
  gap: .8rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.product-check-group {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: .45rem;
  padding: .75rem;
}
.public-enquiry-page {
  background: linear-gradient(135deg, #f8fbff 0%, #eef9f4 100%);
}
.public-login-button {
  position: fixed;
  right: 1rem;
  top: 1rem;
  z-index: 10;
}
.public-enquiry-shell {
  display: grid;
  gap: 1rem;
  margin: 0 auto;
  max-width: 74rem;
  min-height: 100vh;
  padding: 2rem 1rem;
}
.public-enquiry-hero {
  align-items: center;
  display: grid;
  justify-items: center;
  text-align: center;
}
.public-enquiry-hero img {
  height: 3.5rem;
  margin-bottom: .8rem;
  object-fit: contain;
}
.public-enquiry-hero h1 {
  font-size: clamp(2rem, 5vw, 4rem);
  font-weight: 900;
  margin: 0;
}
.public-enquiry-hero p {
  color: var(--muted);
  margin: .25rem 0 0;
}
.public-enquiry-form {
  border-top: 4px solid var(--blue);
}
.alert-panel {
  border-color: #ffd4d4;
  box-shadow: 0 .6rem 1.5rem rgba(210, 53, 73, .12);
}
.admin-toast-container {
  z-index: 1080;
}
.proposal-layout {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: 16rem minmax(0, 1fr) 16rem;
}
.proposal-side {
  display: grid;
  gap: .75rem;
  position: sticky;
  top: 5rem;
}
.proposal-workspace {
  min-width: 0;
}
.proposal-editor {
  background: #fff;
  border: 1px solid #111;
  color: #111;
  font-family: Tahoma, Geneva, sans-serif;
  line-height: 1.5;
  min-height: 42rem;
  overflow: auto;
  padding: 1.2rem;
}
.proposal-editor[contenteditable="true"] {
  outline: 2px dashed #b9d6ff;
}
.proposal-generate-grid {
  display: grid;
  gap: .65rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.proposal-generate-form {
  align-items: center;
  display: grid;
  gap: .55rem;
  grid-template-columns: minmax(12rem, 1fr) auto;
}
.proposal-firm-document {
  min-height: 58rem;
  overflow: hidden;
  position: relative;
}
.proposal-letterhead-image {
  height: 100%;
  inset: 0;
  object-fit: cover;
  pointer-events: none;
  position: absolute;
  width: 100%;
  z-index: 0;
}
.proposal-letterhead-pdf {
  border: 0;
  height: 14rem;
  margin-bottom: 1rem;
  width: 100%;
}
.proposal-letterhead-file {
  background: #f8fbff;
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-bottom: 1rem;
  padding: .7rem;
}
.proposal-letterhead-body {
  min-height: 58rem;
  padding: 7.5rem 2.1rem 5.5rem;
  position: relative;
  z-index: 1;
}
.proposal-firm-document.no-letterhead .proposal-letterhead-body {
  min-height: auto;
  padding: 0;
}
.proposal-firm-chip {
  color: #526177;
  font-size: .78rem;
  font-weight: 800;
  margin-bottom: .5rem;
  text-align: right;
}
.proposal-document h1 {
  background: #fff200;
  border: 1px solid #111;
  font-size: 1.25rem;
  font-weight: 900;
  padding: .35rem;
  text-align: center;
}
.proposal-document h2 {
  border-bottom: 1px solid #333;
  font-size: 1rem;
  font-weight: 900;
  margin-top: 1rem;
  padding-bottom: .25rem;
}
.proposal-document h3 {
  font-size: .92rem;
  font-weight: 900;
}
.proposal-document table {
  border-collapse: collapse;
  margin: .6rem 0;
  width: 100%;
}
.proposal-document th,
.proposal-document td {
  border: 1px solid #555;
  padding: .4rem;
  vertical-align: top;
}
.proposal-document th {
  background: #eef5ff;
}
.proposal-sign-row {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 1rem;
}
.proposal-sign-image {
  display: block;
  max-height: 5rem;
  max-width: 12rem;
  object-fit: contain;
}
.apk-download-card {
  background: #f8fbff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: .45rem;
  margin-top: 1rem;
  padding: .85rem;
}
.apk-download-card span {
  color: var(--muted);
  font-size: .9rem;
}
.mobile-shell {
  display: grid;
  gap: 1rem;
  margin: 0 auto;
  max-width: 38rem;
  padding: 1rem .75rem 2rem;
}
.mobile-top {
  align-items: center;
  display: flex;
  gap: .8rem;
  justify-content: space-between;
}
.mobile-top img {
  height: 2.6rem;
  max-width: 12rem;
  object-fit: contain;
}
.mobile-top h1 {
  font-size: 1.6rem;
  font-weight: 900;
  margin: 0;
}
.mobile-notify-grid {
  display: grid;
  gap: .65rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.mobile-notify-grid article {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 .5rem 1.1rem rgba(31,50,71,.07);
  padding: .75rem;
}
.mobile-notify-grid span,
.mobile-list small {
  color: var(--muted);
  display: block;
  font-size: .78rem;
}
.mobile-notify-grid strong {
  font-size: 1.35rem;
}
.mobile-card {
  border-radius: 8px;
  padding: .9rem;
}
.mobile-togglebar {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 .5rem 1.1rem rgba(31,50,71,.07);
  display: grid;
  gap: .35rem;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding: .35rem;
  position: sticky;
  top: .4rem;
  z-index: 20;
}
.mobile-togglebar button,
.mobile-action {
  background: #f8fbff;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--ink);
  font-family: Tahoma, Geneva, sans-serif;
  font-weight: 800;
  min-height: 2.35rem;
  padding: .45rem .5rem;
}
.mobile-togglebar button.active,
.mobile-action:hover {
  background: #2765e8;
  color: #fff;
}
.mobile-action-grid {
  display: grid;
  gap: .55rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.mobile-two,
.mobile-search {
  display: grid;
  gap: .55rem;
  grid-template-columns: 1fr 1fr;
}
.mobile-search {
  grid-template-columns: minmax(0, 1fr) auto;
}
.mobile-list {
  display: grid;
  gap: .55rem;
  margin-top: .7rem;
}
.mobile-list a {
  background: #f8fbff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  display: block;
  padding: .7rem;
  text-decoration: none;
}
.mobile-proposal-shell {
  max-width: 54rem;
}
.mobile-proposal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: .75rem;
}
.mobile-recheck-form {
  margin-top: .75rem;
}
.mobile-proposal-preview {
  background: #fff;
  border: 1px solid #111;
  color: #111;
  font-family: Tahoma, Geneva, sans-serif;
  max-height: 36rem;
  overflow: auto;
  padding: .8rem;
}
.mobile-help-text {
  color: var(--muted);
  margin: 0 0 .75rem;
}
.mobile-proposal-preview table {
  border-collapse: collapse;
  width: 100%;
}
.mobile-proposal-preview th,
.mobile-proposal-preview td {
  border: 1px solid #555;
  padding: .35rem;
  vertical-align: top;
}

@media print {
  .app-nav, .proposal-side, .page-head, .toast-container { display: none !important; }
  .app-width, .proposal-layout { display: block; max-width: none; padding: 0; width: 100%; }
  .panel, .proposal-editor { border: 0; box-shadow: none; padding: 0; }
  .proposal-firm-chip { display: none; }
  body { background: #fff; }
}

@keyframes floaty {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -.55rem; }
}
@keyframes pulse {
  0%, 100% { opacity: .45; scale: .86; }
  50% { opacity: 1; scale: 1.2; }
}
@keyframes breathe {
  0%, 100% { box-shadow: 0 .4rem 1rem rgba(31,50,71,.06); }
  50% { box-shadow: 0 1rem 2rem rgba(13,143,104,.18); }
}
@keyframes loginGlow {
  0%, 100% { rotate: 0deg; scale: 1; }
  50% { rotate: 20deg; scale: 1.08; }
}

@media (max-width: 991px) {
  .metric-grid, .filter-row, .mis-filter, .form-grid, .notification-grid, .detail-grid, .followup-form, .permission-grid, .auto-fill-grid, .master-shell, .three-column, .four-column, .image-upload-grid, .document-builder, .group-head, .point-row, .point-row:has(.point-format), .product-check-grid, .proposal-layout, .proposal-sign-row, .proposal-generate-grid, .proposal-generate-form { grid-template-columns: 1fr; }
  .page-head, .nav-inner { align-items: stretch; flex-direction: column; }
  .nav-toggle { display: inline-block; }
  .app-nav nav {
    display: none;
    gap: .2rem;
    grid-template-columns: 1fr;
  }
  .app-nav nav.is-open { display: grid; }
  .app-nav nav a, .nav-dropdown > button { text-align: left; width: 100%; }
  .nav-user, .actions { flex-wrap: wrap; }
  .nav-dropdown-menu { position: static; }
  .document-index, .document-preview { position: static; }
  .dashboard-hero { align-items: flex-start; flex-direction: column; }
  .login-shape { opacity: .45; }
}

@media (max-width: 520px) {
  .mobile-two, .mobile-search, .mobile-notify-grid, .mobile-togglebar, .mobile-action-grid { grid-template-columns: 1fr; }
  .mobile-proposal-preview { font-size: .82rem; padding: .45rem; }
}
