@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@600;700&display=swap');
/* ═══════════════════════════════════════════════
   shared.css — Jumush HQ
   All shared styles, variables, components
═══════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  /* Neutral light palette (Direction B) */
  --bg-page:#f4f5f7;
  --bg-surface:#ffffff;
  --border-subtle:#e8eaed;
  --border-medium:#dfe1e6;
  --text-primary:#1a1d21;
  --text-secondary:#4b5563;
  --text-muted:#9ca3af;
  --accent:#2563eb;
  --accent-hover:#1d4ed8;
  --accent-soft:#eef4ff;
  /* Legacy aliases (keep pages working) */
  --b900:#1a1d21;--b800:#252830;--b700:#374151;--b600:#2563eb;
  --b500:#2563eb;--b400:#3b82f6;--b300:#93c5fd;--b200:#dbeafe;--b100:#e8eaed;--b50:#f4f5f7;
  --tp:#1a1d21;--ts:#374151;--tm:#6b7280;
  --r:10px;--rl:12px;--rxl:16px;
  --sh:0 1px 2px rgba(0,0,0,.04),0 2px 8px rgba(0,0,0,.04);
  --shl:0 4px 16px rgba(0,0,0,.08),0 12px 40px rgba(0,0,0,.06);
  --overdue:#ef4444;--overdue-bg:#fef2f2;--overdue-border:#fecaca;
  --nav-h:52px;
}
body{font-family:'Montserrat',sans-serif;background:var(--bg-page);color:var(--text-primary);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}

/* ── APP NAV — LinkedIn-style (icon top, label bottom) ── */
.app-nav{
  position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:400;
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:stretch;
  padding:0 16px 0 20px;background:var(--bg-surface);
  border-bottom:1px solid var(--border-subtle);
}
.app-nav-brand{
  display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text-primary);
  flex-shrink:0;align-self:center;padding-right:8px;
}
.jh-brand{display:inline-flex;align-items:center;gap:8px;line-height:1;max-width:100%}
.jh-logo{display:block;flex-shrink:0;border-radius:6px;object-fit:contain}
.app-nav-brand .jh-logo{width:28px;height:28px;border-radius:5px}
.jh-wordmark{
  font-size:17px;font-weight:700;letter-spacing:-.045em;color:rgba(0,0,0,.88);line-height:1;
  white-space:nowrap;font-family:'Montserrat',system-ui,sans-serif;
}
.jh-wordmark-main{font-weight:700;color:var(--text-primary)}
.jh-wordmark-hq{font-weight:600;color:var(--text-muted)}
.login-logo{display:flex;justify-content:center;margin-bottom:4px}
.login-logo .jh-logo{width:96px;height:96px;border-radius:14px}
.reset-brand .jh-brand{justify-content:center}

/* Motivational quote typing */
.motiv-quote{min-height:2.6em;display:flex;align-items:center;justify-content:center;text-align:center}
.motiv-quote .quote-typed,.motiv-quote .quote-cursor{display:inline}
.quote-cursor{font-weight:700;animation:quoteBlink 1s step-end infinite}
@keyframes quoteBlink{50%{opacity:0}}
.motiv-quote--login .quote-typed,.motiv-quote--login .quote-cursor{
  font-family:'Dancing Script',cursive;font-size:22px;font-weight:700;color:#ea580c;line-height:1.35;
}
.motiv-quote--dash .quote-typed,.motiv-quote--dash .quote-cursor{
  font-size:14px;font-weight:600;font-style:italic;color:var(--accent);line-height:1.45;
}


.app-nav-main{
  display:flex;align-items:stretch;justify-content:center;gap:0;
  min-width:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
}
.app-nav-main::-webkit-scrollbar{display:none}

.app-nav-item{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-width:68px;max-width:96px;padding:0 6px;text-decoration:none;
  color:rgba(0,0,0,.6);border-bottom:2px solid transparent;
  transition:color .12s ease,border-color .12s ease;flex-shrink:0;
}
.app-nav-item:hover{color:rgba(0,0,0,.85)}
.app-nav-item.is-active{color:rgba(0,0,0,.9);border-bottom-color:rgba(0,0,0,.9)}
.app-nav-item.is-soon{opacity:.4;pointer-events:none}
.app-nav-item.is-locked,.app-nav-drawer-item.is-locked{opacity:.55;cursor:not-allowed}
.app-nav-item.is-locked.is-active,.app-nav-drawer-item.is-locked.is-active{border-bottom-color:transparent;color:rgba(0,0,0,.45)}
.profile-onboard-btn--ghost:hover{background:#f4f5f7!important;color:#374151!important}

.app-nav-icon{
  position:relative;width:24px;height:24px;display:flex;align-items:center;justify-content:center;
}
.app-nav-icon svg{width:24px;height:24px;display:block}
.app-nav-item .icon-filled{display:none}
.app-nav-item .icon-outline{display:block;color:currentColor}
.app-nav-item.is-active .icon-filled{display:block;color:currentColor}
.app-nav-item.is-active .icon-outline{display:none}

.app-nav-label{
  font-size:11px;font-weight:400;line-height:1.1;margin-top:3px;
  text-align:center;white-space:nowrap;max-width:100%;
  overflow:hidden;text-overflow:ellipsis;
}
.app-nav-item.is-active .app-nav-label{font-weight:600}

.app-nav-divider{
  align-self:stretch;width:1px;background:var(--border-subtle,#e2e8f0);
  margin:8px 6px;flex-shrink:0;
}
.app-nav-drawer-divider{height:1px;background:var(--border-subtle,#e2e8f0);margin:10px 0}
.app-nav-drawer-section-label{
  font-size:10px;font-weight:800;color:var(--text-muted,#94a3b8);
  text-transform:uppercase;letter-spacing:.08em;padding:4px 14px 8px;
}

.app-nav-right{
  display:flex;align-items:stretch;flex-shrink:0;align-self:stretch;
  border-left:1px solid var(--border-subtle);margin-left:4px;padding-left:4px;
}
.app-nav-logout{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-width:64px;padding:0 8px;border:none;background:transparent;
  font-family:inherit;font-size:11px;font-weight:400;color:rgba(0,0,0,.6);
  cursor:pointer;transition:color .12s ease;
}
.app-nav-logout:hover{color:rgba(0,0,0,.85)}
.app-nav-logout-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:currentColor}
.app-nav-logout-icon svg{width:24px;height:24px;display:block}
.app-nav-logout .icon-filled{display:none}
.app-nav-logout .icon-outline{display:block;color:currentColor}

.app-nav-settings{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-width:64px;padding:0 8px;border:none;background:transparent;
  font-family:inherit;font-size:11px;font-weight:400;color:rgba(0,0,0,.6);
  cursor:pointer;transition:color .12s ease;text-decoration:none;
}
.app-nav-settings:hover{color:rgba(0,0,0,.85)}
.app-nav-settings-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:currentColor}
.app-nav-settings-icon svg{width:24px;height:24px;display:block}
.app-nav-settings .icon-filled{display:none}
.app-nav-settings .icon-outline{display:block;color:currentColor}
.app-nav-settings.is-active{color:var(--accent);font-weight:600}
.app-nav-settings.is-active .icon-filled{display:block;color:var(--accent)}
.app-nav-settings.is-active .icon-outline{display:none}
.app-nav-settings.is-active .app-nav-label{font-weight:600}

.app-nav-menu{
  display:none;align-items:center;justify-content:center;
  width:44px;height:100%;padding:0;border:none;background:transparent;
  color:rgba(0,0,0,.75);cursor:pointer;font-family:inherit;
}
.app-nav-menu-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center}
.app-nav-menu-icon svg{width:24px;height:24px;display:block}

.app-nav-drawer{
  display:none;position:absolute;top:100%;left:0;right:0;
  background:var(--bg-surface);border-bottom:1px solid var(--border-subtle);
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  max-height:0;overflow:hidden;opacity:0;
  transition:max-height .28s ease,opacity .2s ease;
}
.app-nav-drawer-inner{padding:8px 0 12px}
.app-nav-drawer-item,.app-nav-drawer-logout{
  display:flex;align-items:center;gap:14px;width:100%;
  padding:13px 20px;text-decoration:none;border:none;background:transparent;
  font-family:inherit;font-size:14px;font-weight:500;color:var(--text-secondary);
  cursor:pointer;text-align:left;
}
.app-nav-drawer-item:hover,.app-nav-drawer-logout:hover{background:#f8f9fa;color:var(--text-primary)}
.app-nav-drawer-item.is-active{color:var(--text-primary);font-weight:600;background:var(--accent-soft)}
.app-nav-drawer-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.app-nav-drawer-icon svg{width:22px;height:22px;display:block}
.app-nav-drawer-item .icon-filled{display:none}
.app-nav-drawer-item.is-active .icon-filled{display:block;color:var(--accent)}
.app-nav-drawer-item.is-active .icon-outline{display:none}
.app-nav-drawer-settings{
  display:flex;align-items:center;gap:14px;width:100%;
  padding:13px 20px;text-decoration:none;border:none;background:transparent;
  font-family:inherit;font-size:14px;font-weight:500;color:var(--text-secondary);
  cursor:pointer;text-align:left;border-top:1px solid var(--border-subtle);margin-top:4px;padding-top:16px;
}
.app-nav-drawer-settings:hover{background:#f8f9fa;color:var(--text-primary)}
.app-nav-drawer-settings.is-active{color:var(--text-primary);font-weight:600;background:var(--accent-soft)}
.app-nav-drawer-settings .icon-filled{display:none}
.app-nav-drawer-settings.is-active .icon-filled{display:block;color:var(--accent)}
.app-nav-drawer-settings.is-active .icon-outline{display:none}
.app-nav-drawer-logout .icon-filled{display:none}
.app-nav-drawer-logout{border-top:1px solid var(--border-subtle);margin-top:0;padding-top:13px;color:#64748b}
.app-nav-backdrop{
  display:none;position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;
  background:rgba(15,23,42,.25);z-index:-1;
}
.app-nav.menu-open .app-nav-backdrop{display:block;z-index:399}

/* ── KAI FLOATING WIDGET ── */
.kai-fab{
  position:fixed;bottom:24px;right:24px;z-index:9500;
  width:52px;height:52px;border-radius:50%;
  border:none;background:var(--accent);color:#fff;cursor:pointer;
  box-shadow:0 4px 16px rgba(37,99,235,.4);display:flex;align-items:center;justify-content:center;
  transition:transform .2s,box-shadow .2s,background .2s;
}
.kai-fab-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:#fff}
.kai-fab-icon svg{width:24px;height:24px;display:block;color:#fff}
.kai-fab:hover{transform:scale(1.06);background:var(--accent-hover);box-shadow:0 6px 22px rgba(37,99,235,.45)}
.kai-fab-dot{
  position:absolute;top:2px;right:2px;width:10px;height:10px;border-radius:50%;
  background:#22c55e;border:2px solid #fff;
}
.kai-panel{
  position:fixed;bottom:88px;right:24px;z-index:9501;width:min(380px,calc(100vw - 32px));height:min(480px,calc(100vh - 120px));
  background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:14px;
  box-shadow:0 12px 40px rgba(0,0,0,.12);display:flex;flex-direction:column;overflow:hidden;
  opacity:0;transform:translateY(12px) scale(.96);pointer-events:none;
  transition:opacity .22s ease,transform .22s ease;
}
.kai-panel.open{opacity:1;transform:none;pointer-events:all}
.kai-panel-hdr{
  display:flex;align-items:center;justify-content:space-between;padding:12px 14px;
  border-bottom:1px solid var(--border-subtle);flex-shrink:0;
}
.kai-panel-title{font-size:14px;font-weight:700;color:var(--text-primary);display:flex;align-items:center;gap:8px}
.kai-live{width:8px;height:8px;border-radius:50%;background:#22c55e}
.kai-panel-close{
  width:28px;height:28px;border:none;background:transparent;border-radius:6px;
  font-size:20px;line-height:1;color:var(--text-muted);cursor:pointer;
}
.kai-panel-close:hover{background:#f0f1f3;color:var(--text-primary)}
.kai-msgs{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;min-height:0}
.kai-msg{display:flex}
.kai-msg-u{justify-content:flex-end}
.kai-bub{
  max-width:85%;padding:9px 12px;border-radius:12px;font-size:12px;line-height:1.5;font-weight:500;
}
.kai-msg-k .kai-bub{background:#f0f1f3;color:var(--text-primary);border-radius:4px 12px 12px 12px}
.kai-msg-u .kai-bub{background:var(--accent);color:#fff;border-radius:12px 4px 12px 12px}
.kai-quick{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px 8px;flex-shrink:0}
.kai-qbtn{
  padding:5px 10px;border-radius:999px;border:1px solid var(--border-subtle);background:#fff;
  font-family:inherit;font-size:10px;font-weight:600;color:var(--text-secondary);cursor:pointer;
}
.kai-qbtn:hover{border-color:var(--accent);color:var(--accent)}
.kai-qbtn:disabled{opacity:.5;cursor:not-allowed}
.kai-inrow{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--border-subtle);flex-shrink:0}
.kai-input{
  flex:1;padding:9px 12px;border:1px solid var(--border-subtle);border-radius:8px;
  font-family:inherit;font-size:12px;outline:none;
}
.kai-input:focus{border-color:var(--accent);box-shadow:0 0 0 2px rgba(37,99,235,.12)}
.kai-send{
  padding:9px 14px;border:none;border-radius:8px;background:var(--accent);color:#fff;
  font-family:inherit;font-size:12px;font-weight:600;cursor:pointer;
}
.kai-send:hover{background:var(--accent-hover)}
.kai-send:disabled{opacity:.55;cursor:not-allowed}

/* ── PAGE SHELL ── */
.page{min-height:100vh;display:flex;flex-direction:column}
.page-body{
  position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;
  overflow-y:auto;overflow-x:hidden;box-sizing:border-box;
  background:var(--bg-page);padding:24px 28px;
}

/* Kai keeps dark canvas below neutral nav */
.page-body-kai{
  position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;
  overflow-y:auto;overflow-x:hidden;box-sizing:border-box;
  background:#0f1419;padding:24px 28px;
}

/* ── COMMON COMPONENTS ── */
.ptitle{font-size:22px;font-weight:700;color:var(--text-primary);letter-spacing:-.4px}
.psub{font-size:13px;color:var(--text-muted);font-weight:400;margin-top:4px;margin-bottom:24px}
.statcard{background:var(--bg-surface);border-radius:var(--rl);padding:18px 22px;margin-bottom:20px;box-shadow:var(--sh);display:grid;grid-template-columns:repeat(4,1fr);gap:16px;border:1px solid var(--border-subtle)}
.statcard-5{grid-template-columns:repeat(5,1fr)}
.sn{font-size:20px;font-weight:700;color:var(--text-primary);letter-spacing:-.4px;line-height:1;text-align:center}
.sl{font-size:10px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-top:4px;text-align:center}
.pbg{grid-column:1/-1;background:var(--border-subtle);height:4px;border-radius:2px;overflow:hidden}
.pbar{height:100%;background:var(--accent);border-radius:2px;transition:width .4s ease}
.acard{background:var(--bg-surface);border-radius:var(--rl);padding:20px 22px;margin-bottom:20px;box-shadow:var(--sh);border:1px solid var(--border-subtle)}
.arow{display:flex;gap:8px;flex-wrap:wrap}
.tinput{flex:2;min-width:180px;padding:10px 12px;border:1px solid var(--border-subtle);border-radius:var(--r);font-family:'Montserrat',sans-serif;font-size:13px;font-weight:500;color:var(--text-primary);outline:none;transition:border-color .15s,box-shadow .15s;background:var(--bg-surface)}
.tinput::placeholder{color:var(--text-muted);font-weight:400}
.tinput:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.csel{padding:10px 12px;border:1px solid var(--border-subtle);border-radius:var(--r);font-family:'Montserrat',sans-serif;font-size:12px;font-weight:500;color:var(--text-secondary);background:var(--bg-surface);outline:none;cursor:pointer;min-width:130px;transition:border-color .15s,box-shadow .15s}
.dinput{padding:10px 12px;border:1px solid var(--border-subtle);border-radius:var(--r);font-family:'Montserrat',sans-serif;font-size:12px;font-weight:500;color:var(--text-secondary);background:var(--bg-surface);outline:none;cursor:pointer;min-width:140px;transition:border-color .15s}
.dinput:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.abtn{padding:10px 18px;background:var(--accent);border:none;border-radius:var(--r);font-family:'Montserrat',sans-serif;font-size:13px;font-weight:600;color:#fff;cursor:pointer;white-space:nowrap;transition:background .15s,transform .15s}
.abtn:hover{background:var(--accent-hover);transform:translateY(-1px)}
.actbtn{padding:8px 14px;border:1px solid var(--border-subtle);border-radius:var(--r);background:var(--bg-surface);color:var(--text-secondary);font-family:'Montserrat',sans-serif;font-size:12px;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s}
.actbtn:hover{background:#f0f1f3;border-color:var(--border-medium)}
.empty{text-align:center;padding:60px 20px;color:var(--text-muted)}
.ei{font-size:40px;margin-bottom:12px}
.et{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:6px}
.es{font-size:13px}

/* ── KANBAN ── */
.kanban-wrap{display:flex;gap:16px;overflow-x:auto;padding-bottom:8px;align-items:flex-start}
.kanban-wrap::-webkit-scrollbar{height:6px}.kanban-wrap::-webkit-scrollbar-track{background:transparent}.kanban-wrap::-webkit-scrollbar-thumb{background:var(--b200);border-radius:3px}
.kb-col{flex:1;min-width:220px;background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--rl);display:flex;flex-direction:column;overflow:hidden}
.kb-col-hdr{padding:12px 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border-subtle);background:var(--bg-surface)}
.kb-col-title{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;display:flex;align-items:center;gap:8px}
.kb-col-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.col-todo .kb-col-dot{background:#94a3b8}.col-inprog .kb-col-dot{background:#f59e0b}.col-done .kb-col-dot{background:#22c55e}
.col-todo .kb-col-title{color:#475569}.col-inprog .kb-col-title{color:#b45309}.col-done .kb-col-title{color:#15803d}
.kb-col-cnt{font-size:11px;font-weight:700;padding:2px 8px;border-radius:10px;background:rgba(0,0,0,.06);color:inherit}
.kb-cards{flex:1;padding:10px;display:flex;flex-direction:column;gap:8px;min-height:120px;transition:background .15s}
.kb-cards.drag-over{background:rgba(59,130,246,.06);border-radius:var(--r)}
.kb-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r);padding:11px 13px;cursor:grab;transition:border-color .15s,box-shadow .15s;display:flex;flex-direction:column}
.kb-card:active{cursor:grabbing}
.kb-card:hover{border-color:var(--border-medium);box-shadow:var(--sh)}
.kb-card.dragging{opacity:.35;transform:scale(.97);box-shadow:none}
.kb-card.overdue{border-color:var(--overdue-border);background:var(--overdue-bg)}
.kb-card.col-done-card{opacity:.55}
.kb-card.col-done-card .kb-card-txt{text-decoration:line-through;color:var(--tm)}
.kb-card-txt{font-size:13px;font-weight:500;color:var(--tp);line-height:1.4;word-break:break-word;margin-bottom:7px}
.kb-card-foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.kb-card-acts{display:flex;gap:4px;flex-wrap:wrap;max-height:0;overflow:hidden;opacity:0;transition:max-height .2s ease,opacity .18s ease,margin-top .2s ease;margin-top:0}
.kb-card:hover .kb-card-acts{max-height:40px;opacity:1;margin-top:8px}
.kb-act{padding:3px 8px;border-radius:6px;border:1px solid var(--b100);background:#f8fafc;color:var(--tm);font-family:'Montserrat',sans-serif;font-size:10px;font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap}
.kb-act:hover{background:var(--b50);color:var(--b600);border-color:var(--b300)}
.kb-act.del:hover{background:#fee2e2;color:#b91c1c;border-color:#fecaca}
.kb-empty{text-align:center;padding:24px 16px;color:var(--tm);font-size:12px;font-weight:500;opacity:.6}

/* ── SORT BAR ── */
.kb-sort-bar{display:flex;align-items:center;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.kb-sort-lbl{font-size:11px;font-weight:700;color:var(--tm);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
.kb-sort-btn{padding:6px 14px;border-radius:20px;border:1.5px solid var(--b100);background:#fff;color:var(--tm);font-family:'Montserrat',sans-serif;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap}
.kb-sort-btn:hover{border-color:var(--b300);color:var(--b600)}
.kb-sort-btn.on{background:var(--text-primary);border-color:var(--text-primary);color:#fff}

/* ── CATEGORY PILLS ── */
.cpill{font-size:10px;font-weight:700;padding:2px 8px;border-radius:7px;letter-spacing:.03em}
.c-cv{background:#dbeafe;color:#1d4ed8}.c-linkedin{background:#ede9fe;color:#6d28d9}.c-outreach{background:#fef3c7;color:#92400e}
.c-platform{background:#dcfce7;color:#15803d}.c-relationship{background:#fce7f3;color:#be185d}.c-interview{background:#fee2e2;color:#b91c1c}.c-other{background:#f1f5f9;color:#475569}
.deadline-tag{font-size:10px;font-weight:600;padding:2px 8px;border-radius:6px}
.dl-overdue{background:var(--overdue-bg);color:var(--overdue);border:1px solid var(--overdue-border)}
.dl-neutral{background:var(--b50);color:var(--tm);border:1px solid var(--b100)}

/* ── JOB CARDS ── */
.jcard{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r);padding:11px 13px;cursor:grab;transition:border-color .15s,box-shadow .15s;display:flex;flex-direction:column;gap:0}
.jcard:hover{border-color:var(--border-medium);box-shadow:var(--sh)}
.jcard.dragging{opacity:.35;transform:scale(.97)}
.jcard-company{font-size:12px;font-weight:800;color:var(--b700);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jcard-title{font-size:12px;font-weight:500;color:var(--tp);margin-bottom:7px;line-height:1.3}
.jcard-foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.jcard-acts{display:flex;gap:4px;flex-wrap:wrap;max-height:0;overflow:hidden;opacity:0;transition:max-height .2s ease,opacity .18s ease,margin-top .2s ease;margin-top:0}
.jcard:hover .jcard-acts{max-height:40px;opacity:1;margin-top:8px}
.jcard-link{font-size:10px;font-weight:600;color:var(--b500);text-decoration:none;padding:2px 0}
.jcard-link:hover{text-decoration:underline}
.stage-pill{font-size:10px;font-weight:700;padding:2px 8px;border-radius:7px;letter-spacing:.03em}
.sp-saved{background:#f1f5f9;color:#475569}.sp-applied{background:#dbeafe;color:#1d4ed8}.sp-screen{background:#ede9fe;color:#6d28d9}.sp-interview{background:#fef3c7;color:#92400e}.sp-offer{background:#dcfce7;color:#15803d}.sp-rejected{background:#fee2e2;color:#b91c1c}

/* ── AI CV ── */
.aicv-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.cv-textarea{width:100%;padding:12px 14px;border:1.5px solid var(--b100);border-radius:var(--r);font-family:'Montserrat',sans-serif;font-size:12px;color:var(--tp);outline:none;transition:all .2s;background:var(--b50);resize:vertical;line-height:1.6}
.cv-textarea:focus{border-color:var(--b400);background:#fff;box-shadow:0 0 0 3px rgba(59,130,246,.1)}
.cv-textarea::placeholder{color:var(--tm)}
.aicv-out-card{display:flex;flex-direction:column;min-height:340px}
.aicv-out-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.cv-score-wrap{text-align:center}
.cv-score{font-size:28px;font-weight:800;color:var(--b500);letter-spacing:-1px;line-height:1}
.cv-out-body{flex:1;font-size:12px;line-height:1.7;color:var(--tp);white-space:pre-wrap;word-break:break-word;overflow-y:auto;max-height:420px}
.cv-out-body::-webkit-scrollbar{width:4px}.cv-out-body::-webkit-scrollbar-thumb{background:var(--b200);border-radius:2px}
.cv-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;flex:1}
.cv-out-acts{display:flex;gap:8px;padding-top:12px;border-top:1px solid var(--b100);margin-top:12px;flex-wrap:wrap}
.cv-hist-item{background:var(--b50);border:1px solid var(--b100);border-radius:var(--r);padding:10px 14px;display:flex;align-items:center;gap:10px;margin-bottom:8px;cursor:pointer;transition:all .2s}
.cv-hist-item:hover{border-color:var(--b300);background:var(--b100)}
.cv-hist-body{flex:1;min-width:0}
.cv-hist-title{font-size:12px;font-weight:700;color:var(--tp);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv-hist-meta{font-size:10px;color:var(--tm);margin-top:2px}
.cv-hist-score{font-size:14px;font-weight:800;color:var(--b500);flex-shrink:0}
.cv-gen-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px 20px;text-align:center}

/* ── CONTACTS ── */
.ct-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-top:4px}
.ct-card{background:#fff;border:1.5px solid var(--b100);border-radius:var(--rl);padding:16px 18px;transition:all .2s;display:flex;flex-direction:column;gap:0;position:relative}
.ct-card:hover{border-color:var(--b300);box-shadow:0 4px 18px rgba(30,77,155,.1);transform:translateY(-2px)}
.ct-card-top{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px}
.ct-avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--b500),var(--b700));display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;color:#fff;flex-shrink:0}
.ct-info{flex:1;min-width:0}
.ct-name{font-size:13px;font-weight:800;color:var(--b900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ct-title{font-size:11px;color:var(--tm);font-weight:500;margin-top:2px}
.ct-company{font-size:11px;color:var(--b600);font-weight:600;margin-top:1px}
.ct-tags{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:8px}
.ct-type{font-size:10px;font-weight:700;padding:2px 8px;border-radius:7px;text-transform:uppercase}
.ct-type-recruiter{background:#dbeafe;color:#1d4ed8}.ct-type-alumni{background:#ede9fe;color:#6d28d9}.ct-type-hiring{background:#fef3c7;color:#92400e}.ct-type-referral{background:#dcfce7;color:#15803d}.ct-type-mentor{background:#fee2e2;color:#b91c1c}.ct-type-networking{background:#f1f5f9;color:#475569}
.ct-status{font-size:10px;font-weight:700;padding:2px 8px;border-radius:7px}
.ct-s-not_contacted{background:#f1f5f9;color:#64748b}.ct-s-reached_out{background:#dbeafe;color:#1d4ed8}.ct-s-responded{background:#fef3c7;color:#92400e}.ct-s-meeting{background:#dcfce7;color:#15803d}.ct-s-ongoing{background:#ede9fe;color:#6d28d9}
.ct-notes{font-size:11px;color:var(--tm);line-height:1.5;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ct-footer{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:8px;border-top:1px solid var(--b100)}
.ct-date{font-size:10px;color:var(--tm);font-weight:500;flex:1}
.ct-acts{display:flex;gap:4px;opacity:0;transition:opacity .15s}
.ct-card:hover .ct-acts{opacity:1}
.ct-followup{font-size:10px;font-weight:700;padding:2px 8px;border-radius:6px;background:#fef3c7;color:#92400e;border:1px solid #fde68a}
.ct-form{background:#fff;border-radius:var(--rl);padding:18px 20px;margin-bottom:16px;box-shadow:var(--sh);border:1px solid var(--b100)}
.ct-form-grid{display:grid;grid-template-columns:2fr 2fr 2fr 1.5fr 1.5fr auto;gap:8px;align-items:end}
.ct-filter-bar{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}

/* ── FILES ── */
.ftab-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.fcat-card{background:#fff;border-radius:var(--rl);padding:20px 24px;box-shadow:var(--sh);border:1px solid var(--b100)}
.fcat-title{font-size:14px;font-weight:700;color:var(--b900);margin-bottom:4px;display:flex;align-items:center;gap:8px}
.fcat-sub{font-size:11px;color:var(--tm);margin-bottom:16px}
.dropzone{border:2px dashed var(--b200);border-radius:var(--r);padding:28px 20px;text-align:center;cursor:pointer;transition:all .2s;background:var(--b50)}
.dropzone:hover,.dropzone.over{border-color:var(--b400);background:var(--b100)}
.dz-icon{font-size:28px;margin-bottom:8px}.dz-text{font-size:12px;font-weight:600;color:var(--tm)}.dz-sub{font-size:11px;color:var(--tm);margin-top:3px;font-weight:400}
.file-list{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.fitem{display:flex;align-items:center;gap:10px;background:var(--b50);border:1px solid var(--b100);border-radius:var(--r);padding:10px 12px}
.fitem-icon{font-size:18px;flex-shrink:0}
.fitem-body{flex:1;min-width:0}
.fitem-name{font-size:12px;font-weight:600;color:var(--tp);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.fitem-meta{font-size:10px;color:var(--tm);margin-top:2px}
.fitem-del{border:none;background:transparent;color:var(--tm);cursor:pointer;font-size:14px;padding:2px 6px;border-radius:6px;transition:all .15s;flex-shrink:0}
.fitem-del:hover{background:#fee2e2;color:#b91c1c}
.finput{display:none}

/* ── UTILS ── */
#cov{position:fixed;inset:0;pointer-events:none;z-index:9998}
.cp{position:absolute;width:8px;height:8px;border-radius:2px;animation:cf linear forwards}
@keyframes cf{0%{transform:translateY(-20px) rotate(0);opacity:1}100%{transform:translateY(100vh) rotate(720deg);opacity:0}}
#toast{position:fixed;bottom:28px;right:28px;background:var(--text-primary);color:#fff;padding:12px 18px;border-radius:10px;font-size:13px;font-weight:500;box-shadow:var(--shl);z-index:9999;opacity:0;transform:translateY(10px);transition:all .25s;pointer-events:none}
#toast.on{opacity:1;transform:translateY(0)}
.spin{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:sp .7s linear infinite;vertical-align:middle;margin-right:6px}
@keyframes sp{to{transform:rotate(360deg)}}
.tdots{display:flex;gap:4px;align-items:center}
.tdots span{width:6px;height:6px;border-radius:50%;background:var(--tm);animation:dl .9s ease-in-out infinite}
.tdots span:nth-child(2){animation-delay:.15s}.tdots span:nth-child(3){animation-delay:.3s}
@keyframes dl{0%,100%{transform:scale(.6);opacity:.4}50%{transform:scale(1);opacity:1}}
@keyframes tIn{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}

@media(max-width:768px){
  .app-nav{
    grid-template-columns:1fr auto;
    grid-template-rows:auto;
    position:relative;
    padding:0 12px 0 16px;
  }
  .app-nav-brand{grid-column:1;grid-row:1}
  .app-nav-right{grid-column:2;grid-row:1}
  .app-nav-main{display:none}
  .app-nav-logout--desk,.app-nav-settings--desk{display:none}
  .app-nav-right{border-left:none;margin-left:0;padding-left:0}
  .app-nav-menu{display:flex}
  .app-nav-drawer{display:block;z-index:401}
  .app-nav.menu-open .app-nav-drawer{
    max-height:calc(100vh - var(--nav-h));
    opacity:1;
  }
  .jh-wordmark{font-size:15px}

  /* Page shell */
  .page-body,.page-body-kai,.page-body-prep{padding:12px 14px}
  .ptitle{font-size:19px;letter-spacing:-.3px}
  .psub{font-size:12px;margin-bottom:16px}

  /* Stats rows */
  .statcard{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px;padding:14px 16px}

  /* Kanban */
  .kanban-wrap{flex-direction:column}
  .kb-col{min-width:unset;max-width:unset;width:100%}

  /* Modals — bottom sheet, single column */
  .modal-overlay,.detail-overlay{
    padding:0;align-items:flex-end;
  }
  .modal,.detail-box{
    width:100%;max-width:none;margin:0;
    border-radius:18px 18px 0 0;
    max-height:min(92vh,100dvh);
    overflow-y:auto;-webkit-overflow-scrolling:touch;
    padding:20px 16px calc(20px + env(safe-area-inset-bottom,0px));
  }
  .modal{padding:22px 16px calc(22px + env(safe-area-inset-bottom,0px))}
  .modal-close,.detail-close{top:12px;right:12px}
  .modal-title{font-size:17px;padding-right:36px}
  .modal-sub{margin-bottom:16px;font-size:11px}
  .modal-cols,.modal-grid,.form-row,.int-grid,.prof-grid,.detail-cols{
    grid-template-columns:1fr!important;gap:0;
  }
  .modal-grid .fgroup[style*="grid-column"]{grid-column:1/-1!important}
  .modal-grid .fgroup{margin-bottom:14px}
  .modal-col-hdr{margin-top:8px}
  .modal-footer,.docs-section{grid-column:1/-1!important;margin-top:20px}
  .modal-footer{flex-direction:column;gap:8px}
  .modal-save,.modal-del,.detail-edit,.detail-move,.detail-del{width:100%;min-width:0}
  .salary-row{grid-template-columns:1fr;gap:6px}
  .salary-sep{display:none}
  .priority-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}

  /* Consistent form control sizing on mobile */
  .finp,.fsel{box-sizing:border-box;width:100%}
  .finp[type="date"],.finp[type="time"],.finp[type="datetime-local"]{
    min-height:44px;-webkit-appearance:none;appearance:none;
  }

  /* Detail popups */
  .detail-hdr{padding:18px 16px 14px}
  .detail-main,.detail-body,.detail-side{padding:14px 16px}
  .detail-side{padding-top:0}
  .detail-footer{
    padding:14px 16px calc(18px + env(safe-area-inset-bottom,0px));
    flex-direction:column;gap:8px;
  }
  .interview-highlight,.ghost-highlight{margin:12px 16px 0}

  /* Contacts, files, jobs top bars */
  .jobs-topbar,.ct-topbar,.files-topbar{
    flex-direction:column;align-items:stretch;gap:10px;margin-bottom:16px;
  }
  .ct-topbar-right,.jobs-topbar-right{width:100%;flex-direction:column;gap:8px}
  .add-job-btn,.add-contact-btn,.add-file-btn,.missing-btn{width:100%;justify-content:center}
  .ct-grid{grid-template-columns:1fr}
  .ct-form-grid{grid-template-columns:1fr!important}
  .ct-card-acts,.ct-acts{opacity:1}

  /* Files table → stacked rows */
  .files-table{border-radius:var(--r)}
  .files-table-hdr{display:none}
  .frow{
    grid-template-columns:1fr auto;gap:6px 10px;
    padding:14px 14px;position:relative;
  }
  .frow-name{grid-column:1/-1}
  .frow-type{justify-self:start}
  .frow-date{justify-self:start;font-size:10px}
  .frow-acts{opacity:1;align-self:start}

  /* AI CV */
  .aicv-columns{flex-direction:column;gap:14px}
  .aicv-inputs,.cv-doc-wrap{flex:none;width:100%}
  .cv-doc-wrap{
    position:static;height:auto;min-height:320px;max-height:none;
    top:auto;
  }
  .cv-doc-head{flex-wrap:wrap;gap:8px;padding:14px 16px 10px}
  .cv-doc-actions{width:100%;flex-wrap:wrap}
  .cv-doc-btn{flex:1;min-width:calc(50% - 4px);text-align:center;justify-content:center}

  /* Interview prep */
  .page-body-prep{overflow-y:auto!important;overflow-x:hidden}
  .prep-shell{flex-direction:column;height:auto;min-height:0}
  .prep-sidebar{
    width:100%;min-width:0;max-height:none;
    border-right:none;border-bottom:1px solid var(--b100);
  }
  .prep-sidebar-scroll{max-height:none}
  .prep-type-grid{grid-template-columns:1fr!important}
  .prep-results-grid{grid-template-columns:1fr!important}
  .prep-results-grid .span-2,.prep-results-grid .span-3{grid-column:span 1!important}
  .prep-main-hdr{padding:12px 14px}
  .prep-main-scroll{padding:12px 14px 20px}
  .page-body-prep{padding:0!important}

  /* Profile */
  .prof-skill-row,.prof-lang-row{grid-template-columns:1fr!important}

  /* Misc grids */
  .ftab-grid{grid-template-columns:1fr}

  /* Kai widget */
  .kai-fab{bottom:16px;right:16px;width:48px;height:48px}
  .kai-panel{
    bottom:76px;right:12px;left:12px;width:auto;
    height:min(70vh,calc(100dvh - 100px));
  }
  #toast{bottom:16px;right:16px;left:16px;text-align:center}
}
@media(max-width:900px){.aicv-layout{grid-template-columns:1fr}}
@media(max-width:520px){
  .page-body,.page-body-kai,.page-body-prep{padding:10px 12px}
  .statcard{grid-template-columns:1fr 1fr!important}
  .priority-row{grid-template-columns:1fr}
  .owner-toggle{flex-direction:column}
  .outreach-tabs{flex-wrap:wrap}
  .modal,.detail-box{border-radius:16px 16px 0 0;padding:18px 14px calc(18px + env(safe-area-inset-bottom,0px))}
  .cv-doc-btn{min-width:100%;flex:none}
}

/* Profile onboarding modal */
.profile-onboard-overlay{
  position:fixed;inset:0;z-index:9000;background:rgba(10,22,40,.55);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;padding:20px;
}
.profile-onboard-card{
  background:#fff;border-radius:20px;padding:32px 28px;max-width:400px;width:100%;
  box-shadow:0 24px 64px rgba(10,22,40,.2);text-align:center;
  font-family:'Montserrat',sans-serif;
}
.profile-onboard-icon{font-size:40px;margin-bottom:12px}
.profile-onboard-card h2{font-size:18px;font-weight:800;color:#1a1d21;margin-bottom:10px;letter-spacing:-.03em}
.profile-onboard-card p{font-size:13px;color:#6b7280;line-height:1.6;margin-bottom:22px}
.profile-onboard-btn{
  display:inline-block;padding:13px 28px;background:#2563eb;color:#fff;border-radius:10px;
  text-decoration:none;font-size:13px;font-weight:700;transition:background .15s;
  border:none;cursor:pointer;font-family:'Montserrat',sans-serif;
}
.profile-onboard-btn:hover{background:#1d4ed8}
.profile-onboard-btn--ghost:hover{background:#f4f5f7!important;color:#374151!important}

/* Guide tour & Help / FAQ */
.guide-wrap{max-width:920px;margin:0 auto;padding-bottom:32px}

/* ── Immersive fullscreen tour ── */
html.guide-immersive-root,body.guide-immersive{
  overflow:hidden!important;height:100%;background:#0a0e17;
}
body.guide-immersive .app-nav,body.guide-immersive .page{display:none!important}
.guide-immersive-backdrop{
  position:fixed;inset:0;z-index:8000;
  background:
    radial-gradient(ellipse 80% 60% at 50% 45%, rgba(37,99,235,.12) 0%, transparent 55%),
    rgba(8,12,22,.82);
  backdrop-filter:blur(16px) saturate(1.1);
  -webkit-backdrop-filter:blur(16px) saturate(1.1);
  animation:guideBackdropIn .45s ease both;
}
.guide-immersive-stage{
  position:fixed;inset:0;z-index:8001;
  display:flex;align-items:center;justify-content:center;
  padding:20px 16px;pointer-events:none;
}
.guide-immersive-shell{
  pointer-events:auto;width:min(980px,100%);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);
  display:flex;flex-direction:column;
  background:rgba(255,255,255,.98);
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.06),
    0 24px 80px rgba(0,0,0,.45),
    0 0 120px rgba(37,99,235,.12);
  animation:guideShellIn .5s cubic-bezier(.22,1,.36,1) both;
  overflow:hidden;
}
.guide-immersive-top{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 18px;border-bottom:1px solid var(--border-subtle);
  background:linear-gradient(180deg,#fff 0%,#fafbfc 100%);flex-shrink:0;
}
.guide-immersive-brand{
  display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700;color:var(--text-secondary);
}
.guide-immersive-brand .jh-logo{border-radius:6px}
.guide-immersive-close{
  width:36px;height:36px;border:none;border-radius:10px;background:var(--bg-page);
  color:var(--text-muted);font-size:16px;font-weight:700;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s;
}
.guide-immersive-close:hover{background:#fee2e2;color:#b91c1c}
.guide-immersive-body{
  flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;
  padding:20px 22px 12px;
  scrollbar-width:thin;
}
.guide-immersive-intro{margin-bottom:16px}
.guide-immersive-intro h1{
  font-size:clamp(1.25rem,2.5vw,1.5rem);font-weight:800;letter-spacing:-.03em;
  color:var(--text-primary);margin-bottom:6px;
}
.guide-immersive-intro p{font-size:13px;color:var(--text-muted);line-height:1.55;max-width:560px}
.guide-progress--immersive{margin-bottom:16px}
.guide-step-host{transition:opacity .28s ease,transform .28s ease}
.guide-step-host.is-switching{opacity:0;transform:translateY(8px) scale(.985)}
.guide-step-card--immersive{
  border:none;box-shadow:none;padding:0;margin:0;background:transparent;
}
.guide-step-layout--immersive{
  grid-template-columns:1fr minmax(280px,420px);gap:28px;align-items:stretch;
}
.guide-mock-stage{
  display:flex;align-items:center;justify-content:center;
  padding:12px;background:linear-gradient(160deg,#f4f5f7 0%,#eef2ff 100%);
  border-radius:14px;border:1px solid var(--border-subtle);
  min-height:240px;
}
.guide-mock-stage .guide-mock-frame{width:100%;max-width:400px}
.guide-mock-stage .guide-mock-body{min-height:200px!important}
.guide-immersive-footer{
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  padding:14px 18px;border-top:1px solid var(--border-subtle);
  background:#fafbfc;flex-shrink:0;
}
.guide-immersive-footer-right{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.guide-progress-dots .guide-dot{
  border:none;padding:0;cursor:pointer;font:inherit;background:var(--border-subtle);
}
.guide-progress-dots .guide-dot:hover{background:#93c5fd}
@keyframes guideBackdropIn{from{opacity:0}to{opacity:1}}
@keyframes guideShellIn{
  from{opacity:0;transform:translateY(20px) scale(.96)}
  to{opacity:1;transform:none}
}

.guide-hdr{margin-bottom:24px}
.guide-hdr h1{font-size:22px;font-weight:800;letter-spacing:-.03em;color:var(--text-primary)}
.guide-hdr p{font-size:13px;color:var(--text-muted);margin-top:6px;line-height:1.5}
.guide-progress{display:flex;align-items:center;gap:10px;margin-bottom:20px;flex-wrap:wrap}
.guide-progress-dots{display:flex;gap:5px;flex-wrap:wrap}
.guide-dot{width:8px;height:8px;border-radius:50%;background:var(--border-subtle);transition:background .15s,transform .15s}
.guide-dot.is-active{background:var(--accent);transform:scale(1.15)}
.guide-dot.is-done{background:#93c5fd}
.guide-progress-label{font-size:11px;font-weight:700;color:var(--text-muted)}
.guide-step-card{
  background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--rl);
  padding:22px 24px;box-shadow:var(--sh);margin-bottom:16px;
}
.guide-step-layout{display:grid;grid-template-columns:1fr 300px;gap:24px;align-items:start}
.guide-step-copy{min-width:0}
.guide-step-badge{
  display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:800;
  text-transform:uppercase;letter-spacing:.06em;color:var(--accent);margin-bottom:8px;
}
.guide-step-title{font-size:20px;font-weight:800;letter-spacing:-.03em;color:var(--text-primary);margin-bottom:10px}
.guide-step-list{margin:0 0 12px;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px}
.guide-step-list li{font-size:12px;color:var(--text-secondary);line-height:1.5;padding-left:16px;position:relative}
.guide-step-list li::before{content:'•';position:absolute;left:0;color:var(--accent);font-weight:800}
.guide-step-tip{
  font-size:11px;color:var(--text-muted);line-height:1.5;padding:10px 12px;
  background:var(--bg-page);border-radius:8px;border:1px solid var(--border-subtle);margin-bottom:14px;
}
.guide-step-tip strong{color:var(--text-primary)}
.guide-step-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.guide-open-btn{
  display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:8px;
  background:var(--accent);color:#fff;font-size:11px;font-weight:700;text-decoration:none;border:none;cursor:pointer;font-family:inherit;
}
.guide-open-btn:hover{background:var(--accent-hover)}
.guide-open-btn.ghost{background:#fff;border:1.5px solid var(--border-subtle);color:var(--accent)}
.guide-open-btn.ghost:hover{background:var(--accent-soft);border-color:var(--accent)}
.guide-open-btn:disabled,.guide-open-btn.is-locked{opacity:.55;cursor:not-allowed;pointer-events:none}
.guide-nav{display:flex;justify-content:space-between;gap:10px;margin-top:8px;flex-wrap:wrap}
.guide-nav-btn{
  padding:10px 16px;border:1.5px solid var(--border-subtle);border-radius:8px;background:#fff;
  font-family:inherit;font-size:12px;font-weight:700;color:var(--text-secondary);cursor:pointer;
}
.guide-nav-btn:hover{border-color:var(--accent);color:var(--accent)}
.guide-nav-btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.guide-nav-btn.primary:hover{background:var(--accent-hover)}
.guide-nav-btn:disabled{opacity:.45;cursor:not-allowed}
.guide-mock-frame{
  background:var(--bg-page);border:1px solid var(--border-subtle);border-radius:12px;
  overflow:hidden;box-shadow:var(--sh);font-size:9px;line-height:1.3;
}
.guide-mock-bar{
  display:flex;align-items:center;gap:5px;padding:7px 10px;background:#fff;border-bottom:1px solid var(--border-subtle);
}
.guide-mock-dot{width:6px;height:6px;border-radius:50%;background:#e2e8f0}
.guide-mock-body{padding:10px;background:var(--bg-page);min-height:160px;position:relative}
.guide-mock.is-locked .guide-mock-body{opacity:.55;filter:grayscale(.25)}
.guide-mock.is-compact{font-size:7px;border-radius:6px}
.guide-mock.is-compact .guide-mock-body{padding:5px;min-height:52px!important}
.guide-mock.is-compact .gm-stat-n{font-size:8px}
.guide-mock.is-compact .gm-kb-col{min-height:40px;padding:3px}
.guide-mock.is-compact .gm-card{font-size:5px;padding:2px 3px}
.guide-mock.is-compact .gm-kai-fab{width:16px;height:16px;font-size:8px}
.guide-mock.is-compact .gm-kai-panel{display:none}
.guide-mock-lock{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.72);font-size:10px;font-weight:800;color:var(--text-muted);text-align:center;padding:12px;
}
.gm-row{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:8px}
.gm-stat{background:#fff;border:1px solid var(--border-subtle);border-radius:6px;padding:6px 4px;text-align:center}
.gm-stat-n{font-size:11px;font-weight:800;color:var(--text-primary)}
.gm-stat-l{font-size:7px;font-weight:700;color:var(--text-muted);text-transform:uppercase;margin-top:2px}
.gm-quote{height:22px;background:var(--accent-soft);border:1px solid #bfdbfe;border-radius:6px;margin-bottom:8px}
.gm-kb{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.gm-kb-col{background:#fff;border:1px solid var(--border-subtle);border-radius:6px;padding:5px;min-height:72px}
.gm-kb-h{font-size:7px;font-weight:800;color:var(--text-muted);margin-bottom:4px}
.gm-card{background:#fff;border:1px solid var(--border-subtle);border-radius:5px;padding:4px 5px;margin-bottom:3px;font-size:7px;font-weight:600;color:var(--text-secondary)}
.gm-card.accent{border-color:#bfdbfe;background:#eef4ff;color:#1d4ed8}
.gm-card.ghost{border-style:dashed;color:#94a3b8}
.gm-pill{display:inline-block;font-size:6px;font-weight:800;padding:2px 4px;border-radius:4px;margin-top:2px}
.gm-contact{display:flex;align-items:center;gap:5px;padding:5px 6px;background:#fff;border:1px solid var(--border-subtle);border-radius:6px;margin-bottom:4px}
.gm-avatar{width:18px;height:18px;border-radius:50%;background:#dbeafe;flex-shrink:0}
.gm-lines{flex:1;min-width:0}
.gm-line{height:4px;background:#e8eaed;border-radius:99px;margin-bottom:3px}
.gm-line.short{width:55%}
.gm-file{display:flex;align-items:center;gap:6px;padding:5px 6px;background:#fff;border:1px solid var(--border-subtle);border-radius:6px;margin-bottom:4px}
.gm-file-ico{font-size:10px}
.gm-btn{display:block;width:100%;padding:6px;border:none;border-radius:6px;background:var(--accent);color:#fff;font-size:8px;font-weight:800;text-align:center;margin-top:6px}
.gm-profile{padding:8px;background:#fff;border:1px solid var(--border-subtle);border-radius:6px}
.gm-profile h4{font-size:8px;font-weight:800;margin-bottom:4px;color:var(--text-primary)}
.gm-kai-wrap{position:relative;min-height:140px}
.gm-kai-page{height:100px;background:#fff;border:1px solid var(--border-subtle);border-radius:6px;padding:6px}
.gm-kai-fab{
  position:absolute;bottom:4px;right:4px;width:28px;height:28px;border-radius:50%;
  background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;
  box-shadow:0 4px 12px rgba(37,99,235,.35);
}
.gm-kai-panel{
  position:absolute;bottom:36px;right:0;width:88%;background:#fff;border:1px solid var(--border-subtle);
  border-radius:8px;padding:6px;box-shadow:var(--sh);
}
.gm-bubble{font-size:7px;padding:4px 6px;border-radius:6px;margin-bottom:4px;line-height:1.4}
.gm-bubble.bot{background:#f0f1f3;color:var(--text-primary)}
.gm-bubble.user{background:var(--accent-soft);color:#1e40af;margin-left:12px}
.gm-set-nav{display:flex;flex-direction:column;gap:3px;width:42%;float:left;margin-right:6px}
.gm-set-item{font-size:6px;padding:3px 5px;border-radius:4px;background:#fff;border:1px solid var(--border-subtle);color:var(--text-muted);font-weight:700}
.gm-set-item.on{background:var(--accent-soft);color:var(--accent);border-color:#bfdbfe}
.gm-usage-bar{height:5px;background:#e2e8f0;border-radius:99px;margin:4px 0;overflow:hidden}
.gm-usage-fill{height:100%;background:var(--accent);border-radius:99px;width:45%}
.gm-kb-4{grid-template-columns:repeat(4,1fr)!important}
.gm-action-hint{
  position:absolute;top:6px;right:8px;z-index:15;font-size:7px;font-weight:800;color:#fff;
  background:var(--accent);padding:3px 7px;border-radius:99px;opacity:0;pointer-events:none;
}
.gm-action-hint::before{display:inline}

.gm-pointer{
  position:absolute;width:11px;height:11px;border-radius:50% 50% 50% 2px;background:#1a1d21;
  transform:rotate(-45deg);z-index:25;pointer-events:none;opacity:0;
  box-shadow:0 0 0 2px #fff,0 2px 6px rgba(0,0,0,.2);
}
.gm-pointer::after{
  content:'';position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--accent);
  opacity:0;transform:scale(.4);
}
.gm-chart{display:flex;align-items:flex-end;gap:4px;height:28px;margin-top:4px;padding:0 2px}
.gm-chart-bar{flex:1;background:var(--accent);border-radius:3px 3px 0 0;opacity:.85;transform-origin:bottom;height:0}
.gm-type-line{overflow:hidden;white-space:nowrap}
.gm-type-text{display:inline-block;overflow:hidden;white-space:nowrap;max-width:0;vertical-align:bottom}
.gm-caret{display:inline-block;width:1px;height:9px;background:var(--accent);vertical-align:middle;margin-right:2px;opacity:0}
.gm-field{margin-bottom:6px}
.gm-field-label{font-size:6px;font-weight:800;color:var(--text-muted);text-transform:uppercase;margin-bottom:2px;display:block}
.gm-field-val{font-size:7px!important;margin:0!important}
.gm-output{margin-top:6px;padding:6px;background:#fff;border:1px solid var(--border-subtle);border-radius:6px;min-height:36px}
.gm-output-line{height:4px;background:#e8eaed;border-radius:99px;margin-bottom:4px;width:0}
.gm-output-line.short{width:0!important}
.gm-output-badge{font-size:7px;font-weight:800;color:#059669;opacity:0;margin-top:4px}
.gm-step-n{display:inline-flex;width:12px;height:12px;border-radius:50%;background:#dbeafe;color:#1d4ed8;font-size:7px;font-weight:900;align-items:center;justify-content:center;margin-right:4px}
.gm-prep-out{margin-top:6px;min-height:16px}
.gm-dropzone{
  border:1px dashed #93c5fd;border-radius:6px;padding:10px;text-align:center;margin-bottom:6px;
  background:#f8fafc;color:var(--text-muted);font-size:7px;font-weight:600;
}
.gm-dropzone-ico{display:block;font-size:12px;margin-bottom:2px}
.gm-status-change{display:flex;align-items:center;gap:4px;font-size:6px;font-weight:700;margin:4px 0 6px;padding:0 2px}
.gm-status.from{color:#94a3b8}.gm-status.to{color:#2563eb;opacity:0}.gm-status-arrow{opacity:.4}
.gm-input{
  padding:5px 7px;background:#fff;border:1px solid #bfdbfe;border-radius:6px;margin-bottom:6px;
  font-size:7px;font-weight:600;color:var(--text-primary);min-height:20px;
}
.gm-profile-fill h4{font-size:8px;font-weight:800;margin-bottom:4px;color:var(--text-primary)}
.gm-line-grow{width:0!important}
.gm-line-grow.d2{animation-delay:.15s}.gm-line-grow.d3{animation-delay:.3s}
.gm-date{font-size:7px;color:#6b7280;margin-top:4px;opacity:0}
.gm-btn.ghost{background:#fff;border:1px solid #e8eaed;color:#2563eb}
.gm-set-panel{overflow:hidden;padding-top:2px}
.gm-usage-label{font-size:7px;color:#6b7280;margin:6px 0 2px}
.gm-card-slot{min-height:18px;border:1px dashed #cbd5e1;background:#f8fafc}

/* ── Guide mock animations (loop ~5s) ── */
.guide-mock.is-compact .gm-scene,.guide-mock.is-compact .gm-pointer,.guide-mock.is-compact .gm-action-hint{display:none}
.guide-mock.is-compact .guide-mock-body{overflow:hidden}
.guide-mock.is-animated .guide-mock-body{overflow:hidden}

@keyframes gmHint{0%,8%{opacity:0;transform:translateY(4px)}12%,55%{opacity:1;transform:none}70%,100%{opacity:0}}
@keyframes gmPtrMove{0%,5%{opacity:0}8%,12%{opacity:1}88%,100%{opacity:0}}
@keyframes gmPtrClick{0%,100%{transform:rotate(-45deg) scale(1)}48%{transform:rotate(-45deg) scale(.82)}52%{transform:rotate(-45deg) scale(.82)}}
@keyframes gmRipple{0%,45%{opacity:0;transform:scale(.4)}50%{opacity:.55;transform:scale(1.2)}60%,100%{opacity:0;transform:scale(1.5)}}
@keyframes gmTypeWidth{0%,15%{max-width:0}55%,85%{max-width:100%}100%{max-width:100%}}
@keyframes gmCaretBlink{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes gmPopIn{0%,10%{opacity:0;transform:translateY(6px) scale(.92)}22%,100%{opacity:1;transform:none}}
@keyframes gmBarGrow{0%,25%{height:0}45%,100%{height:var(--h,60%)}}
@keyframes gmDragJobs{0%,12%{transform:translate(0,0);opacity:1}13%{box-shadow:0 6px 14px rgba(37,99,235,.25)}40%,55%{transform:translate(58px,-2px);opacity:1}56%,100%{transform:translate(58px,-2px);opacity:0}}
@keyframes gmDragTodo{0%,12%{transform:translate(0,0)}40%,55%{transform:translate(62px,0)}56%,100%{transform:translate(62px,0);opacity:0}}
@keyframes gmSlotFill{0%,54%{opacity:0;transform:scale(.9)}58%,88%{opacity:1;transform:none}95%,100%{opacity:1}}
@keyframes gmRowClick{0%,35%{background:#fff;border-color:var(--border-subtle)}40%,55%{background:#eef4ff;border-color:#bfdbfe;box-shadow:0 0 0 2px rgba(37,99,235,.15)}60%,100%{background:#fff;border-color:var(--border-subtle)}}
@keyframes gmStatusTo{0%,42%{opacity:0;transform:translateX(-4px)}48%,90%{opacity:1;transform:none}100%{opacity:1}}
@keyframes gmBtnPress{0%,38%{transform:scale(1);filter:brightness(1)}42%{transform:scale(.96);filter:brightness(.92)}48%,100%{transform:scale(1);filter:brightness(1)}}
@keyframes gmOutputLine{0%,48%{width:0}70%,100%{width:100%}}
@keyframes gmOutputShort{0%,58%{width:0}78%,100%{width:55%}}
@keyframes gmBadgeIn{0%,72%{opacity:0;transform:translateY(4px)}80%,100%{opacity:1;transform:none}}
@keyframes gmStepGlow{0%,100%{border-color:var(--border-subtle);background:#fff}15%,30%{border-color:#bfdbfe;background:#eef4ff}}
@keyframes gmFileDrop{0%,30%{opacity:0;transform:translateY(-10px)}45%,92%{opacity:1;transform:none}100%{opacity:1}}
@keyframes gmProfileSwap{0%,45%{opacity:1}50%,100%{opacity:0;height:0;margin:0;padding:0;overflow:hidden}}
@keyframes gmProfileShow{0%,48%{opacity:0;transform:translateY(4px)}55%,100%{opacity:1;transform:none}}
@keyframes gmLineGrow{0%,50%{width:0}70%,100%{width:100%}}
@keyframes gmLineGrowShort{0%,55%{width:0}75%,100%{width:55%}}
@keyframes gmKaiPanel{0%,22%{opacity:0;transform:translateY(8px) scale(.96)}28%,92%{opacity:1;transform:none}100%{opacity:1}}
@keyframes gmFabPulse{0%,18%{transform:scale(1)}22%{transform:scale(.9)}26%,100%{transform:scale(1)}}
@keyframes gmBubble1{0%,26%{opacity:0;transform:translateY(5px)}30%,52%{opacity:1;transform:none}56%,100%{opacity:0;transform:translateY(5px)}}
@keyframes gmBubble2{0%,44%{opacity:0;transform:translateY(5px)}48%,68%{opacity:1;transform:none}72%,100%{opacity:0;transform:translateY(5px)}}
@keyframes gmBubble3{0%,66%{opacity:0;transform:translateY(5px)}70%,90%{opacity:1;transform:none}94%,100%{opacity:0;transform:translateY(5px)}}
@keyframes gmPrepShow{0%,42%{opacity:0;transform:translateY(4px)}48%,88%{opacity:1;transform:none}95%,100%{opacity:0}}
@keyframes gmNavSwitch{0%,35%{background:#fff;color:var(--text-muted);border-color:var(--border-subtle)}40%,75%{background:var(--accent-soft);color:var(--accent);border-color:#bfdbfe}80%,100%{background:#fff;color:var(--text-muted)}}
@keyframes gmUsageFill{0%,42%{width:0}65%,100%{width:45%}}

/* Dashboard */
.gm-scene-dashboard .gm-action-hint{animation:gmHint 5s ease infinite}
.gm-scene-dashboard .gm-action-hint::before{content:'Stats update live'}
.gm-scene-dashboard .gm-quote{animation:gmPopIn 5s ease infinite}
.gm-scene-dashboard .gm-type-text{animation:gmTypeWidth 5s steps(36,end) infinite}
.gm-scene-dashboard .gm-stat.gm-pop{animation:gmPopIn 5s ease infinite}
.gm-scene-dashboard .gm-stat.gm-pop:nth-child(1){animation-delay:0s}
.gm-scene-dashboard .gm-stat.gm-pop:nth-child(2){animation-delay:.08s}
.gm-scene-dashboard .gm-stat.gm-pop:nth-child(3){animation-delay:.16s}
.gm-scene-dashboard .gm-stat.gm-pop:nth-child(4){animation-delay:.24s}
.gm-scene-dashboard .gm-chart-bar:nth-child(1){--h:55%;animation:gmBarGrow 5s ease infinite}
.gm-scene-dashboard .gm-chart-bar:nth-child(2){--h:80%;animation:gmBarGrow 5s ease infinite .1s}
.gm-scene-dashboard .gm-chart-bar:nth-child(3){--h:40%;animation:gmBarGrow 5s ease infinite .2s}
.gm-scene-dashboard .gm-chart-bar:nth-child(4){--h:65%;animation:gmBarGrow 5s ease infinite .3s}

/* Jobs — drag card */
.gm-scene-jobs .gm-action-hint{animation:gmHint 5s ease infinite}
.gm-scene-jobs .gm-action-hint::before{content:'Drag to Applied'}
.gm-scene-jobs .gm-drag-card{position:relative;z-index:5;animation:gmDragJobs 5s ease-in-out infinite}
.gm-scene-jobs .gm-drop-target{position:relative}
.gm-scene-jobs .gm-pointer{animation:gmPtrMove 5s ease infinite,gmPtrClick 5s ease infinite;left:18%;top:42%}
.gm-scene-jobs .gm-pointer::after{animation:gmRipple 5s ease infinite}

/* To-do — drag task */
.gm-scene-todo .gm-action-hint{animation:gmHint 5s ease infinite}
.gm-scene-todo .gm-action-hint::before{content:'Drag to In progress'}
.gm-scene-todo .gm-drag-card{animation:gmDragTodo 5s ease-in-out infinite;z-index:5;position:relative}
.gm-scene-todo .gm-card-slot{animation:gmSlotFill 5s ease infinite}
.gm-scene-todo .gm-card-slot::after{content:'Follow up';font-size:7px;font-weight:600;color:#1d4ed8;display:block;padding:2px 0}
.gm-scene-todo .gm-pointer{animation:gmPtrMove 5s ease infinite,gmPtrClick 5s ease infinite;left:14%;top:38%}

/* Contacts — click & status */
.gm-scene-contacts .gm-action-hint{animation:gmHint 5s ease infinite}
.gm-scene-contacts .gm-action-hint::before{content:'Click to update status'}
.gm-scene-contacts .gm-click-row{animation:gmRowClick 5s ease infinite;border:1px solid var(--border-subtle);border-radius:6px}
.gm-scene-contacts .gm-line-fill{animation:gmOutputLine 5s ease infinite}
.gm-scene-contacts .gm-status.to{animation:gmStatusTo 5s ease infinite}
.gm-scene-contacts .gm-pointer{animation:gmPtrMove 5s ease infinite,gmPtrClick 5s ease infinite;left:22%;top:18%}

/* AI CV — click generate + output */
.gm-scene-aicv .gm-action-hint{animation:gmHint 5s ease infinite}
.gm-scene-aicv .gm-action-hint::before{content:'Click Generate'}
.gm-scene-aicv .gm-click-btn{animation:gmBtnPress 5s ease infinite;cursor:default}
.gm-scene-aicv .gm-output-line{animation:gmOutputLine 5s ease infinite}
.gm-scene-aicv .gm-output-line.short{animation:gmOutputShort 5s ease infinite}
.gm-scene-aicv .gm-output-badge{animation:gmBadgeIn 5s ease infinite}
.gm-scene-aicv .gm-pointer{animation:gmPtrMove 5s ease infinite,gmPtrClick 5s ease infinite;left:50%;top:48%;margin-left:-5px}

/* Prep — steps + generate */
.gm-scene-prep .gm-action-hint{animation:gmHint 5s ease infinite}
.gm-scene-prep .gm-action-hint::before{content:'Pick job → Generate'}
.gm-scene-prep .gm-step-pick:nth-child(1){animation:gmStepGlow 5s ease infinite}
.gm-scene-prep .gm-step-pick:nth-child(2){animation:gmStepGlow 5s ease infinite .4s}
.gm-scene-prep .gm-step-gen{animation:gmStepGlow 5s ease infinite .8s,gmBtnPress 5s ease infinite .8s}
.gm-scene-prep .gm-type-text{animation:gmTypeWidth 5s steps(28,end) infinite}
.gm-scene-prep .gm-prep-out{animation:gmPrepShow 5s ease infinite}
.gm-scene-prep .gm-pointer{animation:gmPtrMove 5s ease infinite,gmPtrClick 5s ease infinite;left:55%;top:62%}

/* Files — upload drop */
.gm-scene-files .gm-action-hint{animation:gmHint 5s ease infinite}
.gm-scene-files .gm-action-hint::before{content:'Upload documents'}
.gm-scene-files .gm-dropzone{animation:gmRowClick 5s ease infinite}
.gm-scene-files .gm-file-in{animation:gmFileDrop 5s ease infinite}
.gm-scene-files .gm-file-in.delay{animation-delay:.35s}
.gm-scene-files .gm-pointer{animation:gmPtrMove 5s ease infinite,gmPtrClick 5s ease infinite;left:50%;top:22%;margin-left:-5px}

/* Profile — typing experience */
.gm-scene-profile .gm-action-hint{animation:gmHint 5s ease infinite}
.gm-scene-profile .gm-action-hint::before{content:'Type your experience'}
.gm-scene-profile .gm-type-field{animation:gmProfileSwap 5s ease infinite}
.gm-scene-profile .gm-type-field .gm-type-text{animation:gmTypeWidth 5s steps(26,end) infinite}
.gm-scene-profile .gm-caret{animation:gmCaretBlink .8s step-end infinite}
.gm-scene-profile .gm-profile-fill{opacity:0;animation:gmProfileShow 5s ease infinite 2.5s}
.gm-scene-profile .gm-line-grow{animation:gmLineGrow 5s ease infinite 2.6s}
.gm-scene-profile .gm-line-grow.d2{animation:gmLineGrow 5s ease infinite 2.75s}
.gm-scene-profile .gm-line-grow.d3{animation:gmLineGrowShort 5s ease infinite 2.9s}
.gm-scene-profile .gm-date{animation:gmBadgeIn 5s ease infinite 3.1s}
.gm-scene-profile .gm-pointer{animation:gmPtrMove 5s ease infinite;left:12%;top:12%}

/* Kai — open FAB + chat */
.gm-scene-kai .gm-action-hint{animation:gmHint 5s ease infinite}
.gm-scene-kai .gm-action-hint::before{content:'Tap Kai · ask anything'}
.gm-scene-kai .gm-kai-panel{opacity:0;animation:gmKaiPanel 5s ease infinite}
.gm-scene-kai .gm-kai-fab{animation:gmFabPulse 5s ease infinite}
.gm-scene-kai .gm-bubble-in:nth-child(1){animation:gmBubble1 5s ease infinite}
.gm-scene-kai .gm-bubble-in:nth-child(2){animation:gmBubble2 5s ease infinite}
.gm-scene-kai .gm-bubble-in.gm-reply{animation:gmBubble3 5s ease infinite}
.gm-scene-kai .gm-bubble.user .gm-type-text{animation:gmTypeWidth 5s steps(22,end) infinite}
.gm-scene-kai .gm-pointer{animation:gmPtrMove 5s ease infinite,gmPtrClick 5s ease infinite;right:8%;bottom:6%;left:auto;top:auto}

/* Settings — nav click + usage bar */
.gm-scene-settings .gm-action-hint{animation:gmHint 5s ease infinite}
.gm-scene-settings .gm-action-hint::before{content:'Check AI usage'}
.gm-scene-settings .gm-nav-click{animation:gmNavSwitch 5s ease infinite}
.gm-scene-settings .gm-usage-animate{animation:gmUsageFill 5s ease infinite;width:0}
.gm-scene-settings .gm-pointer{animation:gmPtrMove 5s ease infinite,gmPtrClick 5s ease infinite;left:18%;top:14%}

.guide-mock.is-compact *{animation:none!important;transition:none!important}

@media (prefers-reduced-motion:reduce){
  .guide-mock.is-animated *,.guide-mock.is-animated .gm-pointer,.guide-mock.is-animated .gm-action-hint{
    animation:none!important;transition:none!important;
  }
  .guide-mock.is-animated .gm-type-text{max-width:100%}
  .guide-mock.is-animated .gm-drag-card{transform:none;opacity:1}
  .guide-mock.is-animated .gm-kai-panel{opacity:1;transform:none}
  .guide-mock.is-animated .gm-bubble-in{opacity:1;transform:none}
  .guide-mock.is-animated .gm-usage-animate{width:45%}
}

.help-tour-card{
  background:linear-gradient(160deg,#eef4ff 0%,#fff 55%);border:1px solid #bfdbfe;
  border-radius:14px;padding:20px 22px;margin-bottom:18px;
}
.help-tour-card h3{font-size:16px;font-weight:800;letter-spacing:-.02em;margin-bottom:6px;color:var(--text-primary)}
.help-tour-card p{font-size:12px;color:var(--text-secondary);line-height:1.55;margin-bottom:14px;max-width:520px}
.help-tour-btn{
  display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border:none;border-radius:10px;
  background:var(--accent);color:#fff;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer;text-decoration:none;
}
.help-tour-btn:hover{background:var(--accent-hover)}
.help-preview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin-bottom:20px}
.help-preview-card{
  display:block;text-decoration:none;color:inherit;background:var(--bg-page);border:1px solid var(--border-subtle);
  border-radius:10px;padding:10px;transition:border-color .15s,box-shadow .15s;
}
.help-preview-card:hover{border-color:var(--accent);box-shadow:var(--sh)}
.help-preview-thumb{height:56px;margin-bottom:8px;border-radius:6px;overflow:hidden;border:1px solid var(--border-subtle);background:#fff}
.help-preview-card h4{font-size:11px;font-weight:800;color:var(--text-primary);margin-bottom:2px}
.help-preview-card p{font-size:10px;color:var(--text-muted);line-height:1.35;margin:0}
.help-preview-card .pro-tag{font-size:8px;font-weight:800;color:#1d4ed8;background:#dbeafe;padding:2px 5px;border-radius:4px;margin-left:4px;vertical-align:middle}
.faq-list{display:flex;flex-direction:column;gap:8px}
.faq-item{border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-page);overflow:hidden}
.faq-item summary{
  padding:12px 14px;font-size:12px;font-weight:700;color:var(--text-primary);cursor:pointer;list-style:none;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';font-size:14px;font-weight:800;color:var(--text-muted);flex-shrink:0}
.faq-item[open] summary::after{content:'−';color:var(--accent)}
.faq-item[open] summary{border-bottom:1px solid var(--border-subtle);background:#fff}
.faq-a{padding:12px 14px;font-size:12px;color:var(--text-secondary);line-height:1.6;background:#fff}
.faq-a a{color:var(--accent);font-weight:700;text-decoration:none}
.faq-a a:hover{text-decoration:underline}
.guide-tour-banner{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;
  background:linear-gradient(160deg,#eef4ff 0%,#f8fafc 100%);border:1px solid #bfdbfe;
  border-radius:var(--rl);padding:14px 18px;margin-bottom:20px;animation:dashIn .45s ease both;
}
.guide-tour-banner p{margin:0;font-size:12px;color:var(--text-secondary);line-height:1.45;flex:1;min-width:200px}
.guide-tour-banner strong{color:var(--text-primary)}
.guide-tour-banner-actions{display:flex;gap:8px;flex-wrap:wrap}
.guide-tour-banner-btn{
  padding:8px 14px;border-radius:8px;font-family:inherit;font-size:11px;font-weight:700;cursor:pointer;border:none;
}
.guide-tour-banner-btn.primary{background:var(--accent);color:#fff}
.guide-tour-banner-btn.primary:hover{background:var(--accent-hover)}
.guide-tour-banner-btn.ghost{background:#fff;border:1px solid var(--border-subtle);color:var(--text-muted)}
@media(max-width:768px){
  .guide-step-layout,.guide-step-layout--immersive{grid-template-columns:1fr}
  .guide-mock-frame{max-width:320px;margin:0 auto}
  .guide-mock-stage{min-height:200px;padding:10px}
  .guide-immersive-shell{border-radius:16px 16px 0 0;max-height:100dvh;align-self:flex-end}
  .guide-immersive-stage{align-items:flex-end;padding:0}
  .guide-immersive-footer{flex-direction:column;align-items:stretch}
  .guide-immersive-footer-right{width:100%;justify-content:stretch}
  .guide-immersive-footer-right .guide-nav-btn{flex:1;text-align:center}
  .help-preview-grid{grid-template-columns:repeat(2,1fr)}
}

/* Password show/hide toggle */
.pwd-field{position:relative;display:block;width:100%}
.pwd-field .finp,.pwd-field .login-input,.pwd-field .reset-input{
  margin-bottom:0;padding-right:44px;width:100%;box-sizing:border-box;
}
.pwd-field:has(.login-input),.pwd-field:has(.reset-input){margin-bottom:12px}
.pwd-toggle{
  position:absolute;right:8px;top:0;bottom:0;height:26px;width:26px;margin:auto 0;
  border:none;background:transparent;padding:0;cursor:pointer;color:#6b7280;
  display:flex;align-items:center;justify-content:center;border-radius:6px;
}
.pwd-toggle:hover{color:#2563eb;background:rgba(37,99,235,.06)}
.pwd-toggle svg{width:18px;height:18px;display:block;pointer-events:none}

/* Mobile → desktop gate (app pages only) */
html.mobile-gate-on,
html.mobile-gate-on body{overflow:hidden;height:100%;touch-action:none}
body.mobile-gate-active .page{
  filter:blur(10px);
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
}
.mobile-desktop-gate{
  position:fixed;inset:0;z-index:999999;
  display:flex;align-items:center;justify-content:center;
  padding:24px;box-sizing:border-box;
  background:rgba(10,22,40,.42);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.mobile-desktop-gate-card{
  width:min(100%,380px);background:#fff;border-radius:18px;
  padding:32px 26px;text-align:center;
  box-shadow:0 24px 64px rgba(10,22,40,.22);
  border:1px solid rgba(255,255,255,.8);
}
.mobile-desktop-gate-icon{font-size:44px;line-height:1;margin-bottom:14px}
.mobile-desktop-gate-card h2{
  font-size:18px;font-weight:900;color:var(--b900,#0a1628);
  margin:0 0 10px;letter-spacing:-.02em;line-height:1.25;
}
.mobile-desktop-gate-card p{
  font-size:13px;color:var(--tm,#64748b);line-height:1.6;
  margin:0 0 6px;font-weight:500;
}
.mobile-desktop-gate-note{
  font-size:12px;color:var(--b600,#2563eb);font-weight:700;margin-top:14px;
}
.mobile-desktop-gate-btn{
  margin-top:18px;width:100%;padding:12px 16px;border:none;border-radius:10px;
  background:var(--accent,#2563eb);color:#fff;font-family:inherit;font-size:13px;
  font-weight:700;cursor:pointer;transition:background .15s;
}
.mobile-desktop-gate-btn:hover{background:var(--accent-hover,#1d4ed8)}

@media(max-width:640px){
  .mobile-desktop-gate{padding:16px}
  .mobile-desktop-gate-card{padding:24px 20px;border-radius:16px}
  .mobile-desktop-gate-icon{font-size:36px;margin-bottom:10px}
  .mobile-desktop-gate-card h2{font-size:16px}
  .mobile-desktop-gate-card p{font-size:12px;line-height:1.5}
  .mobile-desktop-gate-note{font-size:11px;margin-top:10px}
  .mobile-desktop-gate-btn{margin-top:14px;padding:10px 14px;font-size:12px;border-radius:8px}
}

/* Profile import (one-time) */
.profile-import-banner{
  margin-top:10px;padding:12px 14px;border-radius:10px;
  background:linear-gradient(135deg,#eff6ff,#fff);border:1px solid #bfdbfe;
}
.profile-import-banner-title{font-size:11px;font-weight:800;color:#1d4ed8;margin-bottom:4px}
.profile-import-banner p{font-size:11px;color:var(--text-secondary);line-height:1.5;margin:0 0 10px;font-weight:500}
.profile-import-banner-btn{
  padding:8px 14px;border:none;border-radius:8px;background:#2563eb;color:#fff;
  font-family:inherit;font-size:11px;font-weight:700;cursor:pointer;
}
.profile-import-banner-btn:hover{background:#1d4ed8}
.profile-import-overlay{
  position:fixed;inset:0;background:rgba(10,22,40,.55);backdrop-filter:blur(4px);
  z-index:650;display:none;align-items:flex-start;justify-content:center;padding:20px;overflow-y:auto;
}
.profile-import-overlay.open{display:flex}
.profile-import-card{
  width:100%;max-width:520px;background:#fff;border-radius:16px;padding:22px;
  box-shadow:0 24px 64px rgba(15,23,42,.2);margin:auto;position:relative;
}
.profile-import-close{
  position:absolute;top:14px;right:14px;width:32px;height:32px;border:none;
  background:#f1f5f9;border-radius:50%;cursor:pointer;font-size:18px;color:#64748b;
}
.profile-import-card h3{font-size:16px;font-weight:800;margin:0 0 6px}
.profile-import-sub{font-size:12px;color:var(--text-muted);line-height:1.5;margin-bottom:14px}
.profile-import-lbl{display:block;font-size:10px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.profile-import-paste{
  width:100%;min-height:120px;padding:10px 12px;border:1px solid var(--border-subtle);
  border-radius:10px;font-family:inherit;font-size:12px;box-sizing:border-box;resize:vertical;
}
.profile-import-err{font-size:12px;color:#dc2626;min-height:18px;margin:8px 0}
.profile-import-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.profile-import-btn{
  padding:10px 16px;border-radius:8px;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer;border:none;
}
.profile-import-btn.primary{background:#2563eb;color:#fff}
.profile-import-btn.ghost{background:#fff;border:1px solid var(--border-subtle);color:var(--text-primary)}
.profile-import-btn:disabled{opacity:.6;cursor:not-allowed}