/* 09/10/2026: chữ dài (mã, link, tin SMS) tự xuống dòng, không đẩy trang tràn ngang */
body{overflow-wrap:break-word}
:root{--bg:#f1f5f9;--card:#fff;--text:#0f172a;--muted:#64748b;--line:#e2e8f0;--brand:#0f766e;
 --ok:#16a34a;--warn:#f59e0b;--bad:#dc2626;--off:#6b7280;--info:#2563eb;--purple:#7c3aed}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--brand)}
.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:14px;padding:8px 14px;background:var(--brand);color:#fff;
 padding-top:calc(8px + env(safe-area-inset-top))}
.topbar .brand{color:#fff;text-decoration:none;font-weight:700;white-space:nowrap}
.topbar nav{display:flex;gap:4px;flex:1}
.topbar nav a{color:#d1fae5;text-decoration:none;padding:6px 10px;border-radius:8px}
.topbar nav a.on,.topbar nav a:hover{background:rgba(255,255,255,.18);color:#fff}
.topbar .who{font-size:13px;white-space:nowrap}.topbar .who a{color:#fff;margin-left:8px}
.page{max-width:1280px;margin:0 auto;padding:14px 16px 40px}
h1{font-size:22px;margin:6px 0 12px}h3{margin:0 0 10px;font-size:16px}
.muted{color:var(--muted)}.small{font-size:13px}.center{text-align:center}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:14px}
.btn{display:inline-block;border:1px solid var(--line);background:#fff;color:var(--text);padding:8px 14px;border-radius:10px;cursor:pointer;text-decoration:none;font-size:14px}
.btn.primary{background:var(--brand);color:#fff;border-color:var(--brand)}.btn.small{padding:5px 10px;font-size:13px}.btn.wide{width:100%;margin-top:10px}
.btn:hover{filter:brightness(.97)}
input,select{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--text)}
.search{width:100%;max-width:360px}
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:12px}
.chips{display:flex;flex-wrap:wrap;gap:6px;flex:1}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:4px 10px;font-size:13px;cursor:pointer;display:inline-flex;gap:6px;align-items:center}
.chip.on{outline:2px solid var(--brand)}.chip .dot{width:9px;height:9px;border-radius:50%}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.tile{position:relative;display:block;text-decoration:none;color:inherit;background:var(--card);border:1px solid var(--line);border-left:6px solid var(--ok);border-radius:14px;padding:12px 12px 10px;min-height:118px}
.tile:hover{box-shadow:0 4px 14px rgba(0,0,0,.08)}
.tile .top{display:flex;justify-content:space-between;align-items:flex-start;gap:6px;margin-bottom:6px}
.tile .name{font-weight:600;line-height:1.25;flex:1;min-width:0;overflow-wrap:anywhere}
.tile .top .badge{flex-shrink:0}
.tile .val{font-size:30px;font-weight:700;letter-spacing:-.5px}.tile .val small{font-size:14px;font-weight:500;color:var(--muted);margin-left:4px}
.tile .sub{font-size:12.5px;color:var(--muted);display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.badge{display:inline-block;font-size:12px;padding:2px 8px;border-radius:999px;color:#fff;background:var(--ok);white-space:nowrap}
.st-normal{--c:var(--ok)}.st-alert{--c:var(--bad)}.st-out_of_range{--c:var(--warn)}.st-sensor_error{--c:var(--purple)}
.st-offline{--c:var(--off)}.st-inactive{--c:#cbd5e1}.st-power_lost{--c:var(--info)}.st-no_data{--c:#94a3b8}
.badge[class*=st-]{background:var(--c)}.tile[class*=st-]{border-left-color:var(--c)}.dot[class*=st-]{background:var(--c)}
.tile.st-alert{animation:blink 1.6s ease-in-out infinite}
@keyframes blink{50%{box-shadow:0 0 0 4px rgba(220,38,38,.18)}}
.flag{font-size:12px;color:var(--bad)}
.head-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}.head-row h1{margin:0;flex:1 1 auto;font-size:20px}.back{text-decoration:none}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-bottom:12px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px}.kpi .k{font-size:12px;color:var(--muted)}.kpi .v{font-size:20px;font-weight:700}
.range-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:8px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.seg button{border:0;background:#fff;padding:7px 12px;cursor:pointer;font:inherit}.seg button.on{background:var(--brand);color:#fff}
.custom-range{display:flex;flex-wrap:wrap;gap:6px;align-items:center;max-width:100%}.custom-range input{padding:6px;min-width:0;flex:1 1 130px}
.chart{width:100%;min-height:320px}
.events .ev{display:grid;grid-template-columns:150px 1fr auto;gap:10px;padding:9px 0;border-top:1px solid var(--line);align-items:start}
.events .ev:first-child{border-top:0}.events .ev .t{color:var(--muted);font-size:13px}.events .ev .m{white-space:pre-line;font-size:14px;min-width:0;overflow-wrap:anywhere}
.events .ev .m b{display:block}.events .ack{font-size:12.5px;color:var(--ok)}
.ev-tag{display:inline-block;font-size:11.5px;padding:1px 7px;border-radius:999px;background:#e2e8f0;margin-right:6px}
.ev-SENSOR_ALERT,.ev-SENSOR_ALERT_REPEAT,.ev-SENSOR_ERROR,.ev-SIM_SEND_FAIL{background:#fee2e2;color:#991b1b}
.ev-POWER_LOST,.ev-OFFLINE{background:#dbeafe;color:#1e3a8a}.ev-SENSOR_CLEARED,.ev-ONLINE,.ev-POWER_RECOVER{background:#dcfce7;color:#14532d}
.tablewrap{overflow:auto}.tbl{width:100%;border-collapse:collapse;font-size:13.5px}.tbl th,.tbl td{padding:7px 8px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
.tbl th{background:#f8fafc;position:sticky;top:0}.tbl tr.dim{opacity:.5}
.login-box{max-width:380px;margin:8vh auto;background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px}
.login-box h1{font-size:22px;margin:0 0 4px}.login-box label{display:block;margin:12px 0 0;font-size:13px;color:var(--muted)}.login-box input{width:100%;margin-top:4px}
.login-box .btn{margin-top:16px}
.alert{background:#fee2e2;color:#991b1b;padding:8px 10px;border-radius:10px;margin-top:10px}
.inline{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#0f172a;color:#fff;padding:10px 16px;border-radius:12px;z-index:50}
@media (max-width:640px){.tile .top{flex-direction:column;gap:4px}.topbar{gap:8px;padding:8px 10px}.topbar .brand span{display:none}.topbar .who span{display:none}
 .page{padding:10px 12px 30px}.grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.tile .val{font-size:26px}
 .events .ev{grid-template-columns:1fr;gap:4px}}
@media (prefers-color-scheme:dark){:root{--bg:#0b1220;--card:#111a2e;--text:#e5e7eb;--muted:#94a3b8;--line:#1f2a44}
 .seg button,.btn,input,select,.chip{background:#0f172a;color:var(--text)}.tbl th{background:#0f172a}.ev-tag{background:#1f2a44;color:#cbd5e1}}

.dlg{border:1px solid var(--line);border-radius:16px;padding:18px;max-width:640px;width:calc(100% - 24px);background:var(--card);color:var(--text)}
.dlg::backdrop{background:rgba(0,0,0,.4)}.dlg h3{margin-top:0}.dlg h4{margin:14px 0 6px;font-size:14px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form-grid label{display:block;font-size:13px;color:var(--muted)}
.form-grid input:not([type=checkbox]),.form-grid select{width:100%;margin-top:4px;color:var(--text)}.form-grid label.inline{align-self:end;color:var(--text)}
.pick{max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:6px;display:grid;grid-template-columns:1fr 1fr;gap:2px}
.pick label{display:flex;gap:6px;align-items:center;padding:4px 6px;border-radius:6px;font-size:13.5px}.pick label:hover{background:var(--bg)}.pick label span{flex:1}
.pick-tools{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}.pick-tools input{flex:1;min-width:140px}
.dlg-actions{display:flex;gap:8px;margin-top:14px;align-items:center}.btn.danger{color:var(--bad);border-color:#fca5a5}
.lbl{display:block;margin:10px 0 0;font-size:13px;color:var(--muted)}.lbl input{width:100%;margin-top:4px}
.who a{color:#fff;text-decoration:none}
@media (max-width:640px){.form-grid,.pick{grid-template-columns:1fr}}

.cmd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}.cmd-grid .btn{min-height:44px}
.log{background:#0f172a;color:#d1fae5;border-radius:10px;padding:10px;font:12.5px/1.4 ui-monospace,Menlo,Consolas,monospace;max-height:360px;overflow:auto;white-space:pre-wrap}
.sticky-actions{position:sticky;bottom:8px;display:flex;gap:12px;align-items:center;flex-wrap:wrap;box-shadow:0 -4px 16px rgba(0,0,0,.06)}
.fgrp{margin-bottom:12px}.fgrp h3{margin-bottom:6px}
.frow{display:grid;grid-template-columns:minmax(200px,1.2fr) minmax(160px,1fr);gap:10px;align-items:center;padding:7px 0;border-top:1px solid var(--line)}
.frow:first-of-type{border-top:0}.frow .lbl2{font-size:14px}.frow .lbl2 small{display:block;color:var(--muted);font-size:12px}
.frow input:not([type=checkbox]),.frow textarea{width:100%}.frow textarea{min-height:64px;font:inherit;padding:8px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--text)}
.frow.changed{background:#fef9c3}.ro-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px}.ro-grid div{font-size:13px;padding:6px 8px;background:var(--bg);border-radius:8px}
.ro-grid div b{display:block;font-size:12px;color:var(--muted);font-weight:500}
.nowrap{white-space:nowrap}
.rec{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}
.rec:first-child{border-top:0}.rec .ch{font-size:12px;padding:2px 8px;border-radius:999px;background:#e2e8f0}.rec.off{opacity:.5}
@media (max-width:640px){.frow{grid-template-columns:1fr}.rec{grid-template-columns:1fr}}
@media (prefers-color-scheme:dark){.frow textarea{background:#0f172a}.frow.changed{background:#3b2f0b}}

/* ===== 09/10/2026 giai đoạn 2: thanh menu dưới đáy (điện thoại), thẻ cài đặt, công tắc, nhóm lệnh ===== */
.tabbar{display:none}
@media (max-width:640px){
 .topbar nav{display:none}
 .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--card);border-top:1px solid var(--line);
  padding:4px 4px calc(4px + env(safe-area-inset-bottom));box-shadow:0 -2px 10px rgba(0,0,0,.06)}
 .tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:50px;
  font-size:11.5px;color:var(--muted);text-decoration:none;border-radius:10px}
 .tabbar a span{font-size:20px;line-height:1}
 .tabbar a.on{color:var(--brand);font-weight:600;background:rgba(15,118,110,.09)}
 body{padding-bottom:calc(66px + env(safe-area-inset-bottom))}
 .sticky-actions{bottom:calc(66px + env(safe-area-inset-bottom))}
 .toast{bottom:calc(76px + env(safe-area-inset-bottom))}
}
.ss-tabs{display:flex;gap:6px;overflow-x:auto;padding:2px 0 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ss-tabs::-webkit-scrollbar{display:none}
.ss-tabs button{flex:0 0 auto;border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:999px;
 padding:8px 13px;font:inherit;font-size:14px;cursor:pointer;min-height:40px}
.ss-tabs button.on{background:var(--brand);border-color:var(--brand);color:#fff}
.ss-tabs .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--warn);margin-left:6px;vertical-align:middle}
.st-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}
.st-grid div{background:var(--bg);border-radius:10px;padding:8px 10px;font-size:14px;min-width:0;overflow-wrap:anywhere}
.st-grid div b{display:block;font-size:12px;color:var(--muted);font-weight:500;margin-bottom:2px}
details.tech{margin-top:12px}details.tech summary{cursor:pointer;color:var(--info);font-size:14px;padding:4px 0}
details.tech .ro-grid{margin-top:8px}
.sw{display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:14px}
.sw input{appearance:none;-webkit-appearance:none;width:46px;height:28px;border-radius:999px;background:#cbd5e1;position:relative;
 margin:0;cursor:pointer;transition:background .15s;flex:0 0 auto}
.sw input::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;
 box-shadow:0 1px 3px rgba(0,0,0,.3);transition:left .15s}
.sw input:checked{background:var(--brand)}.sw input:checked::after{left:21px}
.cmd-group h4{margin:2px 0 8px;font-size:13px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.02em}
details.danger-zone{border:1px solid #fecaca}details.danger-zone>summary{cursor:pointer;font-weight:600;color:var(--bad);padding:2px 0}
details.danger-zone[open]>summary{margin-bottom:10px}
@media (prefers-color-scheme:dark){.sw input{background:#334155}details.danger-zone{border-color:#7f1d1d}}
.st-grid div.wide{grid-column:1/-1}
.head-row h1 .sub{display:block;font-size:12.5px;font-weight:500;color:var(--muted)}
@media (min-width:641px){.ss-tabs{flex-wrap:wrap}}
@media (max-width:640px){.ss-tabs{-webkit-mask-image:linear-gradient(to right,#000 88%,transparent);mask-image:linear-gradient(to right,#000 88%,transparent)}}
.sticky-actions.idle{display:none}
details.st-card>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:12px}
details.st-card>summary::-webkit-details-marker{display:none}
details.st-card>summary h3{margin:0;flex:0 0 auto}
details.st-card .st-prev{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
details.st-card>summary::after{content:"▾";margin-left:auto;color:var(--muted);flex:0 0 auto}
details.st-card[open]>summary::after{content:"▴"}
details.st-card[open]>summary{margin-bottom:10px}details.st-card[open] .st-prev{display:none}
/* Bảng quản trị trên điện thoại: mỗi dòng thành 1 mục gọn — tên + trạng thái, dòng thông số nhỏ, nút */
@media (max-width:640px){
 .tbl.cards thead{display:none}
 .tbl.cards,.tbl.cards tbody{display:block}
 .tbl.cards tr{display:flex;flex-wrap:wrap;align-items:center;gap:3px 10px;padding:10px 2px;border-bottom:1px solid var(--line)}
 .tbl.cards td{display:block;border:0;padding:0;font-size:13px;white-space:nowrap}
 .tbl.cards td:empty{display:none}
 .tbl.cards td[data-pre]::before{content:attr(data-pre) " ";color:var(--muted)}
 .tbl.cards td.c-name{order:-2;flex:1 1 55%;font-size:15px;font-weight:600;white-space:normal;min-width:0}
 .tbl.cards td.c-st{order:-1}
 .tbl.cards td.c-wide{white-space:normal;min-width:0;overflow-wrap:anywhere}
 .tbl.cards td.c-act{flex-basis:100%;display:flex;gap:8px;margin-top:4px}
}
.pw{position:relative}.pw input{width:100%;padding-right:46px}
.pw .eye{position:absolute;right:2px;top:2px;bottom:2px;width:42px;border:0;background:none;font-size:18px;cursor:pointer;color:var(--muted)}
[hidden]{display:none!important}

/* 09/10: ô không áp dụng ở chế độ hiện tại — mờ + lý do; ô của tính năng đang tắt thì ẩn hẳn (applyRules) */
.frow.dimmed>*:not(.why),[data-k].dimmed>*:not(.why){opacity:.45}
.frow>.why,[data-k]>.why{grid-column:1/-1;display:block;color:#a16207;font-size:12px;margin-top:-2px}
.fgrp .hid-note{margin:8px 0 0}

/* liên kết ESP-NOW trạm chính ↔ trạm con (09/10/2026) */
.espnow-card{padding:10px 14px}
.espnow-clients{display:flex;flex-wrap:wrap;gap:8px 16px;margin:6px 0}
.espnow-client{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.owners{opacity:.8}

/* bảng mọi đầu dò trên trang cài đặt (09/10) */
.stable-wrap{overflow-x:auto;margin:0 0 10px}
.stable{border-collapse:collapse;width:100%;font-size:.95em}
.stable th,.stable td{padding:6px 8px;border-bottom:1px solid var(--line,#e5e7eb);text-align:left;white-space:nowrap}
.stable tr.this td{background:var(--soft,#f3f4f6)}
.stable td.changed{outline:2px solid var(--accent,#2563eb);outline-offset:-2px}
.stable .tnum{width:5.5em}
.flag-badge{opacity:.9;font-weight:normal}

/* cảnh báo dày / sức khỏe máy (09/10) */
.warn-card{border-left:4px solid var(--bad,#dc2626)}
.sub.chronic{color:var(--bad,#dc2626)}
.st-grid > div.bad{background:#fee2e2;border-color:#fca5a5}
.espnow-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.idx-tag{font-size:.75em;padding:1px 6px;border-radius:8px;background:var(--line,#e5e7eb);color:var(--muted,#555);white-space:nowrap}
.route-card{margin:8px 0}.route-card summary{cursor:pointer}
.rt-tree,.rt-tree ul{list-style:none;margin:0;padding-left:18px;position:relative}
.rt-tree{padding-left:0;margin-top:6px}
.rt-tree ul li{position:relative;padding:3px 0 3px 14px}
.rt-tree ul li::before{content:"";position:absolute;left:0;top:0;bottom:0;border-left:2px solid var(--line,#cbd5e1)}
.rt-tree ul li:last-child::before{bottom:auto;height:14px}
.rt-tree ul li::after{content:"";position:absolute;left:0;top:14px;width:12px;border-top:2px solid var(--line,#cbd5e1)}
.rt-node{display:inline-block;padding:2px 8px;border:1px solid var(--line,#cbd5e1);border-radius:8px;background:var(--card,#fff);overflow-wrap:anywhere}
.rt-hub{font-weight:600}.rt-share{color:var(--muted);margin-top:1px}.rt-node.ghost{border-style:dashed;opacity:.8}
.missing-why{margin-top:6px}.missing-why ul{margin:4px 0 4px 18px;padding:0}.missing-why summary{cursor:pointer}
.btn.danger{border-color:var(--bad,#dc2626);color:var(--bad,#dc2626)}

/* (11/10) gộp theo hệ thống */
.sys-tile .sys-n{margin:6px 0 2px;font-size:15px}
.chip-mini{display:inline-block;font-size:12px;padding:1px 7px;border-radius:999px;background:var(--line);margin:2px 4px 0 0;white-space:nowrap}
.chip-mini.st-alert,.chip-mini.st-out_of_range{background:#fee2e2;color:#991b1b}
.chip-mini.st-offline,.chip-mini.st-sensor_error,.chip-mini.st-power_lost{background:#fef3c7;color:#92400e}
.chip-mini.st-normal{background:#dcfce7;color:#166534}
.sys-sum{margin:4px 0 12px}
.sys-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin-bottom:14px}
.sys-card{margin:0;border-left:5px solid var(--ok)}
.sys-card.st-alert,.sys-card.st-out_of_range{border-left-color:#dc2626}
.sys-card.st-offline,.sys-card.st-sensor_error,.sys-card.st-power_lost{border-left-color:#d97706}
.sys-head{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:4px}
.sys-head .btn{margin-left:auto}
.sys-row{display:flex;align-items:center;gap:8px;padding:8px 0;border-top:1px solid var(--line);text-decoration:none;color:inherit}
.sys-row:hover{background:rgba(15,118,110,.05)}
.sys-name{flex:1;min-width:0;overflow-wrap:anywhere}
.sys-val{font-weight:600;white-space:nowrap}
.sys-acts{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 2px}
.paused-note{background:#fef3c7;color:#92400e;border-radius:8px;padding:3px 8px;margin-top:4px}
.help-card summary{cursor:pointer}.help-list{margin:8px 0 0 18px;padding:0}.help-list li{margin:6px 0;line-height:1.45}
/* (11/10) sơ đồ kết nối dạng hình */
.net-diagram{margin:8px 0;overflow-x:auto;background:linear-gradient(180deg,rgba(15,118,110,.06),rgba(15,118,110,0));border-radius:12px;padding:6px}
.net-diagram svg{width:100%;min-width:520px;height:auto;display:block}
.net-t1{font:600 15px system-ui,sans-serif}.net-t2{font:13px system-ui,sans-serif}.net-elbl{font:600 12px system-ui,sans-serif}
.net-node{cursor:pointer}.net-node:hover rect{filter:brightness(.96);stroke-width:3.5}
.net-flow{stroke-dasharray:2 22;animation:netflow 1.6s linear infinite}
@keyframes netflow{to{stroke-dashoffset:-48}}
.net-legend{display:flex;flex-wrap:wrap;gap:6px 14px;color:var(--muted);margin-top:4px}
.net-legend span{display:inline-flex;align-items:center;gap:5px}
.lg-line{display:inline-block;width:26px;height:0;border-top:4px solid}.lg-line.q-good{border-color:#16a34a}.lg-line.q-ok{border-color:#d97706}
.lg-line.q-bad{border-color:#dc2626}.lg-line.q-relay{border-top:3px dashed #7c3aed}
.lg-box{display:inline-block;width:14px;height:14px;border-radius:4px;border:2px solid}.lg-box.st-normal{background:#dcfce7;border-color:#16a34a}
.lg-box.st-alert{background:#fee2e2;border-color:#dc2626}.lg-box.st-power_lost{background:#fef3c7;border-color:#d97706}.lg-box.st-offline{background:#e5e7eb;border-color:#6b7280}
@media (prefers-reduced-motion:reduce){.net-flow{animation:none}}
/* (11/10) sơ đồ: chữ số đo, ngưỡng bấm được, bảng chi tiết, phóng to toàn màn hình */
.net-big{font:700 22px system-ui,sans-serif}.net-t3{font:12px system-ui,sans-serif}.net-t2b{font:600 13px system-ui,sans-serif}
.net-thr{cursor:pointer}.net-thr:hover text{text-decoration:underline}
.net-node:focus{outline:none}.net-node:focus rect{stroke:#2563eb;stroke-width:4}
.net-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.net-bar .net-fs{margin-left:auto}
.lg-dot{display:inline-block;width:10px;height:10px;border-radius:50%}
.route-card{position:relative}
.net-panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;margin-top:8px;box-shadow:0 10px 30px rgba(15,23,42,.18);animation:npin .18s ease-out}
@keyframes npin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.np-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}.np-head .np-x{margin-left:auto}
.np-sensor{border:1px solid var(--line);border-left:5px solid #94a3b8;border-radius:10px;padding:8px 10px;margin:8px 0}
.np-sensor.np-ok{border-left-color:#16a34a}.np-sensor.np-near{border-left-color:#d97706;background:#fffbeb}.np-sensor.np-out{border-left-color:#dc2626;background:#fef2f2}
.np-row{display:flex;justify-content:space-between;gap:8px;align-items:center}
.np-val{font-size:24px;font-weight:700;margin:2px 0}
.np-near .np-hint{color:#b45309;font-weight:600}.np-out .np-hint{color:#b91c1c;font-weight:600}
.np-acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
@media (min-width:900px){.net-panel{position:absolute;right:10px;top:44px;width:340px;max-height:calc(100% - 54px);overflow:auto;z-index:3;margin:0}}
body.net-lock{overflow:hidden}
.route-card.net-full{position:fixed;inset:0;z-index:50;margin:0;border-radius:0;background:var(--card);padding:12px 14px calc(12px + env(safe-area-inset-bottom));overflow:auto;padding-top:calc(12px + env(safe-area-inset-top))}
.route-card.net-full .net-diagram{min-height:calc(100vh - 140px);min-height:calc(100dvh - 140px)}
.route-card.net-full .net-diagram svg{min-width:720px;max-height:calc(100dvh - 150px)}
.route-card.net-full .net-panel{position:fixed;right:14px;top:58px;width:360px;max-height:calc(100dvh - 72px);overflow:auto;z-index:51}
@media (max-width:640px){.route-card.net-full .net-panel{left:0;right:0;top:auto;bottom:0;width:auto;max-height:60dvh;border-radius:16px 16px 0 0}}

/* (11/10) ô được mở thẳng từ sơ đồ (?focus=) */
.flash{animation:flash 2.4s ease-out;border-radius:10px}
@keyframes flash{0%,40%{box-shadow:0 0 0 3px #f59e0b;background:#fffbeb}100%{box-shadow:0 0 0 0 transparent}}
@media (prefers-color-scheme:dark){.np-sensor.np-near{background:#3b2f0b}.np-sensor.np-out{background:#3f1515}.np-near .np-hint{color:#fbbf24}.np-out .np-hint{color:#fca5a5}
 .flash{animation-name:flashd}@keyframes flashd{0%,40%{box-shadow:0 0 0 3px #f59e0b;background:#3b2f0b}100%{box-shadow:none}}}

/* (12/10) Đường dẫn Hệ thống › Máy › Cảm biến + trang máy */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;font-size:13.5px;margin:2px 0 8px;color:var(--muted)}
.crumbs a{text-decoration:none;padding:2px 0}.crumbs a:hover{text-decoration:underline}.crumbs .cur{color:var(--text);font-weight:600}.crumbs .sep{opacity:.6}
.sib-strip{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 12px}
.sib{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--line);border-radius:999px;background:var(--card);text-decoration:none;color:var(--text);font-size:13px}
.sib .dot{width:9px;height:9px;border-radius:50%}.sib.on{outline:2px solid var(--brand);background:rgba(15,118,110,.08)}
.dev-acts{display:flex;flex-wrap:wrap;gap:8px;margin:-2px 0 12px}
.dev-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.dev-strip>div{background:var(--bg);border-radius:10px;padding:7px 9px;min-width:0}.dev-strip span{display:block}.dev-strip b{font-size:14px;overflow-wrap:anywhere}
.dev-sensors{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-bottom:14px}
.dev-sensor{margin:0;border-left:5px solid var(--c,var(--ok))}
.ds-head{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.ds-head a{text-decoration:none;color:inherit;flex:1;min-width:0}
.ds-val{display:block;font-size:28px;font-weight:700;margin:4px 0;text-decoration:none;color:inherit}.ds-val small{font-size:14px;color:var(--muted);font-weight:500}
.ds-acts{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.dev-tile .dt-row{display:flex;align-items:center;gap:6px;font-size:13px;padding:2px 0}.dev-tile .dt-row .dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.dev-tile .dt-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.editing-note{background:#eff6ff;border-color:#bfdbfe;font-size:14px}

/* (12/10) Nhập kiểu Apple: lỗi ngay dưới ô, thẻ số điện thoại, đếm ký tự */
.ferr{color:var(--bad);font-size:12.5px;margin-top:4px;line-height:1.35}
.frow.bad input:not([type=checkbox]),.frow.bad .phones,td.bad input{border-color:var(--bad)!important;box-shadow:0 0 0 2px rgba(220,38,38,.15)}
.frow.bad{background:rgba(220,38,38,.04)}td.bad{background:rgba(220,38,38,.06)}td .ferr{max-width:170px;white-space:normal}
.fnote{display:block;color:var(--muted);font-size:12px;margin-top:3px}.fnote b{color:var(--text)}.neg{color:var(--bad);font-weight:600}
.phones{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.pchip{display:inline-flex;align-items:center;gap:4px;background:rgba(15,118,110,.1);color:var(--text);border-radius:999px;padding:4px 4px 4px 10px;font-size:14px;font-variant-numeric:tabular-nums}
.pchip button{border:0;background:rgba(0,0,0,.08);color:inherit;width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:12px;line-height:24px;padding:0}
.pchip button:hover{background:var(--bad);color:#fff}
.phones .padd{flex:1 1 130px;min-width:120px;border:0!important;box-shadow:none!important;padding:6px;background:transparent}
.phones .padd:focus{outline:none}.phones:focus-within{border-color:var(--brand);box-shadow:0 0 0 2px rgba(15,118,110,.15)}
.pcount{font-size:12px;color:var(--muted);white-space:nowrap}.phones .perr,.phones .pnote{flex-basis:100%;margin:0}
.ss-tabs button.err{color:var(--bad)}.ss-tabs button.on.err{color:#fee2e2}.ss-tabs button.err::after{content:" ⚠"}
.sticky-actions.has-err{border-color:#fca5a5}
.result-box{border-left:5px solid var(--line)}.result-box.ok{border-left-color:var(--ok)}.result-box.partial{border-left-color:var(--warn)}.result-box.fail{border-left-color:var(--bad)}
.result-box .rb-head{display:flex;gap:8px;align-items:center}.result-box .rb-head b{flex:1}.result-box ul{margin:6px 0 0;padding-left:20px;font-size:14px}

/* (12/10) Loại cảnh báo đang bật — công tắc lớn kiểu iOS */
.al-presets{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:8px}
.al-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:6px}
.al-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid var(--line);border-radius:12px;cursor:pointer;background:var(--card)}
.al-item.changed{background:#fef9c3}.al-item.dimmed{opacity:.55}
.al-ico{font-size:22px;width:28px;text-align:center}.al-txt{flex:1;min-width:0}.al-txt small{display:block;color:var(--muted);font-size:12px}
.ios{position:relative;flex-shrink:0}.ios input{appearance:none;-webkit-appearance:none;width:51px;height:31px;border-radius:999px;background:#cbd5e1;margin:0;cursor:pointer;transition:background .2s}
.ios input::after{content:"";position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.25);transition:left .2s}
.ios input:checked{background:#34c759}.ios input:checked::after{left:22px}
.ios input:indeterminate{background:#fbbf24}.ios input:indeterminate::after{left:12px}
.ios input:focus-visible{outline:2px solid var(--info);outline-offset:2px}

/* (12/10) Bảng tiến trình gửi xuống máy */
.sheet-wrap{position:fixed;inset:0;z-index:60;background:rgba(15,23,42,.45);display:flex;align-items:center;justify-content:center;padding:16px;animation:fadein .2s}
.sheet-wrap[hidden]{display:none}body.sheet-lock{overflow:hidden}
.sheet{background:var(--card);color:var(--text);border-radius:20px;padding:22px 20px 18px;width:min(460px,100%);max-height:88vh;overflow:auto;box-shadow:0 20px 50px rgba(0,0,0,.3);animation:popin .25s ease-out;outline:none}
.ss-icon{display:flex;justify-content:center;margin-bottom:6px;min-height:64px;align-items:center}
.ss-title{text-align:center;font-size:18px;margin:4px 0 12px}
.ss-spin{width:46px;height:46px;border-radius:50%;border:4px solid rgba(15,118,110,.18);border-top-color:var(--brand);animation:spin .8s linear infinite}
.ss-steps{list-style:none;margin:0;padding:0}.ss-step{display:flex;gap:10px;align-items:flex-start;padding:7px 0;color:var(--muted)}
.ss-dot{flex-shrink:0;width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;background:var(--line)}
.ss-step.run{color:var(--text);font-weight:600}.ss-step.run .ss-dot{background:var(--brand);color:#fff;animation:pulse 1.2s ease-in-out infinite}
.ss-step.done .ss-dot{background:var(--ok);color:#fff}
.ss-check,.ss-cross{width:64px;height:64px}.ss-check circle,.ss-cross circle{fill:none;stroke-width:3;stroke-dasharray:160;stroke-dashoffset:160;animation:draw .5s ease-out forwards}
.ss-check circle{stroke:var(--ok)}.ss-cross circle{stroke:var(--bad)}
.ss-check path,.ss-cross path{fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:60;stroke-dashoffset:60;animation:draw .35s .4s ease-out forwards}
.ss-check path{stroke:var(--ok)}.ss-cross path{stroke:var(--bad)}.ss-big{font-size:52px;line-height:1}
.sheet.ok .ss-title{color:var(--ok)}.sheet.partial .ss-title{color:#b45309}.sheet.fail .ss-title{color:var(--bad)}
.sheet.fail{animation:shake .45s ease-in-out}.sheet.ok{border-top:6px solid var(--ok)}.sheet.partial{border-top:6px solid var(--warn)}.sheet.fail{border-top:6px solid var(--bad)}
.ss-lines{margin:0 0 12px;padding-left:20px;font-size:14px;max-height:40vh;overflow:auto}.ss-lines li{margin:3px 0}
.ss-acts{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes draw{to{stroke-dashoffset:0}}@keyframes fadein{from{opacity:0}}
@keyframes popin{from{transform:translateY(12px) scale(.97);opacity:0}}@keyframes pulse{50%{box-shadow:0 0 0 6px rgba(15,118,110,.18)}}
@keyframes shake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
@media (max-width:640px){.sheet-wrap{align-items:flex-end;padding:0}.sheet{width:100%;border-radius:20px 20px 0 0;padding-bottom:calc(18px + env(safe-area-inset-bottom));animation:slideup .28s ease-out}
 @keyframes slideup{from{transform:translateY(100%)}}}
@media (prefers-reduced-motion:reduce){.sheet,.sheet-wrap,.ss-spin,.ss-step.run .ss-dot,.sheet.fail{animation:none!important}
 .ss-check circle,.ss-cross circle,.ss-check path,.ss-cross path{animation:none;stroke-dashoffset:0}.ios input,.ios input::after{transition:none}.ss-spin{border-top-color:var(--brand);border-color:var(--brand)}}
@media (prefers-color-scheme:dark){.editing-note{background:#0c1d3a;border-color:#1e3a8a}.al-item.changed{background:#3b2f0b}.pchip{background:rgba(45,212,191,.15)}
 .ios input{background:#334155}.sheet-wrap{background:rgba(0,0,0,.6)}}

/* (12/10, bác) Cài đặt kiểu iPhone: điện thoại = danh sách nhóm → trang nhóm; máy tính ≥ 900 px = 2 cột */
.ss-layout{display:block}
.ss-nav{margin-bottom:12px}
.ss-search{width:100%;margin-bottom:10px;border-radius:12px;padding:10px 12px;background:var(--card)}
.ss-results{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:12px}
.ios-h{font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:16px 12px 6px}
.ios-group{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.ios-row{display:flex;align-items:center;gap:12px;width:100%;border:0;background:transparent;color:var(--text);font:inherit;text-align:left;padding:10px 12px;cursor:pointer;position:relative;min-height:56px}
.ios-row+.ios-row::before{content:"";position:absolute;top:0;left:56px;right:0;border-top:1px solid var(--line)}
.ios-row:hover{background:rgba(15,118,110,.05)}.ios-row:active{background:rgba(15,118,110,.1)}
.ios-row[hidden]{display:none}
.ios-ic{flex-shrink:0;width:32px;height:32px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;font-size:17px;background:#64748b}
.g-alerts{background:#ef4444}.g-sensor{background:#f97316}.g-phones{background:#22c55e}.g-daily{background:#3b82f6}.g-power{background:#eab308}
.g-device{background:#6366f1}.g-net{background:#0ea5e9}.g-sim{background:#a855f7}.g-espnow{background:#14b8a6}.g-misc{background:#64748b}
.ios-t{flex:1;min-width:0}.ios-t b{display:block;font-weight:600;font-size:15px}.ios-t small{display:block;color:var(--muted);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ios-row .dot{width:9px;height:9px;border-radius:50%;background:var(--warn);flex-shrink:0}.ios-row .dot[hidden]{display:none}
.ios-row.err .ios-t b{color:var(--bad)}.ios-row.err .ios-t b::after{content:" ⚠"}
.chev{color:var(--muted);font-size:22px;line-height:1}
.ss-back{display:none;border:0;background:none;color:var(--brand);font:inherit;font-size:16px;padding:6px 0 10px;cursor:pointer}
@media (max-width:899px){
 .ss-layout .ss-pane{display:none}.ss-layout.in-group .ss-pane{display:block;animation:slidein .25s ease-out}.ss-layout.in-group .ss-nav{display:none}
 .ss-back{display:inline-block}.ss-layout{overflow-x:clip}}
@media (min-width:900px){
 .ss-layout{display:grid;grid-template-columns:300px 1fr;gap:16px;align-items:start}
 .ss-nav{position:sticky;top:64px;max-height:calc(100vh - 80px);overflow:auto;margin:0}
 .ios-row.on{background:rgba(15,118,110,.12)}.ios-row.on .ios-t b{color:var(--brand)}.ios-row.on .chev{color:var(--brand)}}
@keyframes slidein{from{transform:translateX(24px);opacity:0}}

/* Tình trạng máy: ô hiện đại */
.st-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.st-tile{display:flex;flex-direction:column;gap:2px;background:var(--bg);border-radius:12px;padding:10px 12px;min-width:0;border-left:4px solid var(--line)}
.st-tile.ok{border-left-color:var(--ok)}.st-tile.warn{border-left-color:var(--warn)}.st-tile.bad{border-left-color:var(--bad);background:rgba(220,38,38,.06)}
.st-tile.wide{grid-column:1/-1}.st-ic{font-size:18px;line-height:1.2}.st-val{font-size:17px;overflow-wrap:anywhere}.st-lbl{font-size:12px;color:var(--muted)}
.st-tile[hidden]{display:none}.st-tile.dimmed{opacity:.5}
.bars{display:inline-flex;align-items:flex-end;gap:2px;height:16px}.bars i{width:4px;background:var(--line);border-radius:1px}
.bars i:nth-child(1){height:5px}.bars i:nth-child(2){height:8px}.bars i:nth-child(3){height:12px}.bars i:nth-child(4){height:16px}
.bars.b1 i:nth-child(-n+1),.bars.b2 i:nth-child(-n+2),.bars.b3 i:nth-child(-n+3),.bars.b4 i{background:var(--ok)}
.bars.b1 i:nth-child(1){background:var(--bad)}.bars.b2 i:nth-child(-n+2){background:var(--warn)}
.st-card.pulse{animation:stpulse 1.2s ease-out}@keyframes stpulse{0%{box-shadow:0 0 0 4px rgba(22,163,74,.35)}100%{box-shadow:0 0 0 0 transparent}}
.st-age{margin-left:8px}
@media (prefers-reduced-motion:reduce){.ss-layout.in-group .ss-pane,.st-card.pulse{animation:none}}

/* (12/10, bác: điện thoại KHÔNG được cuộn ngang ở bất cứ đâu) */
.log{overflow-wrap:anywhere}
@media (max-width:640px){
 .stable-wrap{overflow:visible}.stable,.stable tbody{display:block}.stable thead{display:none}
 .stable tr{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;border:1px solid var(--line);border-radius:12px;padding:10px;margin-bottom:8px}
 .stable td{display:block;border:0;padding:0;white-space:normal;min-width:0}
 .stable td.st-name{grid-column:1/-1;font-weight:600;font-size:15px}
 .stable td.st-sw{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between}
 .stable td[data-l]:not(.st-sw)::before{content:attr(data-l);display:block;font-size:12px;color:var(--muted);margin-bottom:2px}
 .stable td.st-sw::before{content:attr(data-l);font-size:14px}
 .stable td.st-nohum{display:none}.stable .tnum{width:100%}
 .net-diagram{overflow:hidden;touch-action:pan-y pinch-zoom}.net-diagram svg{min-width:0}
 .route-card.net-full .net-diagram svg{min-width:0;max-width:100%}.route-card.net-full .net-diagram{overflow:hidden;touch-action:pinch-zoom}}

/* (12/10, bác) Ô nhập hiện đại theo loại dữ liệu */
.seg2{display:inline-flex;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg);padding:3px;gap:3px}
.seg2 button{border:0;background:transparent;color:var(--text);font:inherit;padding:8px 16px;border-radius:9px;cursor:pointer;min-width:84px}
.seg2 button.on{background:var(--card);box-shadow:0 1px 4px rgba(0,0,0,.15);font-weight:600;color:var(--brand)}
.choice{display:grid;gap:6px}
.ch-opt{display:flex;gap:10px;align-items:center;text-align:left;border:1.5px solid var(--line);background:var(--card);color:var(--text);border-radius:12px;padding:9px 12px;font:inherit;cursor:pointer}
.ch-opt b{display:block}.ch-opt small{display:block;color:var(--muted);font-size:12.5px}.ch-ic{font-size:22px;width:28px;text-align:center}
.ch-opt.on{border-color:var(--brand);background:rgba(15,118,110,.08);box-shadow:0 0 0 1px var(--brand)}
.dur{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.dur .dur-n{width:90px!important;flex:0 0 90px}.dur .dur-u{flex:0 0 auto}
.chips-q{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}.chips-q .chip{font-size:12.5px;padding:3px 9px}
.stepper{display:inline-flex;align-items:center;gap:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card);vertical-align:middle}
.stepper button{border:0;background:var(--bg);color:var(--text);width:40px;height:38px;font-size:20px;cursor:pointer}
.stepper button:active{background:var(--line)}
.frow .stepper input,.stepper input{width:64px!important;border:0!important;text-align:center;border-radius:0;box-shadow:none!important}
.stepper .suf{padding:0 10px 0 2px}
.thr,.money{display:flex;align-items:center;border:1px solid var(--line);border-radius:10px;background:var(--card);overflow:hidden}
.thr input,.money input{flex:1;min-width:0;border:0!important;box-shadow:none!important;border-radius:0}
.thr .pm{border:0;border-right:1px solid var(--line);background:var(--bg);color:var(--text);padding:0 9px;align-self:stretch;cursor:pointer;font-size:13px}
.suf{color:var(--muted);padding:0 10px;white-space:nowrap}
.frow.bad .thr,.frow.bad .money,.frow.bad .stepper,.frow.bad .dur .dur-n,td.bad .thr{border-color:var(--bad);box-shadow:0 0 0 2px rgba(220,38,38,.15)}
.keepalive{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.ka-days[hidden]{display:none}
select.hour{min-width:110px}
.stable .thr{min-width:110px}

/* (12/10) tin sự kiện dài thu gọn */
.ev-long summary{cursor:pointer;list-style:none;color:inherit}.ev-long summary::-webkit-details-marker{display:none}
.ev-long[open] summary{display:none}.ev-long{overflow-wrap:anywhere}
/* (12/10) nguyên văn tin máy gửi (SMS không dấu) — trích dẫn, tách khỏi chữ giao diện */
.ev-from{display:block;margin-top:2px}.ev-quote{border-left:3px solid var(--line);padding:2px 0 2px 8px;margin:2px 0;color:var(--muted);font-size:13.5px;white-space:pre-line;overflow-wrap:anywhere}
/* (12/10, bác) Thẻ từng cảm biến trong nhóm "Ngưỡng & cảnh báo" (thay bảng + ô "(từng cảm biến)" lặp lại) */
.scards{margin-bottom:10px}
.scard{padding:0;margin:0 0 10px;border-left:5px solid var(--line);overflow:hidden}
.scard.this{border-left-color:var(--brand);box-shadow:0 0 0 1px rgba(15,118,110,.25)}
.scard>summary{list-style:none;cursor:pointer;padding:12px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;position:relative}
.scard>summary::-webkit-details-marker{display:none}
.scard>summary::after{content:"›";position:absolute;right:14px;top:10px;font-size:22px;color:var(--muted);transition:transform .2s}
.scard[open]>summary::after{transform:rotate(90deg)}
.sc-h{flex:1 1 100%;padding-right:24px;min-width:0}.sc-sum{flex:1 1 100%;min-width:0}
.scard>summary .dot{position:absolute;right:38px;top:18px;width:9px;height:9px;border-radius:50%;background:var(--warn)}.scard>summary .dot[hidden]{display:none}
.scard[open]>summary{border-bottom:1px solid var(--line)}
.slot{padding:6px 14px 10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:4px 16px}
.slot+.slot{border-top:1px dashed var(--line)}
.slot h4{grid-column:1/-1;margin:6px 0 2px;font-size:14.5px}
.sf{padding:7px 0;min-width:0}.sf-l{display:block;font-size:13px;color:var(--muted);margin-bottom:4px}
.sf[data-f=CHOPHEPSENSORCANHBAO]{grid-column:1/-1}
.sf.changed{background:#fef9c3;border-radius:8px;padding:7px 8px}.sf.bad{background:rgba(220,38,38,.05);border-radius:8px;padding:7px 8px}
.sf input[type=text],.sf select{width:100%}.sf .stepper input{width:64px!important}
.slot.off .sf.w{display:none}.slot .slot-off{display:none;grid-column:1/-1;margin:0}.slot.off .slot-off{display:block}
@media (prefers-color-scheme:dark){.sf.changed{background:#3b2f0b}}
@media (max-width:640px){.slot{grid-template-columns:1fr 1fr;gap:2px 10px}.sf[data-f=Send],.sf[data-f=Repeat],.sf[data-f=TenCamBien],.sf[data-f=Time]{grid-column:1/-1}}
.slot{align-items:start}

/* (12/10) Chờ thiết bị trong bảng (vòng đếm ngược) + dòng xương khi tải */
.wait{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:var(--bg);margin:6px 0}
.wait .wtxt{display:flex;flex-direction:column;min-width:0}.wait .wtxt small{color:var(--muted);font-size:12px}
.wring{width:30px;height:30px;flex-shrink:0;transform:rotate(-90deg)}.wring circle{fill:none;stroke-width:4}
.wr-bg{stroke:rgba(15,118,110,.15)}.wr-fg{stroke:var(--brand);stroke-linecap:round;stroke-dasharray:94.2;stroke-dashoffset:0;transition:stroke-dashoffset .25s linear}
.wait.run .wring{animation:wspin 1.4s linear infinite}@keyframes wspin{to{transform:rotate(270deg)}}
.wait .wic{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:700;flex-shrink:0;animation:popin .25s ease-out}
.wait.ok{background:rgba(22,163,74,.1)}.wait.ok .wic{background:var(--ok)}
.wait.fail{background:rgba(220,38,38,.08)}.wait.fail .wic{background:var(--bad)}.wait.fail{animation:shake .4s}
.wait.warn{background:rgba(245,158,11,.12)}.wait.warn .wic{background:var(--warn)}
.skel{display:flex;flex-direction:column;gap:6px;padding:10px;border-radius:12px;background:var(--card);border:1px solid var(--line);margin-bottom:8px}
.skel i{display:block;height:12px;border-radius:6px;background:linear-gradient(90deg,var(--line),var(--bg),var(--line));background-size:200% 100%;animation:shimmer 1.3s infinite}
.skel i:nth-child(2){width:60%}@keyframes shimmer{to{background-position:-200% 0}}
.grid .skel{min-height:110px}
@media (prefers-reduced-motion:reduce){.wait.run .wring,.skel i,.wait.fail,.wait .wic{animation:none}}
/* (12/10) vai trò / mục khóa / kiểm tra cài đặt / còi */
.role-note{background:#f0fdfa;border-color:#99f6e4}
.g-note{margin:-4px 0 8px;color:#0369a1}
.ro-val{padding:8px 10px;background:var(--bg);border-radius:10px;color:var(--muted);overflow-wrap:anywhere}
.frow.dimmed input:disabled,.frow.dimmed select:disabled,.frow.dimmed button:disabled{cursor:not-allowed}
.frow.dimmed>*:not(.why){opacity:.4;pointer-events:none}
.linkbtn{border:0;background:none;color:var(--info);font:inherit;font-size:12px;cursor:pointer;padding:0 0 0 4px;text-decoration:underline}
.deps-card{border-left:5px solid var(--ok)}.deps-card.warn{border-left-color:var(--warn)}.deps-card.bad{border-left-color:var(--bad)}.deps-card.info{border-left-color:var(--info)}
.deps-card ul{margin:6px 0 0;padding-left:0;list-style:none}.deps-card li{padding:4px 0;font-size:14px}
.deps-card .dl-block{color:var(--bad)}.deps-card .dl-warn{color:#b45309}.ok-t{color:var(--ok)}
.al-phone{margin-top:8px;padding:8px 10px;border-radius:10px;background:rgba(245,158,11,.12);font-size:14px}.al-phone.info{background:rgba(37,99,235,.08)}
.relay-test{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
@media (prefers-color-scheme:dark){.role-note{background:#062a26;border-color:#115e59}.g-note{color:#7dd3fc}}
/* (12/10) nhánh con "Kêu còi" + "Nhận cảnh báo qua" */
.al-wrap{display:flex;flex-direction:column;gap:0}
.al-sub{margin:-4px 0 0 20px;padding:8px 10px 8px 14px;border-left:3px solid var(--line);border-radius:0 0 12px 12px;background:var(--bg);display:flex;flex-direction:column;gap:4px}
.al-sub.changed{background:#fef9c3}.al-subrow{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;font-size:14px}
.ios.sm input{width:42px;height:26px}.ios.sm input::after{width:22px;height:22px}.ios.sm input:checked::after{left:18px}
.rc-sec{border-top:1px solid var(--line);padding:10px 0}.rc-sec h4{margin:0 0 6px;font-size:15px}
.rc-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:5px 0;overflow-wrap:anywhere}.rc-row.off{opacity:.5}.rc-row .btn{margin-left:auto}
.rc-add{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.rc-add input{flex:1 1 160px;min-width:0}.rc-add .ferr{flex-basis:100%}
.tg-link{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:8px}.tg-link img{background:#fff;border-radius:10px;padding:4px}
@media (prefers-color-scheme:dark){.al-sub.changed{background:#3b2f0b}}
/* (12/10) nhật ký bộ gửi cảnh báo */
.ob-list{display:flex;flex-direction:column;gap:4px}.ob{padding:7px 10px;border-radius:10px;border-left:4px solid var(--line);background:var(--bg);font-size:13.5px;overflow-wrap:anywhere}
.ob-ok{border-left-color:var(--ok)}.ob-bad{border-left-color:var(--bad)}.ob-warn{border-left-color:var(--warn)}.ob-mute{border-left-color:#94a3b8}
.ob-st{font-size:12px;padding:1px 7px;border-radius:999px;background:var(--line)}.ob-ok .ob-st{background:#dcfce7;color:#166534}.ob-bad .ob-st{background:#fee2e2;color:#991b1b}.ob-warn .ob-st{background:#fef3c7;color:#92400e}
.tg-open{margin-bottom:6px}
/* (12/10) đầu dò chập chờn */
.chip-flap{display:inline-block;font-size:12px;padding:1px 7px;border-radius:999px;background:#fef3c7;color:#92400e;border:1px solid #fcd34d;white-space:nowrap;cursor:help}
.flap-note{margin:4px 0;color:#92400e;background:#fffbeb;border-radius:8px;padding:5px 8px}
.flap-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
@media (prefers-color-scheme:dark){.chip-flap{background:#422006;color:#fde68a;border-color:#a16207}.flap-note{background:#2a1d05;color:#fde68a}}
.frow>.subhead{grid-column:1/-1;margin:6px 0 0;padding-top:8px;border-top:2px solid var(--line)}.frow>.subhead b{display:block;font-size:15px}.frow>.subhead small{color:var(--muted);font-size:12.5px}
/* (12/10) đã báo những ai */
.ev .trace,.card .trace{grid-column:1/-1;margin-top:6px;padding:10px;border-radius:12px;background:var(--bg)}
.tr-sum{font-weight:600;padding:6px 10px;border-radius:10px;margin-bottom:6px}.tr-ok{background:#dcfce7;color:#166534}.tr-warn{background:#fef3c7;color:#92400e}
.tr-fail{background:#fee2e2;color:#991b1b}.tr-unknown{background:var(--card);color:var(--muted)}
.tr-list{list-style:none;margin:0;padding:0;border-left:2px solid var(--line)}.tr-list li{display:flex;gap:8px;padding:4px 0 4px 10px;font-size:14px;position:relative;min-width:0}
.tr-list li span:last-child{min-width:0;overflow-wrap:anywhere}.tr-list li.ok .tr-ic{color:var(--ok)}.tr-list li.bad{color:var(--bad)}
.tr-t{color:var(--muted);font-size:12px;white-space:nowrap;padding-top:2px}.tr-raw{display:block;font-family:ui-monospace,monospace;font-size:11px}
.tr-nolog{margin-top:8px;padding:8px;border-radius:10px;border:1px dashed var(--line)}
@media (prefers-color-scheme:dark){.tr-ok{background:#052e16;color:#86efac}.tr-warn{background:#422006;color:#fde68a}.tr-fail{background:#450a0a;color:#fecaca}}
/* (12/10) tin nhắn SIM kiểu điện thoại */
.sv{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card)}
.sv-list{max-height:520px;overflow-y:auto}.sv-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-bottom:1px solid var(--line);background:none;color:var(--text);text-align:left;font:inherit;cursor:pointer;min-width:0}
.sv-item.on{background:rgba(15,118,110,.08)}.sv-av{flex-shrink:0;width:38px;height:38px;border-radius:50%;background:var(--brand);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:13px}
.sv-mid{flex:1;min-width:0}.sv-mid b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sv-mid small{display:block;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sv-r{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0}.sv-r small{color:var(--muted);font-size:11.5px;white-space:nowrap}.sv-dot{width:9px;height:9px;border-radius:50%;background:var(--info)}
.sv-chat{display:none;flex-direction:column;min-width:0}.sv.in-chat .sv-chat{display:flex}.sv.in-chat .sv-list{display:none}
.sv-head{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line)}.sv-back{border:0;background:none;color:var(--brand);font-size:24px;cursor:pointer;line-height:1}
.sv-bubbles{display:flex;flex-direction:column;gap:6px;padding:12px;max-height:480px;overflow-y:auto;background:var(--bg)}
.sv-day{align-self:center;font-size:12px;color:var(--muted);background:var(--card);padding:2px 10px;border-radius:999px;margin:6px 0}
.sv-b{max-width:82%;padding:8px 11px;border-radius:16px;font-size:14.5px;line-height:1.4;overflow-wrap:anywhere}
.sv-b.in{align-self:flex-start;background:var(--card);border:1px solid var(--line);border-bottom-left-radius:4px}.sv-b.in.unread{border-color:var(--info)}
.sv-b.out{align-self:flex-end;background:var(--brand);color:#fff;border-bottom-right-radius:4px}
.sv-txt{white-space:pre-wrap}.sv-meta{font-size:11px;opacity:.75;margin-top:3px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.sv-b.out .sv-bad{background:#fee2e2;color:#991b1b;border-radius:6px;padding:0 5px}.sv-del{border:0;background:none;color:inherit;cursor:pointer;opacity:.6;margin-left:auto}
.sv-reply{display:flex;gap:6px;padding:8px;border-top:1px solid var(--line)}.sv-reply input{flex:1;min-width:0}.sv-noreply{padding:8px 12px;margin:0}
.sv-empty{padding:30px;text-align:center}
@media (min-width:900px){.sv{display:grid;grid-template-columns:300px 1fr}.sv-list{display:block!important;border-right:1px solid var(--line)}.sv-chat{display:flex}.sv-back{display:none}}
/* (12/10) dải thông tin chính của máy */
.devstrip{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 10px}
.ds-b{display:inline-flex;align-items:center;gap:4px;font-size:13px;padding:3px 9px;border-radius:999px;background:var(--card);border:1px solid var(--line);max-width:100%;overflow-wrap:anywhere}
.ds-b.old{background:#fef3c7;border-color:#fcd34d;color:#92400e}.ds-b.old b{font-size:11px}
.devstrip.compact{margin:4px 0 2px;gap:4px}.devstrip.compact .ds-b{font-size:11.5px;padding:1px 7px}
@media (prefers-color-scheme:dark){.ds-b.old{background:#422006;color:#fde68a;border-color:#a16207}}
/* (12/10) 📜 Lịch sử máy */
.hx-filters{display:flex;flex-direction:column;gap:8px;margin:8px 0}.hx-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.hx-row input[type=search]{flex:1 1 180px;min-width:0}.hx-row input[type=date]{flex:1 1 130px;min-width:0}
.hx-list .ev{display:grid;grid-template-columns:150px 1fr auto;gap:10px;padding:8px 0;border-top:1px solid var(--line);align-items:start}
.hx-list .ev .t{color:var(--muted);font-size:13px}.hx-list .ev .m{min-width:0;overflow-wrap:anywhere;font-size:14px}.hx-list .ev.bad .m{color:var(--bad)}
.hx-ic{margin-right:6px}
@media (max-width:640px){.hx-list .ev{grid-template-columns:1fr;gap:3px}}
/* (12/10) MỘT trang quản lý máy chia thẻ: điện thoại = thẻ xuống dòng (không cuộn ngang), máy tính = 1 hàng */
.hub-head h1{flex:1;min-width:0}.rename-btn{font-weight:600}
.hub-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 14px;padding:4px;background:var(--card);border:1px solid var(--line);border-radius:14px;position:sticky;top:52px;z-index:5}
.hub-tabs a{flex:1 1 auto;text-align:center;text-decoration:none;color:var(--text);padding:8px 12px;border-radius:10px;font-size:14px;white-space:nowrap}
.hub-tabs a:hover{background:var(--bg)}.hub-tabs a.on{background:var(--brand);color:#fff;font-weight:600}
.hub-pane[hidden]{display:none}.pane-h{font-size:18px;margin:0;flex:1}
@media (max-width:640px){.hub-tabs{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:4px;top:48px}.hub-tabs a{padding:7px 4px;font-size:13px;white-space:normal}}
.name-note{border-radius:12px;padding:8px 12px;margin:0 0 10px;font-size:14px;border:1px solid var(--line)}
.name-note.pend{background:#fffbeb;border-color:#fcd34d}.name-note.diff{background:#eff6ff;border-color:#bfdbfe}
.name-note .btn{margin-left:6px}
.name-ro{display:inline-block;margin-right:6px}
.name-sheet{max-width:560px;width:100%;max-height:90dvh;overflow:auto}
.nm-row{display:grid;gap:4px;margin:10px 0}.nm-l{font-size:13px;font-weight:600}.nm-row input{padding:9px 10px;font-size:16px;border:1px solid var(--line);border-radius:10px;width:100%}
.nm-prev{background:var(--bg);border-radius:12px;padding:10px 12px;margin:12px 0;font-size:14px}.nm-ph{font-weight:600;margin-bottom:4px}
.nm-slots{display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center}.nm-slot{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:1px 7px;font-family:ui-monospace,monospace;font-size:13px}
.nm-dn{font-family:ui-monospace,monospace}.warn-txt{color:#b45309;margin-top:4px}
@media (prefers-color-scheme:dark){.name-note.pend{background:#2a1d05;border-color:#a16207}.name-note.diff{background:#0c1d3a;border-color:#1e3a8a}.nm-row input{background:#0f172a;color:var(--text)}}
/* (12/10) Trình xem nhật ký gọn: giờ · mức · mô-đun · 1 dòng chữ; tiêu đề ngày dính; khung cuộn riêng (trang không kéo dài) */
.lv-box{max-height:62vh;overflow-y:auto;overflow-x:hidden;border:1px solid var(--line);border-radius:12px;background:var(--card);overscroll-behavior:contain}
.lv-day{position:sticky;top:0;z-index:1;background:var(--bg);font-size:12.5px;font-weight:600;padding:4px 10px;border-bottom:1px solid var(--line);text-transform:capitalize}
.lv-row{border-bottom:1px solid var(--line);font-size:13.5px}.lv-row>summary,.lv-sum{display:flex;align-items:center;gap:6px;padding:5px 10px;min-width:0;cursor:default;list-style:none}
.lv-row>summary{cursor:pointer}.lv-row>summary::-webkit-details-marker{display:none}.lv-row[open]>summary{background:var(--bg)}
.lv-t{font-variant-numeric:tabular-nums;color:var(--muted);font-size:12.5px;flex:none;width:40px}
.lv-lvl,.lv-mod{flex:none;font-size:10.5px;font-weight:700;letter-spacing:.3px;border-radius:6px;padding:1px 5px;line-height:1.5}
.lv-lvl{background:#e2e8f0;color:#334155}.lv-lvl.l-ERR{background:#fee2e2;color:#b91c1c}.lv-lvl.l-WRN{background:#fef3c7;color:#92400e}
.lv-lvl.l-STA{background:#dcfce7;color:#166534}.lv-lvl.l-EVT{background:#dbeafe;color:#1e40af}.lv-lvl.l-SRV{background:#ede9fe;color:#5b21b6}
.lv-mod{background:transparent;border:1px solid var(--line);color:var(--muted);max-width:92px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lv-txt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lv-row[open] .lv-txt{white-space:normal}
.lv-row.bad .lv-txt{color:var(--bad)}.lv-rep{flex:none;font-size:11.5px;color:var(--muted);background:var(--bg);border-radius:999px;padding:0 7px;white-space:nowrap}
.lv-txt .ev-tag{margin-right:4px}
.lv-body{padding:4px 10px 8px 56px;font-size:12.5px}.lv-raw{font-family:ui-monospace,monospace;font-size:12px;word-break:break-all;color:var(--muted)}
.lv-ev .ev-quote{margin:4px 0}.lv-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:flex-end;margin:6px 0}.lv-tools>span{flex:1}
.lv-more{padding:8px}.lv-filters .chips{margin-bottom:6px}.lv-filters .chip small{color:var(--muted)}
.card.lv-full{position:fixed;inset:0;z-index:70;margin:0;border-radius:0;display:flex;flex-direction:column;overflow:hidden;padding-top:calc(10px + env(safe-area-inset-top))}
.card.lv-full .lv-box{flex:1;max-height:none}
@media (max-width:640px){.lv-row>summary,.lv-sum{flex-wrap:wrap;row-gap:2px}.lv-txt{flex-basis:100%;order:5}.lv-row[open] .lv-txt{white-space:normal}.lv-body{padding-left:10px}.lv-box{max-height:70vh}.lv-rep{order:4}}
@media (prefers-color-scheme:dark){.lv-lvl{background:#1f2a44;color:#cbd5e1}.lv-lvl.l-ERR{background:#450a0a;color:#fecaca}.lv-lvl.l-WRN{background:#422006;color:#fde68a}
 .lv-lvl.l-STA{background:#052e16;color:#86efac}.lv-lvl.l-EVT{background:#0c1d3a;color:#93c5fd}.lv-lvl.l-SRV{background:#2e1065;color:#ddd6fe}}
/* (12/10) Tổng quan: thẻ gọn "Lần cảnh báo gần nhất" + chip sự kiện quan trọng; lối sang thẻ Nhóm */
.rc-head{font-size:14.5px;margin-bottom:6px}.tr-ok-t{color:var(--ok)}.tr-warn-t{color:#b45309}.tr-fail-t{color:var(--bad)}
.rc-chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px}.rc-chip{border:1px solid var(--line);border-radius:999px;padding:3px 10px;font-size:13px;background:var(--bg);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rc-chip.bad{border-color:#fca5a5;background:#fef2f2;color:#991b1b}.rc-chip.ok{border-color:#bbf7d0;background:#f0fdf4;color:#166534}.rc-chip small{opacity:.75}
.group-link{display:block;text-decoration:none;color:var(--text);padding:10px 14px}.group-link:hover{border-color:var(--brand)}
#hx-mods{gap:4px}#hx-mods .chip{font-size:12px;padding:2px 8px}
@media (prefers-color-scheme:dark){.rc-chip.bad{background:#450a0a;color:#fecaca;border-color:#7f1d1d}.rc-chip.ok{background:#052e16;color:#86efac;border-color:#14532d}}
/* (12/10) bản phát triển + xóa tin đã gửi / cả hội thoại */
.dev-badge{background:#ede9fe;color:#5b21b6;margin-left:6px}.dt-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:6px 0;border-top:1px solid var(--line)}
.dt-wait:empty{display:none}.dt-wait{margin:0 0 6px 24px}
.sv-head{display:flex;align-items:center;gap:8px}.sv-head b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.sv-delconv{margin-left:auto;white-space:nowrap}
.sv-sdel{border:0;background:none;color:inherit;opacity:.8;font-size:12px;text-decoration:underline;cursor:pointer;padding:0 0 0 6px}.sv-sdel.off{opacity:.45;cursor:help;text-decoration:none}
@media (prefers-color-scheme:dark){.dev-badge{background:#2e1065;color:#ddd6fe}}

/* (12/10) dải thông tin máy: trạng thái SIM */
.ds-b.ds-bad{background:#fee2e2;color:#991b1b}.ds-b.ds-warn{background:#fef3c7;color:#92400e}
@media (prefers-color-scheme:dark){.ds-b.ds-bad{background:#3f1515;color:#fca5a5}.ds-b.ds-warn{background:#3b2f0b;color:#fbbf24}}
/* (12/10) Khóa API + trang hướng dẫn API */
.key-new{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.key-new input{flex:1 1 200px;min-width:0}.key-rows{display:flex;flex-direction:column;gap:8px}
.key-row{border:1px solid var(--line);border-radius:12px;padding:8px 10px}.key-row.bad,.key-row.warn{opacity:.75}.kr-acts{margin-top:4px}
.key-st{font-size:11.5px;border-radius:999px;padding:1px 8px;background:#dcfce7;color:#166534}.key-st.bad{background:#fee2e2;color:#991b1b}.key-st.warn{background:#fef3c7;color:#92400e}
.key-once{border:2px solid var(--ok);border-radius:12px;padding:10px;margin:8px 0;background:#f0fdf4}.key-box{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0}
.key-box code{flex:1 1 260px;min-width:0;word-break:break-all;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:6px 8px;font-size:13px}
.apidoc pre{background:#0f172a;color:#e2e8f0;border-radius:10px;padding:10px 12px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;max-width:100%}.apidoc code{overflow-wrap:anywhere}
.apidoc table{border-collapse:collapse;width:100%;font-size:14px}.apidoc td,.apidoc th{border-top:1px solid var(--line);padding:5px 6px;text-align:left;vertical-align:top}
.apidoc td:first-child{white-space:nowrap}
@media (prefers-color-scheme:dark){.key-once{background:#052e16}.key-st{background:#052e16;color:#86efac}.key-st.bad{background:#450a0a;color:#fecaca}.key-st.warn{background:#422006;color:#fde68a}}

/* (12/10) nút chép số giữa danh sách gọi / nhắn */
.phones .pcopy{margin-left:auto;white-space:nowrap}
/* (12/10) thẻ Cài đặt: tự đọc cấu hình mới nhất khi mở; hướng dẫn 1 dòng; danh sách nhóm rõ ràng */
.fresh-bar{border-radius:10px;padding:7px 12px;margin:0 0 10px;font-size:13.5px;border:1px solid var(--line)}
.fresh-bar.run{background:#eff6ff;border-color:#bfdbfe}.fresh-bar.ok{background:#f0fdf4;border-color:#bbf7d0;color:#166534}
.fresh-bar.warn{background:#fffbeb;border-color:#fcd34d;color:#78350f}.fresh-bar ul{margin:4px 0 4px 18px;padding:0}
.fb-track{height:3px;background:rgba(37,99,235,.15);border-radius:3px;overflow:hidden;margin-top:6px}
.fb-track i{display:block;height:100%;width:100%;background:var(--info);transform-origin:left;animation:fbgrow linear forwards}
@keyframes fbgrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
#ss-form.reading{opacity:.6;transition:opacity .2s}
.fresh-diff{animation:freshdiff 3s ease-out}@keyframes freshdiff{0%,60%{background:#dbeafe;box-shadow:0 0 0 2px #93c5fd}100%{background:transparent;box-shadow:none}}
.conflict-note{color:#92400e;background:#fffbeb;border-radius:8px;padding:3px 8px;margin-top:4px}
.ss-howto{margin:-4px 0 8px;font-size:14px;color:var(--brand)}
.hx-load{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:4px 0 8px}.hx-load .btn[disabled]{opacity:.55;cursor:wait}
.ss-nav .ios-group{box-shadow:0 1px 3px rgba(15,23,42,.08)}.ss-nav .ios-row b{font-size:15px}.ss-nav .ios-sum{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (prefers-color-scheme:dark){.fresh-bar.run{background:#0c1d3a;border-color:#1e3a8a}.fresh-bar.ok{background:#052e16;border-color:#14532d;color:#86efac}
 .fresh-bar.warn{background:#2a1d05;border-color:#a16207;color:#fde68a}.conflict-note{background:#2a1d05;color:#fde68a}}
@media (prefers-reduced-motion:reduce){.fb-track i,.fresh-diff{animation:none}}
