/* Vision One: light sage surfaces, forest typography, restrained brass details. */
:root {
  color-scheme: light;
  --v1-page: #f3f6f0;
  --v1-paper: #ffffff;
  --v1-sage: #e5eddf;
  --v1-sage-deep: #d2dfca;
  --v1-forest: #254b3d;
  --v1-ink: #20382e;
  --v1-muted: #53665b;
  --v1-border: #cfdbca;
  --v1-brass: #78612f;
}
html { scroll-behavior: smooth; }
body { background: var(--v1-page) !important; color: var(--v1-ink) !important; -webkit-font-smoothing: antialiased; }
::selection { background: #c9dcc0 !important; color: #173727 !important; }
.bg-v1navy, .bg-v1navy\/90, .bg-v1dark, .bg-v1card { background-color: var(--v1-sage) !important; }
.bg-slate-900, .bg-slate-900\/80, .bg-slate-900\/90 { background-color: var(--v1-paper) !important; }
.bg-slate-950, .bg-slate-950\/80 { background-color: #f6f8f3 !important; }
.bg-slate-800 { background-color: #e8efe3 !important; }
.text-white, .text-slate-200, .text-slate-950, .text-v1navy { color: var(--v1-ink) !important; }
.text-slate-300 { color: #40594a !important; }
.text-slate-400, .text-slate-500 { color: var(--v1-muted) !important; }
.text-emerald-300, .text-emerald-400, .text-teal-400 { color: #286145 !important; }
.text-amber-300, .text-amber-400 { color: var(--v1-brass) !important; }
.text-blue-400, .text-sky-400 { color: #285e79 !important; }
.text-purple-400, .text-indigo-400 { color: #655083 !important; }
.text-rose-400 { color: #a13248 !important; }
.border-slate-700, .border-slate-700\/60, .border-slate-800, .border-slate-800\/80 { border-color: var(--v1-border) !important; }
.divide-slate-800\/60 > :not([hidden]) ~ :not([hidden]) { border-color: var(--v1-border) !important; }
.border-amber-400, .border-amber-400\/30, .border-amber-400\/40, .border-amber-500\/20, .border-amber-500\/30, .border-amber-500\/40 { border-color: #c8c39e !important; }
.border-emerald-500\/30, .border-emerald-500\/40 { border-color: #aac39f !important; }
.bg-emerald-950\/60, .bg-emerald-500\/10, .bg-emerald-500\/20, .bg-teal-500\/10 { background-color: #e5efdf !important; }
.bg-amber-500\/10, .bg-amber-500\/20 { background-color: #f0eddc !important; }
.bg-blue-500\/10 { background-color: #e8eff2 !important; }
.bg-purple-500\/10 { background-color: #eeebf3 !important; }
.bg-rose-500\/10 { background-color: #f6e9eb !important; }
.bg-emerald-400 { background-color: #5c8055 !important; }
.bg-amber-300, .bg-amber-400 { background-color: #9b874f !important; }
.bg-emerald-600, .bg-emerald-700\/60, .bg-emerald-700\/80 { background-color: var(--v1-forest) !important; color: #fff !important; }
.bg-v1gold, .bg-amber-500 { background-color: var(--v1-sage-deep) !important; color: var(--v1-ink) !important; }
.from-v1navy { background-image: linear-gradient(140deg, #e3ecdc 0%, #f6f8f2 62%, #edf2e7 100%) !important; }
.from-emerald-600 { background-image: linear-gradient(135deg, #9eb791, #69865e) !important; }
.from-amber-500, .from-amber-400 { background-image: linear-gradient(110deg, #345d47, #254b3d) !important; color: #fff !important; }
.gold-gradient { background: none !important; color: #527348 !important; -webkit-text-fill-color: #527348 !important; }
.shadow-2xl { box-shadow: 0 16px 50px -18px rgb(46 75 40 / 20%) !important; }
.shadow-lg { box-shadow: 0 6px 20px -8px rgb(46 75 40 / 18%) !important; }
.shadow { box-shadow: 0 2px 6px rgb(46 75 40 / 12%) !important; }
header { gap: 16px; background-color: rgb(231 239 225 / 96%) !important; box-shadow: 0 2px 12px rgb(42 66 38 / 5%); }
header > div:first-child { min-width: 0; }
header .font-serif { color: var(--v1-forest) !important; }
#domainBadge { background: #f7f8ef !important; color: #4b613f !important; border-color: #bfccaf !important; }
#tabLanding, #tabCRM { min-height: 38px; white-space: nowrap; }
#tabLanding.bg-emerald-600, #tabCRM.bg-emerald-600 { color: #fff !important; }
#tabCRM.bg-emerald-600 > i { color: #e2eacc !important; }
#leadCountBadge { background: #e3ead3 !important; color: #385332 !important; border-color: #bbcaa9 !important; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button { touch-action: manipulation; }
button:disabled { opacity: .6; cursor: wait; }
.hover\:bg-slate-700:hover, .hover\:bg-slate-800\/40:hover { background-color: #dce8d5 !important; }
.hover\:bg-emerald-600:hover { background-color: #1c3e30 !important; color: #fff !important; }
.hover\:bg-amber-500\/30:hover { background-color: #e7e3cb !important; }
.hover\:text-white:hover, .hover\:text-slate-300:hover, .hover\:text-emerald-300:hover { color: #21442e !important; }
.hover\:text-amber-400:hover { color: #695022 !important; }
.hover\:text-rose-300:hover { color: #812637 !important; }
button.bg-emerald-600:hover, button.from-amber-500:hover { color: #fff !important; filter: brightness(.94); }
input:not([type="checkbox"]):not([type="radio"]), select, textarea { color: var(--v1-ink) !important; background-color: #fbfcf9 !important; border-color: #bacbb2 !important; }
input::placeholder, textarea::placeholder { color: #65745f !important; opacity: 1; }
input:focus, select:focus, textarea:focus { outline: 2px solid #628b54 !important; outline-offset: 2px; border-color: #628b54 !important; }
a:focus-visible, button:focus-visible { outline: 3px solid #628b54 !important; outline-offset: 3px; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--v1-forest); }
option { color: var(--v1-ink) !important; background: #fff !important; }
thead { background: #eaf0e4 !important; }
tbody tr { border-color: var(--v1-border) !important; }
#crmView .rounded-xl.border { box-shadow: 0 3px 14px -8px rgb(34 62 29 / 14%); }
#crmPanelPipeline > .grid > div { background-color: #edf2e7 !important; }
#crmPanelPipeline [id^="kanbanCol"] > div { background-color: #fff !important; }
[id^="kpi"] { letter-spacing: -.035em; overflow-wrap: anywhere; }
.custom-scrollbar::-webkit-scrollbar-track { background: #eaf0e5 !important; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: #a4b89a !important; border-radius: 8px; }
* { scrollbar-color: #a4b89a #eaf0e5; }
/* Secure account forms share the same visual language as the CRM. */
#authView { padding: 48px 20px 64px; background: radial-gradient(ellipse at 50% 0%, #dce8d3 0, transparent 65%), var(--v1-page); }
.auth-card { width: 100%; max-width: 460px; margin: 0 auto; padding: 36px; background: #fff; border: 1px solid var(--v1-border); border-radius: 22px; box-shadow: 0 14px 48px -20px rgb(46 75 40 / 24%); }
.auth-card h1, .auth-card h2 { color: var(--v1-forest); line-height: 1.25; }
.auth-card label { display: block; font-size: 13px; font-weight: 600; color: #40594a; }
.auth-input { display: block; width: 100%; min-height: 46px; margin-top: 6px; padding: 11px 14px; border: 1px solid #bacbb2; border-radius: 9px; font-size: 15px; }
.auth-primary, .auth-secondary { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 11px 18px; border-radius: 9px; font-size: 14px; font-weight: 700; transition: background-color .15s; cursor: pointer; }
.auth-primary { width: 100%; background: var(--v1-forest) !important; color: #fff !important; border: 1px solid var(--v1-forest); }
.auth-primary:hover { background: #1d3e30 !important; }
.auth-secondary { color: var(--v1-forest) !important; background: #edf3e8; border: 1px solid var(--v1-border); }
.auth-secondary:hover { background: #dce8d5; }
.auth-status { color: #40594a; font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
.auth-status:not(:empty) { padding: 12px 14px; border-radius: 9px; background: #edf3e8; margin-top: 16px; }
.auth-status.error, .auth-status[data-state="error"] { color: #8b2c3f; background: #faecee; }
@media (max-width: 1100px) {
  header { flex-wrap: wrap; }
  header > div:last-child { flex-wrap: wrap; gap: 10px; }
}
@media (max-width: 639px) {
  header { padding: 12px 16px !important; gap: 12px; position: relative !important; }
  header > div { width: 100%; }
  header > div:first-child { gap: 10px; }
  header > div:first-child > div:last-child { min-width: 0; }
  header > div:first-child > div:last-child > div { flex-wrap: wrap; gap: 4px 8px; }
  header .font-serif { font-size: 17px; }
  header p { font-size: 10px !important; }
  header > div:last-child > .bg-slate-900 { display: flex; width: 100%; }
  #tabLanding, #tabCRM { flex: 1; justify-content: center; min-height: 42px; padding: 8px !important; }
  #landingView > section:first-child { padding-top: 32px; }
  #crmPanelLeads > div:first-child > div { flex-wrap: wrap; width: 100%; }
  #leadSearchInput { width: 100%; }
  #leadFilterProgram { flex-grow: 1; }
  #crmPanelPipeline > .flex { align-items: flex-start; flex-direction: column; gap: 8px; }
  .auth-card { padding: 26px 22px; border-radius: 16px; }
  #authView { padding: 28px 16px 40px; }
  input:not([type="checkbox"]):not([type="radio"]), select, textarea { font-size: 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition-duration: 0s !important; }
}
/* Preserve legibility of small team badges with explicit brand backgrounds. */
[class*="bg-[#"].text-white { color: #fff !important; }
.bg-\[\#FD5A1E\].text-white { color: #242c21 !important; }
[hidden] { display:none !important; }
.auth-card h1 {font-size:30px;font-weight:700;margin:14px 0 8px;}
.auth-eyebrow {font-size:10px;letter-spacing:.12em;font-weight:700;color:#526c58;}
.auth-card form {display:grid;gap:14px;margin-top:24px;}
.auth-card .auth-secondary {margin-top:12px;}
.auth-note {font-size:12px;line-height:1.6;color:#53665b;margin-top:20px;}
/* Author display rules must never override native hidden form controls. */
[hidden] { display: none !important; }
.auth-eyebrow { display: block; margin-bottom: 18px; color: #527348; font-size: 10px; font-weight: 800; letter-spacing: .13em; }
.auth-card h1 { font-size: 28px; font-weight: 700; margin-bottom: 10px; }
#authDescription { color: var(--v1-muted); font-size: 14px; line-height: 1.6; margin-bottom: 24px; }
#authForm { display: flex; flex-direction: column; gap: 16px; }
#authForm > .auth-input { margin-top: -10px; }
#authSubmit { margin-top: 4px; }
#forgotPassword, #backToSignIn { margin-top: 14px; }
.auth-note { color: var(--v1-muted); font-size: 12px; line-height: 1.7; margin: 20px 0; }