/* /tao-chu-ky/ — phần riêng (khung chung: /dora-assets/tools/kit.css) */
.ck-opts{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin:12px 0}
.ck-opts .t-hint{margin-right:4px}
.ck-color button{width:40px;padding:0;justify-content:center}
.ck-color button i{display:block;width:20px;height:20px;border-radius:50%;background:currentColor}
.ck-color button.on{background:#fff;color:inherit;box-shadow:0 0 0 2px var(--t-main) inset}
.ck-pad{position:relative;max-width:640px;margin:0 auto;aspect-ratio:5/2;border:2px dashed #9cc2f5;border-radius:var(--t-r);background:#fff;overflow:hidden}
.ck-pad::after{content:"";position:absolute;left:8%;right:8%;bottom:26%;border-bottom:1px solid #d6dde8;pointer-events:none}
.ck-pad canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:crosshair;z-index:1;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.ck-hint{position:absolute;left:0;right:0;top:38%;text-align:center;color:#9aa6b8;font-size:15px;pointer-events:none}
.ck-name{max-width:640px;margin:0 auto;display:block;font-size:18px}
.ck-fonts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0 0}
.ck-fonts button{display:flex;flex-direction:column;align-items:center;justify-content:center;height:92px;border:1px solid var(--t-line-d);border-radius:12px;background:#fff;cursor:pointer;padding:4px 8px;overflow:hidden;color:var(--t-ink)}
.ck-fonts button:hover{border-color:var(--t-main)}
.ck-fonts button.on{border-color:var(--t-main);box-shadow:0 0 0 2px var(--t-main) inset;background:var(--t-main-ll)}
.ck-fonts span{display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.5;padding:0 4px}
.ck-fonts span.ph{opacity:.55}
.ck-fonts small{font-size:11px;color:var(--t-mute);margin-top:2px}
.ck-out{margin-top:14px;justify-content:center}
.ck-edit{max-width:640px;margin:8px auto 0;justify-content:flex-end}
@media (max-width:640px){.ck-pad{aspect-ratio:2/1}}
.ck-warn{background:var(--t-warn-l);border:1px solid #f3d59b;border-radius:12px;padding:10px 12px;font-size:14px;margin:12px 0 0}
@media (min-width:720px){.ck-fonts{grid-template-columns:repeat(3,minmax(0,1fr))}}