/* Free Big Five personality test */
.pt-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 1.4rem; box-shadow: 0 6px 20px rgba(15, 23, 42, .05); }
.pt-track { height: 10px; background: #e2e8f0; border-radius: 999px; overflow: hidden; }
.pt-fill { height: 100%; width: 0; background: linear-gradient(90deg, #2563eb, #16a34a); border-radius: 999px; transition: width .4s ease; }
.pt-progress-label { color: #475569; font-weight: 600; margin-bottom: .35rem; }
.pt-items { padding-left: 1.4rem; margin: 0 0 1rem; }
.pt-item { margin-bottom: 1.1rem; padding: .2rem .3rem; border-radius: 10px; }
.pt-item.pt-missing { background: #fef2f2; outline: 1px solid #fecaca; }
.pt-q { font-weight: 600; margin-bottom: .45rem; }
.pt-scale { display: grid; grid-template-columns: repeat(5, 1fr); gap: .3rem; }
.pt-opt { display: flex; align-items: center; justify-content: center; text-align: center; min-height: 2.6rem; padding: .25rem; font-size: .78rem; line-height: 1.15; border: 1px solid #cbd5e1; border-radius: 8px; background: #f8fafc; cursor: pointer; user-select: none; }
.pt-opt:hover { border-color: #2563eb; }
.btn-check:checked + .pt-opt { background: #2563eb; border-color: #2563eb; color: #fff; font-weight: 600; }
.btn-check:focus-visible + .pt-opt { outline: 2px solid #1d4ed8; outline-offset: 2px; }
.pt-result { border: 1px solid #e2e8f0; border-radius: 14px; padding: 1rem 1.1rem; margin-bottom: .8rem; background: #fff; }
.pt-result-head { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; margin-bottom: .5rem; }
.pt-score { font-weight: 700; color: #1e3a8a; white-space: nowrap; }
.pt-cta { background: linear-gradient(135deg, #eff6ff 0%, #f0fdf4 100%); border: 1px solid #bfdbfe; border-radius: 16px; padding: 1.3rem 1.4rem; }
.pt-traits dt { margin-top: .8rem; }
.pt-traits dd { margin-bottom: 0; color: #475569; }
@media (max-width: 576px) {
    .pt-card { padding: 1rem; }
    .pt-opt { font-size: .68rem; min-height: 2.8rem; padding: .2rem .1rem; }
    .pt-items { padding-left: 1.1rem; }
}

/* bar widths as classes (no inline styles under the CSP) */
.pt-w-0{width:0%}.pt-w-1{width:1%}.pt-w-2{width:2%}.pt-w-3{width:3%}.pt-w-4{width:4%}.pt-w-5{width:5%}.pt-w-6{width:6%}.pt-w-7{width:7%}.pt-w-8{width:8%}.pt-w-9{width:9%}.pt-w-10{width:10%}.pt-w-11{width:11%}.pt-w-12{width:12%}.pt-w-13{width:13%}.pt-w-14{width:14%}.pt-w-15{width:15%}.pt-w-16{width:16%}.pt-w-17{width:17%}.pt-w-18{width:18%}.pt-w-19{width:19%}.pt-w-20{width:20%}.pt-w-21{width:21%}.pt-w-22{width:22%}.pt-w-23{width:23%}.pt-w-24{width:24%}.pt-w-25{width:25%}.pt-w-26{width:26%}.pt-w-27{width:27%}.pt-w-28{width:28%}.pt-w-29{width:29%}.pt-w-30{width:30%}.pt-w-31{width:31%}.pt-w-32{width:32%}.pt-w-33{width:33%}.pt-w-34{width:34%}.pt-w-35{width:35%}.pt-w-36{width:36%}.pt-w-37{width:37%}.pt-w-38{width:38%}.pt-w-39{width:39%}.pt-w-40{width:40%}.pt-w-41{width:41%}.pt-w-42{width:42%}.pt-w-43{width:43%}.pt-w-44{width:44%}.pt-w-45{width:45%}.pt-w-46{width:46%}.pt-w-47{width:47%}.pt-w-48{width:48%}.pt-w-49{width:49%}.pt-w-50{width:50%}.pt-w-51{width:51%}.pt-w-52{width:52%}.pt-w-53{width:53%}.pt-w-54{width:54%}.pt-w-55{width:55%}.pt-w-56{width:56%}.pt-w-57{width:57%}.pt-w-58{width:58%}.pt-w-59{width:59%}.pt-w-60{width:60%}.pt-w-61{width:61%}.pt-w-62{width:62%}.pt-w-63{width:63%}.pt-w-64{width:64%}.pt-w-65{width:65%}.pt-w-66{width:66%}.pt-w-67{width:67%}.pt-w-68{width:68%}.pt-w-69{width:69%}.pt-w-70{width:70%}.pt-w-71{width:71%}.pt-w-72{width:72%}.pt-w-73{width:73%}.pt-w-74{width:74%}.pt-w-75{width:75%}.pt-w-76{width:76%}.pt-w-77{width:77%}.pt-w-78{width:78%}.pt-w-79{width:79%}.pt-w-80{width:80%}.pt-w-81{width:81%}.pt-w-82{width:82%}.pt-w-83{width:83%}.pt-w-84{width:84%}.pt-w-85{width:85%}.pt-w-86{width:86%}.pt-w-87{width:87%}.pt-w-88{width:88%}.pt-w-89{width:89%}.pt-w-90{width:90%}.pt-w-91{width:91%}.pt-w-92{width:92%}.pt-w-93{width:93%}.pt-w-94{width:94%}.pt-w-95{width:95%}.pt-w-96{width:96%}.pt-w-97{width:97%}.pt-w-98{width:98%}.pt-w-99{width:99%}.pt-w-100{width:100%}