.ck-pair { display: flex; gap: 8px; }
.ck-pair input[type=color] { width: 52px; min-width: 52px; height: 46px; padding: 2px; border: 1px solid #cdd6e0; border-radius: 10px; background: #fff; cursor: pointer; }
.ck-preview { margin: 14px 0 0; padding: 20px; border-radius: 12px; border: 1px solid var(--line); }
.ck-big { font-size: 24px; font-weight: 700; margin: 0 0 8px; }
.ck-small { font-size: 16px; margin: 0; }
.ck-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
@media (min-width: 640px) { .ck-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ck-badge { padding: 10px; border-radius: 10px; background: #fff; border: 1px solid var(--line); font-size: .85rem; }
.ck-badge b { display: block; font-size: 1rem; }
.ck-badge.pass b { color: var(--success); }
.ck-badge.fail b { color: var(--danger); }