:root{
  --navy:#0b2545;
  --navy-light:#13355e;
  --navy-pale:#eef2f7;
  --gold:#b88a2e;
  --gold-pale:#f7eed9;
  --ink:#1b2430;
  --ink-soft:#5b6573;
  --line:#dde3ea;
  --bg:#f5f6f8;
  --card:#ffffff;
  --good:#1e7a4c;
  --good-bg:#e8f5ed;
  --warn:#a3650a;
  --warn-bg:#fbf0dc;
  --bad:#a32d2d;
  --bad-bg:#fbeaea;
}
*{box-sizing:border-box;}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  background:var(--bg);
  color:var(--ink);
}
header{
  background:var(--navy);
  color:#fff;
  padding:22px 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
}
header .brand{display:flex; align-items:center; gap:14px;}
header .brand .mark{
  width:38px;height:38px;border-radius:8px;
  background:var(--gold);
  display:flex;align-items:center;justify-content:center;
  font-weight:700;color:var(--navy);font-size:15px;
}
header h1{font-size:18px; margin:0; font-weight:600; letter-spacing:0.2px;}
header p{margin:2px 0 0; font-size:12.5px; color:#c3cee0;}

.model-status{
  font-size:12px; border-radius:20px; padding:5px 14px;
  display:flex; align-items:center; gap:7px;
}
.model-status .dot{width:7px;height:7px;border-radius:50%; display:inline-block;}
.model-status.mode-semantic{color:#bdeccf; border:1px solid #1e7a4c;}
.model-status.mode-semantic .dot{background:#3fc97e;}
.model-status.mode-fallback{color:#f0d9a8; border:1px solid var(--gold);}
.model-status.mode-fallback .dot{background:var(--gold);}

.wrap{max-width:1180px; margin:0 auto; padding:28px 32px 80px;}

.setup-banner{
  background:var(--gold-pale); border:1px solid var(--gold); border-radius:8px;
  padding:13px 16px; font-size:12.5px; color:#5c4615; margin-bottom:20px; line-height:1.6;
}
.setup-banner code{
  background:#fff; border:1px solid var(--gold); border-radius:5px; padding:2px 7px;
  font-size:11.5px; display:inline-block; margin:4px 0;
}
.setup-detail{font-size:11px; color:#8a6a2a; margin-top:4px;}

.panel{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:10px;
  padding:24px 26px;
  margin-bottom:22px;
}
.panel h2{
  font-size:15px; margin:0 0 4px; color:var(--navy); font-weight:600;
  display:flex; align-items:center; gap:8px;
}
.panel h2 .num{
  width:22px;height:22px;border-radius:50%;background:var(--navy);color:#fff;
  font-size:12px;display:inline-flex;align-items:center;justify-content:center;
  font-weight:600;
}
.panel .sub{font-size:12.5px; color:var(--ink-soft); margin:0 0 18px;}

.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
label{font-size:13px; font-weight:600; color:var(--ink); display:block; margin-bottom:6px;}
.optional{color:var(--ink-soft); font-weight:400;}
.hint{font-size:11.5px; color:var(--ink-soft); margin-top:5px; line-height:1.4;}

select, textarea, input[type=text], input[type=number],
input[type=email], input[type=password]{
  width:100%; border:1px solid var(--line); border-radius:7px;
  padding:9px 11px; font-size:13.5px; font-family:inherit; color:var(--ink);
  background:#fff;
}
select:focus, textarea:focus, input:focus{outline:none; border-color:var(--navy-light); box-shadow:0 0 0 3px rgba(11,37,69,0.08);}
textarea{resize:vertical; min-height:90px; line-height:1.5;}

.field{margin-bottom:18px;}

.dropzone{
  border:1.5px dashed var(--line); border-radius:9px; padding:28px;
  text-align:center; background:#fafbfc; cursor:pointer; transition:border-color .15s, background .15s;
}
.dropzone:hover, .dropzone.drag{border-color:var(--gold); background:var(--gold-pale);}
.dropzone .icon{font-size:26px; color:var(--navy-light); margin-bottom:8px;}
.dropzone .title{font-size:13.5px; font-weight:600; color:var(--ink);}
.dropzone .sub2{font-size:12px; color:var(--ink-soft); margin-top:3px;}

.file-list{margin-top:14px; display:flex; flex-direction:column; gap:6px;}
.file-row{
  display:flex; align-items:center; justify-content:space-between;
  background:var(--navy-pale); border-radius:7px; padding:8px 12px; font-size:12.5px;
}
.file-row .name{display:flex; align-items:center; gap:8px; overflow:hidden;}
.file-count{font-size:12px; color:var(--ink-soft); margin-top:10px;}

.run-row{display:flex; align-items:center; justify-content:flex-end; gap:14px; margin-top:6px;}
.btn{
  border:none; border-radius:8px; padding:11px 22px; font-size:13.5px; font-weight:600;
  cursor:pointer; transition:opacity .15s, transform .1s; text-decoration:none;
  display:inline-block;
}
.btn:active{transform:scale(0.98);}
.btn-primary{background:var(--navy); color:#fff;}
.btn-primary:hover{background:var(--navy-light);}
.btn-primary:disabled{background:#9aa7b8; cursor:not-allowed;}
.btn-ghost{background:none; border:1px solid var(--line); color:var(--ink);}
.btn-ghost:hover{background:var(--navy-pale);}

.error-box{
  margin-top:14px; border:1px solid #f0c9c9; background:var(--bad-bg);
  color:var(--bad); border-radius:8px; padding:12px 14px; font-size:12.5px;
}

.results-header{display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:16px; flex-wrap:wrap; gap:12px;}
.results-header h2{font-size:16px; color:var(--navy); margin:0; font-weight:600;}
.results-header .sub{font-size:12.5px; color:var(--ink-soft); margin:3px 0 0;}
.export-btns{display:flex; gap:10px;}

.summary-cards{display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:20px;}
.scard{background:var(--navy-pale); border-radius:8px; padding:13px 16px;}
.scard .num{font-size:21px; font-weight:700; color:var(--navy);}
.scard .lab{font-size:11.5px; color:var(--ink-soft); margin-top:2px;}

table.results{width:100%; border-collapse:collapse; font-size:12.5px;}
table.results th{
  text-align:left; background:var(--navy); color:#fff; padding:10px 10px;
  font-weight:600; font-size:11.5px; letter-spacing:0.2px;
}
table.results td{padding:10px 10px; border-bottom:1px solid var(--line); vertical-align:top;}
table.results tbody tr.result-row:hover{background:#fafbfc;}

.score-badge{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:42px; padding:3px 8px; border-radius:6px; font-weight:700; font-size:12.5px;
}
.score-high{background:var(--good-bg); color:var(--good);}
.score-mid{background:var(--warn-bg); color:var(--warn);}
.score-low{background:var(--bad-bg); color:var(--bad);}

.flag-pill{
  display:inline-block; font-size:10.5px; font-weight:600; padding:2px 7px; border-radius:5px;
  background:var(--bad-bg); color:var(--bad); margin:1px 3px 1px 0;
}
.muted{color:var(--ink-soft); font-size:11.5px;}

.expand-btn{
  background:none; border:1px solid var(--line); border-radius:6px; padding:4px 9px;
  font-size:11px; cursor:pointer; color:var(--navy-light); font-weight:600;
}
.expand-btn:hover{background:var(--navy-pale);}

.detail-row td{background:#fbfcfd; padding:0;}
.detail-inner{padding:16px 22px; border-bottom:1px solid var(--line);}
.detail-grid{display:grid; grid-template-columns:1fr 1fr 1fr; gap:18px; margin-bottom:14px;}
.detail-block .dt{font-size:11px; font-weight:700; color:var(--navy); text-transform:uppercase; letter-spacing:0.4px; margin-bottom:6px;}
.detail-block .dd{font-size:12.5px; color:var(--ink); line-height:1.6;}
.breakdown{display:flex; flex-direction:column; gap:7px; margin-top:6px;}
.bd-row{display:flex; align-items:center; gap:10px; font-size:12px;}
.bd-label{width:120px; color:var(--ink-soft); flex-shrink:0;}
.bd-bar-track{flex:1; height:7px; background:var(--line); border-radius:4px; overflow:hidden;}
.bd-bar-fill{height:100%; background:var(--navy-light);}
.bd-score{width:65px; text-align:right; font-weight:600; flex-shrink:0;}

.skills-matched-list{margin-top:6px;}
.skill-evidence-row{
  display:flex; align-items:baseline; gap:10px; font-size:12px; padding:5px 0;
  border-bottom:1px solid var(--line); flex-wrap:wrap;
}
.skill-evidence-row:last-child{border-bottom:none;}
.skill-name{font-weight:600; min-width:140px; color:var(--ink);}
.skill-confidence{color:var(--good); font-size:11px; font-weight:600; min-width:90px;}
.skill-context{color:var(--ink-soft); font-style:italic; font-size:11.5px;}

.rationale-box{
  margin-top:12px; background:var(--gold-pale); border-radius:7px; padding:10px 14px;
  font-size:12px; color:#5c4615; line-height:1.55;
}
.rationale-box .rt-label{font-weight:700; font-size:10.5px; text-transform:uppercase; letter-spacing:0.4px; margin-bottom:4px; color:var(--gold);}

.footer-note{font-size:11px; color:var(--ink-soft); text-align:center; margin-top:6px;}

@media (max-width:860px){
  .grid-2{grid-template-columns:1fr;}
  .summary-cards{grid-template-columns:repeat(2,1fr);}
  .detail-grid{grid-template-columns:1fr;}
}

/* --- Job-description form & results additions --- */
.required-mark{color:var(--bad); font-weight:700;}
.kind-tag{
  display:inline-block; font-size:10px; text-transform:uppercase;
  letter-spacing:.04em; padding:1px 6px; border-radius:10px; margin-left:6px;
  vertical-align:middle;
}
.kind-required{background:var(--navy-pale); color:var(--navy);}
.kind-preferred{background:var(--gold-pale); color:var(--gold);}
.method-tag{
  display:inline-block; font-size:10px; padding:1px 6px; border-radius:10px;
  margin-left:4px; background:#eef1f4; color:var(--ink-soft);
  vertical-align:middle;
}
.certs-list{margin-top:6px;}
.cert-pill{
  display:inline-block; font-size:12px; padding:3px 9px; border-radius:12px;
  margin:3px 4px 0 0;
}
.cert-found{background:var(--good-bg); color:var(--good);}
.cert-missing{background:var(--bad-bg); color:var(--bad);}

/* --- Candidate attributes (from data sheet) --- */
.attrs-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:6px 18px; margin-top:6px;}
.attr{display:flex; flex-direction:column; padding:4px 0; border-bottom:1px dashed var(--line);}
.attr-k{font-size:10.5px; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft);}
.attr-v{font-size:13px; color:var(--ink);}

/* --- Header nav --- */
.header-right{display:flex; align-items:center; gap:16px; flex-wrap:wrap;}
.topnav{display:flex; align-items:center; gap:14px;}
.topnav a{color:#fff; text-decoration:none; font-size:13px; opacity:.9;}
.topnav a:hover{opacity:1; text-decoration:underline;}
.topnav .who{color:#c3cee0; font-size:12.5px;}
.btn-sm{padding:6px 12px; font-size:12px;}
.topnav .btn-ghost{border-color:rgba(255,255,255,.4); color:#fff;}
.topnav .btn-ghost:hover{background:rgba(255,255,255,.12);}

/* --- Auth pages --- */
.auth-wrap{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  padding:24px; background:var(--bg);
}
.auth-card{
  width:100%; max-width:400px; background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:30px 28px; box-shadow:0 6px 24px rgba(11,37,69,0.06);
}
.auth-brand{display:flex; align-items:center; gap:13px; margin-bottom:22px;}
.auth-brand .mark{
  width:40px;height:40px;border-radius:9px;background:var(--gold);
  display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--navy);
}
.auth-brand h1{font-size:17px; margin:0; color:var(--navy); font-weight:600;}
.auth-brand p{margin:2px 0 0; font-size:12.5px; color:var(--ink-soft);}

/* Brand logo image (replaces the old 'AJ' tile on auth pages + dashboard).
   The auth card is white, so the logo sits directly on it. The dashboard
   header is navy and the logo's "Global" wordmark is black, so there it gets
   a white backing pill to stay legible. */
.brand-logo{display:block; width:auto;}
.auth-brand .brand-logo{height:44px;}
header .brand .brand-logo{height:52px;}
.auth-submit{width:100%; margin-top:6px;}
.auth-alt{font-size:12.5px; color:var(--ink-soft); text-align:center; margin:14px 0 0;}
.auth-alt a{color:var(--navy); font-weight:600;}
.resend-form{text-align:center; margin-top:10px;}
.info-box{
  margin-top:14px; border:1px solid #bfe0cb; background:var(--good-bg);
  color:var(--good); border-radius:8px; padding:12px 14px; font-size:12.5px;
}