/* Live-app additions on top of the mockup CSS (tool.css): loading state, AdSense box, raw data, about text. */
.loading{display:flex;flex-direction:column;gap:14px;margin-bottom:16px}
.loading__bar{display:flex;align-items:center;gap:10px;padding:16px 20px;border:1px solid #e3e8ef;border-radius:12px;background:#fff;font-weight:600;color:#14213a}
.spin{width:18px;height:18px;border-radius:50%;border:2.5px solid #d6e4f7;border-top-color:#0066cc;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spin{animation:none}}
.ad--gs{display:block;background:none;border:0;min-height:100px}
.ad--gs .ad__tag{display:block;margin-bottom:6px}
.ad--gs ins{min-height:90px}
#slot-top .ad,#slot-mid .ad{margin:0 0 16px}
.rawbox{white-space:pre-wrap;word-break:break-all;font:12.5px/1.6 ui-monospace,Consolas,monospace;background:#f6f8fb;border:1px solid #e3e8ef;border-radius:10px;padding:14px 16px;margin:0 0 16px;max-height:420px;overflow:auto}
.chk__body .svc a,.about a{color:#0066cc}
.about{margin-top:28px;padding-top:8px}
.about h2{font-size:1.15rem;margin:22px 0 8px}
.about p{color:#3d4a5f;line-height:1.7;margin:0;max-width:72ch}
[hidden]{display:none!important}
.side__in{position:sticky;top:16px;display:flex;flex-direction:column;gap:16px}
.side .ad--gs.ad--rect{min-height:250px}
.side .ad--gs.ad--rect ins{width:300px;max-width:100%;min-height:250px}
.rel__soon{display:flex;gap:12px;align-items:flex-start;padding:10px 0;color:#8a94a6}
.rel__soon .ico{flex:none;margin-top:2px}
.rel__soon small{display:block;font-size:12px;color:#9aa4b5}
.rel__soon .soon{font-style:normal;font-size:10.5px;font-weight:600;padding:1px 6px;border-radius:99px;background:#eef2f7;color:#6b778c;margin-left:4px}
.rel__all{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:13px;font-weight:600;color:#0066cc;text-decoration:none}
.rel__all .ico{width:14px;height:14px}
@media (max-width:991px){.side__in{position:static}}
/* spacing pass 01/11: results live inside #out, give it the same rhythm as .main */
#out,.loading{display:grid;gap:1rem}
#out:empty{display:none}
#slot-top:empty,#slot-mid:empty{display:none}
#slot-top .ad,#slot-mid .ad{margin:0}
.chk__head{padding:1.1rem 1.4rem .2rem}
.chk__sum{padding:0 1.4rem;margin:.35rem 0 1rem;line-height:1.6}
.chk__body{padding:0 1.4rem 1.25rem;display:grid;gap:.85rem}
.chk__body>*{margin:0}
.ad--gs .ad__tag{font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--bm-muted)}
/* guide block under results: one card, plain Q&A */
.about{margin-top:.5rem;padding:1.5rem 1.6rem;border:1px solid var(--bm-border);border-radius:var(--bm-radius);background:#fff}
.about h2{font-size:1.05rem;margin:0 0 .25rem}
.about__lead{color:var(--bm-muted);margin:0 0 1rem;font-size:.9375rem}
.about details{border-top:1px solid var(--bm-border-soft)}
.about summary{cursor:pointer;list-style:none;padding:.85rem 0;font-weight:600;display:flex;justify-content:space-between;gap:1rem}
.about summary::-webkit-details-marker{display:none}
.about summary::after{content:"+";color:var(--bm-blue);font-weight:700}
.about details[open] summary::after{content:"–"}
.about details p{margin:0 0 1rem;color:#3d4a5f;line-height:1.7;max-width:70ch}
#out1{display:grid;gap:1rem}
#out1:empty{display:none}
.loading__bar[hidden]+.ad{margin-top:0}
/* table view (DNS) */
.rtab{border:1px solid var(--bm-border);border-radius:var(--bm-radius);background:#fff;box-shadow:var(--bm-shadow);overflow:hidden}
.rtab .tbl{overflow-x:auto}
.rtab table{width:100%;border-collapse:collapse;font-size:.875rem}
.rtab th{text-align:left;font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--bm-muted);font-weight:600;padding:.8rem 1.25rem;background:#f8fafc;border-bottom:1px solid var(--bm-border)}
.rtab td{padding:.65rem 1.25rem;border-top:1px solid var(--bm-border-soft);vertical-align:top}
.rtab tr.grp1 td{border-top-color:var(--bm-border)}
.rtab tbody tr:first-child td{border-top:0}
.rtab .val{word-break:break-all;color:var(--bm-heading)}
.rtab .num{text-align:right;white-space:nowrap;color:var(--bm-muted);font-variant-numeric:tabular-nums;width:1%}
.rt{display:inline-block;min-width:3.2rem;font-weight:700;font-size:.8125rem;color:var(--bm-blue)}
.rt--off{min-width:0;font-weight:600;color:var(--bm-muted);background:#f1f4f8;border-radius:6px;padding:1px 8px;margin-right:4px}
.rtab__empty{margin:0;padding:.8rem 1.25rem;border-top:1px solid var(--bm-border);font-size:.8125rem;color:var(--bm-muted);background:#fbfcfe}
.counts.dim{font-size:.8125rem;color:var(--bm-muted);font-weight:500}
/* AdSense: collapse a slot Google could not fill instead of leaving a blank hole */
.ad--gs:has(ins[data-ad-status="unfilled"]){display:none}
.ad--gs ins[data-ad-status="unfilled"]{display:none!important}
.ad--gs{min-height:0}
.ad--gs ins{min-height:0}
/* 01/11 anh: bỏ vạch màu trái, đầu mục có icon; trạng thái chỉ còn ở pill + màu icon */
.chk{border-left-width:1px}
.chk--ok,.chk--warn,.chk--err{border-left-color:var(--bm-border)}
.chk__head{display:flex;align-items:center;gap:.75rem}
.chk__ico{flex:none;display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:10px;background:var(--bm-blue-50);color:var(--bm-blue)}
.chk__ico .ico{width:1.15rem;height:1.15rem}
.chk--warn .chk__ico{background:#fff4e5;color:#c2410c}
.chk--err .chk__ico{background:#fdecec;color:#c62828}
.chk__head .pill{margin-left:auto}
.chk__sum{padding-left:calc(1.4rem + 2.25rem + .75rem)}
.chk__body{padding-left:calc(1.4rem + 2.25rem + .75rem)}
@media (max-width:600px){.chk__sum,.chk__body{padding-left:1rem}.chk__head{padding-inline:1rem}}
/* 01/11 anh: icon lớn, không box, không viền */
.chk__ico{width:auto;height:auto;background:none!important;border-radius:0}
.chk__ico .ico{width:1.75rem;height:1.75rem;stroke-width:1.6}
.chk__sum,.chk__body{padding-left:calc(1.4rem + 1.75rem + .75rem)}
@media (max-width:600px){.chk__sum,.chk__body{padding-left:1rem}}
.chips{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.chips__lab{display:inline-flex;align-items:center;gap:.35rem;font-size:.8125rem;font-weight:600;color:#15803d;margin-right:.35rem}
.chips__lab .ico{width:1rem;height:1rem}
.chip{font-size:.75rem;padding:.2rem .55rem;border-radius:99px;background:#f1f5f9;color:#475569}
@media (max-width:600px){
 .sum__acts{display:flex;gap:.5rem;width:100%}
 .sum__acts .btn{flex:1;justify-content:center;padding:.55rem .7rem;font-size:.8125rem;white-space:nowrap}
}
.ask{display:flex;gap:.5rem;max-width:26rem}
.ask input{flex:1;min-width:0;padding:.55rem .8rem;border:1px solid var(--bm-border);border-radius:10px;font:inherit;font-size:.875rem}
.ask input:focus{outline:2px solid var(--bm-blue-50);border-color:var(--bm-blue)}
.askf{display:flex;gap:.5rem;max-width:28rem}
.askf input{flex:1;min-width:0;padding:.55rem .85rem;border:1px solid var(--bm-border);border-radius:10px;font:inherit;font-size:.875rem;background:#fff}
.askf input:focus{outline:2px solid var(--bm-blue-50);border-color:var(--bm-blue)}
.pill--info{background:#eef4fb;color:#1e5aa8}
.pill--info .ico{color:#1e5aa8}
.chk--info{border-left-color:var(--bm-border)}
.chk--info .chk__ico{color:#1e5aa8}
.chk__head{flex-wrap:nowrap}
.chk__name{min-width:0;flex:1 1 auto}
.chk__head .pill{flex:none}
@media (max-width:600px){.chk__name small{display:block;margin:2px 0 0}}
.askf select{flex:1;min-width:0;padding:.55rem .7rem;border:1px solid var(--bm-border);border-radius:10px;font:inherit;font-size:.875rem;background:#fff}
.rtab--in{box-shadow:none}
.rtab--in td{font-size:.8125rem;padding:.5rem .9rem;white-space:nowrap}
.rtab--in th{padding:.6rem .9rem}
.rtab--in .tbl{max-height:460px;overflow:auto}
.txtf{display:grid;gap:.75rem;padding:1.1rem 1.25rem;border:1px solid var(--bm-border);border-radius:var(--bm-radius);background:#fff;box-shadow:var(--bm-shadow)}
.txtf textarea{width:100%;font:12.5px/1.55 ui-monospace,Consolas,monospace;padding:.8rem .9rem;border:1px solid var(--bm-border);border-radius:10px;resize:vertical;min-height:180px}
.txtf .btn{justify-self:start}
/* 01/11 anh: kết quả trải ra, không thanh cuộn */
.rtab .tbl,.rtab--in .tbl{max-height:none;overflow:visible}
.rtab--in td{white-space:normal;word-break:break-word}
.rtab--in td.dim{white-space:nowrap}
.rtab tr.grp1 .rt{visibility:visible}
.rtab tr:not(.grp1) .rt{visibility:hidden}
@media (max-width:700px){
 .rtab table,.rtab tbody,.rtab tr,.rtab td{display:block;width:100%}
 .rtab thead{display:none}
 .rtab tr{padding:.65rem 1rem;border-top:1px solid var(--bm-border-soft)}
 .rtab tbody tr:first-child{border-top:0}
 .rtab td{display:flex;gap:.75rem;padding:.15rem 0;border:0;text-align:left;width:auto;white-space:normal}
 .rtab td::before{content:attr(data-l);flex:0 0 6.5rem;color:var(--bm-muted);font-family:var(--bm-font-body);font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;padding-top:.1rem}
 .rtab td:empty{display:none}
 .rtab .num{text-align:left}
 .rtab tr:not(.grp1) .rt{visibility:visible}
}
.mk{font-weight:700;text-align:center;color:var(--bm-muted)}
.mk--ok{color:#15803d}.mk--bad{color:#c62828}
@media (max-width:700px){
 .rtab--compact tr{display:grid;grid-template-columns:1fr auto;column-gap:.75rem;row-gap:.1rem;align-items:start}
 .rtab--compact td{padding:0}
 .rtab--compact td::before{display:none}
 .rtab--compact td:nth-child(1){grid-column:1;font-weight:600;color:var(--bm-heading);font-family:var(--bm-font-body)}
 .rtab--compact td:nth-child(2){grid-column:1;grid-row:2;font-size:.75rem;color:var(--bm-muted);font-family:var(--bm-font-body)}
 .rtab--compact td:nth-child(3){grid-column:1/3;grid-row:3;margin-top:.25rem}
 .rtab--compact td:nth-child(4){display:none}
 .rtab--compact td:nth-child(5){grid-column:2;grid-row:1/3;align-self:center;font-size:1.1rem}
}