/* ── MODE: public (default) hides dev-only elements ── */
.app:not([data-mode="dev"]) .dev-only{ display:none !important; }

/* ── DARK THEME (default) ── */
:root{
  --bg:#0e0f13;--surf:#16181f;--surf2:#1e2029;--bdr:#2a2d3a;
  --acc:#6ee7b7;--acc2:#818cf8;--acc3:#f472b6;
  --txt:#e8eaf0;--mut:#6b7280;--card:#13151c;
  --cla:#d97706;--ing:#7c3aed;
  --log-bg:#0a0b0e;--log-ts:#3d4150;
  --shadow:rgba(0,0,0,.3);
}

/* ── LIGHT THEME ── */
:root.light{
  --bg:#f0f2f7;--surf:#ffffff;--surf2:#f8f9fc;--bdr:#d1d5e0;
  --acc:#059669;--acc2:#4f46e5;--acc3:#db2777;
  --txt:#111827;--mut:#6b7280;--card:#ffffff;
  --cla:#b45309;--ing:#6d28d9;
  --log-bg:#f1f5f9;--log-ts:#94a3b8;
  --shadow:rgba(0,0,0,.08);
}

*{margin:0;padding:0;box-sizing:border-box}

html,body{height:100%;overflow:hidden}
body{background:var(--bg);color:var(--txt);font-family:'Roboto',sans-serif;font-size:16px;display:flex;flex-direction:column;transition:background .3s,color .3s}
body::before{content:'';position:fixed;inset:0;background-image:linear-gradient(rgba(110,231,183,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(110,231,183,.03) 1px,transparent 1px);background-size:40px 40px;pointer-events:none;z-index:0}
:root.light body::before{background-image:linear-gradient(rgba(79,70,229,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(79,70,229,.04) 1px,transparent 1px)}

/* ── THEME TOGGLE ── */
.theme-btn{background:none;border:1px solid var(--bdr);border-radius:20px;padding:4px 10px;cursor:pointer;font-size:16px;color:var(--mut);font-family:'Roboto',sans-serif;display:flex;align-items:center;gap:5px;transition:all .2s;white-space:nowrap}
.theme-btn:hover{border-color:var(--acc2);color:var(--acc2)}

/* ── LAYOUT ── */
.app{position:relative;z-index:1;display:flex;flex:1;overflow:hidden;height:100vh}

/* ── SIDEBAR ── */
.sidebar{width:300px;min-width:300px;background:var(--surf);border-right:1px solid var(--bdr);display:flex;flex-direction:column;overflow:hidden}
.sidebar-head{padding:16px 20px 12px;border-bottom:1px solid var(--bdr);flex-shrink:0}
.logo{font-family:'Roboto Slab',serif;font-size:22px;color:var(--acc);letter-spacing:-.5px}
.logo em{color:var(--mut);font-style:italic}
.logo-sub{font-size:15px;color:var(--mut);font-family:'Roboto Mono',monospace;margin-top:2px}
.sidebar-body{flex:1;overflow-y:auto;padding:14px 20px 80px;scrollbar-width:thin;scrollbar-color:var(--bdr) transparent}

/* section label */
.sl{display:flex;align-items:center;gap:8px;margin:16px 0 8px;font-size:16px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--mut)}
.sl::after{content:'';flex:1;height:1px;background:var(--bdr)}
.sl:first-child{margin-top:0}

/* key fields */
.key-row{display:flex;gap:6px;margin-bottom:4px}
.key-input{flex:1;background:var(--bg);border:1px solid var(--bdr);border-radius:8px;padding:7px 10px;color:var(--txt);font-family:'Roboto Mono',monospace;font-size:15px;outline:none;min-width:0;transition:border-color .2s}
.key-input:focus{border-color:var(--acc)}
.key-status{font-size:15px;font-family:'Roboto Mono',monospace;color:var(--mut)}
.key-status.ok{color:var(--acc)}
.key-meta{display:flex;justify-content:space-between;margin-bottom:3px;align-items:center}
.ok-btn{background:var(--acc);color:#000;border:none;border-radius:8px;padding:7px 13px;font-size:15px;font-weight:700;cursor:pointer;font-family:'Roboto',sans-serif;transition:opacity .2s;white-space:nowrap}
.ok-btn:hover{opacity:.85}

/* toggle */
.tog-grp{display:flex;gap:5px;flex-wrap:wrap}
.tog{background:var(--bg);border:1px solid var(--bdr);border-radius:20px;padding:5px 13px;font-size:15px;color:var(--mut);cursor:pointer;font-family:'Roboto',sans-serif;transition:all .15s}
.tog:hover{border-color:var(--acc);color:var(--acc)}
.tog.on{background:var(--acc);border-color:var(--acc);color:#000;font-weight:700}


/* chips */
.chips{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.chip{background:var(--bg);border:1px solid var(--bdr);border-radius:6px;padding:4px 8px 4px 10px;font-size:13px;color:var(--mut);cursor:pointer;display:flex;align-items:center;gap:5px;transition:all .15s;font-family:'Roboto',sans-serif;line-height:1.3}
.chip:hover{border-color:var(--acc2);color:var(--acc2)}
.chip.on{background:rgba(129,140,248,.12);border-color:var(--acc2);color:var(--acc2)}
.chip.on .chip-dot{display:inline-block}
.chip-dot{width:5px;height:5px;border-radius:50%;background:var(--acc2);flex-shrink:0;display:none}
.chip-del{width:14px;height:14px;border-radius:50%;background:none;border:none;color:var(--mut);cursor:pointer;font-size:12px;line-height:1;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s,background .15s;flex-shrink:0;padding:0;margin-left:1px}
.chip:hover .chip-del{opacity:1}
.chip-del:hover{background:rgba(244,114,182,.2);color:var(--acc3) !important}
.chip.co:hover{border-color:var(--acc3);color:var(--acc3)}
.chip.co.on{background:rgba(244,114,182,.1);border-color:var(--acc3);color:var(--acc3)}
.chip.co.on .chip-dot{background:var(--acc3)}

/* add-chip row */
.chip-add-row{display:flex;gap:5px;margin-top:6px;align-items:center}
.chip-add-input{flex:1;background:var(--bg);border:1px solid var(--bdr);border-radius:6px;padding:4px 9px;font-size:13px;color:var(--txt);font-family:'Roboto',sans-serif;outline:none;transition:border-color .2s;min-width:0}
.chip-add-input:focus{border-color:var(--acc2)}
.chip-add-input::placeholder{color:var(--mut);font-size:12px}
.chip-add-btn{background:none;border:1px solid var(--bdr);border-radius:6px;width:26px;height:26px;cursor:pointer;color:var(--mut);font-size:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;line-height:1}
.chip-add-btn:hover{border-color:var(--acc2);color:var(--acc2);background:rgba(129,140,248,.08)}

/* range */
input[type=range]{-webkit-appearance:none;width:100%;height:4px;border-radius:2px;background:var(--bdr);outline:none;margin:6px 0 2px}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--acc);cursor:pointer}
.range-row{display:flex;justify-content:space-between;font-size:16px;font-family:'Roboto Mono',monospace;color:var(--mut)}

/* search btn */
.search-btn{width:100%;padding:13px;margin-top:18px;background:var(--acc);color:#000;border:none;border-radius:10px;font-family:'Roboto',sans-serif;font-size:15px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .2s;letter-spacing:.4px}
.search-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 24px rgba(110,231,183,.2)}
.search-btn:disabled{background:#1a2a20;cursor:not-allowed;transform:none;box-shadow:none}

/* ── MAIN ── */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}
.main-head{padding:14px 20px;border-bottom:1px solid var(--bdr);background:var(--surf);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.main-title{font-family:'Roboto Slab',serif;font-size:19px}
.result-count{font-size:15px;font-family:'Roboto Mono',monospace;color:var(--mut);margin-top:2px}
.result-count strong{color:var(--acc)}
.badge{font-size:16px;font-weight:700;padding:3px 10px;border-radius:20px;letter-spacing:1px;background:rgba(99,102,241,.12);color:var(--acc2);border:1px solid rgba(99,102,241,.25)}

.job-list{flex:1;overflow-y:auto;padding:14px 16px 50px;scrollbar-width:thin;scrollbar-color:var(--bdr) transparent}

/* state boxes */
.state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:280px;gap:12px;color:var(--mut);text-align:center;padding:20px}
.state-icon{font-size:36px;opacity:.4}
.state p{font-size:16px;max-width:280px;line-height:1.7}
.spinner{width:28px;height:28px;border:3px solid var(--bdr);border-top-color:var(--acc);border-radius:50%;animation:spin .8s linear infinite}

/* job cards */
.job-card{background:var(--card);border:1px solid var(--bdr);border-left:3px solid transparent;border-radius:12px;padding:14px 16px;margin-bottom:10px;cursor:pointer;transition:all .2s;box-shadow:0 1px 4px var(--shadow)}
.job-card:hover{border-color:var(--acc2);transform:translateX(2px)}
.job-card.sel{border-color:var(--acc);border-left-color:var(--acc);transform:translateX(2px)}
.job-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.job-title{font-size:15px;font-weight:700;line-height:1.3;flex:1}
.job-company{display:flex;align-items:center;gap:7px;font-size:15px;color:var(--acc3);margin-top:5px;font-weight:600}
.co-logo{border-radius:6px;object-fit:contain;flex-shrink:0;background:var(--surf2)}
.co-avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:6px;background:hsl(var(--hue),45%,30%);color:hsl(var(--hue),60%,80%);font-weight:700;flex-shrink:0}
.job-meta{display:flex;gap:10px;margin-top:7px;flex-wrap:wrap}
.job-tag{font-size:15px;color:var(--mut);font-family:'Roboto Mono',monospace}
.job-desc{font-size:15px;color:var(--mut);margin-top:8px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tag-pill{font-size:15px;font-weight:700;padding:1px 6px;border-radius:20px;white-space:nowrap}
.tag-remote{background:var(--acc);color:#000}
.tag-apply{background:var(--acc2);color:#fff;text-decoration:none}

/* ── LOG PANEL ── */
.log{position:absolute;bottom:0;left:0;right:0;background:var(--log-bg);border-top:1px solid var(--bdr);z-index:10;height:32px;transition:height .3s;overflow:hidden;font-family:'Roboto Mono',monospace}
.log.open{height:220px}
.log-bar{display:flex;align-items:center;gap:8px;padding:0 14px;height:32px;cursor:pointer;border-bottom:1px solid transparent;user-select:none}
.log.open .log-bar{border-color:var(--bdr)}
.log-dot{width:6px;height:6px;border-radius:50%;background:var(--mut);transition:background .3s}
.log-dot.pulse{background:var(--acc);animation:pulse 1.5s infinite}
.log-lbl{font-size:16px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--mut)}
.log-cnt{font-size:16px;color:var(--mut);margin-left:auto}
.log-clr{font-size:16px;color:var(--mut);background:none;border:1px solid var(--bdr);border-radius:4px;padding:1px 8px;cursor:pointer;font-family:'Roboto',sans-serif}
.log-clr:hover{color:var(--acc3);border-color:var(--acc3)}
.log-chev{font-size:16px;color:var(--mut);transition:transform .3s}
.log.open .log-chev{transform:rotate(180deg)}
.log-entries{height:188px;overflow-y:auto;padding:6px 14px;display:flex;flex-direction:column;gap:2px;scrollbar-width:thin}
.log-entry{display:flex;gap:8px;font-size:15px;line-height:1.5}
.log-ts{color:var(--log-ts);white-space:nowrap;flex-shrink:0}
.log-level{font-size:15px;font-weight:700;padding:1px 5px;border-radius:3px;white-space:nowrap;flex-shrink:0;align-self:flex-start;margin-top:1px}
.lv-INFO{background:rgba(110,231,183,.1);color:var(--acc)}
.lv-WARN{background:rgba(251,191,36,.1);color:#fbbf24}
.lv-ERROR{background:rgba(244,114,182,.1);color:var(--acc3)}
.lv-REQ{background:rgba(129,140,248,.1);color:var(--acc2)}
.lv-RES{background:rgba(52,211,153,.1);color:#34d399}
.lv-DEBUG{background:rgba(100,116,139,.1);color:#64748b}
.log-msg{flex:1;word-break:break-all;color:var(--txt)}
.log-msg.err{color:var(--acc3)}
.log-msg.ok{color:var(--acc)}
.log-detail{display:block;color:var(--mut);font-size:16px;margin-top:1px}

/* ── CHAT ── */
.chat{width:300px;min-width:300px;border-left:1px solid var(--bdr);display:flex;flex-direction:column;background:var(--surf)}
.chat-head{padding:12px 16px;border-bottom:1px solid var(--bdr);display:flex;align-items:center;gap:10px;flex-shrink:0}
.chat-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#d97706,#f59e0b);display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;color:#000;font-family:'Roboto Slab',serif;flex-shrink:0}
.chat-name{font-size:15px;font-weight:700}
.chat-status{font-size:16px;color:var(--acc);display:flex;align-items:center;gap:4px}
.chat-status::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--acc);animation:pulse 2s infinite}
.chat-warn{background:rgba(217,119,6,.1);border:1px solid rgba(217,119,6,.3);border-radius:8px;margin:10px;padding:7px 12px;font-size:15px;color:#d97706}
.shortcuts{padding:6px 12px 4px;display:flex;gap:4px;flex-wrap:wrap;flex-shrink:0}
.sc{font-size:16px;background:var(--bg);border:1px solid var(--bdr);border-radius:20px;padding:3px 9px;color:var(--mut);cursor:pointer;transition:all .15s}
.sc:hover{border-color:var(--acc2);color:var(--acc2)}
.chat-msgs{flex:1;overflow-y:auto;padding:10px 12px;display:flex;flex-direction:column;gap:8px;scrollbar-width:thin;scrollbar-color:var(--bdr) transparent}
.msg{max-width:92%}
.msg.u{align-self:flex-end}
.msg.a{align-self:flex-start}
.bubble{padding:8px 12px;border-radius:10px;font-size:16px;line-height:1.6;white-space:pre-wrap}
.msg.u .bubble{background:var(--acc2);color:#fff;border-bottom-right-radius:2px}
.msg.a .bubble{background:var(--surf2);color:var(--txt);border:1px solid var(--bdr);border-bottom-left-radius:2px}
.typing-dots{display:flex;gap:4px;align-items:center;padding:8px 12px}
.dot{width:5px;height:5px;border-radius:50%;background:var(--mut);animation:bounce 1.2s infinite}
.dot:nth-child(2){animation-delay:.15s}
.dot:nth-child(3){animation-delay:.3s}
/* ── CHAT INPUT AREA ── */
.chat-input-area{
  padding:12px 14px;
  padding-bottom:max(12px, env(safe-area-inset-bottom));
  border-top:1px solid var(--bdr);
  flex-shrink:0;
}
/* unified input box */
.chat-input-box{
  display:flex;
  flex-direction:row;
  align-items:flex-end;
  gap:0;
  background:var(--bg);
  border:1px solid var(--bdr);
  border-radius:14px;
  padding:6px 6px 6px 12px;
  transition:border-color .2s;
}
.chat-input-box:focus-within{border-color:var(--acc2)}
.chat-ta{
  flex:1;
  background:transparent;
  border:none;
  outline:none;
  resize:none;
  min-height:28px;
  max-height:120px;
  line-height:1.5;
  padding:4px 0;
  color:var(--txt);
  font-family:'Roboto',sans-serif;
  font-size:15px;
  align-self:flex-end;
}
.chat-ta::placeholder{color:var(--mut)}
.chat-input-actions{display:flex;align-items:flex-end;gap:4px;flex-shrink:0;padding-bottom:1px}
.attach-btn{
  background:none;border:none;border-radius:8px;
  width:30px;height:30px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;color:var(--mut);transition:color .2s;
}
.attach-btn:hover{color:var(--acc2)}
.attach-btn.active{color:var(--acc)}
.send-btn{
  background:var(--acc2);border:none;border-radius:9px;
  width:30px;height:30px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all .2s;flex-shrink:0;
}
.send-btn:hover{opacity:.85;transform:scale(1.05)}
.send-btn:disabled{background:var(--bdr);cursor:not-allowed;transform:none}
/* attachment indicator */
.attach-indicator{
  display:flex;align-items:center;gap:6px;
  padding:0 4px 6px;
  font-size:12px;color:var(--acc);
  font-family:'Roboto Mono',monospace;
}
.attach-indicator svg{flex-shrink:0;stroke:var(--acc)}
.attach-indicator span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attach-remove{background:none;border:none;color:var(--mut);cursor:pointer;font-size:15px;line-height:1;padding:0 2px;transition:color .15s}
.attach-remove:hover{color:var(--acc3)}

/* notif */
.notif{position:fixed;bottom:48px;right:20px;background:var(--surf2);border:1px solid var(--acc);border-radius:10px;padding:9px 14px;font-size:16px;color:var(--acc);z-index:200;opacity:0;transform:translateY(10px);transition:all .3s;pointer-events:none}
.notif.show{opacity:1;transform:translateY(0)}

/* diag */
.diag-btn{background:var(--bg);border:1px solid var(--bdr);border-radius:6px;padding:5px 11px;font-size:12px;color:var(--mut);cursor:pointer;font-family:'Roboto',sans-serif;transition:all .2s}
.diag-btn:hover{border-color:var(--acc2);color:var(--acc2)}
.diag-btn.running{border-color:var(--acc);color:var(--acc)}
.diag-btn.ok{border-color:#34d399;color:#34d399}
.diag-btn.fail{border-color:var(--acc3);color:var(--acc3)}

/* ── MODAL ── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:300;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .2s}
.modal-overlay.open{opacity:1;pointer-events:all}
.modal{background:var(--surf);border:1px solid var(--bdr);border-radius:16px;width:90%;max-width:640px;max-height:85vh;display:flex;flex-direction:column;box-shadow:0 24px 64px rgba(0,0,0,.4);transform:translateY(12px);transition:transform .2s}
.modal-overlay.open .modal{transform:translateY(0)}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 20px 14px;border-bottom:1px solid var(--bdr);flex-shrink:0}
.modal-title{font-family:'Roboto Slab',serif;font-size:18px;font-weight:700;line-height:1.3;color:var(--txt)}
.modal-company{display:flex;align-items:center;gap:8px;font-size:15px;color:var(--acc3);font-weight:600;margin-top:6px}
.modal-close{background:none;border:1px solid var(--bdr);border-radius:8px;width:32px;height:32px;cursor:pointer;color:var(--mut);font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s}
.modal-close:hover{border-color:var(--acc3);color:var(--acc3)}
.modal-meta{display:flex;gap:8px;flex-wrap:wrap;padding:12px 20px;border-bottom:1px solid var(--bdr);flex-shrink:0}
.modal-tag{font-size:13px;color:var(--mut);font-family:'Roboto Mono',monospace;background:var(--bg);border:1px solid var(--bdr);border-radius:6px;padding:3px 8px}
.modal-tag.hi{border-color:var(--acc);color:var(--acc)}
.modal-body{flex:1;overflow-y:auto;padding:16px 20px;font-size:15px;color:var(--txt);line-height:1.7;white-space:pre-wrap;scrollbar-width:thin;scrollbar-color:var(--bdr) transparent}
.modal-foot{display:flex;gap:10px;padding:14px 20px;border-top:1px solid var(--bdr);flex-shrink:0}
.modal-chat-btn{flex:1;background:var(--surf2);border:1px solid var(--bdr);border-radius:10px;padding:10px;font-size:14px;font-weight:700;color:var(--acc2);cursor:pointer;font-family:'Roboto',sans-serif;transition:all .2s}
.modal-chat-btn:hover{border-color:var(--acc2);background:rgba(129,140,248,.1)}
.modal-apply-msg-btn{flex:1.5;background:linear-gradient(135deg,var(--acc2),var(--acc));border:none;border-radius:10px;padding:10px;font-size:14px;font-weight:700;color:#fff;cursor:pointer;font-family:'Roboto',sans-serif;transition:opacity .2s}
.modal-apply-msg-btn:hover{opacity:.88}
.modal-cv-btn{flex:1;background:var(--surf2);border:1px solid var(--bdr);border-radius:10px;padding:10px;font-size:14px;font-weight:700;color:var(--acc);cursor:pointer;font-family:'Roboto',sans-serif;transition:all .2s}
.modal-cv-btn:hover{border-color:var(--acc);background:rgba(110,231,183,.08)}
.modal-apply-btn{flex:1;background:var(--acc2);border:none;border-radius:10px;padding:10px;font-size:14px;font-weight:700;color:#fff;text-align:center;text-decoration:none;transition:opacity .2s}
.modal-apply-btn:hover{opacity:.85}

/* ── CV EDITOR ── */
.cv-editor-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:300;display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;pointer-events:none;transition:opacity .2s}
.cv-editor-overlay.open{opacity:1;pointer-events:all}
.cv-editor{background:var(--surf);border:1px solid var(--bdr);border-radius:16px;width:100%;max-width:780px;height:90vh;display:flex;flex-direction:column;overflow:hidden}
.cv-editor-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--bdr);flex-shrink:0}
.cv-editor-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--mut);margin-bottom:2px}
.cv-editor-job{font-size:14px;font-weight:600;color:var(--txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv-print-btn{display:flex;align-items:center;gap:6px;background:var(--acc);color:#000;border:none;border-radius:8px;padding:8px 14px;font-size:13px;font-weight:700;cursor:pointer;font-family:'Roboto',sans-serif;transition:opacity .2s}
.cv-print-btn:hover{opacity:.85}
.cv-editor-hint{background:rgba(99,102,241,.08);border-bottom:1px solid var(--bdr);padding:7px 18px;font-size:12px;color:var(--acc2);flex-shrink:0}
.cv-editor-body{flex:1;overflow-y:auto;background:#f5f5f0;padding:24px;display:flex;justify-content:center}
/* The white A4-like paper */
.cv-paper{background:#fff;width:100%;max-width:210mm;min-height:297mm;padding:14mm 18mm;box-shadow:0 4px 24px rgba(0,0,0,.18);border-radius:2px;color:#1a1a1a;font-family:Arial,Helvetica,sans-serif;font-size:10.5pt;line-height:1.45}
.cv-paper [contenteditable]:hover{background:rgba(99,102,241,.06);border-radius:3px;cursor:text}
.cv-paper [contenteditable]:focus{background:rgba(99,102,241,.1);outline:2px solid rgba(99,102,241,.4);border-radius:3px}
/* CV element styles (mirror print CSS) */
.cv-paper .cv-name{font-size:20pt;font-weight:700;color:#1e3a5f;margin-bottom:3px}
.cv-paper .cv-role{font-size:11pt;color:#3b6dbf;margin-bottom:6px;font-weight:500}
.cv-paper .cv-contact{font-size:9pt;color:#555;padding-bottom:7px;border-bottom:2px solid #1e3a5f;margin-bottom:13px}
.cv-paper .cv-section{margin-bottom:12px}
.cv-paper .cv-section-title{font-size:9.5pt;font-weight:700;color:#1e3a5f;text-transform:uppercase;letter-spacing:.8px;border-bottom:1px solid #c8d8ea;padding-bottom:3px;margin-bottom:7px}
.cv-paper .cv-entry{margin-bottom:7px}
.cv-paper .cv-entry-header{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.cv-paper .cv-entry-title{font-weight:700;font-size:10.5pt}
.cv-paper .cv-entry-company{color:#3b6dbf;font-size:10pt}
.cv-paper .cv-entry-date{color:#888;font-size:9.5pt;white-space:nowrap;flex-shrink:0}
.cv-paper .cv-bullets{margin-left:14px;margin-top:3px}
.cv-paper .cv-bullets li{margin-bottom:2px;font-size:10pt}
.cv-paper .cv-skills-grid{display:flex;flex-wrap:wrap;gap:5px}
.cv-paper .cv-skill{background:#eef2f7;border-radius:3px;padding:2px 8px;font-size:9.5pt}
.cv-paper p{margin-bottom:4px}

/* ── MOBILE NAV (hidden on desktop) ── */
.mobile-nav{display:none}
.mobile-only{display:none}
.mnav-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:none;border:none;cursor:pointer;color:var(--mut);font-family:'Roboto',sans-serif;font-size:11px;font-weight:500;letter-spacing:.3px;transition:color .2s;position:relative;padding:6px 0}
.mnav-btn.active{color:var(--acc)}
.mnav-badge{position:absolute;top:4px;right:calc(50% - 18px);background:var(--acc);color:#000;font-size:10px;font-weight:700;border-radius:10px;padding:1px 5px;font-family:'Roboto Mono',monospace;min-width:16px;text-align:center;line-height:1.4}
.icon-btn{background:none;border:1px solid var(--bdr);border-radius:8px;width:34px;height:34px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--mut);transition:all .2s}
.icon-btn:hover{border-color:var(--acc2);color:var(--acc2)}
.diag-toggle-btn{background:none;border:1px solid var(--bdr);border-radius:8px;padding:5px 10px;font-size:12px;color:var(--mut);cursor:pointer;font-family:inherit;transition:all .2s;white-space:nowrap}
.diag-toggle-btn:hover{border-color:var(--acc2);color:var(--acc2)}

/* ── TABLET (768px – 1099px) ── */
@media (max-width:1099px){
  .sidebar{width:240px;min-width:240px}
  .chat{width:240px;min-width:240px}
  .logo{font-size:19px}
  .logo-sub{font-size:13px}
  .sidebar-body{padding:12px 16px 80px}
  .sidebar-head{padding:14px 16px 10px}
  .chat-head{padding:10px 14px}
  .main-head{padding:12px 16px}
  .job-list{padding:12px 12px 50px}
  .job-card{padding:12px 14px}
  .chat-msgs{padding:8px 10px}
  .shortcuts{padding:5px 10px 3px}
  .diag-lbl{display:none}
  .theme-lbl-txt{display:none}
}

/* ── MOBILE (< 768px) ── */
@media (max-width:767px){
  html,body{height:100dvh;overflow:hidden}

  .app{
    height:100dvh;
    position:relative;
    overflow:hidden;
  }

  /* Panels: positioned and transition via data-panel on .app */
  .sidebar,
  .main,
  .chat{
    position:absolute;
    inset:0;
    bottom:calc(56px + env(safe-area-inset-bottom)); /* above mobile nav */
    width:100%;
    min-width:unset;
    border:none;
    transition:transform .28s cubic-bezier(.4,0,.2,1);
    overflow:hidden;
  }

  /* Default positions */
  .sidebar { transform:translateX(-100%); }
  .main    { transform:translateX(0); }
  .chat    { transform:translateX(100%); }

  /* Panel switching via data-panel attribute */
  .app[data-panel="filters"] .sidebar { transform:translateX(0); }
  .app[data-panel="filters"] .main    { transform:translateX(100%); }
  .app[data-panel="filters"] .chat    { transform:translateX(100%); }

  .app[data-panel="results"] .sidebar { transform:translateX(-100%); }
  .app[data-panel="results"] .main    { transform:translateX(0); }
  .app[data-panel="results"] .chat    { transform:translateX(100%); }

  .app[data-panel="chat"] .sidebar { transform:translateX(-100%); }
  .app[data-panel="chat"] .main    { transform:translateX(-100%); }
  .app[data-panel="chat"] .chat    { transform:translateX(0); }

  /* Show mobile elements */
  .mobile-nav  { display:flex; }
  .mobile-only { display:flex; }

  /* Sidebar adjustments */
  .sidebar-body{padding:12px 16px 100px;overflow-y:auto;height:100%}
  .sidebar-head{padding:12px 16px 10px;flex-shrink:0}

  /* Main: job list above log */
  .main{display:flex;flex-direction:column}
  .job-list{padding:10px 10px 10px}
  .main-head{padding:10px 12px;flex-shrink:0}
  .main-title{font-size:16px}
  .result-count{font-size:13px}

  /* Log panel stays at bottom of main */
  .log{position:relative;bottom:unset;flex-shrink:0}
  .log.open{height:200px}

  /* Chat full height */
  .chat{display:flex;flex-direction:column}
  .chat-head{padding:10px 12px;gap:8px}
  .chat-msgs{padding:8px 10px}
  .shortcuts{padding:5px 10px 3px;gap:3px}
  .sc{font-size:14px;padding:2px 7px}
  .chat-input-area{padding:8px 10px;padding-bottom:max(8px, env(safe-area-inset-bottom))}

  /* Mobile nav */
  .mobile-nav{
    position:absolute;
    bottom:0;left:0;right:0;
    height:calc(56px + env(safe-area-inset-bottom));
    padding-bottom:env(safe-area-inset-bottom);
    background:var(--surf);
    border-top:1px solid var(--bdr);
    z-index:100;
    align-items:stretch;
  }

  /* Modal: bottom sheet */
  .modal-overlay{align-items:flex-end}
  .modal{
    width:100%;
    max-width:100%;
    border-radius:18px 18px 0 0;
    max-height:92dvh;
    transform:translateY(100%);
    transition:transform .28s cubic-bezier(.4,0,.2,1);
  }
  .modal-overlay.open .modal{transform:translateY(0)}
  .modal-head{padding:16px 16px 12px}
  .modal-meta{padding:10px 16px}
  .modal-body{padding:12px 16px}
  .modal-foot{padding:12px 16px;flex-direction:column;gap:8px}
  .modal-apply-btn,.modal-chat-btn{text-align:center}

  /* Notif above mobile nav */
  .notif{bottom:64px}

  /* Persona buttons */
  .persona-btn .prole{font-size:13px}

  /* Chips smaller */
  .chip{font-size:12px;padding:3px 7px 3px 8px}

  /* Hide diag label & theme text */
  .diag-lbl{display:none}
  .theme-lbl-txt{display:none}

  /* Badge */
  .badge{font-size:13px;padding:2px 8px}
}

/* animations */
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes bounce{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-4px)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes fadeup{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.fadein{animation:fadeup .25s ease}