/* Bảng tin dự án (vai trò Màn hình bảng tin): trang TV toàn màn hình, chỉ hiển thị. Thiết kế gốc 1920×1080, display-board.js phóng đều theo màn. */
.db-root{position:fixed;z-index:2147483000;top:0;left:0;width:1920px;height:1080px;transform-origin:0 0;display:flex;flex-direction:column;background:var(--bms-canvas);color:var(--bms-text);font-family:var(--bms-font-ui);cursor:none;user-select:none;overflow:hidden}
.db-top{flex:0 0 96px;display:flex;align-items:center;gap:24px;padding:0 48px;background:var(--bms-surface);border-bottom:1px solid var(--bms-border)}
.db-top img{width:60px;height:60px;border-radius:14px}
.db-brand{display:flex;flex-direction:column;justify-content:center;gap:4px;height:60px;line-height:1.1;white-space:nowrap}
.db-brand b{font-size:25px;font-weight:700;letter-spacing:.2px}
.db-brand span{font-size:19px;font-weight:600;color:var(--bms-text-muted)}
.db-sum{flex:1;min-width:0;display:flex;justify-content:center;white-space:nowrap}
.db-sum div{display:flex;align-items:baseline;gap:8px;padding:4px 22px;border-left:1px solid var(--bms-border)}
.db-sum div:first-child{border-left:0}
.db-sum span{font-size:18px;color:var(--bms-text-muted)}
.db-sum b{font-size:28px;font-weight:700;font-variant-numeric:tabular-nums}
.db-sum b.bad{color:var(--bms-danger)}
.db-sum b.warn{color:var(--bms-text)}
.db-sum div.crew{align-items:center}
.db-sum div.crew svg{width:26px;height:26px;color:var(--bms-text-muted);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.db-wx{display:flex;align-items:center;gap:10px;white-space:nowrap}
.db-wx:empty{display:none}
.db-wx svg{flex:0 0 auto;width:52px;height:52px}
.db-wx div{display:grid;grid-template-columns:auto auto;align-items:baseline;column-gap:8px;line-height:1.15}
.db-wx b{font-size:30px;font-weight:700}
.db-wx span{font-size:18px;font-weight:600}
.db-wx small{grid-column:1/-1;font-size:17px;color:var(--bms-text-muted)}
.db-clock{text-align:right;line-height:1.15;white-space:nowrap}
.db-clock b{display:block;font-size:40px;font-weight:700;font-variant-numeric:tabular-nums}
.db-clock span{font-size:18px;color:var(--bms-text-muted)}
.db-stage{position:relative;flex:1;min-height:0}
.db-slide{position:absolute;inset:0;padding:22px 48px;display:flex;flex-direction:column;gap:28px;opacity:0;transform:translateX(48px);transition:opacity 600ms var(--bms-ease-standard),transform 600ms var(--bms-ease-standard)}
.db-slide.on{opacity:1;transform:none}
.db-slide.out{opacity:0;transform:translateX(-48px)}
.db-card{background:var(--bms-surface);border:1px solid var(--bms-border);border-radius:var(--bms-radius-3)}
.db-foot{flex:0 0 40px;display:flex;align-items:center;justify-content:flex-end;padding:0 48px;font-size:17px;color:var(--bms-text-muted);background:var(--bms-surface);border-top:1px solid var(--bms-border)}

/* Tổng quan */
.db-kpis{display:grid;grid-template-columns:repeat(4,1fr)}
.db-kpis div{padding:24px 32px;border-left:1px solid var(--bms-border)}
.db-kpis div:first-child{border-left:0}
.db-kpis span{display:block;font-size:22px;color:var(--bms-text-muted)}
.db-kpis b{display:block;margin-top:4px;font-size:64px;line-height:1.05;font-weight:700;font-variant-numeric:tabular-nums}
.db-kpis b.bad{color:var(--bms-danger)}
.db-kpis b.warn{color:var(--bms-warning)}
.db-list{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.db-list h2{margin:0;padding:22px 32px;font-size:26px;font-weight:700;border-bottom:1px solid var(--bms-border)}
.db-row{display:grid;grid-template-columns:200px minmax(0,1fr) 260px 360px 200px 190px;align-items:center;gap:24px;padding:0 32px;height:84px;border-bottom:1px solid var(--bms-border);font-size:22px}
.db-row:last-child{border-bottom:0}
.db-row.next{background:var(--bms-surface-selected);box-shadow:inset 6px 0 0 var(--bms-primary)}
.db-row.head{height:52px;font-size:20px;color:var(--bms-text-muted);background:var(--bms-surface-subtle)}
.db-code{display:inline-block;padding:6px 14px;border-radius:var(--bms-radius-round);background:var(--bms-primary-soft);color:var(--bms-primary-active);font-weight:700;font-size:20px;white-space:nowrap}
.db-name{min-width:0}
.db-name b,.db-name span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.db-name span{font-size:20px;color:var(--bms-text-muted)}
.db-bar{display:flex;align-items:center;gap:14px}
.db-bar i{flex:1;height:14px;border-radius:7px;background:var(--bms-neutral-soft);overflow:hidden}
.db-bar i em{display:block;height:100%;border-radius:7px;background:var(--bms-success)}
.db-bar.late i em{background:var(--bms-danger)}
.db-bar b{width:64px;text-align:right;font-variant-numeric:tabular-nums}
.db-due small{display:block;font-size:20px}
.late-t{color:var(--bms-danger);font-weight:700}
.soon-t{color:var(--bms-warning);font-weight:700}
.ok-t{color:var(--bms-success);font-weight:700}
.db-chip{display:inline-flex;align-items:center;height:40px;padding:0 16px;border-radius:var(--bms-radius-round);font-size:18px;font-weight:700;white-space:nowrap}
.db-chip.ok{background:var(--bms-success-soft);color:var(--bms-success)}
.db-chip.bad{background:var(--bms-danger-soft);color:var(--bms-danger)}
.db-chip.warn{background:var(--bms-warning-soft);color:var(--bms-warning)}
.db-chip.info{background:var(--bms-info-soft);color:var(--bms-info)}

/* Tổng quan: lịch 5 tuần (thứ + ngày ở trên) như Tiến độ sản xuất ở Dashboard; mỗi dự án một hàng ngang, bên trái như thẻ dự án điện thoại. */
.db-cal{flex:1;min-height:0;display:flex;flex-direction:column;gap:10px}
.db-cal-head,.db-pc{display:grid;grid-template-columns:540px minmax(0,1fr) 200px;gap:24px;padding:0 24px}
.db-cal-head{flex:0 0 96px;align-items:center;background:var(--bms-surface);border:1px solid transparent;border-radius:var(--bms-radius-3)}
.db-cal-head .lbl{display:flex;flex-direction:column;justify-content:center;font-size:19px;font-weight:600;color:var(--bms-text-muted)}
.db-cal-head .lbl h1{margin:0 0 2px;font-size:40px;line-height:1.05;font-weight:700;color:var(--bms-text);white-space:nowrap}
.db-cal-head .lbl.r{align-self:end;padding-bottom:12px;text-align:right;font-weight:700}
.db-cal-days{min-width:0}
.db-cal-days .mon{position:relative;height:28px}
.db-cal-days .mon span{position:absolute;top:0;padding-left:6px;border-left:2px solid var(--bms-border-strong);font-size:20px;font-weight:700;white-space:nowrap}
.db-cal-days .day{display:grid;grid-template-columns:repeat(35,1fr);gap:2px;height:52px}
.db-cal-days .day span{display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.05;border-radius:8px;font-variant-numeric:tabular-nums}
.db-cal-days .day small{font-size:14px;font-weight:500;color:var(--bms-text-muted)}
.db-cal-days .day b{font-size:19px;letter-spacing:-.3px;font-weight:700;color:var(--bms-text)}
.db-cal-days .day .sun small,.db-cal-days .day .sun b{color:var(--bms-danger)}
.db-cal-days .day .now{background:var(--bms-primary);color:#fff}
.db-cal-days .day .now small,.db-cal-days .day .now b{color:#fff}
.db-cards{flex:1;min-height:0;display:grid;grid-template-rows:repeat(8,minmax(0,1fr));gap:8px}
.db-pc{min-width:0;align-items:stretch;background:var(--bms-surface);border:1px solid transparent;border-radius:var(--bms-radius-3)}
.db-pc{transition:border-color 400ms,box-shadow 400ms}
.db-pc.on{border-color:var(--bms-primary);box-shadow:inset 6px 0 0 var(--bms-primary),0 0 0 2px var(--bms-primary)}
.db-pc .info{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:6px}
.db-pc .id{display:flex;align-items:center;gap:10px;min-width:0;white-space:nowrap}
.db-pc .code{font-size:17px;font-weight:600;color:var(--bms-text-muted);font-variant-numeric:tabular-nums}
.db-pc .kind,.db-pc .step{display:inline-flex;align-items:center;flex:0 0 auto;height:24px;padding:0 10px;border-radius:8px;font-size:14px;font-weight:600}
.db-pc .kind{background:var(--bms-neutral-soft);color:var(--bms-text-muted)}
.db-pc .kind.k-trade{background:#f3edff;color:#7a4fd6}
.db-pc .kind.k-internal{background:var(--bms-primary-soft);color:var(--bms-primary-active)}
.db-pc .step{margin-left:auto;padding:0;background:none;font-size:15px;font-weight:500;color:var(--bms-text-muted)}
.db-pc .who{min-width:0;display:flex;align-items:baseline;white-space:nowrap;overflow:hidden}
.db-pc .who .sub{min-width:0;overflow:hidden;text-overflow:ellipsis}
.db-pc .who .own{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;margin-left:14px;font-size:16px;font-weight:600;color:var(--bms-text)}
.db-pc .who .own svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;align-self:center}
.db-pc .name{min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:22px;font-weight:700;line-height:1.2}
.db-pc .sub{margin-left:10px;font-size:16px;font-weight:400;color:var(--bms-text-muted)}
.db-pc .sub::before{content:"·";margin-right:10px}
.db-pc .seg{display:grid;grid-template-columns:repeat(12,1fr);gap:4px}
.db-pc .seg i{height:5px;border-radius:3px;background:#e3e8ef}
.db-pc .seg i.d{background:#9aa4b2}
.db-pc .seg i.w{background:var(--bms-primary)}
.db-pc .seg i.s{background:#f2f4f7}
.db-lane{position:relative;min-width:0;display:grid;grid-template-columns:repeat(35,1fr);gap:0 2px}
.db-lane>i.now{box-shadow:inset 2px 0 0 var(--bms-primary)}
.db-lane .bar{position:absolute;top:50%;height:28px;margin-top:-14px;border-radius:14px;overflow:hidden;background:#e6ebf2}
.db-lane .bar em{position:absolute;left:0;top:0;bottom:0;background:#5b7fb8}
.db-lane .bar u{position:absolute;top:0;right:0;bottom:0;background:repeating-linear-gradient(135deg,var(--bms-danger) 0 8px,#f08a84 8px 16px)}
.db-lane .bar.cut-l{border-top-left-radius:0;border-bottom-left-radius:0}
.db-lane .bar.cut-r{border-top-right-radius:0;border-bottom-right-radius:0}
.db-lane .bar b{position:absolute;left:12px;top:0;line-height:28px;font-size:16px;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.db-lane .bar b.dk{color:var(--bms-text);text-shadow:none}
.db-lane .plate{position:absolute;top:50%;transform:translateY(-50%);display:flex;gap:8px;min-width:0;white-space:nowrap;overflow:hidden}
.db-lane .plate span,.db-bubble .plates span{display:flex;align-items:baseline;gap:8px;min-width:0;padding:3px 10px;border-radius:8px;background:var(--bms-surface);font-size:16px;color:var(--bms-text-muted)}
.db-lane .plate i,.db-bubble .plates i{font-style:normal;min-width:0;overflow:hidden;text-overflow:ellipsis}
.db-lane .plate b,.db-bubble .plates b{flex:0 0 auto;font-weight:700;color:var(--bms-text)}
.db-lane .plate.over span{box-shadow:0 2px 6px rgb(16 24 40 / 18%)}
.db-bubble .plates{display:flex;flex-wrap:wrap;gap:8px;padding:10px 24px 0}
.db-bubble .plates span{padding:6px 12px;font-size:19px;background:var(--bms-surface-subtle)}
.db-lane .off{position:absolute;top:50%;margin-top:-13px;left:12px;font-size:18px;color:var(--bms-text-muted)}
.db-pc .foot{display:grid;grid-template-columns:auto auto;align-items:center;justify-content:end;gap:2px 10px;font-size:17px;color:var(--bms-text-muted);white-space:nowrap}
.db-pc .foot span:first-child{grid-column:1/-1;text-align:right}
.db-pc .foot small{font-size:16px}
.db-pc .foot .db-chip{height:24px;padding:0 10px;font-size:14px}
.db-pc .pct .db-chip{height:36px;font-size:17px;padding:0 12px}

/* Một dự án */
.db-head{display:flex;align-items:center;gap:24px}
.db-head .db-code{font-size:30px;padding:10px 22px}
.db-head h1{flex:1;min-width:0;margin:0;font-size:44px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.db-head h1 small{display:block;font-size:24px;font-weight:500;color:var(--bms-text-muted)}
.db-head .db-chip{height:52px;font-size:22px;padding:0 22px}
.db-steps{padding:22px 28px}
.db-segs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:6px}
.db-segs div{min-width:0;text-align:center}
.db-segs i{display:block;height:16px;border-radius:4px;background:var(--bms-neutral-soft)}
.db-segs .d i{background:var(--bms-success)}
.db-segs .c i{background:var(--bms-primary)}
.db-segs span{display:block;margin-top:10px;font-size:19px;color:var(--bms-text-subtle);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.db-segs .d span{color:var(--bms-text-muted)}
.db-segs .c span{color:var(--bms-primary-active);font-weight:700;font-size:21px}
.db-alert{display:flex;align-items:center;gap:16px;padding:18px 28px;border-radius:var(--bms-radius-2);font-size:24px;font-weight:600}
.db-alert.bad{background:var(--bms-danger-soft);color:var(--bms-danger)}
.db-alert.warn{background:var(--bms-warning-soft);color:var(--bms-warning)}
.db-alert b{flex:0 0 auto;padding:4px 14px;border-radius:var(--bms-radius-round);background:currentColor}
.db-alert b span{color:#fff;font-size:20px}
.db-body{flex:1;min-height:0;display:grid;grid-template-columns:540px minmax(0,1fr) 600px;gap:28px}
.db-body>.db-card{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.db-body h3{margin:0;padding:20px 28px;font-size:22px;font-weight:700;border-bottom:1px solid var(--bms-border)}
.db-big{padding:28px;display:flex;flex-direction:column;gap:22px}
.db-pct{display:flex;align-items:baseline;gap:16px}
.db-pct b{font-size:112px;line-height:1;font-weight:700;font-variant-numeric:tabular-nums}
.db-pct span{font-size:24px;color:var(--bms-text-muted)}
.db-big .db-bar i{height:22px;border-radius:11px}
.db-big .db-bar i em{border-radius:11px}
.db-facts{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;font-size:22px}
.db-facts span{display:block;font-size:20px;color:var(--bms-text-muted)}
.db-facts b{font-size:28px}
.db-orders .o{display:grid;grid-template-columns:minmax(0,1fr) 140px 150px;align-items:center;gap:16px;padding:12px 28px;min-height:84px;border-bottom:1px solid var(--bms-border);font-size:21px}
.db-orders .o:last-child{border-bottom:0}
.db-orders .o b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.db-orders .o small{display:block;font-size:19px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.db-orders .o small{color:var(--bms-text-muted)}
.db-orders .q{text-align:right;font-variant-numeric:tabular-nums;font-weight:700}
.db-orders .db-chip{height:40px;font-size:19px;justify-self:end}
.db-feed{flex:1;min-height:0;display:flex;flex-direction:column}
.db-photo{position:relative;flex:0 0 250px;background:var(--bms-neutral-soft);overflow:hidden}
.db-photo img{width:100%;height:100%;object-fit:cover;display:block}
.db-photo span{position:absolute;left:16px;bottom:16px;padding:6px 14px;border-radius:var(--bms-radius-round);background:rgb(16 16 16 / 66%);color:#fff;font-size:20px}
.db-log{padding:16px 28px;border-bottom:1px solid var(--bms-border);font-size:22px}
.db-log:last-child{border-bottom:0}
.db-log small{display:block;font-size:19px;color:var(--bms-text-muted)}
.db-log p{margin:4px 0 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.db-log.bad p{color:var(--bms-danger)}
.db-empty{padding:28px;font-size:20px;color:var(--bms-text-muted)}
.db-root[hidden]{display:none}
.db-empty.big{margin:auto;font-size:32px}
.db-offline{color:var(--bms-danger);font-weight:700}
@media (prefers-reduced-motion: reduce){.db-slide{transition:opacity 300ms linear;transform:none}.db-slide.out{transform:none}}
body.display-board-active{overflow:hidden}
body.display-board-active>*:not(.db-root){visibility:hidden}
.db-root h1,.db-root h2,.db-root h3{color:var(--bms-text);letter-spacing:0;text-transform:none}
.db-exit{position:absolute;top:22px;right:48px;z-index:2;height:56px;padding:0 28px;border:0;border-radius:var(--bms-radius-round);background:var(--bms-danger);color:#fff;font:700 22px var(--bms-font-ui);cursor:pointer}
.db-root .db-exit[hidden]{display:none}
.db-root:has(.db-exit:not([hidden])){cursor:default}
/* Laptop tự thu nhỏ 85% (bms-auto-density-v8) thì bảng tin vẫn phải kín màn: bỏ zoom khi đang chiếu. */
html.bms-auto-density-85 body.bms-opendesign-v8.display-board-active{zoom:1;min-height:100dvh}

/* Ô hội thoại: mọc ra từ cuối thanh dự án đang tới lượt, lần lượt từng dự án. */
.db-bubble{position:absolute;z-index:5;width:640px;display:flex;background:var(--bms-surface);border:2px solid var(--bms-primary);border-radius:24px;box-shadow:0 24px 64px rgb(16 24 40 / 28%);opacity:0;transform:scale(.4);transition:opacity 450ms var(--bms-ease-standard),transform 550ms cubic-bezier(.2,1.3,.4,1)}
.db-bubble.has-photo{width:1060px}
.db-bubble.on{opacity:1;transform:none}
.db-bubble.out{opacity:0;transform:scale(.9);transition-duration:300ms}
.db-bubble .tail{position:absolute;width:30px;height:30px;background:var(--bms-surface);border:2px solid var(--bms-primary);transform:rotate(45deg)}
.db-bubble.to-b .tail{top:-17px;right:75px;border-right:0;border-bottom:0}
.db-bubble.to-t .tail{bottom:-17px;right:75px;border-left:0;border-top:0}
.db-bubble .db-photo{flex:0 0 440px;height:330px;border-radius:22px 0 0 22px}
.db-bubble .txt{flex:1;min-width:0;display:flex;flex-direction:column}
.db-bubble .hd{display:flex;align-items:baseline;gap:12px;padding:20px 24px 6px;min-width:0}
.db-bubble .hd .code{font-size:18px;font-weight:600;color:var(--bms-text-muted);white-space:nowrap}
.db-bubble .hd b{min-width:0;font-size:24px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.db-bubble .db-log{border-bottom:0;padding:10px 24px 0;font-size:21px}
.db-bubble .db-alert{margin:10px 24px 0;padding:10px 16px;font-size:19px}
.db-bubble .db-alert b span{font-size:16px}
.db-bubble .db-empty{padding:18px 24px;font-size:22px}
.db-bubble .ft{display:flex;align-items:center;gap:14px;margin-top:auto;padding:14px 24px 18px;font-size:20px;color:var(--bms-text-muted)}
.db-bubble .ft b{font-size:34px;font-weight:700;color:var(--bms-text)}
.db-bubble .ft .db-chip{margin-left:auto}