:root {
  --ink: #0B1D35;
  --ink-hover: #17384E;
  --ink-active: #132F43;
  --accent: #974B37;
  --accent-ink: #974B37;
  --action: #974B37;
  --action-hover: #7F3F30;
  --canvas: #F2F1EA;
  --surface: #FFFFFF;
  --text: #0B1D35;
  --text-secondary: #45556A;
  --muted: #6E7783;
  --line: #D8D4CC;
  --line-soft: #E7E2D9;
  --field-border: #BFB7AB;
  --hover-row: #EEE3DB;
  --pressed: #E8D4C8;
  --ok: #5C6B3F;
  --warn: #8A6318;
  --danger: #8C2318;
  --warn-bg: #F6EEDD;
  --danger-bg: #F7EAE7;
  --viewed-bg: #E4EAEE;
  --client-bg: #EEE3DB;

  --radius-control: 3px;
  --radius-card: 6px;
  --radius-pill: 999px;
  --nav-mobile: 76px;
  --nav-tablet: 88px;
  --nav-desktop: 240px;
}

* { box-sizing: border-box; }
html { background: var(--canvas); color-scheme: light; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background: var(--canvas);
  color: var(--text);
  font: 400 15px/1.6 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.app-shell { min-height: 100vh; }
.app-sidebar { display: none; }
.app-stage { min-width: 0; }

.mobile-brand {
  height: 64px;
  display: flex;
  align-items: center;
  padding: 0 16px;
  border-bottom: 1px solid var(--line-soft);
  background: rgba(247,243,236,.96);
}
.mobile-brand__link { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.mobile-brand__name { font: 600 21px/1 'Instrument Serif', serif; color: var(--ink); }
.mobile-brand__claim { font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-ink); }

.app-main {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  padding: 28px 16px calc(var(--nav-mobile) + 32px + env(safe-area-inset-bottom));
}
.screen-head { margin-bottom: 28px; }
.screen-head h1 {
  margin: 4px 0 7px;
  color: var(--ink);
  font: 600 22px/1.2 'DM Sans', sans-serif;
  letter-spacing: -.02em;
}
.screen-head p { margin: 0; max-width: 46em; color: var(--text-secondary); font-size: 13.5px; }
.eyebrow { color: var(--accent-ink); font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }

.app-nav--bottom {
  position: fixed;
  z-index: 40;
  left: 0;
  right: 0;
  bottom: 0;
  min-height: calc(var(--nav-mobile) + env(safe-area-inset-bottom));
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding-bottom: env(safe-area-inset-bottom);
  background: var(--surface);
  border-top: 1px solid var(--line);
}
.app-nav__link {
  position: relative;
  min-width: 0;
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  text-decoration: none;
  color: var(--text-secondary);
  font-size: 10.5px;
  font-weight: 700;
}
.app-nav--bottom .app-nav__link { flex-direction: column; padding: 9px 3px 7px; }
.app-nav--bottom .app-nav__link::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 16%;
  right: 16%;
  height: 2px;
  background: transparent;
}
.app-nav--bottom .app-nav__link.is-active {
  color: var(--accent-ink);
  background: var(--hover-row);
}
.app-nav--bottom .app-nav__link.is-active::before { background: var(--accent); }
.app-nav__icon { width: 22px; height: 22px; flex: 0 0 auto; }
.app-nav__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; }

.empty-state {
  position: relative;
  max-width: 720px;
  padding: 28px 24px;
  background: var(--surface);
  border: 1px dashed var(--line);
  border-radius: var(--radius-card);
}
.empty-state__rule { position: absolute; top: 0; left: 0; right: 0; height: 2px; background: var(--ink); border-radius: 6px 6px 0 0; }
.empty-state__rule--danger { background: var(--danger); }
.empty-state h2, .system-block h2 {
  margin: 8px 0 10px;
  color: var(--ink);
  font: 600 20px/1.25 'DM Sans', sans-serif;
  letter-spacing: -.015em;
}
.empty-state p { margin: 0 0 20px; max-width: 40em; color: var(--text-secondary); }
.inline-note { margin-top: 16px; padding-left: 12px; border-left: 3px solid var(--accent); color: var(--text-secondary); font-size: 13px; }

.btn {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 20px;
  border: 1px solid transparent;
  border-radius: var(--radius-control);
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
.btn--primary { background: var(--ink); color: var(--canvas); border-color: var(--ink); }
.btn--secondary { background: transparent; color: var(--ink); border-color: var(--ink); }
.btn--ghost { background: transparent; color: var(--accent-ink); }
.btn--danger { background: transparent; color: var(--danger); border-color: #D9B7B0; }
.btn--action { background: var(--action); color: #fff; border-color: var(--action); }

@media (hover:hover) {
  .btn--primary:hover { background: var(--ink-hover); border-color: var(--ink-hover); }
  .btn--secondary:hover { background: var(--ink); color: var(--canvas); }
  .btn--ghost:hover { background: var(--pressed); }
  .btn--danger:hover { background: var(--danger); color: #fff; }
  .btn--action:hover { background: var(--action-hover); border-color: var(--action-hover); }
  .settings-row:hover { background: var(--hover-row); }
}

.settings-list { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-card); overflow: hidden; }
.settings-row { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 16px; border-bottom: 1px solid var(--line-soft); }
.settings-row:last-child { border-bottom: 0; }
.settings-row strong { display: block; color: var(--ink); font-size: 14px; font-weight: 600; }
.settings-row span:not(.tag) { display: block; margin-top: 2px; color: var(--text-secondary); font-size: 12.5px; }
.tag { flex: 0 0 auto; padding: 4px 7px; border: 1px solid var(--line); color: var(--text-secondary); font-size: 12px; font-weight: 600; }

.system-grid { display: grid; gap: 20px; }
.system-block { padding: 24px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-card); }
.swatches { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }
.swatch { min-width: 0; display: grid; grid-template-columns: 38px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 10px; align-items: center; }
.swatch > span { grid-row: 1 / 3; width: 38px; height: 38px; background: var(--sw); border: 1px solid var(--line); border-radius: 3px; }
.swatch b { color: var(--ink); font-size: 12.5px; }
.swatch small { color: var(--text-secondary); font-size: 11.5px; }
.button-row, .status-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.pill { min-height: 26px; display: inline-flex; align-items: center; padding: 0 12px; border: 1px solid; border-radius: var(--radius-pill); font-size: 12px; font-weight: 600; white-space: nowrap; }
.pill--draft { background: var(--canvas); border-color: var(--field-border); color: var(--text-secondary); }
.pill--sent { background: var(--ink); border-color: var(--ink); color: var(--canvas); }
.pill--accepted { background: var(--ok); border-color: var(--ok); color: #fff; }
.pill--expired { background: var(--warn-bg); border-color: var(--warn); color: #7A5714; }
.money-state { margin-top: 20px; color: var(--text-secondary); font-size: 13px; font-variant-numeric: tabular-nums; }
.money-state strong { color: var(--accent-ink); }
.money-state__track { height: 5px; margin-bottom: 8px; overflow: hidden; background: var(--line-soft); }
.money-state__track span { display: block; height: 100%; background: var(--accent); }
.form-grid { display: grid; gap: 16px; margin-top: 18px; }
.field { display: grid; gap: 6px; }
.field > span { color: var(--ink); font-size: 13px; font-weight: 600; }
.field input { width: 100%; height: 44px; padding: 0 12px; border: 1px solid var(--field-border); border-radius: var(--radius-control); background: #fff; color: var(--text); font-size: 15px; }
.field input:focus { border-color: var(--ink); outline: 2px solid var(--accent); outline-offset: 0; }
.field small { color: var(--text-secondary); font-size: 12.5px; }
.input-number { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.record-card { margin-top: 18px; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius-card); }
.record-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.record-card__top strong { display: block; color: var(--ink); font-size: 14.5px; font-weight: 600; }
.record-card__top div > span { display: block; margin-top: 3px; color: var(--text-secondary); font-size: 12.5px; }
.record-card__money { display: grid; grid-template-columns: minmax(70px, 1fr) auto; gap: 12px; align-items: center; margin-top: 14px; color: var(--text-secondary); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.record-card__bar { height: 3px; background: var(--line-soft); overflow: hidden; }
.record-card__bar i { display: block; height: 100%; background: var(--accent); }

@media (min-width: 768px) {
  .app-shell { display: grid; grid-template-columns: var(--nav-tablet) minmax(0, 1fr); }
  .app-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--ink);
    color: var(--canvas);
  }
  .app-brand { height: 88px; display: flex; align-items: center; justify-content: center; text-decoration: none; color: var(--canvas); }
  .app-brand__mark { font: 600 28px/1 'Instrument Serif', serif; }
  .app-brand__text, .app-sidebar__foot { display: none; }
  .app-nav--side { display: grid; gap: 4px; padding: 8px; }
  .app-nav--side .app-nav__link { min-height: 56px; justify-content: center; border-left: 3px solid transparent; color: #C4D3DC; }
  .app-nav--side .app-nav__label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
  .app-nav--side .app-nav__link.is-active { background: var(--ink-active); color: var(--canvas); border-left-color: var(--accent); }
  .app-nav--side .app-nav__link::after {
    content: attr(data-label);
    position: absolute;
    z-index: 70;
    left: 70px;
    top: 50%;
    transform: translateY(-50%) translateX(-4px);
    padding: 7px 10px;
    background: var(--ink);
    color: var(--canvas);
    border: 1px solid #29485c;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 600;
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s ease, transform .15s ease;
  }
  .app-nav--side .app-nav__link:hover::after,
  .app-nav--side .app-nav__link:focus-visible::after { opacity: 1; transform: translateY(-50%) translateX(0); }
  .mobile-brand, .app-nav--bottom { display: none; }
  .app-main { padding: 40px 32px 56px; }
  .screen-head { margin-bottom: 32px; }
  .system-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .system-block--wide { grid-column: 1 / -1; }
  .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1200px) {
  .app-shell { grid-template-columns: var(--nav-desktop) minmax(0, 1fr); }
  .app-brand { height: 106px; justify-content: flex-start; gap: 12px; padding: 0 24px; }
  .app-brand__mark { display: none; }
  .app-brand__text { display: block; }
  .app-brand__text strong { display: block; font: 600 25px/1.1 'Instrument Serif', serif; }
  .app-brand__text small { display: block; margin-top: 7px; color: #9FB3BF; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
  .app-nav--side { gap: 3px; padding: 10px 12px; }
  .app-nav--side .app-nav__link { min-height: 48px; justify-content: flex-start; gap: 12px; padding: 0 16px; font-size: 14px; font-weight: 600; }
  .app-nav--side .app-nav__label { position: static; width: auto; height: auto; padding: 0; margin: 0; overflow: visible; clip: auto; white-space: normal; }
  .app-nav--side .app-nav__link::after { display: none; }
  .app-nav--side .app-nav__link.is-active { font-weight: 700; }
  .app-sidebar__foot { display: block; margin-top: auto; padding: 22px 28px; color: #9FB3BF; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
  .app-main { padding: 48px 48px 72px; }
  .screen-head h1 { font-size: 23px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* B2 · núcleo funcional */
.mobile-brand { justify-content: space-between; }
.mobile-brand__logout { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; color: var(--text-secondary); text-decoration: none; }
.mobile-brand__logout svg { width: 21px; height: 21px; }
.app-sidebar__foot a { color: inherit; text-decoration: none; }
.btn__icon { width: 18px; height: 18px; }

.notice { margin: 0 0 20px; padding: 12px 14px; background: var(--surface); border-left: 3px solid var(--ink); color: var(--text); font-size: 13px; }
.notice--ok { border-left-color: var(--ok); }
.notice--error { border-left-color: var(--danger); }
.notice--warn { border-left-color: var(--warn); }
.notice strong { font-weight: 600; }

.screen-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.screen-action { position: fixed; z-index: 35; right: 16px; bottom: calc(var(--nav-mobile) + 12px + env(safe-area-inset-bottom)); box-shadow: 0 4px 16px rgba(15,42,61,.10); }

.work-grid { display: grid; gap: 16px; }
.action-card { max-width: 720px; padding: 24px; background: var(--surface); border: 1px solid var(--line); border-top: 2px solid var(--accent); border-radius: var(--radius-card); }
.action-card h2, .section-head h2, .panel h2, .quote-head-card h2 { margin: 7px 0 8px; color: var(--ink); font: 600 20px/1.25 'DM Sans', sans-serif; letter-spacing: -.015em; }
.action-card p, .muted-copy { margin: 0 0 18px; color: var(--text-secondary); font-size: 13.5px; }

.section-block { margin-top: 28px; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.section-head h2 { margin-bottom: 0; }
.text-link { color: var(--accent-ink); font-size: 13px; font-weight: 600; text-decoration: none; }

.mini-stats { display: flex; flex-wrap: wrap; gap: 18px 28px; margin-top: 32px; padding-top: 16px; border-top: 1px solid var(--line); }
.mini-stats div { display: flex; align-items: baseline; gap: 6px; }
.mini-stats strong { color: var(--ink); font: 600 22px/1 'Instrument Serif', serif; font-variant-numeric: tabular-nums; }
.mini-stats span { color: var(--text-secondary); font-size: 12.5px; }

.record-list { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-card); overflow: hidden; }
.record-row { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 14px; border-bottom: 1px solid var(--line-soft); color: inherit; text-decoration: none; }
.record-row:last-child { border-bottom: 0; }
.record-row__main { min-width: 0; }
.record-row__main strong { display: block; overflow: hidden; color: var(--ink); font-size: 14.5px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.record-row__main span { display: block; margin-top: 2px; overflow: hidden; color: var(--text-secondary); font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.record-row__arrow { width: 20px; height: 20px; flex: 0 0 auto; color: var(--muted); }
.record-row__side { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.record-row__amount { color: var(--ink); font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (hover:hover) { .record-row[href]:hover { background: var(--hover-row); } }

.search-box { min-height: 44px; display: grid; grid-template-columns: 22px minmax(0,1fr) auto; align-items: center; gap: 7px; padding: 0 7px 0 12px; background: var(--surface); border: 1px solid var(--field-border); border-radius: var(--radius-control); }
.search-box:focus-within { border-color: var(--ink); outline: 2px solid var(--accent); outline-offset: 0; }
.search-box__icon { width: 19px; height: 19px; color: var(--text-secondary); }
.search-box input { min-width: 0; height: 42px; padding: 0; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 14px; }
.search-box button { min-height: 34px; padding: 0 10px; border: 0; background: transparent; color: var(--accent-ink); font-size: 12.5px; font-weight: 600; cursor: pointer; }
.filter-bar { display: grid; gap: 12px; margin-bottom: 16px; }
.segmented { display: inline-flex; max-width: 100%; overflow-x: auto; border: 1px solid var(--field-border); border-radius: var(--radius-control); background: var(--surface); }
.segmented a { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; padding: 0 13px; color: var(--text-secondary); font-size: 12.5px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.segmented a.is-active { background: var(--ink); color: var(--canvas); }

.panel { padding: 20px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-card); }
.panel + .panel { margin-top: 18px; }
.panel--form { max-width: 860px; }
.detail-grid { display: grid; gap: 18px; }
.detail-grid--quote { align-items: start; }
.panel--aside { min-width: 0; }

.form-stack { display: grid; gap: 18px; }
.form-stack--compact { gap: 14px; }
.form-grid { display: grid; gap: 16px; }
.field { display: grid; gap: 6px; min-width: 0; }
.field > span { color: var(--ink); font-size: 13px; font-weight: 600; }
.field input, .field select, .field textarea { width: 100%; border: 1px solid var(--field-border); border-radius: var(--radius-control); background: #fff; color: var(--text); font-size: 15px; }
.field input, .field select { height: 44px; padding: 0 12px; }
.field textarea { min-height: 88px; padding: 10px 12px; line-height: 1.55; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--ink); outline: 2px solid var(--accent); outline-offset: 0; }
.field small { color: var(--text-secondary); font-size: 12.5px; }
.field--wide { grid-column: 1 / -1; }
.form-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; padding-top: 2px; }
.form-error { margin: 14px 0; padding: 10px 12px; border-left: 3px solid var(--danger); background: var(--surface); color: var(--danger); font-size: 13px; font-weight: 600; }
.check-field { min-height: 44px; display: flex; align-items: center; gap: 10px; cursor: pointer; }
.check-field input { width: 20px; height: 20px; margin: 0; accent-color: var(--ink); }
.check-field span { display: grid; }
.check-field strong { color: var(--ink); font-size: 13px; font-weight: 600; }
.check-field small { color: var(--text-secondary); font-size: 12px; }

.compact-list { display: grid; border-top: 1px solid var(--line-soft); }
.compact-list a { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line-soft); text-decoration: none; }
.compact-list a > span { min-width: 0; }
.compact-list strong { display: block; color: var(--ink); font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.compact-list small { display: block; margin-top: 2px; color: var(--text-secondary); font-size: 11.5px; }
.danger-zone { display: grid; gap: 10px; margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--line); }
.danger-zone > span { color: var(--text-secondary); font-size: 12.5px; }

.quote-head-card { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; padding: 18px 16px; background: var(--surface); border: 1px solid var(--line); border-top: 2px solid var(--ink); border-radius: var(--radius-card); }
.quote-head-card h2 { margin-bottom: 4px; }
.quote-head-card p { margin: 0; color: var(--text-secondary); font-size: 12.5px; }
.inline-empty { display: grid; gap: 2px; margin: 12px 0 4px; padding: 14px; border: 1px dashed var(--line); }
.inline-empty strong { color: var(--ink); font-size: 13.5px; }
.inline-empty span { color: var(--text-secondary); font-size: 12.5px; }
.quote-lines { display: grid; margin-top: 10px; border-top: 1px solid var(--line-soft); }
.quote-line { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line-soft); }
.quote-line > div { min-width: 0; }
.quote-line strong { color: var(--ink); font-size: 13.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
.quote-line span, .quote-line small { display: block; color: var(--text-secondary); }
.quote-line span { margin-top: 3px; font-size: 12.5px; line-height: 1.5; }
.quote-line small { margin-top: 5px; font-size: 11.5px; }
.quote-totals { display: grid; gap: 7px; margin-top: 18px; margin-left: auto; max-width: 360px; }
.quote-totals > div { display: flex; justify-content: space-between; gap: 20px; color: var(--text-secondary); font-size: 13px; }
.quote-totals strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.quote-totals__grand { margin-top: 5px; padding-top: 10px; border-top: 1px solid var(--line); align-items: baseline; }
.quote-totals__grand strong { color: var(--accent); font: 600 26px/1 'Instrument Serif', serif; }
.definition-list { display: grid; gap: 0; margin: 8px 0 0; }
.definition-list div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--line-soft); }
.definition-list dt { color: var(--text-secondary); font-size: 12.5px; }
.definition-list dd { margin: 0; color: var(--ink); font-size: 13px; font-weight: 600; text-align: right; }

.settings-row[href] { color: inherit; text-decoration: none; }
.tag--ok { border-color: #C6D0B7; color: #4C5A34; background: #EDF0E4; }
.series-table { display: grid; margin-top: 16px; border-top: 1px solid var(--line-soft); }
.series-row { min-height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--line-soft); }
.series-row strong { display: block; color: var(--ink); font-size: 13.5px; }
.series-row span:not(.tag) { display: block; margin-top: 2px; color: var(--text-secondary); font-size: 12px; }

.pill--viewed { background: var(--viewed-bg); border-color: var(--ink); color: var(--ink); }
.pill--rejected { background: var(--danger-bg); border-color: var(--danger); color: var(--danger); }
.pill--cancelled { background: transparent; border-color: #A69C90; border-style: dashed; color: var(--text-secondary); text-decoration: line-through; }

.login-body { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; background: var(--canvas); }
.login-card { width: min(100%, 430px); padding: 0 24px 28px; overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-card); box-shadow: 0 18px 48px rgba(15,42,61,.08); }
.login-brand { display: flex; align-items: center; justify-content: center; min-height: 112px; margin: 0 -24px 30px; padding: 18px 24px; background: var(--ink); }
.login-brand strong { color: var(--ink); font: 600 26px/1 'Instrument Serif', serif; }
.login-brand span { color: var(--accent-ink); font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.login-card h1 { margin: 4px 0 8px; color: var(--ink); font: 600 26px/1.15 'Instrument Serif', serif; }
.login-card p { margin: 0 0 20px; color: var(--text-secondary); font-size: 13.5px; }
.login-card code { color: var(--ink); font-size: 12.5px; }
.debug-error { margin-top: 16px; padding: 12px; overflow: auto; background: var(--pressed); font-size: 12px; }


.quote-save--mobile { display: none; }

@media (max-width: 767px) {
  .app-main { padding-bottom: calc(var(--nav-mobile) + 112px + env(safe-area-inset-bottom)); }
  .quote-save--desktop { display: none; }
  .quote-save--mobile {
    position: fixed;
    z-index: 36;
    left: 16px;
    right: 16px;
    bottom: calc(var(--nav-mobile) + 10px + env(safe-area-inset-bottom));
    display: block;
    width: auto;
    min-height: 44px;
    box-shadow: 0 4px 16px rgba(15,42,61,.10);
  }
  .record-row--quote { align-items: flex-start; }
  .record-row__side { display: grid; justify-items: end; gap: 5px; }
  .filter-bar .segmented { width: 100%; }
  .filter-bar .segmented a { flex: 1 0 auto; }
  .form-actions .btn { min-width: 0; }
}

@media (min-width: 768px) {
  .screen-action { position: static; box-shadow: none; }
  .filter-bar { grid-template-columns: minmax(260px, 1fr) auto; align-items: center; }
  .form-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .panel { padding: 24px; }
}

@media (min-width: 1000px) {
  .detail-grid { grid-template-columns: minmax(0, 1.45fr) minmax(300px, .75fr); }
  .detail-grid--quote { grid-template-columns: minmax(0, 1.6fr) minmax(320px, .72fr); }
  .panel + .panel { margin-top: 20px; }
}

@media (min-width: 1200px) {
  .record-row { min-height: 50px; padding-top: 7px; padding-bottom: 7px; }
}

/* B2 · ajustes de validación */
.field { align-content: start; }
.quote-line { column-gap: 32px; }
.quote-line > strong { min-width: 112px; text-align: right; align-self: start; }

@media (max-width: 767px) {
  .quote-line { grid-template-columns: 1fr; gap: 8px; }
  .quote-line > strong { min-width: 0; justify-self: end; }
}

@media (min-width: 768px) {
  .form-grid > .check-field { align-self: start; margin-top: 21px; }
  .form-grid--service { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}


/* B3A · vista previa de propuesta */
.preview-body {
  margin: 0;
  background: #EDE8DF;
  color: var(--text);
  font-family: 'DM Sans', sans-serif;
}
.preview-toolbar {
  position: sticky;
  top: 0;
  z-index: 10;
  min-height: 68px;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 10px 16px;
  background: rgba(247,243,236,.96);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(8px);
}
.preview-toolbar > div {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.preview-toolbar strong {
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
}
.preview-toolbar span {
  color: var(--text-secondary);
  font-size: 12px;
}
.preview-stage {
  width: min(100%, 980px);
  margin: 0 auto;
  padding: 24px 12px 64px;
}

.proposal {
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--line);
  color: var(--text);
}
.proposal__hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 28px 24px;
  background: var(--ink);
  color: var(--canvas);
}
.proposal__brand strong {
  display: block;
  font: 600 24px/1 'Instrument Serif', serif;
}
.proposal__brand span {
  display: block;
  margin-top: 7px;
  color: #9FB3BF;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.proposal__meta {
  display: grid;
  gap: 5px;
  color: #C4D3DC;
  font-size: 12px;
  text-align: right;
}
.proposal__body {
  padding: 36px 24px 48px;
}
.proposal__draft-note {
  display: grid;
  gap: 2px;
  margin-bottom: 38px;
  padding: 12px 14px;
  border-left: 3px solid var(--accent);
  background: var(--canvas);
}
.proposal__draft-note strong {
  color: var(--ink);
  font-size: 13px;
}
.proposal__draft-note span {
  color: var(--text-secondary);
  font-size: 12.5px;
}
.proposal__intro {
  max-width: 690px;
  margin-bottom: 56px;
}
.proposal__eyebrow,
.proposal__section-head span {
  color: var(--accent-ink);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.proposal__intro h1 {
  max-width: 760px;
  margin: 10px 0 16px;
  color: var(--ink);
  font: 600 34px/1.12 'Instrument Serif', serif;
  letter-spacing: -.02em;
}
.proposal__intro p {
  margin: 0;
  color: var(--text);
  font-size: 17px;
  line-height: 1.7;
}
.proposal__section {
  margin-top: 48px;
}
.proposal__section-head {
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.proposal__items {
  margin-top: 12px;
}
.proposal__item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 36px;
  padding: 22px 0;
  border-bottom: 1px solid var(--line-soft);
}
.proposal__item-copy {
  min-width: 0;
}
.proposal__item-copy > strong {
  color: var(--ink);
  font-size: 16px;
  font-weight: 600;
}
.proposal__item-copy p {
  margin: 7px 0 0;
  color: var(--text-secondary);
  font-size: 14.5px;
  line-height: 1.6;
}
.proposal__item-copy small {
  display: block;
  margin-top: 8px;
  color: var(--text-secondary);
  font-size: 12.5px;
}
.proposal__item-price {
  min-width: 122px;
  color: var(--ink);
  font: 600 20px/1.2 'Instrument Serif', serif;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.proposal__totals {
  width: min(100%, 390px);
  margin: 32px 0 0 auto;
  padding: 22px 0 0;
}
.proposal__totals > div {
  display: flex;
  justify-content: space-between;
  gap: 22px;
  padding: 7px 0;
  color: var(--text-secondary);
  font-size: 14px;
}
.proposal__totals strong {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.proposal__totals .proposal__total {
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  align-items: baseline;
}
.proposal__total span {
  color: var(--ink);
  font-weight: 600;
}
.proposal__total strong {
  color: var(--accent);
  font: 600 32px/1 'Instrument Serif', serif;
}
.proposal__conditions {
  margin-top: 56px;
  padding-left: 18px;
  border-left: 3px solid var(--accent);
}
.proposal__conditions .proposal__section-head {
  padding-top: 0;
  border-top: 0;
}
.proposal__conditions p,
.proposal__exclusions p,
.proposal__muted {
  margin: 12px 0 0;
  max-width: 720px;
  color: var(--text);
  font-size: 14.5px;
  line-height: 1.7;
}
.proposal__exclusions p {
  color: var(--text-secondary);
}
.proposal__closing {
  display: grid;
  gap: 28px;
  padding: 32px 24px;
  background: var(--ink);
  color: var(--canvas);
}
.proposal__closing > div {
  max-width: 680px;
}
.proposal__closing > div > span {
  color: #E8B7A6;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.proposal__closing h2 {
  margin: 8px 0 10px;
  color: var(--canvas);
  font: 600 22px/1.3 'Instrument Serif', serif;
}
.proposal__closing p {
  margin: 0;
  color: #C4D3DC;
  font-size: 14px;
  line-height: 1.6;
}
.proposal__fake-action,
.proposal__action {
  width: min(100%, 320px);
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 28px;
  border: 0;
  border-radius: var(--radius-control);
  background: var(--action);
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
}
.proposal__fake-action {
  opacity: .72;
}

@media (max-width: 767px) {
  .preview-toolbar {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .preview-toolbar .btn {
    min-height: 40px;
  }
  .preview-stage {
    padding: 12px 0 40px;
  }
  .proposal {
    border-left: 0;
    border-right: 0;
  }
  .proposal__hero {
    padding: 24px;
  }
  .proposal__meta {
    max-width: 145px;
  }
  .proposal__body {
    padding: 32px 24px 42px;
  }
  .proposal__intro h1 {
    font-size: 31px;
  }
  .proposal__item {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .proposal__item-price {
    min-width: 0;
    text-align: left;
  }
  .proposal__totals {
    width: 100%;
  }
  .proposal__closing {
    padding: 30px 24px;
  }
  .proposal__fake-action,
  .proposal__action {
    width: 100%;
  }
}

@media (min-width: 768px) {
  .proposal__hero {
    padding: 36px 48px;
  }
  .proposal__body {
    padding: 56px 64px 68px;
  }
  .proposal__closing {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    padding: 44px 64px;
  }
}

@media print {
  .preview-toolbar { display: none !important; }
  .preview-body { background: #fff; }
  .preview-stage { width: 100%; padding: 0; }
  .proposal { border: 0; }
}

/* Fase 1 completa */
.quote-tabs { display:flex; gap:18px; overflow:auto; margin:-4px 0 20px; border-bottom:1px solid var(--line); }
.quote-tabs a { min-height:42px; display:flex; align-items:center; color:var(--text-secondary); text-decoration:none; font-size:13px; font-weight:600; white-space:nowrap; }
.quote-tabs a:first-child { color:var(--accent-ink); border-bottom:2px solid var(--accent); }
.quote-line--editable { position:relative; grid-template-columns:minmax(0,1fr) auto; }
.line-editor { grid-column:1/-1; margin-top:8px; border-top:1px dashed var(--line); padding-top:8px; }
.line-editor summary, .client-question summary, .client-secondary-actions summary { cursor:pointer; color:var(--accent-ink); font-weight:600; font-size:13px; }
.line-actions, .form-actions--wrap { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.line-actions form, .form-actions--wrap form { margin:0; }
.autosave-status { color:var(--text-secondary); font-size:12px; min-height:18px; }
.big-number { font-family:'Instrument Serif',serif; font-size:20px; color:var(--ink); }
.payment-bar { height:5px; background:var(--line-soft); margin:18px 0 8px; overflow:hidden; }
.payment-bar span { display:block; height:100%; background:var(--accent); }
.payment-form { margin-top:20px; }
.version-row { display:flex; justify-content:space-between; gap:18px; align-items:center; padding:14px 0; border-bottom:1px solid var(--line-soft); }
.version-row > div { min-width:0; display:grid; gap:3px; }
.version-row span { color:var(--text-secondary); font-size:13px; }
.timeline { display:grid; gap:0; }
.timeline__item { position:relative; padding:13px 0 13px 18px; border-left:1px solid var(--line); display:grid; gap:3px; }
.timeline__item::before { content:""; position:absolute; left:-4px; top:19px; width:7px; height:7px; border-radius:50%; background:var(--ink); }
.timeline__item strong { font-size:14px; font-weight:600; }
.timeline__item span { font-size:12px; color:var(--text-secondary); }
.send-grid { display:grid; gap:20px; }
.check-list { display:grid; margin:18px 0; }
.check-list > div { display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid var(--line-soft); font-size:14px; }
.copy-field { display:flex; gap:8px; align-items:stretch; }
.copy-field input { min-width:0; flex:1; }
.tag--warn { color:#7A5714; background:#F6EEDD; }
.client-body { margin:0; background:#EDE8DF; color:var(--text); font-family:'DM Sans',sans-serif; }
.client-stage { width:min(100%,980px); margin:0 auto; padding:28px 12px 64px; }
.client-actions { background:#fff; border:1px solid var(--line); border-top:0; padding:32px 24px; }
.client-action-grid { display:grid; gap:24px; }
.client-mini-form { display:flex; gap:10px; align-items:end; flex-wrap:wrap; }
.client-mini-form .field { flex:1 1 250px; }
.client-secondary-actions { margin-top:28px; padding-top:22px; border-top:1px solid var(--line); display:flex; gap:20px; flex-wrap:wrap; align-items:flex-start; }
.client-secondary-actions details { flex:1 1 280px; }
.client-card, .accept-card { width:min(100%,720px); margin:30px auto; padding:32px 24px; background:#fff; border:1px solid var(--line); }
.client-card h1, .accept-card h1 { font:600 32px/1.1 'Instrument Serif',serif; color:var(--ink); }
.client-success { display:grid; gap:4px; margin:0 0 34px; padding:14px 16px; border-left:3px solid var(--ok); background:#EDF0E4; }
.client-success strong { color:#4C5A34; }
.client-success span { color:var(--text); font-size:13px; }
.client-accepted-next { display:grid; gap:22px; }
.payment-instructions { padding:16px 0 0; color:var(--text); }
.signature-field { display:grid; gap:8px; }
.signature-field > span { font-size:13px; font-weight:600; color:var(--ink); }
.signature-field canvas { width:100%; height:150px; background:#fff; border:1px dashed var(--field-border); touch-action:none; }
.signature-field > div { display:flex; gap:10px; align-items:center; justify-content:space-between; }
.signature-field small { color:var(--text-secondary); }
.proposal__brand--standalone { background:var(--ink); color:var(--canvas); padding:20px; margin:-32px -24px 28px; }
.proposal__action { text-decoration:none; }

@media (min-width: 768px) {
  .send-grid { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); align-items:start; }
  .client-action-grid { grid-template-columns:1fr 1fr; }
  .client-actions { padding:42px 64px; }
  .client-accepted-next { grid-template-columns:minmax(0,1fr) auto; align-items:end; }
}

@media (max-width: 767px) {
  .client-stage { padding:0 0 40px; }
  .client-actions { border-left:0; border-right:0; }
  .copy-field { flex-direction:column; }
  .quote-tabs { margin-left:-4px; margin-right:-4px; }
  .version-row { align-items:flex-start; }
  .big-number { font-size:18px; }
}


/* 2026-09-08 · correcciones acumuladas */
.client-channel-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
  margin-bottom: 34px;
}
.client-channel-row .btn { flex: 0 0 auto; }
.client-summary-stats {
  margin-top: 0;
  margin-bottom: 34px;
  padding-bottom: 2px;
}
.compact-list a {
  align-items: flex-start;
  justify-content: flex-start;
  padding-top: 10px;
  padding-bottom: 12px;
}
.compact-list__main { width: 100%; min-width: 0; }
.compact-list__status { display: block; margin-top: 7px; }
.compact-list__status .pill { min-height: 24px; }

.sokha-logo { display: block; height: auto; max-width: 100%; }
.sokha-logo--sidebar { width: 68px; }
.sokha-logo--proposal { width: 154px; }
.sokha-logo--client { width: 170px; }
.sokha-logo--login { width: 112px; }
.sokha-logo--mobile { width: 96px; }
.proposal__brand { min-width: 0; }
.proposal__brand--standalone {
  display: flex;
  align-items: center;
  min-height: 102px;
}

.proposal__payment-method {
  width: min(100%, 390px);
  margin: 20px 0 0 auto;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
}
.proposal__payment-method span {
  color: var(--text-secondary);
  font-size: 13px;
}
.proposal__payment-method strong {
  color: var(--ink);
  font-size: 14px;
  font-weight: 600;
}

.payment-instructions {
  margin-top: 20px;
  padding: 20px;
  border: 1px solid var(--line);
  background: var(--surface);
}
.payment-instructions h3 {
  margin: 8px 0 14px;
  color: var(--ink);
  font: 600 20px/1.25 'Instrument Serif', serif;
}
.payment-instructions p { margin: 8px 0 0; }
.payment-instructions__lead { margin-bottom: 14px !important; }
.payment-details { margin: 0; display: grid; }
.payment-details > div {
  display: grid;
  grid-template-columns: minmax(90px, .35fr) minmax(0, 1fr);
  gap: 14px;
  padding: 9px 0;
  border-bottom: 1px solid var(--line-soft);
}
.payment-details > div:last-child { border-bottom: 0; }
.payment-details dt { color: var(--text-secondary); font-size: 13px; }
.payment-details dd {
  min-width: 0;
  margin: 0;
  color: var(--ink);
  font-size: 13.5px;
  font-weight: 600;
  overflow-wrap: anywhere;
}
.payment-details dd .text-link {
  margin-left: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.access-link-list { display: grid; gap: 18px; margin-top: 22px; }

@media (max-width: 767px) {
  .client-channel-row {
    gap: 10px;
    margin-bottom: 28px;
  }
  .client-channel-row .btn { min-width: calc(50% - 5px); }
  .client-channel-row .btn--ghost { min-width: 100%; }
  .client-summary-stats { margin-bottom: 28px; }
  .proposal__payment-method { width: 100%; }
  .payment-details > div { grid-template-columns: 1fr; gap: 2px; }
  .payment-details dd .text-link { margin-left: 6px; }
}

@media (min-width: 768px) {
  .app-brand { padding: 12px; }
  .sokha-logo--sidebar { width: 66px; }
}

@media (min-width: 1200px) {
  .app-brand { justify-content: flex-start; padding: 20px; }
  .sokha-logo--sidebar { width: 156px; }
}


.proposal__payment {
  margin-top: 48px;
}
.proposal__payment h3 {
  margin: 12px 0 10px;
  color: var(--ink);
  font: 600 20px/1.25 'Instrument Serif', serif;
}
.proposal__payment-details {
  max-width: 720px;
  margin: 0;
  display: grid;
}
.proposal__payment-details > div {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 18px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line-soft);
}
.proposal__payment-details dt {
  color: var(--text-secondary);
  font-size: 13px;
}
.proposal__payment-details dd {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  font-weight: 600;
  overflow-wrap: anywhere;
}
@media (max-width: 767px) {
  .proposal__payment-details > div {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}


/* 2026-09-08 · últimos ajustes visuales */
.line-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--line-soft);
}
.line-actions form { margin: 0; }
.line-actions .btn {
  min-height: 36px;
  padding: 0 14px;
}
.line-actions .line-action-edit {
  background: var(--surface);
}
.line-actions .line-action-delete {
  margin-left: auto;
}

.proposal__exclusions p {
  max-width: 680px;
  font-size: 13px;
  line-height: 1.65;
}

@media (max-width: 767px) {
  .line-actions {
    gap: 8px;
  }
  .line-actions .line-action-delete {
    margin-left: 0;
    flex-basis: 100%;
  }
  .line-actions .line-action-delete .btn {
    width: 100%;
  }
}


/* 2026-09-08 · Área Cliente */
.client-area-body { margin:0; background:var(--canvas); color:var(--text); font-family:'DM Sans',sans-serif; }
.client-area-top { min-height:88px; padding:18px max(24px,calc((100% - 1120px)/2)); display:flex; align-items:center; justify-content:space-between; gap:24px; background:var(--ink); color:var(--canvas); }
.client-area-brand img { display:block; width:116px; height:auto; }
.client-area-company { display:flex; align-items:center; gap:18px; font-size:13px; }
.client-area-company a { color:#E8B7A6; text-decoration:none; font-weight:600; }
.client-area-nav { position:sticky; top:0; z-index:8; display:flex; gap:28px; padding:0 max(24px,calc((100% - 1120px)/2)); background:#fff; border-bottom:1px solid var(--line); }
.client-area-nav__link { min-height:50px; display:flex; align-items:center; color:var(--text-secondary); text-decoration:none; font-size:13px; font-weight:600; border-bottom:2px solid transparent; }
.client-area-nav__link.is-active { color:var(--accent-ink); border-bottom-color:var(--accent); }
.client-area-main { width:min(100% - 32px,1120px); margin:0 auto; padding:48px 0 80px; }
.client-area-hero h1,.client-area-heading h1 { margin:8px 0 10px; color:var(--ink); font:600 34px/1.12 'Instrument Serif',serif; }
.client-area-hero p,.client-area-heading p { margin:0; max-width:650px; color:var(--text-secondary); font-size:16px; line-height:1.65; }
.client-area-heading { margin-bottom:32px; }
.client-area-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:36px; }
.client-area-card { padding:28px; background:#fff; border:1px solid var(--line); border-radius:6px; }
.client-area-card--attention { border-top:3px solid var(--accent); }
.client-area-card h2 { margin:8px 0 8px; color:var(--ink); font:600 22px/1.25 'Instrument Serif',serif; }
.client-area-card p { color:var(--text-secondary); line-height:1.6; }
.client-area-amount { margin:12px 0; color:var(--ink); font:600 34px/1 'Instrument Serif',serif; }
.client-doc-list { display:grid; gap:12px; }
.client-doc-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:24px; padding:22px 24px; background:#fff; border:1px solid var(--line); border-radius:6px; }
.client-doc-row h2 { margin:8px 0 4px; color:var(--ink); font-size:16px; font-weight:600; }
.client-doc-row p { margin:0; color:var(--text-secondary); font-size:13px; }
.client-doc-row__side { display:flex; align-items:center; gap:22px; }
.client-doc-row__side > strong { color:var(--ink); font:600 19px/1 'Instrument Serif',serif; font-variant-numeric:tabular-nums; white-space:nowrap; }
.client-money-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; margin-bottom:28px; border:1px solid var(--line); background:var(--line); }
.client-money-summary > div { padding:24px; background:#fff; }
.client-money-summary span { display:block; color:var(--text-secondary); font-size:13px; }
.client-money-summary strong { display:block; margin-top:6px; color:var(--ink); font:600 28px/1 'Instrument Serif',serif; }
.client-area-empty { padding:40px 28px; background:#fff; border:1px dashed var(--line); }
.client-area-empty h2 { margin:0; color:var(--ink); font:600 22px/1.25 'Instrument Serif',serif; }
.client-account-data { display:grid; gap:0; margin:0 0 28px; border-top:1px solid var(--line); }
.client-account-data > div { display:grid; grid-template-columns:170px 1fr; gap:18px; padding:14px 0; border-bottom:1px solid var(--line-soft); }
.client-account-data dt { color:var(--text-secondary); font-size:13px; }
.client-account-data dd { margin:0; color:var(--ink); font-weight:600; }
.client-auth-card { width:min(calc(100% - 32px),540px); margin:48px auto; padding:36px 32px; background:#fff; border:1px solid var(--line); border-radius:6px; }
.client-auth-card h1 { margin:10px 0 12px; color:var(--ink); font:600 30px/1.15 'Instrument Serif',serif; }
.client-auth-card > p { color:var(--text-secondary); line-height:1.65; }
.client-auth-brand { margin:-36px -32px 28px; padding:24px 32px; background:var(--ink); }
.client-auth-brand img { display:block; width:118px; height:auto; }
.client-area-cta { display:flex; justify-content:space-between; align-items:center; gap:28px; margin:28px 0 0; padding:24px; background:#fff; border:1px solid var(--line); }
.client-area-cta h2 { margin:6px 0 0; color:var(--ink); font:600 20px/1.3 'Instrument Serif',serif; }
.client-area-cta p { margin:8px 0 0; color:var(--text-secondary); font-size:14px; }

@media (max-width:767px) {
  .client-area-top { min-height:72px; padding:14px 16px; }
  .client-area-brand img { width:96px; }
  .client-area-company strong { display:none; }
  .client-area-nav { position:fixed; left:0; right:0; bottom:0; top:auto; z-index:20; display:grid; grid-template-columns:repeat(5,1fr); gap:0; padding:0; border-top:1px solid var(--line); border-bottom:0; }
  .client-area-nav__link { min-height:64px; justify-content:center; padding:4px; text-align:center; font-size:10px; border-bottom:0; border-top:2px solid transparent; }
  .client-area-nav__link.is-active { border-top-color:var(--accent); background:var(--hover-row); }
  .client-area-main { width:min(100% - 32px,1120px); padding:32px 0 96px; }
  .client-area-grid,.client-money-summary { grid-template-columns:1fr; }
  .client-doc-row { grid-template-columns:1fr; gap:14px; padding:20px; }
  .client-doc-row__side { justify-content:space-between; }
  .client-account-data > div { grid-template-columns:1fr; gap:4px; }
  .client-area-cta { align-items:flex-start; flex-direction:column; }
  .client-area-cta .btn { width:100%; }
}

.preview-toolbar__actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
@media(max-width:767px){.preview-toolbar{align-items:flex-start;gap:12px;flex-direction:column}.preview-toolbar__actions{width:100%}.preview-toolbar__actions .btn{flex:1}}

/* 2026-09-09 · Dashboard visual Sokha + sidebar refinada */
@media (min-width:1200px){
  .app-brand{height:92px;padding:15px 22px;justify-content:flex-start;}
  .sokha-logo--sidebar{width:118px;}
}
.dashboard-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:2px 0 24px;}
.dashboard-kpi{position:relative;min-height:124px;padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);overflow:hidden;}
.dashboard-kpi::before{content:"";position:absolute;left:0;top:0;width:100%;height:2px;background:var(--accent);}
.dashboard-kpi>span{display:block;color:var(--text-secondary);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.dashboard-kpi>strong{display:block;margin-top:13px;color:var(--ink);font:600 25px/1.05 'Instrument Serif',serif;font-variant-numeric:tabular-nums;white-space:nowrap;}
.dashboard-kpi>small{display:block;margin-top:10px;color:var(--text-secondary);font-size:11.5px;line-height:1.4;}
.dashboard-charts{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr);gap:16px;margin-bottom:22px;}
.dashboard-card{padding:22px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);min-width:0;}
.dashboard-card--wide{grid-row:span 2;}
.dashboard-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px;}
.dashboard-card__head h2{margin:5px 0 0;color:var(--ink);font:600 18px/1.25 'Instrument Serif',serif;}
.dashboard-card__head>strong{color:var(--ink);font:600 17px/1.2 'Instrument Serif',serif;font-variant-numeric:tabular-nums;}
.revenue-bars{height:245px;display:grid;grid-template-columns:repeat(12,1fr);align-items:end;gap:8px;padding-top:12px;border-bottom:1px solid var(--line-soft);}
.revenue-bars__item{height:100%;display:grid;grid-template-rows:1fr 22px;align-items:end;gap:6px;text-align:center;}
.revenue-bars__track{height:100%;display:flex;align-items:end;justify-content:center;background:linear-gradient(to top,rgba(15,42,61,.035) 1px,transparent 1px);background-size:100% 25%;border-radius:3px 3px 0 0;overflow:hidden;}
.revenue-bars__track span{display:block;width:min(28px,68%);height:var(--bar-height);min-height:4px;background:var(--ink);border-radius:4px 4px 1px 1px;transition:height .25s ease;}
.revenue-bars__item:nth-child(3n+2) .revenue-bars__track span{background:var(--accent);}
.revenue-bars small{color:var(--text-secondary);font-size:10.5px;font-weight:600;}
.status-donut-wrap{display:grid;grid-template-columns:132px minmax(0,1fr);gap:22px;align-items:center;}
.status-donut{width:132px;height:132px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--ok) 0 var(--accepted),var(--ink) var(--accepted) calc(var(--accepted) + var(--open)),var(--accent) calc(var(--accepted) + var(--open)) calc(var(--accepted) + var(--open) + var(--draft)),var(--line) calc(var(--accepted) + var(--open) + var(--draft)) 100%);position:relative;}
.status-donut::after{content:"";position:absolute;inset:18px;border-radius:50%;background:var(--surface);}
.status-donut>div{position:relative;z-index:1;text-align:center;}
.status-donut strong{display:block;color:var(--ink);font:600 28px/1 'Instrument Serif',serif;}
.status-donut span{display:block;margin-top:5px;color:var(--text-secondary);font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;}
.chart-legend{display:grid;gap:9px;}
.chart-legend__item{display:grid;grid-template-columns:9px minmax(0,1fr) auto;align-items:center;gap:8px;color:var(--text-secondary);font-size:11.5px;}
.chart-legend__item strong{color:var(--ink);font-size:12px;}
.legend-dot{width:8px;height:8px;border-radius:50%;background:var(--line);}
.legend-dot--accepted{background:var(--ok);}.legend-dot--open{background:var(--ink);}.legend-dot--draft{background:var(--accent);}.legend-dot--closed{background:var(--line);}
.client-bars{display:grid;gap:13px;}
.client-bar__meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px;font-size:11.5px;}
.client-bar__meta span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-secondary);}
.client-bar__meta strong{color:var(--ink);font-size:11.5px;font-variant-numeric:tabular-nums;}
.client-bar__track{height:7px;background:var(--line-soft);border-radius:99px;overflow:hidden;}
.client-bar__track span{display:block;width:var(--bar-width);height:100%;background:var(--accent);border-radius:inherit;}
.chart-empty{padding:28px 0;color:var(--text-secondary);font-size:12.5px;text-align:center;}
.dashboard-lower{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(270px,.7fr);gap:26px;align-items:start;}
.dashboard-actions{grid-template-columns:repeat(2,minmax(0,1fr));}
.dashboard-actions .action-card{max-width:none;min-height:190px;display:flex;flex-direction:column;align-items:flex-start;}
.dashboard-actions .action-card .btn{margin-top:auto;}
.dashboard-activity,.quick-actions{padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);}
.dashboard-activity .section-head{margin-bottom:4px;}.timeline--compact{margin-top:8px;}.timeline--compact .timeline__item{padding-top:13px;padding-bottom:13px;}
.quick-actions{margin-top:16px;display:grid;gap:0;}
.quick-actions>.eyebrow{margin-bottom:8px;}
.quick-actions a{display:flex;align-items:center;min-height:42px;border-top:1px solid var(--line-soft);color:var(--ink);font-size:12.5px;font-weight:600;text-decoration:none;}
.quick-actions a:first-of-type{border-top:0;}
@media(hover:hover){.quick-actions a:hover{color:var(--accent-ink);}}
@media(max-width:1199px){.dashboard-kpis{grid-template-columns:repeat(2,minmax(0,1fr));}.dashboard-charts,.dashboard-lower{grid-template-columns:1fr}.dashboard-card--wide{grid-row:auto}.dashboard-actions{grid-template-columns:1fr}.sokha-logo--sidebar{width:66px;}}
@media(max-width:700px){.dashboard-kpis{grid-template-columns:1fr 1fr;gap:10px}.dashboard-kpi{min-height:112px;padding:15px}.dashboard-kpi>strong{font-size:21px}.dashboard-kpis .dashboard-kpi:last-child{grid-column:1/-1}.dashboard-card{padding:17px}.status-donut-wrap{grid-template-columns:1fr}.status-donut{margin:0 auto}.revenue-bars{height:190px;gap:4px}.dashboard-lower{gap:18px}}

/* === Proyectos · Sokha Kanban === */
.project-overview{display:flex;gap:1px;margin:0 0 18px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}.project-overview>div{min-width:120px;flex:1;padding:14px 16px;background:var(--surface)}.project-overview strong{display:block;color:var(--ink);font:600 24px/1 'Instrument Serif',serif}.project-overview span{display:block;margin-top:4px;color:var(--text-secondary);font-size:11.5px}.project-overview .is-alert strong{color:#9a4435}.project-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}.view-switch{display:inline-flex;padding:3px;background:#eae5dc;border-radius:10px}.view-switch a{padding:7px 12px;border-radius:8px;color:var(--text-secondary);font-size:12px;font-weight:700;text-decoration:none}.view-switch a.is-active{background:var(--surface);color:var(--ink);box-shadow:0 1px 4px rgba(15,42,61,.08)}.project-filters{display:flex;gap:8px;align-items:center}.project-filters select{min-height:36px;padding:0 30px 0 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);font:500 11.5px 'DM Sans',sans-serif}.kanban-wrap{width:100%;overflow-x:auto;overflow-y:hidden;padding-bottom:16px;scrollbar-width:thin}.kanban-board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,280px);gap:12px;align-items:start;min-width:max-content}.kanban-column{background:#ede8df;border:1px solid rgba(15,42,61,.08);border-radius:14px;min-height:460px}.kanban-column>header{display:flex;align-items:center;justify-content:space-between;padding:13px 13px 10px}.kanban-column>header>div{display:flex;align-items:center;gap:8px}.kanban-column>header strong{font-size:11.5px;letter-spacing:.01em;color:var(--ink)}.kanban-column>header b{display:grid;place-items:center;min-width:24px;height:24px;padding:0 6px;background:rgba(255,255,255,.72);border-radius:999px;color:var(--text-secondary);font-size:10.5px}.kanban-dot{width:7px;height:7px;border-radius:50%;background:#a69c90}.kanban-dot--quote,.kanban-dot--invoice{background:#c76a52}.kanban-dot--contact,.kanban-dot--review{background:#b68f53}.kanban-dot--in_progress{background:#0f2a3d}.kanban-dot--waiting_material,.kanban-dot--waiting_client{background:#80906f}.kanban-dot--done{background:#627657}.kanban-cards{display:grid;gap:9px;padding:0 8px 10px;min-height:390px}.kanban-cards.is-over{outline:2px dashed rgba(199,106,82,.55);outline-offset:-4px;border-radius:10px}.project-card{background:var(--surface);border:1px solid rgba(15,42,61,.08);border-radius:11px;box-shadow:0 2px 8px rgba(15,42,61,.035);cursor:grab;transition:transform .15s ease,box-shadow .15s ease,opacity .15s}.project-card:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(15,42,61,.08)}.project-card.is-dragging{opacity:.45;transform:rotate(1deg)}.project-card>a{display:block;padding:12px;color:inherit;text-decoration:none}.project-card__top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.project-card h3{margin:0;color:var(--ink);font:600 16px/1.22 'Instrument Serif',serif}.project-card p{margin:4px 0 0;color:var(--text-secondary);font-size:11.5px}.priority{display:inline-flex;align-items:center;min-height:20px;padding:0 7px;border-radius:999px;font-size:9.5px;font-weight:700;letter-spacing:.03em}.priority--urgent{background:#f5dfda;color:#963d2d}.priority--high{background:#f2e7d5;color:#815b1d}.priority--normal{background:#e9eee4;color:#58664a}.priority--low{background:#edf0f1;color:#6f7a80}.project-service{max-width:115px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-secondary);font-size:9.5px;text-transform:uppercase;letter-spacing:.06em}.project-card__next{margin-top:11px;padding:9px 10px;background:#f6f1e9;border-radius:8px}.project-card__next span{display:block;color:var(--accent);font-size:8.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.project-card__next strong{display:block;margin-top:3px;color:var(--ink);font-size:10.5px;line-height:1.35}.project-progress{height:3px;margin:11px 0 8px;background:#e7e0d7;border-radius:999px;overflow:hidden}.project-progress i{display:block;height:100%;background:var(--accent);border-radius:inherit}.project-card footer{display:flex;flex-wrap:wrap;gap:5px 9px;color:var(--text-secondary);font-size:9.5px}.project-card__due.is-late{color:#a44432;font-weight:700}.kanban-add{display:block;padding:9px 10px;color:var(--text-secondary);font-size:10.5px;text-decoration:none;border:1px dashed rgba(15,42,61,.13);border-radius:9px;text-align:center}.kanban-add:hover{color:var(--ink);background:rgba(255,255,255,.45)}.project-list{border-top:1px solid var(--line)}.project-list-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;padding:15px 2px;border-bottom:1px solid var(--line-soft);text-decoration:none}.project-list-row strong{display:block;margin-top:3px;color:var(--ink);font:600 16px/1.25 'Instrument Serif',serif}.project-list-row small{display:block;margin-top:3px;color:var(--text-secondary)}.project-status-label{color:var(--accent);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.09em}.project-list-row__right{display:flex;align-items:center;gap:15px;color:var(--text-secondary);font-size:11px}.project-list-row__right b{min-width:38px;color:var(--ink);font:600 16px 'Instrument Serif',serif;text-align:right}.project-detail-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin:0 0 18px;padding:18px 20px;background:var(--ink);border-radius:14px}.project-detail-head h2{margin:4px 0 3px;color:#fff;font:500 26px/1.18 'Instrument Serif',serif}.project-detail-head p{margin:0;color:#cad2d6;font-size:12px}.project-detail-head .project-status-label{color:#e3a18e}.project-detail-progress{text-align:right}.project-detail-progress strong{display:block;color:#fff;font:500 28px 'Instrument Serif',serif}.project-detail-progress span{color:#b9c3c7;font-size:10px}.project-detail-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:16px;align-items:start}.project-task-panel{position:sticky;top:18px}.task-add{display:flex;gap:7px;margin:12px 0}.task-add input{min-width:0;flex:1;height:38px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:var(--canvas);font:500 12px 'DM Sans',sans-serif}.task-add button{width:38px;border:0;border-radius:8px;background:var(--ink);color:white;font-size:20px}.task-list{display:grid}.task-row{display:grid;grid-template-columns:26px minmax(0,1fr) 24px;align-items:center;gap:8px;min-height:38px;border-top:1px solid var(--line-soft);font-size:11.5px}.task-row.is-done span{text-decoration:line-through;color:var(--text-secondary)}.task-row form{margin:0}.task-check{width:22px;height:22px;border:1px solid var(--line);border-radius:6px;background:transparent;color:var(--accent);font-weight:800}.task-delete{border:0;background:transparent;color:#a69c90;font-size:18px}.project-links{display:grid;margin-top:10px}.project-links a{padding:10px 0;border-top:1px solid var(--line-soft);color:var(--ink);font-size:11.5px;text-decoration:none}.project-links a:hover{color:var(--accent)}
@media(max-width:980px){.project-toolbar{align-items:flex-start;flex-direction:column}.project-filters{width:100%;overflow-x:auto}.project-detail-grid{grid-template-columns:1fr}.project-task-panel{position:static}.project-overview{overflow-x:auto}.project-overview>div{min-width:130px}}@media(max-width:700px){.kanban-board{grid-auto-columns:minmax(82vw,82vw)}.project-filters select{min-width:150px}.project-list-row{grid-template-columns:1fr}.project-list-row__right{justify-content:space-between}.project-detail-head{padding:16px}.project-detail-head h2{font-size:22px}}

/* === Seguimiento mensual · Proyectos + Área Cliente === */
.check-field{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1px solid rgba(15,42,61,.12);border-radius:14px;background:#fff}.check-field input{margin-top:4px}.check-field span{display:flex;flex-direction:column;gap:4px}.check-field strong{font-size:.95rem;color:var(--navy,#0F2A3D)}.check-field small{font-size:.78rem;line-height:1.45;color:#6e7478}
.project-months-panel{margin-top:18px}.month-add{display:flex;gap:10px;margin:16px 0 6px}.month-add input{min-width:150px}.project-month-list{display:grid;gap:9px;margin-top:14px}.project-month-row{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:13px 14px;border:1px solid rgba(15,42,61,.1);border-radius:13px;background:#fff;text-decoration:none;color:inherit;transition:.18s ease}.project-month-row:hover{transform:translateY(-1px);border-color:rgba(199,106,82,.45);box-shadow:0 7px 20px rgba(15,42,61,.06)}.project-month-row>div{display:flex;flex-direction:column;gap:3px}.project-month-row>div:last-child{text-align:right}.project-month-row span{font-size:.75rem;color:#7a7d7b}.project-month-editor{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:22px;align-items:start}.month-item-add{display:grid;grid-template-columns:1fr auto;gap:10px;margin-bottom:18px}.month-item-add textarea{grid-column:1/-1;resize:vertical}.month-item-list{display:grid;gap:10px}.month-item{display:flex;justify-content:space-between;gap:18px;padding:14px 14px;border:1px solid rgba(15,42,61,.1);border-radius:14px;background:#fff}.month-item>div:first-child{display:flex;flex-direction:column;gap:4px}.month-item strong{font-size:.92rem}.month-item p{margin:0;font-size:.8rem;line-height:1.45;color:#6d7172}.month-item__status{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:#8a8e8f}.month-item--done{background:#f6f7f1}.month-item--done strong{text-decoration:none}.month-item__actions{display:flex;gap:8px;align-items:flex-start}.month-item__actions select{font-size:.78rem;padding:7px 28px 7px 8px}.month-item__actions form{margin:0}

.client-area-card--tracking{background:linear-gradient(145deg,#fffaf4,#f7eee4)}.client-tracking-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.client-tracking-card{display:block;padding:22px;border:1px solid rgba(15,42,61,.09);border-radius:18px;background:#fff;text-decoration:none;color:inherit;box-shadow:0 10px 30px rgba(15,42,61,.045);transition:.18s ease}.client-tracking-card:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(15,42,61,.075)}.client-tracking-card__top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:16px}.client-tracking-card__top>span:last-child{font-size:.74rem;color:#7b7f7f}.client-tracking-card h2{font-family:''Instrument Serif'',serif;font-size:1.25rem;margin:0 0 7px;color:#0F2A3D}.client-tracking-card p{margin:0 0 16px;color:#737879}.client-tracking-card footer{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:.78rem;color:#737879}.client-tracking-card footer strong{color:#0F2A3D;font-size:.9rem}.client-project-heading{display:flex;justify-content:space-between;gap:20px;align-items:flex-end}.client-month-timeline{display:grid;gap:22px}.client-month-card{overflow:hidden;border:1px solid rgba(15,42,61,.09);border-radius:20px;background:#fff;box-shadow:0 12px 34px rgba(15,42,61,.04)}.client-month-card>header{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 24px;background:#0F2A3D;color:#fff}.client-month-card h2{margin:2px 0 0;font-family:''Instrument Serif'',serif;font-size:1.45rem;font-weight:500}.client-month-kicker{font-size:.69rem;text-transform:uppercase;letter-spacing:.12em;opacity:.68}.client-month-progress{text-align:right;display:flex;flex-direction:column}.client-month-progress strong{font-size:1.35rem}.client-month-progress span{font-size:.7rem;opacity:.72}.client-month-intro,.client-month-closing{padding:20px 24px;background:#fbf6ef}.client-month-intro p,.client-month-closing p{margin:8px 0 0;line-height:1.65;color:#4c5356}.client-month-closing{background:#f4f6f3;border-top:1px solid rgba(15,42,61,.06)}.client-month-items{padding:10px 24px 18px}.client-month-item{display:grid;grid-template-columns:28px 1fr;gap:12px;padding:14px 0;border-bottom:1px solid rgba(15,42,61,.07)}.client-month-item:last-child{border-bottom:0}.client-month-item__mark{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1px solid rgba(15,42,61,.16);font-size:.82rem;color:#0F2A3D}.client-month-item--done .client-month-item__mark{background:#0F2A3D;color:#fff;border-color:#0F2A3D}.client-month-item--in_progress .client-month-item__mark{background:#C76A52;color:#fff;border-color:#C76A52}.client-month-item--cancelled{opacity:.58}.client-month-item strong{display:block;font-size:.92rem;color:#0F2A3D}.client-month-item p{margin:5px 0 0;font-size:.82rem;line-height:1.55;color:#676d70}.client-month-item small{display:block;margin-top:5px;font-size:.68rem;text-transform:uppercase;letter-spacing:.07em;color:#999}

@media(max-width:900px){.project-month-editor,.client-tracking-grid{grid-template-columns:1fr}.client-project-heading{align-items:flex-start;flex-direction:column}.client-month-card>header{padding:18px 19px}.client-month-intro,.client-month-closing,.client-month-items{padding-left:19px;padding-right:19px}}
@media(max-width:620px){.month-add{flex-direction:column}.project-month-row{align-items:flex-start}.project-month-row>div:last-child{text-align:left}.month-item{flex-direction:column}.month-item__actions{justify-content:space-between}.client-month-card h2{font-size:1.25rem}}

/* 2026-09-22 · ficha cliente integrada con proyectos y seguimiento */
.detail-grid { align-items: start; }
.client-context-panel { align-self: start; overflow: hidden; }
.client-context-panel h2 { margin-bottom: 12px; }
.client-side-section { min-width: 0; padding: 16px 0; border-top: 1px solid var(--line-soft); }
.client-side-section:first-of-type { margin-top: 4px; }
.client-side-section__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.client-side-section__head > span { color: var(--ink); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.client-side-section__head a { color: var(--accent-ink); font-size: 11.5px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.client-project-card,
.client-tracking-summary { min-width: 0; display: grid; gap: 5px; padding: 12px 0; color: var(--text); text-decoration: none; border-bottom: 1px solid var(--line-soft); }
.client-project-card:last-child,
.client-tracking-summary:last-child { border-bottom: 0; }
.client-project-card strong,
.client-tracking-summary strong { min-width: 0; color: var(--ink); font-size: 13.5px; line-height: 1.35; overflow-wrap: anywhere; word-break: break-word; }
.client-project-card span,
.client-project-card small,
.client-tracking-summary span,
.client-tracking-summary small { min-width: 0; color: var(--text-secondary); font-size: 11.5px; line-height: 1.45; overflow-wrap: anywhere; word-break: break-word; }
.client-project-card__progress { width: 100%; height: 4px; overflow: hidden; background: var(--line-soft); border-radius: 999px; }
.client-project-card__progress i { display: block; height: 100%; background: var(--accent); border-radius: inherit; }
.compact-list--client strong { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; word-break: break-word; line-height: 1.35; }
.compact-list--client a { min-width: 0; }
.compact-list--client .compact-list__main { min-width: 0; overflow: hidden; }
.btn--block { width: 100%; justify-content: center; }

@media (min-width: 1024px) {
  .detail-grid { grid-template-columns: minmax(0, 1.45fr) minmax(320px, .72fr); align-items: start; }
  .detail-grid > .panel,
  .detail-grid > .panel--aside { margin-top: 0; }
}

/* === 2026-09-22 · ajuste tipográfico global y seguimiento mensual === */
:root {
  --type-xs: 10.5px;
  --type-sm: 11.5px;
  --type-meta: 12px;
  --type-ui: 13px;
  --type-body: 13.5px;
  --type-card: 14px;
  --type-section: 18px;
  --type-page: 22px;
}

/* La interfaz mantiene una jerarquía corta y consistente. */
body { font-size: 14px; line-height: 1.55; }
.screen-head h1 { font-size: var(--type-page); }
.screen-head p { font-size: var(--type-body); }
.eyebrow { font-size: var(--type-xs); }
.action-card h2,
.section-head h2,
.panel h2,
.quote-head-card h2 { font-size: var(--type-section); line-height: 1.28; }
.panel p,
.muted-copy { font-size: var(--type-body); line-height: 1.55; }
.btn { font-size: var(--type-ui); }
.field > span { font-size: var(--type-ui); }
.field input,
.field select,
.field textarea { font-size: 14px; }
.tag,
.pill { font-size: var(--type-sm); }

/* Seguimiento mensual: el mes es información, no un segundo titular. */
.project-months-panel .section-head { align-items: center; }
.project-months-panel .section-head h2 { font-size: 18px; }
.project-months-panel > .muted-copy { max-width: 48ch; margin: 4px 0 14px; }
.month-add { align-items: center; }
.month-add input[type="month"] {
  width: 178px;
  min-width: 0;
  height: 40px;
  padding: 0 10px;
  border: 1px solid var(--field-border);
  border-radius: var(--radius-control);
  background: #fff;
  color: var(--text);
  font: 500 13px/1 'DM Sans', sans-serif;
}
.month-add .btn { min-height: 40px; padding-inline: 16px; }
.project-month-list { gap: 8px; }
.project-month-row { padding: 12px 14px; border-radius: 10px; }
.project-month-row strong {
  color: var(--ink);
  font: 600 13.5px/1.35 'DM Sans', sans-serif;
  letter-spacing: 0;
}
.project-month-row span { font-size: 11.5px; line-height: 1.4; }
.project-month-row b { color: var(--ink); font: 600 14px/1.2 'DM Sans', sans-serif; }

/* Detalle de proyecto: 'Instrument Serif' solo en titulares principales, no en cada cifra o dato. */
.project-detail-head h2 { font-size: 22px; line-height: 1.2; }
.project-detail-progress strong { font: 600 22px/1 'DM Sans', sans-serif; }
.project-overview strong { font: 600 20px/1.1 'DM Sans', sans-serif; }
.project-card h3 { font: 600 14px/1.3 'DM Sans', sans-serif; }
.project-list-row strong { font: 600 14px/1.3 'DM Sans', sans-serif; }
.project-list-row__right b { font: 600 14px/1 'DM Sans', sans-serif; }

/* Editor mensual y tarjetas: escala más tranquila y uniforme. */
.check-field strong { font-size: 13.5px; }
.check-field small { font-size: 11.5px; }
.month-item strong { font-size: 13px; line-height: 1.35; }
.month-item p { font-size: 11.5px; }
.month-item__status { font-size: 10px; }
.month-item__actions select { font-size: 11.5px; }

/* Área cliente: evita saltos de escala entre tarjetas, meses y datos. */
.client-area-hero h1,
.client-area-heading h1 { font-size: 28px; line-height: 1.15; }
.client-area-hero p,
.client-area-heading p { font-size: 14px; }
.client-area-card h2 { font-size: 18px; }
.client-area-amount { font-size: 27px; }
.client-money-summary strong { font-size: 24px; }
.client-tracking-card h2 { font-size: 17px; line-height: 1.3; }
.client-tracking-card p { font-size: 12.5px; line-height: 1.55; }
.client-tracking-card footer { font-size: 11.5px; }
.client-tracking-card footer strong { font-size: 12.5px; }
.client-month-card h2 { font-size: 19px; line-height: 1.25; }
.client-month-progress strong { font-size: 18px; }
.client-month-intro p,
.client-month-closing p { font-size: 13px; }
.client-month-item strong { font-size: 13px; }
.client-month-item p { font-size: 11.5px; }
.client-month-item small,
.client-month-kicker,
.client-month-progress span { font-size: 10px; }

/* Ficha cliente lateral: todos los niveles respetan la misma escala. */
.client-side-section__head > span { font-size: 10.5px; }
.client-side-section__head a { font-size: 11px; }
.client-project-card strong,
.client-tracking-summary strong { font-size: 12.5px; line-height: 1.4; }
.client-project-card span,
.client-project-card small,
.client-tracking-summary span,
.client-tracking-summary small { font-size: 11px; line-height: 1.45; }

@media (max-width: 700px) {
  .screen-head h1 { font-size: 21px; }
  .project-detail-head h2 { font-size: 20px; }
  .client-area-hero h1,
  .client-area-heading h1 { font-size: 24px; }
  .client-month-card h2 { font-size: 17px; }
  .month-add input[type="month"] { width: 100%; }
}

/* Navegación contextual: métricas y bloques clicables */
.project-overview .project-metric{position:relative;min-width:120px;flex:1;padding:14px 16px;background:var(--surface);color:inherit;text-decoration:none;transition:background .15s ease,transform .15s ease,box-shadow .15s ease}.project-overview .project-metric:hover{background:#fbf8f3;box-shadow:inset 0 0 0 1px rgba(199,106,82,.18)}.project-overview .project-metric:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}.project-overview .project-metric strong{display:block;color:var(--ink);font:600 20px/1.1 'DM Sans',sans-serif}.project-overview .project-metric span{display:block;margin-top:4px;color:var(--text-secondary);font-size:11.5px}.project-overview .project-metric em{position:absolute;right:14px;bottom:12px;color:var(--accent);font-size:9px;font-style:normal;font-weight:800;letter-spacing:.06em;text-transform:uppercase;opacity:0;transform:translateX(-2px);transition:opacity .15s ease,transform .15s ease}.project-overview .project-metric:hover em{opacity:1;transform:none}.project-overview .project-metric.is-alert strong{color:#9a4435}
.kanban-column>header .kanban-column__filter{display:flex;align-items:center;gap:8px;color:inherit;text-decoration:none;min-width:0}.kanban-column>header .kanban-column__filter:hover strong{color:var(--accent)}.kanban-column>header .kanban-column__count{display:grid;place-items:center;min-width:24px;height:24px;padding:0 6px;background:rgba(255,255,255,.72);border-radius:999px;color:var(--text-secondary);font-size:10.5px;text-decoration:none}.kanban-column>header .kanban-column__count:hover{background:#fff;color:var(--accent)}
.project-detail-head a{text-decoration:none}.project-status-link:hover{color:#fff}.project-client-link,.project-service-link{color:#cad2d6;text-decoration:underline;text-decoration-color:rgba(255,255,255,.2)!important;text-underline-offset:3px}.project-client-link:hover,.project-service-link:hover{color:#fff;text-decoration-color:rgba(255,255,255,.6)!important}.project-detail-progress{display:block;color:inherit;text-decoration:none;border-radius:8px;padding:4px 6px;margin:-4px -6px 0 0;transition:background .15s ease}.project-detail-progress:hover{background:rgba(255,255,255,.07)}
.dashboard-kpi--link{display:block;color:inherit;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.dashboard-kpi--link:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(15,42,61,.07);border-color:rgba(199,106,82,.34)}.dashboard-kpi em{position:absolute;right:16px;bottom:13px;color:var(--accent);font-size:9px;font-style:normal;font-weight:800;letter-spacing:.06em;text-transform:uppercase;opacity:0;transition:opacity .15s ease}.dashboard-kpi--link:hover em{opacity:1}.dashboard-kpi:not(.dashboard-kpi--link) em{display:none}.client-bar--link{display:block;color:inherit;text-decoration:none;padding:5px 7px;margin:0 -7px;border-radius:8px;transition:background .15s ease}.client-bar--link:hover{background:#f7f2ea}.client-bar--link:hover .client-bar__meta span{color:var(--accent)}
@media(max-width:980px){.project-overview .project-metric{min-width:130px}.project-overview .project-metric em,.dashboard-kpi em{display:none}}


/* Client record information architecture */
.client-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;flex-wrap:wrap;margin-bottom:18px}
.client-toolbar__actions,.client-toolbar__nav{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.client-toolbar__nav{margin-left:auto;padding-left:28px;border-left:1px solid var(--line,#ded4c7)}
.client-record-tabs{display:flex;gap:24px;align-items:center;flex-wrap:wrap;padding:0 0 16px;margin:0 0 18px;border-bottom:1px solid var(--line,#ded4c7)}
.client-record-tabs a{font:600 13px/1.2 "'DM Sans'",sans-serif;color:var(--navy,#0f2a3d);text-decoration:none;padding:6px 0}
.client-record-tabs a:hover{text-decoration:underline;text-underline-offset:4px}
.portal-access-choice{display:flex;justify-content:space-between;gap:16px;padding:16px 18px;margin:14px 0 18px;background:#f7f2ea;border:1px solid #e5d9ca;border-radius:12px}
.portal-access-choice div{display:grid;gap:5px}
.portal-access-choice span{font-size:13px;color:#6d6258}
.portal-invite-form{margin-top:14px}
.client-preview-banner{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 22px;padding:14px 18px;border:1px solid #d8c7b7;background:#fffaf5;border-radius:12px;font-family:"'DM Sans'",sans-serif}
.client-preview-banner strong{color:#0f2a3d}
.client-preview-banner span{color:#6d6258;flex:1 1 320px}
.client-preview-banner a{color:#b4563f;font-weight:700;text-decoration:none}
.client-area-preview .client-area-nav__link{cursor:default}
.client-area-preview .client-area-company span{font-size:12px;color:#d9cbbc}
@media (max-width:900px){
  .client-toolbar{gap:16px}
  .client-toolbar__nav{margin-left:0;padding-left:0;border-left:0;width:100%;padding-top:12px;border-top:1px solid var(--line,#ded4c7)}
  .client-record-tabs{gap:16px}
}

/* Invitaciones Área Cliente */
.portal-inline-notice{margin:14px 0 16px}
.notice--warning{border-color:#d9b56d;background:#fffaf0}
.portal-invite-form.is-submitting{opacity:.72;pointer-events:none}
.portal-invite-form button[disabled]{cursor:wait}




/* Sokha current identity — exact logo assets */
.sokha-logo{display:block;height:auto;object-fit:contain}
.sokha-logo--sidebar{width:132px;max-height:48px}
.sokha-logo--mobile{width:106px;max-height:34px}
.sokha-logo--client{width:122px;max-height:40px}
.sokha-logo--login{width:158px;max-height:50px}
.app-brand{padding:0 18px}
.client-area-brand{display:inline-flex;align-items:center}
.login-brand{background:var(--ink)}
@media (min-width:768px) and (max-width:1199px){
  .sokha-logo--sidebar{width:58px;max-height:48px;object-fit:contain}
}
@media (max-width:620px){
  .sokha-logo--mobile{width:96px;max-height:31px}
  .sokha-logo--login{width:140px;max-height:46px}
}