/* Recruiter Suite — 30s tour, JD fit, career graph */
:root {
  --rs-ink: #111827;
  --rs-muted: #687386;
  --rs-line: rgba(30, 64, 175, .13);
  --rs-blue: #3d7cff;
  --rs-cyan: #74d9ff;
  --rs-violet: #8d8cff;
  --rs-panel: rgba(255,255,255,.94);
  --rs-shadow: 0 28px 90px rgba(32, 54, 105, .20);
}

.rs-entry {
  width: min(930px, calc(100vw - 40px));
  margin: 12px auto 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  position: relative;
  z-index: 12;
}

.rs-entry button,
.rs-floating-toggle,
.rs-floating-menu button,
.rs-button {
  border: 1px solid rgba(58, 91, 163, .15);
  background: rgba(255,255,255,.78);
  color: #33415d;
  font: 600 11px/1.1 Inter, "Noto Sans KR", sans-serif;
  letter-spacing: -.01em;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.rs-entry button {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  backdrop-filter: blur(12px);
}

.rs-entry .rs-primary {
  min-height: 38px;
  padding-inline: 16px;
  color: #fff;
  border-color: transparent;
  background: linear-gradient(120deg, #202b47, #3c72ee 68%, #6bcffc);
  box-shadow: 0 10px 25px rgba(53, 95, 198, .20);
}

.rs-entry button:hover,
.rs-floating-menu button:hover,
.rs-button:hover {
  transform: translateY(-1px);
  border-color: rgba(61, 124, 255, .38);
  box-shadow: 0 8px 22px rgba(48, 77, 140, .11);
}

.rs-floating {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 80;
  display: grid;
  justify-items: end;
  gap: 8px;
}

.rs-floating-toggle {
  min-height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(19, 26, 43, .92);
  color: #fff;
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 14px 34px rgba(18, 27, 48, .22);
  backdrop-filter: blur(14px);
}

.rs-floating-toggle::before { content: "✦"; margin-right: 7px; color: #8ee9ff; }
.rs-floating-menu {
  width: 184px;
  padding: 7px;
  border: 1px solid rgba(41, 67, 120, .13);
  border-radius: 16px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 18px 50px rgba(34, 54, 98, .17);
  backdrop-filter: blur(18px);
  opacity: 0;
  transform: translateY(7px) scale(.98);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}
.rs-floating.is-open .rs-floating-menu { opacity: 1; transform: none; pointer-events: auto; }
.rs-floating-menu button {
  width: 100%;
  min-height: 38px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 0;
  border-radius: 10px;
  background: transparent;
  text-align: left;
}
.rs-floating-menu button span { color: #8a94a6; font: 500 9px/1 var(--mono, "DM Mono", monospace); }

.rs-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: center;
  padding: 24px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease;
}
.rs-modal.is-open { opacity: 1; pointer-events: auto; }
.rs-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(12, 18, 32, .36);
  backdrop-filter: blur(13px) saturate(.92);
}
.rs-dialog {
  position: relative;
  width: min(1040px, 96vw);
  max-height: min(820px, 90dvh);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0,1fr);
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 26px;
  background:
    radial-gradient(circle at 80% 8%, rgba(114, 214, 255, .11), transparent 28%),
    radial-gradient(circle at 15% 100%, rgba(111, 130, 255, .09), transparent 31%),
    var(--rs-panel);
  box-shadow: var(--rs-shadow);
  transform: translateY(12px) scale(.985);
  transition: transform .22s cubic-bezier(.2,.8,.2,1);
}
.rs-modal.is-open .rs-dialog { transform: none; }
.rs-dialog-head {
  min-height: 62px;
  padding: 14px 18px 14px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid rgba(40, 66, 118, .09);
}
.rs-dialog-title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.rs-dialog-title i {
  width: 30px; height: 30px; border-radius: 10px;
  display: grid; place-items: center;
  background: linear-gradient(145deg, #eaf3ff, #f6fbff);
  color: #3b75eb; font-style: normal;
  border: 1px solid rgba(61,124,255,.13);
}
.rs-dialog-title strong { display:block; font-size: 14px; color: #182033; }
.rs-dialog-title small { display:block; margin-top: 2px; color: #8791a3; font: 500 9px/1.2 var(--mono, "DM Mono", monospace); letter-spacing: .09em; }
.rs-close {
  width: 34px; height: 34px; border: 0; border-radius: 10px;
  background: rgba(30,42,67,.05); color: #5d687a; cursor: pointer; font-size: 18px;
}
.rs-content { overflow: auto; min-height: 0; padding: 24px; }

/* Recruiter tour */
.rs-tour { min-height: 520px; display: grid; grid-template-rows: auto 1fr auto; gap: 22px; }
.rs-tour-top { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.rs-tour-status { font: 600 10px/1 var(--mono, "DM Mono", monospace); color: #5d6d88; letter-spacing: .09em; }
.rs-tour-clock { font: 700 11px/1 var(--mono, "DM Mono", monospace); color: #2868e7; }
.rs-tour-progress { height: 5px; background: #e9edf4; border-radius: 99px; overflow: hidden; margin-top: 9px; }
.rs-tour-progress i { display:block; height:100%; width:0; border-radius: inherit; background: linear-gradient(90deg, #3f7cff, #71ddff, #8e88ff); transition: width .15s linear; }
.rs-tour-card {
  position: relative;
  min-height: 350px;
  padding: clamp(26px, 4vw, 48px);
  border: 1px solid rgba(47, 80, 151, .11);
  border-radius: 24px;
  overflow: hidden;
  background: rgba(255,255,255,.66);
}
.rs-tour-card::after {
  content:""; position:absolute; width:260px; height:260px; right:-90px; top:-105px; border-radius:50%;
  background: radial-gradient(circle, rgba(104, 198, 255, .18), transparent 67%); pointer-events:none;
}
.rs-kicker { color: #3974e7; font: 600 10px/1.3 var(--mono, "DM Mono", monospace); letter-spacing: .12em; }
.rs-tour-card h2,
.rs-section-title { margin: 12px 0 0; color: #121a2b; font-size: clamp(30px, 4vw, 54px); line-height: 1.04; letter-spacing: -.047em; }
.rs-tour-card h2 span { color: #8c95a5; }
.rs-tour-copy { max-width: 760px; margin: 18px 0 0; color: #5d687a; font-size: 15.5px; line-height: 1.75; }
.rs-tour-metrics { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 9px; margin-top: 24px; }
.rs-tour-metric { padding: 15px; border: 1px solid rgba(41,70,132,.10); border-radius: 14px; background: rgba(248,250,253,.78); }
.rs-tour-metric strong { display:block; color:#172033; font-size: 19px; letter-spacing:-.03em; }
.rs-tour-metric span { display:block; margin-top:5px; color:#7d8798; font: 500 8.5px/1.3 var(--mono, "DM Mono", monospace); letter-spacing:.08em; }
.rs-proof-row { display:flex; gap:7px; flex-wrap:wrap; margin-top:20px; }
.rs-proof-row button,
.rs-proof-row a,
.rs-action-row button {
  min-height: 36px; padding: 0 12px; border-radius: 999px; border: 1px solid rgba(57,95,170,.14); background:#fff; color:#43506a;
  font:600 10.5px/1 Inter, "Noto Sans KR", sans-serif; text-decoration:none; cursor:pointer;
}
.rs-tour-bottom { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.rs-tour-dots { display:flex; gap:6px; }
.rs-tour-dots i { width:7px; height:7px; border-radius:50%; background:#d7dce5; transition: width .2s ease, background .2s ease; }
.rs-tour-dots i.is-active { width:24px; border-radius:99px; background:#4b82f1; }
.rs-action-row { display:flex; gap:7px; }
.rs-action-row .primary { background:#17213a; color:#fff; border-color:#17213a; }
.rs-neon-line { display:flex; gap:10px; align-items:flex-start; margin-top:18px; padding:11px 13px; width:max-content; max-width:100%; border-radius:14px; background:#f2f7ff; color:#50607c; font-size:12px; line-height:1.5; }
.rs-neon-line b { color:#2b6ce7; white-space:nowrap; }

/* JD matcher */
.rs-grid-two { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr); gap:18px; }
.rs-panel { padding:20px; border:1px solid rgba(45,72,132,.10); border-radius:20px; background:rgba(255,255,255,.67); }
.rs-panel h3 { margin:0; color:#1c263b; font-size:17px; }
.rs-panel > p { margin:8px 0 0; color:#6c7788; font-size:12.5px; line-height:1.6; }
.rs-jd-textarea { width:100%; min-height:290px; margin-top:14px; padding:14px 15px; resize:vertical; border:1px solid #dce2ec; border-radius:14px; outline:none; background:#fbfcfe; color:#283248; font:500 13px/1.65 Inter, "Noto Sans KR", sans-serif; }
.rs-jd-textarea:focus { border-color:#75a3ff; box-shadow:0 0 0 3px rgba(69,126,245,.10); }
.rs-jd-controls { margin-top:10px; display:flex; gap:7px; flex-wrap:wrap; }
.rs-button { min-height:38px; padding:0 13px; border-radius:11px; }
.rs-button.primary { color:#fff; background:#17213a; border-color:#17213a; }
.rs-privacy { margin-top:9px; color:#8c95a4; font:500 9px/1.4 var(--mono, "DM Mono", monospace); }
.rs-score-head { display:flex; align-items:center; gap:15px; }
.rs-score-orb { width:78px; height:78px; border-radius:50%; display:grid; place-items:center; background:conic-gradient(#4c83f4 var(--score,0%), #e9edf4 0); position:relative; flex:0 0 auto; }
.rs-score-orb::after { content:""; position:absolute; inset:7px; border-radius:50%; background:#fff; }
.rs-score-orb strong { position:relative; z-index:1; color:#17213a; font-size:22px; }
.rs-score-label strong { display:block; color:#182135; font-size:17px; }
.rs-score-label span { display:block; margin-top:4px; color:#8791a1; font-size:10px; line-height:1.45; }
.rs-category-list { display:grid; gap:10px; margin-top:19px; }
.rs-category { display:grid; grid-template-columns:130px minmax(0,1fr) 38px; gap:9px; align-items:center; }
.rs-category b { color:#4c5870; font-size:10.5px; }
.rs-category-track { height:7px; border-radius:99px; overflow:hidden; background:#edf0f5; }
.rs-category-track i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#4c80ee,#71d9ff); }
.rs-category em { color:#5f6d83; font:600 10px/1 var(--mono, "DM Mono", monospace); font-style:normal; text-align:right; }
.rs-match-section { margin-top:18px; }
.rs-match-section > span { color:#8c95a6; font:600 9px/1 var(--mono, "DM Mono", monospace); letter-spacing:.10em; }
.rs-chip-list { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.rs-chip { padding:6px 8px; border-radius:8px; background:#edf5ff; color:#3068cf; font-size:10px; font-weight:600; }
.rs-chip.gap { background:#f4f0f1; color:#8b5a62; }
.rs-match-empty { margin-top:18px; padding:14px; border-radius:12px; background:#f7f8fa; color:#727e91; font-size:12px; line-height:1.6; }

/* Career graph */
.rs-career-intro { max-width:760px; margin:10px 0 0; color:#687487; font-size:14px; line-height:1.7; }
.rs-career-graph { position:relative; display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:12px; margin-top:32px; padding-top:14px; }
.rs-career-graph::before { content:""; position:absolute; left:8%; right:8%; top:42px; height:2px; background:linear-gradient(90deg,#dce4f3,#82b5ff,#90dff3,#9e9dfb); }
.rs-career-node { position:relative; z-index:1; min-height:138px; padding:14px 12px; border:1px solid rgba(44,74,139,.11); border-radius:16px; background:rgba(255,255,255,.88); text-align:left; cursor:pointer; transition:.2s ease; }
.rs-career-node::before { content:""; display:block; width:10px; height:10px; margin:0 0 15px 4px; border:4px solid #fff; border-radius:50%; background:#588bf2; box-shadow:0 0 0 1px rgba(63,111,208,.18), 0 0 0 7px rgba(81,137,243,.07); }
.rs-career-node span { display:block; color:#4777d5; font:600 8.5px/1.25 var(--mono,"DM Mono",monospace); letter-spacing:.06em; }
.rs-career-node strong { display:block; margin-top:7px; color:#1b263b; font-size:13px; line-height:1.3; }
.rs-career-node small { display:block; margin-top:6px; color:#7b8697; font-size:10.5px; line-height:1.45; }
.rs-career-node:hover,.rs-career-node.is-active { transform:translateY(-3px); border-color:rgba(67,121,234,.34); box-shadow:0 12px 32px rgba(44,79,151,.11); }
.rs-career-node.is-active::before { background:#63dbf7; }
.rs-career-detail { margin-top:18px; padding:22px; border:1px solid rgba(44,74,139,.10); border-radius:18px; background:linear-gradient(130deg,#f9fbff,#fff); }
.rs-career-detail .meta { color:#4e7ddd; font:600 9px/1.2 var(--mono,"DM Mono",monospace); letter-spacing:.1em; }
.rs-career-detail h3 { margin:8px 0 0; color:#182238; font-size:21px; letter-spacing:-.025em; }
.rs-career-detail p { margin:9px 0 0; max-width:800px; color:#647084; font-size:13.5px; line-height:1.7; }
.rs-career-tags { display:flex; gap:6px; flex-wrap:wrap; margin-top:12px; }
.rs-career-tags span { padding:6px 8px; border-radius:8px; background:#eef4ff; color:#4a70b8; font-size:9.5px; }
.rs-flow-dot { position:absolute; top:38px; left:8%; width:9px; height:9px; border-radius:50%; background:#bff7ff; box-shadow:0 0 15px #6fdcff; animation:rsFlow 5.2s linear infinite; z-index:0; }
@keyframes rsFlow { from{left:8%} to{left:91%} }

.rs-highlight { animation:rsHighlight 1.1s ease-in-out 2; }
@keyframes rsHighlight { 0%,100%{box-shadow:0 0 0 0 rgba(63,124,255,0)} 50%{box-shadow:0 0 0 8px rgba(63,124,255,.13)} }

@media (max-width: 820px) {
  .rs-grid-two { grid-template-columns:1fr; }
  .rs-tour-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rs-career-graph { grid-template-columns:1fr; padding-left:20px; }
  .rs-career-graph::before { left:25px; right:auto; top:25px; bottom:25px; width:2px; height:auto; background:linear-gradient(#dce4f3,#82b5ff,#90dff3,#9e9dfb); }
  .rs-career-node { min-height:0; padding-left:24px; }
  .rs-career-node::before { position:absolute; left:-21px; top:18px; margin:0; }
  .rs-flow-dot { display:none; }
}

@media (max-width: 700px) {
  .rs-entry { width:calc(100vw - 24px); gap:6px; margin-top:9px; }
  .rs-entry button { min-height:32px; padding-inline:10px; font-size:9.5px; }
  .rs-entry .rs-primary { width:100%; min-height:38px; }
  .rs-floating { right:10px; bottom:10px; }
  .rs-floating-toggle { min-height:38px; font-size:10px; }
  .rs-modal { padding:8px; }
  .rs-dialog { width:100%; max-height:94dvh; border-radius:20px; }
  .rs-dialog-head { min-height:56px; padding:11px 12px 11px 14px; }
  .rs-content { padding:14px; }
  .rs-tour { min-height:0; gap:14px; }
  .rs-tour-card { min-height:390px; padding:22px 18px; border-radius:18px; }
  .rs-tour-card h2,.rs-section-title { font-size:clamp(27px,9vw,40px); }
  .rs-tour-copy { font-size:14px; }
  .rs-tour-metrics { gap:7px; }
  .rs-tour-metric { padding:12px; }
  .rs-tour-bottom { align-items:flex-end; }
  .rs-action-row { flex-wrap:wrap; justify-content:flex-end; }
  .rs-panel { padding:15px; }
  .rs-jd-textarea { min-height:220px; }
  .rs-category { grid-template-columns:105px minmax(0,1fr) 34px; }
}

@media (prefers-reduced-motion: reduce) {
  .rs-dialog,.rs-modal,.rs-floating-menu,.rs-entry button,.rs-button,.rs-career-node { transition:none; }
  .rs-flow-dot,.rs-highlight { animation:none; }
}