:root {
  --v2-blue: #2563eb;
  --v2-soft: #eff6ff;
  --v2-line: #dbe4f0;
  --v2-muted: #64748b;
}
.preview-hidden { display: none !important; }
.login-panel .inline-status { margin: 14px 0; }
.inline-status { padding: 11px 13px; border-radius: 13px; }
.status-pill { display: inline-flex; align-items: center; border-radius: 999px; padding: 6px 10px; font-size: 12px; font-weight: 900; }
.status-candidate { background: #f1f5f9; color: #475569; }
.status-active { background: #dbeafe; color: #1d4ed8; }
.status-paused { background: #ffedd5; color: #9a3412; }
.status-unknown { background: #f1f5f9; color: #475569; }
.function-entry-grid { display: grid; gap: 13px; margin-top: 16px; }
.function-entry { width: 100%; display: flex; align-items: center; gap: 14px; text-align: left; border: 1px solid var(--v2-line); border-radius: 18px; padding: 17px; background: #fff; cursor: pointer; }
.function-entry:active, .training-card:active { transform: scale(.995); }
.function-entry span:last-child { min-width: 0; }
.function-entry strong { display: block; font-size: 19px; line-height: 1.25; }
.function-entry small { display: block; margin-top: 5px; color: var(--v2-muted); font-size: 13px; line-height: 1.45; }
.function-icon { width: 48px; height: 48px; border-radius: 15px; display: grid; place-items: center; font-size: 25px; flex: 0 0 auto; }
.board-entry .function-icon { background: #ecfeff; }
.mentor-entry .function-icon { background: #eff6ff; }
.feedback-entry .function-icon { background: #fff7ed; }
.function-lock { display: none; width: fit-content; margin-top: 8px; padding: 4px 8px; border-radius: 999px; background: #e2e8f0; color: #475569; font-size: 12px; font-style: normal; font-weight: 900; }
.function-entry[aria-disabled="true"] { background: #f8fafc; border-color: #e2e8f0; cursor: help; }
.function-entry[aria-disabled="true"] .function-icon { filter: grayscale(1); opacity: .72; }
.function-entry[aria-disabled="true"] strong, .function-entry[aria-disabled="true"] small { color: #64748b; }
.function-entry[aria-disabled="true"] .function-lock { display: inline-flex; }
.workspace-page-title { margin: 7px 2px 14px; }
.workspace-page-title h2 { margin: 12px 0 5px; }
.workspace-page-title p { margin: 0; }
.workspace-back-link { border: 1px solid #93c5fd; background: var(--v2-soft); color: var(--v2-blue); padding: 10px 14px; border-radius: 14px; font-size: 18px; font-weight: 900; text-align: left; }
.feedback-workspace-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.owner-preview-badge { margin-left: auto; }
.owner-preview-badge[hidden] { display: none !important; }
.workspace-select-label { display: block; margin: 15px 0 6px; font-size: 13px; font-weight: 900; color: #475569; }
.workspace-select { width: 100%; min-height: 50px; border: 1px solid #cbd5e1; border-radius: 13px; background: #fff; padding: 10px 12px; font-size: 16px; }
.filter-grid { display: grid; gap: 12px; }
.filter-grid label { display: block; font-size: 13px; font-weight: 800; color: #475569; margin-bottom: 5px; }
.filter-grid select, .filter-grid input { width: 100%; min-height: 48px; border: 1px solid #cbd5e1; border-radius: 13px; background: #fff; padding: 10px 12px; font-size: 16px; }
.list-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.training-list { display: grid; gap: 14px; }
.training-card { width: 100%; text-align: left; border: 1px solid var(--v2-line); background: #fff; border-radius: 20px; padding: 16px; cursor: pointer; }
.training-card-top { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; min-width: 0; }
.training-card-top > :first-child { min-width: 0; flex: 1 1 auto; }
.training-name { min-width: 0; font-size: 23px; font-weight: 900; line-height: 1.25; white-space: normal; overflow-wrap: anywhere; }
.training-fullname { font-size: 14px; color: var(--v2-muted); margin-top: 4px; }
.training-store-box { text-align: right; flex: 0 1 auto; min-width: 0; max-width: 100%; }
.training-store { font-size: 20px; font-weight: 900; white-space: nowrap; }
.training-day { margin-top: 5px; max-width: 100%; font-size: 12px; font-weight: 900; line-height: 1.35; color: #1d4ed8; background: var(--v2-soft); border-radius: 999px; padding: 5px 8px; white-space: normal; overflow-wrap: anywhere; }
.training-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 11px; }
.handoff-store-pill { display: inline-flex; align-items: center; border-radius: 999px; padding: 6px 10px; background: #f1f5f9; color: #475569; font-size: 12px; font-weight: 900; }
.training-handoff { display: grid; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid #e2e8f0; }
.training-handoff-row { display: grid; grid-template-columns: minmax(0, 42%) minmax(0, 58%); gap: 10px; align-items: start; }
.training-handoff-label { color: var(--v2-muted); font-size: 12px; font-weight: 800; line-height: 1.4; }
.training-handoff-value { color: #0f172a; font-size: 14px; font-weight: 800; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.training-footer { font-size: 13px; color: var(--v2-muted); margin-top: 11px; line-height: 1.45; }
.training-card-cta { display: flex; align-items: center; justify-content: flex-end; min-height: 44px; margin-top: 10px; padding-top: 10px; border-top: 1px solid #e2e8f0; color: var(--v2-blue); font-size: 14px; font-weight: 900; line-height: 1.35; }
.training-card-cta::after { content: '›'; margin-left: 6px; font-size: 18px; line-height: 1; }
.detail-header { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.detail-title { font-size: 25px; font-weight: 900; }
.detail-sub { color: var(--v2-muted); margin-top: 5px; }
.detail-summary { min-width: 0; border: 1px solid var(--v2-line); background: #f8fafc; border-radius: 18px; padding: 14px; overflow: hidden; }
.detail-summary-top { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; min-width: 0; margin-top: 10px; }
.detail-summary-identity { min-width: 0; flex: 1 1 auto; }
.detail-full-name { width: 100%; min-width: 0; font-size: 25px; font-weight: 900; line-height: 1.25; white-space: normal; overflow-wrap: anywhere; }
.detail-nickname { font-size: 16px; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
.detail-employee-id, .detail-training-id { margin-top: 4px; color: var(--v2-muted); font-size: 14px; font-weight: 800; line-height: 1.4; overflow-wrap: anywhere; }
.detail-summary-meta { min-width: 0; max-width: 48%; flex: 0 1 48%; text-align: right; }
.detail-summary-store { font-size: 20px; font-weight: 900; line-height: 1.25; overflow-wrap: anywhere; }
.detail-summary-progress { margin-top: 5px; max-width: 100%; font-size: 12px; font-weight: 900; line-height: 1.35; color: #1d4ed8; background: var(--v2-soft); border-radius: 999px; padding: 5px 8px; white-space: normal; overflow-wrap: anywhere; }
.detail-summary-tags { margin-top: 11px; }
.section-title { font-size: 18px; font-weight: 900; margin: 17px 0 10px; }
.detail-field { border: 1px solid #e2e8f0; background: #fff; border-radius: 14px; padding: 12px; }
.detail-field span { display: block; font-size: 12px; color: var(--v2-muted); margin-bottom: 5px; }
.detail-field strong { white-space: pre-wrap; overflow-wrap: anywhere; }
.trainee-identity-field > strong { font-size: 18px; line-height: 1.35; }
.trainee-identity-nickname { margin-top: 6px; font-size: 15px; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
.trainee-identity-id { margin-top: 4px; color: var(--v2-muted); font-size: 14px; font-weight: 800; line-height: 1.4; overflow-wrap: anywhere; }
.empty-state { padding: 20px; text-align: center; color: var(--v2-muted); background: #f8fafc; border-radius: 14px; }

.training-history-list { display: grid; gap: 14px; }
.training-history-card { min-width: 0; border: 1px solid var(--v2-line); border-radius: 18px; padding: 0; background: #f8fafc; overflow: hidden; }
.training-history-header { position: relative; display: grid; gap: 8px; min-height: 48px; padding: 14px 48px 14px 14px; cursor: pointer; list-style: none; }
.training-history-header::-webkit-details-marker { display: none; }
.training-history-header::after { content: '⌄'; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-size: 24px; font-weight: 900; line-height: 1; color: var(--v2-blue); transition: transform .18s ease; }
.training-history-card[open] .training-history-header { border-bottom: 1px solid #e2e8f0; }
.training-history-card[open] .training-history-header::after { transform: translateY(-50%) rotate(180deg); }
.training-history-header:focus-visible { outline: 3px solid #93c5fd; outline-offset: -3px; border-radius: 18px; }
.training-history-title { font-size: 18px; font-weight: 900; line-height: 1.35; overflow-wrap: anywhere; }
.training-history-meta { display: flex; flex-wrap: wrap; gap: 6px 12px; color: var(--v2-muted); font-size: 12px; font-weight: 800; line-height: 1.45; }
.training-history-meta-item { min-width: 0; overflow-wrap: anywhere; }
.training-history-content { min-width: 0; padding: 0 14px 14px; }
.training-history-evidence { min-width: 0; margin-top: 12px; padding: 12px; border-radius: 14px; background: #fff; border: 1px solid #e2e8f0; }
.training-history-evidence-title { margin-bottom: 10px; font-size: 15px; font-weight: 900; line-height: 1.4; overflow-wrap: anywhere; }
.mentor-history { border-left: 4px solid #93c5fd; }
.feedback-history { border-left: 4px solid #fdba74; }
.training-history-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; min-width: 0; }
.training-history-fields .detail-field { min-width: 0; }
.training-history-evidence-empty { margin-top: 10px; padding: 10px 12px; border-radius: 12px; color: var(--v2-muted); background: #fff; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.review-status { border-radius: 16px; padding: 14px; background: #fff7ed; border: 1px solid #fed7aa; }
.review-status strong { display: block; font-size: 18px; margin-bottom: 5px; }
.submission-result { min-width: 0; margin-top: 14px; padding: 16px; border-radius: 16px; overflow-wrap: anywhere; }
.submission-result[hidden] { display: none !important; }
.submission-result.is-success { background: #f0fdf4; border: 1px solid #bbf7d0; }
.submission-result.is-warning { background: #fff7ed; border: 1px solid #fed7aa; }
.submission-result strong { display: block; font-size: 19px; line-height: 1.4; }
.submission-result p { margin: 7px 0 0; line-height: 1.55; }
.submission-result-line { margin-top: 7px; font-size: 14px; font-weight: 800; line-height: 1.45; }
.candidate-form { display: grid; gap: 14px; margin-top: 14px; }
.candidate-form[hidden] { display: none !important; }
.required-field-note { display: flex; align-items: baseline; gap: 5px; margin: 0; color: var(--v2-muted); font-size: 13px; font-weight: 700; line-height: 1.45; }
.field-label-line { display: inline-flex; align-items: baseline; gap: 5px; min-width: 0; flex-wrap: wrap; }
.required-marker { display: inline-block; color: #b91c1c; font-weight: 900; line-height: 1; }
.candidate-form label { display: grid; gap: 6px; font-size: 14px; font-weight: 800; line-height: 1.45; }
.candidate-form label[hidden] { display: none !important; }
.candidate-form label small { color: var(--v2-muted); font-weight: 600; line-height: 1.45; }
.candidate-form input, .candidate-form select, .candidate-form textarea { width: 100%; min-height: 48px; border: 1px solid #cbd5e1; border-radius: 12px; padding: 11px; background: #fff; color: #0f172a; font-size: 16px; }
.candidate-form textarea { min-height: 96px; resize: vertical; }
.candidate-form fieldset { min-width: 0; margin: 0; padding: 12px; border: 1px solid #cbd5e1; border-radius: 12px; background: #fff; }
.candidate-form legend { padding: 0 5px; font-size: 14px; font-weight: 900; line-height: 1.45; }
.training-position-options { display: grid; gap: 9px; margin-top: 6px; }
.training-position-options label { display: flex; align-items: center; gap: 9px; min-height: 42px; padding: 7px 9px; border-radius: 10px; background: #f8fafc; }
.training-position-options input[type="checkbox"] { width: 22px; min-height: 22px; height: 22px; margin: 0; flex: 0 0 22px; }

.star-rating-field { min-width: 0; }
.star-rating-widget { display: grid; gap: 8px; }
.star-rating-control { position: relative; width: 100%; max-width: 360px; min-height: 58px; border: 1px solid #cbd5e1; border-radius: 14px; background: #fff; overflow: hidden; }
.star-rating-control:focus-within { outline: 3px solid #93c5fd; outline-offset: 2px; }
.star-rating-stars { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); align-items: center; pointer-events: none; }
.star-rating-star { position: relative; display: grid; place-items: center; min-width: 0; font-size: 40px; line-height: 1; color: #94a3b8; }
.star-rating-star::before { content: '★'; position: absolute; inset: 0; display: grid; place-items: center; color: #f59e0b; clip-path: inset(0 100% 0 0); }
.star-rating-star.is-full::before { clip-path: inset(0 0 0 0); }
.star-rating-hit-grid { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); }
.candidate-form .star-rating-hit-grid input[type="radio"] { position: relative; width: 100%; min-width: 0; height: 58px; min-height: 58px; margin: 0; padding: 0; border: 0; border-radius: 0; opacity: 0; cursor: pointer; touch-action: manipulation; }
.star-rating-value { display: block; min-height: 26px; font-size: 18px; font-weight: 900; line-height: 1.4; color: #0f172a; }
.star-rating-hint { display: block; color: var(--v2-muted); font-size: 12px; font-weight: 600; line-height: 1.45; }

.candidate-form button { min-height: 50px; opacity: 1; cursor: pointer; }
.candidate-form button[type="submit"] { background: linear-gradient(135deg,var(--blue),#084b87); color: #fff; }
.candidate-form button[type="submit"]:disabled { background: #94a3b8; color: #fff; cursor: not-allowed; }
@media (max-width: 640px) {
  .training-history-fields { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 420px) {
  .training-card { padding: 14px; }
  .training-name { font-size: 21px; }
  .training-store { font-size: 18px; }
  .training-handoff-row { grid-template-columns: 1fr; gap: 2px; }
}
@media (min-width: 720px) {
  .function-entry-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .function-entry { align-items: flex-start; }
  .filter-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .training-position-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}