/* Talent AI capability assessment: presentation only; JS owns visibility/state. */
:root{--cap-ink:#0f172a;--cap-muted:#64748b;--cap-line:#e2e8f0;--cap-primary:#4f46e5;--cap-soft:#eef2ff;--cap-gradient:linear-gradient(135deg,#655cff,#0ea5e9);--cap-shadow:0 8px 32px #0f172a06}
*{box-sizing:border-box}
body.capability-app{margin:0;background:#f8fafc;color:var(--cap-ink);font:15px/1.7 Inter,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}


#app{max-width:1208px;padding:48px 28px 64px;margin:0 auto}#app h1,#app h2,#app h3,#app h4{color:var(--cap-ink);letter-spacing:-.025em;line-height:1.4}#app h1{font-size:clamp(28px,3.4vw,42px);font-weight:750}#app h2{font-weight:700}#app h3{font-size:18px}#app h4{font-size:17px}
#app .text-gray-400,#app .text-gray-500{color:var(--cap-muted)}#app .text-gray-600{color:#475569}#app .text-gray-800{color:var(--cap-ink)}#app :is(.shadow,.shadow-lg,.shadow-sm){box-shadow:var(--cap-shadow);border:1px solid var(--cap-line)}#app .rounded-2xl{border-radius:20px}#app .rounded-xl{border-radius:12px}#app .gradient-bg{background:var(--cap-gradient)}
#app button,#app input,#app select{font:inherit}#app button{cursor:pointer;transition:background .18s,border-color .18s,box-shadow .18s,transform .18s;line-height:1.5}#app button:is(.gradient-bg,.bg-blue-600){background:var(--cap-gradient);color:white;border:1px solid transparent;box-shadow:0 4px 12px #655cff20;font-weight:650}#app button:is(.gradient-bg,.bg-blue-600):hover{filter:brightness(.96);box-shadow:0 6px 20px #655cff30;transform:translateY(-1px)}#app button:disabled{opacity:.5;cursor:not-allowed;transform:none}#app button{min-height:44px}#app :is(button,a,input):focus-visible{outline:3px solid #818cf8;outline-offset:4px}
#app input:not([type=radio]){background:#fff;border:1px solid #cbd5e1;border-radius:10px;min-height:50px;color:var(--cap-ink);box-shadow:0 1px 2px #0f172a03}#app input::placeholder{color:#64748b}#app input:focus{border-color:#655cff;box-shadow:0 0 0 3px #655cff14}#app label{font-size:14px;font-weight:600}#app form.space-y-4>div+div{margin-top:22px}
#app :is(.text-blue-600,.text-blue-700,.text-blue-800,.text-green-600,.text-orange-600,.text-purple-600){color:var(--cap-primary)}#app :is(.bg-blue-50,.bg-green-50,.bg-yellow-50,.bg-orange-50,.bg-red-50){background:#f8fafc}#app :is(.bg-blue-100,.bg-green-100,.bg-purple-100,.bg-orange-100){background:var(--cap-soft);color:#4338ca}#app :is(.border-yellow-200,.border-green-200,.border-orange-200,.border-blue-100){border-color:var(--cap-line)}#app :is(.text-yellow-700,.text-yellow-800,.text-green-800,.text-orange-800){color:#475569}
#homeView{padding:24px 0}#homeView>div:first-child{max-width:820px;margin:0 auto 44px}#homeView h1{margin-bottom:20px}#homeView>div:first-child p{font-size:17px;line-height:1.9}#app :is(#homeView,#authView,#saveInfoView)>div:first-child>.inline-block{background:var(--cap-soft);color:#4338ca;border:1px solid #e0e7ff;border-radius:7px;font-size:12px;font-weight:650;letter-spacing:.04em}#homeView .dimension-grid{gap:16px;margin-bottom:40px}#homeView .dimension-grid>div{background:#fff;border:1px solid var(--cap-line);padding:26px 16px;text-align:left;border-radius:16px;box-shadow:var(--cap-shadow)}.dimension-mark{display:grid;place-items:center;width:38px;height:38px;margin-bottom:24px;border:1px solid #e0e7ff;border-radius:10px;background:var(--cap-soft);color:var(--cap-primary);font-size:13px;font-weight:750;font-variant-numeric:tabular-nums}#homeView .dimension-grid .font-bold{font-size:15px;line-height:1.5;margin-bottom:8px}#homeView .dimension-grid .text-xs{font-size:12px}#homeView button.gradient-bg{min-width:240px;border-radius:10px;font-size:16px;padding:16px 32px}#userInfo{overflow-wrap:anywhere}
#authView,#saveInfoView{padding-top:16px}#authView>div.bg-white,#saveInfoView>div.bg-white{padding:36px;max-width:480px}#authView>div:first-child,#saveInfoView>div:first-child{margin-bottom:28px}#authView h1,#saveInfoView h1{font-size:30px}#authError,#saveInfoError{background:#fff1f2;border-radius:8px;padding:10px;color:#be123c}
#adminView>.gradient-bg{background:#fff;color:var(--cap-ink);border:1px solid var(--cap-line);border-top:3px solid #655cff;padding:28px;box-shadow:var(--cap-shadow)}#adminView>.gradient-bg p{color:var(--cap-muted)}#adminView>.gradient-bg>.flex{gap:24px;align-items:flex-start}#adminView>.gradient-bg>.flex>div:last-child{flex-wrap:wrap;justify-content:flex-end;gap:10px}#adminView>.gradient-bg button,#reportsView>.flex button{background:#fff;color:#4338ca;border:1px solid #c7d2fe;border-radius:9px;padding:10px 16px;font-size:14px;white-space:nowrap}#adminView>.gradient-bg button:first-child,#reportsView>.flex button:first-child{background:var(--cap-soft)}#adminView .grid-cols-4{gap:18px}#adminView .grid-cols-4>div{padding:24px}#adminView .grid-cols-4 .text-3xl{font-size:34px;color:var(--cap-ink);font-variant-numeric:tabular-nums;margin-bottom:6px}#levelDist>div{gap:10px;padding:10px 0;font-size:13px}#levelDist .h-4{height:8px}#levelDist .bg-blue-500,#progressBar{background:var(--cap-gradient)}#deptDist>div{padding:12px 14px;background:#f8fafc;font-size:14px;gap:16px}#usersList>div{gap:16px;padding:16px 0}#usersList>div>div:first-child{min-width:0;overflow-wrap:anywhere}#usersList>div>div:last-child{flex-shrink:0}
#reportsView>.flex{gap:20px;align-items:center}#reportsList{overflow-x:auto;overscroll-behavior-x:contain}#reportsList table{width:100%;min-width:680px;border-collapse:collapse;text-align:left;font-size:14px}#reportsList th{padding:16px 22px;background:#f1f5f9;border-bottom:1px solid var(--cap-line);color:#475569;font-size:12px;font-weight:650;white-space:nowrap;letter-spacing:.02em}#reportsList td{padding:18px 22px;border-bottom:1px solid #f1f5f9;vertical-align:middle;line-height:1.7}#reportsList td:first-child{color:var(--cap-ink)}#reportsList td:nth-child(2){min-width:180px;overflow-wrap:anywhere}#reportsList td:nth-child(n+3){white-space:nowrap;font-variant-numeric:tabular-nums}#reportsList tr:hover td{background:#fafbff}#reportsList td button{font-size:13px;font-weight:600}
#assessmentView{max-width:920px;margin:auto}#assessmentView>.mb-4{margin-bottom:28px}#assessmentView>.bg-white{padding:40px}#qCode{border-radius:6px;background:var(--cap-soft);color:#4338ca;font-family:ui-monospace,monospace;letter-spacing:.04em}#qText{font-size:24px;line-height:1.8;min-height:86px;margin-bottom:30px}#scoreOptions{gap:12px}#scoreOptions .score-option{position:relative;min-height:124px;padding:22px 8px;background:#fff;border:1px solid var(--cap-line);border-radius:12px;justify-content:center;gap:8px}#scoreOptions .score-option:hover{border-color:#a5b4fc;background:#fafaff}#scoreOptions .score-option.selected{border:2px solid #655cff;padding:21px 7px;background:var(--cap-soft);box-shadow:0 0 0 3px #655cff0a}#scoreOptions .score-option.selected span{color:#4338ca}#scoreOptions .score-option:focus-within{outline:3px solid #818cf8;outline-offset:3px}#scoreOptions .text-2xl{font-size:28px;font-variant-numeric:tabular-nums}#scoreOptions .text-xs{font-size:13px}#assessmentView .pt-6{padding-top:32px;gap:12px}
#resultView>.gradient-bg{padding:36px;background:var(--cap-gradient)}#overallScore{font-size:76px;line-height:1.2;letter-spacing:-.05em;font-variant-numeric:tabular-nums}#overallComment{font-size:16px;border:1px solid #ffffff40}#resultView>.grid{gap:24px}#resultView .h-80{height:320px}#dimResults>div{padding:15px 16px;border-color:var(--cap-line);background:#fff}#dimResults .h-3{height:7px;margin:12px 0}#dimResults .h-full{background:var(--cap-gradient)!important}#dimResults [style*="color:"]{color:var(--cap-primary)!important}#dimensionRecs>div{padding:28px;border:1px solid var(--cap-line);box-shadow:var(--cap-shadow)}#dimensionRecs .w-12.h-12{background:var(--cap-soft)!important;color:#4338ca!important;font-size:13px;font-weight:750;flex-shrink:0;width:40px;height:40px;border:1px solid #e0e7ff;border-radius:10px}#dimensionRecs li{line-height:1.9}#dimensionRecs ul{margin-top:10px}#dimensionRecs .bg-blue-50{background:var(--cap-soft);border-radius:10px}#dimensionRecs .bg-yellow-50{border-left:3px solid #94a3b8;background:#f8fafc}#resultView>div:last-child{display:flex;justify-content:center;flex-wrap:wrap;gap:12px}#resultView>div:last-child>button{margin:0}
.capability-loader{width:34px;height:34px;margin:0 auto 20px;border:3px solid #e0e7ff;border-top-color:#655cff;border-radius:50%;animation:cap-spin .8s linear infinite}@keyframes cap-spin{to{transform:rotate(360deg)}}
@media(min-width:1024px){#homeView .dimension-grid>div{min-height:184px}}
@media(max-width:1000px){#adminView>.gradient-bg>.flex{flex-direction:column}#adminView>.gradient-bg>.flex>div:last-child{justify-content:flex-start}#homeView .dimension-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){#app{padding:28px 18px 44px}#homeView{padding:10px 0}#homeView>div:first-child{margin-bottom:28px}#homeView h1{font-size:30px}#homeView>div:first-child p{font-size:14px}#homeView .dimension-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:28px}#homeView .dimension-grid>div{padding:18px 14px}.dimension-mark{margin-bottom:18px}#homeView .dimension-grid>div:last-child{grid-column:1/-1}#authView>div.bg-white,#saveInfoView>div.bg-white{padding:24px}#app h1{font-size:28px}#adminView>.gradient-bg{padding:22px}#adminView .grid-cols-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}#adminView .grid-cols-4>div{padding:20px}#adminView .grid-cols-4 .text-3xl{font-size:30px}#adminView>.gradient-bg>.flex>div:last-child{display:grid;grid-template-columns:1fr 1fr;width:100%}#adminView .grid-cols-1>div{padding:22px}#usersList>div{flex-wrap:wrap;gap:8px}#reportsView>.flex{align-items:flex-start;flex-direction:column}#reportsView>.flex>.flex{flex-wrap:wrap}#assessmentView>.bg-white{padding:24px 18px}#qText{font-size:20px;min-height:0;margin-bottom:26px}#scoreOptions{grid-template-columns:1fr;gap:10px}#scoreOptions .score-option{flex-direction:row;justify-content:flex-start;min-height:58px;padding:12px 18px;gap:18px}#scoreOptions .score-option.selected{padding:11px 17px}#scoreOptions .text-2xl{font-size:23px;min-width:24px;margin:0}#assessmentView .pt-6 button{padding:12px 18px}#assessmentView>.text-center{font-size:12px}#saveInfoForm .flex{gap:10px}#saveInfoForm .flex button{margin:0;padding-left:12px;padding-right:12px}#resultView>.gradient-bg{padding:28px 18px}#overallScore{font-size:64px}#resultView>.grid>div{padding:22px 18px}#resultView .h-80{height:280px}#dimensionRecs>div{padding:22px 18px}#dimResults .text-sm{font-size:13px}#dimensionRecs .flex.items-center{align-items:flex-start}#dimensionRecs h4{font-size:16px}#resultView>div:last-child>button{flex:1;padding:12px 18px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{body.capability-app{background:#fff}#app{padding:20px 0;max-width:none}#resultView>div:last-child{display:none}#resultView>.gradient-bg{background:#eef2ff!important;color:#0f172a!important;print-color-adjust:exact}#dimensionRecs>div,#resultView .grid>div{break-inside:avoid;box-shadow:none}#resultView .h-80{height:280px}#overallScore{font-size:52px}#resultView>.grid{grid-template-columns:1fr 1fr}#overallComment{border-color:#c7d2fe}}
