/*! demtu-tools tools.css — style widget, tự đủ, không phụ thuộc theme. Token --dt-* khớp design/dt-base.css (theme sẽ định nghĩa lại cùng giá trị). */
:root{
  --dt-primary:#0B7A75;--dt-primary-strong:#085C58;--dt-primary-soft:#E4F3F1;--dt-result:#0B7A75;
  --dt-bg:#FAFAF9;--dt-surface:#FFFFFF;--dt-surface-2:#F3F4F3;--dt-border:#DDE1DF;--dt-border-strong:#B5BDBA;
  --dt-text:#1B1F1E;--dt-text-2:#4B5351;--dt-text-3:#687270;--dt-text-invert:#FFFFFF;
  --dt-ok:#1E7F43;--dt-ok-soft:#E3F4E8;--dt-warn:#9A5B00;--dt-warn-soft:#FFF1D6;--dt-warn-bar:#E8A317;--dt-err:#B42318;--dt-err-soft:#FDECEA;
  --dt-note-bg:#FFF8E8;--dt-note-border:#EFD28E;--dt-source-bg:#F3F6F5;--dt-source-border:#CFD8D5;
  --dt-hl-1:#FFF3A8;--dt-hl-2:#FFD9A8;--dt-hl-3:#C9E7FF;--dt-hl-4:#E3D4FF;--dt-diff-add:#D7F5DF;--dt-diff-del:#FBDAD6;
  --dt-font-sans:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --dt-font-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --dt-fs-1:13px;--dt-fs-2:14px;--dt-fs-3:16px;--dt-fs-4:19px;--dt-fs-5:clamp(22px,2.4vw,26px);
  --dt-fs-num:clamp(28px,4vw,40px);--dt-fs-num-xl:clamp(40px,6vw,56px);
  --dt-lh-tight:1.2;--dt-lh:1.6;--dt-lh-mono:1.55;
  --dt-sp-1:4px;--dt-sp-2:8px;--dt-sp-3:12px;--dt-sp-4:16px;--dt-sp-5:24px;--dt-sp-6:32px;--dt-sp-7:48px;
  --dt-r-sm:6px;--dt-r:10px;--dt-r-lg:16px;--dt-r-full:999px;
  --dt-sh-1:0 1px 2px rgba(27,31,30,.06);--dt-sh-2:0 4px 16px rgba(27,31,30,.08);
  --dt-control-h:44px;
}

/* ---------- Khung tool ---------- */
.dt-tool{box-sizing:border-box;margin:var(--dt-sp-5) 0;background:var(--dt-surface);border:1px solid var(--dt-border);border-radius:var(--dt-r-lg);box-shadow:var(--dt-sh-1);overflow:hidden;font-family:var(--dt-font-sans);font-size:var(--dt-fs-3);line-height:var(--dt-lh);color:var(--dt-text);font-variant-numeric:tabular-nums}
.dt-tool *,.dt-tool *::before,.dt-tool *::after{box-sizing:border-box}
.dt-tool button,.dt-tool input,.dt-tool select,.dt-tool textarea{font:inherit;color:inherit;margin:0}
.dt-tool button{cursor:pointer}
.dt-tool :focus-visible{outline:2px solid var(--dt-primary);outline-offset:2px}
.dt-tool p{margin:0}
.dt-tool a{color:var(--dt-primary)}
.dt-tool__loading{padding:var(--dt-sp-5) var(--dt-sp-4);color:var(--dt-text-3);font-size:var(--dt-fs-2);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dt-spinner{width:16px;height:16px;border:2px solid var(--dt-border);border-top-color:var(--dt-primary);border-radius:50%;animation:dt-spin .8s linear infinite;flex:none}
@keyframes dt-spin{to{transform:rotate(360deg)}}
.dt-visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;opacity:0;pointer-events:none}
.dt-muted{color:var(--dt-text-3)}
.dt-icon{flex:none}

/* Thanh nút */
.dt-tool__bar{display:flex;flex-wrap:wrap;gap:var(--dt-sp-2);align-items:center;padding:var(--dt-sp-3) var(--dt-sp-4);border-bottom:1px solid var(--dt-border);background:var(--dt-surface-2)}
.dt-btn,.dt-tool label.dt-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:var(--dt-control-h);padding:0 12px;border:1px solid var(--dt-border);border-radius:var(--dt-r);background:var(--dt-surface);color:var(--dt-text);font-size:var(--dt-fs-2);font-weight:500;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;position:relative}
.dt-btn:hover{border-color:var(--dt-border-strong);background:var(--dt-bg)}
.dt-btn--primary{background:var(--dt-primary);border-color:var(--dt-primary);color:var(--dt-text-invert);font-weight:600}
.dt-btn--primary:hover{background:var(--dt-primary-strong);border-color:var(--dt-primary-strong)}
.dt-btn--ghost{background:transparent;border-color:transparent;color:var(--dt-primary);font-weight:600}
.dt-btn--ghost:hover{background:var(--dt-primary-soft);border-color:transparent}
.dt-btn--right{margin-left:auto}
.dt-btn--sm{min-height:36px;padding:0 10px;font-size:var(--dt-fs-1)}
.dt-btn[disabled]{opacity:.5;cursor:not-allowed}

/* Ô nhập */
.dt-tool__body{padding:var(--dt-sp-4)}
.dt-tool .dt-tool__input{display:block;width:100%;min-height:clamp(190px,30vh,280px);padding:14px 16px;border:1px solid var(--dt-border-strong);border-radius:var(--dt-r);background:var(--dt-surface);font-family:var(--dt-font-mono);font-size:var(--dt-fs-3);line-height:var(--dt-lh-mono);color:var(--dt-text);resize:vertical}
.dt-tool .dt-tool__input:focus{border-color:var(--dt-primary);outline:2px solid var(--dt-primary);outline-offset:0}
.dt-tool__input.is-drag{border-style:dashed;border-color:var(--dt-primary);background:var(--dt-primary-soft)}
.dt-tool .dt-tool__input--short{min-height:110px}
.dt-tool .dt-tool__input--mono-small{font-size:var(--dt-fs-2)}

/* Dải số kết quả */
.dt-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--dt-sp-2);padding:0 var(--dt-sp-4) var(--dt-sp-4)}
@media(min-width:768px){.dt-results{grid-template-columns:repeat(6,minmax(0,1fr))}.dt-results--4{grid-template-columns:repeat(4,minmax(0,1fr))}.dt-results--3{grid-template-columns:repeat(3,minmax(0,1fr))}.dt-results--2{grid-template-columns:repeat(2,minmax(0,1fr))}}
.dt-results--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.dt-result{padding:12px 14px;border-radius:var(--dt-r);background:var(--dt-surface-2);min-width:0}
.dt-result--primary{background:var(--dt-primary-soft)}
.dt-result--wide{grid-column:span 3}
@media(min-width:768px){.dt-result--wide{grid-column:span 2}}
.dt-result__num{font-size:var(--dt-fs-num);line-height:1.05;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--dt-result);overflow-wrap:anywhere}
.dt-result__num--xl{font-size:var(--dt-fs-num-xl)}
.dt-result.is-empty .dt-result__num{color:var(--dt-text-3)}
.dt-result.is-over .dt-result__num{color:var(--dt-err)}
.dt-result.is-warn .dt-result__num{color:var(--dt-warn)}
.dt-result__label{margin-top:6px;font-size:var(--dt-fs-1);color:var(--dt-text-2);font-weight:500}
.dt-result__sub{margin-top:2px;font-size:var(--dt-fs-1);color:var(--dt-text-3)}
.dt-result__sub[hidden]{display:none}

/* Dòng phụ, chân */
.dt-tool__meta{margin:0;padding:0 var(--dt-sp-4) var(--dt-sp-4);font-size:var(--dt-fs-2);color:var(--dt-text-2);display:flex;flex-wrap:wrap;gap:4px 14px}
.dt-tool__meta strong{color:var(--dt-text);font-weight:600}
.dt-tool__meta .dt-muted{color:var(--dt-text-3)}
.dt-tool__section{padding:var(--dt-sp-4);border-top:1px solid var(--dt-border);display:grid;gap:var(--dt-sp-3)}
.dt-tool__section--soft{background:var(--dt-bg)}
.dt-tool__section h3,.dt-tool__title{margin:0;font-size:var(--dt-fs-2);font-weight:600;color:var(--dt-text-2)}
.dt-tool__foot{margin:0;display:flex;align-items:center;gap:8px;padding:var(--dt-sp-3) var(--dt-sp-4);border-top:1px solid var(--dt-border);font-size:var(--dt-fs-1);color:var(--dt-text-3)}
.dt-tool__note{padding:0 var(--dt-sp-4) var(--dt-sp-4);font-size:var(--dt-fs-1);color:var(--dt-text-3)}

/* Badge, box */
.dt-badge{display:inline-flex;align-items:center;gap:4px;min-height:22px;padding:0 8px;border-radius:var(--dt-r-full);font-size:11px;font-weight:600;line-height:1;letter-spacing:.01em;white-space:nowrap;vertical-align:middle;font-family:var(--dt-font-sans)}
.dt-badge--ok{background:var(--dt-ok-soft);color:var(--dt-ok)}
.dt-badge--warn{background:var(--dt-warn-soft);color:var(--dt-warn)}
.dt-badge--err{background:var(--dt-err-soft);color:var(--dt-err)}
.dt-badge--primary{background:var(--dt-primary-soft);color:var(--dt-primary-strong)}
.dt-badge--muted{background:var(--dt-surface-2);color:var(--dt-text-2)}
.dt-box-note,.dt-box-source,.dt-box-err,.dt-box-ok{margin:0;padding:var(--dt-sp-3) var(--dt-sp-4);border-radius:var(--dt-r);font-size:var(--dt-fs-2);line-height:1.5}
.dt-box-note{background:var(--dt-note-bg);border:1px solid var(--dt-note-border);color:var(--dt-text)}
.dt-box-source{background:var(--dt-source-bg);border:1px solid var(--dt-source-border);color:var(--dt-text-2)}
.dt-box-err{background:var(--dt-err-soft);border:1px solid #F1B9B3;color:var(--dt-err)}
.dt-box-ok{background:var(--dt-ok-soft);border:1px solid #B9E0C6;color:var(--dt-ok)}
.dt-tool .dt-box-note,.dt-tool .dt-box-source,.dt-tool .dt-box-err,.dt-tool .dt-box-ok{margin:0 var(--dt-sp-4) var(--dt-sp-4)}
.dt-tool__section .dt-box-note,.dt-tool__section .dt-box-source,.dt-tool__section .dt-box-err,.dt-tool__section .dt-box-ok{margin:0}

/* Thanh giới hạn */
.dt-limit{display:grid;gap:6px;padding:0 var(--dt-sp-4) var(--dt-sp-4)}
.dt-tool__section .dt-limit{padding:0}
.dt-limit__label{font-size:var(--dt-fs-2);color:var(--dt-text-2);display:flex;justify-content:space-between;gap:var(--dt-sp-3);flex-wrap:wrap}
.dt-limit__label strong{color:var(--dt-ok)}
.dt-limit[data-trang-thai=warn] .dt-limit__label strong{color:var(--dt-warn)}
.dt-limit[data-trang-thai=err] .dt-limit__label strong{color:var(--dt-err)}
.dt-limit__track{position:relative;height:10px;border-radius:var(--dt-r-full);background:var(--dt-surface-2);overflow:visible}
.dt-limit__fill{height:100%;border-radius:var(--dt-r-full);background:var(--dt-ok);width:0;transition:width .15s ease,background-color .15s ease}
.dt-limit[data-trang-thai=warn] .dt-limit__fill{background:var(--dt-warn-bar)}
.dt-limit[data-trang-thai=err] .dt-limit__fill{background:var(--dt-err)}
.dt-limit__tick{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--dt-text);transform:translateX(-1px)}
.dt-limit__tick::after{content:attr(data-nhan);position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:4px;font-size:11px;color:var(--dt-text-3);white-space:nowrap}
.dt-limit--ticks{padding-bottom:calc(var(--dt-sp-4) + 14px)}

/* Form (widget B) */
.dt-form{display:grid;gap:var(--dt-sp-3);padding:var(--dt-sp-4)}
@media(min-width:600px){.dt-form--2{grid-template-columns:repeat(2,minmax(0,1fr))}.dt-form--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.dt-field{display:grid;gap:6px;min-width:0}
.dt-field__label{font-size:var(--dt-fs-2);font-weight:600;color:var(--dt-text-2)}
.dt-field__control{display:flex;align-items:center;border:1px solid var(--dt-border-strong);border-radius:var(--dt-r);background:var(--dt-surface);min-height:var(--dt-control-h);overflow:hidden}
.dt-field__control:focus-within{border-color:var(--dt-primary);outline:2px solid var(--dt-primary);outline-offset:0}
.dt-input{width:100%;min-width:0;min-height:44px;padding:0 12px;border:0;background:transparent;font-size:var(--dt-fs-3);font-variant-numeric:tabular-nums}
.dt-input:focus{outline:none}
.dt-field__control .dt-input[inputmode=decimal]{font-weight:600;text-align:right}
.dt-field__unit{padding:0 12px 0 0;color:var(--dt-text-3);font-size:var(--dt-fs-2);white-space:nowrap}
.dt-select{appearance:auto;padding-right:8px;cursor:pointer}
.dt-field__help{font-size:var(--dt-fs-1);color:var(--dt-text-3)}
.dt-field__check{display:inline-flex;align-items:center;gap:8px;min-height:var(--dt-control-h);font-size:var(--dt-fs-2);cursor:pointer}
.dt-checkbox{width:18px;height:18px;accent-color:var(--dt-primary)}
.dt-glossary__search,.dt-embed-code{display:block;width:100%;border:1px solid var(--dt-border-strong);border-radius:var(--dt-r);padding:10px 12px;background:var(--dt-surface);font:inherit}
.dt-embed-code{font-family:var(--dt-font-mono);font-size:var(--dt-fs-1);margin:8px 0}

/* Chip */
.dt-chips{display:flex;flex-wrap:wrap;gap:6px}
.dt-chip{min-height:var(--dt-control-h);padding:0 14px;border:1px solid var(--dt-border);border-radius:var(--dt-r-full);background:var(--dt-surface);color:var(--dt-text-2);font-size:var(--dt-fs-2);font-variant-numeric:tabular-nums;cursor:pointer}
.dt-chip:hover{border-color:var(--dt-border-strong)}
.dt-chip.is-active{background:var(--dt-primary);border-color:var(--dt-primary);color:var(--dt-text-invert);font-weight:600}
.dt-tags{display:flex;flex-wrap:wrap;align-items:center;gap:var(--dt-sp-2)}
.dt-tag{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 10px;border-radius:var(--dt-r-sm);background:var(--dt-hl-1);font-size:var(--dt-fs-2)}
.dt-tag .dt-muted{font-variant-numeric:tabular-nums}

/* Bảng */
.dt-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0}
.dt-tool .dt-table-wrap{padding:0 var(--dt-sp-4) var(--dt-sp-4)}
.dt-tool__section .dt-table-wrap{padding:0}
.dt-table{width:100%;border-collapse:collapse;font-size:var(--dt-fs-2);background:var(--dt-surface);border:1px solid var(--dt-border);border-radius:var(--dt-r);overflow:hidden;font-family:var(--dt-font-sans)}
.dt-table caption{caption-side:top;text-align:left;padding:0 0 8px;font-size:var(--dt-fs-1);color:var(--dt-text-3)}
.dt-table th,.dt-table td{padding:10px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--dt-border)}
.dt-table thead th{background:var(--dt-surface-2);font-weight:600;color:var(--dt-text-2);white-space:nowrap}
.dt-table tbody th{font-weight:600;background:var(--dt-bg)}
.dt-table tbody tr:nth-child(even) td{background:var(--dt-bg)}
.dt-table tbody tr:last-child td{border-bottom:0}
.dt-table td.dt-num,.dt-table th.dt-num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.dt-table tr.dt-row-hl td{background:var(--dt-primary-soft)!important}
.dt-table__empty{color:var(--dt-text-3);text-align:center!important}
.dt-table--compact th,.dt-table--compact td{padding:6px 10px}

/* Vùng kéo thả file */
.dt-drop{display:grid;justify-items:center;gap:6px;margin:var(--dt-sp-4);padding:var(--dt-sp-6) var(--dt-sp-4);border:2px dashed var(--dt-border-strong);border-radius:var(--dt-r);background:var(--dt-bg);text-align:center;cursor:pointer;color:var(--dt-text-2)}
.dt-drop:hover,.dt-drop.is-drag{border-color:var(--dt-primary);background:var(--dt-primary-soft)}
.dt-drop__icon{color:var(--dt-primary)}
.dt-drop__title{font-weight:600;color:var(--dt-text)}
.dt-drop__sub{font-size:var(--dt-fs-1);color:var(--dt-text-3)}
.dt-drop__status{font-size:var(--dt-fs-2);min-height:1.5em}
.dt-drop[data-state=busy]{border-color:var(--dt-warn-bar)}
.dt-drop[data-state=busy] .dt-drop__status{color:var(--dt-warn)}
.dt-drop[data-state=done]{border-color:var(--dt-ok)}
.dt-drop[data-state=done] .dt-drop__status{color:var(--dt-ok)}
.dt-drop[data-state=err]{border-color:var(--dt-err)}
.dt-drop[data-state=err] .dt-drop__status{color:var(--dt-err)}

/* Tô sáng, diff */
.dt-hl-1{background:var(--dt-hl-1)}.dt-hl-2{background:var(--dt-hl-2)}.dt-hl-3{background:var(--dt-hl-3)}.dt-hl-4{background:var(--dt-hl-4)}
.dt-preview{padding:14px 16px;border:1px solid var(--dt-border);border-radius:var(--dt-r);background:var(--dt-surface);font-family:var(--dt-font-mono);font-size:var(--dt-fs-2);line-height:var(--dt-lh-mono);white-space:pre-wrap;overflow-wrap:anywhere;max-height:420px;overflow:auto}
.dt-diff-add{background:var(--dt-diff-add)}.dt-diff-del{background:var(--dt-diff-del);text-decoration:line-through}
.dt-hidden-char{background:var(--dt-err-soft);color:var(--dt-err);border-radius:3px;padding:0 3px;font-size:.85em}
.dt-split{display:grid;gap:var(--dt-sp-3)}
@media(min-width:768px){.dt-split{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Thanh dính mobile */
.dt-sticky-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;transform:translateY(110%);transition:transform .2s ease;background:var(--dt-text);color:var(--dt-text-invert);padding:10px 16px calc(10px + env(safe-area-inset-bottom));justify-content:space-between;align-items:center;gap:12px;font-family:var(--dt-font-sans);font-size:var(--dt-fs-2);font-variant-numeric:tabular-nums;box-shadow:var(--dt-sh-2)}
.dt-sticky-bar.is-visible{transform:none}
.dt-sticky-bar__items{display:flex;gap:12px;flex-wrap:wrap;min-width:0}
.dt-sticky-bar__items strong{font-weight:700}
.dt-sticky-bar__btn{min-height:44px;padding:0 12px;border:1px solid rgba(255,255,255,.35);border-radius:var(--dt-r);background:transparent;color:inherit;font-size:var(--dt-fs-1);white-space:nowrap}
@media(min-width:768px){.dt-sticky-bar{display:none}}

/* Toast */
.dt-toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);z-index:50;padding:10px 16px;border-radius:var(--dt-r);background:var(--dt-text);color:var(--dt-text-invert);font-family:var(--dt-font-sans);font-size:var(--dt-fs-2);opacity:0;pointer-events:none;transition:opacity .15s,transform .15s;box-shadow:var(--dt-sh-2)}
.dt-toast.is-visible{opacity:1;transform:translate(-50%,0)}

/* Lưới công cụ, hub, danh sách (shortcode list) */
.dt-tool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--dt-sp-2);margin:var(--dt-sp-4) 0}
@media(min-width:600px){.dt-tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1024px){.dt-tool-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.dt-tool-grid--compact{grid-template-columns:repeat(2,minmax(0,1fr))!important;margin:var(--dt-sp-3) 0 0}
.dt-tool-grid__item{display:flex;align-items:center;min-height:var(--dt-control-h);padding:8px 12px;border:1px solid var(--dt-border);border-radius:var(--dt-r);background:var(--dt-surface);color:var(--dt-text);text-decoration:none;font-size:var(--dt-fs-2);font-weight:500;line-height:1.3}
.dt-tool-grid__item:hover{border-color:var(--dt-primary);color:var(--dt-primary-strong);background:var(--dt-primary-soft)}
.dt-hub-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--dt-sp-5);margin:var(--dt-sp-4) 0}
@media(min-width:768px){.dt-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1200px){.dt-hub-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.dt-hub-card{padding:var(--dt-sp-4);border:1px solid var(--dt-border);border-radius:var(--dt-r-lg);background:var(--dt-surface)}
.dt-hub-card__title{margin:0;font-size:var(--dt-fs-4)}
.dt-hub-card__title a{color:var(--dt-text);text-decoration:none}
.dt-hub-card__count{font-size:var(--dt-fs-1);color:var(--dt-text-3)}
.dt-list{padding-left:1.2em}
.dt-list li+li{margin-top:6px}
.dt-glossary__letters{display:flex;flex-wrap:wrap;gap:4px;margin:12px 0}
.dt-glossary__letters a{display:inline-flex;align-items:center;justify-content:center;min-width:32px;min-height:32px;border:1px solid var(--dt-border);border-radius:var(--dt-r-sm);text-decoration:none;font-size:var(--dt-fs-2)}
.dt-glossary__letter{margin:var(--dt-sp-5) 0 var(--dt-sp-2);font-size:var(--dt-fs-4);color:var(--dt-text-2)}
.dt-list--thuat-ngu{list-style:none;padding:0;columns:1;column-gap:24px}
@media(min-width:768px){.dt-list--thuat-ngu{columns:2}}
.dt-list--thuat-ngu li[hidden]{display:none}
.dt-so{font-variant-numeric:tabular-nums}
.dt-so--missing{color:var(--dt-err);border-bottom:1px dotted var(--dt-err)}
.dt-box-embed{padding:var(--dt-sp-4);border:1px solid var(--dt-border);border-radius:var(--dt-r);background:var(--dt-surface);margin:0 0 var(--dt-sp-4)}
.dt-box-embed h3{margin:0 0 6px;font-size:var(--dt-fs-4)}
.dt-embed-body .dt-tool{margin:0}

/* Giảm chuyển động */
@media(prefers-reduced-motion:reduce){.dt-tool *,.dt-sticky-bar,.dt-toast{transition:none!important;animation:none!important}}

/* ---------- Nhóm 1: mục tiêu, cảnh báo, xem trước ---------- */
.dt-target__row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--dt-sp-2) var(--dt-sp-3)}
.dt-target__row .dt-field{flex:0 0 auto;width:auto}
.dt-target__row .dt-field .dt-input{width:110px}
.dt-target__row .dt-field input[type=search]{width:200px;text-align:left}
.dt-target__row .dt-chips{flex:1 1 260px}
.dt-limit--target .dt-limit__fill{background:var(--dt-primary)}
.dt-limit--target .dt-limit__label strong,.dt-target__pct{font-weight:600;color:var(--dt-primary)}
.dt-target.is-done .dt-limit__fill,.dt-limit--target.is-done .dt-limit__fill{background:var(--dt-ok)}
.dt-target.is-done .dt-target__pct,.dt-limit--target.is-done .dt-limit__label strong{color:var(--dt-ok)}
.dt-target__remain{color:var(--dt-text-2)}
.dt-limit[hidden],.dt-tool [hidden]{display:none!important}
.dt-tool__top{padding:0 var(--dt-sp-4) var(--dt-sp-4)}
.dt-table tr.dt-row-warn td{background:var(--dt-warn-soft)!important}
mark.dt-over{background:var(--dt-err-soft);color:var(--dt-err);border-bottom:2px solid var(--dt-err);padding:0}
.dt-ws{color:var(--dt-text-3)}
mark.dt-ws{color:inherit;border-radius:2px;padding:0 1px}
mark.dt-ws--thua{background:var(--dt-err-soft);color:var(--dt-err)}
mark.dt-ws--la{background:var(--dt-warn-soft);color:var(--dt-warn);font-weight:600}
mark.dt-hidden-char{background:var(--dt-err-soft);color:var(--dt-err);border-radius:3px;padding:0 3px;font-size:.78em;font-family:var(--dt-font-mono)}
.dt-emoji{font-size:1.4em;line-height:1}
.dt-preview--words{font-family:var(--dt-font-sans);font-size:var(--dt-fs-3);line-height:2}
.dt-word--ghep{text-decoration:none;background:var(--dt-primary-soft);border-bottom:2px solid var(--dt-primary);border-radius:3px;padding:1px 3px}
.dt-tool .dt-tool__input--editor{min-height:clamp(320px,55vh,640px);font-size:17px;line-height:1.7}
.dt-box-source .dt-btn{margin-left:8px;vertical-align:middle}
@media(pointer:coarse){.dt-btn--sm,.dt-chip{min-height:44px}}
@media(max-width:480px){.dt-target__row .dt-field{width:100%}.dt-target__row .dt-field .dt-input,.dt-target__row .dt-field input[type=search]{width:100%}.dt-result__num{font-size:clamp(24px,7vw,32px)}}
.dt-target__row .dt-field--grow{flex:1 1 220px;min-width:0}
.dt-target__row .dt-field--grow .dt-select{width:100%}
@media(max-width:767px){.dt-results--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.dt-table--nowrap1 td:first-child,.dt-table--nowrap1 th:first-child{white-space:nowrap}

/* ---------- Nhóm 2: đọc file ---------- */
.dt-tool__filenote{flex-basis:100%;font-size:var(--dt-fs-1);color:var(--dt-text-3);line-height:1.4}
.dt-dropzone{padding:var(--dt-sp-4)}
.dt-dropzone .dt-drop{margin:0}
.dt-drop__title{font-weight:600;color:var(--dt-text)}
.dt-drop__link{color:var(--dt-primary);text-decoration:underline;text-underline-offset:3px}
.dt-drop-state{display:grid;gap:var(--dt-sp-3);padding:var(--dt-sp-4);border-radius:var(--dt-r);border:1px solid var(--dt-border)}
.dt-drop-state[hidden]{display:none!important}
.dt-drop-state--busy{background:var(--dt-bg)}
.dt-drop-state--busy .dt-limit__fill{background:var(--dt-primary)}
.dt-drop-state--done{background:var(--dt-ok-soft);border-color:#B9E0C6}
.dt-drop-state--err{background:var(--dt-err-soft);border-color:#F1B9B3;color:var(--dt-text)}
.dt-drop-state--err strong{color:var(--dt-err)}
.dt-drop-state__row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;font-size:var(--dt-fs-2)}
.dt-drop__file{font-weight:600;overflow-wrap:anywhere}
.dt-drop__ok{color:var(--dt-ok);font-weight:600}
.dt-drop-state__actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--dt-sp-2) var(--dt-sp-3)}
.dt-drop-state__msg{font-size:var(--dt-fs-2);line-height:1.55}
.dt-drop-state__msg strong{display:block;margin-bottom:2px}
.dt-drop-state button{justify-self:start}
.dt-tool__opts{display:flex;flex-wrap:wrap;gap:var(--dt-sp-2) var(--dt-sp-5);align-items:center}
.dt-tool__opts .dt-field{width:auto}
.dt-cue-warn{color:var(--dt-err);font-weight:600}
.dt-kv{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:var(--dt-fs-2)}
.dt-kv dt{color:var(--dt-text-2)}.dt-kv dd{margin:0;font-weight:600}
.dt-details{border:1px solid var(--dt-border);border-radius:var(--dt-r);background:var(--dt-surface);padding:0 var(--dt-sp-4)}
.dt-details>summary{cursor:pointer;min-height:var(--dt-control-h);display:flex;align-items:center;font-weight:600;font-size:var(--dt-fs-2);color:var(--dt-text-2)}
.dt-details[open]{padding-bottom:var(--dt-sp-4)}
.dt-details[open]>summary{margin-bottom:var(--dt-sp-2)}
.dt-details>div{margin-top:var(--dt-sp-2)}
.dt-table tr.dt-row-muted td{color:var(--dt-text-3)}

/* ---------- Nhóm 3: quy đổi & thời gian ---------- */
.dt-nhap-so-chu{display:grid;gap:var(--dt-sp-2)}
.dt-nhap-so-chu .dt-field--so-chu{max-width:280px}
.dt-dong-ho{min-width:96px;font-size:var(--dt-fs-num)}
.dt-doc-mau__tieu-de{font-size:var(--dt-fs-4)!important;color:var(--dt-text)!important}
.dt-doc-mau{font-size:18px;line-height:1.75;max-width:680px}
.dt-doc-mau p{margin:0 0 var(--dt-sp-3)!important}
.dt-cau-hoi__muc{border:1px solid var(--dt-border);border-radius:var(--dt-r);padding:var(--dt-sp-3) var(--dt-sp-4);margin:0}
.dt-cau-hoi__muc legend{font-weight:600;padding:0 4px}
.dt-cau-hoi__muc .dt-field__check{display:flex}
.dt-result__num--xl+.dt-result__label+.dt-result__sub{white-space:normal}
.dt-btn--wrap{white-space:normal;text-align:left;padding-block:8px}
.dt-tool__cau{margin:0;padding:0 var(--dt-sp-4) var(--dt-sp-4);font-size:var(--dt-fs-2);color:var(--dt-text-2);line-height:1.55}
.dt-tool__cau strong{color:var(--dt-text);font-weight:600}
.dt-tool__section .dt-tool__cau{padding:0}
.dt-result__num.dt-result__num--text{font-size:var(--dt-fs-4);line-height:1.25;letter-spacing:0}

/* ---------- Nhóm 4: giới hạn nền tảng ---------- */
.dt-o-list{display:grid;gap:var(--dt-sp-4)}
.dt-o-gioi-han{display:grid;gap:6px;min-width:0}
.dt-o-gioi-han__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 12px}
.dt-o-gioi-han__so{font-size:var(--dt-fs-1);color:var(--dt-text-2);font-variant-numeric:tabular-nums}
.dt-o-gioi-han__so strong{color:var(--dt-text)}
.dt-o-gioi-han__vach{display:flex;flex-wrap:wrap;gap:4px}
.dt-o-gioi-han__vach:empty{display:none}
.dt-o-gioi-han[data-trang-thai=err] .dt-field__control,.dt-o-gioi-han[data-trang-thai=err] textarea{border-color:var(--dt-err);background:var(--dt-err-soft)}
.dt-o-gioi-han[data-trang-thai=err] .dt-o-gioi-han__so{color:var(--dt-err);font-weight:600}
.dt-o-gioi-han[data-trang-thai=warn] .dt-o-gioi-han__so{color:var(--dt-warn)}
.dt-o-gioi-han[data-trang-thai=ok] .dt-o-gioi-han__so{color:var(--dt-ok)}
.dt-limit.dt-limit--nho{padding:0;gap:0}
.dt-limit--nho .dt-limit__label{display:none}
.dt-limit--nho .dt-limit__track{height:6px}
.dt-limit--nho .dt-limit__tick::after{display:none}
.dt-o-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--dt-sp-3)}
@media(min-width:768px){.dt-o-grid--headline,.dt-o-grid--path{grid-template-columns:repeat(2,minmax(0,1fr))}}
.dt-tool__section h3 .dt-nguon{font-weight:400;font-size:var(--dt-fs-1);margin-left:6px}
.dt-vach-list{margin:0;padding-left:1.2em;font-size:var(--dt-fs-2);display:grid;gap:4px}
.dt-tag--vuot{background:var(--dt-err-soft);color:var(--dt-err);text-decoration:line-through}
.dt-serp{max-width:600px;padding:var(--dt-sp-3) var(--dt-sp-4);border:1px solid var(--dt-border);border-radius:var(--dt-r);background:#fff;font-family:Arial,sans-serif;overflow-wrap:anywhere}
.dt-serp__url{font-size:12px;color:#4d5156;line-height:1.4}
.dt-serp__title{font-size:20px;line-height:1.3;color:#1a0dab;margin:2px 0}
.dt-serp__desc{font-size:14px;line-height:1.58;color:#4d5156}
.dt-serp--mobile{max-width:360px}
.dt-serp--mobile .dt-serp__title{font-size:18px}
.dt-serp--ad .dt-serp__url strong{color:#202124}
.dt-ad-fb{max-width:420px;border:1px solid var(--dt-border);border-radius:var(--dt-r);background:#fff;overflow:hidden;font-size:var(--dt-fs-2)}
.dt-ad-fb__primary{padding:var(--dt-sp-3);white-space:pre-wrap;overflow-wrap:anywhere}
.dt-ad-fb__img{aspect-ratio:1/1;max-height:220px;width:100%;background:var(--dt-surface-2);display:grid;place-items:center;color:var(--dt-text-3)}
.dt-ad-fb__foot{display:flex;justify-content:space-between;align-items:center;gap:var(--dt-sp-2);padding:var(--dt-sp-2) var(--dt-sp-3);background:var(--dt-bg)}
.dt-ad-fb__head{font-weight:600}
.dt-inbox{padding:var(--dt-sp-3);border:1px solid var(--dt-border);border-radius:var(--dt-r);background:#fff;font-size:var(--dt-fs-2);overflow:hidden}
.dt-inbox--gmail{display:flex;gap:var(--dt-sp-3);white-space:nowrap}
.dt-inbox--gmail .dt-inbox__line{overflow:hidden;text-overflow:ellipsis}
.dt-inbox__from{font-weight:600;min-width:90px}
.dt-inbox--iphone{max-width:360px;display:grid;gap:2px}
.dt-ad-fb__foot>div{min-width:0;overflow-wrap:anywhere}.dt-ad-fb__foot .dt-btn{flex:none}

/* ---------- Nhóm 5: phân tích văn bản & SEO ---------- */
.dt-mark{padding:1px 3px;border-radius:3px;color:inherit}
.dt-mark--trong{background:transparent;padding:0}
.dt-mark--warn{background:var(--dt-warn-soft,var(--dt-hl-2))}
.dt-mark--err{background:var(--dt-err-soft);box-shadow:inset 0 -2px 0 var(--dt-err)}
.dt-cue-err{color:var(--dt-err)}
.dt-preview--words mark{line-height:1.6}
.dt-cloud{border:1px solid var(--dt-border);border-radius:var(--dt-r);background:var(--dt-surface);padding:var(--dt-sp-3)}
.dt-cloud svg{display:block;width:100%;height:auto}
.dt-diff-view{white-space:pre-wrap;overflow-wrap:anywhere}
.dt-diff-view ins,.dt-tool__meta ins{text-decoration:none;border-radius:3px;padding:0 2px}
.dt-diff-view del,.dt-tool__meta del{border-radius:3px;padding:0 2px}
.dt-split__title{margin:0 0 6px;font-size:var(--dt-fs-2);font-weight:600;color:var(--dt-text-2)}
.dt-heading-row{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:6px;min-width:0;overflow-wrap:anywhere}
.dt-heading-row--3{padding-left:1em}.dt-heading-row--4{padding-left:2em}.dt-heading-row--5,.dt-heading-row--6{padding-left:3em}
.dt-row-cap-3 td:first-child{padding-left:1.5em}.dt-row-cap-4 td:first-child{padding-left:2.5em}
.dt-cong-thuc{font-size:var(--dt-fs-2);line-height:1.6}
.dt-target__row .dt-field--auto .dt-input{width:auto;max-width:100%}

/* ---------- Nhóm 6: xử lý văn bản ---------- */
.dt-ket-qua{display:grid;gap:6px;min-width:0;padding:var(--dt-sp-3) var(--dt-sp-4) var(--dt-sp-4)}
.dt-ket-qua__head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:var(--dt-fs-2)}
.dt-ket-qua__nhan{font-weight:600;color:var(--dt-text-2)}
.dt-ket-qua__dem{color:var(--dt-text-3);font-variant-numeric:tabular-nums}
.dt-tool .dt-ket-qua__ta{background:var(--dt-bg)}
.dt-ket-qua__bar{display:flex;flex-wrap:wrap;gap:8px}
.dt-split>*{min-width:0}
.dt-opts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:4px var(--dt-sp-3)}
.dt-cap-list{display:grid;gap:var(--dt-sp-2);margin-bottom:var(--dt-sp-2)}
.dt-cap{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr) auto auto;align-items:end;gap:var(--dt-sp-2)}
.dt-cap__mau{width:10px;height:var(--dt-control-h);border-radius:3px}
.dt-cap__dem{min-width:4.5em;padding-bottom:12px;font-size:var(--dt-fs-2);color:var(--dt-text-2);font-variant-numeric:tabular-nums}
@media(max-width:600px){.dt-cap{grid-template-columns:auto minmax(0,1fr) auto}.dt-cap .dt-field{grid-column:2/3}.dt-cap__mau{grid-row:1/3}.dt-cap__dem{grid-column:3;grid-row:1}.dt-cap .dt-btn{grid-column:3;grid-row:2}}
.dt-phan-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--dt-sp-3)}
.dt-phan{border:1px solid var(--dt-border);border-radius:var(--dt-r);background:var(--dt-surface);overflow:hidden}
.dt-phan__head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:8px 12px;background:var(--dt-bg);border-bottom:1px solid var(--dt-border);font-size:var(--dt-fs-2)}
.dt-phan__head .dt-btn{margin-left:auto}
.dt-phan__text{padding:10px 12px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6}
.dt-kieu-list{display:grid;gap:var(--dt-sp-3)}
@media(min-width:768px){.dt-kieu-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
.dt-kieu{border:1px solid var(--dt-border);border-radius:var(--dt-r);background:var(--dt-surface);min-width:0}
.dt-kieu__head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:8px 12px;border-bottom:1px solid var(--dt-border);font-size:var(--dt-fs-2)}
.dt-kieu__head .dt-btn{margin-left:auto}
.dt-kieu__text{padding:10px 12px;min-height:2.6em;font-size:var(--dt-fs-4);white-space:pre-wrap;overflow-wrap:anywhere}
.dt-doc-so{margin-top:var(--dt-sp-3);padding:var(--dt-sp-4);border-radius:var(--dt-r);background:var(--dt-primary-soft);color:var(--dt-result);font-size:var(--dt-fs-5);font-weight:600;line-height:1.4;overflow-wrap:anywhere;min-height:3em}
.dt-doc-so:empty{background:var(--dt-bg)}
.dt-doc-so.is-err{background:var(--dt-err-soft);color:var(--dt-err)}
.dt-table-box{min-width:0}

/* ---------- Phase 3: trang chủ, hub ---------- */
.dt-hub-card__all{display:inline-flex;margin-top:var(--dt-sp-2);font-size:var(--dt-fs-2);font-weight:600;color:var(--dt-primary)}
.dt-list--cap-nhat{display:grid;gap:6px;padding-left:1.2em}
.dt-cap-nhat__all{font-size:var(--dt-fs-2)}
