/* Công cụ kí tự khoảng trống — bám bảng màu site: nền #f6f5fb, chữ #1f1b3a. */
.kt{--kt-ink:#1f1b3a;--kt-ink2:#514a72;--kt-bg:#f6f5fb;--kt-line:#e2ddf2;
    --kt-brand:#6d4aff;--kt-brand-d:#3a2f7d;--kt-ok:#1f8555;--kt-pink:#d0446b;
    color:var(--kt-ink);margin:0 0 28px}
.kt *{box-sizing:border-box}

.kt__eyebrow{font-size:12.5px;font-weight:800;letter-spacing:2.2px;color:var(--kt-brand);
    display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}

.kt__gen{background:#fff;border:1px solid var(--kt-line);border-radius:18px;padding:20px;
    box-shadow:0 8px 26px rgba(58,47,125,.07)}

.kt__tabs{display:flex;flex-wrap:wrap;gap:8px}
.kt__tab{flex:1 1 150px;min-width:0;text-align:left;cursor:pointer;padding:10px 13px;
    border:1.5px solid var(--kt-line);border-radius:12px;background:var(--kt-bg);
    font:inherit;color:var(--kt-ink2);transition:.15s}
.kt__tab:hover{border-color:#c9bffa}
.kt__tab.is-on{border-color:var(--kt-brand);background:#f1edff;color:var(--kt-brand-d)}
.kt__tab-cp{display:block;font-size:14.5px;font-weight:800;letter-spacing:.3px}
.kt__tab-name{display:block;font-size:12.5px;margin-top:1px;opacity:.8}

.kt__stage{margin-top:16px}
.kt__label{display:block;font-size:13.5px;color:var(--kt-ink2);margin-bottom:6px}
.kt__out{width:100%;resize:none;padding:14px 16px;border:2px dashed #c9bffa;border-radius:12px;
    background:repeating-linear-gradient(45deg,#fbfaff,#fbfaff 9px,#f4f1ff 9px,#f4f1ff 18px);
    font-family:ui-monospace,"Source Code Pro",monospace;font-size:17px;line-height:1.6;color:var(--kt-ink)}
.kt__out:focus{outline:2px solid var(--kt-brand);outline-offset:1px}

.kt__steps{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:14px}
.kt__step{width:46px;height:46px;border-radius:14px;border:1.5px solid var(--kt-line);
    background:#fff;font-size:25px;line-height:1;color:var(--kt-brand-d);cursor:pointer;transition:.15s}
.kt__step:hover{background:#f1edff;border-color:var(--kt-brand)}
.kt__step:active{transform:scale(.94)}
.kt__count{display:flex;align-items:baseline;gap:6px}
.kt__n{width:88px;padding:9px 10px;text-align:center;font:inherit;font-size:21px;font-weight:700;
    border:1.5px solid var(--kt-line);border-radius:12px;color:var(--kt-ink);background:#fff}
.kt__n-label{font-size:13.5px;color:var(--kt-ink2)}

.kt__quick{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin-top:12px}
.kt__chip{padding:6px 15px;border-radius:999px;border:1px solid var(--kt-line);background:var(--kt-bg);
    font:inherit;font-size:13.5px;color:var(--kt-ink2);cursor:pointer}
.kt__chip:hover{border-color:var(--kt-brand);color:var(--kt-brand-d)}

.kt__copy{display:block;width:100%;margin-top:16px;padding:15px;border:0;border-radius:14px;
    background:linear-gradient(180deg,#7b5bff,#5b38f0);color:#fff;font:inherit;font-size:16.5px;
    font-weight:700;cursor:pointer;box-shadow:0 6px 16px rgba(109,74,255,.3)}
.kt__copy:active{transform:translateY(1px)}
.kt__meta{margin:11px 0 0;text-align:center;font-size:13px;color:var(--kt-ink2)}

.kt__history{margin-top:18px;background:#fff;border:1px solid var(--kt-line);border-radius:16px;padding:16px}
.kt__clear{border:0;background:none;font:inherit;font-size:12px;font-weight:600;letter-spacing:0;
    color:var(--kt-pink);cursor:pointer;text-decoration:underline}
.kt__hist-list{display:flex;flex-wrap:wrap;gap:8px}
.kt__note{margin:10px 0 0;font-size:12.5px;color:#7a7396}

.kt__group{margin-top:26px}
.kt__group-title{font-weight:700;font-size:19px;margin:0 0 6px}
.kt__group-note{margin:0 0 12px;font-size:13.5px;color:var(--kt-ink2);display:flex;
    flex-wrap:wrap;align-items:center;gap:8px}
.kt__badge{display:inline-block;padding:2px 9px;border-radius:6px;background:#efeaff;
    color:var(--kt-brand-d);font-size:12.5px;font-weight:700;font-family:ui-monospace,monospace}
.kt__group-count{margin-left:auto;color:var(--kt-ok);font-weight:600}

.kt__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px}
.kt__cell{position:relative;padding:9px 6px 6px;border:1px solid var(--kt-line);border-radius:11px;
    background:#fff;cursor:pointer;transition:.14s}
.kt__cell:hover{border-color:var(--kt-brand);background:#faf8ff;transform:translateY(-1px)}
.kt__cell.is-copied{border-color:var(--kt-ok);background:#eefaf3}
.kt__cell-box{display:block;min-height:34px;border-radius:7px;
    background:repeating-linear-gradient(45deg,#f7f5ff,#f7f5ff 6px,#efebfe 6px,#efebfe 12px);
    display:flex;align-items:center;justify-content:center;overflow:hidden}
.kt__cell-char{font-family:ui-monospace,"Source Code Pro",monospace;font-size:15px;
    white-space:pre;color:var(--kt-ink)}
.kt__cell-len{display:block;margin-top:5px;font-size:11.5px;color:#8b83a8}

.kt__toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,14px);opacity:0;
    pointer-events:none;padding:11px 20px;border-radius:999px;background:var(--kt-ink);
    color:#fff;font-size:14px;font-weight:600;z-index:9999;transition:.22s}
.kt__toast.is-on{opacity:1;transform:translate(-50%,0)}

@media (max-width:600px){
 .kt__gen{padding:15px;border-radius:15px}
 .kt__tab{flex:1 1 calc(50% - 4px)}
 .kt__grid{grid-template-columns:repeat(auto-fill,minmax(70px,1fr))}
 .kt__copy{font-size:15.5px;padding:14px}
}
@media (prefers-reduced-motion:reduce){.kt *{transition:none!important}}