/* Target paths */
.target-stack {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  padding: 0 var(--sp-5) var(--sp-6);
  max-width: 560px;
  margin: 0 auto;
}
.target-card {
  width: 100%;
  min-height: 92px;
  display: grid;
  grid-template-columns: 48px 1fr auto;
  align-items: center;
  gap: var(--sp-4);
  padding: var(--sp-4);
  background: var(--section-bg);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  color: var(--text);
  text-align: left;
  transition: transform .15s var(--ease), border-color .15s var(--ease), background .15s var(--ease);
}
.target-card:active { transform: scale(.98); }
.target-primary { border-color: rgba(37,99,235,.35); background: linear-gradient(180deg, rgba(37,99,235,.09), var(--section-bg)); }
.target-locked { border-style: dashed; }
.target-icon {
  width: 48px;
  height: 48px;
  border-radius: var(--r-md);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: var(--fs-lg);
  font-weight: var(--fw-bold);
}
.target-sage { background: var(--sage-soft); color: var(--sage); }
.target-amber { background: var(--amber-soft); color: var(--amber); }
.target-copy { min-width: 0; display: flex; flex-direction: column; gap: var(--sp-1); }
.target-copy strong { font-size: var(--fs-md); line-height: var(--lh-tight); }
.target-copy span { font-size: var(--fs-sm); color: var(--hint); line-height: var(--lh-normal); }
.target-arrow { color: var(--hint); font-size: 22px; }
.target-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  padding: var(--sp-2) var(--sp-3);
  border-radius: var(--r-full);
  background: var(--bg2);
  color: var(--hint);
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  white-space: nowrap;
}
.target-status.approved { background: var(--sage-soft); color: var(--sage); }
.target-status.pending { background: var(--amber-soft); color: var(--amber); }

/* Career tab */
.career-page {
  padding-top: calc(var(--sp-5) + env(safe-area-inset-top, 0px));
}
.career-entry-card {
  width: 100%;
  min-height: 116px;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--sp-4);
  padding: var(--sp-4);
  border: 1px dashed rgba(74, 96, 120, .32);
  border-radius: var(--r-lg);
  background: #111D2A;
  color: #FFFFFF;
  text-align: left;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
  transition: transform .15s var(--ease), border-color .15s var(--ease), background .15s var(--ease);
}
.career-entry-card:active {
  transform: scale(.98);
  background: #142235;
}
.career-entry-icon {
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #FFF9E8;
  color: #D97706;
  font-size: var(--fs-lg);
  font-weight: var(--fw-bold);
}
.career-entry-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.career-entry-copy strong {
  font-size: var(--fs-md);
  line-height: var(--lh-tight);
  color: #FFFFFF;
}
.career-entry-copy span {
  color: #8EA3BC;
  font-size: var(--fs-sm);
  line-height: var(--lh-normal);
}
.career-entry-status {
  min-width: 74px;
  background: #22344B;
  color: #9FB4CE;
}
.career-entry-status.approved { background: rgba(16, 185, 129, .16); color: #8DEBC8; }
.career-entry-status.pending { background: rgba(245, 158, 11, .18); color: #F7C873; }
@media (max-width: 380px) {
  .career-entry-card {
    grid-template-columns: 48px minmax(0, 1fr);
  }
  .career-entry-status {
    grid-column: 2;
    justify-self: start;
  }
}

/* Guided path pages */
.path-page {
  padding: var(--sp-5);
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  max-width: 720px;
  margin: 0 auto;
}
.path-hero {
  padding: var(--sp-5);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  background: var(--section-bg);
}
.path-kicker {
  font-size: var(--fs-xs);
  font-weight: var(--fw-bold);
  color: var(--link);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: var(--sp-2);
}
.path-hero h2 { font-size: var(--fs-xl); line-height: var(--lh-tight); margin-bottom: var(--sp-3); }
.path-hero p { color: var(--hint); font-size: var(--fs-sm); line-height: var(--lh-relaxed); }
.path-section {
  background: var(--section-bg);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--sp-5);
}
.path-section h3 { font-size: var(--fs-base); margin-bottom: var(--sp-3); }
.path-list { display: flex; flex-direction: column; gap: var(--sp-3); }
.path-item {
  display: grid;
  grid-template-columns: 32px 1fr auto;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3);
  border-radius: var(--r-md);
  background: var(--bg2);
  color: var(--text);
}
.path-item-icon {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--r-sm);
  background: var(--section-bg);
  font-size: var(--fs-sm);
}
.path-item-title { display: block; font-size: var(--fs-sm); font-weight: var(--fw-semibold); line-height: var(--lh-tight); }
.path-item-desc { display: block; font-size: var(--fs-xs); color: var(--hint); margin-top: 2px; line-height: var(--lh-normal); }
.path-item-arrow { color: var(--hint); font-size: 18px; }
.resource-pair {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-3);
  padding: var(--sp-3);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  background: var(--bg2);
}
.resource-cta {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3);
  border-radius: var(--r-md);
  background: var(--section-bg);
  color: var(--text);
}
.path-actions { display: grid; grid-template-columns: 1fr; gap: var(--sp-2); }
.video-list { display: flex; flex-direction: column; gap: var(--sp-4); }
.video-card {
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  background: var(--section-bg);
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.video-card.is-seen {
  border-color: var(--sage);
  box-shadow: 0 0 0 2px var(--sage-soft);
  background: linear-gradient(180deg, var(--section-bg) 0%, var(--sage-soft) 100%);
}
.video-frame {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  display: block;
  background: var(--bg2);
}
.video-meta { padding: var(--sp-4); }
.video-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--sp-3);
  margin-bottom: var(--sp-1);
}
.video-meta strong { display: block; font-size: var(--fs-sm); }
.video-meta span { display: block; font-size: var(--fs-xs); color: var(--hint); line-height: var(--lh-relaxed); }
.video-seen-indicator {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--r-full);
  background: var(--sage);
  color: white;
  font-size: 13px;
  font-weight: var(--fw-bold);
  line-height: 1;
  opacity: 0;
  transform: scale(.86);
  transition: opacity .18s ease, transform .18s ease;
}
.video-card.is-seen .video-seen-indicator {
  opacity: 1;
  transform: scale(1);
}
@media (min-width: 640px) {
  .resource-pair { grid-template-columns: 1fr 1fr; }
}
.business-form { display: flex; flex-direction: column; gap: var(--sp-3); margin-top: var(--sp-4); }
.form-field {
  width: 100%;
  padding: var(--sp-3) var(--sp-4);
  border: 1.5px solid var(--border);
  border-radius: var(--r-sm);
  background: var(--bg);
  color: var(--text);
  outline: none;
  line-height: var(--lh-normal);
}
.form-field:focus { border-color: var(--link); }
.status-panel {
  padding: var(--sp-4);
  border-radius: var(--r-md);
  background: var(--bg2);
  color: var(--hint);
  font-size: var(--fs-sm);
  line-height: var(--lh-relaxed);
}
.status-panel.approved { background: var(--sage-soft); color: var(--sage); }
.status-panel.pending { background: var(--amber-soft); color: var(--amber); }
.compact-empty {
  min-height: 260px;
  border: 1px dashed var(--border);
  border-radius: var(--r-lg);
  background: var(--section-bg);
}

.documents-list {
  padding: var(--sp-5) var(--sp-5) calc(148px + env(safe-area-inset-bottom, 0px));
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}
.document-card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-4);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  background: var(--section-bg);
  color: var(--text);
  text-decoration: none;
}
.document-icon {
  width: 46px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: var(--sage-soft);
  color: var(--sage);
}
.document-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.document-copy strong {
  font-size: var(--fs-sm);
  line-height: var(--lh-tight);
}
.document-copy small {
  color: var(--hint);
  font-size: var(--fs-xs);
  line-height: var(--lh-normal);
}
.document-open {
  color: var(--link);
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
}