:root {
  --ink: #17211b; --muted: #68756c; --line: #dce5dd; --paper: #f5f7f2;
  --card: #ffffff; --green: #164d36; --lime: #d9ff79; --soft: #edf4ec;
  --amber: #fff1c7; --red: #ffe5e2; --blue: #e6f0ff;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink); background: var(--paper); font-synthesis: none;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
.app-shell { display: grid; grid-template-columns: 246px minmax(0, 1fr); min-height: 100vh; }
.sidebar { background: #102e22; color: white; padding: 24px 18px; position: sticky; z-index: 2; top: 0; height: 100vh; display: flex; flex-direction: column; }
.sidebar-collapse { position: absolute; top: 29px; right: -13px; z-index: 3; display: grid; width: 27px; height: 27px; place-items: center; border: 1px solid #315543; border-radius: 50%; background: #173929; color: var(--lime); box-shadow: 0 3px 10px #081d142e; font-size: 21px; line-height: 1; }
.brand { display: flex; align-items: center; gap: 11px; padding: 4px 8px 30px; font-weight: 800; font-size: 20px; letter-spacing: -.6px; }
.brand-mark { width: 30px; height: 30px; border-radius: 10px; background: var(--lime); color: var(--green); display: grid; place-items: center; font-weight: 900; }
.nav-label { margin: 5px 10px 9px; color: #91ad9d; font-size: 10px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; }
.nav { display: grid; gap: 5px; }
.nav button { border: 0; background: transparent; color: #c5d5cb; text-align: left; padding: 11px 12px; border-radius: 10px; display: flex; gap: 10px; align-items: center; }
.nav button:hover, .nav button.active { background: #214434; color: white; }
.nav-icon { display: grid; width: 22px; height: 22px; place-items: center; flex: 0 0 22px; color: #91ad9d; }.nav-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }.nav button:hover .nav-icon, .nav button.active .nav-icon { color: var(--lime); }
.app-shell { transition: grid-template-columns .2s ease; }.sidebar { transition: padding .2s ease; }.sidebar-collapsed { grid-template-columns: 78px minmax(0, 1fr); }.sidebar-collapsed .sidebar { padding-inline: 12px; }.sidebar-collapsed .brand { justify-content: center; padding-inline: 0; font-size: 0; }.sidebar-collapsed .brand-mark { font-size: 16px; }.sidebar-collapsed .nav-label, .sidebar-collapsed .sidebar-foot { display: none; }.sidebar-collapsed .nav button { justify-content: center; padding-inline: 0; font-size: 0; }.sidebar-collapsed .nav-icon { width: 24px; }.sidebar-collapsed .nav-icon svg { width: 18px; height: 18px; }.sidebar-collapsed .nav button { position: relative; }.sidebar-collapsed .nav button::after { position: absolute; left: calc(100% + 11px); z-index: 10; padding: 6px 8px; border-radius: 7px; background: #102e22; color: white; content: attr(data-nav-label); font-size: 11px; opacity: 0; pointer-events: none; transform: translateX(-3px); transition: .15s; }.sidebar-collapsed .nav button:hover::after, .sidebar-collapsed .nav button:focus-visible::after { opacity: 1; transform: none; }
.sidebar-foot { margin-top: auto; border: 1px solid #315543; background: #173929; border-radius: 13px; padding: 14px; }
.sidebar-foot b { display: block; font-size: 13px; margin-bottom: 5px; }
.sidebar-foot small { color: #a9c2b3; line-height: 1.45; }
.main { width: 100%; max-width: 1440px; padding: 30px 36px 60px; margin: 0 auto; }
.topbar { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 26px; }
.topbar h1 { margin: 0 0 4px; font-size: 27px; letter-spacing: -.9px; }
.topbar p { margin: 0; color: var(--muted); font-size: 14px; }
.mode-pill { border: 1px solid #b7c9b9; background: white; border-radius: 999px; padding: 8px 12px; display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; }
.mode-pill i { width: 8px; height: 8px; border-radius: 50%; background: #3bb56f; }
.topbar-actions { position: relative; align-items: center; }
.notification-center { position: relative; }
.notification-bell { position: relative; display: grid; width: 39px; height: 39px; padding: 0; place-items: center; border: 1px solid #cbd8cd; border-radius: 50%; background: white; color: #405348; }
.notification-bell:hover { border-color: #85a68d; background: #f6faf6; color: var(--green); }
.notification-bell svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.notification-badge { position: absolute; top: -5px; right: -5px; display: grid; min-width: 19px; height: 19px; padding: 0 5px; place-items: center; border: 2px solid var(--paper); border-radius: 99px; background: #d84a43; color: white; font-size: 9px; font-weight: 900; }
.notification-panel { position: absolute; z-index: 50; top: calc(100% + 10px); right: 0; width: min(430px, calc(100vw - 30px)); overflow: hidden; border: 1px solid #d5dfd6; border-radius: 16px; background: white; box-shadow: 0 24px 65px #1533232b; }
.notification-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 17px 12px; }
.notification-panel-head b, .notification-panel-head small { display: block; }.notification-panel-head b { font-size: 16px; }.notification-panel-head small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.notification-panel-head button, .notification-view-all { border: 0; background: transparent; color: var(--green); font-size: 11px; font-weight: 800; }
.notification-enable { display: flex; width: calc(100% - 28px); gap: 10px; align-items: center; margin: 0 14px 10px; padding: 10px 11px; border: 1px solid #cfe0d2; border-radius: 11px; background: #f2f8f3; color: #294c37; text-align: left; }
.notification-enable > span { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 8px; background: #dff1e3; color: #237446; }.notification-enable b, .notification-enable small { display: block; }.notification-enable b { font-size: 11px; }.notification-enable small { margin-top: 2px; color: #65766a; font-size: 9px; }.notification-enable:disabled { cursor: default; opacity: .82; }
.notification-list { max-height: min(460px, calc(100vh - 220px)); overflow-y: auto; border-top: 1px solid #edf1ed; border-bottom: 1px solid #edf1ed; }
.notification-item { display: grid; width: 100%; grid-template-columns: 34px minmax(0, 1fr); gap: 11px; padding: 13px 16px; border: 0; border-bottom: 1px solid #edf1ed; background: white; color: inherit; text-align: left; }
.notification-item:last-child { border-bottom: 0; }.notification-item:hover { background: #f8fbf8; }.notification-item.unread { background: #f3f9f3; }.notification-item.unread::after { position: absolute; right: 11px; width: 6px; height: 6px; border-radius: 50%; background: #38a264; content: ''; }.notification-item { position: relative; }
.notification-kind { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 10px; background: #e6f0ff; color: #315f8f; font-weight: 900; }.notification-kind.candidate_ready, .notification-kind.execution_complete { background: #e2f5e6; color: #237446; }.notification-kind.needs_attention { background: #fde8e7; color: #a33d3d; }.notification-kind.outreach_complete { background: #edf5ee; color: #237446; }
.notification-item > span:last-child { min-width: 0; padding-right: 8px; }.notification-item b, .notification-item small, .notification-item em { display: block; }.notification-item b { font-size: 12px; }.notification-item small { margin-top: 3px; color: #526058; font-size: 10px; line-height: 1.4; }.notification-item em { margin-top: 6px; color: #89958c; font-size: 9px; font-style: normal; }
.notification-empty { display: grid; gap: 4px; padding: 36px 20px; color: var(--muted); text-align: center; }.notification-empty b { color: var(--ink); font-size: 13px; }.notification-empty span { font-size: 10px; }
.notification-view-all { width: 100%; padding: 12px; }
.hero { border-radius: 20px; padding: 29px; background: linear-gradient(120deg, #123d2c, #1c6043); color: white; display: grid; grid-template-columns: 1.35fr .65fr; gap: 25px; overflow: hidden; position: relative; }
.hero:after { content: ""; width: 260px; height: 260px; border: 55px solid #d9ff7926; border-radius: 50%; position: absolute; right: -60px; top: -95px; }
.hero-copy { position: relative; z-index: 1; }
.hero .eyebrow { color: var(--lime); font-size: 11px; font-weight: 800; letter-spacing: 1.1px; text-transform: uppercase; }
.hero h2 { font-size: 30px; max-width: 640px; letter-spacing: -1.1px; margin: 10px 0; line-height: 1.12; }
.hero p { color: #c7dbcf; margin: 0 0 20px; max-width: 650px; line-height: 1.55; }
.hero-side { align-self: center; position: relative; z-index: 1; background: #ffffff12; border: 1px solid #ffffff26; border-radius: 14px; padding: 16px; }
.safety-line { display: flex; gap: 9px; align-items: flex-start; margin: 9px 0; color: #d8e7de; font-size: 12px; }
.safety-line span { color: var(--lime); font-weight: 900; }
.btn { border: 0; border-radius: 10px; padding: 10px 15px; font-weight: 750; background: var(--green); color: white; display: inline-flex; gap: 8px; align-items: center; justify-content: center; }
.btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
.btn.lime { background: var(--lime); color: #153525; }
.btn.secondary { background: white; color: var(--ink); border: 1px solid var(--line); }
.btn.copied { border-color: #8cc99b; background: #e3f6e7; color: #216a3b; }
.btn.ghost { color: var(--green); background: var(--soft); }
.btn.danger { color: #8b2e2e; background: var(--red); }
.btn.small { padding: 7px 10px; font-size: 12px; }
.flow { display: grid; grid-template-columns: repeat(4, 1fr); background: white; border: 1px solid var(--line); border-radius: 16px; margin-top: 18px; overflow: hidden; }
.flow-step { padding: 17px; display: flex; gap: 11px; align-items: center; border-right: 1px solid var(--line); }
.flow-step:last-child { border: 0; }
.flow-num { width: 29px; height: 29px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: var(--soft); color: var(--green); font-weight: 800; font-size: 12px; }
.flow-step b { display: block; font-size: 13px; }.flow-step small { color: var(--muted); font-size: 11px; }
.metrics { display: grid; grid-template-columns: repeat(5, 1fr); gap: 13px; margin: 18px 0; }
.metric { background: white; border: 1px solid var(--line); border-radius: 14px; padding: 16px; }
.metric span { color: var(--muted); font-size: 12px; }.metric b { display: block; font-size: 26px; margin-top: 7px; letter-spacing: -.8px; }
.grid { display: grid; gap: 16px; }.two-col { grid-template-columns: minmax(0, 1.4fr) minmax(280px, .6fr); }
.card { background: white; border: 1px solid var(--line); border-radius: 16px; }
.card-pad { padding: 20px; }.card-head { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 17px 19px; border-bottom: 1px solid var(--line); }
.card-head h3, .card h3 { margin: 0; font-size: 15px; }.card-head p { margin: 3px 0 0; color: var(--muted); font-size: 12px; }
.provider-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 15px; }
.provider { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 10px; border-radius: 9px; background: var(--paper); font-size: 12px; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: #a6afa8; }.dot.ok { background: #2fa665; }.dot.warn { background: #e2aa2e; }
table { width: 100%; border-collapse: collapse; font-size: 13px; } th { color: var(--muted); font-size: 10px; letter-spacing: .7px; text-transform: uppercase; text-align: left; background: #fafbf8; }
td, th { padding: 12px 18px; border-bottom: 1px solid #e6ece6; } tbody tr { cursor: pointer; } tbody tr:hover { background: #f8faf6; } tbody tr:last-child td { border-bottom: 0; }
.person { display: flex; gap: 10px; align-items: center; }.avatar { width: 34px; height: 34px; border-radius: 10px; background: #e2f2e3; color: var(--green); display: grid; place-items: center; font-weight: 800; }
.person b { display: block; }.person small { color: var(--muted); }
.score { font-weight: 850; color: var(--green); }.score.large { font-size: 42px; letter-spacing: -2px; }
.pill { display: inline-flex; align-items: center; border-radius: 99px; padding: 5px 8px; background: var(--blue); color: #315681; font-size: 10px; font-weight: 800; text-transform: capitalize; }
.pill.active, .pill.approved, .pill.replied { background: #e1f6e6; color: #237446; }.pill.draft, .pill.hold, .pill.scored { background: var(--amber); color: #805d14; }.pill.rejected, .pill.opted_out { background: var(--red); color: #983d3d; }
.candidate-journey { display: flex; align-items: flex-start; margin-top: 10px; min-width: 250px; }
.journey-step { position: relative; display: grid; justify-items: center; gap: 4px; flex: 1 1 0; min-width: 0; color: #9aa69d; font-size: 9px; font-weight: 800; letter-spacing: .1px; text-align: center; }
.journey-step:not(:last-child)::after { position: absolute; top: 8px; left: calc(50% + 9px); width: calc(100% - 18px); height: 2px; background: #dce5dd; content: ''; }
.journey-step i { position: relative; z-index: 1; display: grid; width: 18px; height: 18px; place-items: center; border: 2px solid #cbd6cd; border-radius: 50%; background: #fff; color: transparent; font-size: 11px; font-style: normal; line-height: 1; }
.journey-step b { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: inherit; }
.journey-step.done { color: #237446; }.journey-step.done i { border-color: #2b9a57; background: #2b9a57; color: #fff; }.journey-step.done:not(:last-child)::after { background: #7fc594; }
.journey-step.current { color: #315f8f; }.journey-step.current i { border: 2px solid #6c9bd3; border-top-color: #fff; background: #e6f0ff; box-shadow: 0 0 0 3px #e6f0ff; animation: journey-spin 1s linear infinite; }
.journey-step.stopped { color: #986d15; }.journey-step.stopped i { border-color: #dfb95c; background: #fff1c7; color: #986d15; }.journey-step.skipped { color: #7b867d; }.journey-step.skipped i { border-color: #cbd6cd; background: #f3f6f3; color: #7b867d; }
@keyframes journey-spin { to { transform: rotate(360deg); } }
.activity { padding: 10px 16px; }
.event { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; padding: 14px 4px; border-bottom: 1px solid #e8eee8; font-size: 12px; }
.event:last-child { border-bottom: 0; }
.event-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #eef4f0; color: #466354; font-size: 15px; font-weight: 850; }
.event-success .event-icon { background: #e5f6e9; color: #237446; }
.event-progress .event-icon { background: #eaf2fb; color: #315f8f; }
.event-attention .event-icon { background: #fff3d2; color: #8b6515; }
.event-error .event-icon { background: #fde8e7; color: #a33d3d; }
.event-copy { min-width: 0; }
.event-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.event-top b { color: var(--ink); font-size: 12px; }
.event-stage { flex: 0 0 auto; padding: 3px 7px; border-radius: 99px; background: #f1f4f0; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .45px; }
.event p { margin: 4px 0 0; color: #526058; line-height: 1.45; overflow-wrap: anywhere; }
.event-context { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; }
.event-context div { display: inline-flex; align-items: baseline; gap: 4px; max-width: 100%; padding: 4px 6px; border: 1px solid #e1e9e2; border-radius: 6px; background: #f7faf7; }
.event-context dt { color: #718076; font-size: 9px; font-weight: 850; letter-spacing: .35px; text-transform: uppercase; }
.event-context dd { max-width: 230px; margin: 0; overflow: hidden; color: #31463a; font-size: 10px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.event time { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; }
.activity-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 18px; }
.activity-summary > div { padding: 16px 18px; border: 1px solid var(--line); border-radius: 14px; background: white; }
.activity-summary span { display: block; color: var(--muted); font-size: 11px; }
.activity-summary b { display: block; margin-top: 7px; color: var(--ink); font-size: 24px; letter-spacing: -.6px; }
.activity-search-panel { display: grid; grid-template-columns: minmax(240px, 1.7fr) repeat(4, minmax(125px, .7fr)) auto; gap: 10px; align-items: end; margin-bottom: 13px; padding: 14px; border: 1px solid var(--line); border-radius: 15px; background: white; }
.activity-search-panel label { display: grid; gap: 6px; color: #56655c; font-size: 10px; font-weight: 800; letter-spacing: .25px; text-transform: uppercase; }
.activity-search-panel input, .activity-search-panel select { width: 100%; min-width: 0; height: 38px; padding: 0 10px; border: 1px solid #d6e0d7; border-radius: 9px; outline: none; background: #fbfdfb; color: var(--ink); font: inherit; font-size: 12px; text-transform: none; }
.activity-search-panel input:focus, .activity-search-panel select:focus { border-color: #73a183; box-shadow: 0 0 0 3px #dcecdf; }
.activity-search-actions { display: flex; gap: 7px; align-items: center; }
.activity-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 14px; }
.activity-filters { display: flex; gap: 7px; overflow-x: auto; padding: 2px; }
.activity-filter { flex: 0 0 auto; padding: 7px 11px; border: 1px solid var(--line); border-radius: 99px; background: white; color: #536158; cursor: pointer; font: inherit; font-size: 11px; font-weight: 750; }
.activity-filter:hover { border-color: #a9c0ae; }
.activity-filter.active { border-color: var(--green); background: var(--green); color: white; }
.activity-count { flex: 0 0 auto; color: var(--muted); font-size: 11px; }
.activity-page-list { padding: 0; }
.activity-day { margin-bottom: 18px; }
.activity-day > h3 { margin: 0 0 8px; color: #647168; font-size: 11px; font-weight: 850; letter-spacing: .6px; text-transform: uppercase; }
.activity-timeline { overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: white; }
.activity-timeline .event { padding: 15px 17px; }
.activity-message { margin-top: 11px; border: 1px solid #d5e2d7; border-radius: 11px; background: #f9fcf9; overflow: hidden; }
.activity-message summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; color: #214831; cursor: pointer; list-style: none; }
.activity-message summary::-webkit-details-marker { display: none; }
.activity-message summary > span { display: grid; gap: 2px; }
.activity-message summary b { font-size: 11px; }
.activity-message summary small { color: var(--muted); font-size: 9px; font-weight: 650; }
.activity-message summary i { font-size: 16px; font-style: normal; transition: transform .18s ease; }
.activity-message[open] summary { border-bottom: 1px solid #dce6de; background: #eff7ef; }
.activity-message[open] summary i { transform: rotate(180deg); }
.activity-message-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; padding: 11px 12px; border-bottom: 1px solid #e3ebe4; }
.activity-message-meta > div { min-width: 0; }
.activity-message-meta span, .activity-message-meta b { display: block; }
.activity-message-meta span { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .5px; text-transform: uppercase; }
.activity-message-meta b { margin-top: 3px; overflow-wrap: anywhere; color: #2b4937; font-size: 10px; }
.activity-message-body { max-height: 330px; overflow: auto; padding: 13px; background: white; color: #26382e; font: 11px/1.65 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.activity-pagination { display: flex; align-items: center; justify-content: center; gap: 13px; margin-top: 7px; color: var(--muted); font-size: 11px; }
.activity-pagination .btn:disabled { cursor: not-allowed; opacity: .45; }
.toolbar { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 16px; }.toolbar p { margin: 0; color: var(--muted); }
.role-grid, .talent-grid, .sequence-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 15px; }
.role-card, .talent-card, .sequence-card { padding: 19px; }.role-card h3, .talent-card h3 { margin: 13px 0 5px; font-size: 17px; }.role-meta { color: var(--muted); font-size: 12px; }.role-card p { color: var(--muted); line-height: 1.5; min-height: 42px; }.chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 13px 0; }.chip { padding: 5px 7px; border-radius: 7px; background: var(--soft); color: #3d614e; font-size: 10px; font-weight: 700; }
.actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 15px; }.split { display: flex; justify-content: space-between; gap: 15px; align-items: flex-start; }
.empty { text-align: center; padding: 54px 20px; color: var(--muted); }.empty b { color: var(--ink); display: block; margin-bottom: 5px; }
.step-list { border-left: 2px solid #d9e4da; margin: 14px 0; padding-left: 16px; }.step { padding: 10px 0; border-bottom: 1px solid #edf1ed; }.step:last-child { border: 0; }.step b { font-size: 12px; }.step small { color: var(--muted); }
.vapi-outreach-status { display: grid; gap: 9px; margin: 14px 0 0; padding: 11px; border: 1px solid #cfe0d2; border-radius: 10px; background: #f4faf5; }.vapi-outreach-status > div:first-child { display: grid; gap: 3px; }.vapi-outreach-status b { color: #1b5134; font-size: 12px; }.vapi-outreach-status span { color: #5c7264; font-size: 11px; line-height: 1.35; }.vapi-outreach-status.progress { border-color: #c9dcf2; background: #f3f8ff; }.vapi-outreach-status.progress b { color: #28598b; }.vapi-outreach-status.attention { border-color: #efd9a6; background: #fffaf0; }.vapi-outreach-status.attention b { color: #895f14; }.vapi-outreach-status.waiting { border-style: dashed; }.vapi-outreach-meta { display: flex; flex-wrap: wrap; gap: 6px; }.vapi-outreach-meta span { padding: 3px 6px; border: 1px solid #d9e5db; border-radius: 6px; background: rgba(255,255,255,.55); font-size: 10px; font-weight: 700; }
dialog { box-sizing: border-box; max-height: calc(100dvh - 30px); overflow-y: auto; border: 0; border-radius: 18px; padding: 0; color: var(--ink); width: min(650px, calc(100vw - 30px)); box-shadow: 0 25px 100px #16332442; } dialog::backdrop { background: #0d251b99; backdrop-filter: blur(3px); }
.dialog-panel { position: relative; }
.dialog-close { position: sticky; z-index: 3; top: 14px; float: right; display: grid; place-items: center; width: 36px; height: 36px; margin: -8px -8px 0 12px; padding: 0; border: 1px solid #dbe4dc; border-radius: 10px; background: #fff; color: #526058; cursor: pointer; box-shadow: 0 3px 12px #16332414; }
.dialog-close svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.dialog-close:hover { border-color: #b7cab9; background: #f1f6ef; color: var(--green); }
.dialog-close:focus-visible { border-color: #438064; outline: 3px solid #dcecdf; }
.modal { padding: 24px; }.modal-head { display: flex; justify-content: space-between; gap: 15px; margin-bottom: 20px; padding-right: 42px; }.modal h2 { margin: 0 0 5px; font-size: 21px; }.modal-head p, .form-note { color: var(--muted); margin: 0; font-size: 12px; line-height: 1.5; }
.logout-confirm { padding: 31px 28px 26px; text-align: center; }.logout-confirm-icon { display: grid; place-items: center; width: 48px; height: 48px; margin: 0 auto 14px; border-radius: 15px; background: #fff0ef; color: #9c3935; }.logout-confirm-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }.logout-confirm .modal-head { display: block; margin-bottom: 0; padding-right: 0; }.logout-confirm .modal-foot { justify-content: center; }
.form label { display: grid; gap: 6px; margin-bottom: 13px; color: #445149; font-size: 12px; font-weight: 650; }.form input, .form textarea, .form select { width: 100%; border: 1px solid #cfdacf; border-radius: 10px; padding: 10px 11px; background: #fbfcfa; color: var(--ink); outline: none; }.form input:focus, .form textarea:focus, .form select:focus { border-color: #438064; box-shadow: 0 0 0 3px #2b7a5020; }.form textarea { min-height: 92px; resize: vertical; }.form .row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }.form label.check { display: flex; align-items: center; font-weight: 500; }.form label.check input { width: auto; }.modal-foot { display: flex; justify-content: flex-end; gap: 8px; margin-top: 19px; }
.busy { text-align: center; padding: 42px 24px; }.spinner { width: 40px; height: 40px; border: 4px solid #dce7dc; border-top-color: var(--green); border-radius: 50%; animation: spin .8s linear infinite; margin: 0 auto 18px; } @keyframes spin { to { transform: rotate(360deg); } }
.pilot-result { background: #edf7ed; border: 1px solid #c9dfcc; border-radius: 12px; padding: 14px; margin-top: 13px; }.pilot-result b { color: var(--green); }
.candidate-contact { margin-top: 13px; padding: 15px; border: 1px solid #c9dfcc; border-radius: 12px; background: #fff; }
.candidate-contact-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 11px; }
.candidate-contact-head h3 { margin: 2px 0 0; }
.candidate-contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 9px; }
.candidate-contact-grid a { display: flex; flex-direction: column; gap: 3px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; background: #f5faf5; color: var(--ink); text-decoration: none; }
.candidate-contact-grid a:hover { border-color: #91b9a0; background: #edf7ed; }
.candidate-contact-grid span { color: var(--muted); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.candidate-contact-grid b { overflow-wrap: anywhere; color: var(--green); }
.pilot-monitor { width: 100%; }
.pilot-live-summary { display: flex; gap: 13px; align-items: center; padding: 15px; border: 1px solid #c9dfcc; border-radius: 13px; background: #edf7ed; }
.pilot-live-summary.attention { border-color: #ead38b; background: #fff7dc; }
.pilot-live-summary b, .pilot-live-summary small { display: block; }
.pilot-live-summary small { margin-top: 4px; color: var(--muted); }
.pilot-live-icon { display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; background: #fff; color: var(--green); font-size: 20px; font-weight: 800; }
.pilot-live-icon .spinner { width: 24px; height: 24px; margin: 0; border-width: 3px; }
.pilot-steps { display: grid; gap: 8px; margin-top: 15px; }
.pilot-step { display: grid; grid-template-columns: 32px 1fr; gap: 11px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; background: #fafcf9; }
.pilot-step > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #e8eee8; color: var(--muted); font-size: 12px; font-weight: 800; }
.pilot-step b, .pilot-step small { display: block; }.pilot-step small { margin-top: 2px; color: var(--muted); font-size: 11px; }
.pilot-step.done { border-color: #c9dfcc; background: #f1f8ef; }.pilot-step.done > span { background: var(--green); color: #fff; }
.pilot-step.current { border-color: #91b9a0; background: #edf7ed; box-shadow: 0 0 0 3px #2b7a5012; }.pilot-step.current > span { background: #d8ecde; color: var(--green); }
.pilot-step.blocked { border-color: #ead38b; background: #fff7dc; }.pilot-step.blocked > span { background: #f7df9b; color: #805d14; }
.pilot-candidate-list { display: grid; gap: 7px; margin-top: 15px; padding-top: 15px; border-top: 1px solid var(--line); }
.pilot-candidate-list > div { display: grid; grid-template-columns: 36px 1fr auto; gap: 10px; align-items: center; }
.pilot-candidate-list .avatar { width: 34px; height: 34px; }.pilot-candidate-list p { margin: 0; min-width: 0; }
.pilot-candidate-list b, .pilot-candidate-list small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.pilot-candidate-list small { color: var(--muted); font-size: 11px; margin-top: 2px; }
.evidence { padding: 0; list-style: none; }.evidence li { padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 12px; }.evidence small { display: block; color: var(--muted); margin-top: 3px; }
.settings-card { max-width: 680px; padding: 22px; }.warning { background: var(--amber); border: 1px solid #efd47f; border-radius: 11px; padding: 12px; font-size: 12px; line-height: 1.45; margin-bottom: 16px; }
#toast { position: fixed; right: 24px; bottom: 24px; max-width: 390px; background: #173c2b; color: white; padding: 12px 15px; border-radius: 10px; box-shadow: 0 10px 35px #152b2055; opacity: 0; transform: translateY(10px); transition: .2s; pointer-events: none; z-index: 30; font-size: 13px; } #toast.show { opacity: 1; transform: none; }
@media (max-width: 980px) { .app-shell { grid-template-columns: 1fr; }.sidebar { height: auto; position: static; padding: 14px 18px; }.brand { padding: 0 4px 12px; }.nav-label, .sidebar-foot { display: none; }.nav { display: flex; overflow-x: auto; }.nav button { white-space: nowrap; }.hero { grid-template-columns: 1fr; }.hero-side { display: none; }.metrics { grid-template-columns: repeat(3, 1fr); }.two-col { grid-template-columns: 1fr; } }
@media (max-width: 650px) { .main { padding: 20px 15px 50px; }.topbar { align-items: flex-start; }.topbar h1 { font-size: 23px; }.hero { padding: 22px; }.hero h2 { font-size: 24px; }.flow { grid-template-columns: 1fr 1fr; }.flow-step:nth-child(2) { border-right: 0; }.flow-step:nth-child(-n+2) { border-bottom: 1px solid var(--line); }.metrics { grid-template-columns: 1fr 1fr; }.metric:last-child { grid-column: span 2; }.form .row-2 { grid-template-columns: 1fr; } td:nth-child(2), th:nth-child(2) { display: none; } }

/* Evidence-first workflow additions. */
.btn:disabled { cursor: not-allowed; opacity: .45; transform: none; filter: none; }
.flow.five { grid-template-columns: repeat(5, 1fr); }
.block { display: block; color: var(--muted); margin-top: 3px; font-size: 10px; }
.right { text-align: right; }
.pill.preliminary_match { background: #fff1c7; color: #805d14; }
.pill.queued, .pill.processing, .pill.outreach_eligible { background: #e6f0ff; color: #315681; }
.pill.failed { background: var(--red); color: #983d3d; }
.role-card.incomplete { border-color: #efd47f; }
.actions.compact { margin: 0; }
.actions.center { justify-content: center; }
.onboarding { padding: 80px 20px; }
.setup-warning { display: grid; gap: 3px; padding: 12px; border: 1px solid #efd47f; background: var(--amber); border-radius: 10px; margin: 12px 0; font-size: 12px; }
.setup-warning span { color: #705919; }
.rubric-mini { display: grid; gap: 7px; padding: 12px; border: 1px solid var(--line); background: #fafcf9; border-radius: 11px; margin: 12px 0; color: var(--muted); font-size: 11px; line-height: 1.4; }
.component-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.component-strip span { display: grid; gap: 2px; padding: 8px; background: var(--soft); border-radius: 8px; }
.component-strip b { color: var(--green); font-size: 16px; }
.component-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; margin: 12px 0 20px; }
.component-grid div { padding: 13px; background: var(--soft); border: 1px solid #d9e7da; border-radius: 10px; }
.component-grid b { display: block; color: var(--green); font-size: 20px; }
.component-grid span { color: var(--muted); font-size: 10px; }
.legend { padding: 12px 14px; border: 1px solid var(--line); background: white; border-radius: 11px; margin-bottom: 15px; color: var(--muted); font-size: 12px; }
dialog { max-height: 92vh; }
dialog:has(.wide) { width: min(940px, calc(100vw - 30px)); }
.modal.wide { width: 100%; }
.modal h3 { margin: 22px 0 9px; }
.form textarea.tall { min-height: 260px; }
.proof { margin-top: 18px; }
.run-summary { margin-top: 14px; padding: 13px; border-radius: 10px; background: var(--paper); color: var(--muted); font-size: 12px; }
.run-summary b { color: var(--ink); }
.candidate-result { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin: 18px 0; }
.document { white-space: pre-wrap; max-height: 300px; overflow: auto; padding: 15px; margin-top: 9px; border: 1px solid var(--line); border-radius: 10px; background: #fafbf8; color: #425047; font-size: 12px; line-height: 1.55; }
summary { cursor: pointer; font-weight: 750; }
.audit { display: grid; gap: 5px; padding: 13px; background: var(--soft); border-radius: 10px; font-size: 12px; line-height: 1.5; }
.danger-box { padding: 13px; background: var(--red); border: 1px solid #f0bbb5; border-radius: 10px; font-size: 12px; }
.danger-box b { display: block; color: #8b2e2e; margin-bottom: 4px; }
.table-wrap { overflow-x: auto; }
.settings-stack { display: grid; gap: 16px; max-width: 760px; }
.settings-stack .settings-card { max-width: none; }
.setup-steps { margin: 16px 0; padding-left: 22px; color: var(--muted); font-size: 12px; line-height: 1.8; }
.setup-steps code { background: var(--soft); color: var(--green); padding: 2px 5px; border-radius: 5px; }
.token-label { display: grid; gap: 7px; color: #445149; font-size: 12px; font-weight: 700; }
.token-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.token-row input { min-width: 0; border: 1px solid #cfdacf; border-radius: 10px; padding: 10px; font: 12px ui-monospace, monospace; background: #fafcf9; }
.pipeline-overview { margin-top: 18px; }
.action-inbox { margin-top: 18px; }
.action-inbox.clear { border-color: #c9dfcc; background: #fbfefb; }
.action-inbox-list { display: grid; gap: 8px; margin-top: 14px; }
.action-inbox-item { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px; border: 1px solid var(--line); border-radius: 11px; background: #fafcf9; }
.action-inbox-item.attention { border-color: #ead38b; background: #fff9e8; }
.action-inbox-item.next { background: #f3f8f3; }
.action-inbox-item > div { min-width: 0; }
.action-inbox-item b, .action-inbox-item small { display: block; }
.action-inbox-item b { font-size: 12px; }
.action-inbox-item small { margin-top: 3px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.action-inbox-item .btn { flex: 0 0 auto; }
.job-progress-list { display: grid; gap: 8px; margin-top: 14px; }
.job-progress { border: 1px solid var(--line); background: #fafcf9; width: 100%; padding: 11px 12px; border-radius: 10px; display: flex; justify-content: space-between; gap: 12px; align-items: center; text-align: left; color: var(--ink); }
.job-progress:hover { border-color: #a8c4ae; background: #f2f8f1; }.job-progress b, .job-progress small { display: block; }.job-progress small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.compact-empty { padding: 18px; }
.job-counts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin: 13px 0; }.job-counts span { padding: 9px; border-radius: 8px; background: var(--paper); color: var(--muted); font-size: 10px; }.job-counts b { display: block; font-size: 17px; color: var(--green); }
.guide { display: flex; flex-wrap: wrap; gap: 9px 13px; align-items: center; padding: 13px 15px; background: white; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); font-size: 12px; margin-bottom: 13px; }.guide b { color: var(--ink); }.guide span { display: inline-flex; align-items: center; gap: 5px; }.guide .pill { font-style: normal; }
.job-filter-panel { margin: 15px 0 17px; padding: 12px; border: 1px solid #dce6de; border-radius: 14px; background: linear-gradient(135deg, #fbfdfb, #f4f8f4); }.job-filter-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 2px 10px; }.job-filter-head > div { display: grid; gap: 2px; }.job-filter-head b { color: #234836; font-size: 12px; }.job-filter-head span { color: var(--muted); font-size: 10px; }.job-filter-head > span { flex: 0 0 auto; padding: 4px 7px; border-radius: 99px; background: #e7f0e8; color: #4d6d59; font-size: 10px; font-weight: 800; }.job-filter-select { display: grid; grid-template-columns: 46px minmax(0, 1fr); align-items: center; gap: 10px; }.job-filter-select > span { color: #52665a; font-size: 11px; font-weight: 800; }.job-filter-select select { min-width: 0; width: 100%; appearance: auto; border: 1px solid #cdddcf; border-radius: 9px; padding: 9px 11px; background: #fff; color: #244735; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; outline: none; }.job-filter-select select:hover { border-color: #9dbca5; }.job-filter-select select:focus { border-color: var(--green); box-shadow: 0 0 0 3px #d4ead9; }
.job-search-panel { margin-bottom: 15px; padding: 13px 14px; border: 1px solid var(--line); border-radius: 14px; background: white; }
.job-search-row, .job-search-inline { display: grid; grid-template-columns: 92px minmax(0, 1fr); align-items: center; gap: 10px; }
.job-search-row > label, .job-search-inline > label { color: #52665a; font-size: 11px; font-weight: 800; }
.job-search-inline { margin-bottom: 9px; grid-template-columns: 46px minmax(0, 1fr); }
.job-search-control { position: relative; min-width: 0; }
.job-search-control svg { position: absolute; top: 50%; left: 11px; width: 17px; height: 17px; fill: none; stroke: #718178; stroke-width: 1.8; stroke-linecap: round; transform: translateY(-50%); pointer-events: none; }
.job-search-control input { width: 100%; min-width: 0; height: 42px; padding: 0 40px 0 38px; border: 1px solid #cdddcf; border-radius: 10px; background: #fbfdfb; color: var(--ink); outline: none; }
.job-search-control input:hover { border-color: #9dbca5; }.job-search-control input:focus { border-color: var(--green); box-shadow: 0 0 0 3px #d4ead9; background: white; }
.job-search-control button { position: absolute; top: 50%; right: 8px; display: grid; width: 27px; height: 27px; padding: 0; place-items: center; border: 0; border-radius: 7px; background: #edf3ed; color: #53645a; font-size: 19px; line-height: 1; transform: translateY(-50%); }
.job-search-control button[hidden] { display: none; }
.job-search-control button:hover { background: #dfeadf; color: var(--green); }
.zoho-opening-field { position: relative; }
.zoho-combobox { position: relative; }
.zoho-combobox-control { position: relative; display: flex; align-items: center; }
.zoho-combobox-control > svg { position: absolute; left: 12px; z-index: 1; width: 18px; height: 18px; fill: none; stroke: #718178; stroke-width: 1.8; stroke-linecap: round; pointer-events: none; }
.form .zoho-combobox-control input { height: 48px; padding: 10px 82px 10px 40px; font-weight: 700; }
.zoho-combobox-clear, .zoho-combobox-toggle { position: absolute; display: grid; place-items: center; border: 0; color: #52645a; cursor: pointer; }
.zoho-combobox-clear { right: 43px; width: 28px; height: 28px; border-radius: 8px; background: #edf3ed; font-size: 19px; }
.zoho-combobox-clear[hidden] { display: none; }
.zoho-combobox-toggle { right: 8px; width: 30px; height: 30px; background: transparent; }
.zoho-combobox-toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.zoho-combobox-control:focus-within input { border-color: #438064; box-shadow: 0 0 0 3px #2b7a5020; background: white; }
.zoho-combobox-results { max-height: min(240px, 34vh); overflow-y: auto; margin-top: 7px; padding: 6px; border: 1px solid #bfd2c2; border-radius: 11px; background: white; box-shadow: 0 10px 26px rgba(18, 46, 32, .13); overscroll-behavior: contain; scrollbar-gutter: stable; }
.zoho-combobox-results button { display: grid; width: 100%; gap: 3px; padding: 10px 11px; border: 0; border-radius: 8px; background: transparent; color: var(--ink); text-align: left; cursor: pointer; }
.zoho-combobox-results button:hover, .zoho-combobox-results button.active { background: #edf7ee; }
.zoho-combobox-results button b { font-size: 12px; }
.zoho-combobox-results button b em { color: #214831; font-size: 12px; font-style: normal; font-weight: 900; white-space: nowrap; }
.zoho-combobox-results button span { color: var(--muted); font-size: 10px; font-weight: 500; }
.zoho-combobox-empty { padding: 16px 12px; color: var(--muted); font-size: 11px; font-weight: 600; line-height: 1.45; text-align: center; }
.zoho-search-status { color: var(--muted); font-size: 10px; font-weight: 600; }
.search-empty .btn { margin-top: 15px; }
.custom-candidate-callout { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 0 0 17px; padding: 16px 18px; border: 1px solid #bfd7c4; border-radius: 15px; background: linear-gradient(135deg, #f2faef, #fbfdf9); }
.custom-candidate-callout > div { display: grid; gap: 3px; min-width: 0; }.custom-candidate-callout .eyebrow { color: #4b735b; font-size: 9px; font-weight: 850; letter-spacing: .7px; text-transform: uppercase; }.custom-candidate-callout b { color: #1d432f; font-size: 14px; }.custom-candidate-callout small { color: var(--muted); line-height: 1.45; }.custom-candidate-callout .btn { flex: 0 0 auto; }
.custom-candidate-modal { width: 100%; }.custom-candidate-modal .eyebrow { display: block; margin-bottom: 5px; color: #4b735b; font-size: 9px; font-weight: 850; letter-spacing: .8px; text-transform: uppercase; }
.custom-candidate-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 18px; }
.custom-flow-step { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 10px; border: 1px solid #dce6de; border-radius: 11px; background: #f8faf7; }.custom-flow-step i { display: grid; width: 25px; height: 25px; flex: 0 0 25px; place-items: center; border-radius: 50%; background: #dfe9e0; color: #4e6657; font-size: 10px; font-style: normal; font-weight: 850; }.custom-flow-step.active { border-color: #a9cbb0; background: #edf7eb; }.custom-flow-step.active i { background: var(--green); color: white; }.custom-flow-step b, .custom-flow-step small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.custom-flow-step b { font-size: 11px; }.custom-flow-step small { margin-top: 2px; color: var(--muted); font-size: 9px; }
.custom-flow-step.complete { border-color: #c7dec9; background: #f2f9f1; }.custom-flow-step.complete i { background: #d7edda; color: #247141; }.custom-flow-step.complete b { color: #2c6240; }
.custom-role-summary { min-height: 54px; margin: -3px 0 16px; padding: 11px 13px; border: 1px solid #d7e4d9; border-radius: 11px; background: #f6faf5; }.custom-role-summary, .custom-role-summary > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.custom-role-summary > div { align-items: flex-start; flex-direction: column; gap: 3px; }.custom-role-summary > div > b { color: #244b35; font-size: 12px; }.custom-role-summary small, .custom-role-summary > span { color: var(--muted); font-size: 10px; }.custom-role-placeholder { margin: auto 0; }
.resume-upload-panel { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 15px; align-items: center; margin-bottom: 14px; padding: 14px 15px; border: 1px dashed #9ebca5; border-radius: 13px; background: #f4faf3; }.resume-upload-copy { display: flex; align-items: center; gap: 11px; min-width: 0; }.resume-upload-copy b, .resume-upload-copy small { display: block; }.resume-upload-copy b { color: #214831; font-size: 12px; }.resume-upload-copy small { margin-top: 3px; color: var(--muted); font-size: 10px; line-height: 1.4; }.resume-upload-icon { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border-radius: 10px; background: #dceddc; color: var(--green); font-size: 20px; font-weight: 850; }.resume-upload-panel .btn { flex: 0 0 auto; }
.custom-candidate-modal { position: relative; }.custom-candidate-modal.resume-processing-active > :not(.resume-processing-overlay) { filter: blur(6px); opacity: .52; pointer-events: none; user-select: none; transition: filter .2s ease, opacity .2s ease; } dialog:has(.resume-processing-overlay) { overflow: visible; }
.resume-processing-overlay { position: fixed; z-index: 50; inset: 0; display: grid; width: 100vw; height: 100dvh; place-items: center; padding: max(20px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); background: #0b271f66; backdrop-filter: blur(8px) saturate(.82); opacity: 0; transition: opacity .2s ease; }.resume-processing-overlay.visible { opacity: 1; }.resume-processing-card { width: min(100%, 390px); max-height: calc(100dvh - 40px); overflow: auto; padding: 28px 29px; border: 1px solid #cce0d1; border-radius: 20px; background: #fff; box-shadow: 0 28px 70px #081d1455; text-align: center; }.resume-processing-art { position: relative; display: grid; width: 96px; height: 96px; margin: 0 auto 17px; place-items: center; overflow: hidden; border-radius: 27px; background: linear-gradient(145deg, #d9ff79, #49a273 52%, #164d36); box-shadow: inset 0 1px 0 #ffffff80, 0 13px 24px #1b654033; }.resume-processing-art::after { position: absolute; inset: 10px; border: 1px solid #ffffff66; border-radius: 20px; content: ''; }.resume-processing-art span { position: absolute; width: 55px; height: 55px; border-radius: 50%; background: #f1ffbe66; filter: blur(10px); transform: translate(-22px, -20px); }.resume-processing-art i { position: relative; z-index: 1; display: block; width: 9px; height: 9px; margin: 4px; border-radius: 50%; background: white; animation: resume-dot 1s ease-in-out infinite; }.resume-processing-art i:nth-of-type(2) { animation-delay: .14s; }.resume-processing-art i:nth-of-type(3) { animation-delay: .28s; }.resume-processing-card .eyebrow { display: block; margin-bottom: 6px; color: #5d8069; font-size: 9px; font-weight: 850; letter-spacing: 1px; text-transform: uppercase; }.resume-processing-card h2 { margin: 0; color: #173d2b; font-size: 23px; letter-spacing: -.65px; }.resume-processing-file { overflow: hidden; margin: 7px 0 20px; color: #69776d; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.resume-processing-bar { height: 8px; overflow: hidden; border-radius: 999px; background: #dceadf; }.resume-processing-bar i { display: block; width: 12%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #164d36, #5aaa72, #d9ff79); transition: width .45s cubic-bezier(.2,.8,.2,1); }.resume-processing-percent { display: block; margin: 11px 0 20px; color: #1b633f; font-size: 18px; letter-spacing: -.35px; }.resume-processing-steps { display: grid; gap: 11px; margin: 0; padding: 0; text-align: left; list-style: none; }.resume-processing-steps li { display: flex; align-items: center; gap: 10px; color: #869187; font-size: 12px; transition: color .2s ease; }.resume-processing-steps li::before { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: #d4dfd6; content: ''; }.resume-processing-steps li.active { color: #174b31; font-weight: 750; }.resume-processing-steps li.active::before { background: var(--green); box-shadow: 0 0 0 5px #d9ff7988; }.resume-processing-overlay.failed .resume-processing-art { background: linear-gradient(145deg, #fff1c7, #e4a84a); }.resume-processing-overlay.failed .resume-processing-percent { color: #98691c; } @keyframes resume-dot { 50% { transform: translateY(-5px); opacity: .58; } }
.resume-upload-status { display: none; grid-column: 1 / -1; gap: 2px; padding: 9px 11px; border-radius: 9px; font-size: 10px; }.resume-upload-status.success, .resume-upload-status.failed { display: grid; }.resume-upload-status.success { border: 1px solid #b8d9bf; background: #e9f7e9; color: #27613c; }.resume-upload-status.failed { border: 1px solid #ebc7c2; background: #fff0ee; color: #8b3d35; }.resume-upload-status b, .resume-upload-status span { display: block; }.resume-upload-status span { line-height: 1.4; }
.custom-form-section { margin-top: 5px; padding: 15px; border: 1px solid var(--line); border-radius: 13px; background: #fcfdfb; }.custom-form-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 13px; }.custom-form-section-head span { color: #294d38; font-size: 12px; font-weight: 850; }.custom-form-section-head small { color: var(--muted); font-size: 9px; }
.custom-optional-fields { margin-top: 12px; padding: 12px 14px 0; border: 1px solid var(--line); border-radius: 11px; background: #fafcf9; }.custom-optional-fields summary { margin-bottom: 12px; color: #395443; font-size: 11px; }.custom-optional-fields:not([open]) { padding-bottom: 12px; }.custom-optional-fields label:last-child { margin-bottom: 13px; }
.custom-evaluation-progress { display: flex; align-items: center; gap: 12px; margin-top: 13px; padding: 13px 14px; border: 1px solid #b8d5bf; border-radius: 11px; background: #edf8ed; }.custom-evaluation-progress[hidden] { display: none; }.custom-evaluation-progress .spinner { width: 24px; height: 24px; flex: 0 0 24px; margin: 0; border-width: 3px; }.custom-evaluation-progress b, .custom-evaluation-progress small { display: block; }.custom-evaluation-progress b { color: #1d5433; font-size: 11px; }.custom-evaluation-progress small { margin-top: 3px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.outreach-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 15px 0; }.outreach-summary > div { padding: 13px 15px; border: 1px solid var(--line); border-radius: 12px; background: white; }.outreach-summary span { display: block; color: var(--muted); font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .45px; }.outreach-summary b { display: block; margin-top: 6px; color: var(--green); font-size: 24px; letter-spacing: -.5px; }
.outreach-toolbar { display: grid; gap: 9px; margin: 0 0 18px; }.outreach-filter-row { display: flex; gap: 7px; overflow-x: auto; padding: 2px; }.outreach-filter { flex: 0 0 auto; border: 1px solid var(--line); border-radius: 999px; background: white; color: #536158; padding: 8px 11px; cursor: pointer; font: inherit; font-size: 11px; font-weight: 750; white-space: nowrap; }.outreach-filter b { margin-left: 3px; color: inherit; }.outreach-filter:hover { border-color: #a9c0ae; }.outreach-filter.active { border-color: var(--green); background: var(--green); color: white; }.outreach-job-filters { border-top: 1px solid #e6ece6; padding-top: 10px; }.outreach-count { color: var(--muted); font-size: 11px; }
.outreach-search-box { display: grid; grid-template-columns: 115px minmax(0, 1fr); align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid #dce6de; border-radius: 13px; background: #f7faf7; }
.outreach-search-box > label { color: #31513e; font-size: 11px; font-weight: 850; }
.outreach-group { margin-top: 24px; }.outreach-group:first-of-type { margin-top: 0; }.outreach-group-head { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; margin: 0 2px 10px; }.outreach-group-head h2 { margin: 3px 0 2px; font-size: 18px; }.outreach-group-head p { margin: 0; color: var(--muted); font-size: 12px; }.sequence-card-head h3 { margin: 8px 0 3px; font-size: 17px; }.sequence-role { display: grid; gap: 2px; margin-top: 14px; padding: 10px 11px; border: 1px solid #dce8de; border-radius: 10px; background: #f5faf5; }.sequence-role span { color: #668071; font-size: 9px; font-weight: 850; letter-spacing: .6px; text-transform: uppercase; }.sequence-role b { color: #1c3c2b; font-size: 12px; }.sequence-role small { color: var(--muted); font-size: 11px; }
.next-copy { color: var(--muted); line-height: 1.35; min-width: 180px; display: block; }.status-explainer { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; padding: 13px; border: 1px solid #c9dfcc; border-radius: 12px; background: #f3f9f3; font-size: 12px; line-height: 1.5; margin-bottom: 13px; }.status-explainer b, .status-explainer strong { color: var(--green); }
.retry-profile { margin-top: 9px; white-space: nowrap; }
@media (max-width: 980px) { .flow.five { grid-template-columns: repeat(3, 1fr); }.component-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 650px) { .flow.five { grid-template-columns: 1fr; }.flow.five .flow-step { border-right: 0; border-bottom: 1px solid var(--line); }.component-strip { grid-template-columns: 1fr; }.job-progress { align-items: flex-start; flex-direction: column; }.job-counts { grid-template-columns: 1fr 1fr 1fr; }.outreach-summary { grid-template-columns: 1fr 1fr; }.outreach-search-box { grid-template-columns: 1fr; }.outreach-group-head { align-items: flex-start; flex-direction: column; }.status-explainer { grid-template-columns: 1fr; }.action-inbox-item { align-items: flex-start; flex-direction: column; }.action-inbox-item .btn { width: 100%; }.custom-candidate-callout { align-items: stretch; flex-direction: column; }.custom-candidate-callout .btn { width: 100%; }.custom-candidate-flow { grid-template-columns: 1fr; }.custom-role-summary { align-items: flex-start; flex-direction: column; }.resume-upload-panel { grid-template-columns: 1fr; }.resume-upload-panel .btn { width: 100%; }.resume-upload-status { grid-column: 1; } td:nth-child(5), th:nth-child(5) { display: none; } }

/* Responsive interaction and feedback polish. */
html { scroll-behavior: smooth; }
body { min-width: 320px; overflow-x: hidden; }
button, a, input, textarea, select, summary { -webkit-tap-highlight-color: transparent; }
button, .btn, .job-progress, .job-filter button { transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease, opacity .18s ease; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, summary:focus-visible, [role="button"]:focus-visible { outline: 3px solid #78af90; outline-offset: 3px; }
.btn { min-height: 42px; line-height: 1.2; }
.btn[aria-busy="true"] { cursor: progress; opacity: .82; transform: none; filter: none; }
.button-spinner { width: 16px; height: 16px; flex: 0 0 16px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: spin .7s linear infinite; }
.initial-loading { min-height: 100vh; display: grid; place-content: center; justify-items: center; gap: 7px; padding: 24px; color: var(--ink); text-align: center; }
.initial-loading .spinner { margin: 0 0 10px; }
.initial-loading small { color: var(--muted); }
.main { min-width: 0; }
.card, .hero, .guide, .warning { box-shadow: 0 1px 2px rgba(20, 55, 38, .025); }
.card { overflow: hidden; }
.role-card, .talent-card, .sequence-card, .settings-card, .card.card-pad { overflow: visible; }
.nav button { min-height: 44px; }
.nav button.active { box-shadow: inset 3px 0 var(--lime); }
.avatar { flex: 0 0 34px; }
.person { min-width: 180px; }
.person > div { min-width: 0; }
.person small, .role-meta, .next-copy, .run-summary, .rubric-mini, .provider span { overflow-wrap: anywhere; }
.toolbar .actions { justify-content: flex-end; }
.modal-foot { flex-wrap: wrap; }
dialog { overflow: auto; overscroll-behavior: contain; }
dialog[open] { animation: dialog-in .18s ease-out; }
@keyframes dialog-in { from { opacity: 0; transform: translateY(8px) scale(.99); } }

/* Post-login setup banner. */
dialog:has(.onboarding-banner) { width: min(860px, calc(100vw - 32px)); max-height: min(88dvh, 760px); overflow: hidden; }
.onboarding-banner { position: relative; max-height: min(88dvh, 760px); padding: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
.onboarding-banner > .dialog-close { position: absolute; top: 13px; right: 13px; float: none; margin: 0; border-color: #ffffff55; background: #ffffffed; }
.onboarding-hero { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 23px 64px 23px 25px; color: #fff; background: radial-gradient(circle at 88% 12%, #dfff5530, transparent 28%), linear-gradient(135deg, #102e22, #1d6848); }
.onboarding-hero > div { max-width: 630px; }
.onboarding-hero .eyebrow { color: var(--lime); }
.onboarding-hero h2 { margin: 6px 0 7px; color: #fff; font-size: clamp(23px, 3vw, 29px); line-height: 1.08; letter-spacing: -.8px; }
.onboarding-hero p { margin: 0; color: #cfe1d5; font-size: 11px; line-height: 1.45; }
.onboarding-status { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; min-width: 142px; padding: 8px 10px; border: 1px solid #ffffff35; border-radius: 12px; background: #ffffff12; }
.onboarding-status > i { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 9px; background: #fff; color: var(--green); font-style: normal; font-weight: 900; }
.onboarding-status.complete > i { background: var(--lime); }
.onboarding-status small, .onboarding-status b { display: block; }
.onboarding-status small { color: #cfe1d5; font-size: 9px; text-transform: uppercase; letter-spacing: .45px; }
.onboarding-status b { margin-top: 2px; color: #fff; font-size: 12px; }
.onboarding-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 13px 14px 8px; background: #f8faf7; }
.onboarding-steps article { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 9px; min-height: 112px; padding: 13px; border: 1px solid #dce6dc; border-radius: 12px; background: #fff; box-shadow: 0 2px 8px #153a250d; }
.onboarding-steps article > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: #e8f4e7; color: var(--green); font-size: 10px; font-weight: 900; }
.onboarding-steps h3 { margin: 1px 0 5px; font-size: 13px; letter-spacing: -.15px; }
.onboarding-steps p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.4; }
.onboarding-steps .btn { width: fit-content; min-height: 30px; margin-top: 8px; padding: 6px 9px; font-size: 10px; }
.onboarding-steps code { padding: 2px 5px; border-radius: 5px; background: #eef3ed; color: #244d36; font-size: 10px; overflow-wrap: anywhere; }
.onboarding-steps .onboarding-final-step { min-height: 112px; border-color: #bad8bd; background: linear-gradient(135deg, #fff, #f0f9ef); }
.onboarding-foot { position: sticky; bottom: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 14px 13px; border-top: 1px solid #e4ebe3; background: #f8faf7f5; backdrop-filter: blur(8px); }
.onboarding-foot p { margin: 0; color: #4d6355; font-size: 11px; }
.onboarding-foot > div { display: flex; gap: 8px; flex: 0 0 auto; }
.onboarding-foot .btn { min-height: 34px; padding: 8px 10px; font-size: 11px; }
@media (max-width: 820px) { .onboarding-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }.onboarding-steps .onboarding-final-step { grid-column: 1 / -1; } }
@media (max-width: 720px) { dialog:has(.onboarding-banner) { width: calc(100vw - 20px); max-height: calc(100dvh - 20px); }.onboarding-banner { max-height: calc(100dvh - 20px); }.onboarding-hero { align-items: flex-start; display: grid; padding: 22px 54px 19px 17px; }.onboarding-status { min-width: 0; width: 100%; }.onboarding-steps { grid-template-columns: 1fr; padding: 11px 10px 6px; }.onboarding-steps article { min-height: 0; }.onboarding-steps .onboarding-final-step { grid-column: auto; min-height: 0; }.onboarding-foot { align-items: stretch; display: grid; padding: 10px; }.onboarding-foot > div { display: grid; grid-template-columns: 1fr; }.onboarding-foot .btn { width: 100%; } }
@media (max-width: 420px) { .onboarding-steps article { grid-template-columns: 32px minmax(0, 1fr); padding: 14px 12px; }.onboarding-steps article > span { width: 30px; height: 30px; }.onboarding-hero h2 { font-size: 24px; } }

@media (max-width: 1180px) {
  .main { padding: 26px 24px 54px; }
  .two-col { grid-template-columns: 1fr; }
  .hero { grid-template-columns: minmax(0, 1fr) minmax(280px, .65fr); }
  td, th { padding-left: 13px; padding-right: 13px; }
}

@media (max-width: 980px) {
  .sidebar { position: sticky; top: 0; z-index: 20; box-shadow: 0 8px 24px #08201826; }
  .brand { display: none; }
  .nav { scrollbar-width: none; margin-inline: -4px; }
  .nav::-webkit-scrollbar, .job-filter::-webkit-scrollbar { display: none; }
  .nav button { flex: 0 0 auto; padding: 10px 13px; }
  .nav button.active { box-shadow: inset 0 -3px var(--lime); }
  .hero { grid-template-columns: 1fr; }
  .hero-side { display: grid; grid-template-columns: repeat(3, 1fr); }
  .safety-line { margin: 0; }
  .toolbar { align-items: flex-start; }
  .flow.five { overflow-x: auto; grid-template-columns: repeat(5, minmax(180px, 1fr)); }
  .flow.five .flow-step { border-bottom: 0; }
}

@media (max-width: 720px) {
  .main { padding: 20px 14px 44px; }
  .topbar { align-items: flex-start; margin-bottom: 20px; }
  .topbar > div { min-width: 0; }
  .topbar h1 { font-size: clamp(23px, 7vw, 28px); }
  .topbar p { line-height: 1.45; }
  .mode-pill { flex: 0 0 auto; padding: 7px 9px; }
  .hero { padding: 22px 19px; border-radius: 16px; }
  .hero-side { display: none; }
  .hero h2 { font-size: clamp(24px, 8vw, 30px); }
  .hero .btn { width: 100%; }
  .toolbar { display: grid; grid-template-columns: 1fr; }
  .toolbar .actions, .actions.compact { display: grid; grid-template-columns: 1fr; width: 100%; }
  .topbar .topbar-actions { display: flex; width: auto; }
  .toolbar .btn { width: 100%; }
  .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .metric { padding: 14px; }
  .metric:last-child { grid-column: auto; }
  .provider-grid { grid-template-columns: 1fr; }
  .role-grid, .talent-grid, .sequence-grid { grid-template-columns: minmax(0, 1fr); }
  .card-head { align-items: flex-start; padding: 15px; }
  .card-head .btn { flex: 0 0 auto; }
  .card-pad, .role-card, .talent-card, .sequence-card, .settings-card { padding: 16px; }
  .guide { align-items: flex-start; display: grid; }
  .guide span { align-items: flex-start; }
  .component-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .candidate-result { align-items: flex-start; }
  .token-row { grid-template-columns: 1fr; }
  .token-row .btn { width: 100%; }
  .modal { padding: 19px 16px; }
  .modal-head { align-items: flex-start; }
  .modal-foot { display: grid; grid-template-columns: 1fr; }
  .modal-foot .btn { width: 100%; }
  dialog, dialog:has(.wide) { width: calc(100vw - 20px); max-height: calc(100dvh - 20px); }
  #toast { left: 14px; right: 14px; bottom: 14px; max-width: none; }

  .candidate-table, .candidate-table tbody, .candidate-table tr, .candidate-table td { display: block; width: 100%; }
  .candidate-table thead { display: none; }
  .candidate-table tbody { padding: 10px; }
  .candidate-table tr { border: 1px solid var(--line); border-radius: 13px; margin-bottom: 10px; padding: 5px 13px; background: white; }
  .candidate-table tr:last-child { margin-bottom: 0; }
  .candidate-table td, .candidate-table td:nth-child(2), .candidate-table td:nth-child(5) { display: grid; grid-template-columns: minmax(96px, .36fr) minmax(0, 1fr); align-items: start; gap: 12px; padding: 10px 0; border-bottom: 1px solid #e8eee8; }
  .candidate-table td:last-child { border-bottom: 0; }
  .candidate-table td::before { content: attr(data-label); color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; padding-top: 3px; }
  .candidate-table td:first-child { grid-template-columns: 1fr; }
  .candidate-table td:first-child::before { display: none; }
  .candidate-table .person { min-width: 0; }
  .candidate-table .next-copy { min-width: 0; }
}

@media (max-width: 460px) {
  .sidebar { padding: 10px; }
  .nav { gap: 3px; }
  .nav button { padding: 9px 10px; font-size: 12px; }
  .nav-icon { width: 17px; }
  .topbar { display: grid; }
  .topbar .topbar-actions { width: 100%; justify-content: flex-start; }
  .notification-panel { position: fixed; top: 82px; right: 10px; left: 10px; width: auto; }
  .mode-pill { justify-self: start; }
  .metrics { grid-template-columns: 1fr 1fr; }
  .flow, .flow.five { display: grid; grid-template-columns: 1fr; overflow: visible; }
  .flow-step, .flow.five .flow-step { border-right: 0; border-bottom: 1px solid var(--line); }
  .flow-step:last-child, .flow.five .flow-step:last-child { border-bottom: 0; }
  .split { flex-wrap: wrap; }
  .job-counts { gap: 5px; }
  .job-counts span { padding: 8px 6px; }
  .actions > .btn { flex: 1 1 100%; }
  .card-head { display: grid; }
  .card-head .btn { width: 100%; }
  .candidate-table td, .candidate-table td:nth-child(2), .candidate-table td:nth-child(5) { grid-template-columns: 82px minmax(0, 1fr); }
  .component-grid { grid-template-columns: 1fr; }
}

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

.login-page { position: relative; display: grid; width: 100%; height: 100vh; height: 100dvh; min-height: 0; place-items: stretch; overflow: hidden; padding: 0; background: #eef3ed; }
.login-page::before { position: fixed; inset: 0; z-index: -2; background: linear-gradient(135deg, #f6f9f3 0%, #edf3ec 52%, #e7f0e8 100%); content: ''; }
.login-glow { position: fixed; z-index: -1; width: 430px; height: 430px; border-radius: 50%; filter: blur(1px); pointer-events: none; }.login-glow-one { top: -210px; left: -120px; background: radial-gradient(circle, #d9ff7980 0, #d9ff7900 70%); }.login-glow-two { right: -180px; bottom: -250px; background: radial-gradient(circle, #6ea8843a 0, #6ea88400 70%); }
.login-shell { display: grid; grid-template-columns: minmax(0, 1fr) minmax(440px, 1fr); width: 100%; height: 100vh; height: 100dvh; min-height: 0; max-height: none; overflow: hidden; border: 0; border-radius: 0; background: #fff; box-shadow: none; }
.login-showcase { position: relative; display: flex; min-width: 0; min-height: 0; flex-direction: column; overflow: hidden; padding: clamp(28px, 5.2vh, 54px); background: radial-gradient(circle at 90% 8%, #d9ff7929 0, transparent 28%), radial-gradient(circle at 4% 92%, #8ebca326 0, transparent 30%), linear-gradient(145deg, #0d2a1f 0%, #164a35 68%, #1b5a40 100%); color: #fff; }
.login-showcase::before { position: absolute; top: -75px; right: -95px; width: 260px; height: 260px; border: 1px solid #ffffff18; border-radius: 50%; box-shadow: 0 0 0 38px #ffffff08, 0 0 0 78px #ffffff05; content: ''; }
.showcase-brand, .login-mobile-brand { display: flex; align-items: center; gap: 12px; font-size: 20px; font-weight: 850; letter-spacing: -.45px; }.login-mark { display: grid; width: 44px; height: 44px; flex: 0 0 44px; place-items: center; margin: 0; border: 1px solid #ffffff1f; border-radius: 13px; background: #d9ff79; color: #123c2b; box-shadow: 0 8px 22px #081d1430; font-size: 22px; font-weight: 950; }
.showcase-content { position: relative; z-index: 1; max-width: 570px; margin: auto 0; padding: clamp(20px, 4.5vh, 44px) 0; }.showcase-badge { display: inline-flex; gap: 9px; align-items: center; padding: 7px 11px; border: 1px solid #ffffff25; border-radius: 999px; background: #ffffff0d; color: #d5e8dc; font-size: 11px; font-weight: 750; letter-spacing: .2px; }.showcase-badge i { width: 7px; height: 7px; border-radius: 50%; background: #d9ff79; box-shadow: 0 0 0 4px #d9ff7918; }
.showcase-content h2 { max-width: 550px; margin: clamp(15px, 2.5vh, 23px) 0 clamp(10px, 1.8vh, 16px); font-size: clamp(36px, 5.7vh, 55px); line-height: 1.02; letter-spacing: -2.5px; }.showcase-content > p { max-width: 500px; margin: 0; color: #bfd3c7; font-size: clamp(13px, 1.8vh, 15px); line-height: 1.6; }
.showcase-features { display: grid; gap: clamp(3px, .8vh, 8px); margin-top: clamp(20px, 3.5vh, 32px); }.showcase-features > div { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; align-items: center; padding: clamp(6px, 1.1vh, 10px) 12px; border: 1px solid transparent; border-radius: 13px; transition: .2s ease; }.showcase-features > div:hover { border-color: #ffffff18; background: #ffffff09; }.showcase-features > div > span { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid #ffffff25; border-radius: 10px; color: #d9ff79; font-size: 10px; font-weight: 850; }.showcase-features p, .showcase-features b, .showcase-features small { display: block; margin: 0; }.showcase-features b { font-size: 13px; }.showcase-features small { margin-top: 3px; color: #a9c2b3; font-size: 11px; line-height: 1.35; }
.showcase-foot { display: flex; gap: 10px; align-items: center; color: #8eae9c; font-size: 10px; font-weight: 650; letter-spacing: .35px; text-transform: uppercase; }
.login-card { display: flex; min-width: 0; min-height: 0; overflow: hidden; align-items: center; justify-content: center; padding: clamp(28px, 5.5vh, 62px); background: #fff; }.login-card-inner { width: min(100%, 430px); }.login-mobile-brand { display: none; }
.login-heading { margin-bottom: clamp(21px, 3.2vh, 30px); }.login-kicker { display: inline-flex; margin-bottom: 9px; color: #2d704c; font-size: 10px; font-weight: 850; letter-spacing: 1px; text-transform: uppercase; }.login-card h1 { margin: 0 0 9px; color: #142019; font-size: clamp(32px, 5vh, 42px); line-height: 1.05; letter-spacing: -1.7px; }.login-copy { margin: 0; color: #68776d; font-size: clamp(12px, 1.65vh, 14px); line-height: 1.55; }
.login-form { display: grid; gap: 16px; }.login-form[hidden] { display: none !important; }.login-form label { display: grid; gap: 8px; color: #26372d; font-size: 12px; font-weight: 800; }.login-input-wrap { position: relative; display: block; }.login-input-wrap > svg { position: absolute; top: 50%; left: 16px; width: 19px; height: 19px; fill: none; stroke: #7b8b81; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; transform: translateY(-50%); pointer-events: none; }.login-form input { width: 100%; height: 54px; padding: 0 16px; border: 1px solid #ccd8ce; border-radius: 13px; background: #fbfcfa; color: var(--ink); outline: none; transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; }.login-input-wrap input { padding-left: 47px; }.login-form input::placeholder { color: #9ba79f; }.login-form input:focus { border-color: #538e68; background: #fff; box-shadow: 0 0 0 4px #2d805317; }
.login-button { width: 100%; min-height: 54px; justify-content: center; gap: 10px; margin-top: 2px; border-radius: 13px; background: #d9ff79; color: #123424; box-shadow: 0 9px 20px #99c93e24; font-size: 13px; }.login-button:hover { background: #d2fa6b; box-shadow: 0 12px 24px #99c93e32; }.login-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.login-divider { display: grid; grid-template-columns: 1fr auto 1fr; gap: 13px; align-items: center; margin: 24px 0 16px; color: #8a978e; font-size: 10px; font-weight: 700; letter-spacing: .25px; text-transform: uppercase; }.login-divider::before, .login-divider::after { height: 1px; background: #e2e9e3; content: ''; }.google-login[hidden], .login-divider[hidden] { display: none !important; }
.google-login { width: 100%; min-height: 52px; justify-content: center; gap: 11px; margin: 0; border: 1px solid #d7e0d8; border-radius: 13px; background: #fff; color: #1e2c24; box-shadow: 0 3px 8px rgba(16,46,34,.04); text-decoration: none; font-size: 13px; font-weight: 800; }.google-login:hover { border-color: #9db3a2; background: #fafcf9; box-shadow: 0 8px 18px rgba(16,46,34,.08); }.google-login img { width: 22px; height: 22px; flex: 0 0 22px; border-radius: 50%; object-fit: cover; }
.login-note { display: flex; gap: 9px; align-items: flex-start; margin-top: clamp(16px, 2.7vh, 25px); padding-top: clamp(14px, 2vh, 19px); border-top: 1px solid #edf1ed; color: #77847b; font-size: 10px; line-height: 1.45; }.login-note svg { width: 16px; height: 16px; flex: 0 0 16px; fill: none; stroke: #557162; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.otp-form { gap: 15px; }.otp-delivery { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; align-items: center; margin-bottom: 4px; padding: 13px; border: 1px solid #dce7dd; border-radius: 14px; background: #f5f9f3; }.otp-delivery > span { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 12px; background: #e4f3da; color: #285d3e; }.otp-delivery svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }.otp-delivery p { min-width: 0; margin: 0; color: #66756b; font-size: 11px; line-height: 1.45; }.otp-delivery b { display: block; overflow-wrap: anywhere; color: #22362a; font-size: 12px; }
.otp-field { display: grid; gap: 8px; }.otp-label { color: #26372d; font-size: 12px; font-weight: 800; }.otp-inputs { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }.otp-digit { min-width: 0; height: 57px !important; padding: 0 !important; border: 1px solid #cfdbd1 !important; border-radius: 12px !important; background: #fbfcfa !important; color: #15241a !important; font: 800 22px/1 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important; text-align: center; caret-color: #225c3e; }.otp-digit:focus { border-color: #4f8b65 !important; background: #fff !important; box-shadow: 0 0 0 4px #2d805317 !important; }.login-resend { width: 100%; min-height: 48px; justify-content: center; border-radius: 12px; font-size: 12px; }.login-back { justify-self: center; padding: 3px 5px; border: 0; background: transparent; color: #426b52; font-size: 11px; font-weight: 750; text-decoration: underline; text-decoration-color: #b8cbbb; text-underline-offset: 3px; }.login-back:hover { color: #17492f; }
.otp-success { margin: -2px 0 0; padding: 10px 12px; border: 1px solid #bfe0c6; border-radius: 10px; background: #edf8ef; color: #216a3b; font-size: 11px; font-weight: 700; }.login-error { margin: 14px 0 0; padding: 10px 12px; border: 1px solid #efc5c1; border-radius: 10px; background: #fff3f2; color: #a13d38; font-size: 11px; font-weight: 700; line-height: 1.45; }
.login-dialog { width: min(410px, calc(100vw - 32px)); border: 0; border-radius: 20px; padding: 0; color: var(--ink); box-shadow: 0 28px 90px rgba(11,36,26,.3); }.login-dialog::backdrop { background: rgba(8,28,20,.62); backdrop-filter: blur(5px); }.login-dialog section { display: grid; justify-items: center; gap: 12px; padding: 31px; text-align: center; }.login-dialog-icon { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 14px; background: #fff0ee; color: #a43e38; font-size: 20px; font-weight: 900; }.login-dialog h2 { margin: 2px 0 0; font-size: 21px; }.login-dialog p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }.login-dialog-actions { display: flex; width: 100%; justify-content: center; margin-top: 6px; }.login-dialog-actions .btn { width: 100%; min-height: 48px; }
@media (max-height: 700px) and (min-width: 901px) { .showcase-content h2 { font-size: 38px; letter-spacing: -1.8px; }.showcase-features > div { padding-block: 4px; }.showcase-features small { font-size: 10px; }.showcase-foot { display: none; }.login-card { padding-block: 24px; }.login-heading { margin-bottom: 18px; }.login-form { gap: 12px; }.login-divider { margin: 16px 0 12px; }.login-note { margin-top: 14px; padding-top: 12px; }.otp-delivery { padding: 10px; }.otp-digit { height: 49px !important; }.login-resend { min-height: 43px; } }
@media (max-width: 900px) { .login-page { padding: 0; }.login-shell { grid-template-columns: 1fr; width: 100%; height: 100vh; height: 100dvh; min-height: 0; }.login-showcase { display: none; }.login-card { padding: clamp(25px, 5vh, 44px) 48px; }.login-mobile-brand { display: flex; margin-bottom: clamp(24px, 6vh, 44px); }.login-mobile-brand .login-mark { width: 40px; height: 40px; flex-basis: 40px; border: 0; background: #173b2c; color: #d9ff79; font-size: 19px; } }
@media (max-width: 540px) { .login-page { display: block; padding: 0; background: #fff; }.login-glow { display: none; }.login-shell { width: 100%; height: 100vh; height: 100dvh; min-height: 0; border: 0; border-radius: 0; box-shadow: none; }.login-card { align-items: center; padding: clamp(20px, 4vh, 30px) 22px; }.login-card-inner { margin: 0; }.login-mobile-brand { position: absolute; top: clamp(18px, 3vh, 28px); left: 22px; margin: 0; }.login-heading { margin-bottom: clamp(20px, 3vh, 25px); }.login-card h1 { font-size: clamp(30px, 8.5vw, 34px); }.login-copy { font-size: 12px; }.otp-inputs { gap: 6px; }.otp-digit { height: clamp(46px, 7.5vh, 52px) !important; border-radius: 10px !important; font-size: 20px !important; }.login-note { margin-top: clamp(14px, 2.5vh, 22px); }.login-card.otp-mode .login-mobile-brand { opacity: .85; }.login-card.otp-mode .login-heading { margin-bottom: 18px; }.login-card.otp-mode .login-note { margin-top: 13px; padding-top: 12px; } }

.team-toolbar { margin-bottom: 20px; }
.team-toolbar .eyebrow { margin: 0 0 3px; }
.team-toolbar h3 { margin: 0; font-size: 20px; }
.team-card { max-width: 1120px; }
.team-card-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.team-card-head h3 { margin: 0 0 4px; }
.team-card-head p { margin: 0; color: var(--muted); font-size: 13px; }
.team-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-top: 18px; }
.team-user { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 76px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: #fbfdfb; }
.team-user.disabled { opacity: .62; background: #f7f7f5; }
.team-user .person { min-width: 0; }
.team-user .person small { display: block; margin-top: 2px; overflow-wrap: anywhere; }
.team-user-actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
@media (max-width: 820px) { .team-list { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .team-toolbar { display: grid; } .team-user { align-items: flex-start; display: grid; } .team-user-actions { width: 100%; justify-content: space-between; } }
@media (max-width: 1180px) and (min-width: 761px) {
  .activity-search-panel { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .activity-search-wide { grid-column: span 2; }
}
@media (max-width: 760px) {
  .activity-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .activity-search-panel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .activity-search-wide, .activity-search-actions { grid-column: 1 / -1; }
  .activity-toolbar { align-items: flex-start; display: grid; }
  .activity-filters { width: 100%; }
  .activity-count { padding-left: 3px; }
  .activity-timeline .event { padding: 14px; }
}
@media (max-width: 430px) {
  .activity-summary { grid-template-columns: 1fr 1fr; gap: 8px; }
  .activity-search-panel { grid-template-columns: 1fr; }
  .activity-search-wide, .activity-search-actions { grid-column: auto; }
  .activity-search-actions .btn { flex: 1; }
  .activity-summary > div { padding: 13px; }
  .event { grid-template-columns: 32px minmax(0, 1fr); gap: 10px; }
  .event-icon { width: 30px; height: 30px; }
  .event-top { align-items: flex-start; }
  .event-stage { display: none; }
}

/* User guide */
.setup-guide, .setup-guide-steps, .setup-guide-help { width: min(100%, 1080px); margin-inline: auto; }
.setup-guide { overflow: hidden; padding: 34px 28px 26px; border: 1px solid #1d5a40; border-radius: 20px; color: white; text-align: center; background: radial-gradient(circle at 85% 15%, #d9ff7925, transparent 24%), linear-gradient(135deg, #102e22, #1e6849); }
.setup-guide-intro { max-width: 660px; margin: auto; }.setup-guide .eyebrow { color: var(--lime); }.setup-guide h2 { margin: 9px 0 10px; font-size: clamp(28px, 4vw, 38px); letter-spacing: -1.4px; line-height: 1.08; }.setup-guide p { margin: 0; color: #cce0d2; line-height: 1.55; }
.setup-guide-status { display: inline-flex; gap: 9px; align-items: center; margin-top: 17px; padding: 8px 12px 8px 9px; border: 1px solid #ffffff35; border-radius: 999px; background: #ffffff12; text-align: left; }.setup-guide-status > span { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; background: var(--lime); color: var(--green); font-size: 13px; font-weight: 900; }.setup-guide-status small, .setup-guide-status b { display: block; }.setup-guide-status small { color: #cce0d2; font-size: 10px; }.setup-guide-status b { font-size: 12px; }
.setup-guide-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }.setup-step { display: flex; min-height: 280px; flex-direction: column; padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: white; }.setup-step.ready { border-color: #b9d9bf; background: linear-gradient(145deg, #fff, #f3fbf3); }.setup-step-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }.setup-step-number { color: var(--green); font-size: 12px; font-weight: 900; letter-spacing: 1px; }.setup-step-state { padding: 4px 7px; border-radius: 99px; background: var(--soft); color: #496a56; font-size: 10px; font-weight: 800; }.setup-step h3 { margin: 18px 0 7px; font-size: 18px; letter-spacing: -.35px; }.setup-step p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }.setup-step-action { margin-top: auto; padding-top: 16px; }.setup-step-action .btn { width: 100%; }.setup-guide-note { display: block; padding: 10px; border: 1px dashed #bdcabc; border-radius: 10px; color: var(--muted); font-size: 12px; line-height: 1.45; }
.setup-command { display: block; margin: 15px 0 10px; padding: 10px; border-radius: 9px; background: #102e22; color: #d9ff79; font-size: 12px; }.setup-mini-list { display: grid; gap: 6px; margin: 0; padding-left: 18px; color: #536158; font-size: 12px; line-height: 1.4; }.setup-mini-list code { padding: 1px 4px; border-radius: 4px; background: var(--soft); color: var(--green); }
.setup-token { display: flex; gap: 8px; align-items: center; margin-top: 16px; padding: 8px; border: 1px solid var(--line); border-radius: 10px; background: #fafcf9; }.setup-token code { min-width: 0; flex: 1; overflow: hidden; color: #3b5142; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.setup-hint { display: block; margin-top: 9px; color: var(--muted); font-size: 11px; line-height: 1.4; }.setup-result { display: grid; gap: 4px; margin-top: auto; padding: 12px; border: 1px solid #ead388; border-radius: 10px; background: #fff8df; color: #71581a; font-size: 12px; line-height: 1.45; }.setup-result.complete { border-color: #b9d9bf; background: #edf8ee; color: #24633b; }.setup-result span { color: inherit; }
.setup-guide-help { display: grid; grid-template-columns: 1.15fr repeat(3, 1fr); gap: 10px; align-items: start; margin-top: 18px; padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: white; }.guide-kicker { color: var(--green); font-size: 10px; font-weight: 850; letter-spacing: 1px; text-transform: uppercase; }.setup-guide-help h3 { margin: 4px 0 0; font-size: 17px; }.setup-guide-help details { padding: 2px 6px; }.setup-guide-help summary { cursor: pointer; color: var(--ink); font-size: 12px; font-weight: 800; line-height: 1.35; }.setup-guide-help summary::marker { color: var(--green); }.setup-guide-help p { margin: 8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
@media (max-width: 720px) { .setup-guide { padding: 27px 18px 21px; border-radius: 16px; }.setup-guide-steps, .setup-guide-help { grid-template-columns: 1fr; }.setup-step { min-height: 0; }.setup-guide-help details { border-top: 1px solid var(--line); padding: 12px 2px 0; }.setup-step-action .btn { width: 100%; } }
@media (max-width: 460px) { .setup-token { display: grid; }.setup-token .btn { width: 100%; } }
@media (max-width: 980px) { .sidebar-collapse { display: none; }.sidebar-collapsed { grid-template-columns: 1fr; }.sidebar-collapsed .sidebar { padding: 14px 18px; }.sidebar-collapsed .brand { display: none; }.sidebar-collapsed .nav-label, .sidebar-collapsed .sidebar-foot { display: none; }.sidebar-collapsed .nav button { justify-content: flex-start; padding: 10px 13px; font-size: inherit; }.sidebar-collapsed .nav-icon { width: 22px; font-size: inherit; }.sidebar-collapsed .nav button::after { display: none; } }