:root { --ink:#17342b; --deep:#143b2f; --green:#4b956a; --mint:#e9f6ea; --line:#e1ebe3; --muted:#82928a; --paper:#f7faf7; --gold:#f5c56e; }
* { box-sizing:border-box; } body { margin:0; color:var(--ink); background:var(--paper); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
button,input { font:inherit; } button { cursor:pointer; } .app { min-height:100vh; }
.auth-wrap { min-height:100vh; display:grid; grid-template-columns:1.1fr .9fr; background:#f5fbf5; }.auth-hero { padding:75px 9vw; background:var(--deep); color:#fff; position:relative; overflow:hidden; }.auth-hero:after { content:""; width:430px; height:430px; border:1px solid #b8d7b533; border-radius:50%; position:absolute; right:-150px; bottom:-120px; box-shadow:0 0 0 55px #b8d7b30a,0 0 0 110px #b8d7b30a; }.logo { font-size:22px; font-weight:800; letter-spacing:-1px; }.logo i { color:#b8dc8a; font-style:normal; }.auth-hero h1 { font-size:58px; line-height:1.02; letter-spacing:-3px; margin:130px 0 20px; max-width:530px; }.auth-hero h1 em { font-family:Georgia,serif; font-weight:400; color:#b8dc8a; }.auth-hero p { color:#b5d0bf; max-width:370px; line-height:1.6; font-size:15px; }.auth-card { align-self:center; width:min(440px,calc(100% - 42px)); margin:auto; background:#fff; padding:34px; border-radius:18px; box-shadow:0 20px 60px #224e3716; }.auth-card h2 { font-size:27px; margin:0 0 8px; letter-spacing:-1px; }.muted { color:var(--muted); font-size:13px; }.tabs { display:flex; gap:18px; margin:28px 0 22px; border-bottom:1px solid var(--line); }.tabs button { border:0; background:none; padding:0 0 12px; color:#9aa6a0; font-size:12px; }.tabs button.active { color:var(--green); border-bottom:2px solid var(--green); font-weight:700; }.field { display:block; margin:15px 0; color:#697c70; font-size:12px; }.field input { width:100%; margin-top:7px; border:1px solid var(--line); border-radius:8px; padding:12px; outline:none; color:var(--ink); }.field input:focus { border-color:#86bd96; box-shadow:0 0 0 3px #ccebd550; }.primary { width:100%; border:0; background:var(--deep); color:#fff; border-radius:8px; padding:13px 16px; font-weight:700; font-size:12px; }.primary:hover { background:#245d48; }.google { width:100%; border:1px solid var(--line); background:#fff; color:#52635a; border-radius:8px; padding:12px 16px; font-size:12px; margin-top:10px; }.divider { color:#a4afa9; font-size:10px; text-align:center; margin:18px 0; }.notice { border-radius:8px; padding:11px 12px; font-size:11px; margin:12px 0; background:#fff6e6; color:#8d651e; }.notice.error { background:#fff0ee; color:#a04a3e; }.hidden { display:none!important; }
.topbar { height:74px; background:#fff; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; padding:0 5%; }.topbar .logo { color:var(--deep); font-size:20px; }.topbar .logo i { color:var(--green); }.user-actions { display:flex; align-items:center; gap:12px; color:#6e8276; font-size:12px; }.avatar { width:34px; height:34px; border-radius:10px; background:#cdebd8; color:#286b49; display:grid; place-items:center; font-size:10px; font-weight:800; }.logout { border:0; background:#f4f8f4; color:#4c7d60; border-radius:7px; padding:8px 11px; font-size:10px; }
.dashboard { max-width:1180px; margin:auto; padding:46px 28px 70px; }.dash-intro { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; margin-bottom:28px; }.eyebrow { color:#96a49b; font-size:10px; font-weight:800; letter-spacing:1.2px; }.dash-intro h1 { font-size:38px; letter-spacing:-2px; line-height:1.08; margin:10px 0; }.dash-intro h1 em { font-family:Georgia,serif; color:#5a9a6f; font-weight:400; }.dash-intro p { color:var(--muted); font-size:13px; margin:0; }.status-chip { background:#e8f6e9; color:#43845c; border-radius:99px; padding:8px 11px; font-size:10px; white-space:nowrap; }.grid { display:grid; grid-template-columns:1.25fr .75fr; gap:16px; }.panel { background:#fff; border:1px solid var(--line); border-radius:14px; padding:22px; }.panel h2 { font-size:17px; letter-spacing:-.5px; margin:7px 0 5px; }.panel p { color:var(--muted); font-size:11px; line-height:1.5; }.panel-head { display:flex; align-items:flex-start; justify-content:space-between; }.upload { display:block; border:1px dashed #9ecda9; border-radius:11px; background:#f5fbf4; padding:25px; text-align:center; color:#4f8d65; margin-top:17px; }.upload strong { display:block; font-size:12px; }.upload span { display:block; color:#8b9b91; font-size:10px; margin-top:6px; }.upload input { display:none; }.cv-summary { display:flex; gap:17px; align-items:center; margin-top:18px; padding-top:17px; border-top:1px solid var(--line); }.score { width:65px; height:65px; border-radius:50%; display:grid; place-content:center; text-align:center; border:7px solid #d8eedb; border-top-color:#58a273; border-right-color:#58a273; flex-shrink:0; }.score b { font-size:19px; }.score small { display:block; font-size:8px; color:#91a197; }.cv-name { font-size:11px; font-weight:700; }.cv-meta { color:#87978d; font-size:10px; margin-top:5px; }.skills { display:flex; gap:6px; flex-wrap:wrap; margin-top:13px; }.skill { background:#f0f7ef; color:#4f8561; border-radius:5px; padding:6px 8px; font-size:9px; }.billing { background:var(--deep); color:#fff; }.billing .eyebrow { color:#a9cdb2; }.billing h2 { color:#fff; }.billing p { color:#b9d0c1; }.price { display:flex; align-items:baseline; gap:4px; margin:22px 0 16px; }.price b { font-size:33px; letter-spacing:-1px; }.price span { color:#abc7b5; font-size:10px; }.billing button { border:0; border-radius:8px; background:#b7db8e; color:#173e30; width:100%; padding:12px; font-size:11px; font-weight:800; }.plan-details { display:flex; justify-content:space-between; border-top:1px solid #ffffff1c; padding-top:14px; margin-top:17px; color:#b9d0c1; font-size:10px; }.plan-details b { color:#fff; display:block; margin-top:4px; }.jobs-panel { grid-column:1 / -1; }.toolbar { display:flex; gap:8px; margin:16px 0; }.toolbar input,.toolbar select { border:1px solid var(--line); border-radius:7px; padding:10px; font-size:10px; outline:none; color:#5f7367; background:#fff; }.toolbar input { flex:1; }.job { display:grid; grid-template-columns:36px 1fr auto; gap:12px; align-items:center; border-top:1px solid var(--line); padding:14px 0; }.job-logo { width:36px; height:36px; border-radius:10px; background:#e7f3e8; color:#44895e; display:grid; place-items:center; font-size:15px; font-weight:800; }.job h3 { margin:0 0 4px; font-size:12px; }.job p { margin:0; font-size:10px; }.job-tags { display:flex; gap:5px; margin-top:8px; flex-wrap:wrap; }.job-tags span { background:#f3f7f2; color:#82928a; border-radius:4px; padding:4px 6px; font-size:8px; }.job button { border:1px solid #aed6b9; background:#fff; color:#43875c; border-radius:7px; padding:9px 10px; font-size:10px; }.job button:disabled { background:#eff8f0; color:#6ca078; border-color:#d7ebd9; }.toast { position:fixed; right:22px; bottom:22px; max-width:360px; padding:13px 16px; border-radius:9px; background:var(--deep); color:#fff; font-size:11px; box-shadow:0 15px 35px #143b2f38; }
@media (max-width:780px) { .auth-wrap { display:block; }.auth-hero { padding:35px 28px 38px; }.auth-hero h1 { margin:80px 0 15px; font-size:45px; }.auth-card { margin:30px auto; }.dash-intro { display:block; }.status-chip { display:inline-block; margin-top:18px; }.grid { grid-template-columns:1fr; }.job { grid-template-columns:35px 1fr; }.job button { grid-column:2; justify-self:start; }.jobs-panel { grid-column:auto; }.user-actions > span:first-child { display:none; }.user-actions { flex-wrap:wrap; justify-content:flex-end; } }
.consent { display:flex; gap:8px; align-items:flex-start; color:#82928a; font-size:10px; line-height:1.4; margin:13px 0; }.consent input { margin:1px 0 0; accent-color:var(--green); }.logout.danger { color:#a04a3e; background:#fff3f1; }
.billing.attention { animation: pulse-panel .7s ease-in-out 3; box-shadow: 0 0 0 4px #b7db8e66; }
.automation-panel { grid-column: 1 / -1; }
.automation-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 18px; }
.automation-form .field { margin:9px 0; }
.automation-form textarea { width:100%; margin-top:7px; border:1px solid var(--line); border-radius:8px; padding:12px; outline:none; color:var(--ink); resize:vertical; }
.automation-form textarea:focus { border-color:#86bd96; box-shadow:0 0 0 3px #ccebd550; }
.automation-form .full-field { grid-column:1 / -1; }
.automation-form .check-row { color:#60756a; font-size:11px; display:flex; align-items:center; gap:7px; margin:8px 0; }
.automation-form .primary { grid-column:1 / -1; margin-top:6px; }
@media (max-width: 760px) { .automation-form { grid-template-columns:1fr; } .automation-form .primary { grid-column:auto; } }
@keyframes pulse-panel { 50% { transform: translateY(-2px); } }
.overview-panel { grid-column:1 / -1; padding:18px 22px; background:linear-gradient(135deg,#ffffff 0%,#f3fbf3 100%); }
.overview-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.overview-head h2 { margin-bottom:0; }
.overview-metrics { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-top:18px; }
.overview-metrics > div { border:1px solid var(--line); border-radius:10px; padding:12px; background:#ffffffb8; }
.overview-metrics span { display:block; color:var(--muted); font-size:10px; }
.overview-metrics strong { display:block; margin-top:7px; font-size:22px; letter-spacing:-1px; }
.applications-panel,.integrations-panel { min-width:0; }
.result-count { color:#789083; background:#f0f7f0; border-radius:99px; padding:7px 10px; font-size:10px; white-space:nowrap; }
.job-title-line { display:flex; align-items:center; gap:8px; }
.job-title-line h3 { margin:0; }
.match-pill { color:#4b956a; background:#edf8ed; border-radius:99px; padding:4px 7px; font-size:9px; font-weight:700; white-space:nowrap; }
.application-list { margin-top:8px; }
.application-row { display:grid; grid-template-columns:36px minmax(0,1fr) auto auto auto; align-items:center; gap:11px; border-top:1px solid var(--line); padding:12px 0; }
.application-main { min-width:0; }
.application-main strong,.application-main span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.application-main strong { font-size:11px; }
.application-main span,.application-source { color:var(--muted); font-size:10px; }
.status-badge { border-radius:99px; padding:6px 8px; font-size:9px; font-weight:700; white-space:nowrap; }
.status-badge.success { color:#3e8257; background:#eaf7eb; }
.status-badge.warning { color:#8b6c27; background:#fff6df; }
.status-badge.error { color:#a04a3e; background:#fff0ee; }
.secondary-action,.text-link { color:#43875c; font-size:10px; font-weight:700; text-decoration:none; white-space:nowrap; }
.secondary-action:hover,.text-link:hover { text-decoration:underline; }
.integration-list { margin-top:8px; }
.integration-row { display:flex; align-items:center; justify-content:space-between; gap:14px; border-top:1px solid var(--line); padding:11px 0; }
.integration-row strong,.integration-row span { display:block; }
.integration-row strong { font-size:11px; }
.integration-row div span { color:var(--muted); font-size:9px; margin-top:3px; }
.integration-state { border-radius:99px; padding:6px 8px; font-size:9px; font-weight:700; }
.integration-state.ready { color:#3e8257; background:#eaf7eb; }
.integration-state.pending { color:#8b6c27; background:#fff6df; }
.empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-height:100px; padding:20px; border:1px dashed #c6ddcb; border-radius:10px; background:#f8fcf8; color:var(--muted); text-align:center; font-size:10px; }
.empty-state strong { color:#527764; font-size:11px; }
.status-chip.small { padding:6px 9px; }
@media (max-width:780px) { .overview-panel { grid-column:auto; }.overview-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }.application-row { grid-template-columns:32px minmax(0,1fr) auto; }.application-source { display:none; }.application-row .secondary-action { grid-column:2 / -1; justify-self:start; } }

.jobs-tabs { display:flex; gap:8px; border-bottom:1px solid var(--line); margin:16px 0 0; }
.jobs-tabs button { border:0; background:transparent; color:var(--muted); padding:9px 12px; font-size:10px; font-weight:700; border-bottom:2px solid transparent; }
.jobs-tabs button.active { color:var(--green); border-bottom-color:var(--green); }
.jobs-tabs button span { display:inline-grid; place-items:center; min-width:18px; height:18px; margin-left:4px; border-radius:99px; background:#edf6ed; color:#4a875e; font-size:9px; }
.job { animation: job-enter .35s ease both; }
.job-content { min-width:0; }
.job-facts { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.job-facts span { color:#6f8377; background:#f6faf5; border-radius:5px; padding:5px 7px; font-size:9px; }
.match-reasons { display:flex; gap:5px; flex-wrap:wrap; margin-top:8px; }
.match-reason { color:#3d8156; background:#eaf7eb; border-radius:99px; padding:4px 7px; font-size:8px; }
.job-actions { display:flex; flex-direction:column; align-items:stretch; gap:6px; min-width:102px; }
.job-detail-button { border:0; background:transparent; color:#557265; padding:5px; font-size:9px; font-weight:700; cursor:pointer; }
.job-detail-button:hover { color:var(--green); text-decoration:underline; }
.job-apply-button { border:1px solid #aed6b9; background:#fff; color:#43875c; border-radius:7px; padding:9px 10px; font-size:10px; font-weight:700; cursor:pointer; }
.job-apply-button:hover { background:#f1faf1; }
.job-apply-button:disabled { background:#eff8f0; color:#6ca078; border-color:#d7ebd9; cursor:default; }
.job-applied { border-left:3px solid #67a978; padding-left:10px; background:linear-gradient(90deg,#f4fbf4,transparent); }
.registered-card { display:grid; grid-template-columns:38px minmax(0,1fr) auto; gap:12px; align-items:center; border-top:1px solid var(--line); padding:14px 0; animation: registered-enter .4s ease both; }
.registered-icon { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; color:#fff; background:#58a273; font-weight:800; box-shadow:0 0 0 5px #dff1e2; }
.registered-title { display:flex; align-items:center; gap:8px; }
.registered-title strong { font-size:12px; }
.registered-card p { margin:4px 0 0; }
.registered-card small { display:block; color:#8a9a90; font-size:9px; margin-top:8px; }
.job-modal-backdrop { position:fixed; inset:0; z-index:20; display:grid; place-items:center; padding:20px; background:#173e3070; backdrop-filter:blur(4px); animation: modal-fade .2s ease; }
.job-modal { position:relative; width:min(680px,100%); max-height:min(760px,90vh); overflow:auto; border-radius:18px; padding:28px; background:#fff; box-shadow:0 30px 80px #173e3040; animation: modal-rise .25s ease; }
.modal-close { position:absolute; top:16px; right:17px; width:30px; height:30px; border:0; border-radius:50%; background:#f0f7f0; color:#527764; font-size:20px; cursor:pointer; }
.modal-eyebrow { color:#6e9e78; font-size:10px; font-weight:800; letter-spacing:.4px; }
.job-modal h2 { font-size:25px; margin:10px 40px 10px 0; letter-spacing:-1px; }
.modal-match { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.modal-match > strong { color:#3e8257; background:#eaf7eb; border-radius:99px; padding:7px 10px; font-size:11px; }
.modal-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin:20px 0; }
.modal-facts div { padding:11px; border-radius:9px; background:#f7fbf6; border:1px solid #e6f0e5; }
.modal-facts span { display:block; color:#8a9a90; font-size:9px; }
.modal-facts strong { display:block; color:#294c3a; font-size:10px; margin-top:5px; }
.modal-description { color:#5e7266 !important; font-size:12px !important; line-height:1.65 !important; }
.modal-section { margin-top:18px; }
.modal-section h3 { font-size:12px; margin-bottom:8px; }
.modal-section ul { margin:0; padding-left:18px; color:#657a6c; font-size:11px; line-height:1.8; }
.benefit-list { display:flex; flex-wrap:wrap; gap:6px; }
.benefit-list span { color:#4b8860; background:#edf8ed; border-radius:99px; padding:6px 9px; font-size:9px; }
.modal-footer { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-top:24px; padding-top:17px; border-top:1px solid var(--line); color:#7c8e83; font-size:10px; }
.modal-footer .job-apply-button { background:#b7db8e; color:#173e30; border:0; padding:12px 18px; }
.application-success-overlay { position:fixed; inset:0; z-index:30; display:grid; place-items:center; background:#173e3026; pointer-events:none; animation: success-backdrop .25s ease; }
.application-success-card { width:min(380px,calc(100% - 40px)); padding:30px; border:1px solid #cfe8d1; border-radius:20px; background:#fff; text-align:center; box-shadow:0 25px 70px #173e3030; animation: success-pop .45s cubic-bezier(.2,.9,.3,1.3); }
.success-check { width:64px; height:64px; display:grid; place-items:center; margin:0 auto 16px; border-radius:50%; background:#58a273; color:#fff; font-size:35px; font-weight:800; box-shadow:0 0 0 9px #e0f2e2; }
.application-success-card h2 { margin:10px 0 6px; color:#244d38; }
.application-success-card p { margin:0 0 10px; }
.application-success-card strong { color:#4b8860; font-size:11px; }
@keyframes job-enter { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@keyframes registered-enter { from { opacity:0; transform:translateX(-8px); } to { opacity:1; transform:none; } }
@keyframes modal-fade { from { opacity:0; } to { opacity:1; } }
@keyframes modal-rise { from { opacity:0; transform:translateY(14px) scale(.98); } to { opacity:1; transform:none; } }
@keyframes success-backdrop { from { opacity:0; } to { opacity:1; } }
@keyframes success-pop { from { opacity:0; transform:scale(.82) translateY(15px); } to { opacity:1; transform:none; } }
.cv-extracted { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:14px; }
.cv-extracted span { display:flex; flex-direction:column; gap:3px; padding:9px 10px; border:1px solid #e9e8e5; border-radius:10px; background:#fbfbfa; font-size:11px; color:#666; }
.cv-extracted b { font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:#999; }
.cv-evidence { margin-top:10px; font-size:11px; color:#777; }
.cv-evidence summary { cursor:pointer; color:#4e4a45; font-weight:700; }
.cv-evidence p { margin:8px 0 0; line-height:1.5; }
@media (max-width:680px) { .cv-extracted { grid-template-columns:1fr; } }
@media (max-width:780px) { .job { grid-template-columns:36px minmax(0,1fr); }.job-actions { grid-column:2; flex-direction:row; align-items:center; justify-content:flex-start; }.modal-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }.modal-footer { align-items:flex-start; flex-direction:column; }.modal-footer .job-apply-button { width:100%; }.registered-card { grid-template-columns:34px minmax(0,1fr); }.registered-card .job-detail-button { grid-column:2; justify-self:start; } }
