:root {
  --navy: #073b55;
  --navy-deep: #062f45;
  --lime: #8df000;
  --bg: #f4f7f9;
  --surface: #ffffff;
  --line: #e3e9ed;
  --muted: #71808a;
  --text: #173340;
  --danger: #ef5b5b;
  --warning: #f2a33c;
  --violet: #7867d9;
  --shadow: 0 8px 30px rgba(13, 53, 72, .06);
  --radius: 16px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background: var(--bg);
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: var(--bg); }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 244px minmax(0, 1fr); }
.sidebar { position: fixed; inset: 0 auto 0 0; width: 244px; display: flex; flex-direction: column; padding: 24px 18px; background: var(--navy-deep); color: white; z-index: 20; }
.brand { display: flex; align-items: center; gap: 12px; color: white; text-decoration: none; padding: 0 9px 28px; }
.brand-mark { display: grid; place-items: center; width: 50px; height: 50px; border: 1px solid rgba(141,240,0,.32); border-radius: 8px; color: var(--lime); font-size: .875rem; font-weight: 900; line-height: .88; letter-spacing: -.5px; }
.brand-mark.brand-image { overflow: visible; padding: 4px; border: 0; border-radius: 8px; background: transparent; }
.brand-mark.brand-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.auth-brand .brand-mark { width: 62px; height: 62px; padding: 5px; }
.mobile-auth-brand .brand-mark { width: 50px; height: 50px; padding: 4px; border:0; background:transparent; }
.brand strong { display: block; font-size: 1.125rem; letter-spacing: -.2px; }
.brand small { display: block; margin-top: 1px; color: var(--lime); font-size: .875rem; text-transform: uppercase; letter-spacing: 2.2px; }
.brand.brand-full { display: block; padding: 0 9px 28px; }
.brand-full img { display: block; width: 174px; height: auto; }
.sidebar-nav { display: grid; gap: 7px; }
.sidebar-nav a { display: grid; grid-template-columns: 22px 1fr auto; align-items: center; gap: 10px; min-height: 45px; padding: 0 13px; border-radius: 10px; color: #b8cbd4; font-size: 1rem; font-weight: 550; text-decoration: none; transition: .2s ease; }
.sidebar-nav a:hover { color: white; background: rgba(255,255,255,.055); }
.sidebar-nav a.active { color: white; background: rgba(141,240,0,.12); box-shadow: inset 3px 0 var(--lime); }
.sidebar-nav a.active span { color: var(--lime); }
.sidebar-nav b { min-width: 24px; padding: 3px 6px; border-radius: 10px; background: rgba(255,255,255,.09); color: #d9e6eb; font-size: .875rem; text-align: center; }
.sidebar-bottom { margin-top: auto; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.09); }
.user-card { display: grid; grid-template-columns: 35px 1fr auto; align-items: center; gap: 10px; }
.avatar { display: inline-grid; place-items: center; flex: 0 0 auto; width: 35px; height: 35px; border-radius: 50%; background: var(--lime); color: var(--navy-deep); font-size: .875rem; font-style: normal; font-weight: 800; }
.user-card strong { display: block; color: white; font-size: .875rem; }
.user-card small { display: block; margin-top: 2px; color: #8ca6b3; font-size: .875rem; }
.user-card button { border: 0; background: transparent; color: #8ca6b3; }

.main { grid-column: 2; min-width: 0; min-height: 100vh; display: flex; flex-direction: column; }
.topbar { position: sticky; top: 0; z-index: 10; height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 34px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.92); backdrop-filter: blur(12px); }
.search { display: flex; align-items: center; gap: 10px; width: min(400px, 45vw); color: #82909a; }
.search input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 1rem; }
.top-actions { display: flex; align-items: center; gap: 12px; }
.icon-button, .mobile-menu { position: relative; width: 39px; height: 39px; border: 1px solid var(--line); border-radius: 10px; background: white; color: #5e707b; }
.theme-toggle { display: grid; place-items: center; font-size: 1.1875rem; line-height: 1; transition: transform .2s ease, background .2s ease, color .2s ease; }
.theme-toggle:hover { transform: rotate(10deg); }
.theme-toggle:disabled { cursor: wait; opacity: .65; }
.notification-dot { position: absolute; right: 9px; top: 9px; width: 6px; height: 6px; border: 1px solid white; border-radius: 50%; background: var(--danger); }
.primary-button, .secondary-button { min-height: 40px; padding: 0 17px; border: 0; border-radius: 10px; font-size: .875rem; font-weight: 750; }
.primary-button { background: var(--lime); color: var(--navy-deep); box-shadow: 0 5px 14px rgba(119, 208, 0, .22); }
.secondary-button { border: 1px solid var(--line); background: white; color: var(--text); }
.mobile-menu { display: none; }

.content { flex: 1 0 auto; width: min(1600px, 100%); margin: 0 auto; padding: 30px 34px 50px; }
.page-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 25px; }
.page-heading .eyebrow { margin-bottom: 7px; color: #8a98a1; font-size: .875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1.25px; }
.page-heading h1 { margin: 0; color: var(--navy); font-size: clamp(1.6875rem, 3vw, 2.1875rem); line-height: 1.12; letter-spacing: -1.25px; }
.page-heading .accent { color: var(--lime); }
.page-heading p { margin: 8px 0 0; color: var(--muted); font-size: 1rem; }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin-bottom: 16px; }
.metric-card { display: flex; align-items: flex-start; gap: 13px; min-height: 136px; padding: 21px 18px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.metric-icon { display: grid; place-items: center; flex: 0 0 auto; width: 38px; height: 38px; border-radius: 11px; font-size: 1.125rem; font-weight: 800; }
.metric-icon.green { background: #ecfbdc; color: #61a918; }
.metric-icon.blue { background: #e5f2f8; color: #1b759d; }
.metric-icon.orange { background: #fff1df; color: #e08c24; }
.metric-icon.violet { background: #efedff; color: var(--violet); }
.metric-card > div:last-child { min-width: 0; }
.metric-card span { display: block; margin-top: 1px; color: var(--muted); font-size: .875rem; font-weight: 600; }
.metric-card strong { display: block; margin: 5px 0 7px; color: var(--navy); font-size: 1.8125rem; line-height: 1; letter-spacing: -1px; }
.metric-card small { color: #7b8b94; font-size: .8125rem; }
.metric-card small.positive { color: #5ead17; font-weight: 700; }
.metric-card small em { color: #9aa6ac; font-style: normal; font-weight: 400; }
.warning-text { color: #df8531 !important; }
.dot { display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; }
.blue-dot { background: #3fa4ce; }.violet-dot { background: var(--violet); }

.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(320px, .9fr); gap: 16px; margin-bottom: 16px; }
.panel { border: 1px solid var(--line); border-radius: var(--radius); background: white; box-shadow: var(--shadow); }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 21px 22px 14px; }
.panel-heading h2 { margin: 0; color: var(--navy); font-size: 1.0625rem; letter-spacing: -.2px; }
.panel-heading p { margin: 5px 0 0; color: var(--muted); font-size: .875rem; }
.text-button, .more-button { border: 0; background: transparent; color: #487082; font-size: .875rem; font-weight: 700; }
.more-button { color: #89969e; font-size: 1rem; }
.workload-list { display: grid; gap: 19px; padding: 11px 22px 24px; }
.workload-row { display: flex; align-items: center; gap: 12px; }
.workload-row > div { flex: 1; min-width: 0; }
.workload-row > div > span { display: flex; justify-content: space-between; margin-bottom: 8px; }
.workload-row b { font-size: .875rem; }.workload-row em { color: var(--muted); font-size: .8125rem; font-style: normal; }
.avatar-purple { background: #e9e4ff; color: #6650c1; }.avatar-blue { background: #dceff8; color: #14739d; }.avatar-pink { background: #ffe4ef; color: #ad4671; }
.bar { height: 5px; overflow: hidden; border-radius: 8px; background: #edf1f3; }.bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--lime), #61c638); }
.status-content { display: flex; align-items: center; justify-content: center; gap: 28px; padding: 5px 22px 26px; }
.donut { display: grid; place-items: center; flex: 0 0 auto; width: 112px; height: 112px; border-radius: 50%; background: conic-gradient(var(--navy) 0 33%, #49a9c3 33% 61%, var(--violet) 61% 72%, var(--lime) 72% 100%); }
.donut::before { content: ""; position: absolute; width: 74px; height: 74px; border-radius: 50%; background: white; }
.donut div { position: relative; z-index: 1; text-align: center; }.donut strong { display: block; color: var(--navy); font-size: 1.4375rem; }.donut span { color: var(--muted); font-size: .75rem; }
.status-content ul { display: grid; gap: 10px; min-width: 150px; margin: 0; padding: 0; list-style: none; }
.status-content li { display: grid; grid-template-columns: 8px 1fr auto; align-items: center; gap: 7px; color: var(--muted); font-size: .8125rem; }.status-content li b { color: var(--text); font-size: .875rem; }
.legend { width: 7px; height: 7px; border-radius: 50%; }.legend.backlog { background: var(--navy); }.legend.doing { background: #49a9c3; }.legend.review { background: var(--violet); }.legend.done { background: var(--lime); }

.tasks-panel { overflow: hidden; }
.task-table { min-width: 760px; }
.tasks-panel { overflow-x: auto; }
.task-row { display: grid; grid-template-columns: 2fr 1.2fr 1fr .75fr .85fr; align-items: center; gap: 12px; min-height: 55px; padding: 0 22px; border-top: 1px solid #edf1f3; font-size: .875rem; }
.task-row.header { min-height: 35px; border-top: 0; background: #f8fafb; color: #8b989f; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; }
.task-row > span { display: flex; align-items: center; gap: 8px; min-width: 0; }.task-row b { overflow: hidden; color: #27434f; font-size: .875rem; text-overflow: ellipsis; white-space: nowrap; }
.priority { flex: 0 0 auto; width: 3px; height: 26px; border-radius: 3px; }.priority.high { background: var(--danger); }.priority.medium { background: var(--warning); }.priority.low { background: #51a9cb; }
.client-logo { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; background: #ece8ff; color: #6653c0; font-size: .75rem; font-weight: 800; }.green-client { background: #eaf6dc; color: #629b2b; }.orange-client { background: #fff0dd; color: #b97a2c; }
.avatar.mini { width: 23px; height: 23px; font-size: .75rem; }.date-danger { color: var(--danger); font-weight: 700; }
.badge { padding: 5px 8px; border-radius: 14px; font-size: .75rem; font-style: normal; font-weight: 700; }.review-badge { background: #efedff; color: #6654bd; }.doing-badge { background: #e5f3f8; color: #24779a; }.backlog-badge { background: #eef1f3; color: #61747e; }

@media (max-width: 1050px) {
  .metric-grid { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .app-shell { display: block; }.sidebar { transform: translateX(-100%); }.main { width: 100%; }.mobile-menu { display: block; }
  .topbar { height: 64px; padding: 0 16px; }.search { flex: 1; width: auto; }.top-actions .icon-button { display: none; }.primary-button { padding: 0 12px; }
  .content { padding: 22px 16px 38px; }.page-heading { align-items: flex-start; }.page-heading .secondary-button { display: none; }
  .metric-grid { grid-template-columns: 1fr 1fr; gap: 10px; }.metric-card { min-height: 124px; padding: 16px 13px; }.metric-card strong { font-size: 1.5625rem; }.metric-icon { width: 34px; height: 34px; }
  .status-content { flex-wrap: wrap; }.panel-heading { padding-inline: 16px; }.workload-list { padding-inline: 16px; }
}
@media (max-width: 470px) {
  .top-actions .primary-button { font-size: 0; }.top-actions .primary-button::after { content: "+"; font-size: 1.25rem; }
  .metric-grid { grid-template-columns: 1fr; }.metric-card { min-height: auto; }.page-heading h1 { font-size: 1.6875rem; }
}

/* Application surfaces */
a { color: inherit; }
.button-link { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.metric-card { color: inherit; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.metric-card:hover { transform: translateY(-2px); border-color: #cad8df; box-shadow: 0 12px 32px rgba(13,53,72,.1); }
.user-card { color: inherit; text-decoration: none; }
.sidebar-backdrop { display: none; }
.app-footer { display: flex; justify-content: space-between; width: 100%; max-width: 1600px; margin: auto auto 0; padding: 0 34px 28px; color: #89979f; font-size: .875rem; }
.alert { padding: 12px 14px; border-radius: 10px; font-size: .875rem; line-height: 1.45; }
.alert.success { border: 1px solid #cdecae; background: #f0fbe5; color: #4d7d1d; }
.alert.error { border: 1px solid #f3c7c7; background: #fff0f0; color: #a33e3e; }
.alert.floating { position: fixed; left: 50%; bottom: clamp(4.5rem,12vh,7rem); z-index: 70; display: flex; justify-content: space-between; align-items: center; gap: 18px; width: min(34rem,calc(100vw - 2rem)); margin: 0; box-shadow: 0 16px 42px rgba(2,26,38,.22); transform: translateX(-50%); animation: alert-in .2s ease-out; }
.alert.floating button { flex: 0 0 auto; padding: 2px 4px; border: 0; background: transparent; color: inherit; font-size: 1.125rem; cursor: pointer; }
@keyframes alert-in { from { opacity: 0; transform: translate(-50%,12px); } to { opacity: 1; transform: translate(-50%,0); } }
.empty-compact { padding: 16px 0; color: var(--muted); font-size: .875rem; text-align: center; }

/* Authentication */
.auth-body { background: white; }
.auth-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(440px, .95fr) minmax(460px, 1.05fr); }
.auth-brand-panel { position: relative; display: grid; place-items: center; overflow: hidden; padding: 60px; background: var(--navy-deep); color: white; }
.auth-brand-content { position: relative; z-index: 2; width: min(510px, 100%); }
.auth-brand { padding: 0; margin-bottom: 72px; }
.auth-brand-full { width: min(360px,100%); }
.auth-brand-full img { display: block; width: 100%; height: auto; }
.auth-kicker { color: var(--lime) !important; font-size: .875rem !important; font-weight: 800; text-transform: uppercase; letter-spacing: 2px; }
.auth-brand-content h1 { margin: 18px 0 22px; font-size: clamp(2.625rem, 5vw, 4.25rem); line-height: .98; letter-spacing: -3px; }
.auth-brand-content h1 em { color: var(--lime); font-style: normal; }
.auth-brand-content > p { max-width: 490px; color: #b9cbd4; font-size: 1.0625rem; line-height: 1.7; }
.auth-feature-list { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 42px; color: #d1dee4; font-size: .875rem; }.auth-feature-list span::first-letter { color: var(--lime); }
.auth-orb { position: absolute; border: 1px solid rgba(141,240,0,.16); border-radius: 50%; }.auth-orb.one { width: 420px; height: 420px; right: -220px; bottom: -120px; }.auth-orb.two { width: 240px; height: 240px; right: -70px; bottom: -15px; background: rgba(141,240,0,.035); }
.auth-form-panel { display: grid; place-items: center; padding: 50px; background: #fbfcfd; }
.auth-card { width: min(420px, 100%); }
.auth-card .eyebrow { margin: 0 0 12px; color: #77909d; font-size: .875rem; font-weight: 800; letter-spacing: 1.5px; }
.auth-card h2 { margin: 0; color: var(--navy); font-size: 1.9375rem; letter-spacing: -1px; }
.auth-card > p:not(.eyebrow):not(.auth-help) { margin: 10px 0 25px; color: var(--muted); font-size: 1rem; line-height: 1.6; }
.auth-card .alert { margin-bottom: 18px; }
.mobile-auth-brand { display: none; }
.auth-help { margin-top: 20px; color: #87959d; font-size: .875rem; line-height: 1.6; text-align: center; }

/* Forms */
.stack-form, .form-grid { display: grid; gap: 17px; }
.form-grid { grid-template-columns: 1fr 1fr; }
.stack-form label, .form-grid label { display: grid; gap: 7px; color: #405966; font-size: .875rem; font-weight: 750; }
.stack-form input, .stack-form select, .stack-form textarea, .form-grid input, .form-grid select, .form-grid textarea, .filter-form input, .filter-form select, .quick-status select { width: 100%; min-height: 43px; padding: 0 12px; border: 1px solid #d9e3e8; border-radius: 9px; outline: 0; background: white; color: var(--text); font-size: .875rem; font-weight: 450; transition: border .15s, box-shadow .15s; }
.stack-form textarea, .form-grid textarea { min-height: 96px; padding-top: 11px; resize: vertical; line-height: 1.55; }
.stack-form input:focus, .form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus, .filter-form input:focus, .filter-form select:focus { border-color: #8dc958; box-shadow: 0 0 0 3px rgba(141,240,0,.13); }
.stack-form label small, .form-grid label small { color: #8d9ba2; font-size: .8125rem; font-weight: 450; }
.full { width: 100%; }.full-span { grid-column: 1 / -1; }
.checkbox { display: flex !important; grid-template-columns: auto 1fr; align-items: center; justify-content: flex-start; gap: 9px !important; min-height: 34px; }
.checkbox input { width: 16px; min-height: 16px; accent-color: var(--navy); }
.form-actions { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 10px; padding-top: 8px; }
.danger-button { min-height: 40px; padding: 0 14px; border: 0; border-radius: 9px; background: #fff0f0; color: #b84848; font-size: .875rem; font-weight: 750; }

/* Dashboard */
.status-summary { display: grid; grid-template-columns: .65fr 1.35fr; align-items: center; gap: 25px; padding: 12px 22px 25px; }
.status-total { display: grid; place-items: center; min-height: 112px; border-radius: 13px; background: var(--navy); color: white; text-align: center; }.status-total strong { display: block; color: var(--lime); font-size: 2.125rem; line-height: 1; }.status-total span { font-size: .8125rem; }
.status-bars { display: grid; gap: 13px; }.status-bars a { color: inherit; text-decoration: none; }.status-bars a > span { display: grid; grid-template-columns: 8px 1fr auto; align-items: center; gap: 7px; margin-bottom: 5px; color: var(--muted); font-size: .8125rem; }.status-bars a > span b { color: var(--text); }.status-bars a > div { height: 4px; overflow: hidden; border-radius: 5px; background: #edf1f3; }.status-bars a > div i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #70c82a, var(--lime)); }
.legend.todo { background: #92a1a9; }.legend.in_progress { background: #49a9c3; }.legend.completed { background: var(--lime); }
.lower-grid { grid-template-columns: minmax(0, 1.3fr) minmax(320px, .9fr); }
.compact-list { display: grid; }.compact-task { display: grid; grid-template-columns: 4px 1fr auto; align-items: center; gap: 12px; min-height: 62px; padding: 9px 22px; border-top: 1px solid #edf1f3; color: inherit; text-decoration: none; }.compact-task:hover { background: #f9fbfc; }.compact-task .priority { height: 30px; }.compact-task b, .compact-task small { display: block; }.compact-task b { color: #284550; font-size: .875rem; }.compact-task small { margin-top: 5px; color: var(--muted); font-size: .75rem; }.compact-task em { color: #617680; font-size: .8125rem; font-style: normal; font-weight: 650; }
.activity-list { display: grid; padding: 4px 22px 19px; }.activity-item { display: grid; grid-template-columns: 8px 1fr; gap: 10px; padding: 10px 0; }.activity-dot { width: 7px; height: 7px; margin-top: 4px; border: 2px solid #9adb50; border-radius: 50%; }.activity-item b { display: block; color: #35515d; font-size: .8125rem; line-height: 1.35; }.activity-item small { display: block; margin-top: 4px; color: #93a0a7; font-size: .75rem; }

/* Toolbars and tables */
.toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 15px; padding: 11px; }
.filter-form { display: flex; align-items: center; flex: 1; gap: 8px; }.filter-form select { width: auto; min-width: 145px; min-height: 36px; font-size: .875rem; }.filter-search { display: flex; align-items: center; width: min(240px, 28vw); gap: 6px; padding-left: 10px; border: 1px solid #d9e3e8; border-radius: 9px; color: #87969e; }.filter-search input { min-height: 34px; padding-left: 0; border: 0; }.filter-search input:focus { box-shadow: none; }.filter-form .secondary-button { min-height: 36px; }
.view-switch { display: flex; padding: 3px; border-radius: 8px; background: #edf2f4; }.view-switch a { padding: 7px 9px; border-radius: 6px; color: #788a93; font-size: .8125rem; font-weight: 700; text-decoration: none; }.view-switch a.active { background: white; color: var(--navy); box-shadow: 0 2px 6px rgba(11,48,65,.08); }
.data-table-wrap { overflow-x: auto; }.data-table { width: 100%; min-width: 820px; border-collapse: collapse; }.data-table th { height: 39px; padding: 0 17px; background: #f8fafb; color: #87969e; font-size: .75rem; text-align: left; text-transform: uppercase; letter-spacing: .6px; }.data-table td { height: 62px; padding: 8px 17px; border-top: 1px solid #edf1f3; color: #4f6570; font-size: .875rem; }.data-table tr:hover td { background: #fbfcfd; }.task-title-cell { display: flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; }.task-title-cell .priority { height: 32px; }.task-title-cell b, .task-title-cell small { display: block; }.task-title-cell b { max-width: 330px; overflow: hidden; color: #294752; font-size: .875rem; text-overflow: ellipsis; white-space: nowrap; }.task-title-cell small { margin-top: 4px; color: #96a2a8; font-size: .75rem; }.person { display: inline-flex; align-items: center; gap: 7px; }.muted { color: #96a2a8; }.row-action, .text-button { color: #3d6a7e; text-decoration: none; font-weight: 700; }.badge.status-backlog { background: #eef1f3; color: #61747e; }.badge.status-todo { background: #f1f3f4; color: #60737e; }.badge.status-in_progress { background: #e5f3f8; color: #24779a; }.badge.status-review { background: #efedff; color: #6654bd; }.badge.status-completed { background: #ecf8de; color: #538d1f; }

/* Kanban */
.kanban { display: grid; grid-template-columns: repeat(5, minmax(238px, 1fr)); align-items: start; gap: 12px; overflow-x: auto; padding-bottom: 14px; }.kanban-column { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #eef3f5; transition: border-color .18s ease, background .18s ease, box-shadow .18s ease; }.kanban-column > header { display: flex; align-items: center; justify-content: space-between; padding: 15px 13px 12px; }.kanban-column > header span { display: flex; align-items: center; gap: 7px; color: #49616c; font-size: .875rem; font-weight: 800; text-transform: uppercase; letter-spacing: .35px; }.kanban-column > header b { display: grid; place-items: center; min-width: 22px; height: 22px; border-radius: 8px; background: #dde6ea; color: #60747d; font-size: .8125rem; }.kanban-cards { display: grid; gap: 9px; min-height: 108px; padding: 0 8px 9px; }.kanban-card { padding: 13px; border: 1px solid #e1e8eb; border-radius: 11px; background: white; box-shadow: 0 3px 10px rgba(10,48,66,.04); cursor: grab; transition: opacity .16s ease, transform .16s ease, box-shadow .16s ease; }.kanban-card:active { cursor: grabbing; }.kanban-card-top, .kanban-card footer { display: flex; align-items: center; justify-content: space-between; }.kanban-card-top a { color: #91a0a7; text-decoration: none; }.priority-label { padding: 4px 6px; border-radius: 6px; font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; }.priority-label.low { background: #e8f3f7; color: #3483a3; }.priority-label.medium { background: #fff5df; color: #b98024; }.priority-label.high { background: #fff0e5; color: #cb7034; }.priority-label.urgent { background: #ffebeb; color: #c64b4b; }.kanban-card h3 { margin: 11px 0 7px; font-size: .875rem; line-height: 1.45; }.kanban-card h3 a { color: #294752; text-decoration: none; }.kanban-card p { margin: 0 0 14px; color: #87969e; font-size: .8125rem; }.kanban-card footer { min-height: 25px; color: #73868f; font-size: .75rem; }.quick-status { margin-top: 10px; }.quick-status select { min-height: 30px; padding: 0 7px; border-color: #e5eaed; background: #f8fafb; color: #6d7f88; font-size: .75rem; }.kanban-empty { display: grid; place-items: center; min-height: 88px; border: 1px dashed #ced9de; border-radius: 10px; color: #96a4ab; font-size: .8125rem; }

/* Modals */
.modal-layer { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 20px; }.modal-backdrop { position: absolute; inset: 0; background: rgba(4,32,45,.62); backdrop-filter: blur(3px); }.modal-card { position: relative; z-index: 1; width: min(560px, 100%); max-height: calc(100vh - 40px); overflow-y: auto; border-radius: 17px; background: white; box-shadow: 0 30px 90px rgba(2,26,38,.3); }.modal-card.wide { width: min(700px, 100%); }.modal-card > header { display: flex; justify-content: space-between; align-items: flex-start; padding: 22px 24px 15px; border-bottom: 1px solid #edf1f3; }.modal-card > header .eyebrow { margin: 0 0 5px; color: #86969e; font-size: .75rem; font-weight: 800; letter-spacing: 1.2px; }.modal-card > header h2 { margin: 0; color: var(--navy); font-size: 1.25rem; }.modal-close { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; background: #f0f3f5; color: #71838c; font-size: 1.25rem; text-decoration: none; }.modal-card .form-grid { padding: 22px 24px 24px; }
.confirm-open { overflow: hidden; }
.confirm-layer { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; }
.confirm-layer[hidden] { display: none; }
.confirm-backdrop { position: absolute; inset: 0; width: 100%; border: 0; background: rgba(3,27,38,.7); backdrop-filter: blur(4px); }
.confirm-card { position: relative; z-index: 1; display: grid; grid-template-columns: 48px 1fr; gap: 4px 16px; width: min(440px,100%); padding: 24px; border: 1px solid #e1e8eb; border-radius: 16px; background: #fff; box-shadow: 0 28px 80px rgba(2,26,38,.35); animation: confirm-in .18s ease-out; }
.confirm-icon { display: grid; grid-row: 1; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: #fff0f0; color: #c84b4b; font-size: 1.35rem; font-weight: 850; }
.confirm-copy h2 { margin: 0 0 7px; color: var(--navy); font-size: 1.125rem; }
.confirm-copy p { margin: 0; color: var(--muted); font-size: .875rem; line-height: 1.55; }
.confirm-actions { grid-column: 1/-1; display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; }
@keyframes confirm-in { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }

/* Clients and team */
.client-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 15px; }.client-card { padding: 19px; }.client-card.inactive, .team-card.inactive { opacity: .62; }.client-card header { display: flex; justify-content: space-between; align-items: flex-start; }.client-monogram { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 12px; font-size: .875rem; font-weight: 850; }.tone-1 { background: #e8e5ff; color: #6753c3; }.tone-2 { background: #e2f3f8; color: #287b99; }.tone-3 { background: #eaf7dd; color: #59972a; }.tone-4 { background: #fff0e2; color: #bb752d; }.client-state { padding: 5px 8px; border-radius: 12px; background: #edf8e1; color: #59912b; font-size: .75rem; font-weight: 700; }.client-card.inactive .client-state { background: #eff2f3; color: #7b8b93; }.client-card h2 { margin: 15px 0 4px; color: var(--navy); font-size: 1.0625rem; }.client-card > p { margin: 0; color: var(--muted); font-size: .8125rem; }.client-card dl { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 19px 0; }.client-card dl div { padding: 10px; border-radius: 9px; background: #f6f9fa; }.client-card dt { color: #85959d; font-size: .75rem; }.client-card dd { margin: 5px 0 0; color: var(--navy); font-size: 1.125rem; font-weight: 800; }.client-contact { display: grid; gap: 5px; min-height: 38px; color: #617984; font-size: .8125rem; }.client-contact a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.client-card footer { display: flex; justify-content: space-between; margin: 14px -19px -19px; padding: 12px 19px; border-top: 1px solid #edf1f3; }.client-card footer a { color: #3b6c80; font-size: .8125rem; font-weight: 750; text-decoration: none; }
.team-grid { display: grid; gap: 12px; }.team-card { display: grid; grid-template-columns: 52px 1fr auto; align-items: center; gap: 15px; padding: 18px 20px; }.avatar.large { width: 48px; height: 48px; font-size: 1rem; }.avatar.huge { width: 76px; height: 76px; font-size: 1.25rem; }.avatar-tone-1 { background: #e9e5ff; color: #6551be; }.avatar-tone-2 { background: #dff1f8; color: #247998; }.avatar-tone-3 { background: #e9f7dc; color: #57952a; }.avatar-tone-4 { background: #ffe9ef; color: #b34e70; }.avatar.neutral { background: #edf1f3; color: #7d8c94; }.team-card h2 { margin: 0 0 4px; color: var(--navy); font-size: 1rem; }.team-card h2 small { padding: 3px 5px; border-radius: 5px; background: #edf8e1; color: #5b922b; font-size: .75rem; text-transform: uppercase; }.team-card p { margin: 0 0 9px; color: var(--muted); font-size: .8125rem; }.role-badge, .member-state { display: inline-block; margin-right: 6px; padding: 4px 7px; border-radius: 10px; background: #e9f3f7; color: #34728d; font-size: .75rem; font-weight: 750; }.member-state { background: #edf8e1; color: #59912b; }.member-state.off { background: #eff2f3; color: #7e8c93; }.team-card-side { display: grid; grid-template-columns: auto; justify-items: end; }.team-card-side strong { color: var(--navy); font-size: 1.1875rem; }.team-card-side small { color: var(--muted); font-size: .75rem; }.team-card-side a { margin-top: 8px; color: #3d6a7e; font-size: .8125rem; font-weight: 750; text-decoration: none; }

/* Account and empty states */
.account-grid { display: grid; grid-template-columns: minmax(260px,.65fr) minmax(380px,1.35fr); gap: 16px; }.profile-card { display: flex; flex-direction: column; align-items: center; padding: 32px; text-align: center; }.profile-card h2 { margin: 16px 0 5px; color: var(--navy); font-size: 1.125rem; }.profile-card p { margin: 0 0 13px; color: var(--muted); font-size: .875rem; }.profile-card .secondary-button { width: 100%; margin-top: 30px; }.account-form { overflow: hidden; }.padded-form { padding: 10px 22px 24px; }.padded-form button { justify-self: start; }
.empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 330px; padding: 40px; text-align: center; }.empty-state > span { display: grid; place-items: center; min-width: 52px; height: 52px; padding: 0 10px; border-radius: 15px; background: #eaf8dc; color: #58972a; font-size: 1.125rem; font-weight: 850; }.empty-state h3 { margin: 16px 0 6px; color: var(--navy); font-size: 1rem; }.empty-state p { margin: 0 0 18px; color: var(--muted); font-size: .875rem; }.empty-state.small { min-height: 180px; }.empty-state.small > span { min-width: 40px; height: 40px; border-radius: 11px; font-size: 1rem; }

@media (max-width: 1150px) {
  .client-grid { grid-template-columns: repeat(2, 1fr); }
  .toolbar { align-items: stretch; flex-direction: column; }.filter-form { flex-wrap: wrap; }.filter-search { width: 100%; }.view-switch { align-self: flex-end; }
}
@media (max-width: 850px) {
  .auth-layout { grid-template-columns: 1fr; }.auth-brand-panel { display: none; }.auth-form-panel { min-height: 100vh; padding: 28px 20px; }.mobile-auth-brand { display: block; width: min(220px,100%); margin-bottom: 46px; padding: 10px 12px; border-radius: 10px; background: var(--navy-deep); }.mobile-auth-brand img { display: block; width: 100%; height: auto; }
  .lower-grid, .account-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .sidebar { transition: transform .25s ease; }.sidebar.open { transform: translateX(0); }.sidebar-backdrop.open { position: fixed; z-index: 19; inset: 0; display: block; border: 0; background: rgba(4,32,45,.45); }
  .app-footer { padding-inline: 16px; }.page-heading { flex-wrap: wrap; }.page-heading > .primary-button { width: 100%; }
  .filter-form select { flex: 1; min-width: 140px; }.client-grid { grid-template-columns: 1fr; }.form-grid { grid-template-columns: 1fr; }.full-span { grid-column: 1; }.form-actions { grid-template-columns: 1fr 1fr; }.form-actions > span { display: none; }.form-actions .danger-button { grid-column: 1 / -1; order: 3; }.modal-card .form-grid { padding: 18px; }
  .team-card { grid-template-columns: 45px 1fr; }.team-card-side { grid-column: 2; grid-template-columns: auto 1fr auto; align-items: center; justify-items: start; gap: 6px; }.team-card-side a { margin: 0 0 0 auto; }
}
@media (max-width: 520px) {
  .auth-card h2 { font-size: 1.625rem; }.auth-form-panel { align-items: start; padding-top: 28px; }
  .status-summary { grid-template-columns: 1fr; }.status-total { min-height: 88px; }.filter-form select, .filter-form .secondary-button { width: 100%; flex: auto; }.view-switch { align-self: stretch; }.view-switch a { flex: 1; text-align: center; }
  .form-actions { grid-template-columns: 1fr; }.form-actions .button-link, .form-actions button { width: 100%; }.form-actions .danger-button { grid-column: 1; }.team-card { padding: 15px; }
}

/* Commercial CRM */
.heading-actions { display:flex; gap:9px; }
.subnav { display:flex; align-items:center; gap:4px; overflow-x:auto; margin:-6px 0 18px; padding:6px; scrollbar-width:thin; }
.subnav a { flex:0 0 auto; padding:10px 14px; border-radius:9px; color:#6e818b; font-size:.875rem; font-weight:750; text-decoration:none; }
.subnav a:hover { background:#f4f7f8; color:var(--navy); }
.subnav a.active { background:var(--navy); color:white; box-shadow:0 5px 14px rgba(7,59,85,.16); }
.commercial-period,.goals-header { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:13px; }
.commercial-period > div,.goals-header > div { display:grid; gap:3px; }.commercial-period strong,.goals-header h2 { margin:0; color:var(--navy); font-size:1rem; }.commercial-period span,.goals-header p { margin:0; color:var(--muted); font-size:.8125rem; }
.commercial-period input,.goals-header input { min-height:36px; padding:0 10px; border:1px solid var(--line); border-radius:9px; background:white; color:var(--text); font-size:.875rem; }
.commercial-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.commercial-kpi { position:relative; min-height:112px; overflow:hidden; padding:18px; border:1px solid var(--line); border-radius:14px; background:white; box-shadow:var(--shadow); }
.commercial-kpi::after { content:""; position:absolute; right:-15px; bottom:-28px; width:68px; height:68px; border:13px solid #f0f4f5; border-radius:50%; }
.commercial-kpi.highlight { background:var(--navy); border-color:var(--navy); }.commercial-kpi.highlight::after { border-color:rgba(141,240,0,.11); }
.commercial-kpi span { display:block; color:#70828c; font-size:.8125rem; font-weight:700; text-transform:uppercase; letter-spacing:.45px; }.commercial-kpi strong { position:relative; z-index:1; display:block; margin:10px 0 7px; color:var(--navy); font-size:1.375rem; letter-spacing:-.6px; }.commercial-kpi small { position:relative; z-index:1; color:#93a0a7; font-size:.75rem; }.commercial-kpi.highlight span,.commercial-kpi.highlight small { color:#b7ccd5; }.commercial-kpi.highlight strong { color:var(--lime); }
.commercial-dashboard-grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr); gap:16px; }
.funnel-stage-list { display:grid; gap:10px; padding:4px 22px 23px; }.funnel-stage-list a { display:grid; grid-template-columns:minmax(150px,.8fr) minmax(90px,1.2fr) 24px; align-items:center; gap:12px; color:inherit; font-size:.8125rem; text-decoration:none; }.funnel-stage-list a > span { display:flex; align-items:center; gap:7px; }.funnel-stage-list a > b { color:var(--navy); text-align:right; }.commercial-bar { height:6px; overflow:hidden; border-radius:7px; background:#edf1f3; }.commercial-bar i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#5f99aa,var(--lime)); }
.commercial-stage-dot { display:inline-block; flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:#83949c; }.stage-mapped { background:#83949c!important; }.stage-qualified { background:#4c94ad!important; }.stage-contacted { background:#36a3b3!important; }.stage-meeting { background:#7168d4!important; }.stage-diagnosis { background:#9a62c2!important; }.stage-proposal { background:#e19a34!important; }.stage-negotiation { background:#e06f45!important; }.stage-won { background:#72bf2c!important; }.stage-lost { background:#d25858!important; }
.followup-list { display:grid; padding:0 20px 18px; }.followup-list > a { display:grid; grid-template-columns:62px 1fr; align-items:center; gap:11px; padding:10px 0; border-top:1px solid #edf1f3; color:inherit; text-decoration:none; }.followup-list > a:first-child { border-top:0; }.followup-date { display:grid; place-items:center; min-height:28px; border-radius:8px; background:#eef5f7; color:#35718a; font-size:.75rem; font-weight:750; }.followup-date.overdue { background:#fff0e7; color:#bd6533; }.followup-list b,.followup-list small { display:block; }.followup-list b { color:#344f5b; font-size:.8125rem; line-height:1.35; }.followup-list small { margin-top:4px; color:#8a989f; font-size:.75rem; }
.toolbar-count { padding-right:9px; color:var(--muted); font-size:.8125rem; }
.commercial-kanban { display:grid; grid-template-columns:repeat(9,minmax(245px,1fr)); align-items:start; gap:10px; overflow-x:auto; padding-bottom:15px; }.commercial-column { overflow:hidden; border:1px solid var(--line); border-radius:13px; background:#edf2f4; }.commercial-column > header { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:14px 12px 11px; }.commercial-column > header span { display:flex; align-items:center; gap:6px; color:#506772; font-size:.75rem; font-weight:800; text-transform:uppercase; letter-spacing:.3px; }.commercial-column > header b { display:grid; place-items:center; min-width:20px; height:20px; border-radius:7px; background:#dbe4e8; color:#5d737d; font-size:.75rem; }.commercial-column > div { display:grid; gap:8px; padding:0 7px 8px; }
.opportunity-card { padding:13px; border:1px solid #e1e7ea; border-radius:10px; background:white; box-shadow:0 3px 9px rgba(10,48,66,.04); }.opportunity-top,.opportunity-card footer { display:flex; align-items:center; justify-content:space-between; gap:8px; }.opportunity-top a { color:#8c9aa1; text-decoration:none; }.potential { display:inline-flex; align-items:center; padding:4px 7px; border-radius:10px; font-size:.75rem; font-weight:800; text-transform:uppercase; }.potential-low { background:#edf2f4;color:#667b85; }.potential-medium { background:#fff2dd;color:#af7320; }.potential-high { background:#ffe8e8;color:#ba4a4a; }.opportunity-card h3 { margin:11px 0 4px; color:var(--navy); font-size:.875rem; line-height:1.35; }.opportunity-card > p { margin:0; color:#819099; font-size:.75rem; }.opportunity-value { display:grid; gap:3px; margin:14px 0 10px; }.opportunity-value strong { color:#2b4e5d; font-size:1rem; }.opportunity-value small { color:#8c9aa1; font-size:.75rem; }.next-action { display:grid; gap:3px; padding:9px; border-radius:8px; background:#f3f7f8; }.next-action b { color:#78909a; font-size:.75rem; text-transform:uppercase; }.next-action span { color:#405b66; font-size:.75rem; line-height:1.35; }.next-action small { color:#83939b; font-size:.75rem; }.next-action.overdue { background:#fff3eb; }.opportunity-card footer { margin-top:11px; color:#71858f; font-size:.75rem; }.opportunity-card footer > span { display:flex; align-items:center; gap:4px; }.opportunity-card footer a { color:#5c9827; font-weight:700; text-decoration:none; }
.commercial-table { min-width:1000px; }.lead-cell { display:grid; gap:4px; color:inherit; text-decoration:none; }.lead-cell b { color:#294752; }.lead-cell small,.table-subline { display:block; margin-top:3px; color:#8e9ba2; font-size:.75rem; }.stage-pill { display:inline-flex; padding:5px 8px; border-radius:12px; background:#eef2f4; color:#617681; font-size:.75rem; font-weight:750; white-space:nowrap; }.stage-pill.stage-won { color:#508d20;background:#edf8e3!important; }.stage-pill.stage-lost { color:#b54b4b;background:#fff0f0!important; }.stage-pill.stage-proposal,.stage-pill.stage-negotiation { color:#a96827;background:#fff2e2!important; }
.modal-card.xwide { width:min(880px,100%); }.form-section-title { margin:5px 0 -3px; padding:0 0 8px; border-bottom:1px solid #e9eef0; color:var(--navy); font-size:.875rem; }.prospect-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
.row-actions { display:flex; align-items:center; gap:10px; white-space:nowrap; }.row-actions form { margin:0; }.row-action.as-button { padding:0; border:0; background:transparent; cursor:pointer; }.success-link { color:#60962e; }

/* Commercial goals and routine */
.goals-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr); gap:16px; margin-bottom:16px; }.goal-list { display:grid; gap:18px; padding:5px 22px 24px; }.goal-row { display:grid; grid-template-columns:minmax(180px,.9fr) minmax(100px,1.1fr) 38px; align-items:center; gap:14px; }.goal-row > div:first-child { display:grid; gap:4px; }.goal-row span { color:#667c87; font-size:.8125rem; }.goal-row b { color:var(--navy); font-size:.875rem; }.goal-row b small { color:#93a0a7; font-size:.75rem; font-weight:500; }.goal-row em { color:#5b8e2c; font-size:.8125rem; font-style:normal;font-weight:800;text-align:right; }.goal-bar { height:7px; overflow:hidden; border-radius:8px; background:#eaf0f2; }.goal-bar i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#4f8ca2,var(--lime)); }.compact-form { padding:4px 22px 24px; }.owner-result-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; padding:0 22px 22px; }.owner-result-grid > div { display:grid; grid-template-columns:38px 1fr; align-items:center; gap:2px 9px; padding:13px; border-radius:10px; background:#f5f8f9; }.owner-result-grid .avatar { grid-row:1/4; }.owner-result-grid b { color:var(--navy);font-size:.875rem; }.owner-result-grid span:not(.avatar) { color:#83939b;font-size:.75rem; }.owner-result-grid strong { color:#5d962a;font-size:.875rem; }
.routine-week { display:grid; grid-template-columns:minmax(230px,.8fr) minmax(120px,1.2fr) 38px; align-items:center; gap:18px; margin-bottom:14px; padding:15px 18px; }.routine-week > div:first-child { display:grid;gap:3px; }.routine-week span { color:#83939b;font-size:.75rem; }.routine-week strong { color:var(--navy);font-size:.875rem; }.routine-week > b { color:#5b922a;font-size:.875rem; }.routine-table-wrap { overflow-x:auto; }.routine-table { min-width:930px; }.routine-table tr.routine-done td { background:#f3faec;color:#658051; }.routine-check-form { display:grid; grid-template-columns:95px minmax(160px,1fr) auto; align-items:center;gap:7px; }.routine-check-form > input[type=text],.routine-check-form > input:not([type]) { min-height:32px;padding:0 9px;border:1px solid #dce5e9;border-radius:7px;font-size:.8125rem; }.routine-check-form .secondary-button { min-height:32px; }.routine-checkbox { display:flex;align-items:center;gap:6px;font-size:.75rem;font-weight:700; }.routine-checkbox input { accent-color:#69b829; }

/* Client CRM */
.client-overview { display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px; }.client-overview > div { display:grid;gap:7px;padding:16px 18px;border:1px solid var(--line);border-radius:13px;background:white;box-shadow:var(--shadow); }.client-overview span { color:#778a94;font-size:.8125rem; }.client-overview strong { color:var(--navy);font-size:1.25rem; }.client-card h2 a { color:inherit;text-decoration:none; }.client-card dd.money-value { font-size:1rem;letter-spacing:-.2px; }.client-contract-line { display:flex;justify-content:space-between;gap:10px;margin:-7px 0 13px;padding:8px 10px;border-radius:8px;background:#f6f9fa;font-size:.75rem; }.client-contract-line span { color:#86969e; }.client-contract-line b { color:#526974; }.client-logo-image { display:grid;place-items:center;overflow:hidden;width:7.5rem;height:3.75rem;border:1px solid #e3e9ec;border-radius:.65rem;background:white; }.client-logo-image img { display:block;width:100%;height:100%;padding:.15rem;object-fit:contain;object-position:center; }.logo-upload { display:flex!important;grid-template-columns:160px 1fr;align-items:center;gap:14px!important;padding:13px;border:1px dashed #cbd8de;border-radius:11px;background:#f8fafb; }.logo-upload > span:last-child { display:grid;gap:5px;flex:1; }.logo-upload b { color:var(--navy);font-size:.875rem; }.logo-upload input { min-height:auto!important;padding:7px!important;background:white; }.logo-preview .client-logo-image,.logo-preview .client-monogram { width:9.375rem;height:4.6875rem;border-radius:.65rem; }.client-profile-hero { display:grid;grid-template-columns:170px 1fr auto;align-items:center;gap:20px;margin-bottom:16px;padding:23px; }.client-profile-hero .profile-logo { width:9.375rem;height:4.6875rem;border-radius:.75rem; }.client-profile-hero .client-monogram.profile-logo { display:grid;place-items:center;background:#e9f7dc;color:#57952a;font-size:1.125rem;font-weight:850; }.client-profile-title h2 { margin:9px 0 5px;color:var(--navy);font-size:1.25rem; }.client-profile-title p { margin:0;color:var(--muted);font-size:.8125rem; }.client-profile-stats { display:flex;align-items:stretch;gap:10px; }.client-profile-stats > div { min-width:125px;padding:12px;border-radius:10px;background:#f5f8f9; }.client-profile-stats span,.client-profile-stats strong { display:block; }.client-profile-stats span { color:#83939b;font-size:.75rem; }.client-profile-stats strong { margin-top:7px;color:var(--navy);font-size:1rem; }.client-profile-stats .contract-state { font-size:.8125rem; }.contract-state.success { color:#57932a; }.contract-state.warning { color:#c17a27; }.contract-state.danger { color:#bd4b4b; }.contract-state.neutral { color:#748790; }.client-profile-grid { display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px; }.profile-section { overflow:hidden; }.detail-list { display:grid;grid-template-columns:1fr 1fr;gap:0;padding:0 22px 16px;margin:0; }.detail-list > div { min-height:62px;padding:11px 6px;border-top:1px solid #edf1f3; }.detail-list dt { color:#89979e;font-size:.75rem; }.detail-list dd { margin:6px 0 0;color:#354f5b;font-size:.875rem;font-weight:650;line-height:1.45; }.detail-list dd small { display:block;margin-top:2px;color:#84949b;font-size:.75rem;font-weight:400; }.detail-list a { color:#2f708d; }.services-box { margin:0 22px 21px;padding:13px;border-radius:10px;background:#f4f8f9; }.services-box span { color:#7c8e97;font-size:.75rem;font-weight:750;text-transform:uppercase; }.services-box p { margin:7px 0 0;color:#425e69;font-size:.8125rem;line-height:1.6; }.client-notes { margin-bottom:16px; }.client-notes > p { margin:0;padding:0 22px 22px;color:#536a75;font-size:.875rem;line-height:1.7; }
.empty-compact.padded { padding:25px; }

@media (max-width:1100px) {
  .commercial-metrics { grid-template-columns:repeat(2,1fr); }
  .commercial-dashboard-grid,.goals-layout { grid-template-columns:1fr; }
  .client-profile-hero { grid-template-columns:170px 1fr; }.client-profile-stats { grid-column:1/-1; }.client-profile-stats > div { flex:1; }
}
@media (max-width:760px) {
  .heading-actions { width:100%; }.heading-actions a { flex:1; }
  .subnav { margin-top:0; }.commercial-period,.goals-header { align-items:flex-start; }
  .commercial-metrics { grid-template-columns:1fr 1fr;gap:9px; }.commercial-kpi { min-height:100px;padding:14px; }.commercial-kpi strong { font-size:1.125rem; }
  .funnel-stage-list a { grid-template-columns:minmax(130px,1fr) minmax(60px,.8fr) 20px; }
  .prospect-form { grid-template-columns:1fr; }
  .owner-result-grid { grid-template-columns:1fr; }.client-overview { grid-template-columns:1fr; }.client-profile-grid { grid-template-columns:1fr; }
}
@media (max-width:520px) {
  .commercial-metrics { grid-template-columns:1fr; }.commercial-kpi { min-height:88px; }.commercial-dashboard-grid { display:block; }.commercial-dashboard-grid .panel + .panel { margin-top:14px; }
  .goal-row { grid-template-columns:1fr 38px; }.goal-row .goal-bar { grid-column:1;grid-row:2; }.goal-row em { grid-column:2;grid-row:2; }.routine-week { grid-template-columns:1fr 35px; }.routine-week .goal-bar { grid-column:1; }
  .client-profile-hero { grid-template-columns:1fr;text-align:center; }.client-profile-hero > .client-logo-image,.client-profile-hero > .client-monogram { margin:auto; }.client-profile-stats { display:grid;grid-template-columns:1fr; }.client-profile-stats > div { min-width:0; }.detail-list { grid-template-columns:1fr; }
}

/* Profile photos, themes and drag-and-drop */
.avatar.avatar-photo { overflow:hidden; padding:0; background:#dfe9ed; }
.avatar.avatar-photo img { width:100%; height:100%; object-fit:cover; }
.profile-photo-form { display:grid; width:100%; gap:9px; margin-top:22px; padding-top:20px; border-top:1px solid var(--line); }
.profile-photo-form > small { color:var(--muted); font-size:.75rem; }
.photo-picker { position:relative; display:flex; align-items:center; justify-content:center; min-height:38px; overflow:hidden; border:1px dashed #bfcfd6; border-radius:9px; color:#3d6a7e; font-size:.875rem; font-weight:750; cursor:pointer; }
.photo-picker input { position:absolute; width:1px; height:1px; opacity:0; }
.remove-photo { display:flex; align-items:center; justify-content:center; gap:6px; color:var(--muted); font-size:.8125rem; }
.profile-photo-form .primary-button { width:100%; }
.profile-card .logout-button { width:100%; margin-top:10px; }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.commercial-column { transition:border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.commercial-column > [data-drop-zone] { min-height:108px; }
.opportunity-card[draggable="true"] { cursor:grab; transition:opacity .16s ease, transform .16s ease, box-shadow .16s ease; }
.opportunity-card[draggable="true"]:active { cursor:grabbing; }
.kanban-column.is-drop-target,.commercial-column.is-drop-target { border-color:#72bf2c; background:#f3faec; box-shadow:inset 0 0 0 2px rgba(141,240,0,.18); }
[data-drag-card].is-dragging { opacity:.42; transform:rotate(1deg) scale(.98); }
[data-drag-card].is-saving { opacity:.55; pointer-events:none; }
[data-drag-card].just-moved { animation:card-land .55s ease; }
@keyframes card-land { 0% { transform:scale(.96); box-shadow:0 0 0 3px rgba(141,240,0,.3); } 100% { transform:scale(1); } }

html[data-theme="dark"] {
  color-scheme:dark;
  --navy:#e5f3f8;
  --navy-deep:#041b26;
  --bg:#071821;
  --surface:#0d2632;
  --line:#1d4251;
  --muted:#8ba2ad;
  --text:#dcebf1;
  --shadow:0 10px 32px rgba(0,0,0,.2);
}
html[data-theme="dark"] body { background:var(--bg); color:var(--text); }
html[data-theme="dark"] .sidebar { background:#041b26; }
html[data-theme="dark"] .topbar { border-color:var(--line); background:rgba(7,24,33,.92); }
html[data-theme="dark"] .panel,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .commercial-kpi,
html[data-theme="dark"] .client-overview > div,
html[data-theme="dark"] .modal-card,
html[data-theme="dark"] .kanban-card,
html[data-theme="dark"] .opportunity-card { border-color:var(--line); background:var(--surface); box-shadow:var(--shadow); }
html[data-theme="dark"] .secondary-button,
html[data-theme="dark"] .icon-button,
html[data-theme="dark"] .commercial-period input,
html[data-theme="dark"] .goals-header input,
html[data-theme="dark"] .stack-form input,
html[data-theme="dark"] .stack-form select,
html[data-theme="dark"] .stack-form textarea,
html[data-theme="dark"] .form-grid input,
html[data-theme="dark"] .form-grid select,
html[data-theme="dark"] .form-grid textarea,
html[data-theme="dark"] .filter-form input,
html[data-theme="dark"] .filter-form select,
html[data-theme="dark"] .quick-status select,
html[data-theme="dark"] .routine-check-form > input { border-color:var(--line); background:#102f3d; color:var(--text); }
html[data-theme="dark"] .filter-search { border-color:var(--line); background:#102f3d; }
html[data-theme="dark"] .filter-search input { background:transparent; }
html[data-theme="dark"] .view-switch,
html[data-theme="dark"] .kanban-column,
html[data-theme="dark"] .commercial-column { background:#0a202b; }
html[data-theme="dark"] .view-switch a.active { background:#173845; color:#f0f8fb; box-shadow:none; }
html[data-theme="dark"] .kanban-column > header b,
html[data-theme="dark"] .commercial-column > header b { background:#173744; color:#a9bec7; }
html[data-theme="dark"] .kanban-column.is-drop-target,
html[data-theme="dark"] .commercial-column.is-drop-target { border-color:var(--lime); background:#112d2a; }
html[data-theme="dark"] .data-table th,
html[data-theme="dark"] .task-row.header { background:#102c38; color:#98acb5; }
html[data-theme="dark"] .data-table td,
html[data-theme="dark"] .task-row,
html[data-theme="dark"] .compact-task,
html[data-theme="dark"] .followup-list > a,
html[data-theme="dark"] .modal-card > header,
html[data-theme="dark"] .form-section-title,
html[data-theme="dark"] .detail-list > div,
html[data-theme="dark"] .client-card footer { border-color:#183a48; }
html[data-theme="dark"] .data-table tr:hover td,
html[data-theme="dark"] .compact-task:hover { background:#102c38; }
html[data-theme="dark"] .donut::before { background:var(--surface); }
html[data-theme="dark"] .status-total,
html[data-theme="dark"] .commercial-kpi.highlight { border-color:#14506a; background:#0b4258; }
html[data-theme="dark"] .bar,
html[data-theme="dark"] .commercial-bar,
html[data-theme="dark"] .goal-bar,
html[data-theme="dark"] .status-bars a > div { background:#193743; }
html[data-theme="dark"] .client-card dl div,
html[data-theme="dark"] .client-contract-line,
html[data-theme="dark"] .client-profile-stats > div,
html[data-theme="dark"] .services-box,
html[data-theme="dark"] .next-action,
html[data-theme="dark"] .owner-result-grid > div,
html[data-theme="dark"] .logo-upload { background:#102c38; }
html[data-theme="dark"] .logo-upload input { background:#173845!important; }
html[data-theme="dark"] .client-logo-image { border-color:var(--line); background:#f7fafb; }
html[data-theme="dark"] .modal-close { background:#173845; color:#b5c8d0; }
html[data-theme="dark"] .danger-button { background:#42252a; color:#ffb4b4; }
html[data-theme="dark"] .confirm-card { border-color:#244654; background:#0d2834; }
html[data-theme="dark"] .confirm-icon { background:#42252a; color:#ff9f9f; }
html[data-theme="dark"] .confirm-copy h2 { color:#f2f8fa; }
html[data-theme="dark"] .confirm-copy p { color:#afc2ca; }
html[data-theme="dark"] .alert.success { border-color:#345e32; background:#17351f; color:#a5dc84; }
html[data-theme="dark"] .alert.error { border-color:#69373b; background:#402328; color:#ffb4b4; }
html[data-theme="dark"] .photo-picker { border-color:#315563; color:#a7cad7; }
html[data-theme="dark"] .routine-table tr.routine-done td { background:#17351f; color:#9cbd8a; }
html[data-theme="dark"] :is(.task-row b,.task-title-cell b,.compact-task b,.activity-item b,.kanban-card h3 a,.opportunity-card h3,.opportunity-value strong,.lead-cell b,.followup-list b,.next-action span,.detail-list dd,.services-box p,.client-contract-line b) { color:#dcebf1; }
html[data-theme="dark"] :is(.stack-form label,.form-grid label,.data-table td,.kanban-column > header span,.commercial-column > header span) { color:#aec1c9; }
html[data-theme="dark"] .subnav a { color:#b5c9d1; }
html[data-theme="dark"] .subnav a:hover { background:#173845; color:#ffffff; }
html[data-theme="dark"] .subnav a.active,
html[data-theme="dark"] .subnav a.active:hover { background:#14506a; color:#ffffff; box-shadow:inset 0 0 0 1px rgba(141,240,0,.72),0 5px 16px rgba(0,0,0,.2); }

/* Readability pass: scalable type with a 12px floor for secondary information */
body { font-size:1rem; line-height:1.5; }
small { font-size:.75rem!important; }
:is(.primary-button,.secondary-button,.danger-button,.button-link,.row-action,.text-button,.photo-picker) { font-size:.875rem!important; }
:is(.stack-form label,.form-grid label,.routine-checkbox) { font-size:.875rem!important; }
:is(.stack-form input,.stack-form select,.stack-form textarea,.form-grid input,.form-grid select,.form-grid textarea,.filter-form input,.filter-form select,.routine-check-form > input) { font-size:.875rem!important; }
.search input { font-size:1rem; }
.page-heading .eyebrow { font-size:.75rem; }
.page-heading h1 { font-size:clamp(1.875rem,3vw,2.5rem); }
.page-heading p { font-size:1rem; }
.panel-heading h2 { font-size:1.125rem; }
.panel-heading p { font-size:.8125rem; }
.metric-card span,.workload-row b { font-size:.875rem; }
.metric-card small,.workload-row em,.app-footer,.activity-item small { font-size:.75rem!important; }
.status-content li,.status-content li b,.status-bars a > span { font-size:.8125rem; }
.compact-task b,.activity-item b { font-size:.875rem; }
.data-table th { font-size:.75rem; }
.data-table td,.task-title-cell b { font-size:.875rem; }
.task-title-cell small,.table-subline { font-size:.75rem!important; }
.view-switch a,.toolbar-count { font-size:.8125rem; }
.badge,.priority-label,.client-state,.role-badge,.member-state,.potential,.stage-pill { font-size:.75rem; }
.kanban { grid-template-columns:repeat(5,minmax(280px,1fr)); }
.kanban-column > header span,.commercial-column > header span { font-size:.75rem; }
.kanban-column > header b,.commercial-column > header b { font-size:.75rem; }
.kanban-card h3,.kanban-card h3 a,.opportunity-card h3 { font-size:1rem; }
.kanban-card p,.opportunity-card > p,.next-action span { font-size:.8125rem; }
.kanban-card footer,.opportunity-card footer,.next-action b,.next-action small,.opportunity-value small { font-size:.75rem; }
.kanban-empty { font-size:.8125rem; }
.subnav a { font-size:.875rem; }
.commercial-period strong,.goals-header h2 { font-size:1rem; }
.commercial-period span,.goals-header p,.commercial-kpi span,.commercial-kpi small,.followup-list small { font-size:.75rem; }
.commercial-kpi strong { font-size:1.5rem; }
.funnel-stage-list a,.followup-list b,.followup-date { font-size:.8125rem; }
.commercial-kanban { grid-template-columns:repeat(9,minmax(285px,1fr)); }
.opportunity-value strong { font-size:1.125rem; }
.goal-row span,.goal-row em,.routine-week span { font-size:.8125rem; }
.goal-row b,.routine-week strong { font-size:.875rem; }
.owner-result-grid b,.owner-result-grid span:not(.avatar),.owner-result-grid strong { font-size:.8125rem; }
.client-overview span,.client-card > p,.client-contact,.client-contract-line,.client-profile-title p,.client-profile-stats span,.detail-list dt,.detail-list dd small,.services-box span { font-size:.75rem; }
.client-card h2,.client-profile-stats strong { font-size:1rem; }
.client-card dt,.client-card footer a,.client-profile-stats .contract-state { font-size:.75rem; }
.detail-list dd,.services-box p,.client-notes > p { font-size:.875rem; }
.team-card h2 { font-size:1rem; }
.team-card p,.team-card-side small,.team-card-side a,.profile-card p,.profile-photo-form > small,.remove-photo { font-size:.75rem; }

/* Keep commercial follow-up dates inside their own column */
.followup-list > a { grid-template-columns:6.5rem minmax(0,1fr); gap:.75rem; }
.followup-date { min-width:0; padding-inline:.5rem; white-space:nowrap; }
.followup-list > a > div { min-width:0; overflow-wrap:anywhere; }
html[data-theme="dark"] .commercial-kpi::after { opacity:.16; }

/* Cards open on click and move only from the dedicated drag handle */
.kanban-card,.opportunity-card { cursor:pointer; }
.kanban-card h3 { color:#294752; }
.kanban-card:focus-visible,.opportunity-card:focus-visible { outline:3px solid rgba(91,159,35,.42); outline-offset:2px; }
.card-actions { display:flex; align-items:center; gap:.15rem; }
.drag-handle { display:grid; place-items:center; width:1.875rem; height:1.875rem; padding:0; border:0; border-radius:.4rem; background:transparent; color:#8c9da5; font-size:1.125rem; line-height:1; cursor:grab; }
.drag-handle:hover { background:#edf3f5; color:#345d6f; }
.drag-handle:active { cursor:grabbing; }
html[data-theme="dark"] .kanban-card h3 { color:#dcebf1; }
html[data-theme="dark"] .drag-handle { color:#91aab5; }
html[data-theme="dark"] .drag-handle:hover { background:#173845; color:#fff; }

/* First-access tutorial */
body.onboarding-open { overflow:hidden; }
.onboarding-layer { position:fixed; inset:0; z-index:80; display:grid; place-items:center; padding:1.25rem; background:rgba(3,27,38,.72); backdrop-filter:blur(4px); }
.onboarding-card { width:min(33rem,100%); overflow:hidden; border:1px solid var(--line); border-radius:1.125rem; background:var(--surface); box-shadow:0 2rem 6rem rgba(2,25,36,.38); }
.onboarding-card > header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1.4rem 1.5rem 1rem; border-bottom:1px solid var(--line); }
.onboarding-card > header p { margin:0 0 .35rem; color:#78909a; font-size:.75rem; font-weight:800; letter-spacing:.1rem; }
.onboarding-card > header h2 { margin:0; color:var(--navy); font-size:1.35rem; }
.onboarding-card > header button { display:grid; place-items:center; flex:0 0 auto; width:2rem; height:2rem; padding:0; border:0; border-radius:.5rem; background:#eef3f5; color:#71838c; font-size:1.25rem; }
.onboarding-progress { display:flex; gap:.4rem; padding:1rem 1.5rem 0; }
.onboarding-progress i { width:2rem; height:.25rem; border-radius:1rem; background:#dfe7ea; transition:background .2s ease; }
.onboarding-progress i.active { background:var(--lime); }
.onboarding-steps { padding:1.5rem; }
.onboarding-steps article { min-height:12rem; text-align:center; }
.onboarding-steps article.active { animation:onboarding-in .22s ease both; }
.onboarding-icon { display:grid; place-items:center; width:4.5rem; height:4.5rem; margin:0 auto 1rem; border-radius:1.25rem; background:#eaf8dc; color:#4f921e; font-size:2rem; font-weight:850; }
.onboarding-icon.drag-preview { background:#e5f3f8; color:#24779a; }
.onboarding-steps h3 { margin:0 0 .55rem; color:var(--navy); font-size:1.25rem; }
.onboarding-steps p { max-width:26rem; margin:0 auto; color:var(--muted); font-size:1rem; line-height:1.6; }
.onboarding-card > footer { display:flex; align-items:center; gap:.6rem; padding:1rem 1.5rem 1.35rem; border-top:1px solid var(--line); }
.onboarding-card > footer > span { flex:1; }
.onboarding-card button:disabled { cursor:wait; opacity:.65; }
html[data-theme="dark"] .onboarding-card > header button { background:#173845; color:#b5c8d0; }
html[data-theme="dark"] .onboarding-progress i { background:#21414e; }
html[data-theme="dark"] .onboarding-progress i.active { background:var(--lime); }
html[data-theme="dark"] .onboarding-icon { background:#173e2d; color:#a5e866; }
html[data-theme="dark"] .onboarding-icon.drag-preview { background:#113d50; color:#84cae7; }
@keyframes onboarding-in { from { opacity:0; transform:translateY(.4rem); } to { opacity:1; transform:none; } }

@media (max-width:760px) {
  .top-actions .theme-toggle { display:grid; }
  .onboarding-card > header,.onboarding-steps,.onboarding-card > footer { padding-inline:1.1rem; }
  .onboarding-card > footer .text-button { display:none; }
}
@media (hover:none) {
  [data-drag-card] { cursor:default; }
  .drag-handle { display:none; }
}

/* Task categories and client PDF reports */
.task-category-chip { display:inline-flex; align-items:center; align-self:flex-start; max-width:100%; margin:.55rem 0 .15rem; padding:.22rem .5rem; overflow:hidden; border:1px solid #d7e5ea; border-radius:999px; background:#f2f7f8; color:#52707c; font-size:.75rem; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.category-help { margin-bottom:1rem; padding:1rem 1.2rem; border-left:4px solid var(--lime); }
.category-help strong { color:var(--navy); }
.category-help p { margin:.25rem 0 0; color:var(--muted); font-size:.875rem; }
.report-config { margin-bottom:1rem; padding:1.25rem; }
.report-filter { padding:0; }
.report-preview { display:grid; gap:1rem; }
.report-preview-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.25rem 1.4rem; }
.report-preview-header h2 { margin:.2rem 0; color:var(--navy); font-size:1.35rem; }
.report-preview-header p { margin:0; color:var(--muted); }
.report-preview-header > span { color:var(--muted); font-size:.8125rem; }
.report-summary-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem; }
.report-summary-grid article { padding:1rem 1.1rem; border:1px solid var(--line); border-radius:.8rem; background:var(--surface); box-shadow:var(--shadow); }
.report-summary-grid span,.report-summary-grid strong { display:block; }
.report-summary-grid span { color:var(--muted); font-size:.75rem; font-weight:750; text-transform:uppercase; }
.report-summary-grid strong { margin-top:.35rem; color:var(--navy); font-size:1.55rem; }
.report-preview-list { padding:0 1.25rem 1rem; }
.report-preview-list > div { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.8rem 0; border-top:1px solid var(--line); }
.report-preview-list span,.report-preview-list b,.report-preview-list small { display:block; }
.report-preview-list b { color:var(--navy); font-size:.875rem; }
.report-preview-list small,.report-preview-list em { color:var(--muted); font-size:.75rem; font-style:normal; }
.report-download { padding:1.25rem; }
.report-download .stack-form { max-width:none; }
.report-download button { justify-self:end; }
html[data-theme="dark"] .task-category-chip { border-color:#28505f; background:#143542; color:#b4cbd4; }
html[data-theme="dark"] .report-summary-grid article { border-color:var(--line); background:var(--surface); }
@media (max-width:760px) {
  .report-summary-grid { grid-template-columns:repeat(2,1fr); }
  .report-preview-header { align-items:flex-start; flex-direction:column; }
  .report-download button { width:100%; justify-self:stretch; }
}