/* quanly.css — Lịch sản xuất GMM. Cùng ngôn ngữ thiết kế với thietbi.gmm.vn: kính mờ + bảng màu champagne.
   Các rule nền tảng (header, nav, .card, .btn, input, .tag, .modal, .login, .toast) chép từ index.html của thietbi
   (3 lớp gốc → glass → champagne gộp lại). Phần dưới "QUANLY" là giao diện riêng: lịch tháng/tuần, Kanban, bảng, chọn người. */
/* ---- Giao diện = bộ biến màu. Mặc định "Champagne" (kính ấm, tối). Mỗi tài khoản chọn giao diện + màu nhấn (nút 🎨 trên đầu trang):
   html[data-theme=...] đổi bộ biến bên dưới; màu nhấn tự chọn do qlApplyTheme (index.html) đặt thẳng lên <html>
   (--accent, --accent-rgb, --heading, --link, --btn-bg, --btn-text). --tint = màu (r,g,b) của lớp phủ / viền mờ:
   trắng ấm trên giao diện tối, nâu đậm trên giao diện sáng. ---- */
:root{--radius:24px;--pc:var(--accent);--red:#ff7d80;--red2:rgba(205,63,67,.22);--green:#83d9b2;--green2:rgba(63,166,124,.21);--amber:#e7c28b;--amber2:rgba(211,166,98,.20);
 --scheme:dark;--html-bg:#554c47;--tint:255,246,232;--text:#fffaf2;--text2:#e9dfd4;--muted:#d8cec3;--faint:#c3b5a8;
 --accent:#e7c28b;--accent-rgb:231,194,139;--heading:#efd09d;--link:#fff3dd;--btn-bg:linear-gradient(135deg,#f4d8aa 0%,#c6aa86 48%,#aaa4b1 100%);--btn-text:#382c27;
 --alert-text:#ffebc9;--err-text:#ffd1d8;--warn-text:#ffc98f;--title-glow:0 1px 16px rgba(255,226,177,.24);
 --glass-bg:linear-gradient(145deg,rgba(60,50,48,.78),rgba(60,53,55,.55));--glass-border:rgba(255,244,226,.27);--glass-shadow:inset 0 1px 0 rgba(255,250,240,.3),inset 0 -1px 0 rgba(255,255,255,.035),0 10px 26px rgba(32,23,20,.22);
 --glass-shine:linear-gradient(135deg,rgba(255,247,231,.1),transparent 30%,transparent 68%,rgba(190,184,205,.05));
 --nav-bg:linear-gradient(145deg,rgba(68,58,54,.96),rgba(66,60,62,.93));--modal-bg:linear-gradient(145deg,rgba(68,58,55,.97),rgba(63,57,59,.95));--menu-solid:#4e4441;--overlay:rgba(32,26,25,.74);
 --page-bg:radial-gradient(160px 160px at 30px calc(22% + 160px),rgba(255,221,158,.42),transparent 70%),radial-gradient(210px 210px at calc(100% - 30px) calc(100% - 90px),rgba(199,194,213,.38),transparent 72%),radial-gradient(circle at 4% 12%,rgba(230,192,125,.68),transparent 31%),radial-gradient(circle at 45% -5%,rgba(245,237,222,.72),transparent 30%),radial-gradient(circle at 92% 6%,rgba(92,78,72,.7),transparent 33%),radial-gradient(circle at 79% 87%,rgba(123,132,149,.68),transparent 36%),radial-gradient(circle at 18% 92%,rgba(163,139,108,.45),transparent 32%),linear-gradient(145deg,#8e7c68 0%,#5f514a 45%,#555765 100%);
 --page-flat:linear-gradient(145deg,#8e7c68 0%,#5f514a 45%,#555765 100%);
 --tag-red:#ffb0b2;--tag-red-a:.15;--tag-amber:#f5dcb3;--tag-amber-a:.13;--placeholder:var(--muted)} /* 12/10/2026: tag đỏ/vàng và chữ gợi ý trên nền tối ≥ 4.5:1 (trước ~3:1) */
/* Đêm xanh: tối, lạnh, tương phản cao */
html[data-theme=midnight]{--html-bg:#121722;--tint:214,224,255;--text:#eef2ff;--text2:#d6ddf0;--muted:#aab4cc;--faint:#8c97b2;
 --accent:#6ea8fe;--accent-rgb:110,168,254;--heading:#a9c8ff;--link:#d3e3ff;--btn-bg:linear-gradient(135deg,#a9c8ff 0%,#6ea8fe 52%,#4d78d0 100%);--btn-text:#0e1630;--title-glow:0 1px 16px rgba(120,160,255,.25);
 --glass-bg:linear-gradient(145deg,rgba(30,38,56,.86),rgba(24,31,47,.74));--glass-border:rgba(160,180,230,.18);--glass-shadow:inset 0 1px 0 rgba(200,215,255,.1),0 10px 26px rgba(0,0,0,.35);--glass-shine:linear-gradient(135deg,rgba(200,215,255,.06),transparent 35%);
 --nav-bg:linear-gradient(145deg,rgba(29,36,54,.97),rgba(24,30,46,.96));--modal-bg:linear-gradient(145deg,#1e2639,#192133);--menu-solid:#1e2639;--overlay:rgba(6,8,16,.7);
 --page-bg:radial-gradient(circle at 8% 8%,rgba(70,100,190,.45),transparent 35%),radial-gradient(circle at 92% 12%,rgba(130,90,190,.3),transparent 35%),radial-gradient(circle at 80% 92%,rgba(40,140,170,.25),transparent 40%),linear-gradient(160deg,#1b2336 0%,#131a29 55%,#0f1420 100%);
 --page-flat:linear-gradient(160deg,#1b2336,#0f1420)}
/* Sáng: nền kem, thẻ trắng, chữ nâu đậm */
html[data-theme=light],html[data-theme=minimal]{--scheme:light;--red:#a8262d;--red2:rgba(205,63,67,.12);--green:#17663f;--green2:rgba(40,150,100,.13);--amber:#7d520f;--amber2:rgba(200,150,60,.16);
 --tag-red:var(--red);--tag-red-a:.14;--tag-amber:var(--amber);--tag-amber-a:.16;--placeholder:var(--faint); /* 12/10/2026: chữ trạng thái + chữ gợi ý ≥ 4.5:1 trên nền trắng */
 
 --alert-text:#6b4510;--err-text:#a3232c;--warn-text:#9a5a10;--title-glow:none;--glass-shine:none}
html[data-theme=light]{--html-bg:#efe9df;--tint:72,54,38;--text:#2a221d;--text2:#3f352e;--muted:#6e6158;--faint:#7a6c61;
 --accent:#b07d2b;--accent-rgb:176,125,43;--heading:#8a5a12;--link:#7a4a0e;--btn-bg:linear-gradient(135deg,#e6c07c 0%,#d1a35a 55%,#bf8d42 100%);--btn-text:#2a1c08;
 --glass-bg:rgba(255,255,255,.84);--glass-border:rgba(72,54,38,.13);--glass-shadow:0 6px 18px rgba(60,40,20,.08);
 --nav-bg:rgba(255,253,249,.97);--modal-bg:#fffdf9;--menu-solid:#fff;--overlay:rgba(40,30,20,.35);
 --page-bg:radial-gradient(circle at 6% 10%,rgba(232,200,150,.45),transparent 35%),radial-gradient(circle at 92% 88%,rgba(190,190,215,.4),transparent 40%),linear-gradient(160deg,#f8f4ee,#ece5da);--page-flat:#f3eee6}
/* Tối giản: phẳng, trắng xám, không dải màu, góc bo nhỏ */
html[data-theme=minimal]{--html-bg:#f3f4f6;--tint:17,24,39;--text:#111827;--text2:#374151;--muted:#5f6672;--faint:#687080;
 --accent:#2563eb;--accent-rgb:37,99,235;--heading:#1d4ed8;--link:#1d4ed8;--btn-bg:#2563eb;--btn-text:#fff;
 --glass-bg:#fff;--glass-border:#e5e7eb;--glass-shadow:0 1px 2px rgba(17,24,39,.05);--nav-bg:#fff;--modal-bg:#fff;--menu-solid:#fff;--overlay:rgba(17,24,39,.4);--page-bg:#f3f4f6;--page-flat:#f3f4f6}
*{box-sizing:border-box}html,body{margin:0;color-scheme:var(--scheme)}
html{background:var(--html-bg)}
body{color:var(--text);font-family:'Be Vietnam Pro','Segoe UI',Arial,sans-serif;min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body,input,select,textarea,button{font-family:'Be Vietnam Pro','Segoe UI',Arial,sans-serif}
/* Nền: MỘT lớp cố định vẽ sẵn. Trước đây dùng background-attachment:fixed + hai đốm filter:blur + kính backdrop-filter
   trên mọi thẻ: máy yếu (card đồ họa bị tắt) phải vẽ lại cả màn hình mỗi lần cuộn → giật, có máy không tải nổi. */
body:before{content:'';position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background:var(--page-bg)}
#app,#login-screen{position:relative;z-index:1}
.hidden{display:none!important}
.stripes{position:relative;z-index:1;height:2px;background:linear-gradient(90deg,transparent,#e7be78 20%,#fff8e8 48%,#bcb7c9 76%,transparent);box-shadow:0 0 18px rgba(242,209,154,.75)}

/* ---- bề mặt "kính" dùng chung: nền bán trong suốt, KHÔNG backdrop-filter (nền phía sau là dải màu mượt nên nhìn gần như cũ) ---- */
header,nav,.card,.stat,.login-box,.modal-box{position:relative;background:var(--glass-bg);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow)}
header,.stat,.login-box,.modal-box{overflow:hidden}
header:after,.card:after,.stat:after,.login-box:after,.modal-box:after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;pointer-events:none;background:var(--glass-shine)}
.gmm-switcher summary,.gmm-switcher-links,.gmm-feedback{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}

/* ---- header ---- */
header{width:min(1080px,calc(100% - 28px));margin:18px auto 10px;padding:17px 20px;border-radius:26px;display:flex;gap:12px;justify-content:space-between;align-items:center}
h1{font-size:20px;margin:0;letter-spacing:.4px}
.brand{display:flex;align-items:center;gap:9px}.brand h1{font-weight:700;letter-spacing:-.25px;color:var(--text);text-shadow:var(--title-glow)}
.dot{width:10px;height:10px;border-radius:50%;background:linear-gradient(145deg,#ff7e8b,#ff3f62);box-shadow:inset 0 1px 1px rgba(255,255,255,.72),0 0 0 4px rgba(255,74,94,.2),0 0 18px rgba(255,64,93,.62)}
.subtitle,.muted{color:var(--muted);font-size:12.5px}.subtitle{margin-top:5px;color:var(--text2)}
.header-identity{display:flex;align-items:center;gap:15px;min-width:0}.header-copy{min-width:0}
.company-logo{display:block;height:auto;object-fit:contain}
.header-logo{width:128px;max-height:54px;padding-right:15px;border-right:1px solid rgba(var(--tint),.22)}
.userbar{display:flex;align-items:center;gap:8px}
.pill{padding:5px 9px;border-radius:20px;font-size:12px;background:rgba(var(--tint),.11);border:1px solid rgba(var(--tint),.17);color:var(--text2);box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.icon-btn,.ghost{position:relative;border:1px solid rgba(var(--tint),.25);background:linear-gradient(145deg,rgba(var(--tint),.17),rgba(var(--tint),.065));color:var(--text);border-radius:16px;padding:8px 10px;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.42),inset 0 -1px 0 rgba(var(--tint),.05),0 8px 20px rgba(0,13,60,.2);transition:transform .18s,filter .18s,box-shadow .18s}
.icon-btn{width:34px;height:34px;padding:0;border-radius:50%;display:inline-grid;place-items:center;font-size:15px}
.icon-btn:hover,.ghost:hover{transform:translateY(-1px);filter:brightness(1.12)}
.bell-wrap{position:relative}
.notice-dot{position:absolute;right:-4px;top:-4px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--red);color:#2b0d08;font-size:10px;font-weight:800;display:grid;place-items:center;pointer-events:none}

/* ---- nav: hai tab lớn ---- */
nav{display:flex;overflow-x:auto;position:sticky;top:10px;z-index:10;width:min(940px,calc(100% - 28px));margin:0 auto;padding:6px;border-radius:20px;background:var(--nav-bg)} /* dính đầu trang, nội dung cuộn bên dưới: nền gần đặc thay cho làm mờ */
nav button{flex:1;min-width:92px;border:1px solid transparent;border-radius:15px;background:none;color:var(--muted);padding:14px 12px;font-weight:700;font-size:15px;cursor:pointer;white-space:nowrap;transition:background .2s,transform .2s,color .2s,box-shadow .2s}
nav button:hover{background:rgba(var(--tint),.09);color:var(--text)}
nav button.active{color:var(--text);border-color:rgba(var(--tint),.32);background:linear-gradient(145deg,rgba(var(--accent-rgb),.25),rgba(var(--tint),.06));box-shadow:inset 0 1px 0 rgba(255,250,240,.42),0 7px 20px rgba(35,25,22,.27);transform:translateY(-1px)}
nav button.small-tab{flex:0 0 auto;font-size:13px;color:var(--muted)}

/* ---- main, card, layout ---- */
main{max-width:1080px;margin:auto;padding:22px 14px 70px}
.panel{display:none}.panel.active{display:block}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.stat{border-radius:22px;padding:17px}.stat b{display:block;font-size:28px;margin-top:7px;background:linear-gradient(180deg,var(--text),var(--heading));-webkit-background-clip:text;background-clip:text;color:transparent}
.card{border-radius:26px;padding:19px;margin:12px 0}
.card h3{font-size:13px;color:var(--text2);text-transform:uppercase;letter-spacing:.8px;margin:0 0 13px;font-weight:700}
/* Cài đặt → Giá trị thiết bị (18/10/2026): ô tổng + thanh ngang một màu nhấn (độ dài = giá trị, số ghi bên cạnh bằng màu chữ) */
.val-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 4px}
.val-tile{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:14px;border:1px solid rgba(var(--tint),.14);background:rgba(var(--tint),.06);min-width:0}
.val-label{font-size:11.5px;color:var(--text2)}.val-num{font-size:22px;font-weight:800;color:var(--text);line-height:1.25;font-variant-numeric:tabular-nums;white-space:nowrap}.val-of{font-size:14px;font-weight:600;color:var(--text2)}.val-sub{font-size:11.5px;color:var(--text2)}
.vb-list{display:flex;flex-direction:column;gap:9px;margin:6px 0 4px}
.vb-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:12.5px}.vb-name{color:var(--text);font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vb-val{color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}
.vb-track{height:8px;margin-top:4px;border-radius:4px;background:rgba(var(--tint),.08);overflow:hidden}.vb-fill{display:block;height:100%;border-radius:4px;background:rgb(var(--accent-rgb))}
.val-top .rowline{align-items:center}.val-rank{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-right:8px;border-radius:6px;background:rgba(var(--tint),.1);font-size:11px;font-weight:700;color:var(--text2)}
.val-price{font-weight:700;color:var(--text);white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right}
.val-miss-q{margin:10px 0 6px}
.val-miss-grp{border-top:1px solid rgba(var(--tint),.12)}.val-miss-grp:first-of-type{border-top:0}
.val-miss-grp>summary{display:flex;align-items:baseline;gap:10px;padding:10px 2px;cursor:pointer;list-style:none}.val-miss-grp>summary::-webkit-details-marker{display:none}
.val-miss-grp>summary:before{content:'';flex:none;width:6px;height:6px;margin-right:2px;border-right:2px solid var(--text2);border-bottom:2px solid var(--text2);transform:rotate(-45deg);transition:transform .18s ease;align-self:center}
.val-miss-grp[open]>summary:before{transform:rotate(45deg)}
.val-miss-cat{font-weight:700;color:var(--text);font-size:13px}.val-miss-n{margin-left:auto;font-size:12px;color:var(--text2);white-space:nowrap}
.val-miss-list{list-style:none;margin:0 0 10px;padding:0 0 0 16px;columns:3 220px;column-gap:24px}
.val-miss-list li{break-inside:avoid;display:flex;align-items:baseline;gap:6px;padding:3px 0;font-size:12.5px;color:var(--text2);line-height:1.45}
.val-miss-list li[hidden],.val-miss-grp[hidden]{display:none}
.val-miss-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.val-miss-qty{flex:none;font-size:11.5px;color:var(--text2);opacity:.85}
@media(max-width:720px){.val-miss-list{columns:1;padding-left:8px}}
@media(prefers-reduced-motion:reduce){.val-miss-grp>summary:before{transition:none}}
@media(max-width:720px){.val-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.val-num{font-size:19px}.val-top .rowline{flex-wrap:wrap}.val-price{text-align:left}}
/* Thẻ thu gọn được (18/10/2026, "Bộ lọc" ở cột trái Quản lý lịch): cả tiêu đề là nút, mũi tên xoay; thu gọn thì ẩn nội dung, tiêu đề ghi số bộ lọc đang bật */
.fold-btn{display:flex;align-items:center;gap:8px;width:100%;padding:0;margin:0;border:0;background:none;box-shadow:none;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;text-align:left;cursor:pointer}
.fold-count{font-size:11px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--heading)}
.fold-chev{margin-left:auto;width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(225deg);transition:transform .2s ease;flex:none}
.fold-card.folded .fold-chev{transform:rotate(45deg) translate(-2px,-2px)}
.fold-card.folded>h3{margin-bottom:0}.fold-card.folded>#mg-filter-slot{display:none}
.fold-btn:hover{color:var(--text)}
@media(prefers-reduced-motion:reduce){.fold-chev{transition:none}}
.row{display:flex;gap:10px}.row>*{flex:1}
label{display:block;font-size:12px;color:var(--muted);margin:11px 0 6px}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.section-head h3{margin:0}
.group-title{font-size:12px;color:var(--heading);text-transform:uppercase;letter-spacing:.7px;border-bottom:1px solid rgba(var(--tint),.14);padding:13px 0 6px;margin-bottom:4px}
.empty{text-align:center;padding:27px 8px;color:var(--muted);font-size:13px}
.actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px;align-items:center}.actions .btn{width:auto}
.split{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:space-between}
.stack{display:flex;flex-direction:column;gap:8px}
.small{font-size:12px}.right{text-align:right}
.kbd{font-family:ui-monospace,Consolas,monospace;font-size:12px;background:rgba(0,0,0,.25);padding:2px 6px;border-radius:6px}
.rowline{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid rgba(var(--tint),.13)}
.rowline .name{font-weight:700}.rowline .meta{font-size:12px;color:var(--muted);margin-top:4px}

/* ---- nút ---- */
.btn{position:relative;border:1px solid rgba(var(--tint),.4);border-radius:16px;padding:11px 14px;background:var(--btn-bg);color:var(--btn-text);font-weight:800;cursor:pointer;text-shadow:0 1px 0 rgba(255,255,255,.32);box-shadow:inset 0 1px 0 rgba(255,255,255,.42),inset 0 -1px 0 rgba(var(--tint),.05),0 8px 20px rgba(0,13,60,.2);transition:transform .18s,filter .18s,box-shadow .18s}
.btn:hover{transform:translateY(-1px);filter:brightness(1.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 12px 26px rgba(0,19,78,.25)}
.btn.ghost{background:linear-gradient(145deg,rgba(var(--tint),.17),rgba(var(--tint),.065));color:var(--text);border-color:rgba(var(--tint),.25);text-shadow:none}
.btn.green{background:linear-gradient(135deg,#a5e3c7,#75c5a2)}.btn.blue{background:linear-gradient(135deg,#e5d3ba,#aaa6b4)}
.btn.small{padding:7px 10px;font-size:12px;border-radius:12px}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none;filter:none}
.danger-btn{background:rgba(178,54,60,.24)!important;color:var(--err-text)!important;border-color:var(--red)!important}
.btn.loading,.icon-btn.loading{color:transparent!important;pointer-events:none}
.btn.loading:after,.icon-btn.loading:after{content:'';position:absolute;top:50%;left:50%;width:17px;height:17px;margin:-9px 0 0 -9px;border-radius:50%;border:2.5px solid rgba(0,0,0,.2);border-top-color:rgba(255,255,255,.95);animation:btn-spin .7s linear infinite}
@keyframes btn-spin{to{transform:rotate(360deg)}}

/* ---- ô nhập ---- */
input,select,textarea{width:100%;position:relative;border:1px solid rgba(var(--tint),.2);background:linear-gradient(145deg,rgba(var(--tint),.12),rgba(var(--tint),.055));color:var(--text);border-radius:15px;padding:10px 11px;font:inherit;box-shadow:inset 0 1px 0 rgba(255,250,239,.13),0 7px 18px rgba(37,27,24,.13)}
textarea{resize:vertical;min-height:68px}
input::placeholder,textarea::placeholder{color:var(--faint)}
input:focus,select:focus,textarea:focus,button:focus-visible{outline:none;border-color:rgba(var(--accent-rgb),.78);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 0 3px rgba(var(--accent-rgb),.18),0 8px 24px rgba(56,38,26,.2)}
select option{background:var(--menu-solid);color:var(--text)}
input:disabled,select:disabled,textarea:disabled{opacity:.55;cursor:not-allowed}
input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--accent);box-shadow:none}
input[type=date],input[type=time]{color-scheme:var(--scheme)}
.check{display:flex;align-items:center;gap:8px;font-size:13px;margin:8px 0;cursor:pointer}.check input{width:auto;margin:0}
.field-hint{font-size:11px;color:var(--faint);margin-top:4px}

/* ---- thẻ trạng thái, cảnh báo, lỗi ---- */
.tag{display:inline-block;border-radius:20px;padding:4px 8px;font-size:11.5px;font-weight:700;border:1px solid rgba(var(--tint),.12);box-shadow:inset 0 1px 0 rgba(var(--tint),.12);white-space:nowrap}
.tag.green{background:rgba(73,172,130,.22);color:var(--green)}.tag.red{background:rgba(211,70,73,.23);color:var(--red)}.tag.amber{background:rgba(218,174,105,.22);color:var(--amber)}.tag.blue{background:rgba(165,157,180,.23);color:var(--text2)}.tag.gray{background:rgba(var(--tint),.08);color:var(--muted)}
.alert{background:linear-gradient(145deg,rgba(var(--accent-rgb),.23),rgba(169,126,69,.09));border:1px solid rgba(var(--accent-rgb),.38);color:var(--alert-text);padding:10px 12px;border-radius:9px;margin:10px 0;font-size:13px}
.alert a{color:var(--link)}
.alert.ok{background:rgba(131,217,178,.12);border-color:rgba(131,217,178,.36);color:#e2f6ec} /* báo thành công (danh bạ liên kết Sheet, kiểm tra Apps Script) */
.error{display:none;background:rgba(255,65,91,.18);color:var(--err-text);border:1px solid rgba(255,111,131,.52);padding:9px 11px;border-radius:9px;margin-top:10px;font-size:13px}.error.show{display:block}

/* ---- modal, login, toast ---- */
.modal{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay);display:flex;align-items:center;justify-content:center;padding:16px;z-index:30}
.modal-box{background:var(--modal-bg);border-radius:16px;padding:18px;width:min(720px,100%);max-height:92vh;max-height:calc(100dvh - 32px);overflow:auto} /* dvh: điện thoại có thanh địa chỉ thì 92vh cao hơn màn hình thật, khung bị cắt phía trên */
.modal h2{font-size:18px;margin:0 0 10px}
.login{min-height:calc(100vh - 2px);display:grid;place-items:center;padding:18px}
.login-box{width:min(390px,100%);border-radius:30px;padding:28px}.login h1{margin:0 0 6px}
.login-brand-block{display:flex;flex-direction:column;align-items:center;gap:9px;margin-bottom:27px}
.login-logo{width:min(220px,78%);max-height:100px;margin:0 auto 3px}
.login-brand-block>.brand{justify-content:center}.login-brand-block>.muted{text-align:center;margin:2px 0 0;line-height:1.55}.login-brand-block+label{margin-top:0}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translate(-50%,10px);background:var(--btn-bg);color:var(--btn-text);padding:10px 17px;border-radius:25px;font-weight:700;opacity:0;pointer-events:none;transition:.2s;z-index:50;max-width:calc(100vw - 32px);text-align:center} /* iPhone (viewport-fit=cover): thông báo nổi nằm trên thanh vuốt về màn hình chính (24/10/2026) */
.toast.show{opacity:1;transform:translate(-50%,0)}.toast.bad{background:var(--red);color:#2b0d08}

/* ================= QUANLY ================= */
.seg{display:inline-flex;gap:4px;padding:4px;border-radius:14px;background:rgba(var(--tint),.08);border:1px solid rgba(var(--tint),.14);flex-wrap:wrap}
.seg button{border:0;background:none;color:var(--muted);padding:7px 12px;border-radius:11px;font-weight:600;cursor:pointer;font-size:13px;white-space:nowrap}
.seg button.active{background:linear-gradient(145deg,rgba(var(--accent-rgb),.28),rgba(var(--tint),.06));color:var(--text);box-shadow:inset 0 1px 0 rgba(255,250,240,.4)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:20px;border:1px solid rgba(var(--tint),.2);background:rgba(var(--tint),.07);color:var(--text2);font-size:12.5px;font-weight:600;cursor:pointer}
.chip .swatch{width:9px;height:9px;border-radius:50%;background:var(--pc)}
.chip.active{border-color:var(--pc);background:rgba(var(--accent-rgb),.22);background:color-mix(in srgb,var(--pc) 30%,transparent);color:#fff}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
.form-grid .full{grid-column:1/-1}
.form-grid label{margin-top:12px}
.fieldset{margin-top:4px}
.fieldset.collapsed .form-grid{display:none}
.fieldset .group-title{cursor:pointer;user-select:none}.fieldset.collapsible .group-title:before{content:'▾ ';font-size:11px}.fieldset.collapsed .group-title:before{content:'▸ '}
.readonly-note{font-size:11px;color:var(--faint)}

/* chọn nhiều người */
.picker{position:relative}
.picker-box{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-height:44px;padding:5px 8px;border:1px solid rgba(var(--tint),.2);border-radius:15px;background:linear-gradient(145deg,rgba(var(--tint),.12),rgba(var(--tint),.055));box-shadow:inset 0 1px 0 rgba(255,250,239,.13),0 7px 18px rgba(37,27,24,.13)}
.picker-box:focus-within{border-color:rgba(var(--accent-rgb),.78);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 0 3px rgba(var(--accent-rgb),.18)}
.picker-box input{flex:1;min-width:120px;width:auto;border:0;background:none;box-shadow:none;padding:5px 4px;border-radius:0}
.picker-box input:focus{outline:none;box-shadow:none;border:0}
.picker.disabled .picker-box{opacity:.6}.picker.disabled .picker-box input{display:none}
.pchip{display:inline-flex;align-items:center;gap:5px;padding:4px 6px 4px 10px;border-radius:16px;background:rgba(var(--accent-rgb),.22);border:1px solid rgba(var(--accent-rgb),.35);color:var(--link);font-size:12.5px;font-weight:600;line-height:1.3}
.pchip.team{background:rgba(165,157,180,.25);border-color:rgba(165,157,180,.4)}.pchip.external{background:rgba(131,217,178,.16);border-color:rgba(131,217,178,.35)}
.pchip button{border:0;background:rgba(0,0,0,.22);color:#fff;width:18px;height:18px;border-radius:50%;cursor:pointer;font-size:11px;line-height:1;display:grid;place-items:center;padding:0;box-shadow:none}
.picker.disabled .pchip button{display:none}
.picker-menu{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;max-height:240px;overflow:auto;padding:6px;border-radius:16px;border:1px solid rgba(var(--tint),.3);background:var(--modal-bg);box-shadow:0 16px 40px rgba(32,23,20,.35)}
.picker-menu button{display:flex;width:100%;justify-content:space-between;align-items:center;gap:8px;border:0;background:none;color:var(--text);padding:9px 10px;border-radius:10px;cursor:pointer;text-align:left;font-size:13px;box-shadow:none}
.picker-menu button:hover,.picker-menu button.hl{background:rgba(var(--tint),.12)}
.picker-menu .meta{font-size:11px;color:var(--muted)}
/* Gợi ý ô Địa điểm (28/10/2026): Google Maps / OpenStreetMap, nút ghim mở Google Maps */
.place-pick{position:relative}.place-pick>input{padding-right:46px}
.place-map{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:36px;height:36px;display:grid;place-items:center;border-radius:50%;color:var(--link);text-decoration:none}
.place-map:hover,.place-map:focus-visible{background:rgba(var(--tint),.12)}.place-map.empty{opacity:.45}.place-map .gi{font-size:20px}
.place-pick .picker-menu button{align-items:flex-start}.place-main{display:flex;flex-direction:column;gap:2px;min-width:0}.place-main b{font-weight:600}
.place-src{font-size:10.5px;color:var(--muted);text-align:right;padding:4px 8px 2px}
.place-pick .picker-menu button>.gi{flex:none;font-size:17px;color:var(--muted);margin-top:1px}.place-pick .picker-menu button .place-main{flex:1}.place-n{flex:none;white-space:nowrap;margin-top:2px}
.picker-menu .none{padding:9px 10px;font-size:12px;color:var(--muted)}

/* thanh công cụ quản lý */
.mtoolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.mtoolbar .grow{flex:1;min-width:150px}
.mtoolbar input,.mtoolbar select{width:auto;min-width:0;padding:8px 10px;font-size:13px}
.mtoolbar .check{margin:0}
.monthnav{display:inline-flex;align-items:center;gap:4px}
.monthnav b{min-width:140px;text-align:center;font-size:14px}
.monthnav .icon-btn{width:30px;height:30px;font-size:13px}
.result-box{margin-top:12px;padding:12px 14px;border-radius:16px;background:rgba(131,217,178,.12);border:1px solid rgba(131,217,178,.3);font-size:13px;display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:space-between}

/* lịch tháng */
.cal-head{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-bottom:6px}
.cal-head div{font-size:11px;text-transform:uppercase;letter-spacing:.7px;color:var(--heading);text-align:center;padding:4px 0}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.cal-cell{min-height:108px;padding:6px;border-radius:14px;border:1px solid rgba(var(--tint),.12);background:rgba(var(--tint),.05);display:flex;flex-direction:column;gap:4px;min-width:0}
.cal-cell.other{opacity:.45}
.cal-cell.today{border-color:rgba(var(--accent-rgb),.6);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.3)}
.cal-cell.drop,.kcol.drop,.week-col.drop{outline:2px dashed var(--accent);outline-offset:-2px}
.cal-day{font-size:12px;font-weight:700;color:var(--muted);display:flex;justify-content:space-between}
.cal-cell.today .cal-day{color:var(--heading)}
/* Hôm nay dễ thấy (18/10/2026, người dùng: "khi nhìn lịch tôi phải đi tìm ngày hôm nay"): ô nhuốm màu nhấn + số ngày trong nhãn "Hôm nay"; tên thứ của cột cũng tô màu.
   Dùng chung cho lịch tháng, lịch tuần và lịch Nghỉ phép. Nhãn cao 17px để không đổi chiều cao hàng số ngày (lịch vừa khít màn hình tính theo nó). */
.cal-cell.today{background:rgba(var(--accent-rgb),.13);border-color:rgba(var(--accent-rgb),.85);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.45),0 0 18px rgba(var(--accent-rgb),.16)}
.cal-cell.today .cal-day>span:first-child{display:inline-flex;align-items:center;gap:5px;padding:0 7px;border-radius:8px;background:var(--accent);color:var(--btn-text);line-height:17px;font-weight:800}
.cal-cell.today .cal-day>span:first-child::after{content:'Hôm nay';font-size:10px;font-weight:700;letter-spacing:.2px;white-space:nowrap}
.cal-head div.today{color:var(--accent);font-weight:800}
.cal-cell.today .cal-more-l{display:none} /* ô hôm nay: nhãn "Hôm nay" chiếm chỗ → "+3 mục nữa" rút còn "+3" */
.week-col.today{background:rgba(var(--accent-rgb),.12);border-color:rgba(var(--accent-rgb),.85);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.4)}
.week-col.today h4{color:var(--accent)}
.week-col.today h4::after{content:'Hôm nay';display:inline-block;margin-top:3px;padding:0 7px;border-radius:8px;background:var(--accent);color:var(--btn-text);font-size:10px;line-height:16px;letter-spacing:.2px;text-transform:none}
@media(max-width:900px){.cal-cell.today .cal-day>span:first-child::after{content:none}.cal-cell.today .cal-day>span:first-child{padding:0 5px}}
.cal-more{font-size:11px;color:var(--muted);cursor:pointer;background:none;border:0;padding:2px;text-align:left;box-shadow:none}
.tchip{display:flex;gap:5px;align-items:center;padding:4px 7px;border-radius:9px;background:rgba(0,0,0,.3);background:color-mix(in srgb,var(--pc) 32%,rgba(0,0,0,.28));border-left:3px solid var(--pc);color:#fff;font-size:11.5px;line-height:1.3;cursor:pointer;min-width:0}
.tchip:hover{filter:brightness(1.15)}
.tchip .t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.tchip .time{font-size:10px;color:#fce6c4;font-weight:700;flex:none}
.tchip.deadline{background:rgba(0,0,0,.18);border:1px dashed rgba(255,125,128,.6);border-left:3px solid rgba(255,125,128,.8);color:var(--err-text)}
.tchip.cancelled{opacity:.5}.tchip.cancelled .t{text-decoration:line-through}
.tchip[draggable=true]{cursor:grab}.dragging{opacity:.4}
.unscheduled{margin-top:12px}.unscheduled .chips .tchip{display:inline-flex;max-width:280px}

/* lịch tuần */
.week-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.week-col{border-radius:16px;border:1px solid rgba(var(--tint),.12);background:rgba(var(--tint),.05);padding:8px;min-height:220px;display:flex;flex-direction:column;gap:6px;min-width:0}
.week-col h4{margin:0 0 4px;font-size:11px;color:var(--heading);text-transform:uppercase;letter-spacing:.6px}
.week-col h4 span{display:block;font-size:18px;color:var(--text);letter-spacing:0}
.wcard{padding:8px 9px;border-radius:12px;background:rgba(0,0,0,.28);background:color-mix(in srgb,var(--pc) 24%,rgba(0,0,0,.25));border-left:3px solid var(--pc);cursor:grab;font-size:12.5px}
.wcard .t{font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.wcard .meta{font-size:11px;color:var(--text2);margin-top:3px}
.wcard.cancelled{opacity:.5}.wcard.cancelled .t{text-decoration:line-through}

/* kanban */
.board{display:flex;gap:12px;overflow-x:auto;padding-bottom:10px;align-items:flex-start}
.kcol{flex:0 0 262px;border-radius:18px;border:1px solid rgba(var(--tint),.14);background:rgba(var(--tint),.05);display:flex;flex-direction:column;max-height:72vh}
.kcol h4{margin:0;padding:11px 13px 9px;font-size:12px;text-transform:uppercase;letter-spacing:.7px;color:var(--heading);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(var(--tint),.12)}
.kcol h4 span{font-size:11px;padding:1px 7px;border-radius:10px;background:rgba(var(--tint),.1);color:var(--muted)}
.kbody{padding:10px;display:flex;flex-direction:column;gap:8px;overflow-y:auto;min-height:60px}
.kcard{padding:10px 11px;border-radius:14px;background:rgba(20,14,12,.38);background:color-mix(in srgb,var(--pc) 18%,rgba(20,14,12,.35));border:1px solid rgba(var(--tint),.12);border-left:3px solid var(--pc);cursor:grab;font-size:12.5px}
.kcard .t{font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.kcard .meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px;font-size:11px;color:var(--text2)}
.kcard.cancelled{opacity:.5}.kcard.cancelled .t{text-decoration:line-through}
.avatars{display:flex;gap:3px}
.av{width:20px;height:20px;border-radius:50%;background:rgba(var(--accent-rgb),.35);border:1px solid rgba(var(--tint),.3);font-size:9.5px;font-weight:800;display:grid;place-items:center;color:var(--text)}

/* bảng */
.tbl-wrap{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.tbl th{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--heading);text-align:left;padding:8px;border-bottom:1px solid rgba(var(--tint),.18);white-space:nowrap}
.tbl td{padding:9px 8px;border-bottom:1px solid rgba(var(--tint),.1);vertical-align:top}
.tbl tr.row-click{cursor:pointer}.tbl tr.row-click:hover td{background:rgba(var(--tint),.05)}
.tbl .t{font-weight:700}
.tbl td.tbl-prog-cell{box-shadow:inset 4px 0 0 var(--pc);padding-left:12px;min-width:104px} /* Bảng: dải màu chương trình đầu dòng (05/10/2026) */
.tbl-prog{display:flex;align-items:center;width:max-content;max-width:160px;padding:3px 9px 3px 7px;border-radius:10px;background:rgba(var(--tint),.08);background:color-mix(in srgb,var(--pc) 20%,transparent);border:1px solid rgba(var(--tint),.18);border-color:color-mix(in srgb,var(--pc) 55%,transparent);color:var(--text);font-size:12px;font-weight:700;line-height:1.3}
.tbl-prog .side-dot{flex:none}.tbl-prog+.tbl-prog{margin-top:4px;font-weight:600}
/* Bảng vừa khung (05/10/2026): cột theo %, không cuộn ngang trên máy tính; điện thoại vẫn kéo ngang */
.tbl-fit{table-layout:fixed}
.tbl-fit th{white-space:normal;line-height:1.25;letter-spacing:.3px;padding:8px 5px;vertical-align:bottom}
.tbl-fit td{padding:9px 5px;overflow-wrap:anywhere;word-break:normal}
.tbl-fit td.tbl-prog-cell{min-width:0;padding-left:10px}
.tbl-fit .tbl-prog{width:auto;max-width:100%;display:inline-flex;align-items:flex-start;gap:0}
.tbl-fit .tbl-prog .side-dot{margin-top:4px}
.tbl-fit .tag{white-space:normal;padding:3px 7px;font-size:11px;line-height:1.3}
.tbl-fit .tbl-dl{margin-top:4px}
.tbl tr.is-today td{background:rgba(var(--accent-rgb),.11)}.tbl tr.is-today.row-click:hover td{background:rgba(var(--accent-rgb),.17)} /* việc ghi hình hôm nay */
.tbl tr.is-today td:nth-child(4){font-weight:700;color:var(--heading)}
.tbl-today{display:block;width:fit-content;margin-bottom:3px;padding:1px 7px;border-radius:8px;background:rgba(var(--accent-rgb),.28);color:var(--link);font-size:10.5px;font-weight:800;letter-spacing:.2px}
.tbl-fit .tbl-sync .sync{display:flex;width:fit-content;max-width:100%;margin:0 0 4px;padding:1px 5px;font-size:10.5px;white-space:normal}
@media (max-width:900px){.tbl-fit{table-layout:auto;min-width:860px}}
@media (min-width:1280px) and (max-width:1599px){ /* màn vừa: Bảng chiếm cả chỗ cột phải (Hôm nay / Deadline) để đủ rộng */
 .panel.side3.active#panel-manage.view-table{grid-template-columns:210px minmax(0,1fr)}
 #panel-manage.view-table>.side-r{display:none}
}
.sync{display:inline-flex;align-items:center;gap:4px;font-size:11px;padding:2px 7px;border-radius:10px;background:rgba(var(--tint),.08);color:var(--muted);white-space:nowrap}
.sync.ok{background:var(--green2);color:var(--green)}.sync.pending{background:var(--amber2);color:var(--amber)}.sync.err{background:var(--red2);color:var(--red)}.sync.off{opacity:.55}
.sync-row{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 4px}

/* cài đặt */
.subnav{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.subnav button{border:1px solid rgba(var(--tint),.18);background:rgba(var(--tint),.06);color:var(--muted);padding:8px 13px;border-radius:12px;cursor:pointer;font-weight:600;font-size:13px}
.subnav button.active{background:linear-gradient(145deg,rgba(var(--accent-rgb),.25),rgba(var(--tint),.06));color:var(--text);border-color:rgba(var(--tint),.32)}
.matrix{width:100%;border-collapse:collapse;font-size:12px}
.matrix th,.matrix td{padding:5px 6px;border-bottom:1px solid rgba(var(--tint),.1);text-align:center}
.matrix td:first-child,.matrix th:first-child{text-align:left}
.matrix input[type=radio]{margin:0}
.notice-item{display:block;width:100%;text-align:left;border:0;background:rgba(var(--tint),.06);border-radius:12px;padding:10px 12px;margin-bottom:6px;color:var(--text);cursor:pointer;font-size:13px;box-shadow:none}
.notice-item.unread{border-left:3px solid var(--amber)}
.notice-item .meta{font-size:11px;color:var(--muted);margin-top:3px}
.hist{border-left:2px solid rgba(var(--tint),.2);padding-left:12px;margin:10px 0}
.hist .when{font-size:11px;color:var(--muted)}.hist .chg{font-size:12.5px;margin-top:3px}.hist .chg b{color:var(--heading)}
.hist .old{color:var(--faint);text-decoration:line-through}
.dropzone{border:1px dashed rgba(var(--tint),.35);border-radius:16px;padding:14px;text-align:center;color:var(--muted);font-size:13px;margin-bottom:10px}
.swatch-input{display:flex;gap:8px;align-items:center}.swatch-input input[type=color]{width:44px;height:38px;padding:2px}
.log-row{padding:8px 0;border-bottom:1px solid rgba(var(--tint),.1);font-size:12.5px}.log-row .meta{font-size:11px;color:var(--muted)}
.contacts{margin:6px 0 2px;padding:8px 12px;border-radius:14px;background:rgba(var(--tint),.06);border:1px solid rgba(var(--tint),.12);font-size:12.5px}
.contacts>summary{cursor:pointer;color:var(--heading);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.6px}
.contact-row{display:flex;gap:6px 12px;flex-wrap:wrap;align-items:baseline;padding:7px 0;border-bottom:1px solid rgba(var(--tint),.08)}.contact-row:last-child{border-bottom:0}
.contact-row a{color:var(--link);text-decoration:none;white-space:nowrap}.contact-row a:hover{text-decoration:underline}
/* danh bạ chỉ xem (nút 📇 cạnh chuông) */
.modal-box.dir-box{display:flex;flex-direction:column;overflow:hidden}
.dir-head{display:flex;align-items:center;gap:10px}.dir-head h2{margin:0;flex:1}.dir-head .icon-btn{flex:none}
#dir-q{margin:10px 0 8px;flex:none}
.dir-filter{--pc:var(--accent);margin-bottom:10px;flex:none}.dir-filter .chip{font:inherit;font-size:12.5px;font-weight:600}
#dir-list{display:flex;flex-direction:column;gap:6px;flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;margin:0 -4px;padding:0 4px}
.dir-box>.actions{flex:none;margin-top:10px}
@media(max-width:720px){.dir-filter{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -14px 10px;padding:0 14px}.dir-filter::-webkit-scrollbar{display:none}.dir-filter .chip{flex:none}}
.dir-row{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:14px;background:rgba(var(--tint),.06);border:1px solid rgba(var(--tint),.1)}
.dir-row.me{border-color:rgba(var(--accent-rgb),.45)}
.dir-av{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(var(--accent-rgb),.3);border:1px solid rgba(var(--tint),.3);font-size:12px;font-weight:800;color:var(--text)}
.dir-main{flex:1;min-width:0}
.dir-name{font-weight:700;font-size:14px;overflow-wrap:anywhere}
.dir-roles{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.dir-links{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:6px;font-size:13px}
.dir-links a{color:var(--link);text-decoration:none;overflow-wrap:anywhere}.dir-links a:hover{text-decoration:underline}
/* xem một ngày theo giờ (bấm ô ngày ở lịch tháng / tiêu đề cột ở lịch tuần). Độ rộng --day-w do quanly.js đặt theo số lịch trùng giờ */
.cal-cell{cursor:pointer}.cal-cell:hover{border-color:rgba(var(--accent-rgb),.5)}
.week-col h4[data-day]{cursor:pointer}.week-col h4[data-day]:hover span{color:var(--heading)}
.modal-box.day-box{display:flex;flex-direction:column;overflow:hidden;width:min(var(--day-w,440px),100%)}
#day-view{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
.day-head{display:flex;align-items:center;gap:8px;flex:none}.day-head .icon-btn{flex:none;width:32px;height:32px}
.day-title{flex:1;min-width:0;text-align:center}.day-title h2{margin:0;font-size:17px}.day-title .tag{font-size:11px;vertical-align:middle}
.day-allday{flex:none;display:flex;flex-direction:column;gap:4px;margin-top:10px;padding:8px 10px;border-radius:12px;background:rgba(var(--tint),.05);border:1px solid rgba(var(--tint),.1)}
.day-allday .lbl{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);font-weight:700}
.day-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;margin-top:6px;padding:10px 0}
.day-grid{position:relative}
.day-hour{position:absolute;left:52px;right:0;height:0;border-top:1px solid rgba(var(--tint),.16)}
.day-hour.half{border-top:1px dashed rgba(var(--tint),.08)}
.day-hour span{position:absolute;left:-52px;top:-8px;width:44px;text-align:right;font-size:11px;line-height:16px;color:var(--muted);font-variant-numeric:tabular-nums}
.day-evs{position:absolute;top:0;bottom:0;left:56px;right:0}
.dev{position:absolute;overflow:hidden;padding:3px 7px;border-radius:8px;background:rgba(0,0,0,.3);background:color-mix(in srgb,var(--pc) 34%,rgba(0,0,0,.3));border-left:3px solid var(--pc);color:#fff;font-size:12px;line-height:1.3;cursor:pointer;box-shadow:0 0 0 1px rgba(var(--tint),.1)}
.dev:hover{filter:brightness(1.12);z-index:2}
.dev span{display:block}.dev .dt{font-size:10.5px;font-weight:700;opacity:.85;font-variant-numeric:tabular-nums}
.dev .tt{font-weight:700;overflow-wrap:anywhere}.dev .mm{font-size:11px;opacity:.85;margin-top:2px;overflow-wrap:anywhere}
.dev.one{display:flex;align-items:center;gap:6px;white-space:nowrap;padding-top:1px;padding-bottom:1px}.dev.one .tt{overflow:hidden;text-overflow:ellipsis;min-width:0}.dev.one .dt{flex:none}
.dev.cancelled{opacity:.5}.dev.cancelled .tt{text-decoration:line-through}
.day-now{position:absolute;left:52px;right:0;height:0;border-top:2px solid var(--red);z-index:3;pointer-events:none}
.day-now:before{content:'';position:absolute;left:-5px;top:-6px;width:10px;height:10px;border-radius:50%;background:var(--red)}
.day-box .empty{margin:14px 0 4px}.day-box .actions{flex:none;margin-top:8px}
@media(max-width:720px){.day-hour{left:44px}.day-hour span{left:-44px;width:38px;font-size:10.5px}.day-evs{left:46px}.day-now{left:44px}.day-title h2{font-size:15px}.dev{font-size:11px;padding:2px 5px}.dev .tt{overflow-wrap:break-word}}

@media(max-width:900px){nav button{flex:1 0 auto}.cal-grid{gap:3px}.cal-cell{min-height:84px;padding:4px}.tchip{font-size:10.5px;padding:3px 5px}.tchip .time{display:none}}
@media(max-width:720px){
 header{flex-wrap:wrap;width:calc(100% - 20px);margin:10px auto 8px;border-radius:22px;padding:15px}
 .header-identity{gap:10px}.header-logo{width:90px;max-height:42px;padding-right:10px}.header-copy h1{font-size:16px}.header-copy .subtitle{font-size:11px}
 .userbar{margin-left:auto;flex-wrap:wrap;justify-content:flex-end}.userbar .pill{max-width:120px;overflow:hidden;text-overflow:ellipsis}
 nav{width:calc(100% - 20px);border-radius:18px;top:7px}nav button{min-width:96px;font-size:14px}
 .card{border-radius:22px;padding:15px}.grid{grid-template-columns:repeat(2,1fr);gap:8px}.row{display:block}
 .form-grid{grid-template-columns:1fr}
 .login-logo{width:min(190px,72%)}
 .cal-head div{font-size:10px}.cal-cell{min-height:64px;padding:3px;border-radius:9px;gap:2px}.cal-day{font-size:11px}
 .tchip .t{font-size:10px}
 .week-grid{grid-template-columns:1fr}.week-col{min-height:0}
 .kcol{flex-basis:230px}
 .monthnav b{min-width:110px;font-size:13px}
 .modal-box{padding:14px}
}

/* ---------- Trang Cài đặt chung quanly.gmm.vn/setting (quanly.js SETTINGS_PAGE): chỉ khung Cài đặt, nhãn nhóm trong thanh mục ---------- */
.settings-page #nav{display:none}
.subnav-sep{flex-basis:100%;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--heading);margin:6px 0 -2px}
.subnav-sep:first-child{margin-top:0}
a.icon-btn{text-decoration:none}

/* ---------- Thư mời + AI ---------- */
.ai-box{border:1px solid rgba(var(--accent-rgb),.32);background:linear-gradient(145deg,rgba(var(--accent-rgb),.13),rgba(var(--tint),.04));border-radius:18px;padding:12px 14px;margin:6px 0 12px}
.ai-head{display:flex;gap:6px 10px;flex-wrap:wrap;align-items:baseline;margin-bottom:8px}.ai-head b{color:var(--heading);font-size:15px}
.ai-drop{border:1px dashed rgba(var(--tint),.35);border-radius:14px;padding:12px;color:var(--muted);font-size:13px;display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;transition:background .15s,border-color .15s}
.ai-drop.over{background:rgba(var(--accent-rgb),.16);border-color:var(--accent);color:var(--text)}
#ai-text{margin-top:8px;width:100%}
.ai-files{display:flex;flex-direction:column;gap:6px;margin-top:8px}.ai-files:empty{display:none}
.ai-file{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:12px;background:rgba(var(--tint),.07);border:1px solid rgba(var(--tint),.14);font-size:13px;position:relative;overflow:hidden}
.ai-file.error{border-color:rgba(255,125,128,.45);background:rgba(211,70,73,.12)}
.ai-file .bar{position:absolute;left:0;bottom:0;height:3px;background:var(--btn-bg);transition:width .2s}
.nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
button.nm,.linklike{background:none;border:0;color:inherit;cursor:pointer;padding:0;font:inherit}button.nm:hover,.linklike:hover{text-decoration:underline}
.icon-x{flex:none;border:0;background:rgba(var(--tint),.09);color:var(--text);border-radius:50%;width:24px;height:24px;line-height:24px;padding:0;cursor:pointer;font-size:15px}
.icon-x:hover{background:rgba(255,125,128,.32)}
.ai-actions{margin-top:10px}
.ai-events{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin-top:6px}
.ai-ev{text-align:left;border:1px solid rgba(var(--tint),.2);background:rgba(var(--tint),.07);color:var(--text);border-radius:14px;padding:10px 12px;cursor:pointer;font:inherit;display:flex;flex-direction:column;gap:3px}
.ai-ev:hover,.ai-ev.active{border-color:var(--accent)}.ai-ev.active{background:rgba(var(--accent-rgb),.18)}.ai-ev.done{opacity:.72}
.ai-ev b{font-size:12.5px;color:var(--heading)}
.ai-done{margin-top:8px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ai-notes{margin:8px 0 0;padding-left:18px;font-size:12.5px;color:var(--text2)}
.ai-filled input,.ai-filled select,.ai-filled textarea{background:rgba(var(--accent-rgb),.17)!important;border-color:rgba(var(--accent-rgb),.6)!important}
.ai-filled>label:after{content:' ✨';font-size:11px}
.ai-unsure input,.ai-unsure select,.ai-unsure textarea{border-color:#f0a45c!important;box-shadow:0 0 0 2px rgba(240,164,92,.25)}
.ai-hint{font-size:11.5px;color:var(--warn-text);margin-top:4px}
.att-box{margin:8px 0;padding:8px 12px;border-radius:14px;background:rgba(var(--tint),.06);border:1px solid rgba(var(--tint),.12)}
.att-head{color:var(--heading);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.6px}
.att-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid rgba(var(--tint),.08);font-size:13px}
.att-row .small{white-space:nowrap}
@media (max-width:560px){.att-row{flex-wrap:wrap}.att-row .nm{flex-basis:70%}.ai-events{grid-template-columns:1fr}}
/* nhập sự kiện có sẵn từ Google Calendar */
.ci-range{align-items:flex-end;margin-top:6px}.ci-scan-wrap{flex:0 0 auto!important}
.ci-row{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:14px;background:rgba(var(--tint),.06);border:1px solid rgba(var(--tint),.1);margin-bottom:6px}
.ci-row.blocked{opacity:.6}.ci-row>input[type=checkbox]{margin-top:4px}
.ci-main{flex:1;min-width:0}.ci-when{font-size:12.5px;color:var(--heading);font-weight:600}
.ci-title{margin:6px 0}.ci-sub{display:flex;gap:6px 12px;flex-wrap:wrap;align-items:center}.ci-sub select{width:auto;max-width:100%;padding:7px 10px}
@media(max-width:720px){.ci-range{display:flex;flex-wrap:wrap;gap:8px}.ci-range>div{flex:1 1 140px}}
/* ---------- Chế độ nhẹ (html.lite): tự bật trên máy yếu hoặc bấm ở cuối trang ---------- */
/* Không chuyển động, không bóng đổ, không lớp sáng phủ thẻ, nền một dải màu; font hệ thống (index.html không tải font web). */
html.lite *,html.lite *:before,html.lite *:after{transition:none!important;animation:none!important}
html.lite .btn.loading:after,html.lite .icon-btn.loading:after{animation:btn-spin .7s linear infinite!important}
html.lite header,html.lite nav,html.lite .card,html.lite .stat,html.lite .login-box,html.lite .modal-box,html.lite .btn,html.lite .icon-btn,html.lite .ghost,html.lite input,html.lite select,html.lite textarea,html.lite nav button.active{box-shadow:none!important}
html.lite header:after,html.lite .card:after,html.lite .stat:after,html.lite .login-box:after,html.lite .modal-box:after{display:none}
html.lite body:before{background:var(--page-flat)}
html.lite .brand h1{text-shadow:none}
.app-foot{max-width:1080px;margin:-50px auto 0;padding:0 14px 70px;text-align:center;position:relative;z-index:1}
.app-foot button{font-size:12px;color:var(--muted)}
/* ---------- Giao diện sáng (Sáng, Tối giản): chỉnh các chỗ thiết kế cho nền tối ---------- */
html[data-theme=light] .company-logo,html[data-theme=minimal] .company-logo{filter:brightness(0) opacity(.8)} /* logo trắng → đen (ảnh tĩnh nhỏ, không ảnh hưởng tốc độ cuộn) */
html[data-theme=light] .btn,html[data-theme=minimal] .btn{text-shadow:none}
html[data-theme=light] .tchip,html[data-theme=minimal] .tchip{background:rgba(var(--tint),.06);background:color-mix(in srgb,var(--pc) 20%,#fff);color:var(--text)}
html[data-theme=light] .tchip .time,html[data-theme=minimal] .tchip .time{color:var(--muted)}
html[data-theme=light] .wcard,html[data-theme=minimal] .wcard,html[data-theme=light] .kcard,html[data-theme=minimal] .kcard{background:rgba(var(--tint),.05);background:color-mix(in srgb,var(--pc) 14%,#fff);color:var(--text)}
html[data-theme=light] .tchip.deadline,html[data-theme=minimal] .tchip.deadline{background:rgba(196,58,64,.07)}
html[data-theme=light] .dev,html[data-theme=minimal] .dev{background:rgba(var(--tint),.07);background:color-mix(in srgb,var(--pc) 22%,#fff);color:var(--text);box-shadow:0 0 0 1px rgba(var(--tint),.08)}
html[data-theme=light] .kbd,html[data-theme=minimal] .kbd{background:rgba(var(--tint),.08)}
html[data-theme=light] .chip.active,html[data-theme=minimal] .chip.active{color:var(--text)}
html[data-theme=light] .pchip button,html[data-theme=minimal] .pchip button{background:rgba(var(--tint),.16);color:var(--text)}
html[data-theme=light] .notice-dot,html[data-theme=minimal] .notice-dot,html[data-theme=light] .toast.bad,html[data-theme=minimal] .toast.bad{color:#fff}
html[data-theme=light] .alert.ok,html[data-theme=minimal] .alert.ok{background:rgba(40,150,100,.1);border-color:rgba(40,150,100,.3);color:#1f5f43}
html[data-theme=minimal] header,html[data-theme=minimal] .card,html[data-theme=minimal] .login-box{border-radius:14px}
html[data-theme=minimal] nav{border-radius:12px}html[data-theme=minimal] nav button,html[data-theme=minimal] .btn,html[data-theme=minimal] .icon-btn:not(.dir-close),html[data-theme=minimal] .ghost{border-radius:10px}
html[data-theme=minimal] .icon-btn{border-radius:50%}
html[data-theme=minimal] .btn,html[data-theme=minimal] .icon-btn,html[data-theme=minimal] .ghost,html[data-theme=minimal] input,html[data-theme=minimal] select,html[data-theme=minimal] textarea,html[data-theme=minimal] nav button.active{box-shadow:none}
html[data-theme=minimal] .icon-btn,html[data-theme=minimal] .ghost,html[data-theme=minimal] .btn.ghost{background:#fff;border-color:#d1d5db}
html[data-theme=minimal] input,html[data-theme=minimal] select,html[data-theme=minimal] textarea,html[data-theme=minimal] .picker-box{background:#fff;border-color:#d1d5db}
html[data-theme=minimal] .stripes{display:none}
/* thanh trượt dưới tab đang chọn (motion.css) theo màu nhấn của giao diện */
nav.m-has-pill>.m-nav-pill{border-color:rgba(var(--accent-rgb),.42)!important;background:linear-gradient(145deg,rgba(var(--accent-rgb),.24),rgba(var(--tint),.05))!important}
/* hộp chọn giao diện (nút 🎨) */
.th-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:8px 0 4px}
.th-card{border:2px solid rgba(var(--tint),.15);border-radius:16px;padding:8px;background:rgba(var(--tint),.04);cursor:pointer;text-align:left;color:var(--text);font:inherit}
.th-card.active{border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.2)}
.th-prev{height:62px;border-radius:10px;padding:8px;display:flex;flex-direction:column;gap:5px;margin-bottom:7px;border:1px solid rgba(0,0,0,.08)}
.th-prev i{display:block;height:8px;border-radius:4px}
.th-card b{display:block;font-size:13px}.th-card span{font-size:11.5px;color:var(--muted)}
.sw-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0 4px}
.sw{width:30px;height:30px;border-radius:50%;border:2px solid rgba(var(--tint),.25);cursor:pointer;padding:0;box-shadow:none}
.sw.active{outline:3px solid var(--accent);outline-offset:2px}
.sw.def{background:repeating-linear-gradient(45deg,rgba(var(--tint),.25) 0 4px,transparent 4px 8px);color:var(--text);font-size:11px;width:auto;padding:0 10px;border-radius:15px;height:30px}
.sw-custom{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}.sw-custom input{width:44px;height:32px;padding:2px;border-radius:10px}
/* ---------- Hình nền tự tải lên (html.has-bg, chọn ở nút 🎨) ---------- */
/* Ảnh phủ một lớp màu của giao diện (--bg-dim, người dùng chỉnh) để vẫn thấy ảnh mà chữ không chìm; thẻ / thanh tab đậm nền hơn. */
:root{--dim-rgb:28,22,20}html[data-theme=midnight]{--dim-rgb:9,13,22}html[data-theme=light]{--dim-rgb:250,247,242}html[data-theme=minimal]{--dim-rgb:243,244,246}
html.has-bg body:before,html.lite.has-bg body:before{background:linear-gradient(rgba(var(--dim-rgb),var(--bg-dim,.35)),rgba(var(--dim-rgb),var(--bg-dim,.35))),var(--user-bg) center/cover no-repeat,var(--html-bg)}
html.has-bg[data-theme=champagne]{--glass-bg:linear-gradient(145deg,rgba(58,48,46,.92),rgba(58,51,53,.86));--glass-border:rgba(255,244,226,.22)}
html.has-bg[data-theme=midnight]{--glass-bg:linear-gradient(145deg,rgba(28,36,54,.93),rgba(23,30,46,.88))}
html.has-bg[data-theme=light]{--glass-bg:rgba(255,255,255,.93)}
html.has-bg .alert{background-color:var(--menu-solid)}
html.has-bg .app-foot button{background:var(--menu-solid);padding:6px 12px;border-radius:14px;box-shadow:0 4px 14px rgba(0,0,0,.18)}
html.has-bg .card,html.has-bg header{box-shadow:var(--glass-shadow),0 10px 30px rgba(0,0,0,.18)}
/* phần chọn hình nền trong hộp giao diện */
.bg-row{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin:8px 0 4px}
.bg-thumb{flex:none;width:150px;height:92px;border-radius:12px;border:1px solid rgba(var(--tint),.2);background:rgba(var(--tint),.06) center/cover no-repeat;display:grid;place-items:center;font-size:12px;color:var(--muted);text-align:center;padding:6px}
.bg-ctl{flex:1;min-width:200px;display:flex;flex-direction:column;gap:8px}.bg-ctl .actions{margin:0}
.bg-ctl input[type=range]{padding:0;box-shadow:none;border:0;background:none;accent-color:var(--accent);height:24px}
/* ---------- chọn chương trình ở form Tạo lịch: nút to, bắt buộc, mặc định chưa chọn ---------- */
.prog-field{text-align:left;margin:4px 0 14px;padding:12px 14px;border-radius:16px;border:1px solid rgba(var(--tint),.16);background:rgba(var(--tint),.04)}
.prog-field.empty{border-style:dashed;border-color:rgba(var(--accent-rgb),.55)}
.prog-label{font-size:13px;font-weight:700;color:var(--text);margin-bottom:9px}.prog-label .req{color:var(--red)}.prog-hint{font-weight:500;color:var(--muted);font-size:12.5px}
.prog-pick{display:flex;flex-wrap:wrap;gap:10px}
.prog-opt{flex:1 1 200px;display:flex;align-items:center;gap:10px;min-height:52px;padding:12px 16px;border-radius:14px;border:2px solid rgba(var(--tint),.22);background:rgba(var(--tint),.06);color:var(--text);font:inherit;font-size:16px;font-weight:700;cursor:pointer;text-align:left;box-shadow:none;transition:border-color .15s,background .15s}
.prog-opt:hover{border-color:var(--pc)}
.prog-opt .prog-dot{flex:none;width:14px;height:14px;border-radius:50%;background:var(--pc);box-shadow:0 0 0 3px rgba(var(--tint),.12)}
.prog-opt .prog-name{flex:1}
.prog-opt .prog-check{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:13px;border:2px solid rgba(var(--tint),.3);color:transparent}
.prog-opt.active{border-color:var(--pc);background:rgba(var(--accent-rgb),.12);background:color-mix(in srgb,var(--pc) 22%,transparent)}
.prog-opt.active .prog-check{background:var(--pc);border-color:var(--pc);color:#fff}
.prog-field.missing{border:2px solid var(--red);background:var(--red2);animation:prog-shake .45s ease-in-out}
.prog-field.missing .prog-hint{color:var(--red);font-weight:700}
.email-picker.missing .picker-box{border-color:var(--red);background:var(--red2);animation:prog-shake .45s ease-in-out} /* chặn tạo / lưu vì còn email nhân sự (14/10/2026) */
.picker.missing .picker-box{border-color:var(--red);background:var(--red2);animation:prog-shake .45s ease-in-out} /* chặn tạo / lưu vì người trong ekip trùng lịch nghỉ (29/10/2026) */
@keyframes prog-shake{0%,100%{transform:none}20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
/* một việc dùng chung nhiều chương trình (05/10/2026): "Áp dụng thêm cho" ở form Tạo lịch và ở chi tiết việc */
.prog-extra{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin-top:10px;padding-top:10px;border-top:1px dashed rgba(var(--tint),.16)}
.prog-extra .field-hint{flex-basis:100%;margin-top:2px}
.prog-extra-label{font-size:12.5px;font-weight:700;color:var(--text2)}
.prog-extra-list{display:flex;flex-wrap:wrap;gap:4px 16px}
.prog-extra-opt{margin:4px 0;font-weight:600}
.prog-extra-opt .prog-dot{flex:none;width:10px;height:10px;border-radius:50%;background:var(--pc)}
.prog-panel{margin:6px 0 12px;padding:10px 14px;border-radius:14px;border:1px solid rgba(var(--tint),.14);background:rgba(var(--tint),.04);text-align:left}
.prog-panel>summary{cursor:pointer;font-size:13px}
.prog-panel[open]>summary{margin-bottom:10px}
.sync-prog{display:inline-flex;align-items:center;padding:3px 7px;border-radius:8px;font-size:11px;font-weight:800;letter-spacing:.02em;color:var(--text);background:rgba(var(--tint),.08);border-left:3px solid var(--pc)}
.chip.deleted{opacity:.6;text-decoration:line-through}
/* lịch nghỉ phép (05/10/2026) */
.lv-grid .cal-cell{min-height:86px}
.lchip .time{text-transform:lowercase}
/* thanh nghỉ nối ngày (10/11/2026): một người một thanh trải qua các ngày nghỉ liền nhau (lưới đặt ô theo hàng / cột, thanh là phần tử lưới trải nhiều cột,
   đặt đúng làn bằng margin-top — quanly.js positionLeaveRuns); đầu thanh bo tròn + vạch màu, đoạn nối sang tuần sau thì phẳng sát mép ô */
.lv-grid .lv-run{position:relative;z-index:2;align-self:start;height:calc(var(--lv-h) - 3px);margin:0;padding:0 7px;border-left:0;border-radius:3px;white-space:nowrap;overflow:hidden}
.lv-grid .lv-run.s{margin-left:6px;border-left:3px solid var(--pc);border-top-left-radius:9px;border-bottom-left-radius:9px}
.lv-grid .lv-run.e{margin-right:6px;border-top-right-radius:9px;border-bottom-right-radius:9px}
.lv-grid .lv-run:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.lv-legend{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;margin:10px 0 4px;font-size:12px;color:var(--text2)}
/* Thêm nhiều lịch nghỉ bằng AI (10/11/2026): hộp rộng; mỗi lịch nghỉ một hàng lưới (điện thoại: thẻ 2 cột có nhãn); dòng thiếu / trùng viền đỏ, AI chưa chắc viền vàng */
.modal-box.lv-ai-box{width:min(1120px,100%)}
.lv-ai-filebar{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:8px}.lv-ai-filebar .field-hint{margin:0}
.lv-ai-files{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.lv-ai-files:empty{display:none}.lv-ai-over{flex-basis:100%;margin:0;color:var(--err-text)}
.lv-ai-head,.lv-ai-row{display:grid;grid-template-columns:28px minmax(150px,1.35fr) minmax(110px,1fr) 140px 140px 112px minmax(120px,1.3fr);gap:6px;align-items:center}
.lv-ai-head{margin-top:12px;padding:0 9px 2px;font-size:11.5px;color:var(--muted)}
.lv-ai-rows{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.lv-ai-row{padding:6px 8px;border-radius:12px;border:1px solid rgba(var(--tint),.13);background:rgba(var(--tint),.045)}
.lv-ai-row.warn{border-color:var(--amber)}
.lv-ai-row.bad{border-color:var(--red);background:var(--red2)}
.lv-ai-row.off{background:transparent;border-style:dashed}
.lv-ai-row :is(input,select){padding:7px 9px;border-radius:10px;font-size:13px;box-shadow:none;min-width:0}
.lv-ai-on{display:flex;align-items:center;justify-content:center;margin:0;min-height:34px;cursor:pointer}.lv-ai-on input{width:18px;height:18px;margin:0}
.lv-ai-c{margin:0;min-width:0;font-size:11.5px}.lv-ai-c>span{display:none}
.lv-ai-msg{grid-column:2/-1;font-size:12px;line-height:1.5}.lv-ai-msg:empty{display:none}.lv-ai-msg .bad{color:var(--err-text)}.lv-ai-msg .warn{color:var(--tag-amber)}
.lv-ai-actions{position:sticky;bottom:-18px;z-index:1;margin:12px -18px -18px;padding:10px 18px 16px;background:var(--modal-bg)}
@media(max-width:860px){
 .lv-ai-head{display:none}
 .lv-ai-row{display:flex;flex-wrap:wrap;gap:8px;padding:8px 10px 10px}
 .lv-ai-on{flex:0 0 32px;min-height:44px;align-self:flex-end}
 .lv-ai-c{flex:1 1 calc(50% - 4px);display:flex;flex-direction:column;gap:3px}.lv-ai-c>span{display:block;color:var(--muted)}
 .lv-ai-person{flex-basis:calc(100% - 40px)}.lv-ai-reason,.lv-ai-msg{flex-basis:100%}
 .lv-ai-row :is(input,select){padding:8px}
}
#lv-list{margin-top:8px}
#lv-list .side-dot{margin-right:6px}
.lv-sync{margin:0}
.lv-kv th{width:110px}
#lv-f-part button[disabled]{opacity:.4;cursor:not-allowed}
#panel-leave .mtoolbar{flex-wrap:wrap;gap:8px}
.lchip .ini{display:none}
.lv-mgr-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:0 16px;margin:6px 0}
.lv-mgr-list .check{margin:5px 0}
.ad-list{display:flex;flex-direction:column;gap:8px;margin:10px 0} /* Cài đặt → Mã 2FA: tài khoản Adobe (14/10/2026) */
.ad-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:14px;border:1px solid rgba(var(--tint),.14);background:rgba(var(--tint),.05)}
.ad-main{min-width:0;display:flex;flex-direction:column;gap:3px}.ad-main .gi{font-size:16px;vertical-align:-3px}.ad-act{display:flex;flex-wrap:wrap;gap:6px;flex:none}
@media(max-width:720px){.ad-row{flex-direction:column}.ad-act .btn{min-height:40px}}
/* Thể loại chọn nhiều (05/10/2026): bấm từng thể loại để bật/tắt */
.cat-pick{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-height:44px;padding:6px 8px;border:1px solid rgba(var(--tint),.2);border-radius:15px;background:linear-gradient(145deg,rgba(var(--tint),.12),rgba(var(--tint),.055));box-shadow:inset 0 1px 0 rgba(255,250,239,.13),0 7px 18px rgba(37,27,24,.13)}
.cat-opt{position:relative;display:inline-flex;align-items:center;margin:0;padding:5px 11px;border-radius:16px;border:1px solid rgba(var(--tint),.2);background:rgba(var(--tint),.07);color:var(--text2);font-size:12.5px;font-weight:600;line-height:1.3;cursor:pointer;user-select:none}
.cat-opt input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.cat-opt:hover{border-color:rgba(var(--accent-rgb),.5)}
.cat-opt:has(input:checked){background:rgba(var(--accent-rgb),.24);border-color:rgba(var(--accent-rgb),.6);color:var(--link)}
.cat-opt:has(input:checked) span:before{content:'✓ '}
.cat-opt:has(input:focus-visible){box-shadow:0 0 0 3px rgba(var(--accent-rgb),.25)}
.cat-opt.old{border-style:dashed}
.cat-opt:has(input:disabled){cursor:default;opacity:.6}.cat-opt:has(input:disabled):hover{border-color:rgba(var(--tint),.2)}
.ai-filled .cat-pick{background:rgba(var(--accent-rgb),.17);border-color:rgba(var(--accent-rgb),.6)}
/* Ô sổ xuống / lịch chọn ngày / giờ kiểu trang: /gmm-picker.css (dùng chung với thietbi). Ở đây chỉ còn phần riêng của quanly: ô AI vừa điền vẫn giữ biểu tượng lịch / đồng hồ */
html.pk-on .ai-filled input[type=date],html.pk-on .ai-filled input[type=time]{background-image:var(--pk-date)!important;background-repeat:no-repeat!important;background-position:right 12px center!important;background-size:17px 17px!important}
html.pk-on .ai-filled input[type=time]{background-image:var(--pk-time)!important}
/* Kịch bản → Google Docs (nút 📝, 05/10/2026). Nút nổi góc dưới phải, ngay bên trái nút góp ý — cùng kiểu .gmm-feedback (site-switcher.css) */
.kb-fab{--sw-bg:linear-gradient(145deg,rgba(54,45,43,.72),rgba(57,51,52,.45));--sw-line:rgba(255,241,219,.3);--sw-gold:#f4d9b2;--sw-accent:var(--accent,#e7c28b);--sw-accent-rgb:var(--accent-rgb,231,194,139);--sw-hover:rgba(126,103,76,.7);--sw-shadow:rgba(32,23,20,.2);--sw-inset:rgba(255,250,240,.25);
 position:fixed;z-index:25;right:calc(max(16px,env(safe-area-inset-right)) + 52px);bottom:max(16px,env(safe-area-inset-bottom));display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--sw-line);border-radius:14px;background:var(--sw-bg);color:var(--sw-gold);box-shadow:inset 0 1px 0 var(--sw-inset),0 8px 22px var(--sw-shadow);cursor:pointer;transition:background .2s,border-color .2s,transform .18s}
html[data-theme=brand] .kb-fab{--sw-bg:var(--nav-bg);--sw-line:var(--glass-border);--sw-gold:var(--heading);--sw-hover:rgba(var(--sw-accent-rgb),.24);--sw-shadow:rgba(0,0,0,.35);--sw-inset:rgba(var(--tint),.12)} /* kiểu theo logo văn phòng (gmm-office.js) */
html[data-theme=midnight] .kb-fab{--sw-bg:linear-gradient(145deg,rgba(30,38,56,.92),rgba(24,31,47,.86));--sw-line:rgba(160,180,230,.28);--sw-hover:rgba(var(--sw-accent-rgb),.24);--sw-shadow:rgba(0,0,0,.35);--sw-inset:rgba(200,215,255,.12)}
html[data-theme=light] .kb-fab{--sw-bg:rgba(255,255,255,.94);--sw-line:rgba(72,54,38,.18);--sw-gold:#8a5a12;--sw-hover:rgba(var(--sw-accent-rgb),.16);--sw-shadow:rgba(60,40,20,.14);--sw-inset:rgba(255,255,255,.6)}
html[data-theme=minimal] .kb-fab{--sw-bg:#fff;--sw-line:#d1d5db;--sw-gold:#92400e;--sw-hover:rgba(var(--sw-accent-rgb),.1);--sw-shadow:rgba(17,24,39,.12);--sw-inset:transparent}
.kb-fab:hover{background:var(--sw-hover);border-color:var(--sw-accent);transform:translateY(-2px)}
.kb-fab:focus-visible{outline:2px solid var(--sw-accent);outline-offset:3px;box-shadow:none}
.kb-fab svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@media(prefers-reduced-motion:reduce){.kb-fab{transition:none}}
.kb-box{width:min(820px,100%)}
.kb-mode{margin:4px 0 2px}
.kb-editor{min-height:220px;max-height:46vh;overflow:auto;padding:10px 12px;border:1px solid rgba(var(--tint),.2);border-radius:15px;background:linear-gradient(145deg,rgba(var(--tint),.12),rgba(var(--tint),.055));color:var(--text);font-size:14px;line-height:1.55;outline:none;overflow-wrap:anywhere}
.kb-editor:focus{border-color:rgba(var(--accent-rgb),.78);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.18)}
.kb-editor:empty:before{content:attr(data-ph);color:var(--faint)}
.kb-editor p{margin:0 0 6px}.kb-editor h1,.kb-editor h2,.kb-editor h3,.kb-editor h4{margin:8px 0 6px;font-size:16px}
.kb-editor table{border-collapse:collapse;width:100%;margin:6px 0}.kb-editor td,.kb-editor th{border:1px solid rgba(var(--tint),.3);padding:4px 6px;vertical-align:top}
.kb-drop{margin-top:8px}
#kb-file .ai-file{margin-top:8px}
.kb-result{margin-top:12px;padding:12px;border-radius:14px;border:1px solid rgba(73,172,130,.45);background:rgba(73,172,130,.12)}
.kb-result-head{font-size:13.5px;line-height:1.5}
.kb-link{display:flex;gap:6px;align-items:center;margin-top:8px}.kb-link input{flex:1;min-width:0;font-size:13px;padding:8px 10px}
.kb-recent{margin-top:12px}.kb-recent summary{cursor:pointer;font-size:13px;color:var(--text2);font-weight:600}
.kb-row{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid rgba(var(--tint),.1)}.kb-row:last-child{border-bottom:0}
.kb-row-main{flex:1;min-width:0}.kb-row-main a{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13.5px}
@media (max-width:560px){.kb-link{flex-wrap:wrap}.kb-link input{flex-basis:100%}.kb-editor{min-height:180px}}
@media(max-width:720px){.lv-grid .lv-run.s{margin-left:4px}.lv-grid .lv-run.e{margin-right:4px}.lv-grid .cal-cell{min-height:64px;padding:4px}.lv-grid .cal-day .muted,.lv-grid .lchip .time,.lv-grid .lchip .nm{display:none}.lv-grid .lchip .ini{display:inline}.lv-grid .lchip{padding:2px 4px;font-size:10.5px}}
.rowline.prog-gone{opacity:.75}
@media(max-width:560px){.prog-opt{flex-basis:100%;min-height:48px;font-size:15px}}
/* ---------- Cột hai bên ở màn rộng (02/10/2026): Tạo lịch, Quản lý lịch, Cài đặt chia trái | giữa | phải giống trang Thiết bị; cột giữa giữ
   đúng 1052px dưới đầu trang ở màn ≥ 1600px. Màn < 1280px khung bọc .side-* "trong suốt" (display:contents) nên như cũ, thẻ .wide-only ẩn.
   Không đặt transform/opacity lên khung bọc (MOTION-SPEC). ---------- */
.side3>.side-l,.side3>.side-main,.side3>.side-r{display:contents}
.side3 .wide-only{display:none}
.s-nav-card .subnav{margin-bottom:0}
.side-item{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;width:100%;padding:9px 0;border:0;border-bottom:1px solid rgba(var(--tint),.13);border-radius:0;background:none;color:var(--text);font:inherit;text-align:left}
.side-item:last-child{border-bottom:0}
button.side-item{cursor:pointer}button.side-item:hover .side-name,button.side-item.active .side-name{color:var(--heading)}
button.side-item.active{box-shadow:inset 3px 0 0 var(--accent);padding-left:10px}
.side-item>div{min-width:0;flex:1}
.side-name{font-size:13px;font-weight:700;overflow-wrap:anywhere}
.side-meta{font-size:11.5px;color:var(--muted);margin-top:2px;overflow-wrap:anywhere}
.side-item>b{font-size:14px;white-space:nowrap}.side-item>.tag{flex:none;white-space:nowrap}
.side-day{font-size:11px;font-weight:700;color:var(--heading);text-transform:uppercase;letter-spacing:.6px;margin:14px 0 0}
.side-day:first-child{margin-top:0}
.side-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--pc,#e7c28b);margin-right:6px;vertical-align:1px}
.side-note{font-size:11.5px;color:var(--muted);margin-top:8px}.side-note-top{margin:0 0 6px}
#s-help p{font-size:12.5px;line-height:1.65;color:var(--text2);margin:0 0 10px}#s-help p:last-child{margin-bottom:0}
@media(min-width:1280px){
 main:has(>.panel.side3.active){max-width:1500px}
 main>#must-change{max-width:1052px;margin-left:auto;margin-right:auto}
 .panel.side3.active{display:grid;grid-template-columns:210px minmax(0,1fr) 280px;gap:16px;align-items:start}
 .side3>.side-main{display:block;grid-column:2;grid-row:1;min-width:0}
 .side3>.side-l,.side3>.side-r{display:block;grid-row:1;min-width:0;position:sticky;top:84px;max-height:calc(100dvh - 90px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 8px 14px;margin:0 -8px}
 .settings-page .side3>.side-l,.settings-page .side3>.side-r{top:12px;max-height:calc(100dvh - 18px)}
 .side3>.side-l{grid-column:1}.side3>.side-r{grid-column:3}
 .side3 .wide-only{display:block}
 .side3>.side-l .card,.side3>.side-r .card{padding:16px}
 .side3>.side-l>:first-child,.side3>.side-r>:first-child,.side3>.side-main>.card:first-child{margin-top:0}
 .s-nav-card .subnav{flex-direction:column;flex-wrap:nowrap;gap:4px}
 .s-nav-card .subnav button{width:100%;text-align:left}
 .s-nav-card .subnav-sep{flex-basis:auto;margin:12px 0 2px}.s-nav-card .subnav-sep:first-child{margin-top:0}
}
@media(min-width:1600px){
 main:has(>.panel.side3.active){max-width:none}
 .panel.side3.active{grid-template-columns:minmax(0,1fr) minmax(0,1052px) minmax(0,1fr);gap:0}
 .side3>.side-l{justify-self:end;width:calc(min(300px,(100vw - 1140px)/2) + 16px);margin:0 20px 0 0}
 .side3>.side-r{justify-self:start;width:calc(min(350px,(100vw - 1140px)/2) + 16px);margin:0 0 0 20px}
}
/* Quản lý lịch, màn rộng (03/10/2026): lịch tháng vừa khít cửa sổ, không phải cuộn. quanly.js monthFit() tính --row-h và số dòng mỗi ô;
   hàng bộ lọc dời sang thẻ "Bộ lọc" ở cột trái (placeFilters), việc chưa có ngày ghi hình sang cột phải; bớt lề dưới trang. */
.cal-grid.fit{gap:5px;grid-auto-rows:var(--row-h)}
.cal-grid.fit .cal-cell{min-height:0;height:var(--row-h);overflow:hidden;padding:5px;gap:3px}
.cal-grid.fit .cal-day,.cal-grid.fit .tchip,.cal-grid.fit .cal-more{flex:none}
.cal-grid.fit .tchip{padding:3px 6px;line-height:1.25}
.cal-grid.fit .cal-more{padding:0 2px}
#mg-filter-slot .mtoolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0}
#mg-filter-slot .mtoolbar .grow{grid-column:1/-1;min-width:0}
#mg-filter-slot .mtoolbar input:not([type=checkbox]),#mg-filter-slot .mtoolbar select{width:100%}
#mg-filter-slot .mtoolbar .check{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-size:12.5px}
#mg-filter-slot #m-programs{display:none} /* trùng mục "Chương trình" (có số đếm) ở thẻ ngay dưới */
#mg-unsched{display:flex;flex-direction:column;gap:4px}
#mg-summary .side-item{padding:7px 0}#mg-summary button.side-item.active{padding-left:10px}
@media(min-width:1280px){
 main:has(>#panel-manage.fit-month.active){padding-bottom:14px}
 body:has(#panel-manage.fit-month.active){padding-bottom:0} /* site-switcher.css chừa 76px cho nút nổi góc dưới; ở đây nút nằm ngoài lưới lịch */
 main:has(>#panel-manage.fit-month.active)+.app-foot{margin-top:0;padding-bottom:10px}
 /* cột bên không kéo dài trang: cao bằng cột giữa (height:0 không góp vào chiều cao hàng), dài hơn thì cuộn bên trong cột */
 #panel-manage.fit-month>.side-l,#panel-manage.fit-month>.side-r{height:0;min-height:100%;max-height:none}
}
/* Cửa sổ thấp (laptop): đầu trang và thanh tab gọn hơn để lịch tháng có thêm chỗ */
@media(min-width:1280px) and (max-height:820px){
 header{margin:10px auto 8px;padding:10px 18px}.header-logo{max-height:46px}
 nav{padding:4px}nav button{padding:10px 12px}
 .side3>.side-l,.side3>.side-r{top:70px}
 .side3>.side-main>.card:first-child{padding-top:14px;padding-bottom:14px}
}
/* hiệu ứng khi đổi tab: motion.css chỉ nhắm thẻ con trực tiếp của .panel, đây là thẻ nằm trong khung bọc */
.panel.m-tab-in>.side-l>*{--m-i:1}.panel.m-tab-in>.side-r>*{--m-i:2}
.panel.m-tab-in>.side-main>.card,.panel.m-tab-in>.side-l>.card,.panel.m-tab-in>.side-r>.card{animation:m-rise var(--m-320) var(--m-out) both;animation-delay:calc(var(--m-delay-base) + var(--m-stagger)*var(--m-i,0))}
/* Quyền theo loại tài khoản, email khách mời, tự tạo Sheet + lịch cho chương trình (03/10/2026) */
.ql-noaccess #nav,.ql-noaccess main>.panel,.ql-noaccess #dir-btn{display:none!important}
.feat-tbl th.c,.feat-tbl td.c{text-align:center;width:96px}
.feat-tbl.feat-lv th.c{width:84px;white-space:normal;line-height:1.25;font-size:11px;vertical-align:bottom} /* 5 cột cấp bậc (13/10/2026) */
.feat-tbl tr.feat-site td{padding-top:14px;font-weight:800;color:var(--heading);border-bottom:1px solid rgba(var(--tint),.18)}
.feat-sw{display:inline-flex;align-items:center;gap:4px;cursor:pointer}
.feat-sw input{width:18px;height:18px;margin:0;accent-color:var(--accent)}
.feat-mark{display:inline-block;width:8px;color:var(--accent);font-weight:800}
.pchip.guest{background:rgba(110,168,254,.16);border-color:rgba(110,168,254,.38)}
.email-picker .picker-box input.bad{color:var(--red)}
.pchip.guest.staff{background:var(--red2);border-color:rgba(255,125,128,.6);color:var(--red);text-decoration:line-through;text-decoration-thickness:1px} /* email nhân sự trong ô khách mời (07/10/2026) */
.pchip.off{background:var(--red2);border-color:rgba(255,125,128,.6);color:var(--red)} /* người có lịch nghỉ trùng lịch quay (29/10/2026) */
.picker-menu .meta.off{color:var(--red);font-weight:600}
.picker-warn{margin-top:6px;padding:7px 10px;border-radius:10px;background:var(--red2);border:1px solid rgba(255,125,128,.45);color:var(--err-text);font-size:12.5px;line-height:1.5}
.prov-box{padding:10px 12px;border:1px solid rgba(var(--accent-rgb),.3);border-radius:14px;background:rgba(var(--accent-rgb),.06)}
/* Bấm logo về trang chính (05/10/2026) */
.home-link{display:block;flex:0 0 auto;border-radius:10px;transition:opacity .15s}.home-link:hover{opacity:.8}.home-link:focus-visible{outline:2px solid rgba(var(--accent-rgb),.8);outline-offset:4px}

/* 07/10/2026 — dải việc đang chạy tới deadline ở lịch tháng (quanly.js runOf / positionRuns); ô ngày được đặt đúng hàng / cột của lưới
   để dải là một phần tử lưới trải nhiều cột; .cal-run-space trong ô chừa chỗ cho các làn dải. */
.cal-grid.has-runs .cal-run{position:relative;z-index:2;align-self:start;height:17px;margin:0 4px;display:flex;align-items:center;gap:6px;padding:0 7px;border-radius:4px;background:rgba(0,0,0,.35);background:color-mix(in srgb,var(--pc) 55%,rgba(0,0,0,.35));color:#fff;font-size:10.5px;font-weight:700;line-height:17px;cursor:pointer;overflow:hidden;white-space:nowrap;min-width:0;box-shadow:0 2px 6px rgba(0,0,0,.22)}
.cal-run.s{border-top-left-radius:9px;border-bottom-left-radius:9px}.cal-run:not(.s){margin-left:0}
.cal-run.e{border-top-right-radius:9px;border-bottom-right-radius:9px}.cal-run:not(.e){margin-right:0}
.cal-run .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.cal-run .dl{flex:none;font-weight:800}
.cal-run.late{background:rgba(229,72,77,.7);background:color-mix(in srgb,#e5484d 70%,rgba(0,0,0,.3))}
.cal-run:hover{filter:brightness(1.15)}
.cal-run-space{flex:none}
.tchip.run .time{white-space:nowrap}.tchip.run.late{border-left-color:#e5484d}.tchip.run.late .time{color:#ffb4b6}
.week-runs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 10px}
.week-runs .lbl{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin-right:4px}
.week-runs .tchip{max-width:340px}
html[data-theme=light] .cal-run,html[data-theme=minimal] .cal-run{background:rgba(var(--tint),.1);background:color-mix(in srgb,var(--pc) 30%,#fff);color:var(--text);box-shadow:none;border:1px solid color-mix(in srgb,var(--pc) 60%,#fff)}
html[data-theme=light] .cal-run.late,html[data-theme=minimal] .cal-run.late{background:#fde7e8;color:#b42329;border-color:#f3b7ba}
html[data-theme=light] .tchip.run.late .time,html[data-theme=minimal] .tchip.run.late .time{color:#b42329}
@media(max-width:720px){.cal-grid.has-runs .cal-run{font-size:9.5px;padding:0 4px;gap:3px}.cal-run .dl{display:none}.cal-more .more-lbl{display:none}}
/* 07/10/2026 — Cài đặt → 📋 Biên bản (bien-ban.js; trước ở tab Biên bản trang Thiết bị): danh sách, tệp dạng viên bấm, xem ảnh phóng to,
   người vi phạm nhiều tên, ô AI điền, hộp Tạo nhiều. */
.rec-filters{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 6px}.rec-filters input{flex:1 1 220px;width:auto}.rec-filters select{flex:0 1 auto;width:auto;min-width:150px}
#rec-sum{margin:2px 0 4px}#rec-sum:empty{display:none}
.record-row{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:12px 0;border-bottom:1px solid rgba(var(--tint),.12)}
.record-row:last-child{border-bottom:0}
.record-main{min-width:0;flex:1}.record-main .name{font-weight:700}
.record-row .meta{white-space:pre-line;overflow-wrap:anywhere;font-size:12.5px;color:var(--muted);margin-top:3px}
.record-acts{margin:0;flex:none}
.record-files{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.file-chip{display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:5px 10px;border:1px solid rgba(var(--tint),.18);border-radius:999px;background:rgba(var(--tint),.06);color:var(--text);font:inherit;font-size:12.5px;line-height:1.3;cursor:pointer;text-align:left;overflow-wrap:anywhere}
.file-chip:hover{border-color:var(--amber)}.file-chip.static{cursor:default}.file-chip .muted{font-size:11px;white-space:nowrap}
.file-chip .chip-x{border:0;background:transparent;color:var(--muted);font-size:16px;line-height:1;padding:0 0 0 4px;cursor:pointer}.file-chip .chip-x:hover{color:var(--red)}
.img-zoom{position:relative;overflow:hidden;height:min(70vh,calc(100dvh - 260px));min-height:220px;background:#000;border-radius:12px;display:flex;align-items:center;justify-content:center;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}
.img-zoom img{display:block;max-width:100%;max-height:100%;transform-origin:0 0;will-change:transform;pointer-events:none}
.img-zoom.dragging{cursor:grabbing}.zoom-bar{align-items:center;flex-wrap:wrap}.zoom-level{min-width:46px;text-align:center;font-variant-numeric:tabular-nums}.zoom-hint{margin-top:6px;font-size:12px}
.rec-ai{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:8px 0 2px}.rec-ai .field-hint{flex:1 1 100%;margin:0}.rec-ai .field-hint:empty{display:none}
.vio-picker{position:relative}
.vio-box{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:42px;padding:5px 8px;border:1px solid rgba(var(--tint),.2);border-radius:15px;background:linear-gradient(145deg,rgba(var(--tint),.12),rgba(var(--tint),.055));cursor:text}
.vio-box input{flex:1 1 120px;min-width:90px;width:auto;border:0;background:transparent;box-shadow:none;padding:5px 2px;border-radius:0;margin:0}
.vio-box input:focus{outline:none}.vio-chips{display:contents}
.vio-chip{display:inline-flex;align-items:center;gap:3px;padding:3px 5px 3px 10px;border-radius:999px;background:rgba(var(--accent-rgb),.16);border:1px solid rgba(var(--accent-rgb),.38);color:var(--text);font-size:12.5px;font-weight:700;line-height:1.35}
.vio-chip button{border:0;background:transparent;color:var(--muted);font-size:15px;line-height:1;padding:0 3px;cursor:pointer}.vio-chip button:hover{color:var(--red)}
.vio-menu{position:absolute;left:0;right:0;top:100%;margin-top:4px;z-index:40;max-height:230px;overflow:auto;padding:4px;border-radius:12px;background:var(--menu-solid);border:1px solid rgba(var(--tint),.18);box-shadow:0 14px 30px rgba(0,0,0,.35)}
.vio-menu button{display:block;width:100%;text-align:left;padding:8px 10px;border:0;border-radius:8px;background:transparent;color:var(--text);font:inherit;font-size:13.5px;cursor:pointer}.vio-menu button:hover{background:rgba(var(--tint),.13)}
.rec-vio{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin-top:5px;font-size:12.5px}.rec-vio .vio-chip{padding:2px 10px;font-weight:600}
.rec-ai-filled{background:rgba(255,214,90,.17)!important;border-color:rgba(255,214,90,.65)!important}
.rec-ai-unsure{border-color:#ff9a3c!important;box-shadow:0 0 0 2px rgba(255,154,60,.5)!important}
.rec-ai-why{font-size:12px;color:#ffae63;margin:4px 2px 0}
html[data-theme=light] .rec-ai-why,html[data-theme=minimal] .rec-ai-why{color:#b45309}
.modal-box.rb-wide{width:min(980px,100%)}
.rb-drop{border:2px dashed rgba(var(--tint),.32);border-radius:14px;padding:16px;text-align:center;color:var(--muted);margin-top:8px}.rb-drop.over{border-color:var(--amber);background:rgba(var(--tint),.08)}
.rb-pick,.rb-addf{display:inline-flex;width:auto;margin:0;cursor:pointer;vertical-align:middle}.rb-pick{margin-left:6px}.rb-info{font-size:12.5px;color:var(--amber);margin-top:8px}
.rb-tools{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin:10px 0 0}
.rb-opt{display:flex;align-items:center;gap:7px;margin:0;font-size:12.5px;color:var(--text);cursor:pointer}.rb-opt input{width:16px;height:16px;flex:none;box-shadow:none;margin:0}
.rb-item{border:1px solid rgba(var(--tint),.16);border-radius:14px;padding:10px 12px 12px;margin:10px 0;background:rgba(var(--tint),.05)}
.rb-item.saved{opacity:.6}
.rb-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.rb-sp{flex:1}.rb-state{font-size:12px;color:var(--muted)}
.rb-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:0 10px}
.rb-files{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:9px}
@media(max-width:760px){.record-row{flex-direction:column}.record-acts{align-self:flex-end}.zoom-hint{display:none}.rb-grid{grid-template-columns:1fr 1fr}.rb-grid>div:first-child{grid-column:1/-1}.rec-filters select{flex:1 1 140px}}
/* 07/10/2026 — AI đọc thư mời bổ sung ở chi tiết việc (quanly.js aiReadTask): ô đã có mà thư mời ghi khác → gợi ý, không ghi đè */
.ai-suggest{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:5px;padding:6px 9px;border-radius:11px;font-size:12px;line-height:1.45;background:rgba(var(--accent-rgb),.1);border:1px dashed rgba(var(--accent-rgb),.5);color:var(--text)}
.ai-suggest>span{flex:1 1 220px;min-width:0;overflow-wrap:anywhere;white-space:pre-line}.ai-suggest b{color:var(--heading)}.ai-suggest .btn{margin:0}
#att-ai-out:empty{display:none}#att-ai-out{margin-top:6px}#att-ai-out .ai-done{margin-top:4px}
/* 07/10/2026 — hộp "⚙ Loại biên bản" (bien-ban.js typesModal) */
.rt-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0;padding:6px 8px;border-radius:12px;background:rgba(var(--tint),.05);border:1px solid rgba(var(--tint),.1)}
.rt-row input{flex:1 1 230px;width:auto;margin:0}.rt-row select{flex:0 1 220px;width:auto;margin:0}.rt-row .rt-n{min-width:74px;text-align:right}.rt-row .btn{margin:0}
/* Tự tạo tài khoản bằng mã + Cài đặt → Mã tạo tài khoản (12/10/2026) */
.link-btn{display:block;width:100%;margin-top:14px;padding:4px;border:0;background:none;color:var(--muted);font:inherit;font-size:13px;text-decoration:underline;text-underline-offset:3px;cursor:pointer;text-align:center}
.link-btn:hover{color:var(--heading)}
.signup-box{width:min(520px,100%)}
.su-row{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.su-roles{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.su-role{display:inline-flex;align-items:center;gap:6px;margin:0;padding:7px 12px;border:1px solid rgba(var(--tint),.25);border-radius:999px;cursor:pointer;font-weight:600;user-select:none}
.su-role input{width:auto;margin:0;accent-color:rgb(var(--accent-rgb))}
.su-role:has(input:checked){background:rgba(var(--accent-rgb),.18);border-color:rgba(var(--accent-rgb),.65)}
.su-role[hidden]{display:none} /* mã "Chỉ trang Hành chính": chỉ còn ô Hành chính (03/11/2026) */
.sc-code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-weight:700;letter-spacing:.06em}
.sc-big{margin:14px 0;padding:16px;border-radius:14px;border:1px dashed rgba(var(--accent-rgb),.6);text-align:center;font:700 30px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.12em;user-select:all}
@media (max-width:520px){.su-row{grid-template-columns:1fr}}
/* Bảng: ô ekip gọn — người đầu + "+N", rê chuột xem đủ tên (12/10/2026) */
.tbl-names{display:inline}
.tbl-more{display:inline-block;margin-left:4px;padding:0 6px;border-radius:999px;background:rgba(var(--tint),.14);border:1px solid rgba(var(--tint),.2);color:var(--muted);font-size:11px;font-weight:700;line-height:1.5;vertical-align:1px;white-space:nowrap}

/* ===== Soát thiết kế 12/10/2026 (impeccable / taste-skill, chế độ Operate): chỉ sửa lỗi tay nghề — bàn phím, tương phản, vùng bấm, điện thoại; KHÔNG đổi bộ nhận diện ===== */
/* Focus bàn phím: viền nhấn 2px ở mọi giao diện; Tối giản và chế độ nhẹ không xóa được (trước: vòng 18% ≈ 1.4:1; ô tích không có focus) */
:is(button,a[href],summary,[role=button],[data-kbd],input[type=checkbox],input[type=radio]):focus-visible{outline:2px solid rgb(var(--accent-rgb));outline-offset:2px}
.modal-box:focus{outline:none}
html[data-theme=minimal] :is(input,select,textarea){border-color:#8b929e}
html[data-theme=minimal] :is(input,select,textarea):focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.22)}
/* Chữ gợi ý trong ô nhập ≥ 4.5:1 (trước 2.5–3.7:1) */
input::placeholder,textarea::placeholder{color:var(--placeholder,var(--faint))}
/* Tag đỏ / vàng ≥ 4.5:1 (trước ~3–4:1) */
.tag.red{color:var(--tag-red,var(--red));background:rgba(211,70,73,var(--tag-red-a,.23))}
.tag.amber{color:var(--tag-amber,var(--amber));background:rgba(218,174,105,var(--tag-amber-a,.22))}
/* Ô chỉ xem trong việc: đọc được (trước mờ .55 ≈ 3.3–3.9:1) — viền đứt để vẫn biết là không sửa được */
.form-grid :is(input,select,textarea):disabled{opacity:.85;border-style:dashed}
/* Cột hai bên dính màn: chừa chỗ nút nổi góc dưới để mục cuối cuộn lên được, không bị che */
.side3>.side-l,.side3>.side-r{padding-bottom:72px}
/* Bộ lọc ở cột trái: mỗi ô một dòng, không cắt chữ "Mọi ng…" */
#mg-filter-slot .mtoolbar{grid-template-columns:minmax(0,1fr)}
/* Thanh tháng / tuần: nhãn nút không gãy 2 dòng */
.monthnav{flex-wrap:wrap}.monthnav .btn{white-space:nowrap}.monthnav .icon-btn{flex:none}
/* Cài đặt → Chương trình: nút không rơi lẻ xuống dòng; điện thoại xếp nút dưới chữ */
.rowline>div:first-child{flex:1 1 auto;min-width:0}.rowline .meta{overflow-wrap:anywhere}
.rowline>.actions{flex:0 0 auto}
@media(max-width:720px){.rowline{flex-wrap:wrap}.rowline>.actions{flex:1 1 100%}}
/* Màn cảm ứng: vùng bấm đủ lớn + ô nhập 16px để iPhone không tự phóng to khi chạm vào ô */
@media (pointer:coarse){
 .icon-btn{position:relative}.icon-btn::after{content:"";position:absolute;inset:-5px}
 .monthnav .icon-btn{width:40px;height:40px}
 .btn.small{min-height:40px}
 :root :is(input:not([type=checkbox]):not([type=radio]),select,textarea){font-size:16px}
 /* soát điện thoại 24/10/2026: nút × gỡ người trên thẻ tên (18px) và dòng mở/thu "Liên hệ", "Lịch mượn thiết bị"… (15px) khó chạm → nới vùng chạm, giữ nguyên hình */
 .pchip button{position:relative}.pchip button::after{content:"";position:absolute;inset:-8px}
 .contacts>summary,.prog-panel>summary,.kb-recent summary{padding:7px 0}
}
/* Bảng trên điện thoại: mỗi việc một thẻ (trước: 11 cột ép vào 390px, chữ gãy "Vietna m", phải cuộn ngang 860px) */
@media(max-width:720px){
 .tbl-fit{min-width:0}
 .tbl-fit,.tbl-fit tbody,.tbl-fit tr{display:block;width:auto}
 .tbl-fit colgroup,.tbl-fit thead{display:none}
 .tbl-fit tr{margin:0 0 10px;padding:10px 12px 8px 14px;border:1px solid rgba(var(--tint),.16);border-radius:14px;box-shadow:inset 4px 0 0 var(--pc);background:rgba(var(--tint),.03)}
 .tbl-fit tr.is-today{background:rgba(var(--accent-rgb),.11)}
 .tbl-fit tr.is-today td,.tbl-fit tr.row-click:hover td{background:none}
 .tbl-fit td{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px;row-gap:2px;padding:3px 0;border:0;overflow-wrap:break-word}
 .tbl-fit td[data-label]::before{content:attr(data-label);flex:0 0 78px;color:var(--muted);font-size:11.5px;font-weight:600}
 .tbl-fit td:empty{display:none}
 .tbl-fit td.tbl-prog-cell{display:flex;gap:4px;box-shadow:none;padding:0 0 2px}
 .tbl-fit td.tbl-prog-cell::before,.tbl-fit td.t::before{content:none}
 .tbl-fit td.t{display:block;font-size:14.5px;margin:2px 0 4px}
 .tbl-fit .tbl-prog{width:auto;max-width:100%}
 .tbl-fit .tbl-prog+.tbl-prog{margin-top:0}
 .tbl-fit .tbl-today{display:inline-block;margin:0}
 .tbl-fit td.empty{display:block;text-align:left}
 .tbl-fit .tbl-sync .sync{margin:0}
}
/* ===== Đợt 2 soát thiết kế 12/10/2026 (người dùng chọn): bộ biểu tượng thống nhất + điện thoại gọn hơn ===== */
/* Material Symbols Rounded (cùng họ với /app) thay emoji — mỗi máy vẽ emoji một kiểu và không theo màu giao diện */
.gi{font-family:'Material Symbols Rounded';font-weight:400;font-style:normal;font-size:1.2em;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;direction:ltr;display:inline-block;width:1em;overflow:hidden;vertical-align:-.2em;font-feature-settings:'liga';-webkit-font-smoothing:antialiased;font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 20;flex:none}
.gi.ok{color:var(--green)}.gi.bad{color:var(--red)}
.icon-btn .gi{font-size:20px;vertical-align:middle}
#m-filter-toggle{display:none}
@media(max-width:720px){
 .header-copy .subtitle{display:none}
 #m-filter-toggle{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
 #m-filters:not(.open)>:not(#m-programs){display:none}
}
/* Lịch quay ↔ Đặt mượn (12/10/2026): mục "Thiết bị đã đặt" trong chi tiết việc */
.job-bookings .jb-devices{flex-basis:100%;width:100%;min-width:0;margin-top:2px} /* danh sách thiết bị của một lần đặt: gom theo loại (13/10/2026) */
.jb-devices>summary{display:flex;align-items:center;gap:10px;padding:6px 0;cursor:pointer;list-style:none;font-size:13px;min-width:0}.jb-devices>summary::-webkit-details-marker{display:none}
.jb-devices>summary:after{content:'Xem ▼';flex:none;font-size:11.5px;color:var(--muted)}.jb-devices[open]>summary:after{content:'Thu gọn ▲'}
.jb-label{flex:none;font-weight:700;color:var(--heading)}.jb-preview{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}.jb-devices[open] .jb-preview{visibility:hidden}
.jb-cat{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:10px 0 4px;font-size:11.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--heading)}
.jb-cat-n{font-size:11px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--muted);white-space:nowrap}
.jb-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:3px 6px} /* khung rộng: 2 cột cho ngắn; điện thoại: 1 cột */
.jb-list li{display:flex;justify-content:space-between;gap:10px;padding:5px 10px;border-radius:9px;background:rgba(var(--tint),.07);font-size:13px;line-height:1.4;color:var(--text)}
.jb-qty{flex:none;color:var(--heading)}.job-bookings .jb-none{padding:6px 0}.job-bookings .jb-actions{margin:6px 0 2px}.job-bookings .jb-actions a{text-decoration:none}
/* Biên bản: số biên bản thiết bị theo người vi phạm (12/10/2026) — chip bấm để lọc, kèm số lần */
.rec-vio button.vio-chip{cursor:pointer;font:inherit;font-weight:600}.rec-vio button.vio-chip:hover{border-color:rgba(var(--accent-rgb),.7)}.rec-vio .vio-chip.on{background:rgba(var(--accent-rgb),.34);border-color:rgba(var(--accent-rgb),.8)}
.vio-n{display:inline-block;min-width:18px;margin-left:5px;padding:0 6px;border-radius:999px;background:rgba(var(--tint),.18);font-size:11px;font-weight:800;line-height:1.6;text-align:center}
#rec-people-sub{margin:-4px 0 6px}.rec-person-clear{color:var(--link);font-weight:700}


/* Hồ sơ nhân sự (12/10/2026): giấy tờ khi tạo tài khoản, Danh bạ → Hồ sơ nhân sự (chỉ người được cấp quyền), Cài đặt → Nhân sự */
#su-code-hint.bad{color:var(--err-text)}
.su-docs{margin-top:16px;padding-top:12px;border-top:1px solid rgba(var(--tint),.14)}
.su-docs-head{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.su-doc{padding:10px 0;border-bottom:1px solid rgba(var(--tint),.1)}
.su-doc-top{display:flex;align-items:center;gap:8px}.su-doc-top .su-doc-name{flex:1;min-width:0;font-weight:600}
.su-doc-top .gi{color:var(--muted)}.su-doc.done .su-doc-top .gi{color:var(--green)}
.su-files,.hr-files{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.su-files .file-chip img{width:26px;height:26px;border-radius:50%;object-fit:cover;flex:none}
.su-fname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:220px}
.file-chip.bad{border-color:var(--red)}.file-chip.bad .muted{color:var(--err-text);white-space:normal}
.su-consent{align-items:flex-start;margin-top:14px;line-height:1.45}.su-consent input{margin-top:2px;flex:none}
.dir-mode{margin:8px 0 10px;flex:none;align-self:flex-start}
.dir-row .dir-hr{flex:none;align-self:center}
/* Danh bạ (24/10/2026, người dùng chụp dòng của mình: tên + số điện thoại đứng dọc mỗi dòng một chữ): nút "Hồ sơ của tôi" / "Hồ sơ" gom một cụm;
   máy rộng ở bên phải, điện thoại xuống dưới thông tin (thẳng hàng chữ) — cột tên không bị 2 nút ép còn ~20px. Nhãn vai trò dài tự cắt "…" thay vì tràn */
.dir-acts{flex:none;align-self:center;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}
.dir-roles .tag{max-width:100%;overflow:hidden;text-overflow:ellipsis}
@media(max-width:560px){.dir-row{flex-wrap:wrap;row-gap:8px}.dir-acts{flex:1 1 100%;justify-content:flex-start;padding-left:44px}.dir-links a{padding:4px 0}}
.hr-row{display:flex;gap:10px;align-items:flex-start;width:100%;padding:10px 12px;border-radius:14px;background:rgba(var(--tint),.06);border:1px solid rgba(var(--tint),.1);color:var(--text);font:inherit;text-align:left;cursor:pointer}
.hr-row:hover{border-color:rgba(var(--accent-rgb),.45)}
.hr-row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.hr-row-name{font-weight:700;font-size:14px}.hr-row-meta{font-size:12px;color:var(--muted)}
.hr-row-tags{display:flex;flex-wrap:wrap;gap:4px}.hr-vio{flex:none;align-self:center}
.modal-box.hr-box{width:min(860px,100%);height:min(800px,calc(100dvh - 32px));display:flex;flex-direction:column;overflow:hidden} /* cao cố định: đổi tab không làm hộp nhảy */
.hr-head{display:flex;align-items:center;gap:14px;flex:none}.hr-head .icon-btn{flex:none;align-self:flex-start}
.hr-av{flex:none;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:rgba(var(--accent-rgb),.3);border:1px solid rgba(var(--tint),.3);font-size:20px;font-weight:800}
.hr-av img{width:100%;height:100%;object-fit:cover}
.hr-title{flex:1;min-width:0}.hr-title h2{margin:0 0 4px}
.hr-sub{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.hr-sub .dir-links{flex-basis:100%;margin-top:2px}
/* Mã số nhân viên (27/10/2026): GMM + năm vào làm + số thứ tự */
.hr-code{font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:.04em}.hr-sub .hr-code{font-size:13px;padding:2px 8px;border-radius:6px;background:rgba(var(--tint),.08);border:1px solid rgba(var(--tint),.18)}
/* Nhập nhanh Ngày vào làm (27/10/2026) */
.qs-bar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px;padding:10px 12px;margin-bottom:8px;border-radius:14px;font-size:13px;border:1px solid color-mix(in srgb,var(--amber) 55%,transparent);background:rgba(218,174,105,.1)}
.modal-box.qs-box{width:min(640px,100%);max-height:calc(100dvh - 32px);display:flex;flex-direction:column;overflow:hidden}.qs-box>h2,.qs-box>.staff-note,.qs-box>.field-hint,.qs-box>.actions{flex:none}
.qs-list{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:6px;margin:10px 0 4px;padding-right:2px}
.qs-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:rgba(var(--tint),.06);border:1px solid rgba(var(--tint),.1)}
.qs-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.qs-main b{font-size:14px}.qs-hint{font-size:12px;color:var(--muted)}
.qs-row input[type=date]{flex:none;width:170px;min-height:44px}.qs-done{padding:4px 2px 6px}
@media(max-width:480px){.qs-row{flex-wrap:wrap}.qs-row input[type=date]{width:100%;font-size:16px}}
.hr-code-none{font-style:italic}.hr-code-input{text-transform:uppercase;font-variant-numeric:tabular-nums;letter-spacing:.04em}.hr-code-input[readonly]{opacity:.75}
.hr-tabs{margin:12px 0 8px;flex:none;align-self:flex-start}
.hr-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:2px}
.hr-box>.actions{flex:none;margin-top:10px}
.hr-alerts{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:6px}
.hr-alerts li{padding:8px 12px;border-radius:12px;font-size:13px;background:rgba(var(--tint),.06);border:1px solid rgba(var(--tint),.12)}
.hr-alerts li.amber{border-color:color-mix(in srgb,var(--amber) 55%,transparent);background:rgba(218,174,105,.1)}.hr-alerts li.red{border-color:color-mix(in srgb,var(--red) 60%,transparent);background:rgba(211,70,73,.1)}
.hr-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 12px}
.hr-stats>div{padding:10px 12px;border-radius:12px;background:rgba(var(--tint),.06);border:1px solid rgba(var(--tint),.1);display:flex;flex-direction:column;gap:2px;min-width:0}
.hr-stats b{font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hr-stats span{font-size:12px;color:var(--muted)}
.hr-doc,.hr-rec,.hr-review{padding:12px 0;border-bottom:1px solid rgba(var(--tint),.12)}
.hr-doc-top,.hr-rec-top{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.hr-doc-top .btn{margin-left:auto}
.hr-file-list{display:flex;flex-direction:column;gap:6px;margin-top:8px;max-width:560px}
.hr-file{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:8px;align-items:center;padding:6px 6px 6px 10px;border:1px solid rgba(var(--tint),.18);border-radius:12px;background:rgba(var(--tint),.06)}
.hr-file-name{display:flex;align-items:center;gap:6px;min-width:0;text-align:left;font-size:13px}.hr-file-name span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} /* tên tệp một dòng, không gãy giữa chữ */
.hr-file-meta{grid-column:1;font-size:11.5px;color:var(--muted)}
.hr-file .chip-x{grid-column:2;grid-row:1/span 2;min-width:36px;min-height:36px;padding:0;border:0;border-radius:10px;background:transparent;box-shadow:none;color:var(--muted);font-size:18px;line-height:1;cursor:pointer}.hr-file .chip-x:hover{color:var(--red);background:rgba(211,70,73,.12)}
.hr-pre{white-space:pre-wrap;line-height:1.55;margin-top:4px}
.hr-review-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-top:6px}.hr-review-foot .btn{margin-left:6px}
.hr-review-form{padding:12px;border-radius:14px;border:1px solid rgba(var(--accent-rgb),.4);margin:4px 0 10px}
.hr-tbl td{vertical-align:top}
.hr-dt{padding:10px 0;border-bottom:1px solid rgba(var(--tint),.12)}
.hr-dt-top{display:flex;gap:8px;align-items:center}.hr-dt-top input{margin:0}.hr-dt-label{flex:1 1 40%}.hr-dt-hint{flex:1 1 60%}
.hr-dt-lock{flex:none;width:72px;font-size:11px;color:var(--muted);text-align:center}
.hr-dt-levels{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:8px}.hr-dt-levels .su-role{padding:5px 10px;font-size:12.5px}
@media(max-width:720px){.hr-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.hr-head{gap:10px}.hr-av{width:48px;height:48px;font-size:16px}.hr-dt-top{flex-wrap:wrap}.hr-dt-label,.hr-dt-hint{flex:1 1 100%}}
/* Chấm công trong hồ sơ (12/10/2026) */
.hr-att-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.hr-att-head .monthnav{display:flex;align-items:center;gap:8px}
.hr-att-map{margin-bottom:12px}.hr-att-map label{margin-top:0}.hr-att-map-row{display:flex;gap:8px;align-items:center}.hr-att-map-row select{flex:1 1 auto;min-width:0;margin:0}.hr-att-map-row .btn{flex:none}
.hr-stats.hr-stats5{grid-template-columns:repeat(5,minmax(0,1fr))}.hr-stats b small{font-size:12px;font-weight:600;color:var(--muted);margin-left:2px}
.hr-att-tbl td{vertical-align:middle}.hr-att-tbl td:last-child .tag{margin:1px 0}.hr-att-tbl tr.att-off td{opacity:.7}.nowrap{white-space:nowrap}
.hr-key{font-family:ui-monospace,Consolas,monospace;font-size:11.5px;width:100%;margin-top:6px}
@media(max-width:720px){.hr-stats.hr-stats5{grid-template-columns:repeat(2,minmax(0,1fr))}.hr-stats.hr-stats5>div:last-child{grid-column:1/-1}}

/* Hồ sơ của tôi (20/10/2026): bấm tên mình trên đầu trang / Danh bạ → tự khai thông tin, nộp giấy tờ; mục đã có thì chờ người xem hồ sơ duyệt (tab Yêu cầu) */
button.pill{font:inherit;cursor:pointer;transition:border-color .2s,color .2s}
button.pill:hover{border-color:rgba(var(--accent-rgb),.55);color:var(--text)}
.hr-doc-btns{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.hr-doc-top .hr-doc-btns .btn{margin-left:0}
.hr-note-box{display:flex;gap:10px;align-items:flex-start;margin:10px 0;padding:10px 12px;border-radius:14px;font-size:13px;line-height:1.5;background:rgba(var(--accent-rgb),.08);border:1px solid rgba(var(--accent-rgb),.25);color:var(--text2)}
.hr-note-box .gi{color:var(--heading);margin-top:1px}
.hr-info-grid{margin-top:10px}
.field-hint.hr-pend{color:var(--tag-amber,var(--amber))}
.hr-req.pend{border-left:3px solid var(--amber);padding-left:12px}
.hr-req .tbl-wrap{margin-top:8px}
.hr-req-tbl td{vertical-align:top}
.hr-req-act{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}
.hr-req-act .hr-req-note{flex:1 1 220px;min-width:0;margin:0}
.hr-old{margin-top:14px}
.dir-name .linklike{font-weight:inherit;text-decoration:underline;text-decoration-color:rgba(var(--accent-rgb),.5);text-underline-offset:3px}
/* Cài đặt → Ghép chấm công (20/10/2026): ai đã / chưa ghép với tên trên máy chấm công */
.att-ov-bar{align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:10px}
#att-q{margin:0 0 10px}
.att-ov-tbl td{vertical-align:middle}
.att-ov-tbl .att-sel{min-width:190px;max-width:260px;margin:0}
.att-ov-tbl td:last-child{text-align:right;white-space:nowrap}
.hr-stats b small{font-size:12px;color:var(--muted);font-weight:600}
@media (max-width:700px){.att-ov-tbl .att-sel{min-width:140px}}
/* 20/10/2026: đoạn giải thích cách hệ thống chạy (.staff-note) — tài khoản nhân viên (không phải quản trị gốc) không thấy */
html.gmm-staff .staff-note{display:none!important}
/* Quản lý lịch rộng hơn (20/10/2026, người dùng: "tối ưu bảng lịch này để to hơn … để 2 cột thông tin 2 bên hẹp bề ngang lại để lịch này to nhất có thể"):
   tab Quản lý lịch dùng hết bề ngang cửa sổ (trước giới hạn 1052 px ở giữa), cột Bộ lọc / Hôm nay hẹp lại. Đầu trang và thanh tab giữ nguyên. */
@media(min-width:1280px){
 main:has(>#panel-manage.active){max-width:none;padding-left:16px;padding-right:16px}
 #panel-manage.side3.active{grid-template-columns:200px minmax(0,1fr) 236px;gap:14px}
}
@media(min-width:1600px){
 #panel-manage.side3.active{grid-template-columns:228px minmax(0,1fr) 264px;gap:16px}
 #panel-manage.side3>.side-l,#panel-manage.side3>.side-r{justify-self:stretch;width:auto;margin:0 -8px}
}
/* Chế độ nhẹ: nút tia sét nổi góc dưới phải, bên trái nút Kịch bản (trang Cài đặt không có nút Kịch bản thì sát nút góp ý) */
.lite-fab{right:calc(max(16px,env(safe-area-inset-right)) + 52px)} /* sát nút góp ý; chỉ chừa chỗ khi nút Kịch bản → Google Docs đang hiện (31/10/2026: các trang phụ không có nút đó, từng để trống một ô) */
#doc-btn:not(.hidden)+.lite-fab{right:calc(max(16px,env(safe-area-inset-right)) + 104px)}
.lite-fab.on{color:var(--sw-accent);border-color:var(--sw-accent);box-shadow:inset 0 1px 0 var(--sw-inset),0 0 0 3px rgba(var(--sw-accent-rgb),.25),0 8px 22px var(--sw-shadow)}
.lite-fab.on svg{fill:currentColor}
/* Lịch tháng vừa khít: cột Bộ lọc / Hôm nay dừng phía trên hàng nút nổi góc dưới (chuyển trang, tia sét, Kịch bản, góp ý) — phần dài hơn cuộn bên trong cột */
@media(min-width:1280px){#panel-manage.fit-month>.side-l,#panel-manage.fit-month>.side-r{min-height:calc(100% - 64px);padding-bottom:14px}}
/* Lịch tháng vừa khít cửa sổ: tắt hiệu ứng nảy khi lăn chuột ở mép trang (20/10/2026) */
@media(min-width:1280px){html:has(#panel-manage.fit-month.active){overscroll-behavior-y:none}}
/* Cài đặt → Văn phòng + văn phòng của tài khoản (21/10/2026) */
.of-logo{flex:none;display:inline-grid;place-items:center;width:58px;height:34px;border-radius:8px;background:rgba(var(--tint),.08);vertical-align:middle}
.of-logo img{display:block;max-width:50px;max-height:26px;object-fit:contain}
.of-logo.big{width:124px;height:66px}.of-logo.big img{max-width:110px;max-height:54px}
.of-logo.big:has(> img.logo-color){background:#f3f4f6} /* logo màu (logo chính) xem trên nền sáng như ở giao diện Sáng */
.of-logo-dark{background:#151b26;border:1px solid rgba(255,255,255,.08)}.of-logo-dark img[hidden]{display:none}.of-logo-dark small{color:#aab4cc;font-size:12px} /* logo cho nền tối: luôn xem trên nền tối */
.of-name{display:flex;align-items:center;gap:10px}
.of-logo-row{display:flex;align-items:flex-start;gap:12px;margin:4px 0 8px}
.of-logo-act{flex:1;min-width:0}
/* Màu chính của văn phòng (21/10/2026): ô chọn màu + chấm màu cạnh tên trong danh sách */
.of-accent-row{flex-wrap:wrap;margin:4px 0 2px}.of-accent-row .btn[hidden]{display:none}
.of-dot{display:inline-block;width:10px;height:10px;margin:0 2px 0 7px;border-radius:50%;vertical-align:middle;box-shadow:0 0 0 1px rgba(var(--tint),.35)}
/* Xem trước kiểu giao diện theo logo: hộp đặt thẳng bộ biến do GMMOffice.palette() sinh lên chính nó, phần tử con dùng lại các biến đó */
.of-prev{margin:8px 0 6px;padding:14px;border-radius:14px;background:var(--page-bg);border:1px solid rgba(var(--tint),.16)}.of-prev[hidden]{display:none}
.of-prev-card{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;border-radius:12px;background:var(--glass-bg);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);color:var(--text)}
.of-prev-tx{display:grid;gap:2px;margin-right:auto}.of-prev-tx b{color:var(--heading);font-size:13px}.of-prev-tx small{color:var(--muted);font-size:12px}
.of-prev-tab{padding:6px 11px;border-radius:999px;border:1px solid rgba(var(--tint),.2);background:rgba(var(--accent-rgb),.24);color:var(--text);font-size:12.5px;font-weight:600}
.of-prev-btn{padding:7px 16px;border-radius:999px;background:var(--btn-bg);color:var(--btn-text);font-size:13px;font-weight:700}
.um-offices{display:flex;flex-direction:column;gap:8px;margin:6px 0 12px}
.um-office{display:grid;grid-template-columns:auto 1fr minmax(150px,210px);align-items:center;gap:10px}
.um-office label{margin:0}
@media(max-width:560px){.um-office{grid-template-columns:auto 1fr}.um-office select{grid-column:1/-1}.of-logo-row{flex-direction:column}}
/* Cài đặt → Tài khoản & danh bạ (30/10/2026): ô tìm + nút Thêm người, mục Đã nghỉ việc thu gọn, lựa chọn tài khoản trong hộp Sửa */
.mb-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:12px 0 2px}.mb-tools input[type=search]{flex:1;min-width:200px;max-width:440px}.mb-tools .btn{width:auto}
.mb-act{margin:0;justify-content:flex-end;flex-wrap:nowrap}.mb-act .btn{white-space:nowrap}.mb-tbl td.mb-actcell{width:1%;white-space:nowrap}
.mb-tbl td.mb-who{min-width:170px}.mb-tbl td.mb-who .tag{margin-top:4px}.mb-tbl td.mb-roles .tag,.mb-tbl td.mb-grp .tag{margin:0 2px 3px 0}
.mb-note{margin:8px 0 4px}
.mb-gone{margin-top:16px}.mb-gone>summary{cursor:pointer;min-height:36px;display:flex;align-items:center;gap:6px;color:var(--heading);font-weight:700;font-size:13px}
.mm-modes{display:flex;flex-wrap:wrap;gap:0 20px;margin:2px 0 4px}
.mm-acc-act{margin-top:8px}
@media(max-width:720px){ /* điện thoại: mỗi người một thẻ (tên + nút một hàng, vai trò / liên hệ / nhóm quyền bên dưới) thay vì bảng kéo ngang */
 .mb-tbl,.mb-tbl tbody{display:block}.mb-tbl thead{display:none}
 .mb-tbl tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;padding:11px 2px;border-bottom:1px solid rgba(var(--tint),.1)}
 .mb-tbl td{display:block;padding:0;border:0}.mb-tbl td.mb-who{min-width:0}.mb-tbl td.mb-actcell{grid-column:2;grid-row:1;width:auto}
 .mb-tbl td.mb-roles,.mb-tbl td.mb-contact,.mb-tbl td.mb-grp{grid-column:1/-1}.mb-tbl td:empty{display:none}
 .mb-act{gap:6px}.mb-act .btn{min-height:40px}
 .mb-tbl tr.mb-many td.mb-actcell{grid-column:1/-1;grid-row:auto}.mb-tbl tr.mb-many .mb-act{justify-content:flex-start;flex-wrap:wrap} /* 3 nút (Sửa, Khóa tài khoản, Mở lại): xuống hàng riêng */
}
@media(max-width:560px){.mb-tools input[type=search]{max-width:none;min-width:0;flex-basis:100%;font-size:16px}.mb-tools .btn{flex:1;min-height:44px}}
/* 21/10/2026: Claude — chi tiêu tháng (Cài đặt → Kết nối Google & AI) */
.ai-spend{margin-top:10px;font-size:13px}
.ai-meter{height:8px;border-radius:6px;background:rgba(var(--tint),.12);overflow:hidden;margin:6px 0 10px}
.ai-meter>i{display:block;height:100%;border-radius:inherit;background:var(--green);transition:width .4s ease}
.ai-meter.warn>i{background:var(--amber)}.ai-meter.over>i{background:var(--red)}
@media (prefers-reduced-motion:reduce){.ai-meter>i{transition:none}}
/* 21/10/2026: chờ AI đọc thư mời — khung Thư mời tối đi, mèo đuổi chuột chạy ngang (aiWait trong quanly.js) */
.ai-box{position:relative}
.ai-wait{position:absolute;inset:0;z-index:6;border-radius:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px;background:rgba(9,11,18,.58);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:opacity .25s ease}
.ai-wait.on{opacity:1}
.ai-wait-text{color:#f4ede2;font-size:13px;font-weight:600;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.45)}
.ai-wait-sec{font-weight:500;opacity:.75}
/* chờ AI: mèo đuổi chuột (bản 3, 24/10/2026) — kiểu hoạt hình cổ điển: mèo xám xanh chạy 2 chân lao người, 2 tay đeo găng vươn chộp, bụi tung sau gót; chuột nâu chạy
   2 chân ôm phô mai, cười. Thân + đầu một đường bao liền, tay chân thon dần, viền mảnh; tay chân 2 lớp (.ol / .olm viền dưới, .fl / .mfl màu trên) nên khớp không lộ nét.
   Mỗi vòng 3,6 giây mèo vồ, chuột vọt lên thoát rồi ngoái lại trêu (64–90%: đầu .jb nháy mắt lè lưỡi thay đầu .jf).
   Màu nhân vật giống nhau ở mọi trang; vạch đất / bụi / vệt tốc độ theo nền (biến --ground / --dust / --dust-line / --speed đặt riêng mỗi trang) */
.ai-chase{position:relative;width:min(400px,92%);height:122px;overflow:hidden;--line:#2a2f3a;--fur:#7a8fae;--light:#eef0f3;--eyey:#f7efb0;--iris:#7fbf4d;--pink:#f0a9b8;--pupil:#1b2029;--mfur:#c27a36;--mlight:#f3cf98;--cheese:#f7cb45;--cheese2:#ffe07a;--hole:#d9a21f;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.ai-lane{position:absolute;inset:0}
.ai-lane svg{display:block;overflow:visible}
.ai-runner{position:absolute;will-change:transform}
.ai-runner.cat{left:1%;bottom:14px;animation:ai-cat-chase 3.6s cubic-bezier(.45,0,.55,1) infinite}
.ai-runner.mouse{left:58%;bottom:12px;animation:ai-mouse-chase 3.6s cubic-bezier(.45,0,.55,1) infinite}
.ai-lane .fur,.ai-lane .lt,.ai-lane .w,.ai-lane .mfur,.ai-lane .mlt,.ai-lane .ch,.ai-lane .chs{stroke:var(--line);stroke-width:1.6;stroke-linejoin:round}
.ai-mouse .mfur,.ai-mouse .mlt,.ai-mouse .w,.ai-mouse .ch,.ai-mouse .chs{stroke-width:1.5}
.ai-lane .fur{fill:var(--fur)}.ai-lane .lt{fill:var(--light);stroke-width:1.2}.ai-lane .w{fill:#fff}.ai-lane .in{fill:var(--pink)}
.ai-lane .pu,.ai-lane .nose{fill:var(--pupil)}.ai-lane .eyy{fill:var(--eyey);stroke:var(--line);stroke-width:1.4}.ai-lane .iris{fill:var(--iris)}.ai-lane .brow{fill:none;stroke:var(--line);stroke-width:2.6;stroke-linecap:round}
.ai-lane .ln,.ai-lane .wh{fill:none;stroke:var(--line);stroke-linecap:round;stroke-linejoin:round}.ai-lane .ln{stroke-width:1.5}.ai-lane .wh{stroke-width:.9;opacity:.7}
.ai-lane .mfur{fill:var(--mfur)}.ai-lane .mlt{fill:var(--mlight)}
.ai-lane .ch{fill:var(--cheese)}.ai-lane .chs{fill:var(--cheese2)}.ai-lane .hole{fill:var(--hole)}
.ai-lane .ol{fill:var(--line);stroke:var(--line);stroke-width:3.2;stroke-linejoin:round}.ai-lane .fl{fill:var(--fur)}.ai-lane .flw{fill:#fff}
.ai-lane .olm{fill:var(--line);stroke:var(--line);stroke-width:3;stroke-linejoin:round}.ai-lane .mfl{fill:var(--mfur)}.ai-lane .mflw{fill:var(--mlight)}
.ai-lane .tongue{fill:#e8697d;stroke:var(--line);stroke-width:1.2;stroke-linejoin:round}
.ai-mouse .jf{animation:ai-jf 3.6s linear infinite}.ai-mouse .jb{opacity:0;animation:ai-jb 3.6s linear infinite}
.ai-lane .far{--fur:#62769a;--mfur:#9d6638;--mlight:#dcb17d}
.ai-cat .ai-body{transform-origin:80px 90px;animation:ai-cat-bob .42s ease-in-out infinite}
.ai-cat .ey{transform-box:fill-box;transform-origin:center;animation:ai-blink 3.6s infinite}
.ai-cat .th,.ai-cat .sh,.ai-cat .ar,.ai-cat .fa{animation:.42s ease-in-out infinite}
.ai-cat .th{animation-name:ai-cth}.ai-cat .sh{animation-name:ai-csh}.ai-cat .ar{animation-name:ai-car}.ai-cat .fa{animation-name:ai-cfa}
.ai-cat .b{animation-delay:-.21s}
.ai-cat .hand{animation:ai-grab .21s ease-in-out infinite alternate}
.ai-cat .reach{animation:ai-reach 3.6s cubic-bezier(.45,0,.55,1) infinite}
.ai-mouse .ai-body{transform-origin:45px 66px;animation:ai-mouse-bob .28s ease-in-out infinite}
.ai-mouse .mth,.ai-mouse .msh{animation:.28s ease-in-out infinite}
.ai-mouse .mth{animation-name:ai-cth}.ai-mouse .msh{animation-name:ai-csh}.ai-mouse .b{animation-delay:-.14s}
.ai-mouse .cheese{transform-origin:66px 52px;animation:ai-cheese .28s ease-in-out infinite alternate}
.ai-puff{position:absolute;left:34px;bottom:-9px;width:18px;height:18px;border-radius:50%;background:var(--dust);border:1.2px solid var(--dust-line);opacity:0;animation:ai-puff .5s ease-out infinite}
.ai-puff:nth-child(2){left:46px;width:14px;height:14px;animation-delay:-.17s}.ai-puff:nth-child(3){left:24px;width:22px;height:22px;animation-delay:-.33s}
.ai-speed{position:absolute;left:0;bottom:46px;width:20px;height:1.6px;border-radius:2px;background:var(--speed);opacity:0;animation:ai-speed .6s linear infinite}
.ai-speed+.ai-speed{bottom:62px;left:8px;width:14px;animation-delay:-.3s}
.ai-runner.mouse .ai-speed{bottom:28px;left:-4px;width:12px;animation-duration:.45s}
.ai-ground{position:absolute;left:0;right:0;bottom:8px;height:2px;border-radius:2px;background:repeating-linear-gradient(90deg,var(--ground) 0 12px,transparent 12px 22px);animation:ai-ground .21s linear infinite}
@keyframes ai-cat-chase{0%,100%{transform:translate(0,0)}40%{transform:translate(24px,0)}50%{transform:translate(38px,-6px)}58%{transform:translate(43px,0)}70%{transform:translate(34px,0)}}
@keyframes ai-mouse-chase{0%,44%,100%{transform:translate(0,0)}52%{transform:translate(10px,-8px)}60%{transform:translate(25px,0)}75%{transform:translate(18px,0)}}
@keyframes ai-reach{0%,38%,70%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(-10deg) scale(1.12)}58%{transform:rotate(-4deg) scale(1.06)}}
@keyframes ai-cat-bob{0%,50%,100%{transform:translateY(0) rotate(0)}25%,75%{transform:translateY(-3px) rotate(-1.5deg)}}
@keyframes ai-cth{0%,100%{transform:rotate(-55deg)}50%{transform:rotate(40deg)}}
@keyframes ai-csh{0%,100%{transform:rotate(5deg)}30%{transform:rotate(0)}50%{transform:rotate(30deg)}70%{transform:rotate(95deg)}85%{transform:rotate(60deg)}}
@keyframes ai-car{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(6deg)}}
@keyframes ai-cfa{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(10deg)}}
@keyframes ai-grab{from{transform:rotate(-6deg) scale(.94)}to{transform:rotate(6deg) scale(1.06)}}
@keyframes ai-mouse-bob{0%,50%,100%{transform:translateY(0) rotate(0)}25%,75%{transform:translateY(-2.2px) rotate(-2deg)}}
@keyframes ai-cheese{from{transform:translateY(-1px) rotate(-3deg)}to{transform:translateY(1px) rotate(3deg)}}
@keyframes ai-jf{0%,62%,92%,100%{opacity:1}64%,90%{opacity:0}}
@keyframes ai-jb{0%,62%,92%,100%{opacity:0}64%,90%{opacity:1}}
@keyframes ai-blink{0%,90%,100%{transform:scaleY(1)}93%{transform:scaleY(.12)}}
@keyframes ai-puff{0%{opacity:.95;transform:translate(0,0) scale(.3)}100%{opacity:0;transform:translate(-24px,-7px) scale(1.6)}}
@keyframes ai-speed{0%{opacity:0;transform:translateX(0)}30%{opacity:.8}100%{opacity:0;transform:translateX(-18px)}}
@keyframes ai-ground{to{background-position:-22px 0}}
@media(prefers-reduced-motion:reduce){.ai-lane *,.ai-runner,.ai-ground{animation:none!important}}
.ai-chase{--ground:rgba(244,237,226,.4);--dust:rgba(244,237,226,.85);--dust-line:rgba(255,255,255,.5);--speed:rgba(244,237,226,.5)} /* lớp phủ tối khung Thư mời: vạch đất, bụi, vệt tốc độ */
@media(prefers-reduced-motion:reduce){.ai-wait{transition:none}}