:root {
    --bg: #f4f6fb;
    --surface: #ffffff;
    --ink: #101526;
    --muted: #71788f;
    --line: #e6e9f2;
    --navy: #0c1121;
    --violet: #6755e7;
    --violet-soft: #eeeafd;
    --cyan: #16a9c7;
    --green: #0e9f6e;
    --amber: #d18b18;
    --red: #db4a60;
    --shadow: 0 14px 40px rgba(23, 30, 60, .08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    min-height: 100vh;
    background: var(--bg);
    color: var(--ink);
    font-family: "Alexandria", "Segoe UI", Tahoma, sans-serif;
    font-size: 14px;
}
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }

.login-page { display: grid; place-items: center; padding: 22px; background: radial-gradient(circle at top, #262b58, #0c1121 58%); }
.login-shell { width: min(430px, 100%); margin: 0; }
.login-card { padding: 36px; border-radius: 24px; background: var(--surface); box-shadow: 0 24px 80px rgba(0, 0, 0, .28); }
.login-card h1 { margin: 10px 0; }
.login-card p { color: var(--muted); line-height: 1.8; }
.login-card label { display: grid; gap: 9px; margin: 22px 0 16px; font-weight: 700; }
.login-card input { width: 100%; padding: 13px 14px; border: 1px solid var(--line); border-radius: 12px; }
.login-card .primary-button { width: 100%; justify-content: center; }

.sidebar {
    position: fixed;
    inset: 0 0 0 auto;
    z-index: 30;
    width: 260px;
    max-height: 100vh;
    max-height: 100dvh;
    padding: 28px 20px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(167, 152, 255, .48) rgba(255, 255, 255, .04);
    color: #eef0fa;
    background:
        radial-gradient(circle at 20% 10%, rgba(103, 85, 231, .22), transparent 30%),
        linear-gradient(165deg, #11172a, #090d19 70%);
    display: flex;
    flex-direction: column;
    box-shadow: -8px 0 30px rgba(10, 15, 30, .12);
}
.sidebar::-webkit-scrollbar { width: 7px; }
.sidebar::-webkit-scrollbar-track { background: rgba(255,255,255,.035); }
.sidebar::-webkit-scrollbar-thumb { border-radius: 100px; background: rgba(167,152,255,.45); }
.brand { display: flex; align-items: center; gap: 12px; padding: 2px 10px 30px; }
.brand-mark {
    width: 43px; height: 43px; display: grid; place-items: center;
    border-radius: 14px; font-size: 21px; font-weight: 700;
    background: linear-gradient(135deg, #8d7cf6, #5140c9);
    box-shadow: 0 10px 22px rgba(103, 85, 231, .35);
}
.brand strong, .brand small { display: block; }
.brand strong { font-size: 20px; }
.brand small { color: #8f97af; margin-top: 3px; font-size: 11px; }
.sidebar nav { display: grid; gap: 7px; flex: 0 0 auto; }
.nav-item {
    width: 100%; border: 0; border-radius: 12px; padding: 12px 14px;
    background: transparent; color: #9ea5ba; display: flex; align-items: center;
    gap: 12px; text-align: right; transition: .2s ease;
}
.nav-item span { width: 22px; color: #707991; font-size: 17px; }
.nav-item b { margin-right: auto; min-width: 22px; height: 22px; border-radius: 9px; display: grid; place-items: center; background: #292e48; color: #bfc5d7; font-size: 11px; }
.nav-item:hover { color: #fff; background: rgba(255,255,255,.05); }
.nav-item.active { color: #fff; background: linear-gradient(90deg, rgba(103,85,231,.24), rgba(103,85,231,.08)); box-shadow: inset -3px 0 #8a78f3; }
.nav-item.active span { color: #a798ff; }
.sidebar-foot { margin-top: auto; flex: 0 0 auto; padding: 15px; display: flex; align-items: center; gap: 10px; border: 1px solid rgba(255,255,255,.07); border-radius: 14px; background: rgba(255,255,255,.025); }
.sidebar-foot strong, .sidebar-foot small { display: block; }
.sidebar-foot strong { font-size: 11px; }
.sidebar-foot small { color: #788198; font-size: 9px; margin-top: 3px; }
.safety-dot { width: 11px; height: 11px; border-radius: 50%; background: #3ed39a; box-shadow: 0 0 0 5px rgba(62,211,154,.1), 0 0 16px rgba(62,211,154,.45); flex: 0 0 auto; }

main { margin-right: 260px; min-height: 100vh; }
.topbar {
    height: 94px; padding: 0 40px; display: flex; align-items: center; gap: 18px;
    background: rgba(255,255,255,.92); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line);
    position: sticky; top: 0; z-index: 20;
}
.topbar h1 { margin: 3px 0 0; font-size: 22px; }
.eyebrow { margin: 0; color: var(--violet); font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.top-actions { margin-right: auto; display: flex; gap: 10px; }
.menu-button { display: none; width: 40px; height: 40px; border-radius: 10px; border: 1px solid var(--line); background: #fff; }
.page-section { padding: 34px 40px 56px; max-width: 1460px; margin: 0 auto; }
.page-section[hidden] { display: none; }

.primary-button, .ghost-button, .small-button, .text-button {
    border: 0; border-radius: 10px; padding: 11px 17px; font-weight: 600; transition: .18s ease; display: inline-flex; align-items: center; justify-content: center; gap: 7px;
}
.primary-button { color: #fff; background: linear-gradient(135deg, #7563eb, #5845cf); box-shadow: 0 8px 18px rgba(94,73,213,.2); }
.primary-button:hover { transform: translateY(-1px); box-shadow: 0 11px 22px rgba(94,73,213,.28); }
.primary-button:disabled, .small-button:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.ghost-button { background: #fff; color: #4e5570; border: 1px solid var(--line); }
.ghost-button:hover { border-color: #c9c1fa; color: var(--violet); }
.small-button { padding: 9px 13px; background: var(--violet-soft); color: #5543cc; white-space: nowrap; }
.text-button { background: transparent; padding-inline: 5px; color: var(--violet); }
.wide { width: 100%; }

.flash-stack { position: fixed; z-index: 100; top: 105px; left: 30px; display: grid; gap: 10px; max-width: 420px; }
.flash { display: flex; gap: 14px; align-items: center; color: #fff; border-radius: 12px; padding: 14px 16px; box-shadow: var(--shadow); animation: slideIn .25s ease both; }
.flash.success { background: #11795b; }
.flash.error { background: #a9374a; }
.flash button { margin-right: auto; border: 0; background: transparent; color: inherit; font-size: 20px; }
@keyframes slideIn { from { opacity: 0; transform: translateY(-10px); } }

.hero-card {
    min-height: 310px; padding: 42px 48px; border-radius: 24px; overflow: hidden; position: relative;
    color: #fff; background:
        radial-gradient(circle at 22% 130%, rgba(83, 207, 218, .16), transparent 32%),
        radial-gradient(circle at 78% -10%, rgba(139, 116, 251, .35), transparent 38%),
        linear-gradient(120deg, #0c1225, #191b3a 65%, #232053);
    display: flex; align-items: center; justify-content: space-between; box-shadow: 0 20px 50px rgba(21,26,55,.16);
}
.hero-card::before { content: ""; position: absolute; inset: 0; opacity: .22; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 28px 28px; }
.hero-card > * { position: relative; z-index: 1; }
.hero-card h2 { margin: 18px 0 13px; font-size: clamp(27px, 3vw, 42px); line-height: 1.45; }
.hero-card p { color: #aeb4c9; max-width: 610px; line-height: 1.95; margin: 0; }
.hero-actions { display: flex; gap: 18px; align-items: center; margin-top: 27px; }
.hero-card .text-button { color: #b9b2ff; }
.pill { display: inline-flex; gap: 7px; border-radius: 100px; padding: 7px 11px; font-size: 10px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.09); }
.pill.safe { color: #72e4bb; }

.orbit { width: 300px; height: 250px; position: relative; flex: 0 0 auto; margin-left: 30px; }
.orbit-ring { position: absolute; inset: 50% auto auto 50%; border: 1px solid rgba(157,145,255,.24); border-radius: 50%; transform: translate(-50%,-50%) rotate(-15deg); }
.ring-one { width: 230px; height: 120px; }
.ring-two { width: 165px; height: 230px; transform: translate(-50%,-50%) rotate(56deg); }
.orbit-core { position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%); width: 100px; height: 100px; display: grid; place-items: center; align-content: center; border-radius: 31px; font-size: 28px; font-weight: 700; background: linear-gradient(145deg, #8e7df8, #4537ad); box-shadow: 0 0 60px rgba(119,98,235,.55); }
.orbit-core small { display: block; font-size: 9px; margin-top: 1px; color: #d9d5ff; }
.orbit-node { position: absolute; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 15px; background: rgba(24,29,61,.86); border: 1px solid rgba(255,255,255,.14); color: #c6c0ff; box-shadow: 0 10px 30px rgba(0,0,0,.2); }
.node-a { top: 20px; left: 42px; }.node-b { top: 46px; right: 12px; color: #63ddb1; }.node-c { bottom: 11px; left: 82px; color: #75d9eb; }

.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 20px 0; }
.stat-card { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 20px; display: flex; align-items: center; gap: 15px; box-shadow: 0 5px 18px rgba(28,35,65,.035); }
.stat-card small, .stat-card strong { display: block; }
.stat-card small { color: var(--muted); font-size: 11px; }
.stat-card strong { font-size: 26px; margin-top: 4px; }
.stat-icon { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-weight: 700; font-size: 18px; }
.stat-icon.violet { background: #f0edff; color: #6d59e4; }.stat-icon.cyan { background: #e7f8fb; color: #0b9fbc; }.stat-icon.amber { background: #fff6e4; color: #cc8510; }.stat-icon.green { background: #e7f8f1; color: #10966c; }.stat-icon.red { background: #feecef; color: var(--red); }

.two-column { display: grid; grid-template-columns: 1.45fr .75fr; gap: 20px; }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 18px; padding: 25px; box-shadow: 0 7px 24px rgba(28,35,65,.04); }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 20px; }
.panel h3, .panel-heading h3 { margin: 5px 0 0; font-size: 17px; }
.timeline { display: grid; gap: 4px; }
.timeline-item { position: relative; display: grid; grid-template-columns: 18px 1fr; gap: 13px; padding: 10px 0; }
.timeline-item::after { content: ""; position: absolute; right: 6px; top: 28px; bottom: -8px; width: 1px; background: var(--line); }
.timeline-item:last-child::after { display: none; }
.timeline-item > span { width: 13px; height: 13px; border-radius: 50%; margin-top: 4px; background: #fff; border: 3px solid #7563e7; box-shadow: 0 0 0 4px #f1efff; z-index: 1; }
.timeline-item strong, .timeline-item small { display: block; }.timeline-item strong { font-size: 12px; }.timeline-item small { color: #9aa0b1; font-size: 9px; margin-top: 6px; direction: ltr; text-align: right; }
.focus-card { background: linear-gradient(160deg, #fbfaff, #f2efff); border-color: #dfd9ff; }
.focus-card h3 { font-size: 21px; line-height: 1.6; margin: 14px 0 8px; }.focus-card p { color: var(--muted); line-height: 1.8; }.focus-card .wide { margin-top: 15px; }
.mini-checks { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; color: #6e7290; font-size: 9px; }.mini-checks span { padding: 6px 8px; background: rgba(255,255,255,.7); border-radius: 7px; }

.section-intro { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 25px; }
.section-intro h2 { font-size: 29px; margin: 8px 0; }.section-intro p { color: var(--muted); max-width: 710px; line-height: 1.8; margin: 0; }
.count-badge { border-radius: 100px; padding: 8px 12px; background: var(--violet-soft); color: var(--violet); font-weight: 600; font-size: 11px; white-space: nowrap; }

.form-panel { padding: 0; overflow: hidden; }
.form-section { padding: 28px; border-bottom: 1px solid var(--line); }
.form-section-title { display: flex; gap: 13px; margin-bottom: 22px; }
.form-section-title > span { width: 33px; height: 33px; display: grid; place-items: center; border-radius: 10px; background: var(--violet-soft); color: var(--violet); font-size: 10px; font-weight: 700; }
.form-section-title h3 { margin: 0 0 5px; }.form-section-title p { margin: 0; color: var(--muted); font-size: 11px; }
.form-grid { display: grid; gap: 17px; margin-top: 17px; }.form-grid:first-of-type { margin-top: 0; }.form-grid.two { grid-template-columns: repeat(2, 1fr); }.form-grid.three { grid-template-columns: repeat(3, 1fr); }
label { display: grid; gap: 8px; color: #4a5167; font-size: 11px; font-weight: 600; }
.hint { color: #a2a6b4; font-size: 9px; font-weight: 400; margin-right: 6px; }
input, select, textarea { width: 100%; color: var(--ink); background: #fafbfe; border: 1px solid #dfe3ed; border-radius: 10px; padding: 11px 12px; outline: none; transition: .18s ease; }
textarea { resize: vertical; line-height: 1.75; }
input:focus, select:focus, textarea:focus { border-color: #8a7af1; background: #fff; box-shadow: 0 0 0 3px rgba(103,85,231,.09); }
.full { grid-column: 1 / -1; }
.form-footer { padding: 20px 28px; background: #fafbfe; display: flex; justify-content: flex-end; align-items: center; gap: 20px; }.form-footer span { color: var(--muted); font-size: 10px; }
.auto-mode-card { margin-top: 18px; padding: 17px; border: 1px solid #dcd6ff; border-radius: 14px; background: linear-gradient(135deg, #faf9ff, #f2efff); display: grid; grid-template-columns: 1fr 220px; align-items: center; gap: 20px; }
.auto-toggle { display: flex; align-items: center; gap: 12px; cursor: pointer; }
.auto-toggle > input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.auto-toggle > span { width: 44px; height: 24px; border-radius: 100px; background: #c8cada; position: relative; flex: 0 0 auto; transition: .2s; }
.auto-toggle > span::after { content: ""; position: absolute; width: 18px; height: 18px; border-radius: 50%; top: 3px; right: 3px; background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,.16); transition: .2s; }
.auto-toggle > input:checked + span { background: var(--violet); }
.auto-toggle > input:checked + span::after { transform: translateX(-20px); }
.auto-toggle strong, .auto-toggle small { display: block; }.auto-toggle strong { color: var(--ink); font-size: 11px; }.auto-toggle small { color: var(--muted); font-weight: 400; line-height: 1.6; margin-top: 4px; }
.inline-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

.connector-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-bottom: 20px; }
.connector-card { min-height: 190px; padding: 20px; border: 1px solid var(--line); border-radius: 17px; background: #fff; display: flex; flex-direction: column; box-shadow: 0 7px 24px rgba(28,35,65,.04); }
.connector-card.connected { border-color: #cfe9df; background: linear-gradient(145deg, #fff, #f7fffb); }
.connector-head { display: grid; grid-template-columns: 44px 1fr auto; gap: 12px; align-items: center; }
.connector-head h3 { margin: 0 0 5px; font-size: 14px; }.connector-head p { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.6; }
.connector-logo { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; font-weight: 700; font-size: 17px; }
.connector-logo.gmail { color: #c43d45; background: #fff0f1; }.connector-logo.linkedin { color: #fff; background: #0a66c2; font-family: Arial, sans-serif; }.connector-logo.search { color: #5d49d4; background: var(--violet-soft); }
.connection-state { padding: 6px 8px; border-radius: 100px; color: #9a6b14; background: #fff3dd; font-size: 8px; font-weight: 700; white-space: nowrap; }.connected .connection-state { color: #087951; background: #e4f7ee; }
.connector-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: auto; padding-top: 20px; }.connector-actions form { margin: 0; }
.connector-hint { color: var(--muted); font-size: 8px; line-height: 1.6; margin-top: 10px; }
.source-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 20px; }.source-pills span { padding: 6px 8px; border-radius: 7px; background: #f1f3f8; color: #616980; font-size: 8px; }
.source-watch-panel { padding: 0; overflow: hidden; margin-bottom: 20px; }.source-watch-panel > .panel-heading { padding: 23px 24px 14px; }.source-watch-panel .panel-heading p { margin: 6px 0 0; color: var(--muted); font-size: 9px; line-height: 1.7; }
.watch-source-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.watch-source-row { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 15px 18px; border-bottom: 1px solid var(--line); }.watch-source-row:nth-child(odd) { border-left: 1px solid var(--line); }
.source-platform { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; color: #fff; font: 700 15px Arial, sans-serif; }.source-platform.snapchat { color: #111; background: #fffc00; }.source-platform.telegram { background: #229ed9; }
.watch-source-main { min-width: 0; }.watch-source-main strong, .watch-source-main span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.watch-source-main strong { font-size: 11px; }.watch-source-main span { margin-top: 4px; color: var(--muted); font-size: 8px; text-align: right; }
.source-check-state { justify-self: end; padding: 6px 8px; border-radius: 100px; color: #6a7083; background: #f0f1f5; font-size: 8px; font-weight: 700; white-space: nowrap; }.source-check-state.checked { color: #087951; background: #e4f7ee; }.source-check-state.new_content { color: #5f49d6; background: #eeeafd; }.source-check-state.error, .source-check-state.needs_login { color: #bf3c51; background: #feecef; }.source-check-state.interactive { color: #a66b10; background: #fff3dd; }
.source-check-time { grid-column: 2; display: flex; gap: 7px; color: var(--muted); font-size: 8px; }.source-check-time small { color: #a2a6b4; }.source-check-time time { direction: ltr; }.watch-source-row > .ghost-button { grid-column: 3; grid-row: 2; padding: 6px 9px; font-size: 8px; }
.watch-note { display: flex; gap: 9px; align-items: start; padding: 13px 20px; color: #70531e; background: #fffaf0; }.watch-note span { font-size: 13px; }.watch-note p { margin: 0; font-size: 9px; line-height: 1.7; }
.search-history-panel { padding: 0; overflow: hidden; }.search-history-panel > .panel-heading { padding: 23px 24px 4px; }
.search-runs { display: grid; }.search-run { display: grid; grid-template-columns: 12px 1fr auto; gap: 13px; align-items: start; padding: 16px 24px; border-top: 1px solid var(--line); }.search-run strong { font-size: 11px; }.search-run p { margin: 5px 0 0; color: var(--muted); font-size: 9px; }.search-run time { color: #9fa4b4; font-size: 8px; direction: ltr; }.search-run details { margin-top: 8px; color: #697086; font-size: 8px; }.search-run .search-note p { margin-top: 7px; padding: 9px 11px; border-radius: 8px; color: #596075; background: #f5f6fa; line-height: 1.7; }.search-run .search-note.actionable { color: #a76b10; }.search-run .search-note.actionable p { color: #865e17; background: #fff8e8; }
.run-state { width: 10px; height: 10px; margin-top: 3px; border-radius: 50%; background: #9da2b3; }.run-state.running { background: var(--violet); box-shadow: 0 0 0 4px var(--violet-soft); animation: pulse 1.4s infinite; }.run-state.completed { background: var(--green); }.run-state.completed_with_errors { background: var(--amber); }.run-state.failed { background: var(--red); }
@keyframes pulse { 50% { opacity: .45; transform: scale(.8); } }
.form-panel.small { padding: 25px; align-self: start; }.form-panel.small h3 { margin-top: 0; }.form-panel.small label { margin: 16px 0; }

.title-filters { display: flex; gap: 9px; margin-bottom: 18px; overflow: auto; padding-bottom: 3px; }
.chip { white-space: nowrap; border: 1px solid var(--line); background: #fff; color: #697086; border-radius: 100px; padding: 9px 14px; }
.chip.active { background: var(--navy); color: #fff; border-color: var(--navy); }
.title-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.title-card { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 15px; padding: 20px; transition: .2s ease; overflow: hidden; }
.title-card:hover { transform: translateY(-3px); border-color: #d4cef9; box-shadow: var(--shadow); }
.title-card h3 { margin: 15px 0 7px; font-size: 14px; }.title-card p { color: var(--muted); margin: 0; font-size: 11px; text-align: right; }
.dept-tag { display: inline-flex; padding: 5px 7px; border-radius: 6px; font-size: 8px; font-weight: 700; }.dept-tag.it { background: #ece9ff; color: #6651dc; }.dept-tag.finance { background: #e4f8ee; color: #0b9765; }.dept-tag.accounting { background: #fff3dd; color: #b9760d; }
.copy-title { border: 0; background: transparent; color: var(--violet); padding: 0; margin-top: 16px; font-size: 10px; }

.source-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 20px; }
.source-card { padding: 18px; border-radius: 15px; background: #fff; border: 1px solid var(--line); display: grid; gap: 6px; position: relative; transition: .18s ease; }
.source-card:hover { border-color: #cbc4f8; box-shadow: var(--shadow); transform: translateY(-2px); }.source-card > span { position: absolute; left: 14px; top: 12px; color: #aaa; }.source-card strong { font-size: 13px; }.source-card small { color: var(--muted); font-size: 9px; }
.table-panel { padding: 0; overflow: hidden; }.table-panel > .panel-heading { padding: 24px 25px 4px; }
.job-list { display: grid; }.job-row { padding: 18px 25px; display: grid; grid-template-columns: 48px minmax(220px,1fr) 70px auto auto; gap: 16px; align-items: center; border-top: 1px solid var(--line); }
.company-avatar { width: 45px; height: 45px; border-radius: 13px; display: grid; place-items: center; color: #fff; font-weight: 700; font-size: 18px; background: linear-gradient(135deg,#343b60,#171d35); }
.job-main h4 { margin: 0 0 5px; font-size: 13px; }.job-main p, .job-main small { color: var(--muted); margin: 0; font-size: 9px; }.job-main small { display: block; margin-top: 6px; line-height: 1.65; }
.fit-score { text-align: center; }.fit-score strong, .fit-score span { display: block; }.fit-score strong { font-size: 16px; }.fit-score span { color: var(--muted); font-size: 8px; }.fit-score.good strong { color: var(--green); }.fit-score.medium strong { color: var(--amber); }.fit-score.low strong { color: var(--red); }
.job-row form { display: flex; gap: 7px; }.job-row select { width: 92px; padding: 8px; font-size: 9px; }
.status { display: inline-flex; align-items: center; justify-content: center; width: max-content; border-radius: 100px; padding: 6px 9px; font-size: 8px; font-weight: 700; background: #f0f1f5; color: #697086; }
.status.matched, .status.submitted, .status.applied { background: #e5f8ef; color: #0c9365; }.status.pending_approval, .status.prepared, .status.approved { background: #eeeafd; color: #6250d5; }.status.failed, .status.rejected { background: #feecef; color: #c83f54; }.status.needs_answer, .status.needs_review { background: #fff3de; color: #b9750b; }

.approval-list { display: grid; gap: 16px; }
.application-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 24px; box-shadow: 0 6px 20px rgba(28,35,65,.04); }
.application-head { display: flex; justify-content: space-between; align-items: start; gap: 20px; }.application-head h3 { margin: 10px 0 6px; }.application-head p { margin: 0; color: var(--muted); font-size: 10px; }
.notice { margin-top: 15px; border-radius: 10px; padding: 11px 13px; font-size: 10px; }.notice.warning { background: #fff8e9; color: #8e651d; }.notice.danger { background: #fff0f2; color: #a63749; }
.letter-preview { margin-top: 17px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }.letter-preview summary { padding: 13px 15px; cursor: pointer; color: #555c75; font-weight: 600; font-size: 10px; background: #fafbfe; }.letter-preview pre { white-space: pre-wrap; word-wrap: break-word; margin: 0; padding: 20px; line-height: 1.9; font-family: inherit; font-size: 11px; max-height: 360px; overflow: auto; direction: auto; }
.application-actions { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }.application-actions form { margin: 0; }.send-form, .manual-action, .issue-form { display: flex; align-items: center; gap: 8px; }.confirm-check { display: flex; align-items: center; gap: 7px; font-size: 9px; font-weight: 400; }.confirm-check input { width: auto; }.manual-action { background: #f7f8fb; border-radius: 10px; padding: 7px 9px; color: var(--muted); font-size: 9px; }.issue-form { margin-right: auto !important; }.issue-form select { width: 150px; }.issue-form input { width: 190px; }

.answers-layout { grid-template-columns: .7fr 1.3fr; }.answer-list { display: grid; gap: 10px; }.answer-list article { padding: 15px; border: 1px solid var(--line); border-radius: 12px; }.answer-list h4 { margin: 0 0 7px; font-size: 12px; }.answer-list p { margin: 0; color: #5f667c; line-height: 1.8; font-size: 11px; }.answer-list small { display: block; margin-top: 9px; color: #a0a5b4; font-size: 8px; }
.issues-list { display: grid; gap: 10px; }.issue-row { display: grid; grid-template-columns: 34px 1fr auto; gap: 12px; align-items: center; padding: 14px; border: 1px solid #f0dfe2; border-radius: 12px; background: #fffafb; }.issue-row > span { width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; background: #feecef; color: var(--red); font-weight: 700; }.issue-row strong { font-size: 11px; }.issue-row p { color: var(--muted); font-size: 10px; margin: 5px 0 0; }.issue-row em { color: var(--red); font-size: 9px; font-style: normal; }
.site-report-list { display: grid; gap: 16px; }.site-report-card { padding: 0; overflow: hidden; }.site-report-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 20px 22px; border-bottom: 1px solid var(--line); background: #fbfbfe; }.site-report-head h3 { margin: 5px 0 0; direction: ltr; text-align: right; }.site-job-block { padding: 20px 22px; border-bottom: 1px solid var(--line); }.site-job-block:last-child { border-bottom: 0; }.site-job-title { display: flex; align-items: center; justify-content: space-between; gap: 15px; }.site-job-title strong, .site-job-title b, .site-job-title small { display: block; }.site-job-title small { margin-top: 5px; color: var(--muted); font-size: 9px; }.missing-item-list { margin: 13px 0; padding: 0 18px 0 0; color: #9b4e25; font-size: 10px; line-height: 1.9; }.question-answer-form { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; margin-top: 12px; padding: 13px; border: 1px solid #ddd8fb; border-radius: 12px; background: #faf9ff; }.question-answer-form label span, .question-answer-form label strong { display: block; margin-bottom: 7px; }.question-answer-form label span { color: var(--violet); font-size: 8px; }.question-answer-form label strong { font-size: 11px; }.question-answer-form.compact { padding: 10px; }.add-site-question { margin-top: 12px; }.add-site-question summary { cursor: pointer; color: var(--violet); font-size: 9px; font-weight: 600; }.add-site-question form { display: grid; grid-template-columns: 1fr 1fr auto; gap: 8px; margin-top: 10px; }.source-issues-panel { margin-top: 16px; }
.privacy-panel { display: flex; align-items: center; gap: 16px; margin-top: 18px; background: #11172a; color: #fff; }.privacy-panel h3 { margin: 0 0 5px; }.privacy-panel p { margin: 0; color: #9ca4b9; font-size: 10px; line-height: 1.7; }
.location-picker { margin-top: 20px; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: #fafbfe; }
.location-picker-head { display: flex; justify-content: space-between; gap: 14px; align-items: baseline; margin-bottom: 14px; }.location-picker-head small, .location-source { color: var(--muted); font-size: 9px; }
.region-checks { display: flex; flex-wrap: wrap; gap: 8px; }.region-choice { cursor: pointer; }.region-choice input { position: absolute; opacity: 0; width: 1px; }.region-choice span { display: block; border: 1px solid var(--line); border-radius: 100px; padding: 8px 13px; background: #fff; font-size: 9px; }.region-choice input:checked + span { color: #fff; background: var(--violet); border-color: var(--violet); }
.place-choice-list { height: 245px; overflow-y: auto; display: grid; align-content: start; gap: 5px; margin-top: 8px; padding: 8px; border: 1px solid #dfe3ed; border-radius: 10px; background: #fff; }
.place-choice { cursor: pointer; }.place-choice input { position: absolute; opacity: 0; width: 1px; }.place-choice span { display: block; padding: 8px 9px; border: 1px solid transparent; border-radius: 8px; font-size: 9px; line-height: 1.5; }.place-choice:hover span { background: #f4f2ff; }.place-choice input:checked + span { color: #fff; background: var(--violet); border-color: var(--violet); }
.gmail-connect-form { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }.gmail-connect-form label { display: block; margin: 10px 0; }.gmail-connect-form .connector-actions { justify-content: flex-start; }
.document-list { display: grid; gap: 10px; }.document-list article { display: flex; gap: 12px; align-items: center; border: 1px solid var(--line); border-radius: 12px; padding: 12px; }.document-list article > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: #fff; background: var(--green); }.document-list strong, .document-list small { display: block; }.document-list small { margin-top: 4px; color: var(--muted); font-size: 9px; }.missing-docs { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 12px; }.missing-docs h4 { margin: 0 0 8px; }.missing-docs p { color: var(--red); font-size: 10px; }
.ocr-progress { position: relative; overflow: hidden; border-radius: 10px; background: #eceef5; min-height: 36px; margin: 12px 0; }.ocr-progress > span { position: absolute; inset: 0 auto 0 0; width: 0; background: rgba(103,85,231,.2); transition: width .2s; }.ocr-progress p { position: relative; z-index: 1; margin: 0; padding: 10px; text-align: center; font-size: 9px; }
.job-preferences { margin-top: 20px; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: #fafbfe; }
.department-checks { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }.department-choice { cursor: pointer; }.department-choice input { position: absolute; opacity: 0; width: 1px; }.department-choice span { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: #fff; transition: .18s ease; }.department-choice small { color: var(--muted); }.department-choice input:checked + span { color: #fff; border-color: var(--violet); background: var(--violet); box-shadow: 0 7px 20px rgba(103,85,231,.18); }.department-choice input:checked + span small { color: rgba(255,255,255,.8); }
.title-selector { display: block; margin-top: 18px; }.title-selector select { min-height: 285px; margin-top: 8px; }.title-selector option { padding: 7px; }.selection-summary { margin-top: 9px; color: var(--muted); font-size: 9px; }
.empty-state { grid-column: 1 / -1; min-height: 240px; display: grid; place-items: center; align-content: center; gap: 9px; color: var(--muted); text-align: center; }.empty-state.compact { min-height: 140px; }.empty-state strong { color: var(--ink); }.empty-state p { margin: 0; font-size: 10px; }.empty-icon { width: 46px; height: 46px; border-radius: 15px; display: grid; place-items: center; background: var(--violet-soft); color: var(--violet); font-size: 19px; }

.modal { width: min(760px, calc(100% - 30px)); max-height: 92vh; border: 0; border-radius: 20px; padding: 0; box-shadow: 0 30px 100px rgba(10,14,30,.35); }.modal::backdrop { background: rgba(9,13,25,.58); backdrop-filter: blur(4px); }.modal > form { padding: 27px; }.modal-head { display: flex; justify-content: space-between; align-items: start; margin-bottom: 20px; }.modal-head h2 { margin: 7px 0 0; }.modal-close { width: 35px; height: 35px; border: 1px solid var(--line); border-radius: 10px; background: #fff; font-size: 19px; }.modal-footer { display: flex; justify-content: flex-end; gap: 9px; margin-top: 22px; }
.report-modal { width: min(980px, calc(100% - 30px)); }.report-modal-body { padding: 26px; }.report-modal .modal-head p { max-width: 720px; margin: 8px 0 0; color: var(--muted); font-size: 10px; line-height: 1.8; }.modal-site-list { display: grid; gap: 12px; max-height: 62vh; overflow-y: auto; padding-left: 4px; }.modal-site-card { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }.modal-site-card > header { display: flex; justify-content: space-between; gap: 10px; padding: 13px 15px; background: #f7f6fd; }.modal-site-card > header strong { direction: ltr; }.modal-site-card > header span { color: var(--red); font-size: 9px; }.modal-site-card > section { padding: 14px 15px; border-top: 1px solid var(--line); }.modal-site-card a { color: var(--violet); font-size: 9px; }

@media (max-width: 1150px) {
    .sidebar { width: 225px; }.brand { padding-inline: 4px; } main { margin-right: 225px; }
    .page-section, .topbar { padding-left: 25px; padding-right: 25px; }
    .orbit { width: 230px; }.source-grid { grid-template-columns: repeat(3,1fr); }.title-grid { grid-template-columns: repeat(2,1fr); }
    .job-row { grid-template-columns: 45px minmax(180px,1fr) 65px auto; }.job-row form { grid-column: 2 / -1; }.application-actions { align-items: stretch; }.issue-form { width: 100%; margin-right: 0 !important; }
    .connector-grid { grid-template-columns: 1fr 1fr; }.discovery-card { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
    .sidebar { transform: translateX(105%); transition: .25s ease; width: 260px; }.sidebar.open { transform: translateX(0); }
    main { margin-right: 0; }.menu-button { display: block; }.topbar { height: 80px; padding: 0 16px; }.topbar h1 { font-size: 17px; }.top-actions .ghost-button { display: none; }
    .page-section { padding: 22px 16px 45px; }.hero-card { padding: 30px 25px; min-height: 340px; }.orbit { position: absolute; opacity: .2; left: -40px; }.hero-card > div:first-child { max-width: 560px; }
    .stats-grid { grid-template-columns: repeat(2,1fr); }.two-column, .answers-layout { grid-template-columns: 1fr; }.form-grid.three { grid-template-columns: 1fr 1fr; }.source-grid { grid-template-columns: repeat(2,1fr); }.department-checks { grid-template-columns: 1fr; }
    .connector-grid { grid-template-columns: 1fr; }.discovery-card { grid-column: auto; }
    .watch-source-list { grid-template-columns: 1fr; }.watch-source-row:nth-child(odd) { border-left: 0; }
    .application-head { flex-direction: column; }.issue-form { display: grid; grid-template-columns: 1fr; }.issue-form select, .issue-form input { width: 100%; }
    .question-answer-form, .add-site-question form { grid-template-columns: 1fr; }.site-job-title { align-items: start; flex-direction: column; }.report-modal-body { padding: 20px 14px; }
}

@media (max-width: 560px) {
    .top-actions .primary-button { padding: 10px; font-size: 0; }.top-actions .primary-button::after { content: "+"; font-size: 20px; }
    .hero-card { min-height: 390px; }.hero-card h2 { font-size: 27px; }.hero-actions { align-items: stretch; flex-direction: column; gap: 8px; }
    .stats-grid { grid-template-columns: 1fr; }.section-intro { align-items: start; flex-direction: column; }.section-intro h2 { font-size: 24px; }
    .form-grid.two, .form-grid.three, .title-grid, .source-grid { grid-template-columns: 1fr; }.form-section { padding: 22px 18px; }.form-footer { align-items: stretch; flex-direction: column; }
    .auto-mode-card { grid-template-columns: 1fr; }
    .inline-fields { grid-template-columns: 1fr; }.connector-head { grid-template-columns: 44px 1fr; }.connection-state { grid-column: 2; width: max-content; }.search-run { grid-template-columns: 10px 1fr; }.search-run time { grid-column: 2; }
    .watch-source-row { grid-template-columns: 36px minmax(0,1fr); }.source-check-state { grid-column: 2; justify-self: start; }.source-check-time { grid-column: 2; }.watch-source-row > .ghost-button { grid-column: 2; grid-row: auto; justify-self: start; }
    .job-row { grid-template-columns: 43px 1fr; padding: 16px; }.job-row .fit-score, .job-row .status { grid-column: auto; }.job-row form { grid-column: 1 / -1; }.job-row form select { flex: 1; }
    .application-card { padding: 18px; }.application-actions > form, .send-form, .manual-action { width: 100%; }.send-form { flex-wrap: wrap; }.confirm-check { width: 100%; }.modal > form { padding: 20px 16px; }
}
.watch-source-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px;padding-top:20px;border-top:1px solid var(--border)}
.watch-source-form label{display:flex;flex-direction:column;gap:7px;font-weight:700;color:var(--text)}
.watch-source-form .wide{grid-column:span 2}.watch-source-form button{align-self:end;min-height:46px}
@media(max-width:850px){.watch-source-form{grid-template-columns:1fr}.watch-source-form .wide{grid-column:auto}}