/* ============================================================
   CPT cong_cu — 4 tool tiện ích
   ============================================================ */

/* -- Tung đồng xu (.coin) -- */
.coin {
    display: grid;
    gap: var(--vjol-space-5);
}
.coin__stage {
    display: grid;
    place-items: center;
    gap: var(--vjol-space-3);
    padding: var(--vjol-space-6) 0;
}
.coin__disc {
    position: relative;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    perspective: 600px;
    transform-style: preserve-3d;
    transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.coin__disc[data-face="heads"] { transform: rotateY(0); }
.coin__disc[data-face="tails"] { transform: rotateY(180deg); }
.coin__disc.is-spinning { animation: coin-spin 0.7s ease-out; }
@keyframes coin-spin {
    0%   { transform: rotateY(0); }
    50%  { transform: rotateY(900deg) scale(1.1); }
    100% { transform: rotateY(1800deg); }
}
.coin__face {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 3.5rem;
    font-weight: 700;
    color: #fff;
    backface-visibility: hidden;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}
.coin__face--heads {
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
}
.coin__face--tails {
    background: linear-gradient(135deg, #94a3b8, #64748b);
    transform: rotateY(180deg);
}
.coin__last {
    font-size: var(--vjol-fs-lg);
    font-weight: 600;
    color: var(--vjol-color-text);
    margin: 0;
}
.coin__controls {
    display: grid;
    gap: var(--vjol-space-3);
}
.coin__count {
    display: flex;
    gap: var(--vjol-space-2);
    justify-content: center;
    flex-wrap: wrap;
}
.coin__count-btn {
    padding: var(--vjol-space-2) var(--vjol-space-4);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
    background: var(--vjol-color-surface);
    cursor: pointer;
    font-weight: 500;
}
.coin__count-btn.is-active {
    background: var(--vjol-color-primary);
    color: #fff;
    border-color: var(--vjol-color-primary);
}
.coin__actions {
    display: flex;
    gap: var(--vjol-space-3);
    justify-content: center;
}
.coin__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--vjol-space-3);
    padding: var(--vjol-space-4);
    background: var(--vjol-color-surface-2, #f1f5f9);
    border-radius: var(--vjol-radius-md);
}
.coin__stat {
    display: grid;
    gap: var(--vjol-space-1);
    text-align: center;
}
.coin__stat-label {
    font-size: var(--vjol-fs-xs);
    color: var(--vjol-color-text-muted, #64748b);
}
.coin__stat-value {
    font-size: var(--vjol-fs-2xl);
    font-weight: 700;
    color: var(--vjol-color-text);
}
.coin__stat-percent {
    font-size: var(--vjol-fs-sm);
    color: var(--vjol-color-primary);
    font-weight: 600;
}
.coin__history {
    list-style: none;
    padding: 0;
    margin: var(--vjol-space-3) 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--vjol-space-2);
}
.coin__history-item {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: var(--vjol-fs-xs);
    font-weight: 700;
    color: #fff;
}
.coin__history-item--heads { background: #f59e0b; }
.coin__history-item--tails { background: #64748b; }

/* -- Chia nhóm ngẫu nhiên (.grp) -- */
.grp {
    display: grid;
    gap: var(--vjol-space-4);
}
.grp__list {
    width: 100%;
    padding: var(--vjol-space-3);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
    font-family: inherit;
    font-size: var(--vjol-fs-base);
    resize: vertical;
}
.grp__mode {
    display: flex;
    gap: var(--vjol-space-3);
    flex-wrap: wrap;
}
.grp__mode-item {
    display: flex;
    align-items: center;
    gap: var(--vjol-space-1);
    cursor: pointer;
}
.grp__value {
    width: 100px;
    padding: var(--vjol-space-2);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
}
.grp__actions {
    display: flex;
    gap: var(--vjol-space-3);
}
.grp__error {
    margin: 0;
    padding: var(--vjol-space-2) var(--vjol-space-3);
    background: #fef3c7;
    color: #92400e;
    border-radius: var(--vjol-radius-sm);
    font-size: var(--vjol-fs-sm);
}
.grp__output {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--vjol-space-3);
}
.grp__box {
    padding: var(--vjol-space-3);
    background: var(--vjol-color-surface-2, #f8fafc);
    border-radius: var(--vjol-radius-md);
    border: 1px solid var(--vjol-color-border);
}
.grp__box-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: var(--vjol-space-2);
    padding-bottom: var(--vjol-space-2);
    border-bottom: 1px solid var(--vjol-color-border);
}
.grp__box-title {
    font-weight: 700;
    color: var(--vjol-color-primary);
}
.grp__box-count {
    font-size: var(--vjol-fs-xs);
    color: var(--vjol-color-text-muted, #64748b);
}
.grp__box-list {
    list-style: decimal inside;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--vjol-space-1);
}

/* -- Đổ xúc xắc (.dice) -- */
.dice {
    display: grid;
    gap: var(--vjol-space-4);
}
.dice__stage {
    display: grid;
    place-items: center;
    gap: var(--vjol-space-3);
    padding: var(--vjol-space-5) 0;
}
.dice__group {
    display: flex;
    gap: var(--vjol-space-3);
    flex-wrap: wrap;
    justify-content: center;
}
.dice__cube {
    width: 72px;
    height: 72px;
    background: linear-gradient(135deg, #fff, #f1f5f9);
    border: 2px solid #cbd5e1;
    border-radius: var(--vjol-radius-md);
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    padding: var(--vjol-space-2);
    box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.08), 0 4px 8px rgba(0, 0, 0, 0.1);
    position: relative;
}
.dice__cube.is-rolling { animation: dice-roll 0.6s ease-out; }
@keyframes dice-roll {
    0%   { transform: rotate(0) scale(1); }
    50%  { transform: rotate(540deg) scale(1.15); }
    100% { transform: rotate(1080deg) scale(1); }
}
.dice__pip {
    width: 12px;
    height: 12px;
    background: #0f172a;
    border-radius: 50%;
    align-self: center;
    justify-self: center;
}
.dice__pip--top-left     { grid-column: 1; grid-row: 1; }
.dice__pip--top-right    { grid-column: 3; grid-row: 1; }
.dice__pip--middle-left  { grid-column: 1; grid-row: 2; }
.dice__pip--center       { grid-column: 2; grid-row: 2; }
.dice__pip--middle-right { grid-column: 3; grid-row: 2; }
.dice__pip--bottom-left  { grid-column: 1; grid-row: 3; }
.dice__pip--bottom-right { grid-column: 3; grid-row: 3; }
.dice__sum {
    margin: 0;
    font-size: var(--vjol-fs-xl);
}
.dice__sum strong {
    color: var(--vjol-color-primary);
    font-size: var(--vjol-fs-2xl);
}
.dice__controls {
    display: flex;
    gap: var(--vjol-space-4);
    flex-wrap: wrap;
    justify-content: center;
    align-items: end;
}
.dice__count {
    padding: var(--vjol-space-2);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
    font: inherit;
}
.dice__history {
    list-style: decimal inside;
    margin: var(--vjol-space-3) 0 0;
    padding: 0;
    display: grid;
    gap: var(--vjol-space-1);
}

/* -- Random tên VN (.rname) -- */
.rname {
    display: grid;
    gap: var(--vjol-space-4);
}
.rname__controls {
    display: grid;
    gap: var(--vjol-space-4);
}
.rname__option {
    display: grid;
    gap: var(--vjol-space-2);
}
.rname__option-label {
    font-size: var(--vjol-fs-sm);
    font-weight: 600;
    color: var(--vjol-color-text-muted, #64748b);
}
.rname__option-buttons {
    display: flex;
    gap: var(--vjol-space-2);
    flex-wrap: wrap;
}
.rname__btn {
    position: relative;
    cursor: pointer;
}
.rname__btn input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.rname__btn span {
    display: inline-block;
    padding: var(--vjol-space-2) var(--vjol-space-3);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
    background: var(--vjol-color-surface);
    font-size: var(--vjol-fs-sm);
    transition: all 0.15s;
}
.rname__btn input:checked + span {
    background: var(--vjol-color-primary);
    color: #fff;
    border-color: var(--vjol-color-primary);
}
.rname__actions {
    display: flex;
    gap: var(--vjol-space-3);
}
.rname__output {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: var(--vjol-space-2);
}
.rname__item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--vjol-space-3);
    background: var(--vjol-color-surface-2, #f8fafc);
    border-radius: var(--vjol-radius-md);
    border-left: 4px solid var(--vjol-color-primary);
}
.rname__item--nu { border-left-color: #ec4899; }
.rname__name {
    font-size: var(--vjol-fs-lg);
    font-weight: 600;
    color: var(--vjol-color-text);
}
.rname__gender {
    font-size: var(--vjol-fs-xs);
    color: var(--vjol-color-text-muted, #64748b);
    padding: var(--vjol-space-1) var(--vjol-space-2);
    background: var(--vjol-color-surface);
    border-radius: var(--vjol-radius-sm);
}

/* ============================================================
   CPT cong_cu — Text tools batch 2
   ============================================================ */

/* -- Bỏ dấu tiếng Việt (.bdtv) -- */
.bdtv { display: grid; gap: var(--vjol-space-4); }
.bdtv__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--vjol-space-4);
}
@media (min-width: 768px) {
    .bdtv__grid { grid-template-columns: 1fr 1fr; }
}
.bdtv__pane { display: grid; gap: var(--vjol-space-1); }
.bdtv__label {
    font-size: var(--vjol-fs-sm);
    font-weight: 600;
    color: var(--vjol-color-text-muted, #64748b);
}
.bdtv__input,
.bdtv__output {
    width: 100%;
    padding: var(--vjol-space-3);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
    font-family: inherit;
    font-size: var(--vjol-fs-base);
    line-height: 1.6;
    resize: vertical;
}
.bdtv__output {
    background: var(--vjol-color-surface-2, #f8fafc);
}
.bdtv__meta {
    font-size: var(--vjol-fs-xs);
    color: var(--vjol-color-text-muted, #64748b);
}
.bdtv__actions {
    display: flex;
    gap: var(--vjol-space-3);
    flex-wrap: wrap;
}

/* -- Đếm ký tự (.dkt) -- */
.dkt { display: grid; gap: var(--vjol-space-4); }
.dkt__pane { display: grid; gap: var(--vjol-space-1); }
.dkt__label {
    font-size: var(--vjol-fs-sm);
    font-weight: 600;
    color: var(--vjol-color-text-muted, #64748b);
}
.dkt__input {
    width: 100%;
    padding: var(--vjol-space-3);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
    font-family: inherit;
    font-size: var(--vjol-fs-base);
    line-height: 1.6;
    resize: vertical;
}
.dkt__stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--vjol-space-3);
}
@media (min-width: 640px) {
    .dkt__stats { grid-template-columns: repeat(4, 1fr); }
}
.dkt__stat {
    display: grid;
    gap: var(--vjol-space-1);
    padding: var(--vjol-space-3);
    background: var(--vjol-color-surface-2, #f8fafc);
    border-radius: var(--vjol-radius-md);
    border-left: 3px solid var(--vjol-color-primary);
    text-align: left;
}
.dkt__stat-label {
    font-size: var(--vjol-fs-xs);
    color: var(--vjol-color-text-muted, #64748b);
}
.dkt__stat-value {
    font-size: var(--vjol-fs-xl);
    font-weight: 700;
    color: var(--vjol-color-text);
}
.dkt__top-words {
    list-style: decimal inside;
    margin: var(--vjol-space-2) 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: var(--vjol-space-2);
}
.dkt__top-words li {
    padding: var(--vjol-space-1) var(--vjol-space-2);
    background: var(--vjol-color-surface-2, #f1f5f9);
    border-radius: var(--vjol-radius-sm);
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.dkt__top-words li span {
    font-size: var(--vjol-fs-xs);
    color: var(--vjol-color-primary);
    font-weight: 600;
}

/* -- Random số (.rnum) -- */
.rnum { display: grid; gap: var(--vjol-space-4); }
.rnum__inputs {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: var(--vjol-space-3);
}
.rnum__options {
    display: grid;
    gap: var(--vjol-space-3);
}
.rnum__checkbox {
    display: flex;
    align-items: center;
    gap: var(--vjol-space-2);
    cursor: pointer;
}
.rnum__sort {
    display: flex;
    gap: var(--vjol-space-2);
    flex-wrap: wrap;
    align-items: center;
}
.rnum__sort-label {
    font-size: var(--vjol-fs-sm);
    font-weight: 600;
    color: var(--vjol-color-text-muted, #64748b);
}
.rnum__sort-btn {
    position: relative;
    cursor: pointer;
}
.rnum__sort-btn input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.rnum__sort-btn span {
    display: inline-block;
    padding: var(--vjol-space-1) var(--vjol-space-3);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
    background: var(--vjol-color-surface);
    font-size: var(--vjol-fs-sm);
}
.rnum__sort-btn input:checked + span {
    background: var(--vjol-color-primary);
    color: #fff;
    border-color: var(--vjol-color-primary);
}
.rnum__actions {
    display: flex;
    gap: var(--vjol-space-3);
    flex-wrap: wrap;
}
.rnum__error {
    margin: 0;
    padding: var(--vjol-space-2) var(--vjol-space-3);
    background: #fef3c7;
    color: #92400e;
    border-radius: var(--vjol-radius-sm);
    font-size: var(--vjol-fs-sm);
}
.rnum__summary {
    margin: 0 0 var(--vjol-space-2);
    color: var(--vjol-color-text-muted, #64748b);
    font-size: var(--vjol-fs-sm);
}
.rnum__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--vjol-space-2);
}
.rnum__chip {
    padding: var(--vjol-space-1) var(--vjol-space-3);
    background: var(--vjol-color-primary);
    color: #fff;
    border-radius: var(--vjol-radius-md);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* -- Chuyển case (.cvcase) -- */
.cvcase { display: grid; gap: var(--vjol-space-4); }
.cvcase__input-pane { display: grid; gap: var(--vjol-space-1); }
.cvcase__label {
    font-size: var(--vjol-fs-sm);
    font-weight: 600;
    color: var(--vjol-color-text-muted, #64748b);
}
.cvcase__input,
.cvcase__output {
    width: 100%;
    padding: var(--vjol-space-3);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
    font-family: inherit;
    font-size: var(--vjol-fs-base);
    line-height: 1.6;
    resize: vertical;
}
.cvcase__output {
    background: var(--vjol-color-surface-2, #f8fafc);
}
.cvcase__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--vjol-space-3);
}
@media (min-width: 768px) {
    .cvcase__grid { grid-template-columns: 1fr 1fr; }
}
.cvcase__box {
    display: grid;
    gap: var(--vjol-space-1);
    padding: var(--vjol-space-3);
    background: var(--vjol-color-surface);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
}
.cvcase__box-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cvcase__box-title {
    font-weight: 700;
    color: var(--vjol-color-primary);
    font-size: var(--vjol-fs-sm);
}
.cvcase__copy {
    padding: var(--vjol-space-1) var(--vjol-space-2);
    background: var(--vjol-color-surface-2, #f1f5f9);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-sm);
    cursor: pointer;
    font-size: var(--vjol-fs-xs);
}
.cvcase__copy:hover:not(:disabled) {
    background: var(--vjol-color-primary);
    color: #fff;
    border-color: var(--vjol-color-primary);
}
.cvcase__copy:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.cvcase__actions {
    display: flex;
    gap: var(--vjol-space-3);
}

/* ============================================================
   Vật Lý + Sinh Học + Phong Thuỷ — batch 3 môn THPT + tử vi
   ============================================================ */

/* -- Tabs reuse từ vt-tabs (vận tốc / áp suất) -- */
.calc-tabs {
    display: flex;
    gap: var(--vjol-space-2);
    flex-wrap: wrap;
    margin-bottom: var(--vjol-space-3);
}
.calc-tabs__btn {
    padding: var(--vjol-space-2) var(--vjol-space-3);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
    background: var(--vjol-color-surface);
    cursor: pointer;
    font-size: var(--vjol-fs-sm);
}
.calc-tabs__btn.is-active {
    background: var(--vjol-color-primary);
    color: #fff;
    border-color: var(--vjol-color-primary);
}

/* Grid 4 cột cho form Vật Lý */
.calc-form__grid--4 {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

/* Result grid 2-3 col cho Năng lượng / ADN */
.calc-result-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--vjol-space-3);
    margin-top: var(--vjol-space-3);
}
.calc-result-grid__item {
    display: grid;
    gap: var(--vjol-space-1);
    padding: var(--vjol-space-3);
    background: var(--vjol-color-surface-2, #f8fafc);
    border-radius: var(--vjol-radius-md);
    border-left: 3px solid var(--vjol-color-primary);
}
.calc-result-grid__label {
    font-size: var(--vjol-fs-xs);
    color: var(--vjol-color-text-muted, #64748b);
}
.calc-result-grid__value {
    font-size: var(--vjol-fs-lg);
    font-weight: 700;
    color: var(--vjol-color-text);
}

/* -- Punnett square + Sinh học -- */
.punnett {
    border-collapse: collapse;
    margin: var(--vjol-space-3) 0;
}
.punnett th, .punnett td {
    border: 1px solid var(--vjol-color-border);
    padding: var(--vjol-space-2) var(--vjol-space-3);
    text-align: center;
    font-weight: 600;
    min-width: 50px;
}
.punnett th {
    background: var(--vjol-color-primary);
    color: #fff;
}
.punnett td {
    background: var(--vjol-color-surface-2, #f8fafc);
}
.punn__stats {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--vjol-space-3);
    margin-top: var(--vjol-space-3);
}
@media (min-width: 640px) {
    .punn__stats { grid-template-columns: 1fr 1fr; }
}
.punn__stats-block {
    padding: var(--vjol-space-3);
    background: var(--vjol-color-surface-2, #f8fafc);
    border-radius: var(--vjol-radius-md);
}
.punn__stats-block h4 {
    margin: 0 0 var(--vjol-space-2);
    color: var(--vjol-color-primary);
}
.punn__stats-block ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: var(--vjol-space-1);
}

/* -- ADN/ARN sequence -- */
.seq-block {
    display: block;
    padding: var(--vjol-space-3);
    background: #0f172a;
    color: #e2e8f0;
    border-radius: var(--vjol-radius-md);
    font-family: 'Menlo', 'Consolas', monospace;
    font-size: var(--vjol-fs-sm);
    line-height: 1.8;
    overflow-x: auto;
    word-break: break-all;
    margin: var(--vjol-space-2) 0 var(--vjol-space-3);
}
.aa {
    display: inline-block;
    padding: 2px 6px;
    margin: 2px 2px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 4px;
}
.aa--success { background: #10b981; color: #fff; }
.aa--danger { background: #ef4444; color: #fff; }

/* -- Phase table NST -- */
.phase-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: var(--vjol-space-3);
    font-size: var(--vjol-fs-sm);
}
.phase-table th, .phase-table td {
    padding: var(--vjol-space-2);
    border: 1px solid var(--vjol-color-border);
    text-align: center;
}
.phase-table th {
    background: var(--vjol-color-surface-2, #f1f5f9);
    color: var(--vjol-color-text);
}
.phase-table td:first-child { text-align: left; font-weight: 600; }
.phase-table td:last-child { text-align: left; font-style: italic; color: var(--vjol-color-text-muted, #64748b); }

/* -- Phong Thuỷ -- */
.pt-form .calc-field__input select,
.pt-form .calc-field__input input {
    padding: var(--vjol-space-2);
    border: 1px solid var(--vjol-color-border);
    border-radius: var(--vjol-radius-md);
    width: 100%;
}

.pt-verdict {
    padding: var(--vjol-space-4);
    border-radius: var(--vjol-radius-md);
    text-align: center;
    margin-bottom: var(--vjol-space-3);
    display: flex;
    flex-direction: column;
    gap: var(--vjol-space-1);
}
.pt-verdict__label {
    font-size: var(--vjol-fs-3xl);
    font-weight: 700;
}
.pt-verdict__score {
    font-size: var(--vjol-fs-sm);
    opacity: 0.85;
}
.pt-verdict--success { background: linear-gradient(135deg, #10b981, #059669); color: #fff; }
.pt-verdict--warning { background: linear-gradient(135deg, #f59e0b, #d97706); color: #fff; }
.pt-verdict--danger { background: linear-gradient(135deg, #ef4444, #dc2626); color: #fff; }
.pt-verdict--neutral { background: linear-gradient(135deg, #64748b, #475569); color: #fff; }

.pt-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--vjol-space-3);
    margin-bottom: var(--vjol-space-3);
}
@media (min-width: 640px) {
    .pt-grid { grid-template-columns: 1fr 1fr; }
    .pt-grid--3 { grid-template-columns: 1fr 1fr 1fr; }
}
.pt-card {
    padding: var(--vjol-space-4);
    background: var(--vjol-color-surface-2, #f8fafc);
    border-radius: var(--vjol-radius-md);
    border-left: 5px solid var(--pt-elem-color, #94a3b8);
}
.pt-card--full { grid-column: 1 / -1; }
.pt-card__role {
    margin: 0 0 var(--vjol-space-2);
    color: var(--pt-elem-color, #94a3b8);
}
.pt-card__line { margin: var(--vjol-space-1) 0; }
.pt-menh, .pt-elem { margin: var(--vjol-space-1) 0; }
.pt-elem-pill {
    display: inline-block;
    padding: 2px 10px;
    background: var(--pt-elem-color, #94a3b8);
    color: #fff;
    border-radius: var(--vjol-radius-md);
    font-weight: 600;
}
.pt-elem-pill--lg { padding: var(--vjol-space-1) var(--vjol-space-3); font-size: var(--vjol-fs-base); }
.pt-desc { margin: var(--vjol-space-2) 0 0; color: var(--vjol-color-text-muted, #64748b); font-style: italic; }

.pt-info-box {
    padding: var(--vjol-space-3);
    background: var(--vjol-color-surface-2, #f8fafc);
    border-radius: var(--vjol-radius-md);
}
.pt-info-box h4 {
    margin: 0 0 var(--vjol-space-2);
    color: var(--vjol-color-primary);
    font-size: var(--vjol-fs-sm);
}
.pt-info-box p, .pt-info-box ul {
    margin: 0;
}
.pt-info-box ul {
    list-style: none;
    padding: 0;
    display: grid;
    gap: var(--vjol-space-1);
}

.pt-analysis {
    display: grid;
    gap: var(--vjol-space-2);
    margin-bottom: var(--vjol-space-3);
}
.pt-analysis__item {
    padding: var(--vjol-space-2) var(--vjol-space-3);
    border-radius: var(--vjol-radius-sm);
    border-left: 3px solid currentColor;
}
.pt-analysis__item--success { background: #ecfdf5; color: #065f46; }
.pt-analysis__item--warning { background: #fffbeb; color: #92400e; }
.pt-analysis__item--danger { background: #fef2f2; color: #991b1b; }
.pt-analysis__item--neutral { background: #f1f5f9; color: #475569; }

.pt-msg {
    list-style: disc inside;
    padding: 0;
    margin: var(--vjol-space-3) 0 0;
    display: grid;
    gap: var(--vjol-space-1);
    color: var(--vjol-color-text-muted, #64748b);
    font-size: var(--vjol-fs-sm);
}

.pt-cmp-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: var(--vjol-space-1);
}
.pt-cmp {
    padding: var(--vjol-space-1) var(--vjol-space-2);
    border-radius: var(--vjol-radius-sm);
    font-size: var(--vjol-fs-sm);
}
.pt-cmp--success { background: #ecfdf5; color: #065f46; }
.pt-cmp--danger { background: #fef2f2; color: #991b1b; }
.pt-cmp--neutral { background: #f1f5f9; color: #475569; }

.pt-digits {
    display: flex;
    flex-wrap: wrap;
    gap: var(--vjol-space-1);
    margin: var(--vjol-space-3) 0;
}
.pt-digit {
    display: grid;
    place-items: center;
    width: 56px;
    padding: var(--vjol-space-2) 0;
    background: var(--pt-elem-color, #94a3b8);
    color: #fff;
    border-radius: var(--vjol-radius-md);
}
.pt-digit strong { font-size: var(--vjol-fs-xl); }
.pt-digit em { font-size: var(--vjol-fs-xs); opacity: 0.85; font-style: normal; }

.pt-bat-trach {
    padding: var(--vjol-space-4);
    background: linear-gradient(135deg, #fef3c7, #fde68a);
    border-radius: var(--vjol-radius-md);
    margin-bottom: var(--vjol-space-3);
}
.pt-bat-trach__title { margin: 0 0 var(--vjol-space-2); }
.pt-bat-trach__cols {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--vjol-space-3);
}
@media (min-width: 768px) {
    .pt-bat-trach__cols { grid-template-columns: 1fr 1fr; }
}
.pt-bat-trach__col {
    padding: var(--vjol-space-3);
    border-radius: var(--vjol-radius-md);
}
.pt-bat-trach__col--good { background: #ecfdf5; }
.pt-bat-trach__col--bad { background: #fef2f2; }
.pt-bat-trach__col h4 { margin: 0 0 var(--vjol-space-2); }
.pt-bat-trach__col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--vjol-space-2); }
.pt-bat-trach__col li {
    padding: var(--vjol-space-2);
    background: #fff;
    border-radius: var(--vjol-radius-sm);
    font-size: var(--vjol-fs-sm);
}
.pt-bat-trach__col li em { color: var(--vjol-color-text-muted, #64748b); }
.pt-bat-trach__col li span { color: var(--vjol-color-text-muted, #64748b); font-size: var(--vjol-fs-xs); }

/* -- YMYL disclaimer -- */
.ymyl-disclaimer {
    margin: var(--vjol-space-3) 0;
    padding: var(--vjol-space-3) var(--vjol-space-4);
    background: #fffbeb;
    border-left: 4px solid #f59e0b;
    border-radius: var(--vjol-radius-sm);
    color: #78350f;
    font-size: var(--vjol-fs-sm);
}
.ymyl-disclaimer strong { color: #92400e; }