:root{
  --bg:#0B0F14;
  --panel:#0E131B;
  --card:#121826;
  --ink:#EAF0FF;
  --muted:#9AA4BF;
  --border:rgba(234,240,255,0.12);
  --cyan:#00E5FF;
  --magenta:#D946EF;
  --orange:#FF8A3D;
  --shadow:0 18px 60px rgba(0,0,0,0.55);

  --topH:62px;
  --footerH:64px;
  --toolW:380px;
  --gap:14px;
}

*{box-sizing:border-box}

html,body{
  height:100%;
}

body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--ink);
  background:var(--bg);
  overflow-x:hidden;
}

a{
  color:inherit;
  text-decoration:none;
}

button,
a,
input,
select,
textarea,
[role="button"],
.ddBtn,
.menuBtn,
.newsMiniBtn,
.rpClose,
.rpMax,
.chatFs,
.chatClose,
.chatAttach,
.chatSend,
.chatActionBtn{
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

.sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* =========================
   BACKGROUND
========================= */
.bg,
.bgImg,
.bgFx,
.bgGrid{
  pointer-events:none !important;
}

.bg{
  position:fixed;
  inset:0;
  z-index:-1;
  overflow:hidden;
}

.bgImg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 35%;
  filter:saturate(1.05) contrast(1.05);
  transform:scale(1.02);
}

.bgFx{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(11,15,20,.55), rgba(11,15,20,.92));
}

.bgGrid{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(234,240,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(234,240,255,.04) 1px, transparent 1px);
  background-size:46px 46px;
  opacity:.25;
}

/* =========================
   TOP BAR
========================= */
.topbar{
  position:sticky;
  top:0;
  z-index:300;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 14px;
  background:rgba(11,15,20,.70);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
  overflow:visible !important;
}

.brand{
  display:flex;
  gap:10px;
  align-items:center;
  min-width:0;
}

.brandMark{
  width:36px;
  height:36px;
  border-radius:12px;
  display:grid;
  place-items:center;
  font-weight:900;
  background:linear-gradient(135deg,var(--cyan),var(--magenta));
  color:#001014;
  flex:0 0 auto;
}

.brandName{
  font-weight:900;
  letter-spacing:.5px;
  line-height:1;
}

.brandSub{
  font-size:12px;
  color:var(--muted);
  margin-top:2px;
}

.topActions{
  display:flex;
  gap:8px;
  flex:0 0 auto;
}

.pill{
  border:1px solid var(--border);
  background:rgba(234,240,255,.06);
  color:var(--ink);
  border-radius:999px;
  padding:8px 12px;
  cursor:pointer;
  font-weight:900;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}

.pill:hover{
  border-color:rgba(0,229,255,0.55);
  background:rgba(234,240,255,.10);
}

/* =========================
   TOP NAV DROPDOWNS
========================= */
.topNav{
  display:flex;
  align-items:center;
  gap:10px;
  flex:1;
  justify-content:center;
  min-width:0;
  overflow:visible !important;
}

.dd{
  position:relative;
  z-index:400;
  overflow:visible !important;
  flex:0 0 auto;
}

.ddBtn{
  border:1px solid var(--border);
  background:rgba(234,240,255,.05);
  color:rgba(234,240,255,0.90);
  border-radius:999px;
  padding:8px 12px;
  cursor:pointer;
  font-weight:900;
  transition:border-color .18s ease, background .18s ease;
  position:relative;
  z-index:2;
}

.ddBtn:hover{
  border-color:rgba(0,229,255,0.55);
}

.ddPanel{
  display:none;
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  min-width:280px;
  width:320px;
  max-width:min(320px, calc(100vw - 20px));
  padding:10px;
  border-radius:16px;
  border:1px solid rgba(234,240,255,0.14);
  background:rgba(11,15,20,0.98);
  backdrop-filter:blur(12px);
  box-shadow:0 24px 70px rgba(0,0,0,.45);
  flex-direction:column;
  gap:8px;
  z-index:9999;
}

.dd.open .ddPanel{
  display:flex !important;
}

.ddPanel .menuBtn{
  border-radius:14px;
  min-height:50px;
}

.ddPanel .mSub{
  display:block;
}

/* =========================
   MAIN LAYOUT
========================= */
.scene{
  padding:var(--gap);
}

.layout{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--gap);
  align-items:start;
  min-height:calc(100dvh - var(--topH) - var(--footerH) - (var(--gap) * 2));
  min-width:0;
}

.layout.hasTool{
  grid-template-columns:var(--toolW) minmax(0,1fr);
}

#rightPanel[hidden]{
  display:none !important;
  pointer-events:none !important;
}

.centerHero{
  min-width:0;
  border:1px solid rgba(234,240,255,0.10);
  background:rgba(11,15,20,0.18);
  backdrop-filter:none;
  border-radius:18px;
  min-height:min(720px, calc(100dvh - 140px));
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(320px,420px);
  gap:18px;
  align-items:stretch;
  padding:24px;
}

.centerHero > *{
  position:relative;
  z-index:10;
  min-width:0;
}

.centerHero.is-single{
  grid-template-columns:minmax(0,1fr) !important;
}

.centerHero.is-single > .newsWidget,
.centerHero.is-single > .defectWidget{
  grid-column:1 / -1;
  width:100%;
  max-width:none;
  justify-self:stretch;
  align-self:stretch;
}

/* =========================
   NEWS WIDGET
========================= */
.newsWidget{
  position:relative;
  width:100%;
  min-width:0;
  max-width:none;
  height:100%;
  min-height:460px;
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:18px;
  border-radius:24px;
  background:rgba(7,18,28,0.72);
  border:1px solid rgba(120,200,255,0.18);
  box-shadow:0 18px 50px rgba(0,0,0,0.35);
  backdrop-filter:blur(10px);
  z-index:20;
  overflow:hidden;
  align-self:stretch;
  justify-self:stretch;
}

.newsWidget[hidden]{
  display:none !important;
}

.newsWidgetHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  min-width:0;
}

.newsWidgetEyebrow{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#7dd3fc;
  opacity:.9;
}

.newsWidgetTitle{
  margin:4px 0 0;
  font-size:22px;
  line-height:1.1;
  color:#eef6ff;
}

.newsWidgetControls{
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
}

.newsMiniBtn{
  min-width:36px;
  width:36px;
  height:36px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.06);
  color:#eef6ff;
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}

.newsMiniBtn:hover{
  background:rgba(255,255,255,0.12);
  border-color:rgba(255,255,255,0.18);
}

.newsMiniBtn:active{
  transform:translateY(1px);
}

.newsWidgetMeta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
  flex-wrap:wrap;
}

.newsTopicBadge{
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(120,200,255,0.12);
  border:1px solid rgba(120,200,255,0.2);
  color:#dff4ff;
  font-size:13px;
  font-weight:700;
  max-width:100%;
}

.newsWidgetStatus{
  font-size:13px;
  color:#d8e6f5;
  opacity:.9;
  flex:0 0 auto;
}

.newsWidgetBody{
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
}

.newsWidgetItems{
  height:100%;
  overflow:auto;
  display:flex;
  flex-direction:column;
  gap:12px;
  padding-right:4px;
  min-width:0;
}

.newsWidgetItems::-webkit-scrollbar{
  width:8px;
}

.newsWidgetItems::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,0.16);
  border-radius:999px;
}

.newsCard{
  padding:14px;
  border-radius:18px;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.08);
  min-width:0;
}

.newsCardTop{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:10px;
}

.newsBadge{
  display:inline-flex;
  align-items:center;
  padding:5px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.08);
  color:#dcecff;
}

.newsCardTitle{
  margin:0 0 10px;
  font-size:16px;
  line-height:1.35;
  word-break:break-word;
}

.newsCardTitle a{
  color:#ffffff;
  text-decoration:none;
}

.newsCardTitle a:hover{
  text-decoration:underline;
}

.newsCardText{
  font-size:13px;
  line-height:1.5;
  color:#d9e7f5;
  opacity:.95;
  overflow-wrap:anywhere;
}

.newsCardActions{
  margin-top:12px;
}

.newsLinkBtn{
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  text-decoration:none;
  color:#fff;
  background:rgba(108,92,231,0.22);
  border:1px solid rgba(180,160,255,0.22);
  transition:border-color .18s ease, background .18s ease;
}

.newsLinkBtn:hover{
  background:rgba(108,92,231,0.30);
  border-color:rgba(180,160,255,0.34);
}

.newsWidgetFooter{
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-size:12px;
  color:#cddbeb;
  border-top:1px solid rgba(255,255,255,0.08);
  padding-top:10px;
  flex-wrap:wrap;
}

.newsEmpty{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:160px;
  padding:20px;
  text-align:center;
  border-radius:18px;
  background:rgba(255,255,255,0.04);
  color:#d6e4f3;
}

/* =========================
   DEFECT DASHBOARD WIDGET
========================= */
.defectWidget{
  position:relative;
  width:100%;
  min-width:0;
  min-height:460px;
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:18px;
  border-radius:24px;
  background:rgba(7,18,28,0.72);
  border:1px solid rgba(120,200,255,0.18);
  box-shadow:0 18px 50px rgba(0,0,0,0.35);
  backdrop-filter:blur(10px);
  z-index:20;
}

.defectWidget[hidden]{
  display:none !important;
}

.defectWidgetHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.defectWidgetControls{
  display:flex;
  gap:8px;
}

.defectWidgetMeta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.defectWidgetBody{
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.defectChartWrap{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:280px;
  padding:6px 0;
}

#defectChart{
  display:block;
  width:100%;
  max-width:280px;
  height:auto;
}

.defectLegend{
  flex:1;
  min-height:0;
  overflow:auto;
  padding-right:4px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.defectLegend::-webkit-scrollbar{
  width:8px;
}

.defectLegend::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,0.16);
  border-radius:999px;
}

.defectLegendRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.08);
}

.defectLegendLeft{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.defectDot{
  width:10px;
  height:10px;
  border-radius:999px;
  flex:0 0 auto;
}

.defectLegendName{
  font-size:13px;
  font-weight:700;
  color:#eef6ff;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.defectLegendValue{
  font-size:13px;
  font-weight:800;
  color:#ffffff;
  flex:0 0 auto;
}

.defectLegendSub{
  font-size:11px;
  color:#cddbeb;
  opacity:.9;
}

.defectEmpty{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:160px;
  padding:20px;
  text-align:center;
  border-radius:18px;
  background:rgba(255,255,255,0.04);
  color:#d6e4f3;
}

/* =========================
   TOOL PANEL
========================= */
#rightPanel{
  border:1px solid rgba(234,240,255,0.14);
  background:rgba(11,15,20,0.78);
  backdrop-filter:blur(12px);
  border-radius:18px;
  box-shadow:0 18px 70px rgba(0,0,0,0.55);
  overflow:hidden;
  height:min(720px, calc(100dvh - 140px));
  position:sticky;
  top:78px;
  z-index:40;
  min-width:0;
  pointer-events:auto;
}

#rightPanel[hidden] *{
  pointer-events:none !important;
}

.rpTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 12px;
  border-bottom:1px solid rgba(234,240,255,0.10);
  min-height:57px;
}

.rpTitle{
  font-weight:900;
  letter-spacing:.2px;
}

.rpActions{
  display:flex;
  align-items:center;
  gap:8px;
}

.rpClose,
.rpMax{
  width:36px;
  height:36px;
  border-radius:12px;
  border:1px solid rgba(234,240,255,0.16);
  background:rgba(234,240,255,0.08);
  color:rgba(234,240,255,0.92);
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease;
}

.rpClose:hover,
.rpMax:hover{
  border-color:rgba(0,229,255,0.55);
}

#rpFrame{
  width:100%;
  height:calc(100% - 57px);
  border:none;
  background:transparent;
  display:block;
  min-width:0;
  pointer-events:auto;
}

/* =========================
   MENU BUTTONS
========================= */
.menuBtn{
  width:100%;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(234,240,255,0.06);
  color:rgba(234,240,255,0.92);
  padding:10px 10px 9px;
  font-weight:900;
  text-align:left;
  cursor:pointer;
  min-height:42px;
  display:flex;
  flex-direction:column;
  gap:2px;
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease;
  position:relative;
  z-index:2;
}

.menuBtn:hover{
  border-color:rgba(0,229,255,0.55);
  background:rgba(234,240,255,0.08);
}

.menuBtn.isActive{
  border-color:rgba(0,229,255,0.85);
  box-shadow:0 0 0 2px rgba(0,229,255,0.12);
}

.mIcon{
  font-size:15px;
  margin-right:8px;
}

.mSub{
  font-size:12px;
  font-weight:700;
  color:rgba(234,240,255,0.70);
  line-height:1.2;
  display:none;
}

.menuBtn:hover .mSub{
  display:block;
}

/* =========================
   OPTIONAL FULLSCREEN TOOL MODAL
========================= */
#rpBackdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(10px);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease;
  z-index:9998;
}

#rpBackdrop[hidden]{
  display:none !important;
  opacity:0 !important;
  pointer-events:none !important;
}

#rpBackdrop.open{
  opacity:1;
  pointer-events:auto;
}

#rightPanel.open{
  position:fixed !important;
  inset:14px !important;
  width:auto !important;
  height:calc(100dvh - 28px) !important;
  max-width:1280px !important;
  margin:auto !important;
  background:rgba(10,14,20,.94) !important;
  border:1px solid rgba(234,240,255,.16) !important;
  border-radius:18px !important;
  box-shadow:0 30px 90px rgba(0,0,0,.60) !important;
  z-index:9999 !important;
}

#rightPanel.open #rpFrame{
  height:calc(100% - 57px) !important;
  background:#0b0f14 !important;
}

body.toolModalOpen .layout{
  grid-template-columns:minmax(0,1fr) !important;
}

body.toolModalOpen #rightPanel{
  grid-area:auto !important;
}

body.toolModalOpen .centerHero{
  filter:none;
  opacity:1;
  pointer-events:auto;
}

body.toolModalOpen .bg{
  filter:none;
  opacity:1;
}

body.toolModalOpen .topbar,
body.toolModalOpen .footer{
  opacity:1;
  pointer-events:auto;
}

/* =========================
   CHAT
========================= */
.chat{
  position:fixed;
  right:14px;
  left:auto;
  bottom:14px;
  width:min(520px, calc(100vw - 28px));
  max-height:min(74dvh, 720px);
  background:rgba(11,15,20,0.92);
  border:1px solid rgba(234,240,255,0.14);
  border-radius:18px;
  box-shadow:0 30px 90px rgba(0,0,0,.60);
  overflow:hidden;
  z-index:80;
}

.chat[hidden]{
  display:none !important;
  pointer-events:none !important;
}

.chat.is-open{
  display:block;
}

.chat.is-fullscreen{
  inset:10px;
  width:auto;
  max-height:none;
  border-radius:18px;
  z-index:10000;
}

.chatHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 12px;
  border-bottom:1px solid rgba(234,240,255,0.10);
}

.chatTitle{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.chatDot{
  width:10px;
  height:10px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--cyan),var(--magenta));
  flex:0 0 auto;
}

.chatName{
  font-weight:900;
}

.chatSub{
  font-size:12px;
  color:rgba(234,240,255,0.70);
  margin-top:2px;
}

.chatHeaderActions{
  display:flex;
  gap:8px;
  flex:0 0 auto;
}

.chatFs,.chatClose{
  width:36px;
  height:36px;
  border-radius:12px;
  border:1px solid rgba(234,240,255,0.16);
  background:rgba(234,240,255,0.08);
  color:rgba(234,240,255,0.92);
  cursor:pointer;
}

.chatFs:hover,.chatClose:hover{
  border-color:rgba(0,229,255,0.55);
}

.chatBody{
  padding:12px;
  overflow:auto;
  max-height:calc(74dvh - 120px);
}

.chat.is-fullscreen .chatBody{
  max-height:calc(100dvh - 160px);
}

.msg{
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(234,240,255,0.10);
  background:rgba(0,0,0,0.22);
  white-space:pre-wrap;
  line-height:1.35;
  font-size:13px;
  margin-bottom:10px;
  max-width:100%;
  overflow-wrap:anywhere;
}

.msg.user{
  margin-left:auto;
  background:rgba(0,229,255,0.10);
  border-color:rgba(0,229,255,0.18);
}

.msg.ai{
  margin-right:auto;
}

.chatActionsWrap{
  margin-bottom:10px;
}

.chatActionsRow{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.chatActionBtn{
  border-radius:14px;
  border:1px solid rgba(234,240,255,0.14);
  background:rgba(234,240,255,0.08);
  color:rgba(234,240,255,0.92);
  padding:10px 12px;
  cursor:pointer;
  font-weight:900;
}

.chatActionBtn:hover{
  border-color:rgba(0,229,255,0.55);
}

.chatActionBtn:disabled{
  opacity:.55;
  cursor:not-allowed;
}

.chatInput{
  display:flex;
  gap:8px;
  padding:10px 12px;
  border-top:1px solid rgba(234,240,255,0.10);
  align-items:center;
}

#chatNote{
  flex:1;
  min-width:0;
  border-radius:14px;
  border:1px solid rgba(234,240,255,0.14);
  background:rgba(0,0,0,0.22);
  color:rgba(234,240,255,0.92);
  padding:10px 12px;
  outline:none;
}

#chatNote:focus{
  border-color:rgba(0,229,255,0.55);
}

.chatAttach,.chatSend{
  border-radius:14px;
  border:1px solid rgba(234,240,255,0.14);
  background:rgba(234,240,255,0.08);
  color:rgba(234,240,255,0.92);
  padding:10px 12px;
  cursor:pointer;
  font-weight:900;
  transition:border-color .18s ease, background .18s ease;
}

.chatAttach:hover,.chatSend:hover{
  border-color:rgba(0,229,255,0.55);
}

.chat-upload-preview{
  width:100%;
}

/* =========================
   FOOTER
========================= */
.footer{
  padding:12px 16px;
  border-top:1px solid rgba(234,240,255,0.10);
  background:rgba(11,15,20,.45);
  backdrop-filter:blur(10px);
}

.footerBrand{
  font-weight:900;
}

.footerSub{
  font-size:12px;
  color:rgba(234,240,255,0.70);
  margin-top:2px;
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 1200px){
  .centerHero{
    grid-template-columns:minmax(0,1fr) minmax(300px,380px);
  }

  #defectChart{
    max-width:250px;
  }
}

@media (max-width: 980px){
  .topbar{
    flex-wrap:wrap;
    align-items:flex-start;
    justify-content:space-between;
    gap:8px;
  }

  .brand{
    min-width:0;
    flex:1 1 auto;
  }

  .topActions{
    flex:0 0 auto;
  }

  .topNav{
    display:flex;
    order:3;
    width:100%;
    justify-content:flex-start;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    margin-top:8px;
    padding:2px 2px 6px;
    overflow:visible !important;
  }

  .ddBtn{
    white-space:nowrap;
    font-size:14px;
    line-height:1.1;
    padding:9px 12px;
    min-height:40px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .ddPanel{
    top:calc(100% + 8px);
    left:0;
    right:auto;
    width:min(320px, calc(100vw - 20px));
    max-width:calc(100vw - 20px);
    max-height:60dvh;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
  }

  .dd:last-child .ddPanel,
  .dd:nth-last-child(2) .ddPanel{
    left:auto;
    right:0;
  }

  .layout,
  .layout.hasTool{
    grid-template-columns:1fr;
    grid-template-areas:
      "hero"
      "panel";
  }

  .centerHero{
    grid-area:hero;
    min-height:min(620px, calc(100dvh - 180px));
    grid-template-columns:1fr;
    padding:16px;
  }

  #rightPanel{
    grid-area:panel;
    position:static;
    top:auto;
    height:560px;
  }

  body.toolModalOpen #rightPanel{
    position:fixed !important;
    grid-area:auto !important;
  }

  .chat{
    right:10px;
    bottom:10px;
    width:min(560px, calc(100vw - 20px));
    max-height:min(78dvh, 720px);
  }

  .newsWidget,
  .defectWidget{
    width:100%;
    min-width:0;
  }

  .newsWidget{
    min-height:380px;
    height:auto;
  }

  .defectWidget{
    min-height:380px;
    margin:0;
  }

  .defectChartWrap{
    min-height:240px;
  }

  #defectChart{
    max-width:240px;
  }
}

@media (max-width: 760px){
  #rightPanel{
    height:min(78dvh, 640px);
    border-radius:16px;
  }

  #rightPanel.open{
    inset:8px !important;
    width:auto !important;
    height:calc(100dvh - 16px) !important;
    max-width:none !important;
    border-radius:16px !important;
  }

  .topbar{
    padding:10px 10px;
    gap:8px;
  }

  .brand{
    gap:8px;
  }

  .brandMark{
    width:34px;
    height:34px;
    border-radius:11px;
  }

  .brandName{
    font-size:14px;
  }

  .brandSub{
    display:none;
  }

  .topActions .pill{
    padding:8px 11px;
    min-height:38px;
  }

  .topNav{
    gap:7px;
    margin-top:6px;
    padding-bottom:4px;
    flex-wrap:wrap;
    overflow:visible !important;
  }

  .ddBtn{
    font-size:13px;
    padding:8px 10px;
    min-height:38px;
  }

  .ddPanel{
    top:calc(100% + 7px);
    width:min(300px, calc(100vw - 16px));
    max-width:calc(100vw - 16px);
    border-radius:14px;
    padding:8px;
    max-height:58dvh;
  }

  .ddPanel .menuBtn{
    border-radius:12px;
    min-height:50px;
  }

  .scene{
    padding:10px;
  }

  .centerHero{
    border-radius:16px;
    min-height:min(520px, calc(100dvh - 170px));
    grid-template-columns:1fr;
    padding:12px;
  }

  .chat{
    right:8px;
    left:8px;
    width:auto;
    bottom:8px;
    border-radius:16px;
    max-height:min(82dvh, 720px);
  }

  .chatHeader{
    padding:10px;
  }

  .chatBody{
    padding:10px;
    max-height:calc(82dvh - 122px);
  }

  .chatInput{
    padding:10px;
    gap:6px;
    flex-wrap:wrap;
  }

  #chatNote{
    min-width:100%;
  }

  .chatAttach,
  .chatSend,
  .chatActionBtn{
    min-height:42px;
  }

  .footer{
    padding:10px 12px;
  }

  .newsWidget{
    min-height:360px;
    height:auto;
    padding:14px;
    border-radius:18px;
  }

  .newsWidgetTitle{
    font-size:18px;
  }

  .newsWidgetMeta,
  .defectWidgetMeta{
    flex-direction:column;
    align-items:flex-start;
  }

  .newsCardTitle{
    font-size:15px;
  }

  .newsCardText{
    font-size:12px;
  }

  .defectWidget{
    min-height:360px;
    padding:14px;
    border-radius:18px;
  }

  .defectChartWrap{
    min-height:220px;
  }

  #defectChart{
    max-width:220px;
  }
}

@media (max-width: 480px){
  .topbar{
    padding:8px 8px;
  }

  .brandName{
    font-size:13px;
    letter-spacing:.03em;
  }

  .ddBtn{
    font-size:12px;
    padding:8px 9px;
    min-height:36px;
  }

  .ddPanel{
    width:min(280px, calc(100vw - 12px));
    max-width:calc(100vw - 12px);
    max-height:56dvh;
  }

  #rightPanel{
    height:460px;
  }

  .chat{
    right:6px;
    left:6px;
    bottom:6px;
    border-radius:14px;
  }

  .chat.is-fullscreen{
    inset:6px;
  }

  .newsWidget{
    min-height:340px;
    height:auto;
    padding:12px;
    border-radius:16px;
  }

  .newsMiniBtn{
    min-width:32px;
    height:32px;
  }

  .newsTopicBadge{
    font-size:12px;
    padding:7px 10px;
  }

  .newsWidgetFooter{
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
  }

  .defectWidget{
    min-height:340px;
    padding:12px;
    border-radius:16px;
  }

  .defectLegendRow{
    padding:9px 10px;
  }

  .defectLegendName,
  .defectLegendValue{
    font-size:12px;
  }

  .defectLegendSub{
    font-size:10px;
  }

  .defectChartWrap{
    min-height:200px;
  }

  #defectChart{
    max-width:200px;
  }
}

/* =========================
   CONTACT PAGE / MENU POLISH
========================= */
.dd[data-dd="contact"] .ddBtn{
  background:rgba(217,70,239,0.08);
  border-color:rgba(217,70,239,0.20);
}

.dd[data-dd="contact"] .ddBtn:hover{
  border-color:rgba(217,70,239,0.45);
  background:rgba(217,70,239,0.12);
}

.dd[data-dd="contact"] .menuBtn.isActive{
  border-color:rgba(217,70,239,0.72);
  box-shadow:0 0 0 2px rgba(217,70,239,0.12);
}

.dd[data-dd="contact"] .mIcon{
  margin-right:8px;
}

body:not(.toolModalOpen) .centerHero{
  transition:border-color .18s ease, background .18s ease;
}

/* =========================
   CONTACT FULLSCREEN PANEL
========================= */
#rightPanel.open[data-tool="contact"]{
  position:fixed !important;
  inset:12px !important;
  width:auto !important;
  height:calc(100dvh - 24px) !important;
  max-width:1400px !important;
  margin:auto !important;
  border-radius:20px !important;
  z-index:9999 !important;
}

#rightPanel.open[data-tool="contact"] #rpFrame{
  height:calc(100% - 57px) !important;
  background:#0b0f14 !important;
}
/* =========================================================
   COATDOCTOR MOBILE / TOUCH / SAFE-AREA PATCH
========================================================= */

:root{
  --cd-safe-top: env(safe-area-inset-top, 0px);
  --cd-safe-right: env(safe-area-inset-right, 0px);
  --cd-safe-bottom: env(safe-area-inset-bottom, 0px);
  --cd-safe-left: env(safe-area-inset-left, 0px);

  --cd-touch: 46px;
  --cd-radius: 14px;
  --cd-gap: 12px;
}

/* Better box model */
*,
*::before,
*::after{
  box-sizing:border-box;
}

html,
body{
  min-height:100%;
  width:100%;
  overflow-x:hidden;
}

body{
  min-height:100vh;
  min-height:100dvh;
  overscroll-behavior-y:none;
  touch-action:manipulation;
}

/* само за WebKit (Safari / iOS) */
@supports (-webkit-touch-callout: none) {
  body{
    -webkit-text-size-adjust:100%;
  }
}

/* Prevent accidental horizontal overflow */
img,
canvas,
iframe,
video{
  max-width:100%;
  height:auto;
}

/* Make buttons and inputs more touch-friendly */
button,
input,
select,
textarea{
  font:inherit;
}

button{
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

input,
textarea,
select{
  min-height:var(--cd-touch);
}

/* Topbar safe area */
.topbar{
  padding-top:calc(10px + var(--cd-safe-top));
  padding-left:calc(12px + var(--cd-safe-left));
  padding-right:calc(12px + var(--cd-safe-right));
}

/* Main scene / layout */
.scene{
  min-height:calc(100vh - 80px);
  min-height:calc(100dvh - 80px);
  padding-left:max(12px, var(--cd-safe-left));
  padding-right:max(12px, var(--cd-safe-right));
  padding-bottom:max(12px, var(--cd-safe-bottom));
}

.layout{
  width:100%;
  min-width:0;
}

/* Tool panel / iframe panel */
.toolPanel{
  min-width:0;
  overflow:hidden;
}

.rpTop{
  padding-top:max(10px, var(--cd-safe-top));
  padding-left:12px;
  padding-right:12px;
  gap:10px;
}

.rpActions{
  display:flex;
  align-items:center;
  gap:8px;
}

.rpMax,
.rpClose,
.chatFs,
.chatClose,
.newsMiniBtn{
  min-width:44px;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
}

/* Chat panel */
.chat{
  width:min(100%, 460px);
  max-width:100%;
  min-width:0;
  border-radius:18px;
  overflow:hidden;
}

.chatDock{
  max-height:calc(100dvh - 24px - var(--cd-safe-top) - var(--cd-safe-bottom));
}

.chat.is-fullscreen,
.chatDock.is-fullscreen{
  position:fixed;
  inset:0;
  width:100vw;
  width:100dvw;
  height:100vh;
  height:100dvh;
  max-height:none;
  border-radius:0;
  z-index:9999;
  padding-top:var(--cd-safe-top);
  padding-right:var(--cd-safe-right);
  padding-bottom:var(--cd-safe-bottom);
  padding-left:var(--cd-safe-left);
}

.chatHeader{
  position:sticky;
  top:0;
  z-index:2;
  padding:12px;
  gap:10px;
}

.chatHeaderActions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}

.chatTitle{
  min-width:0;
}

.chatName,
.chatSub{
  word-break:break-word;
}

.chatBody{
  min-width:0;
  overflow-x:hidden;
  overscroll-behavior:contain;
  padding:12px;
  gap:10px;
}

.msg{
  max-width:100%;
  min-width:0;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.msg img{
  display:block;
  max-width:100%;
  height:auto;
  border-radius:12px;
}

/* Chat input area */
.chatInput{
  position:sticky;
  bottom:0;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto auto;
  gap:8px;
  padding:12px;
  padding-bottom:max(12px, var(--cd-safe-bottom));
  align-items:center;
}

.chatInput input[type="text"],
.chatInput textarea,
#chatNote{
  width:100%;
  min-width:0;
  border-radius:12px;
  padding:12px 14px;
}

.chatAttach,
.chatSend,
#analyzeBtn,
#uploadBtn,
#sendBtn{
  min-height:46px;
  min-width:46px;
  padding:0 14px;
  border-radius:12px;
  white-space:nowrap;
}

/* Chat cards */
.chatResultCard{
  width:100%;
  min-width:0;
  border-radius:16px;
  overflow:hidden;
}

.chatResultTitle{
  font-size:13px;
  line-height:1.3;
  word-break:break-word;
}

.chatResultBody{
  font-size:13px;
  line-height:1.5;
  white-space:pre-wrap;
  word-break:break-word;
  overflow-wrap:anywhere;
}

/* Action rows */
.chatActionsWrap{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  width:100%;
  min-width:0;
}

.chatActionBtn{
  min-height:46px;
  padding:10px 14px;
  border-radius:12px;
  flex:1 1 220px;
  max-width:100%;
  white-space:normal;
  text-align:left;
  line-height:1.35;
}

/* Home widgets */
.centerHero{
  min-width:0;
}

.newsWidget,
.defectWidget{
  min-width:0;
  overflow:hidden;
  border-radius:18px;
}

.newsWidgetHead,
.defectWidgetHead,
.newsWidgetMeta,
.newsWidgetFooter{
  gap:10px;
}

.newsWidgetTitle{
  word-break:break-word;
}

.newsWidgetBody,
.defectWidgetBody{
  min-width:0;
}

.newsWidgetItems,
.defectLegend{
  min-width:0;
}

.newsEmpty{
  word-break:break-word;
}

/* Defect dashboard */
.defectWidgetBody{
  display:grid;
  grid-template-columns:minmax(0,280px) minmax(0,1fr);
  gap:14px;
  align-items:start;
}

.defectChartWrap{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
}

#defectChart{
  width:min(100%, 280px);
  height:auto;
}

.defectLegendRow--rich,
.defectSummaryCard,
.defectSessionRow,
.defectActionRow{
  min-width:0;
}

.defectLegendText,
.defectSummaryValue--small,
.defectActionText,
.defectSessionMeta{
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* Footer safe area */
.footer{
  padding-left:max(12px, var(--cd-safe-left));
  padding-right:max(12px, var(--cd-safe-right));
  padding-bottom:max(12px, var(--cd-safe-bottom));
}

/* =========================================================
   TABLET
========================================================= */
@media (max-width: 1100px){
  .layout{
    display:block;
  }

  .centerHero{
    width:100%;
  }

  .toolPanel{
    width:100%;
    margin-top:12px;
  }

  .defectWidgetBody{
    grid-template-columns:1fr;
  }

  .defectChartWrap{
    justify-content:center;
  }
}

/* =========================================================
   MOBILE
========================================================= */
@media (max-width: 820px){
  .topbar{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }

  .brand{
    min-width:0;
  }

  .brandText{
    min-width:0;
  }

  .brandName,
  .brandSub{
    overflow-wrap:anywhere;
  }

  .topNav{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    min-width:0;
  }

  .dd{
    flex:1 1 calc(50% - 8px);
    min-width:0;
  }

  .ddBtn{
    width:100%;
    min-height:46px;
    border-radius:12px;
  }

  .ddPanel{
    width:min(100vw - 24px, 420px);
    max-width:100%;
  }

  .menuBtn{
    min-height:46px;
    align-items:flex-start;
  }

  .scene{
    padding-top:10px;
  }

  .centerHero{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }

  .newsWidgetControls,
  .defectWidgetControls{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }

  .chat{
    width:100%;
  }

  .chatDock{
    position:fixed;
    left:max(8px, var(--cd-safe-left));
    right:max(8px, var(--cd-safe-right));
    bottom:max(8px, var(--cd-safe-bottom));
    width:auto;
    max-width:none;
    z-index:4000;
  }

  .chatInput{
    grid-template-columns:1fr 1fr;
    grid-template-areas:
      "note note"
      "upload send"
      "analyze analyze";
  }

  #chatNote{
    grid-area:note;
  }

  #uploadBtn{
    grid-area:upload;
  }

  #sendBtn{
    grid-area:send;
  }

  #analyzeBtn{
    grid-area:analyze;
    width:100%;
  }

  .chatActionBtn{
    flex:1 1 100%;
  }
}

/* =========================================================
   SMALL MOBILE
========================================================= */
@media (max-width: 520px){
  .topbar{
    padding-left:max(10px, var(--cd-safe-left));
    padding-right:max(10px, var(--cd-safe-right));
  }

  .scene{
    padding-left:max(10px, var(--cd-safe-left));
    padding-right:max(10px, var(--cd-safe-right));
  }

  .brand{
    gap:10px;
  }

  .brandMark{
    width:40px;
    height:40px;
    flex:0 0 40px;
  }

  .brandName{
    font-size:16px;
    line-height:1.1;
  }

  .brandSub{
    font-size:11px;
    line-height:1.3;
  }

  .dd{
    flex:1 1 100%;
  }

  .newsWidget,
  .defectWidget{
    border-radius:16px;
  }

  .newsWidgetHead,
  .defectWidgetHead,
  .newsWidgetMeta,
  .newsWidgetFooter{
    display:grid;
    grid-template-columns:1fr;
    align-items:start;
  }

  .newsWidgetTitle{
    font-size:18px;
    line-height:1.2;
  }

  .chatHeader{
    padding:10px;
  }

  .chatBody{
    padding:10px;
  }

  .chatInput{
    padding:10px;
    padding-bottom:max(10px, var(--cd-safe-bottom));
  }

  .msg{
    font-size:13px;
    line-height:1.45;
  }

  .chatResultTitle{
    font-size:12px;
  }

  .chatResultBody{
    font-size:12px;
  }

  .chatActionBtn,
  .chatAttach,
  .chatSend,
  #analyzeBtn,
  #uploadBtn,
  #sendBtn{
    min-height:48px;
  }

  #defectChart{
    width:min(100%, 240px);
  }
}

/* =========================================================
   iPhone keyboard / viewport helpers
========================================================= */
@supports (height: 100dvh){
  .chatDock{
    max-height:calc(100dvh - 16px - var(--cd-safe-top) - var(--cd-safe-bottom));
  }

  .scene{
    min-height:calc(100dvh - 80px);
  }
}

/* Better focus for touch and keyboard */
.chatActionBtn:focus-visible,
.chatAttach:focus-visible,
.chatSend:focus-visible,
.ddBtn:focus-visible,
.menuBtn:focus-visible,
.newsMiniBtn:focus-visible,
.rpClose:focus-visible,
.rpMax:focus-visible,
.chatClose:focus-visible,
.chatFs:focus-visible,
#chatNote:focus-visible{
  outline:2px solid rgba(0,229,255,.9);
  outline-offset:2px;
}
.bgFx,
.bgGrid{
  display:none !important;
}

.bgImg{
  filter:none !important;
  opacity:1 !important;
}
/* =========================================================
   COATDOCTOR HOME — EXECUTIVE ENTERPRISE LAYOUT
========================================================= */

.layout{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:22px;
  align-items:start;
}

.centerHero{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:22px;
  width:100%;
  min-width:0;
}

.newsWidget,
.defectWidget{
  width:100%;
  min-width:0;
  max-width:none;
}

/* =========================================================
   HERO DASHBOARD
========================================================= */

.defectWidget--hero{
  position:relative;
  border:1px solid rgba(234,240,255,.12);
  background:
    linear-gradient(180deg, rgba(6,21,31,.84) 0%, rgba(8,18,29,.92) 100%);
  border-radius:24px;
  padding:22px;
  box-shadow:
    0 24px 80px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(14px);
  overflow:hidden;
}

.defectWidget--hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top right, rgba(0,229,255,.10), transparent 28%),
    radial-gradient(circle at top left, rgba(217,70,239,.10), transparent 24%);
  pointer-events:none;
}

.defectHeroHead{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  margin-bottom:14px;
}

.defectHeroTitleWrap{
  min-width:0;
  max-width:980px;
}

.defectHeroTitle{
  margin:6px 0 8px;
  font-size:36px;
  line-height:1.05;
  font-weight:900;
  letter-spacing:-.02em;
  color:rgba(234,240,255,.98);
}

.defectHeroSub{
  max-width:920px;
  font-size:15px;
  line-height:1.55;
  color:rgba(234,240,255,.78);
}

.defectHeroActions{
  flex:0 0 auto;
}

.defectWidgetMeta--hero{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

/* =========================================================
   EXECUTIVE KPI ROW
========================================================= */

.defectExecutiveTop{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-bottom:22px;
}

.executiveKpiCard{
  border:1px solid rgba(234,240,255,.10);
  background:rgba(255,255,255,.04);
  border-radius:18px;
  padding:16px 16px 14px;
  min-height:104px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.executiveKpiLabel{
  font-size:11px;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.08em;
  opacity:.7;
  margin-bottom:10px;
}

.executiveKpiValue{
  font-size:34px;
  line-height:1;
  font-weight:900;
  color:rgba(234,240,255,.98);
  word-break:break-word;
}

.executiveKpiValue--small{
  font-size:18px;
  line-height:1.25;
}

/* =========================================================
   MAIN DASHBOARD GRID
========================================================= */

.defectExecutiveMain{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(320px, 420px) minmax(0,1fr);
  gap:20px;
  align-items:start;
}

.defectChartPanel,
.defectInsightsPanel{
  border:1px solid rgba(234,240,255,.10);
  background:rgba(255,255,255,.03);
  border-radius:22px;
  padding:18px;
  min-width:0;
}

.defectChartPanelTitle,
.defectInsightsPanelTitle{
  font-size:13px;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.08em;
  opacity:.72;
  margin-bottom:12px;
}

.defectChartWrap--hero{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:360px;
  width:100%;
}

#defectChart{
  width:320px;
  height:320px;
  max-width:100%;
}

.defectLegend--hero{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:12px;
  width:100%;
  min-width:0;
}

/* =========================================================
   SUMMARY / INSIGHT CARDS
========================================================= */

.defectSummaryCard{
  border:1px solid rgba(234,240,255,.10);
  background:rgba(10,18,30,.42);
  border-radius:18px;
  padding:14px;
  backdrop-filter:blur(8px);
}

.defectSummaryGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.defectSummaryItem{
  border:1px solid rgba(234,240,255,.08);
  background:rgba(255,255,255,.03);
  border-radius:14px;
  padding:12px;
  min-height:92px;
}

.defectSummaryLabel{
  font-size:11px;
  line-height:1.2;
  opacity:.72;
  margin-bottom:8px;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.defectSummaryValue{
  font-size:22px;
  line-height:1.08;
  font-weight:900;
  color:rgba(234,240,255,.96);
  word-break:break-word;
}

.defectSummaryValue--small{
  font-size:14px;
  line-height:1.4;
  font-weight:800;
}

.defectSummarySource{
  margin-top:12px;
  font-size:12px;
  line-height:1.55;
  opacity:.84;
  word-break:break-word;
}

/* =========================================================
   RECENT / ACTION LISTS
========================================================= */

.defectSessionList,
.defectActionList{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:10px;
}

.defectSessionRow,
.defectActionRow{
  border:1px solid rgba(234,240,255,.08);
  background:rgba(255,255,255,.03);
  border-radius:14px;
  padding:12px;
}

.defectSessionMain{
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  font-size:13px;
  line-height:1.35;
  font-weight:800;
}

.defectSessionMeta,
.defectActionText{
  font-size:12px;
  line-height:1.5;
  opacity:.8;
  margin-top:6px;
}

.defectActionTitle{
  font-size:13px;
  line-height:1.35;
  font-weight:800;
}

/* =========================================================
   DEFECT ROWS
========================================================= */

.defectLegendRow--rich{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  border:1px solid rgba(234,240,255,.08);
  background:rgba(255,255,255,.03);
  border-radius:14px;
  padding:12px 14px;
}

.defectLegendLeft{
  display:flex;
  align-items:flex-start;
  gap:12px;
  min-width:0;
  flex:1 1 auto;
}

.defectDot{
  width:12px;
  height:12px;
  border-radius:999px;
  margin-top:6px;
  flex:0 0 auto;
  box-shadow:0 0 14px rgba(255,255,255,.14);
}

.defectLegendText{
  min-width:0;
  flex:1 1 auto;
}

.defectLegendName{
  font-size:14px;
  font-weight:900;
  line-height:1.3;
  word-break:break-word;
}

.defectLegendSub{
  font-size:12px;
  opacity:.86;
  margin-top:5px;
  line-height:1.5;
  word-break:break-word;
}

.defectLegendMeta{
  font-size:11px;
  opacity:.68;
  margin-top:5px;
  line-height:1.45;
  word-break:break-word;
}

.defectLegendValue{
  flex:0 0 auto;
  font-size:14px;
  font-weight:900;
  white-space:nowrap;
  color:rgba(234,240,255,.96);
}

/* =========================================================
   NEWS — SECONDARY / QUIETER
========================================================= */

.newsWidget--secondary{
  border:1px solid rgba(234,240,255,.10);
  background:rgba(8,18,29,.78);
  border-radius:22px;
  padding:18px;
  box-shadow:0 18px 50px rgba(0,0,0,.24);
}

.newsWidgetHead--compact{
  margin-bottom:8px;
}

.newsWidget--secondary .newsWidgetTitle{
  font-size:24px;
  line-height:1.15;
}

.newsWidget--secondary .newsWidgetBody{
  margin-top:12px;
}

.newsWidget--secondary .newsWidgetItems{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:10px;
}

.newsWidget--secondary .newsCard{
  border:1px solid rgba(234,240,255,.08);
  background:rgba(255,255,255,.03);
  border-radius:16px;
  padding:14px;
}

.newsWidget--secondary .newsCardTitle{
  font-size:18px;
  line-height:1.3;
}

.newsWidget--secondary .newsCardText{
  font-size:13px;
  line-height:1.5;
  opacity:.82;
}

.newsWidget--secondary .newsCardActions{
  margin-top:8px;
}

.newsWidgetFooter{
  display:flex;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1200px){
  .defectExecutiveTop{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .defectExecutiveMain{
    grid-template-columns:minmax(0,1fr);
  }

  .defectSummaryGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 760px){
  .defectWidget--hero,
  .newsWidget--secondary{
    padding:16px;
  }

  .defectHeroTitle{
    font-size:28px;
  }

  .defectExecutiveTop{
    grid-template-columns:minmax(0,1fr);
  }

  .defectSummaryGrid{
    grid-template-columns:minmax(0,1fr);
  }

  .defectLegendRow--rich{
    flex-direction:column;
    align-items:flex-start;
  }

  #defectChart{
    width:260px;
    height:260px;
  }

  .defectChartWrap--hero{
    min-height:280px;
  }
}
/* =========================================================
   COATDOCTOR HOME — EXECUTIVE ENTERPRISE OVERRIDE
   Put this at the VERY END of style.css
========================================================= */

/* ---------- HOME LAYOUT ---------- */
.layout{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:22px !important;
  align-items:start !important;
}

.layout.hasTool{
  grid-template-columns:var(--toolW) minmax(0,1fr) !important;
}

.centerHero{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:22px !important;
  width:100% !important;
  min-width:0 !important;
  min-height:auto !important;
  padding:0 !important;
  border:none !important;
  background:transparent !important;
  backdrop-filter:none !important;
  box-shadow:none !important;
  overflow:visible !important;
}

.centerHero > *{
  min-width:0 !important;
}

/* ---------- DASHBOARD HERO ---------- */
.defectWidget--hero{
  position:relative;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  min-height:auto !important;
  display:flex !important;
  flex-direction:column !important;
  gap:0 !important;
  padding:22px !important;
  border:1px solid rgba(234,240,255,.12) !important;
  border-radius:24px !important;
  background:
    linear-gradient(180deg, rgba(6,21,31,.84) 0%, rgba(8,18,29,.92) 100%) !important;
  box-shadow:
    0 24px 80px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.05) !important;
  backdrop-filter:blur(14px) !important;
  overflow:hidden !important;
}

.defectWidget--hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top right, rgba(0,229,255,.10), transparent 28%),
    radial-gradient(circle at top left, rgba(217,70,239,.10), transparent 24%);
  pointer-events:none;
}

.defectHeroHead{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  margin-bottom:14px;
}

.defectHeroTitleWrap{
  min-width:0;
  max-width:980px;
}

.defectHeroTitle{
  margin:6px 0 8px;
  font-size:36px;
  line-height:1.05;
  font-weight:900;
  letter-spacing:-.02em;
  color:rgba(234,240,255,.98);
}

.defectHeroSub{
  max-width:920px;
  font-size:15px;
  line-height:1.55;
  color:rgba(234,240,255,.78);
}

.defectHeroActions{
  flex:0 0 auto;
}

.defectWidgetMeta--hero{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

/* ---------- EXECUTIVE KPI ROW ---------- */
.defectExecutiveTop{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-bottom:22px;
}

.executiveKpiCard{
  border:1px solid rgba(234,240,255,.10);
  background:rgba(255,255,255,.04);
  border-radius:18px;
  padding:16px 16px 14px;
  min-height:104px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.executiveKpiLabel{
  font-size:11px;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.08em;
  opacity:.7;
  margin-bottom:10px;
}

.executiveKpiValue{
  font-size:34px;
  line-height:1;
  font-weight:900;
  color:rgba(234,240,255,.98);
  word-break:break-word;
}

.executiveKpiValue--small{
  font-size:18px;
  line-height:1.25;
}

/* ---------- DASHBOARD MAIN GRID ---------- */
.defectExecutiveMain{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(320px,420px) minmax(0,1fr);
  gap:20px;
  align-items:start;
}

.defectChartPanel,
.defectInsightsPanel{
  border:1px solid rgba(234,240,255,.10);
  background:rgba(255,255,255,.03);
  border-radius:22px;
  padding:18px;
  min-width:0;
}

.defectChartPanelTitle,
.defectInsightsPanelTitle{
  font-size:13px;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.08em;
  opacity:.72;
  margin-bottom:12px;
}

.defectChartWrap--hero{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  min-height:360px !important;
  width:100% !important;
}

#defectChart{
  display:block;
  width:320px !important;
  height:320px !important;
  max-width:100% !important;
}

.defectLegend--hero{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:12px !important;
  width:100% !important;
  min-width:0 !important;
  max-height:none !important;
  overflow:visible !important;
  padding-right:0 !important;
}

/* ---------- SUMMARY / INSIGHT CARDS ---------- */
.defectSummaryCard{
  border:1px solid rgba(234,240,255,.10) !important;
  background:rgba(10,18,30,.42) !important;
  border-radius:18px !important;
  padding:14px !important;
  backdrop-filter:blur(8px);
  margin-bottom:0 !important;
}

.defectSummaryGrid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
}

.defectSummaryItem{
  border:1px solid rgba(234,240,255,.08) !important;
  background:rgba(255,255,255,.03) !important;
  border-radius:14px !important;
  padding:12px !important;
  min-height:92px !important;
}

.defectSummaryLabel{
  font-size:11px !important;
  line-height:1.2 !important;
  opacity:.72 !important;
  margin-bottom:8px !important;
  text-transform:uppercase !important;
  letter-spacing:.06em !important;
}

.defectSummaryValue{
  font-size:22px !important;
  line-height:1.08 !important;
  font-weight:900 !important;
  color:rgba(234,240,255,.96) !important;
  word-break:break-word !important;
}

.defectSummaryValue--small{
  font-size:14px !important;
  line-height:1.4 !important;
  font-weight:800 !important;
}

.defectSummarySource{
  margin-top:12px !important;
  font-size:12px !important;
  line-height:1.55 !important;
  opacity:.84 !important;
  word-break:break-word !important;
}

/* ---------- RECENT / ACTION LIST ---------- */
.defectSessionList,
.defectActionList{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:10px !important;
}

.defectSessionRow,
.defectActionRow{
  border:1px solid rgba(234,240,255,.08) !important;
  background:rgba(255,255,255,.03) !important;
  border-radius:14px !important;
  padding:12px !important;
}

.defectSessionMain{
  display:flex !important;
  justify-content:space-between !important;
  gap:12px !important;
  flex-wrap:wrap !important;
  font-size:13px !important;
  line-height:1.35 !important;
  font-weight:800 !important;
}

.defectSessionMeta,
.defectActionText{
  font-size:12px !important;
  line-height:1.5 !important;
  opacity:.8 !important;
  margin-top:6px !important;
}

.defectActionTitle{
  font-size:13px !important;
  line-height:1.35 !important;
  font-weight:800 !important;
}

/* ---------- DEFECT ROWS ---------- */
.defectLegendRow--rich{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  border:1px solid rgba(234,240,255,.08) !important;
  background:rgba(255,255,255,.03) !important;
  border-radius:14px !important;
  padding:12px 14px !important;
  margin-bottom:0 !important;
}

.defectLegendLeft{
  display:flex !important;
  align-items:flex-start !important;
  gap:12px !important;
  min-width:0 !important;
  flex:1 1 auto !important;
}

.defectDot{
  width:12px !important;
  height:12px !important;
  border-radius:999px !important;
  margin-top:6px !important;
  flex:0 0 auto !important;
  box-shadow:0 0 14px rgba(255,255,255,.14) !important;
}

.defectLegendText{
  min-width:0 !important;
  flex:1 1 auto !important;
}

.defectLegendName{
  font-size:14px !important;
  font-weight:900 !important;
  line-height:1.3 !important;
  word-break:break-word !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}

.defectLegendSub{
  font-size:12px !important;
  opacity:.86 !important;
  margin-top:5px !important;
  line-height:1.5 !important;
  word-break:break-word !important;
}

.defectLegendMeta{
  font-size:11px !important;
  opacity:.68 !important;
  margin-top:5px !important;
  line-height:1.45 !important;
  word-break:break-word !important;
}

.defectLegendValue{
  flex:0 0 auto !important;
  font-size:14px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
  color:rgba(234,240,255,.96) !important;
}

/* ---------- NEWS SECONDARY ---------- */
.newsWidget--secondary{
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  min-height:auto !important;
  border:1px solid rgba(234,240,255,.10) !important;
  background:rgba(8,18,29,.78) !important;
  border-radius:22px !important;
  padding:18px !important;
  box-shadow:0 18px 50px rgba(0,0,0,.24) !important;
}

.newsWidgetHead--compact{
  margin-bottom:8px;
}

.newsWidget--secondary .newsWidgetTitle{
  font-size:24px !important;
  line-height:1.15 !important;
}

.newsWidget--secondary .newsWidgetBody{
  margin-top:12px;
}

.newsWidget--secondary .newsWidgetItems{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:10px !important;
  height:auto !important;
  overflow:visible !important;
  padding-right:0 !important;
}

.newsWidget--secondary .newsCard{
  border:1px solid rgba(234,240,255,.08) !important;
  background:rgba(255,255,255,.03) !important;
  border-radius:16px !important;
  padding:14px !important;
}

.newsWidget--secondary .newsCardTitle{
  font-size:18px !important;
  line-height:1.3 !important;
}

.newsWidget--secondary .newsCardText{
  font-size:13px !important;
  line-height:1.5 !important;
  opacity:.82 !important;
}

.newsWidget--secondary .newsCardActions{
  margin-top:8px !important;
}

/* ---------- FOOTER ROWS ---------- */
.newsWidgetFooter{
  display:flex !important;
  justify-content:space-between !important;
  gap:16px !important;
  flex-wrap:wrap !important;
}

/* ---------- TOOL MODE ---------- */
@media (min-width: 981px){
  .layout.hasTool .centerHero{
    gap:18px !important;
  }
}

/* ---------- TABLET ---------- */
@media (max-width: 1200px){
  .defectExecutiveTop{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .defectExecutiveMain{
    grid-template-columns:minmax(0,1fr) !important;
  }

  .defectSummaryGrid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

/* ---------- MOBILE ---------- */
@media (max-width: 760px){
  .defectWidget--hero,
  .newsWidget--secondary{
    padding:16px !important;
    border-radius:18px !important;
  }

  .defectHeroHead{
    flex-direction:column !important;
    align-items:flex-start !important;
  }

  .defectHeroTitle{
    font-size:28px !important;
  }

  .defectHeroSub{
    font-size:14px !important;
  }

  .defectWidgetMeta--hero{
    align-items:flex-start !important;
  }

  .defectExecutiveTop{
    grid-template-columns:minmax(0,1fr) !important;
  }

  .defectSummaryGrid{
    grid-template-columns:minmax(0,1fr) !important;
  }

  .defectLegendRow--rich{
    flex-direction:column !important;
    align-items:flex-start !important;
  }

  #defectChart{
    width:260px !important;
    height:260px !important;
  }

  .defectChartWrap--hero{
    min-height:280px !important;
  }

  .newsWidget--secondary .newsWidgetTitle{
    font-size:20px !important;
  }
}

@media (max-width: 480px){
  .defectWidget--hero,
  .newsWidget--secondary{
    padding:14px !important;
    border-radius:16px !important;
  }

  .defectHeroTitle{
    font-size:24px !important;
  }

  .executiveKpiValue{
    font-size:28px !important;
  }

  .executiveKpiValue--small{
    font-size:16px !important;
  }

  #defectChart{
    width:220px !important;
    height:220px !important;
  }

  .defectChartWrap--hero{
    min-height:230px !important;
  }
}
/* =========================================================
   iPhone / Safari dropdown tap fix
   Put at VERY END of style.css
========================================================= */

.topbar{
  isolation:isolate;
  overflow:visible !important;
}

.topNav{
  position:relative;
  z-index:4000;
  overflow:visible !important;
}

.dd{
  position:relative;
  z-index:4100;
  overflow:visible !important;
}

.ddBtn{
  position:relative;
  z-index:4101;
}

.ddPanel{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  z-index:99999 !important;
  pointer-events:auto !important;
  transform:translateZ(0);
  -webkit-transform:translateZ(0);
}

.ddPanel,
.ddPanel *{
  pointer-events:auto !important;
}

.menuBtn{
  position:relative;
  z-index:2;
  pointer-events:auto !important;
}

@supports (-webkit-touch-callout: none) {
  .topbar{
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
  }

  .ddPanel{
    box-shadow:0 24px 70px rgba(0,0,0,.55);
  }
}

@media (max-width: 980px){
  .topbar{
    z-index:5000 !important;
  }

  .topNav{
    z-index:5001 !important;
  }

  .dd{
    z-index:5002 !important;
  }

  .ddPanel{
    position:fixed !important;
    left:12px !important;
    right:12px !important;
    top:auto !important;
    width:auto !important;
    max-width:none !important;
    max-height:calc(100dvh - 140px) !important;
    overflow:auto !important;
    -webkit-overflow-scrolling:touch;
    z-index:99999 !important;
  }

  .dd.open:nth-of-type(1) .ddPanel{ top:118px !important; }
  .dd.open:nth-of-type(2) .ddPanel{ top:118px !important; }
  .dd.open:nth-of-type(3) .ddPanel{ top:118px !important; }
  .dd.open:nth-of-type(4) .ddPanel{ top:118px !important; }
  .dd.open:nth-of-type(5) .ddPanel{ top:118px !important; }
}

@media (max-width: 520px){
  .ddPanel{
    left:10px !important;
    right:10px !important;
    top:112px !important;
    max-height:calc(100dvh - 128px) !important;
  }
}
/* =========================================================
COATDOCTOR — ENTERPRISE COMPARE EXTENSIONS
========================================================= */

/* ===========================
AQL PANEL (UPGRADE)
=========================== */

.aqlPanel{
  margin-top:16px;
  border-radius:18px;
  padding:16px;
  border:1px solid rgba(234,240,255,.12);

  background:
    linear-gradient(180deg, rgba(0,229,255,.08), rgba(255,255,255,.02));

  box-shadow:
    0 20px 60px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.aqlTitle{
  font-weight:900;
  font-size:14px;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:10px;
  color:#e6fbff;
}

.aqlSub{
  font-size:12px;
  opacity:.7;
  margin-bottom:12px;
}

/* ===========================
FIELDS
=========================== */

.aqlGrid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}

@media(max-width:900px){
  .aqlGrid{grid-template-columns:1fr 1fr}
}

@media(max-width:500px){
  .aqlGrid{grid-template-columns:1fr}
}

.aqlField label{
  display:block;
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
  opacity:.7;
  margin-bottom:4px;
}

.aqlField input,
.aqlField select{
  width:100%;
  border-radius:10px;
  border:1px solid rgba(234,240,255,.12);
  background:rgba(255,255,255,.04);
  color:#fff;
  padding:8px 10px;
  font-size:12px;
  font-weight:700;
}

.aqlField input:focus,
.aqlField select:focus{
  outline:none;
  border-color:rgba(0,229,255,.5);
  box-shadow:0 0 0 2px rgba(0,229,255,.12);
}

/* ===========================
AQL METRICS
=========================== */

.aqlMetrics{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-top:14px;
}

.aqlMetric{
  padding:12px;
  border-radius:14px;
  border:1px solid rgba(234,240,255,.1);
  background:rgba(255,255,255,.03);
}

.aqlMetricLabel{
  font-size:10px;
  text-transform:uppercase;
  opacity:.7;
  margin-bottom:6px;
}

.aqlMetricValue{
  font-size:20px;
  font-weight:900;
}

/* ===========================
FINAL DECISION BLOCK
=========================== */

.aqlDecision{
  margin-top:14px;
  padding:16px;
  border-radius:16px;
  text-align:center;
  font-weight:900;
  font-size:20px;
}

.aqlDecision.pass{
  background:linear-gradient(180deg, rgba(34,197,94,.18), rgba(34,197,94,.08));
  border:1px solid rgba(34,197,94,.4);
  color:#dcffe8;
}

.aqlDecision.review{
  background:linear-gradient(180deg, rgba(245,158,11,.18), rgba(245,158,11,.08));
  border:1px solid rgba(245,158,11,.4);
  color:#fff1d6;
}

.aqlDecision.reject{
  background:linear-gradient(180deg, rgba(239,68,68,.18), rgba(239,68,68,.08));
  border:1px solid rgba(239,68,68,.4);
  color:#ffe4e4;
}

/* ===========================
OPERATOR ACTION PANEL
=========================== */

.operatorPanel{
  margin-top:14px;
  padding:14px;
  border-radius:14px;
  border:1px solid rgba(234,240,255,.1);
  background:rgba(255,255,255,.03);
}

.operatorTitle{
  font-size:12px;
  font-weight:900;
  margin-bottom:8px;
  text-transform:uppercase;
  opacity:.85;
}

.operatorAction{
  font-size:13px;
  line-height:1.6;
}

/* ===========================
LINE STATUS BADGES
=========================== */

.lineStatus{
  display:flex;
  gap:8px;
  margin-top:10px;
  flex-wrap:wrap;
}

.lineBadge{
  padding:6px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
}

.lineBadge.run{
  background:rgba(34,197,94,.15);
  color:#caffdd;
}

.lineBadge.hold{
  background:rgba(245,158,11,.15);
  color:#fff2d2;
}

.lineBadge.stop{
  background:rgba(239,68,68,.15);
  color:#ffdede;
}

/* ===========================
SMOOTH HOVER EFFECTS
=========================== */

.card{
  transition:transform .18s ease, box-shadow .18s ease;
}

.card:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(0,0,0,.3);
}
/* =========================
   MENU SYSTEM — ENTERPRISE
========================= */

.ddPanel{
  position:absolute;
  top:100%;
  left:0;
  min-width:260px;
  background:rgba(10,18,30,.96);
  backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  padding:8px;
  z-index:9999;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}

.menuBtn{
  display:flex;
  flex-direction:column;
  gap:2px;
  width:100%;
  padding:10px 12px;
  border-radius:10px;
  color:#eaf0ff;
  background:transparent;
  border:none;
  cursor:pointer;
  transition:.18s;
}

.menuBtn:hover{
  background:rgba(77,163,255,.12);
  transform:translateX(4px);
}

.mSub{
  font-size:11px;
  color:#8fa6c6;
}

/* GROUPS */
.menuGroupTitle{
  font-size:10px;
  text-transform:uppercase;
  color:#6e8db3;
  padding:6px 10px;
  font-weight:700;
}

.menuDivider{
  height:1px;
  margin:6px 8px;
  background:rgba(255,255,255,.08);
}

/* SUB MENU */
.menuSubGroup{
  position:relative;
}

.menuSubTitle{
  padding:10px;
  cursor:pointer;
  color:#cfe3ff;
}

.menuSubPanel{
  position:absolute;
  top:0;
  left:100%;
  min-width:220px;
  background:rgba(10,18,30,.96);
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:8px;
  display:none;
}

.menuSubGroup:hover .menuSubPanel{
  display:block;
}

/* BUTTON STYLE */
.ddBtn{
  font-weight:600;
  letter-spacing:.02em;
  transition:.2s;
}

.ddBtn:hover{
  color:#4da3ff;
}
/* =========================================================
   COATDOCTOR MENU / PANEL HARD SYNC PATCH
   PUT THIS AT THE VERY END OF style.css
========================================================= */

/* dropdown must really open */
.dd{
  position:relative !important;
  overflow:visible !important;
}

.ddBtn{
  position:relative !important;
  z-index:4101 !important;
  pointer-events:auto !important;
}

.ddPanel{
  display:none !important;
  position:absolute !important;
  top:calc(100% + 8px) !important;
  left:0 !important;
  z-index:99999 !important;
  pointer-events:auto !important;
  flex-direction:column !important;
}

.dd.open .ddPanel{
  display:flex !important;
}

.ddPanel,
.ddPanel *{
  pointer-events:auto !important;
}

/* active menu button sync with JS */
.menuBtn.active,
.menuBtn.isActive{
  border-color:rgba(0,229,255,0.75) !important;
  box-shadow:0 0 0 2px rgba(0,229,255,0.14) !important;
  background:rgba(77,163,255,.10) !important;
}

/* right panel normal open = side panel */
.layout.hasTool{
  grid-template-columns:var(--toolW) minmax(0,1fr) !important;
}

/* backdrop sync */
#rpBackdrop.open{
  display:block !important;
  opacity:1 !important;
  pointer-events:auto !important;
}

/* only maximized panel should use .open fullscreen */
#rightPanel:not(.open){
  position:sticky !important;
  top:78px !important;
  inset:auto !important;
  width:auto !important;
  height:min(720px, calc(100dvh - 140px)) !important;
  max-width:none !important;
  margin:0 !important;
  z-index:40 !important;
}

/* mobile dropdown stronger */
@media (max-width: 980px){
  .dd.open .ddPanel{
    display:flex !important;
    position:fixed !important;
    left:12px !important;
    right:12px !important;
    top:118px !important;
    width:auto !important;
    max-width:none !important;
    max-height:calc(100dvh - 140px) !important;
    overflow:auto !important;
    -webkit-overflow-scrolling:touch !important;
    z-index:99999 !important;
  }
}

@media (max-width: 520px){
  .dd.open .ddPanel{
    left:10px !important;
    right:10px !important;
    top:112px !important;
    max-height:calc(100dvh - 128px) !important;
  }
}
console.log("COATDOCTOR menu loaded — ENTERPRISE ORCHESTRATION V17 CAPTURE SYNC");

(() => {
  "use strict";

  if (window.__COATDOCTOR_MENU_LOADED) return;
  window.__COATDOCTOR_MENU_LOADED = true;

  function bootMenu() {
    const dds = Array.from(document.querySelectorAll(".dd"));

    const body = document.body;
    const layout = document.getElementById("layout");
    const panel = document.getElementById("rightPanel");
    const frame = document.getElementById("rpFrame");
    const title = document.getElementById("rpTitle");
    const closeBtn = document.getElementById("rpClose");
    const maxBtn = document.getElementById("rpMax");
    const backdrop = document.getElementById("rpBackdrop");
    const newsHome = document.getElementById("newsHome");
    const defectHome = document.getElementById("defectHome");
    const centerHero = document.getElementById("centerHero");
    const chat = document.getElementById("chat");

    let activeTool = null;
    let loadingTool = null;
    let panelMaximized = false;

    const TOOL_META = {
      capture:      { group: "capture",   label: "Capture",              url: null, mode: "chat" },
      archive:      { group: "capture",   label: "Archive",              url: "/archive.html", mode: "panel" },
      compare:      { group: "capture",   label: "Compare",              url: "/compare/index.html", mode: "panel" },
      "multi-caps": { group: "capture",   label: "Multi Caps / Sheets",  url: "/multi-caps.html", mode: "panel" },

      eccentricity: { group: "tools",     label: "Eccentricity",         url: "/tools/eccentricity/index.html", mode: "panel" },
      tests:        { group: "tools",     label: "Tests",                url: "/tests.html", mode: "panel" },
      setup:        { group: "tools",     label: "Machine setup",        url: "/setup.html", mode: "panel" },
      ink:          { group: "tools",     label: "Ink formulation",      url: "/ink.html", mode: "panel" },
      tintfactor:   { group: "tools",     label: "Tint Factor",          url: "/tools/tint-factor/index.html", mode: "panel" },

      sop:          { group: "knowledge", label: "SOP",                  url: "/sop.html", mode: "panel" },
      sopadmin:     { group: "knowledge", label: "SOP Admin",            url: "/sop-admin.html", mode: "panel" },

      news:         { group: "news",      label: "Industry News",        url: null, mode: "route" },
      contact:      { group: "contact",   label: "Contact",              url: "/contact.html", mode: "panel" }
    };

    const normalizeTool = (t) => String(t || "").trim().toLowerCase();
    const safeObj = (v) => (v && typeof v === "object" && !Array.isArray(v)) ? v : {};

    function getDdTrigger(dd) {
      return dd?.querySelector(".ddBtn, .dd-toggle, .dd-head, .dd-btn") || null;
    }

    function resolveToolUrl(tool) {
      return TOOL_META[tool]?.url || "";
    }

    function setHomeWidgets(mode) {
      if (newsHome) {
        newsHome.hidden = !(mode === "news" || mode === "both");
      }

      if (defectHome) {
        defectHome.hidden = !(mode === "defect" || mode === "both");
      }

      if (centerHero) {
        centerHero.hidden = (mode === "none");
      }
    }

    function closeAllDropdowns() {
      dds.forEach((dd) => {
        dd.classList.remove("open");
        const trigger = getDdTrigger(dd);
        if (trigger) trigger.setAttribute("aria-expanded", "false");
      });
    }

    function syncTopLevelDropdownState(tool) {
      const normalized = normalizeTool(tool);
      const meta = TOOL_META[normalized];

      dds.forEach((dd) => {
        const ddName = normalizeTool(dd.dataset.dd);
        const trigger = getDdTrigger(dd);

        const active =
          ddName === normalized ||
          (meta && normalizeTool(meta.group) === ddName);

        dd.classList.toggle("isActive", !!active);

        if (trigger) {
          trigger.classList.toggle("isActive", !!active);
          trigger.setAttribute("aria-current", active ? "page" : "false");
        }
      });
    }

    function syncActiveMenuButton(tool) {
      const normalized = normalizeTool(tool);

      document.querySelectorAll(".menuBtn").forEach((btn) => {
        const target = normalizeTool(btn.dataset.target);
        const active = target === normalized;
        btn.classList.toggle("isActive", active);
        btn.classList.toggle("active", active);
        btn.setAttribute("aria-pressed", active ? "true" : "false");
      });

      syncTopLevelDropdownState(normalized);
    }

    function updatePanelTitle(text) {
      if (title) title.textContent = text || "Tool";
    }

    function setPanelOpenState(isOpen) {
      if (!panel) return;

      panel.hidden = !isOpen;
      panel.setAttribute("aria-hidden", isOpen ? "false" : "true");

      if (layout) {
        layout.classList.toggle("hasTool", !!isOpen);
      }

      if (backdrop) {
        backdrop.hidden = !isOpen || !panelMaximized;
        backdrop.classList.toggle("open", !!isOpen && !!panelMaximized);
      }

      if (body) {
        body.classList.toggle("toolModalOpen", !!isOpen && !!panelMaximized);
      }

      if (!isOpen) {
        panel.classList.remove("open");
        panel.dataset.tool = "";
        panelMaximized = false;

        if (maxBtn) {
          maxBtn.classList.remove("active");
          maxBtn.setAttribute("aria-pressed", "false");
        }
      }
    }

    function setPanelMaximized(next) {
      if (!panel) return;

      panelMaximized = !!next;
      panel.classList.toggle("open", panelMaximized);

      if (backdrop) {
        backdrop.hidden = !panelMaximized;
        backdrop.classList.toggle("open", panelMaximized);
      }

      if (body) {
        body.classList.toggle("toolModalOpen", panelMaximized);
      }

      if (maxBtn) {
        maxBtn.classList.toggle("active", panelMaximized);
        maxBtn.setAttribute("aria-pressed", panelMaximized ? "true" : "false");
      }
    }

    function toggleMaximize() {
      setPanelMaximized(!panelMaximized);
    }

    function postToFrame(message, retries = 8) {
      if (!frame) return;

      let i = 0;

      const send = () => {
        try {
          frame.contentWindow?.postMessage(message, "*");
        } catch {}

        i += 1;
        if (i < retries) setTimeout(send, 180);
      };

      send();
    }

    function tryInitFrame(tool, meta) {
      if (!frame || !tool) return;

      postToFrame({
        type: "coatdoctor:host-context",
        tool,
        label: meta?.label || tool,
        group: meta?.group || "",
        hostPath: window.location.pathname
      }, 6);
    }

    function resetFrameToBlank() {
      if (!frame) return;

      try {
        frame.removeAttribute("src");
      } catch {}

      try {
        frame.src = "about:blank";
      } catch {}
    }

    function showChat() {
      if (!chat) return;

      chat.hidden = false;
      chat.setAttribute("aria-hidden", "false");
      chat.classList.add("is-open");

      try {
        window.COATDOCTOR_CHAT?.toggleChat?.(true);
      } catch {}
    }

    function hideChat() {
      if (!chat) return;

      chat.hidden = true;
      chat.setAttribute("aria-hidden", "true");
      chat.classList.remove("is-open", "is-fullscreen");

      try {
        window.COATDOCTOR_CHAT?.toggleChat?.(false);
      } catch {}
    }

    function openCapture() {
      closeAllDropdowns();
      closeTool({ keepRouteWidgets: true, silentChatClose: true });

      activeTool = "capture";
      loadingTool = null;

      syncActiveMenuButton("capture");
      setHomeWidgets("both");
      showChat();
    }

    function openTool(tool, label) {
      tool = normalizeTool(tool);
      if (!panel || !frame) return;

      const meta = TOOL_META[tool];
      if (!meta) return;

      if (meta.mode === "chat") {
        openCapture();
        return;
      }

      const url = resolveToolUrl(tool);
      if (!url) return;

      if (loadingTool === tool) return;
      loadingTool = tool;

      closeAllDropdowns();
      hideChat();

      updatePanelTitle(label || meta.label);
      panel.dataset.tool = tool;
      syncActiveMenuButton(tool);
      setPanelOpenState(true);

      const currentSrc = frame.getAttribute("src") || "";
      const sameTool = activeTool === tool;
      const sameSrc = currentSrc === url;

      if (!sameTool || !sameSrc) {
        frame.src = url;
      } else {
        tryInitFrame(tool, meta);
      }

      activeTool = tool;

      if (tool === "contact") {
        setHomeWidgets("both");
      } else {
        setHomeWidgets("none");
      }

      setTimeout(() => {
        loadingTool = null;
      }, 180);
    }

    function closeTool(options = {}) {
      const keepRouteWidgets = !!options.keepRouteWidgets;
      const silentChatClose = !!options.silentChatClose;

      closeAllDropdowns();

      activeTool = null;
      loadingTool = null;

      setPanelOpenState(false);
      resetFrameToBlank();

      if (!silentChatClose) {
        hideChat();
      }

      syncActiveMenuButton("");

      if (keepRouteWidgets) {
        bootHomeWidgetsOnly();
      } else {
        setHomeWidgets("both");
      }
    }

    function bootHomeWidgetsOnly() {
      const path = window.location.pathname;

      if (path.startsWith("/news")) {
        setHomeWidgets("news");
        return;
      }

      setHomeWidgets("both");
    }

    function findToolByPath(pathname) {
      for (const [tool, meta] of Object.entries(TOOL_META)) {
        if (!meta?.url) continue;
        if (pathname === meta.url) return tool;
      }
      return null;
    }

    function bootNewsRoute() {
      closeAllDropdowns();
      closeTool({ keepRouteWidgets: true });
      syncActiveMenuButton("news");
      setHomeWidgets("news");
    }

    function bootDefaultRoute() {
      syncActiveMenuButton("");
      hideChat();
      setHomeWidgets("both");
    }

    function bootRouteState() {
      const path = window.location.pathname;

      if (path.startsWith("/news")) {
        bootNewsRoute();
        return;
      }

      const directTool = findToolByPath(path);
      if (directTool && panel && frame) {
        openTool(directTool, TOOL_META[directTool].label);
        return;
      }

      bootDefaultRoute();
    }

    function bootFromRoute() {
      bootRouteState();
    }

    function pushRoute(path) {
      if (!path || window.location.pathname === path) {
        bootFromRoute();
        return;
      }

      try {
        window.history.pushState({}, "", path);
      } catch {
        window.location.assign(path);
        return;
      }

      bootFromRoute();
    }

    function handleMenuTarget(tool) {
      const meta = TOOL_META[tool];
      if (!meta) return;

      if (tool === "capture") {
        openCapture();
        return;
      }

      if (tool === "news") {
        pushRoute("/news");
        return;
      }

      if (tool === "contact") {
        openTool("contact", "Contact");
        return;
      }

      openTool(tool, meta.label);
    }

    document.querySelectorAll(".menuBtn").forEach((btn) => {
      btn.addEventListener("click", (e) => {
        e.preventDefault();
        e.stopPropagation();

        const tool = normalizeTool(btn.dataset.target);
        if (!tool) return;

        handleMenuTarget(tool);
      });
    });

    dds.forEach((dd) => {
      const trigger = getDdTrigger(dd);
      if (!trigger) return;

      trigger.addEventListener("click", (e) => {
        e.preventDefault();
        e.stopPropagation();

        const willOpen = !dd.classList.contains("open");
        closeAllDropdowns();
        dd.classList.toggle("open", willOpen);
        trigger.setAttribute("aria-expanded", willOpen ? "true" : "false");
      });
    });

    document.addEventListener("click", (e) => {
      if (!e.target.closest(".dd")) {
        closeAllDropdowns();
      }
    });

    if (closeBtn) {
      closeBtn.addEventListener("click", () => closeTool({ keepRouteWidgets: true }));
    }

    if (maxBtn) {
      maxBtn.addEventListener("click", () => toggleMaximize());
    }

    if (backdrop) {
      backdrop.addEventListener("click", () => {
        if (panelMaximized) {
          setPanelMaximized(false);
        } else {
          closeTool({ keepRouteWidgets: true });
        }
      });
    }

    document.addEventListener("keydown", (e) => {
      if (e.key !== "Escape") return;

      const hasOpenDropdown = dds.some((dd) => dd.classList.contains("open"));
      if (hasOpenDropdown) {
        closeAllDropdowns();
        return;
      }

      if (chat && !chat.hidden) {
        hideChat();
        syncActiveMenuButton("");
        return;
      }

      if (panel && !panel.hidden) {
        if (panelMaximized) {
          setPanelMaximized(false);
        } else {
          closeTool({ keepRouteWidgets: true });
        }
      }
    });

    if (frame) {
      frame.addEventListener("load", () => {
        if (!activeTool || activeTool === "capture") return;
        const meta = TOOL_META[activeTool];
        tryInitFrame(activeTool, meta);
      });
    }

    window.addEventListener("message", (e) => {
      const data = safeObj(e.data);
      if (!data.type) return;

      if (data.type === "coatdoctor:open-tool-request") {
        const requestedTool = normalizeTool(data.tool);
        if (!TOOL_META[requestedTool]) return;

        handleMenuTarget(requestedTool);
        return;
      }

      if (data.type === "coatdoctor:close-tool-request") {
        closeTool({ keepRouteWidgets: true });
        return;
      }

      if (data.type === "coatdoctor:set-title") {
        updatePanelTitle(data.title || TOOL_META[activeTool]?.label || "Tool");
        return;
      }

      if (data.type === "coatdoctor:maximize-tool-request") {
        if (!panelMaximized) setPanelMaximized(true);
        return;
      }

      if (data.type === "coatdoctor:minimize-tool-request") {
        if (panelMaximized) setPanelMaximized(false);
        return;
      }

      if (data.type === "coatdoctor:navigate-route") {
        const path = String(data.path || "").trim();
        if (!path) return;
        pushRoute(path);
      }
    });

    const chatClose = document.getElementById("chatClose");
    const chatFs = document.getElementById("chatFs");

    if (chatClose) {
      chatClose.addEventListener("click", () => {
        hideChat();
        syncActiveMenuButton("");
      });
    }

    if (chatFs && chat) {
      chatFs.addEventListener("click", () => {
        chat.classList.toggle("is-fullscreen");
      });
    }

    window.addEventListener("popstate", () => {
      bootFromRoute();
    });

    bootFromRoute();

    window.COATDOCTOR_UI = {
      openTool,
      openCapture,
      closeTool,
      postToFrame,
      toggleMaximize,
      bootFromRoute,
      getActiveTool: () => activeTool
    };
  }

  if (document.readyState === "loading") {
    document.addEventListener("DOMContentLoaded", bootMenu, { once: true });
  } else {
    bootMenu();
  }
})();
/* =========================================================
   COATDOCTOR V3 SAFE PATCH — Premium Laboratory Home
   This patch keeps existing working modules and only upgrades
   the main page presentation, navigation cards and company layer.
========================================================= */
:root{
  --cd-bg:#f7faff;
  --cd-ink:#102033;
  --cd-muted:#617089;
  --cd-line:#dce6f3;
  --cd-card:#ffffff;
  --cd-blue:#126BFF;
  --cd-blue2:#00A3FF;
  --cd-soft:#eef6ff;
  --cd-green:#148a54;
  --cd-red:#c33b3b;
  --cd-shadow:0 22px 70px rgba(18, 61, 113, .12);
}
body[data-app="coatdoctor"]{
  color:var(--cd-ink);
  background:
    radial-gradient(circle at 12% 0%, rgba(18,107,255,.10), transparent 34%),
    radial-gradient(circle at 90% 15%, rgba(0,163,255,.08), transparent 30%),
    linear-gradient(180deg,#ffffff 0%, var(--cd-bg) 52%, #ffffff 100%);
}
body[data-app="coatdoctor"] .bgImg{opacity:.10; filter:saturate(.6) contrast(1.02) brightness(1.25);}
body[data-app="coatdoctor"] .bgFx{background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(247,250,255,.96));}
body[data-app="coatdoctor"] .bgGrid{opacity:.35; background-image:linear-gradient(rgba(18,107,255,.05) 1px, transparent 1px),linear-gradient(90deg, rgba(18,107,255,.05) 1px, transparent 1px)}
body[data-app="coatdoctor"] .topbar{
  background:rgba(255,255,255,.82);
  border-bottom:1px solid var(--cd-line);
  box-shadow:0 10px 35px rgba(16,32,51,.06);
}
body[data-app="coatdoctor"] .brandName,
body[data-app="coatdoctor"] .rpTitle,
body[data-app="coatdoctor"] .footerBrand{color:var(--cd-ink)}
body[data-app="coatdoctor"] .brandSub,
body[data-app="coatdoctor"] .footerSub{color:var(--cd-muted)}
body[data-app="coatdoctor"] .brandMark{background:linear-gradient(135deg,#2bd4ff,#126bff); color:#fff; box-shadow:0 12px 30px rgba(18,107,255,.25)}
body[data-app="coatdoctor"] .ddBtn,
body[data-app="coatdoctor"] .pill{
  color:var(--cd-ink);
  background:rgba(255,255,255,.74);
  border-color:var(--cd-line);
}
body[data-app="coatdoctor"] .ddBtn:hover,
body[data-app="coatdoctor"] .pill:hover,
body[data-app="coatdoctor"] .ddBtn.isActive{
  border-color:rgba(18,107,255,.45);
  background:#fff;
}
body[data-app="coatdoctor"] .ddPanel{
  background:#fff;
  border:1px solid var(--cd-line);
  box-shadow:0 22px 60px rgba(16,32,51,.13);
}
body[data-app="coatdoctor"] .menuBtn{
  color:var(--cd-ink);
  background:#fff;
  border-color:var(--cd-line);
}
body[data-app="coatdoctor"] .menuBtn:hover,
body[data-app="coatdoctor"] .menuBtn.isActive{background:var(--cd-soft); border-color:rgba(18,107,255,.35)}
body[data-app="coatdoctor"] .mSub{color:var(--cd-muted)}
body[data-app="coatdoctor"] .scene{min-height:calc(100vh - var(--topH) - var(--footerH));}
body[data-app="coatdoctor"] .layout{max-width:1240px; margin:0 auto; padding:28px 18px 42px;}
body[data-app="coatdoctor"] .centerHero.cdHome{display:block; width:100%; max-width:none;}
.cdHero{
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr); gap:24px; align-items:stretch;
  padding:38px; border:1px solid var(--cd-line); border-radius:34px;
  background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(239,247,255,.88));
  box-shadow:var(--cd-shadow); position:relative; overflow:hidden;
}
.cdHero:after{content:""; position:absolute; right:-120px; top:-140px; width:420px; height:420px; border-radius:999px; background:radial-gradient(circle,rgba(18,107,255,.16),transparent 68%)}
.cdHeroCopy{position:relative; z-index:1}.cdEyebrow{font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--cd-blue); font-weight:900; margin-bottom:12px}
.cdHero h1{font-size:clamp(38px,5vw,72px); line-height:.96; letter-spacing:-.06em; margin:0 0 18px; color:#07182c; max-width:850px}
.cdLead{font-size:18px; line-height:1.68; color:var(--cd-muted); max-width:760px; margin:0 0 26px}.cdHeroActions{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:20px}
.cdBtn,.cdCardBtn{display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:11px 16px; border-radius:999px; font-weight:900; cursor:pointer; border:1px solid var(--cd-line); color:var(--cd-ink); background:#fff; text-decoration:none; box-shadow:0 10px 24px rgba(16,32,51,.06)}
.cdBtnPrimary{background:linear-gradient(135deg,var(--cd-blue),var(--cd-blue2)); color:#fff; border-color:transparent; box-shadow:0 16px 36px rgba(18,107,255,.25)}
.cdBtnGhost:hover,.cdCardBtn:hover{border-color:rgba(18,107,255,.45); transform:translateY(-1px)}
.cdTrustRow{display:flex; flex-wrap:wrap; gap:8px}.cdTrustRow span{padding:7px 10px; border:1px solid var(--cd-line); border-radius:999px; background:rgba(255,255,255,.74); font-weight:800; color:#40516b; font-size:12px}
.cdHeroPanel{position:relative; z-index:1; background:#fff; border:1px solid var(--cd-line); border-radius:26px; padding:20px; box-shadow:0 20px 55px rgba(16,32,51,.10)}
.cdPanelTop{display:flex; justify-content:space-between; align-items:center; gap:10px; color:var(--cd-muted); font-size:13px; font-weight:800; margin-bottom:16px}.cdPanelTop strong{color:var(--cd-green); font-size:12px; letter-spacing:.12em}
.cdStatusGrid{display:grid; gap:12px}.cdStatusGrid div{padding:15px; border:1px solid var(--cd-line); border-radius:20px; background:linear-gradient(180deg,#fff,#f7fbff)}.cdStatusGrid span{display:block; color:var(--cd-muted); font-size:12px; font-weight:800}.cdStatusGrid b{display:block; margin-top:5px; font-size:22px; color:#0d223a}.cdStatusGrid small{display:block; margin-top:4px; color:#789; font-weight:700}
.cdSection{margin-top:24px; padding:28px; border:1px solid var(--cd-line); border-radius:30px; background:rgba(255,255,255,.88); box-shadow:0 14px 45px rgba(16,32,51,.07)}
.cdSectionHead{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:22px}.cdSectionHead.compact{margin-bottom:14px}.cdSectionHead h2,.cdAbout h2,.cdLegal h2,.cdGlassBlock h2{font-size:clamp(26px,3.2vw,44px); line-height:1.04; letter-spacing:-.04em; margin:0; color:#07182c}.cdSectionHead p{max-width:520px; color:var(--cd-muted); line-height:1.65; margin:0; font-weight:650}
.cdKpiGrid{display:grid; grid-template-columns:repeat(5,1fr); gap:12px}.cdKpiGrid article{background:#fff; border:1px solid var(--cd-line); border-radius:22px; padding:18px}.cdKpiGrid span{display:block; color:var(--cd-muted); font-size:12px; font-weight:900; text-transform:uppercase; letter-spacing:.08em}.cdKpiGrid strong{display:block; font-size:34px; color:var(--cd-blue); margin:8px 0 4px}.cdKpiGrid small{color:#73829a; font-weight:700}
.cdAppGrid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px}.cdAppCard{display:flex; flex-direction:column; min-height:318px; padding:20px; background:#fff; border:1px solid var(--cd-line); border-radius:26px; box-shadow:0 10px 30px rgba(16,32,51,.06); transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}.cdAppCard:hover{transform:translateY(-3px); border-color:rgba(18,107,255,.42); box-shadow:0 24px 60px rgba(18,107,255,.13)}.cdAppCard.featured{background:linear-gradient(180deg,#fff,#edf6ff); border-color:rgba(18,107,255,.30)}.cdAppIcon{width:48px; height:48px; display:grid; place-items:center; border-radius:16px; background:var(--cd-soft); font-size:24px; margin-bottom:14px}.cdAppCard h3{font-size:20px; margin:0 0 10px; color:#0c2138}.cdAppCard p{color:var(--cd-muted); line-height:1.55; margin:0 0 12px}.cdAppCard ul{margin:0 0 18px; padding-left:18px; color:#304159; line-height:1.55; font-weight:650}.cdCardBtn{margin-top:auto; width:max-content; max-width:100%}
.cdSplit{display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch}.cdGlassBlock,.cdActivity{background:#fff; border:1px solid var(--cd-line); border-radius:26px; padding:24px}.cdGlassBlock p{color:var(--cd-muted); line-height:1.65}.cdMiniStats{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:18px}.cdMiniStats div{border:1px solid var(--cd-line); border-radius:18px; padding:14px; background:#f8fbff}.cdMiniStats strong{display:block; color:var(--cd-blue); font-size:25px}.cdMiniStats span{display:block; color:var(--cd-muted); font-size:12px; font-weight:800}.cdActivityHead{display:flex; justify-content:space-between; gap:12px; margin-bottom:14px}.cdActivityHead strong{font-size:20px}.cdActivityHead span{color:var(--cd-muted); font-size:12px; font-weight:800}.cdActivityRow{display:grid; grid-template-columns:92px 1fr; gap:8px 12px; padding:13px 0; border-top:1px solid var(--cd-line)}.cdActivityRow b{font-size:20px}.cdActivityRow.plus b{color:var(--cd-green)}.cdActivityRow.minus b{color:var(--cd-red)}.cdActivityRow span{font-weight:900}.cdActivityRow small{grid-column:2; color:var(--cd-muted); font-weight:700}
.cdAboutGrid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}.cdAboutGrid article{background:#fff; border:1px solid var(--cd-line); border-radius:22px; padding:20px}.cdAboutGrid h3{margin:0 0 8px}.cdAboutGrid p{margin:0; color:var(--cd-muted); line-height:1.65}.cdLegal{display:grid; grid-template-columns:.8fr 1.2fr; gap:22px; align-items:start}.cdLegalGrid{display:grid; grid-template-columns:140px 1fr; gap:10px 16px; background:#fff; border:1px solid var(--cd-line); border-radius:22px; padding:20px}.cdLegalGrid span{color:var(--cd-muted); font-weight:800}.cdLegalGrid strong{color:#102033}.cdInsights .newsWidget,.cdInsights .defectWidget{margin-top:14px; background:#fff; color:var(--cd-ink); border-color:var(--cd-line); box-shadow:none}.cdInsights .newsWidgetTitle{color:var(--cd-ink)}.cdInsights .newsEmpty,.cdInsights .newsWidgetFooter,.cdInsights .newsWidgetMeta{color:var(--cd-muted)}
body[data-app="coatdoctor"] .toolPanel{background:#fff; border-color:var(--cd-line); box-shadow:var(--cd-shadow)}
body[data-app="coatdoctor"] .footer{background:rgba(255,255,255,.84); border-top:1px solid var(--cd-line)}
@media (max-width:1100px){.cdHero,.cdSplit,.cdLegal{grid-template-columns:1fr}.cdKpiGrid{grid-template-columns:repeat(3,1fr)}.cdAppGrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:720px){body[data-app="coatdoctor"] .layout{padding:16px 12px 28px}.cdHero,.cdSection{padding:20px; border-radius:24px}.cdSectionHead{display:block}.cdSectionHead p{margin-top:12px}.cdKpiGrid,.cdAppGrid,.cdAboutGrid,.cdMiniStats{grid-template-columns:1fr}.cdHeroActions{display:grid}.cdBtn,.cdCardBtn{width:100%}.cdLegalGrid{grid-template-columns:1fr}.cdActivityRow{grid-template-columns:1fr}.cdActivityRow small{grid-column:1}.topbar{align-items:flex-start}.topNav{justify-content:flex-start; overflow-x:auto !important; padding-bottom:4px}.brandSub{display:none}.topActions{display:none}}

/* === COATDOCTOR V4.5 Executive Digital Twin — Industrial Premium Layer === */
:root{
  --cd-accent-blue:#126bff;
  --cd-accent-steel:#4f86c6;
  --cd-accent-soft:rgba(18,107,255,.18);
  --cd-flow-blue:rgba(18,107,255,.72);
  --cd-industrial-shadow:rgba(16,32,51,.22);
  --cd-ease-industrial:cubic-bezier(.22,1,.36,1);
}
.cdHeroV4{
  grid-template-columns:minmax(0,.88fr) minmax(520px,1.12fr);
  min-height:560px;
  align-items:center;
  background:
    radial-gradient(circle at 74% 32%,rgba(18,107,255,.08),transparent 36%),
    linear-gradient(135deg,rgba(255,255,255,.97),rgba(244,249,253,.94));
}
.cdHeroV4:after{right:auto;left:42%;top:-180px;opacity:.55}
.cdHeroV4 h1{max-width:660px;font-size:clamp(40px,4.8vw,68px)}
.cdTrustRowV4 span{background:#fff}

.cdTwinPanel{
  position:relative;
  z-index:1;
  min-height:500px;
  background:linear-gradient(180deg,#fff,#f6faff);
  border:1px solid var(--cd-line);
  border-radius:30px;
  padding:18px;
  box-shadow:0 24px 70px rgba(16,32,51,.12);
  overflow:hidden;
  isolation:isolate;
}
.cdTwinPanel:before{
  content:"";
  position:absolute;
  inset:18px;
  border-radius:24px;
  background:
    linear-gradient(rgba(18,107,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(18,107,255,.04) 1px,transparent 1px);
  background-size:34px 34px;
  pointer-events:none;
}
.cdTwinPanel:after{
  content:"";
  position:absolute;
  inset:auto -10% -28% 40%;
  height:220px;
  background:radial-gradient(circle,rgba(18,107,255,.10),transparent 62%);
  pointer-events:none;
  z-index:0;
}
.cdTwinTop{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:8px;
  color:var(--cd-muted);
  font-size:13px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.10em;
}
.cdTwinTop strong{color:var(--cd-accent-blue);font-size:12px}
.cdTwinMap{position:relative;z-index:1;width:100%;height:450px}
.cdTwinSvg{
  width:100%;
  height:100%;
  display:block;
  will-change:transform;
  transform:translateZ(0);
}
.cdZoneSvg{
  cursor:pointer;
  transform-box:fill-box;
  transform-origin:center bottom;
  will-change:transform,filter;
  transition:transform .42s var(--cd-ease-industrial),filter .42s ease,opacity .22s ease;
}
.cdZoneSvg:hover{
  transform:translateY(-8px) scale(1.015);
  filter:
    drop-shadow(0 18px 16px rgba(16,32,51,.14))
    drop-shadow(0 28px 26px rgba(16,32,51,.07)) !important;
  opacity:.98;
}
.cdZoneSvg:hover rect,
.cdZoneSvg:hover circle:not([stroke]),
.cdZoneSvg:hover path[fill]{
  transform:translateY(-2px);
  transition:transform .32s var(--cd-ease-industrial);
}
.cdZoneCore{
  animation:cdFactoryCoreBreath 5.6s ease-in-out infinite;
}
.cdZoneCore circle{
  animation:cdCoreTechnicalPulse 3.4s ease-in-out infinite alternate;
}
.cdTwinRouteActive{
  stroke:url(#industrialFlowGradient);
  stroke-width:3.2px;
  stroke-linecap:round;
  stroke-dasharray:80 180;
  animation:cdMaterialFlow 5.8s linear infinite;
  filter:drop-shadow(0 0 5px rgba(18,107,255,.22));
}
.cdFlowNode{
  fill:var(--cd-accent-blue);
  opacity:.55;
  filter:drop-shadow(0 0 4px rgba(18,107,255,.22));
}
.cdFlowNodeA{animation:cdFlowNodePulse 3.8s ease-in-out infinite}
.cdFlowNodeB{animation:cdFlowNodePulse 3.8s ease-in-out .9s infinite}
.cdFlowNodeC{animation:cdFlowNodePulse 3.8s ease-in-out 1.8s infinite}
.cdTwinLabels text{
  paint-order:stroke;
  stroke:#fff;
  stroke-width:8px;
  stroke-linejoin:round;
  transition:fill .28s ease,transform .28s var(--cd-ease-industrial);
}
.cdTwinSvg .cdZoneSvg:hover ~ .cdTwinLabels text{fill:#0c2138}

.cdJourneyGrid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:12px;
  counter-reset:journey;
}
.cdJourneyGrid article{
  position:relative;
  min-height:185px;
  padding:18px 16px;
  background:#fff;
  border:1px solid var(--cd-line);
  border-radius:24px;
  box-shadow:0 10px 28px rgba(16,32,51,.055);
  overflow:hidden;
}
.cdJourneyGrid article:before{
  content:attr(data-step);
  display:block;
  font-weight:900;
  color:rgba(18,107,255,.22);
  font-size:34px;
  line-height:1;
  margin-bottom:16px;
}
.cdJourneyGrid article:after{
  content:"";
  position:absolute;
  top:36px;
  right:-18px;
  width:44px;
  height:2px;
  background:#cbd9e8;
}
.cdJourneyGrid article:last-child:after{display:none}
.cdJourneyGrid article.core{
  border-color:rgba(18,107,255,.35);
  background:linear-gradient(180deg,#fff,#eef7ff);
}
.cdJourneyGrid span{
  display:block;
  color:var(--cd-muted);
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:900;
}
.cdJourneyGrid strong{
  display:block;
  margin:8px 0;
  color:#07182c;
  font-size:18px;
  line-height:1.15;
}
.cdJourneyGrid p{
  margin:0;
  color:#465973;
  line-height:1.55;
  font-weight:650;
  font-size:13px;
}
.cdKpiGridV4 strong{font-size:30px}
.cdKpiGridV4 article{background:linear-gradient(180deg,#fff,#f8fbff)}

@keyframes cdMaterialFlow{
  0%{stroke-dashoffset:800}
  100%{stroke-dashoffset:0}
}
@keyframes cdFactoryCoreBreath{
  0%,100%{
    transform:translateY(0) scale(1);
    filter:
      drop-shadow(0 12px 10px rgba(16,32,51,.20))
      drop-shadow(0 0 8px rgba(18,107,255,.10));
  }
  50%{
    transform:translateY(-3px) scale(1.005);
    filter:
      drop-shadow(0 18px 18px rgba(16,32,51,.16))
      drop-shadow(0 0 14px rgba(18,107,255,.20));
  }
}
@keyframes cdCoreTechnicalPulse{
  0%{fill:rgba(239,247,255,.96);stroke:var(--cd-accent-blue);stroke-width:4px}
  100%{fill:rgba(18,107,255,.08);stroke:var(--cd-accent-steel);stroke-width:5px}
}
@keyframes cdFlowNodePulse{
  0%,100%{opacity:.35;transform:scale(1)}
  50%{opacity:.82;transform:scale(1.35)}
}
@media (prefers-reduced-motion:reduce){
  .cdZoneCore,.cdZoneCore circle,.cdTwinRouteActive,.cdFlowNode{animation:none!important}
  .cdZoneSvg,.cdTwinLabels text{transition:none!important}
}
@media (max-width:1100px){
  .cdHeroV4{grid-template-columns:1fr;min-height:auto}
  .cdTwinPanel{min-height:420px}
  .cdTwinMap{height:390px}
  .cdJourneyGrid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:720px){
  .cdHeroV4{padding:22px}
  .cdTwinPanel{min-height:330px;padding:12px;border-radius:24px}
  .cdTwinMap{height:300px;overflow:hidden}
  .cdTwinSvg{transform:scale(1.08);transform-origin:center}
  .cdTwinLabels{font-size:16px}
  .cdJourneyGrid{grid-template-columns:1fr}
  .cdJourneyGrid article{min-height:auto}
  .cdJourneyGrid article:after{display:none}
  .cdHeroV4 h1{font-size:clamp(34px,11vw,48px)}
}



/* === COATDOCTOR V5 Living Factory Digital Twin === */
.cdHeroV5{
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
  max-width:1460px;
  min-height:auto;
  padding:28px 34px 34px;
  align-items:start;
}
.cdHeroV5 .cdTwinPanel{
  grid-row:1;
}
.cdHeroCopyV5{
  grid-row:2;
  max-width:1180px;
  margin:0 auto;
  text-align:center;
}
.cdHeroCopyV5 h1{
  max-width:1050px;
  margin:8px auto 14px;
  font-size:clamp(32px,4.2vw,54px);
  line-height:.98;
  letter-spacing:-.065em;
}
.cdHeroCopyV5 .cdLead{
  max-width:920px;
  margin-left:auto;
  margin-right:auto;
  font-size:clamp(16px,1.6vw,22px);
}
.cdHeroCopyV5 .cdHeroActions,
.cdHeroCopyV5 .cdTrustRow{
  justify-content:center;
}
.cdTwinPanelV5{
  width:100%;
  min-height:650px;
  padding:20px;
  border-radius:32px;
  overflow:hidden;
}
.cdTwinMapV5{
  height:520px;
  border-radius:24px;
  overflow:hidden;
}
.cdTwinPanelV5 .cdTwinSvg{
  transform-origin:center center;
  transition:transform .9s cubic-bezier(.22,1,.36,1), filter .7s ease;
}
.cdTwinPanelV5[data-active-zone="overview"] .cdTwinSvg{transform:translate3d(0,0,0) scale(1)}
.cdTwinPanelV5[data-active-zone="warehouse"] .cdTwinSvg{transform:translate3d(190px,95px,0) scale(1.72)}
.cdTwinPanelV5[data-active-zone="erp"] .cdTwinSvg{transform:translate3d(20px,-110px,0) scale(1.68)}
.cdTwinPanelV5[data-active-zone="lab"] .cdTwinSvg{transform:translate3d(90px,185px,0) scale(1.68)}
.cdTwinPanelV5[data-active-zone="optimization"] .cdTwinSvg{transform:translate3d(-90px,-42px,0) scale(1.58)}
.cdTwinPanelV5[data-active-zone="dispensing"] .cdTwinSvg{transform:translate3d(-230px,165px,0) scale(1.68)}
.cdTwinPanelV5[data-active-zone="production"] .cdTwinSvg,
.cdTwinPanelV5[data-active-zone="side-decoration"] .cdTwinSvg{transform:translate3d(-230px,-110px,0) scale(1.7)}
.cdTwinPanelV5[data-active-zone="esg"] .cdTwinSvg{transform:translate3d(160px,-160px,0) scale(1.72)}
.cdZoneSvg{
  outline:none;
}
.cdZoneSvg.is-selected{
  filter:drop-shadow(0 20px 20px rgba(18,107,255,.18)) drop-shadow(0 28px 28px rgba(16,32,51,.10)) !important;
}
.cdZoneSvg.is-selected polygon,
.cdZoneSvg.is-selected rect,
.cdZoneSvg.is-selected circle{
  stroke:#126bff;
}
.cdTwinControls{
  position:relative;
  z-index:4;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:center;
  margin:14px 0 0;
}
.cdTwinControls button{
  border:1px solid rgba(18,107,255,.16);
  background:rgba(255,255,255,.86);
  color:#0c2138;
  border-radius:999px;
  padding:9px 12px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.02em;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(16,32,51,.05);
  transition:transform .22s ease, background .22s ease, border-color .22s ease;
}
.cdTwinControls button:hover,
.cdTwinControls button.is-active{
  transform:translateY(-1px);
  background:#eef7ff;
  border-color:rgba(18,107,255,.40);
}
.cdTwinReset{
  background:#07182c!important;
  color:#fff!important;
  border-color:#07182c!important;
}
.cdZoomStage{
  position:relative;
  z-index:3;
  margin:14px auto 0;
  min-height:170px;
  max-width:1120px;
}
.cdZoomScene{
  display:none;
  grid-template-columns:minmax(220px,.85fr) minmax(0,1.15fr);
  gap:18px;
  align-items:center;
  padding:18px;
  border:1px solid rgba(18,107,255,.14);
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(246,250,255,.92));
  box-shadow:0 16px 38px rgba(16,32,51,.08);
}
.cdZoomScene.is-active{
  display:grid;
  animation:cdSceneIn .42s cubic-bezier(.22,1,.36,1) both;
}
@keyframes cdSceneIn{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}
.cdZoomScene span{
  display:block;
  color:#126bff;
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.cdZoomScene strong{
  display:block;
  margin:7px 0;
  color:#07182c;
  font-size:clamp(18px,2vw,26px);
  line-height:1.08;
  letter-spacing:-.03em;
}
.cdZoomScene p{
  margin:0;
  color:#465973;
  font-weight:700;
  line-height:1.5;
}
.cdMiniWarehouse,.cdMiniErp,.cdMiniLab,.cdMiniFlow,.cdMiniDispensing,.cdMiniProduction,.cdMiniSide,.cdMiniEsg{
  position:relative;
  height:92px;
  border-radius:18px;
  background:linear-gradient(135deg,#f8fbff,#eaf3fb);
  border:1px solid #dbe8f4;
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);
}
.cdMiniWarehouse:before,.cdMiniWarehouse:after{
  content:"";
  position:absolute;
  left:18px;right:18px;
  height:7px;
  background:#90a4b9;
  border-radius:999px;
}
.cdMiniWarehouse:before{top:29px}.cdMiniWarehouse:after{top:59px}
.cdMiniWarehouse i,.cdMiniWarehouse b,.cdMiniWarehouse em{
  position:absolute;
  bottom:20px;
  width:22px;
  border-radius:5px 5px 3px 3px;
  background:#6f8095;
}
.cdMiniWarehouse i:nth-child(1){left:34px;height:30px}
.cdMiniWarehouse i:nth-child(2){left:64px;height:42px;background:#98a8bb}
.cdMiniWarehouse i:nth-child(3){left:96px;height:35px}
.cdMiniWarehouse b{width:28px;height:28px;bottom:23px;background:#126bff;opacity:.75}
.cdMiniWarehouse b:nth-of-type(1){left:145px}.cdMiniWarehouse b:nth-of-type(2){left:180px;background:#4f86c6}.cdMiniWarehouse b:nth-of-type(3){left:215px;background:#8ea1b6}
.cdMiniWarehouse em{width:34px;height:44px;right:44px;bottom:20px;border-radius:50%/14%;background:#52677d}
.cdMiniErp{
  display:flex;
  align-items:end;
  gap:12px;
  padding:18px 22px;
}
.cdMiniErp i{
  width:34px;
  border-radius:8px 8px 0 0;
  background:linear-gradient(180deg,#126bff,#4f86c6);
  animation:cdBarRise 2.6s ease-in-out infinite alternate;
}
.cdMiniErp:after{
  content:"Schedule • Inventory • Recipes • Forecast";
  position:absolute;
  right:18px;
  top:18px;
  color:#465973;
  font-size:12px;
  font-weight:900;
}
@keyframes cdBarRise{to{transform:scaleY(.78)}}
.cdMiniLab .xr,.cdMiniLab .pc,.cdMiniLab .disp,.cdMiniLab .panel{
  position:absolute;
  background:#fff;
  border:2px solid #b8cadd;
  box-shadow:0 10px 20px rgba(16,32,51,.08);
}
.cdMiniLab .xr{left:25px;top:24px;width:54px;height:42px;border-radius:14px}
.cdMiniLab .xr:after{content:"";position:absolute;left:18px;top:10px;width:16px;height:16px;border-radius:50%;border:4px solid #126bff}
.cdMiniLab .pc{left:98px;top:20px;width:74px;height:48px;border-radius:8px}
.cdMiniLab .disp{left:198px;top:18px;width:42px;height:58px;border-radius:8px;background:#edf6ff}
.cdMiniLab .panel{right:26px;top:32px;width:70px;height:26px;border-radius:6px;transform:skewX(-16deg)}
.cdMiniFlow{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:24px;
}
.cdMiniFlow i{
  width:42px;height:42px;border-radius:12px;
  background:#fff;border:2px solid #c4d6e8;
  position:relative;
}
.cdMiniFlow i:not(:last-child):after{
  content:"";
  position:absolute;
  top:18px;left:48px;width:20px;height:4px;border-radius:99px;background:#126bff;
  animation:cdMaterialPulse 1.8s linear infinite;
}
@keyframes cdMaterialPulse{50%{opacity:.35;transform:translateX(5px)}}
.cdMiniDispensing i{
  position:absolute;bottom:24px;width:34px;border-radius:8px;background:#647990;
}
.cdMiniDispensing i:nth-child(1){left:48px;height:40px;background:#126bff}.cdMiniDispensing i:nth-child(2){left:100px;height:62px}.cdMiniDispensing i:nth-child(3){left:152px;height:48px;background:#8ea1b6}
.cdMiniDispensing b{position:absolute;right:40px;bottom:22px;width:108px;height:20px;border-radius:999px;background:#d3e4f4}
.cdMiniDispensing b:after{content:"18.62 kg";position:absolute;right:12px;top:-25px;font-size:13px;font-weight:900;color:#126bff}
.cdMiniProduction i{
  position:absolute;left:28px;right:28px;height:10px;border-radius:99px;background:#41556d;
}
.cdMiniProduction i:nth-child(1){top:26px}.cdMiniProduction i:nth-child(2){top:46px}.cdMiniProduction i:nth-child(3){top:66px}
.cdMiniProduction b{
  position:absolute;top:42px;width:28px;height:16px;border-radius:5px;background:#eaf3fb;border:2px solid #126bff;
  animation:cdSheetMove 3s linear infinite;
}
.cdMiniProduction b:nth-of-type(1){left:40px}.cdMiniProduction b:nth-of-type(2){left:120px;animation-delay:1.1s}
@keyframes cdSheetMove{to{transform:translateX(210px)}}
.cdMiniSide i{
  position:absolute;top:34px;width:48px;height:48px;border-radius:50%;background:#fff;border:4px solid #4f86c6;
}
.cdMiniSide i:nth-child(1){left:40px}.cdMiniSide i:nth-child(2){left:116px}.cdMiniSide i:nth-child(3){left:192px}
.cdMiniSide b{
  position:absolute;bottom:18px;width:42px;height:8px;border-radius:99px;background:#126bff;
}
.cdMiniSide b:nth-of-type(1){left:50px}.cdMiniSide b:nth-of-type(2){left:126px}.cdMiniSide b:nth-of-type(3){left:202px}
.cdMiniEsg{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
}
.cdMiniEsg i{
  width:46px;height:46px;border-radius:12px;background:#fff;border:2px solid #c4d6e8;
}
.cdMiniEsg i:nth-child(1){background:#f5f7fa}.cdMiniEsg i:nth-child(2){background:#eef7ff}.cdMiniEsg i:nth-child(3){background:#e8f7f1}
.cdMiniEsg b{
  width:52px;height:52px;border-radius:50%;
  display:grid;place-items:center;
  color:#14835c;border:4px solid #14835c;
  font-size:28px;
  animation:cdLoopTurn 4s linear infinite;
}
@keyframes cdLoopTurn{to{transform:rotate(360deg)}}

@media (max-width:1100px){
  .cdHeroV5{padding:22px}
  .cdTwinPanelV5{min-height:590px}
  .cdTwinMapV5{height:440px}
  .cdZoomScene{grid-template-columns:1fr}
}
@media (max-width:720px){
  .cdHeroV5{padding:16px;gap:16px}
  .cdTwinPanelV5{min-height:auto;padding:12px;border-radius:24px}
  .cdTwinMapV5{height:360px}
  .cdTwinPanelV5 .cdTwinSvg{width:122%;margin-left:-11%}
  .cdHeroCopyV5 h1{font-size:clamp(28px,9vw,42px);letter-spacing:-.055em}
  .cdHeroCopyV5 .cdLead{font-size:15px}
  .cdTwinControls{justify-content:flex-start;overflow:auto;flex-wrap:nowrap;padding-bottom:4px}
  .cdTwinControls button{white-space:nowrap}
  .cdZoomStage{min-height:0}
  .cdZoomScene{padding:14px}
  .cdTwinPanelV5[data-active-zone="warehouse"] .cdTwinSvg{transform:translate3d(90px,55px,0) scale(1.55)}
  .cdTwinPanelV5[data-active-zone="erp"] .cdTwinSvg{transform:translate3d(0,-70px,0) scale(1.52)}
  .cdTwinPanelV5[data-active-zone="lab"] .cdTwinSvg{transform:translate3d(42px,110px,0) scale(1.5)}
  .cdTwinPanelV5[data-active-zone="optimization"] .cdTwinSvg{transform:translate3d(-35px,-28px,0) scale(1.45)}
  .cdTwinPanelV5[data-active-zone="dispensing"] .cdTwinSvg{transform:translate3d(-96px,100px,0) scale(1.52)}
  .cdTwinPanelV5[data-active-zone="production"] .cdTwinSvg,
  .cdTwinPanelV5[data-active-zone="side-decoration"] .cdTwinSvg{transform:translate3d(-110px,-70px,0) scale(1.52)}
  .cdTwinPanelV5[data-active-zone="esg"] .cdTwinSvg{transform:translate3d(68px,-95px,0) scale(1.52)}
}
@media (prefers-reduced-motion:reduce){
  .cdTwinPanelV5 .cdTwinSvg,
  .cdZoomScene,
  .cdMiniFlow i:after,
  .cdMiniProduction b,
  .cdMiniEsg b,
  .cdMiniErp i{
    animation:none!important;
    transition:none!important;
  }
}

/* === COATDOCTOR V5.2 Fullscreen Living Factory Upgrade === */
body[data-app="coatdoctor"] .layout{
  max-width:none!important;
  width:100%!important;
  margin:0!important;
  padding:0 0 34px!important;
}
body[data-app="coatdoctor"] .centerHero.cdHome{
  width:100%!important;
  max-width:none!important;
}
.cdHeroV5{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:18px clamp(14px,2vw,34px) 24px!important;
  border-radius:0!important;
  border-left:0!important;
  border-right:0!important;
  background:linear-gradient(135deg,#eef7ff 0%,#f8fbff 46%,#ffffff 100%)!important;
  box-shadow:none!important;
  gap:14px!important;
}
.cdHeroV5:after{display:none!important}
.cdTwinPanelV5{
  width:100%!important;
  max-width:none!important;
  height:calc(100vh - 178px)!important;
  min-height:660px!important;
  max-height:860px!important;
  padding:16px!important;
  border-radius:28px!important;
  display:grid!important;
  grid-template-rows:auto 1fr!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,#ffffff 0%,#f6fbff 100%)!important;
}
.cdTwinTop{
  margin:0!important;
  padding:4px 10px 8px!important;
}
.cdTwinMapV5{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  border-radius:22px!important;
  overflow:hidden!important;
  background:
    linear-gradient(rgba(18,107,255,.036) 1px,transparent 1px),
    linear-gradient(90deg,rgba(18,107,255,.036) 1px,transparent 1px),
    linear-gradient(180deg,#fbfdff,#eef7ff)!important;
  background-size:38px 38px,38px 38px,auto!important;
}
.cdTwinPanelV5 .cdTwinSvg{
  width:100%!important;
  height:100%!important;
  margin:0!important;
  transform-origin:center center!important;
}
.cdTwinPanelV5[data-active-zone="overview"] .cdTwinSvg{transform:translate3d(0,0,0) scale(1.12)!important}
.cdTwinPanelV5[data-active-zone="warehouse"] .cdTwinSvg{transform:translate3d(22%,16%,0) scale(2.14)!important}
.cdTwinPanelV5[data-active-zone="erp"] .cdTwinSvg{transform:translate3d(6%,-15%,0) scale(2.08)!important}
.cdTwinPanelV5[data-active-zone="lab"] .cdTwinSvg{transform:translate3d(12%,26%,0) scale(2.08)!important}
.cdTwinPanelV5[data-active-zone="optimization"] .cdTwinSvg{transform:translate3d(-7%,-5%,0) scale(1.94)!important}
.cdTwinPanelV5[data-active-zone="dispensing"] .cdTwinSvg{transform:translate3d(-25%,23%,0) scale(2.08)!important}
.cdTwinPanelV5[data-active-zone="production"] .cdTwinSvg{transform:translate3d(-24%,-17%,0) scale(2.12)!important}
.cdTwinPanelV5[data-active-zone="side-decoration"] .cdTwinSvg{transform:translate3d(-24%,-17%,0) scale(2.22)!important}
.cdTwinPanelV5[data-active-zone="esg"] .cdTwinSvg{transform:translate3d(20%,-25%,0) scale(2.12)!important}
.cdTwinControls{
  position:absolute!important;
  z-index:6!important;
  left:50%!important;
  bottom:18px!important;
  transform:translateX(-50%)!important;
  width:min(980px,calc(100% - 52px))!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
  padding:8px!important;
  border:1px solid rgba(188,207,226,.78)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.88)!important;
  backdrop-filter:blur(12px)!important;
  box-shadow:0 20px 45px rgba(16,32,51,.12)!important;
}
.cdTwinControls button{
  min-height:30px!important;
  padding:7px 11px!important;
  font-size:11px!important;
}
.cdZoomStage{
  position:absolute!important;
  z-index:5!important;
  right:28px!important;
  top:72px!important;
  bottom:86px!important;
  width:min(440px,32vw)!important;
  min-height:0!important;
  display:block!important;
  pointer-events:none!important;
}
.cdZoomScene{
  position:absolute!important;
  inset:0!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:auto auto 1fr auto!important;
  gap:12px!important;
  padding:20px!important;
  border-radius:26px!important;
  background:rgba(255,255,255,.90)!important;
  border:1px solid rgba(188,207,226,.82)!important;
  box-shadow:0 28px 70px rgba(16,32,51,.16)!important;
  backdrop-filter:blur(14px)!important;
  pointer-events:auto!important;
  transform:translateX(18px) scale(.985)!important;
}
.cdZoomScene.is-active{
  transform:translateX(0) scale(1)!important;
}
.cdZoomScene strong{font-size:clamp(22px,1.7vw,34px)!important;line-height:1.02!important}
.cdZoomScene p{font-size:14px!important;line-height:1.55!important}
.cdMiniWarehouse,.cdMiniErp,.cdMiniLab,.cdMiniFlow,.cdMiniDispensing,.cdMiniProduction,.cdMiniSide,.cdMiniEsg{
  height:210px!important;
  border-radius:22px!important;
}
/* More realistic workshop details */
.cdMiniWarehouse:before{top:48px!important}.cdMiniWarehouse:after{top:118px!important}
.cdMiniWarehouse i:nth-child(1){left:42px!important;height:58px!important;bottom:62px!important}
.cdMiniWarehouse i:nth-child(2){left:82px!important;height:78px!important;bottom:62px!important}
.cdMiniWarehouse i:nth-child(3){left:126px!important;height:66px!important;bottom:62px!important}
.cdMiniWarehouse b{bottom:34px!important;width:38px!important;height:34px!important;border-radius:7px!important}
.cdMiniWarehouse b:nth-of-type(1){left:48px!important}.cdMiniWarehouse b:nth-of-type(2){left:96px!important}.cdMiniWarehouse b:nth-of-type(3){left:144px!important}
.cdMiniWarehouse em{right:60px!important;bottom:34px!important;width:52px!important;height:82px!important}
.cdMiniLab .xr{left:28px!important;top:48px!important;width:78px!important;height:62px!important;border-radius:18px!important}.cdMiniLab .xr:after{left:26px!important;top:16px!important;width:24px!important;height:24px!important}
.cdMiniLab .pc{left:132px!important;top:38px!important;width:108px!important;height:76px!important}.cdMiniLab .pc:after{content:"QC";position:absolute;left:36px;top:25px;font-weight:900;color:#126bff}
.cdMiniLab .disp{left:270px!important;top:34px!important;width:62px!important;height:112px!important}.cdMiniLab .disp:after{content:"";position:absolute;left:19px;bottom:14px;width:24px;height:46px;border-radius:7px;background:#126bff}
.cdMiniLab .panel{right:34px!important;top:130px!important;width:118px!important;height:34px!important}
.cdMiniProduction i{left:38px!important;right:38px!important;height:12px!important}.cdMiniProduction i:nth-child(1){top:52px!important}.cdMiniProduction i:nth-child(2){top:96px!important}.cdMiniProduction i:nth-child(3){top:140px!important}
.cdMiniProduction b{top:91px!important;width:44px!important;height:26px!important;animation-duration:4.8s!important}
.cdMiniProduction:after{content:"coating rollers · dry offset sections · aluminium sheets";position:absolute;left:24px;bottom:18px;font-size:12px;font-weight:900;color:#465973}
.cdMiniSide i{top:58px!important;width:58px!important;height:58px!important}.cdMiniSide i:nth-child(1){left:40px!important}.cdMiniSide i:nth-child(2){left:128px!important}.cdMiniSide i:nth-child(3){left:216px!important}
.cdMiniSide:after{content:"anilox · transfer wheel · oven · cooling · print defects";position:absolute;left:24px;bottom:18px;font-size:12px;font-weight:900;color:#465973}
.cdMiniErp:after{top:22px!important;right:22px!important;font-size:13px!important}.cdMiniErp:before{content:"Dynamics schedule";position:absolute;left:22px;top:20px;color:#126bff;font-weight:900;font-size:12px;text-transform:uppercase;letter-spacing:.1em}.cdMiniErp i{width:46px!important}
.cdMiniEsg:after{content:"Material reused → virgin material avoided → CO₂ estimate → DPP evidence";position:absolute;left:24px;bottom:18px;font-size:12px;font-weight:900;color:#465973}
.cdHeroCopyV5{
  width:min(1180px,100%)!important;
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  gap:14px 22px!important;
  align-items:center!important;
  text-align:left!important;
  margin:0 auto!important;
  padding:10px 8px 0!important;
}
.cdHeroCopyV5 .cdEyebrow{grid-column:1!important;margin:0!important;white-space:nowrap!important;font-size:10px!important;letter-spacing:.16em!important}
.cdHeroCopyV5 h1{grid-column:2!important;margin:0!important;font-size:clamp(22px,2.1vw,34px)!important;line-height:1.03!important;letter-spacing:-.045em!important;max-width:none!important}
.cdHeroCopyV5 .cdLead{grid-column:2!important;margin:0!important;font-size:14px!important;line-height:1.45!important;max-width:none!important}
.cdHeroCopyV5 .cdHeroActions{grid-column:3!important;grid-row:1 / span 2!important;margin:0!important;justify-content:flex-end!important;white-space:nowrap!important}
.cdHeroCopyV5 .cdTrustRow{grid-column:1 / -1!important;justify-content:center!important;margin-top:2px!important}
.cdSection{max-width:1460px!important;margin-left:auto!important;margin-right:auto!important}
@media (max-width:1100px){
  .cdTwinPanelV5{height:auto!important;min-height:780px!important;max-height:none!important}
  .cdTwinMapV5{height:520px!important}
  .cdZoomStage{position:relative!important;top:auto!important;right:auto!important;bottom:auto!important;width:100%!important;margin-top:12px!important}
  .cdZoomScene{position:absolute!important;min-height:260px!important}
  .cdZoomStage{min-height:330px!important}
  .cdHeroCopyV5{grid-template-columns:1fr!important;text-align:center!important}.cdHeroCopyV5>*{grid-column:1!important;grid-row:auto!important}.cdHeroCopyV5 .cdHeroActions{justify-content:center!important;white-space:normal!important}
}
@media (max-width:720px){
  .cdHeroV5{padding:10px!important}.cdTwinPanelV5{min-height:720px!important;padding:10px!important;border-radius:20px!important}.cdTwinMapV5{height:410px!important}.cdTwinPanelV5[data-active-zone="overview"] .cdTwinSvg{transform:scale(1.22)!important}.cdTwinControls{position:relative!important;left:auto!important;bottom:auto!important;transform:none!important;width:100%!important;border-radius:18px!important;overflow:auto!important;justify-content:flex-start!important;flex-wrap:nowrap!important}.cdZoomStage{min-height:360px!important}.cdZoomScene{padding:14px!important}.cdMiniWarehouse,.cdMiniErp,.cdMiniLab,.cdMiniFlow,.cdMiniDispensing,.cdMiniProduction,.cdMiniSide,.cdMiniEsg{height:170px!important}.cdHeroCopyV5 h1{font-size:26px!important}.cdHeroCopyV5 .cdLead{font-size:13px!important}
}

/* === COATDOCTOR V5.3 — Fullscreen map with separated workshop layer (no overlay) === */
body[data-app="coatdoctor"] .scene{
  overflow-x:hidden!important;
}
body[data-app="coatdoctor"] .layout{
  width:100%!important;
  max-width:none!important;
}
body[data-app="coatdoctor"] .centerHero.cdHome{
  width:100%!important;
  max-width:none!important;
}
.cdHeroV5{
  width:100%!important;
  max-width:none!important;
  padding:14px clamp(12px,2vw,32px) 26px!important;
  gap:16px!important;
}
.cdTwinPanelV5{
  width:100%!important;
  max-width:none!important;
  height:auto!important;
  min-height:auto!important;
  max-height:none!important;
  display:grid!important;
  grid-template-rows:auto minmax(560px,68vh) auto auto!important;
  gap:12px!important;
  overflow:visible!important;
  padding:16px!important;
  border-radius:30px!important;
  background:linear-gradient(180deg,#ffffff 0%,#f6fbff 100%)!important;
}
.cdTwinTop{
  grid-row:1!important;
  margin:0!important;
  padding:2px 10px 4px!important;
}
.cdTwinMapV5{
  grid-row:2!important;
  width:100%!important;
  height:100%!important;
  min-height:560px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:
    linear-gradient(rgba(18,107,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(18,107,255,.035) 1px,transparent 1px),
    linear-gradient(180deg,#fbfdff,#eef7ff)!important;
  background-size:38px 38px,38px 38px,auto!important;
}
.cdTwinPanelV5 .cdTwinSvg{
  width:100%!important;
  height:100%!important;
  margin:0!important;
  transform-origin:center center!important;
  transition:transform .9s cubic-bezier(.22,1,.36,1), filter .7s ease!important;
}
.cdTwinPanelV5[data-active-zone="overview"] .cdTwinSvg{transform:translate3d(0,0,0) scale(1.22)!important}
.cdTwinPanelV5[data-active-zone="warehouse"] .cdTwinSvg{transform:translate3d(21%,15%,0) scale(2.08)!important}
.cdTwinPanelV5[data-active-zone="erp"] .cdTwinSvg{transform:translate3d(5%,-12%,0) scale(2.02)!important}
.cdTwinPanelV5[data-active-zone="lab"] .cdTwinSvg{transform:translate3d(10%,23%,0) scale(2.02)!important}
.cdTwinPanelV5[data-active-zone="optimization"] .cdTwinSvg{transform:translate3d(-6%,-3%,0) scale(1.88)!important}
.cdTwinPanelV5[data-active-zone="dispensing"] .cdTwinSvg{transform:translate3d(-23%,20%,0) scale(2.02)!important}
.cdTwinPanelV5[data-active-zone="production"] .cdTwinSvg{transform:translate3d(-22%,-14%,0) scale(2.06)!important}
.cdTwinPanelV5[data-active-zone="side-decoration"] .cdTwinSvg{transform:translate3d(-22%,-14%,0) scale(2.16)!important}
.cdTwinPanelV5[data-active-zone="esg"] .cdTwinSvg{transform:translate3d(18%,-22%,0) scale(2.06)!important}
.cdTwinControls{
  grid-row:3!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  transform:none!important;
  z-index:3!important;
  width:100%!important;
  max-width:1180px!important;
  margin:0 auto!important;
  display:flex!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  padding:8px!important;
  border:1px solid rgba(188,207,226,.76)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.92)!important;
  box-shadow:0 14px 32px rgba(16,32,51,.08)!important;
  backdrop-filter:blur(10px)!important;
}
.cdTwinControls button{
  min-height:30px!important;
  padding:7px 11px!important;
  font-size:11px!important;
}
.cdZoomStage{
  grid-row:4!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  z-index:2!important;
  width:100%!important;
  max-width:1180px!important;
  min-height:0!important;
  margin:0 auto!important;
  pointer-events:auto!important;
  display:block!important;
}
.cdZoomScene{
  position:relative!important;
  inset:auto!important;
  display:none!important;
  grid-template-columns:minmax(290px,.85fr) minmax(420px,1.15fr)!important;
  grid-template-rows:auto auto auto!important;
  gap:10px 22px!important;
  align-items:center!important;
  min-height:230px!important;
  padding:18px 20px!important;
  border-radius:26px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(246,250,255,.96))!important;
  border:1px solid rgba(188,207,226,.82)!important;
  box-shadow:0 18px 46px rgba(16,32,51,.10)!important;
  backdrop-filter:none!important;
  transform:none!important;
  pointer-events:auto!important;
}
.cdZoomScene.is-active{
  display:grid!important;
  animation:cdSceneIn .34s cubic-bezier(.22,1,.36,1) both!important;
  transform:none!important;
}
.cdZoomScene span,
.cdZoomScene strong,
.cdZoomScene p{
  grid-column:1!important;
}
.cdZoomScene span{font-size:11px!important;letter-spacing:.14em!important}
.cdZoomScene strong{font-size:clamp(21px,2.2vw,34px)!important;line-height:1.03!important;margin:4px 0!important}
.cdZoomScene p{font-size:14px!important;line-height:1.55!important;max-width:440px!important}
.cdZoomScene > div[class^="cdMini"]{
  grid-column:2!important;
  grid-row:1 / span 3!important;
  width:100%!important;
  height:230px!important;
  margin:0!important;
}
.cdZoomScene[data-scene="overview"]{
  grid-template-columns:1fr!important;
  text-align:center!important;
  min-height:110px!important;
}
.cdZoomScene[data-scene="overview"] span,
.cdZoomScene[data-scene="overview"] strong,
.cdZoomScene[data-scene="overview"] p{
  grid-column:1!important;
  max-width:none!important;
}
.cdHeroCopyV5{
  width:min(1180px,100%)!important;
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  gap:10px 20px!important;
  align-items:center!important;
  text-align:left!important;
  margin:0 auto!important;
  padding:6px 8px 0!important;
}
.cdHeroCopyV5 .cdEyebrow{grid-column:1!important;margin:0!important;white-space:nowrap!important;font-size:10px!important;letter-spacing:.16em!important}
.cdHeroCopyV5 h1{grid-column:2!important;margin:0!important;font-size:clamp(22px,2vw,33px)!important;line-height:1.03!important;letter-spacing:-.045em!important;max-width:none!important}
.cdHeroCopyV5 .cdLead{grid-column:2!important;margin:0!important;font-size:14px!important;line-height:1.45!important;max-width:none!important}
.cdHeroCopyV5 .cdHeroActions{grid-column:3!important;grid-row:1 / span 2!important;margin:0!important;justify-content:flex-end!important;white-space:nowrap!important}
.cdHeroCopyV5 .cdTrustRow{grid-column:1 / -1!important;justify-content:center!important;margin-top:2px!important}
@media (max-width:1100px){
  .cdTwinPanelV5{grid-template-rows:auto minmax(500px,60vh) auto auto!important}
  .cdTwinMapV5{min-height:500px!important}
  .cdZoomScene{grid-template-columns:1fr!important;min-height:0!important}
  .cdZoomScene > div[class^="cdMini"]{grid-column:1!important;grid-row:auto!important;height:210px!important}
  .cdHeroCopyV5{grid-template-columns:1fr!important;text-align:center!important}
  .cdHeroCopyV5>*{grid-column:1!important;grid-row:auto!important}.cdHeroCopyV5 .cdHeroActions{justify-content:center!important;white-space:normal!important}
}
@media (max-width:720px){
  .cdHeroV5{padding:8px!important}
  .cdTwinPanelV5{grid-template-rows:auto 390px auto auto!important;padding:10px!important;border-radius:20px!important}
  .cdTwinMapV5{min-height:390px!important;border-radius:18px!important}
  .cdTwinPanelV5[data-active-zone="overview"] .cdTwinSvg{transform:scale(1.22)!important}
  .cdTwinControls{border-radius:18px!important;overflow:auto!important;justify-content:flex-start!important;flex-wrap:nowrap!important}
  .cdTwinControls button{white-space:nowrap!important}
  .cdZoomScene{padding:14px!important;border-radius:20px!important}
  .cdZoomScene strong{font-size:22px!important}
  .cdZoomScene p{font-size:13px!important}
  .cdZoomScene > div[class^="cdMini"]{height:170px!important}
  .cdHeroCopyV5 h1{font-size:25px!important}.cdHeroCopyV5 .cdLead{font-size:13px!important}
}

/* === COATDOCTOR V5.4 REAL FACTORY EXPERIENCE LAYER === */
.cdExperienceStage{position:relative!important;min-height:clamp(520px,46vw,720px)!important;margin-top:18px!important;overflow:hidden!important;border-radius:28px!important;background:linear-gradient(180deg,#f7fbff,#eef6fc)!important;border:1px solid rgba(151,178,207,.34)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important}
.cdExperienceScene{position:absolute!important;inset:0!important;display:grid!important;grid-template-columns:minmax(260px,.72fr) minmax(420px,1.28fr)!important;gap:22px!important;align-items:stretch!important;padding:clamp(18px,2.2vw,30px)!important;opacity:0!important;visibility:hidden!important;transform:translateY(18px) scale(.985)!important;transition:opacity .42s ease,visibility .42s ease,transform .56s cubic-bezier(.22,1,.36,1)!important;background:transparent!important;border:0!important;box-shadow:none!important}
.cdExperienceScene.is-active{opacity:1!important;visibility:visible!important;transform:translateY(0) scale(1)!important}
.cdSceneText{position:relative;z-index:4;align-self:center;max-width:480px}
.cdSceneText span{display:block!important;color:#126bff!important;font-size:11px!important;letter-spacing:.15em!important;text-transform:uppercase!important;font-weight:950!important;margin-bottom:10px!important}
.cdSceneText strong{display:block!important;color:#062233!important;font-size:clamp(28px,3.3vw,54px)!important;line-height:.96!important;letter-spacing:-.055em!important;margin:0 0 16px!important}
.cdSceneText p{margin:0!important;color:#486079!important;font-size:clamp(14px,1vw,17px)!important;line-height:1.58!important;font-weight:700!important;max-width:450px!important}
.cdPhotoScene,.cdPhotoSplit,.cdPhotoWall,.cdProcessTunnel,.cdEsgBoard{position:relative!important;z-index:2!important;min-height:100%!important;border-radius:26px!important;overflow:hidden!important;box-shadow:0 28px 60px rgba(16,32,51,.16),0 1px 0 rgba(255,255,255,.8) inset!important;border:1px solid rgba(151,178,207,.42)!important;background:#fff!important}
.cdPhotoScene:before,.cdPhotoSplit:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,28,44,.18),rgba(6,28,44,.02) 42%,rgba(255,255,255,.10));pointer-events:none}
.cdPhotoMain{width:100%!important;height:100%!important;min-height:clamp(420px,41vw,680px)!important;object-fit:cover!important;display:block!important;transform:scale(1.018)!important;transition:transform 7s ease!important;filter:saturate(.97) contrast(1.02)!important}
.cdExperienceScene.is-active .cdPhotoMain{transform:scale(1.075)!important}
.cdWarehouseReal .cdPhotoMain{object-position:center 42%!important}.cdErpReal .cdPhotoMain{object-position:center 25%!important}.cdDispensingReal .cdPhotoMain{object-position:center 48%!important}.cdSideReal .cdPhotoMain{object-position:center 45%!important}
.cdSceneOverlay,.cdMachineHUD,.cdLiveScale,.cdGlassDashboard{position:absolute;z-index:5;background:rgba(255,255,255,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.72);box-shadow:0 18px 36px rgba(16,32,51,.16);border-radius:18px;padding:14px 16px;color:#082238;min-width:180px}
.cdSceneOverlay b,.cdMachineHUD b,.cdLiveScale b,.cdGlassDashboard strong{display:block;font-size:16px;font-weight:950;letter-spacing:-.02em}.cdSceneOverlay span,.cdMachineHUD span,.cdLiveScale span,.cdGlassDashboard small{display:block;margin-top:4px;font-size:12px;font-weight:800;color:#51677f;line-height:1.35}
.cdOverlayTopLeft{left:22px;top:22px}.cdOverlayBottomRight{right:22px;bottom:22px}.cdLiveScale{left:24px;bottom:24px}.cdLiveScale b{font-size:34px;color:#126bff}.cdMachineHUD{left:22px;top:22px;max-width:260px}
.cdHotspot{position:absolute;z-index:6;display:flex;align-items:center;gap:8px;color:#062233;font-weight:900;font-size:12px;filter:drop-shadow(0 8px 16px rgba(0,0,0,.18))}.cdHotspot em{width:18px;height:18px;border-radius:999px;background:#126bff;box-shadow:0 0 0 7px rgba(18,107,255,.18);animation:cdHotspotPulse 2.6s ease-in-out infinite}.cdHotspot b{padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.82)}@keyframes cdHotspotPulse{0%,100%{transform:scale(.9);box-shadow:0 0 0 6px rgba(18,107,255,.14)}50%{transform:scale(1.12);box-shadow:0 0 0 12px rgba(18,107,255,.06)}}
.cdPhotoWall{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:12px!important;padding:14px!important;background:linear-gradient(135deg,#fff,#eef6ff)!important;align-self:stretch!important}.cdPhotoWall figure,.cdPhotoSplit figure{position:relative;margin:0!important;overflow:hidden;border-radius:20px;background:#fff;border:1px solid rgba(151,178,207,.42);box-shadow:0 16px 32px rgba(16,32,51,.11)}.cdPhotoWall img{width:100%;height:100%;object-fit:cover;display:block;min-height:360px}.cdPhotoWall figcaption,.cdPhotoSplit figcaption{position:absolute;left:12px;right:12px;bottom:12px;z-index:3;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.82);backdrop-filter:blur(12px);font-size:12px;font-weight:950;color:#072238}.cdPhotoSplit{display:grid!important;grid-template-columns:1.2fr .8fr!important;grid-template-rows:1fr 1fr!important;gap:14px!important;padding:14px!important;background:#fff!important}.cdPhotoSplit figure.wide{grid-row:span 2}.cdPhotoSplit img{width:100%;height:100%;min-height:220px;object-fit:cover;display:block}.cdPhotoSplit figcaption b{display:block;font-size:14px}.cdPhotoSplit figcaption span{display:block;font-size:11px;color:#526982;margin-top:2px}
.cdGlassDashboard{right:24px;top:24px;width:260px;height:160px;display:grid;grid-template-columns:repeat(4,1fr);align-items:end;gap:10px}.cdGlassDashboard strong,.cdGlassDashboard small{grid-column:1/-1}.cdGlassDashboard i{display:block;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,#126bff,#78a9dd);box-shadow:0 8px 16px rgba(18,107,255,.18)}
.cdProcessTunnel{display:grid!important;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr!important;align-items:center!important;gap:12px!important;padding:34px!important;background:radial-gradient(circle at 20% 20%,rgba(18,107,255,.12),transparent 32%),linear-gradient(135deg,#fff,#edf6ff)!important}.cdProcessTunnel div{min-height:190px;border-radius:22px;background:#fff;border:1px solid rgba(151,178,207,.44);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:18px;box-shadow:0 18px 38px rgba(16,32,51,.08)}.cdProcessTunnel b{font-size:22px;color:#062233}.cdProcessTunnel span{font-size:12px;color:#51677f;font-weight:850;margin-top:6px}.cdProcessTunnel i{width:44px;height:3px;border-radius:999px;background:#126bff;box-shadow:0 0 0 7px rgba(18,107,255,.08)}
.cdEsgBoard{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:14px!important;padding:20px!important;background:linear-gradient(135deg,#fff,#effaf6)!important}.cdEsgBoard div{border-radius:22px;background:#fff;border:1px solid rgba(151,178,207,.42);padding:28px;display:flex;flex-direction:column;justify-content:center;box-shadow:0 18px 38px rgba(16,32,51,.08)}.cdEsgBoard span{font-size:12px;text-transform:uppercase;letter-spacing:.12em;font-weight:950;color:#14835c}.cdEsgBoard b{font-size:clamp(34px,4.5vw,72px);letter-spacing:-.06em;color:#062233;margin-top:8px}.cdEsgBoard div:nth-child(4) b{color:#126bff}
.cdTwinPanelV5{min-height:calc(100svh - 112px)!important}.cdTwinMapV5{height:clamp(520px,52svh,700px)!important}.cdHeroCopyV5 h1{font-size:clamp(30px,4vw,58px)!important;line-height:.98!important}.cdHeroCopyV5{max-width:1180px!important;margin:20px auto 0!important;text-align:left!important}
@media (max-width:1100px){.cdExperienceScene{grid-template-columns:1fr!important;overflow:auto!important}.cdExperienceStage{min-height:760px!important}.cdPhotoScene,.cdPhotoSplit,.cdPhotoWall,.cdProcessTunnel,.cdEsgBoard{min-height:420px!important}.cdPhotoWall{grid-template-columns:repeat(2,1fr)!important}.cdProcessTunnel{grid-template-columns:1fr!important}.cdProcessTunnel i{width:3px;height:28px;margin:auto}.cdPhotoSplit{grid-template-columns:1fr!important;grid-template-rows:auto!important}.cdPhotoSplit figure.wide{grid-row:auto}.cdPhotoSplit img{height:240px}.cdSceneText strong{font-size:32px!important}}
@media (max-width:720px){.cdExperienceStage{min-height:840px!important;border-radius:20px!important}.cdExperienceScene{padding:12px!important}.cdPhotoWall{grid-template-columns:1fr!important}.cdPhotoWall img{min-height:180px}.cdPhotoMain{min-height:320px!important}.cdSceneOverlay,.cdMachineHUD,.cdLiveScale,.cdGlassDashboard{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;margin:10px!important}.cdHotspot{display:none}.cdEsgBoard{grid-template-columns:1fr!important}.cdTwinPanelV5{min-height:auto!important}.cdTwinMapV5{height:390px!important}.cdHeroCopyV5 h1{font-size:28px!important}}

/* === COATDOCTOR V5.5 COMMAND CENTER LAYOUT + PRIVACY BLUR FIX === */
body[data-app="coatdoctor"]{
  overflow-x:hidden!important;
  background:#eef7ff!important;
}
body[data-app="coatdoctor"] .centerHero.cdHome{
  max-width:none!important;
  width:100%!important;
}
.cdHeroV5{
  min-height:calc(100svh - 76px)!important;
  padding:18px clamp(14px,2vw,28px) 28px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:16px!important;
  background:linear-gradient(135deg,#edf7ff 0%,#f8fbff 52%,#ffffff 100%)!important;
}
.cdTwinPanelV5{
  width:min(1760px,100%)!important;
  margin:0 auto!important;
  min-height:calc(100svh - 210px)!important;
  height:auto!important;
  max-height:none!important;
  padding:16px!important;
  display:grid!important;
  grid-template-columns:minmax(620px,1.45fr) minmax(360px,.72fr)!important;
  grid-template-rows:auto minmax(520px,1fr) auto!important;
  gap:14px!important;
  border-radius:30px!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.72)!important;
  border:1px solid rgba(177,201,224,.62)!important;
  box-shadow:0 28px 80px rgba(16,32,51,.10)!important;
  backdrop-filter:blur(8px)!important;
}
.cdTwinTop{
  grid-column:1 / -1!important;
  grid-row:1!important;
  margin:0!important;
  padding:4px 12px!important;
}
.cdTwinMapV5{
  grid-column:1!important;
  grid-row:2!important;
  height:100%!important;
  min-height:520px!important;
  border-radius:24px!important;
  background:
    linear-gradient(rgba(18,107,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(18,107,255,.04) 1px,transparent 1px),
    radial-gradient(circle at 50% 42%,rgba(18,107,255,.08),transparent 34%),
    linear-gradient(180deg,#fbfdff,#edf7ff)!important;
  background-size:38px 38px,38px 38px,auto,auto!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.cdTwinControls{
  grid-column:1!important;
  grid-row:3!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  transform:none!important;
  width:100%!important;
  margin:0!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
  padding:8px!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.84)!important;
  box-shadow:0 14px 32px rgba(16,32,51,.08)!important;
}
.cdTwinControls button{
  min-height:28px!important;
  padding:7px 11px!important;
  font-size:10.5px!important;
}
.cdExperienceStage,
.cdZoomStage.cdExperienceStage{
  grid-column:2!important;
  grid-row:2 / span 2!important;
  position:relative!important;
  inset:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  width:100%!important;
  min-height:0!important;
  height:100%!important;
  margin:0!important;
  border-radius:26px!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(237,247,255,.92))!important;
  border:1px solid rgba(177,201,224,.64)!important;
  box-shadow:0 22px 58px rgba(16,32,51,.10),inset 0 1px 0 rgba(255,255,255,.95)!important;
  pointer-events:auto!important;
}
.cdExperienceScene,
.cdZoomScene.cdExperienceScene{
  position:absolute!important;
  inset:0!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:auto 1fr!important;
  gap:14px!important;
  padding:18px!important;
  opacity:0!important;
  visibility:hidden!important;
  transform:translateY(12px) scale(.99)!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.cdExperienceScene.is-active,
.cdZoomScene.cdExperienceScene.is-active{
  opacity:1!important;
  visibility:visible!important;
  transform:translateY(0) scale(1)!important;
}
.cdSceneText{
  align-self:start!important;
  max-width:none!important;
  padding:2px 2px 0!important;
}
.cdSceneText span{
  font-size:10px!important;
  margin-bottom:8px!important;
}
.cdSceneText strong{
  font-size:clamp(22px,2vw,36px)!important;
  line-height:1.02!important;
  margin:0 0 10px!important;
  letter-spacing:-.05em!important;
}
.cdSceneText p{
  font-size:13px!important;
  line-height:1.5!important;
  max-width:100%!important;
}
.cdPhotoScene,
.cdPhotoSplit,
.cdPhotoWall,
.cdProcessTunnel,
.cdEsgBoard{
  min-height:0!important;
  height:100%!important;
  border-radius:22px!important;
  box-shadow:0 18px 42px rgba(16,32,51,.10)!important;
}
/* Privacy + premium treatment: real images remain recognizable but details/labels are not readable */
.cdPhotoMain,
.cdPhotoWall img,
.cdPhotoSplit img{
  filter:blur(3.2px) saturate(.78) contrast(.92) brightness(1.03)!important;
  transform:scale(1.085)!important;
}
.cdExperienceScene.is-active .cdPhotoMain,
.cdExperienceScene.is-active .cdPhotoWall img,
.cdExperienceScene.is-active .cdPhotoSplit img{
  transform:scale(1.12)!important;
}
.cdPhotoScene:before,
.cdPhotoSplit:before,
.cdPhotoWall:before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  background:
    linear-gradient(90deg,rgba(255,255,255,.66),rgba(255,255,255,.22) 45%,rgba(255,255,255,.50)),
    linear-gradient(180deg,rgba(237,247,255,.22),rgba(237,247,255,.56))!important;
  pointer-events:none!important;
}
.cdPhotoWall:before{border-radius:22px!important}
.cdPhotoWall figure,
.cdPhotoSplit figure{z-index:1!important}
.cdPhotoWall figcaption,
.cdPhotoSplit figcaption,
.cdSceneOverlay,
.cdMachineHUD,
.cdLiveScale,
.cdGlassDashboard{
  z-index:6!important;
  background:rgba(255,255,255,.88)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  border:1px solid rgba(255,255,255,.78)!important;
}
.cdPhotoWall{
  grid-template-columns:repeat(2,1fr)!important;
  gap:12px!important;
}
.cdPhotoWall img{min-height:180px!important}
.cdPhotoSplit{
  grid-template-columns:1fr 1fr!important;
  grid-template-rows:1fr 1fr!important;
  gap:12px!important;
}
.cdPhotoSplit figure.wide{grid-column:1 / -1!important;grid-row:auto!important}
.cdPhotoSplit img{min-height:145px!important}
.cdGlassDashboard{
  width:230px!important;
  height:145px!important;
}
.cdEsgBoard{
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
  padding:14px!important;
}
.cdEsgBoard div{padding:18px!important;border-radius:18px!important}
.cdEsgBoard b{font-size:clamp(28px,3vw,46px)!important}
.cdProcessTunnel{
  grid-template-columns:1fr!important;
  gap:8px!important;
  padding:14px!important;
}
.cdProcessTunnel i{width:3px!important;height:18px!important;margin:auto!important}
.cdProcessTunnel div{min-height:70px!important;border-radius:18px!important;padding:12px!important}
.cdProcessTunnel b{font-size:18px!important}
.cdHeroCopyV5{
  width:min(1760px,100%)!important;
  margin:0 auto!important;
  padding:0 10px!important;
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  align-items:center!important;
  gap:12px 22px!important;
}
.cdHeroCopyV5 h1{
  font-size:clamp(24px,2.4vw,42px)!important;
  max-width:780px!important;
}
.cdHeroCopyV5 .cdLead{font-size:13px!important;max-width:720px!important}
.cdHeroCopyV5 .cdTrustRow{display:none!important}
.cdSection{margin-top:20px!important}
@media (max-width:1200px){
  .cdTwinPanelV5{grid-template-columns:1fr!important;grid-template-rows:auto minmax(430px,52svh) auto minmax(460px,auto)!important}
  .cdTwinMapV5{grid-column:1!important;grid-row:2!important;min-height:430px!important}
  .cdTwinControls{grid-column:1!important;grid-row:3!important;overflow:auto!important;justify-content:flex-start!important;flex-wrap:nowrap!important}
  .cdExperienceStage{grid-column:1!important;grid-row:4!important;min-height:460px!important}
  .cdHeroCopyV5{grid-template-columns:1fr!important;text-align:center!important}.cdHeroCopyV5>*{grid-column:1!important;grid-row:auto!important}.cdHeroCopyV5 .cdHeroActions{justify-content:center!important}
}
@media (max-width:720px){
  .cdHeroV5{padding:8px!important}
  .cdTwinPanelV5{padding:10px!important;border-radius:20px!important;grid-template-rows:auto 390px auto 520px!important;gap:10px!important}
  .cdTwinMapV5{min-height:390px!important;border-radius:18px!important}
  .cdExperienceStage{min-height:520px!important;border-radius:18px!important}
  .cdExperienceScene{padding:12px!important}
  .cdPhotoWall,.cdPhotoSplit,.cdEsgBoard{grid-template-columns:1fr!important;grid-template-rows:auto!important}
  .cdPhotoSplit figure.wide{grid-column:auto!important}
  .cdSceneOverlay,.cdMachineHUD,.cdLiveScale,.cdGlassDashboard{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;margin:8px!important;width:auto!important;height:auto!important}
  .cdHotspot{display:none!important}
  .cdHeroCopyV5 h1{font-size:28px!important}
}

/* === COATDOCTOR V5.6 TRUE FULLSCREEN FACTORY STAGE FIX ===
   Goal: the Living Factory is the main screen, not a 1/3 card.
   The detailed real-photo experience is placed below the full-size stage. */
body[data-app="coatdoctor"] .scene{
  padding:0!important;
  overflow-x:hidden!important;
  background:linear-gradient(135deg,#edf7ff 0%,#f8fbff 52%,#ffffff 100%)!important;
}
body[data-app="coatdoctor"] .layout,
body[data-app="coatdoctor"] .centerHero.cdHome{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  min-height:auto!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  overflow:visible!important;
}
body[data-app="coatdoctor"] .centerHero.cdHome > *{
  width:100%!important;
  max-width:none!important;
}
.cdHeroV5{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:18px clamp(16px,2.2vw,36px) 34px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
  min-height:auto!important;
  border:0!important;
  border-radius:0!important;
  background:linear-gradient(135deg,#edf7ff 0%,#f8fbff 52%,#ffffff 100%)!important;
  box-shadow:none!important;
}
.cdTwinPanelV5{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:18px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:auto minmax(640px,calc(100svh - 220px)) auto!important;
  gap:12px!important;
  min-height:calc(100svh - 112px)!important;
  height:auto!important;
  max-height:none!important;
  border-radius:32px!important;
  overflow:visible!important;
  background:rgba(255,255,255,.76)!important;
  border:1px solid rgba(177,201,224,.62)!important;
  box-shadow:0 28px 80px rgba(16,32,51,.10)!important;
  backdrop-filter:blur(8px)!important;
}
.cdTwinTop{
  grid-column:1!important;
  grid-row:1!important;
  margin:0!important;
  padding:2px 10px 8px!important;
}
.cdTwinMapV5{
  grid-column:1!important;
  grid-row:2!important;
  width:100%!important;
  height:100%!important;
  min-height:640px!important;
  max-height:none!important;
  border-radius:28px!important;
  overflow:hidden!important;
  background:
    linear-gradient(rgba(18,107,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(18,107,255,.035) 1px,transparent 1px),
    radial-gradient(circle at 50% 45%,rgba(18,107,255,.10),transparent 38%),
    linear-gradient(180deg,#fbfdff,#edf7ff)!important;
  background-size:42px 42px,42px 42px,auto,auto!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 18px 46px rgba(16,32,51,.08)!important;
}
.cdTwinPanelV5 .cdTwinSvg{
  width:100%!important;
  height:100%!important;
  margin:0!important;
  transform-origin:center center!important;
  transition:transform .95s cubic-bezier(.22,1,.36,1),filter .6s ease!important;
}
/* Fill the large stage. Overview must look immersive, not miniature. */
.cdTwinPanelV5[data-active-zone="overview"] .cdTwinSvg{transform:translate3d(0,0,0) scale(1.36)!important}
.cdTwinPanelV5[data-active-zone="warehouse"] .cdTwinSvg{transform:translate3d(25%,18%,0) scale(2.34)!important}
.cdTwinPanelV5[data-active-zone="erp"] .cdTwinSvg{transform:translate3d(8%,-10%,0) scale(2.24)!important}
.cdTwinPanelV5[data-active-zone="lab"] .cdTwinSvg{transform:translate3d(14%,28%,0) scale(2.24)!important}
.cdTwinPanelV5[data-active-zone="optimization"] .cdTwinSvg{transform:translate3d(-4%,-1%,0) scale(2.04)!important}
.cdTwinPanelV5[data-active-zone="dispensing"] .cdTwinSvg{transform:translate3d(-26%,25%,0) scale(2.26)!important}
.cdTwinPanelV5[data-active-zone="production"] .cdTwinSvg{transform:translate3d(-26%,-17%,0) scale(2.30)!important}
.cdTwinPanelV5[data-active-zone="side-decoration"] .cdTwinSvg{transform:translate3d(-26%,-17%,0) scale(2.42)!important}
.cdTwinPanelV5[data-active-zone="esg"] .cdTwinSvg{transform:translate3d(22%,-24%,0) scale(2.30)!important}
.cdTwinControls{
  grid-column:1!important;
  grid-row:3!important;
  position:relative!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  transform:none!important;
  width:100%!important;
  margin:0!important;
  display:flex!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  padding:10px!important;
  border-radius:24px!important;
  background:rgba(255,255,255,.88)!important;
  border:1px solid rgba(177,201,224,.62)!important;
  box-shadow:0 14px 32px rgba(16,32,51,.08)!important;
  backdrop-filter:blur(10px)!important;
}
.cdTwinControls button{font-size:11px!important;min-height:32px!important;padding:8px 13px!important}
/* Real factory experience becomes a separate full-width command layer, not a side panel. */
.cdExperienceStage,
.cdZoomStage.cdExperienceStage{
  position:relative!important;
  grid-column:auto!important;
  grid-row:auto!important;
  inset:auto!important;
  width:100%!important;
  max-width:none!important;
  min-height:clamp(560px,68svh,820px)!important;
  height:auto!important;
  margin:18px 0 0!important;
  border-radius:32px!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(237,247,255,.92))!important;
  border:1px solid rgba(177,201,224,.64)!important;
  box-shadow:0 22px 58px rgba(16,32,51,.10),inset 0 1px 0 rgba(255,255,255,.95)!important;
}
.cdExperienceScene,
.cdZoomScene.cdExperienceScene{
  position:absolute!important;
  inset:0!important;
  display:grid!important;
  grid-template-columns:minmax(300px,.58fr) minmax(0,1.42fr)!important;
  grid-template-rows:1fr!important;
  gap:24px!important;
  padding:24px!important;
  opacity:0!important;
  visibility:hidden!important;
  transform:translateY(12px) scale(.99)!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.cdExperienceScene.is-active,
.cdZoomScene.cdExperienceScene.is-active{opacity:1!important;visibility:visible!important;transform:translateY(0) scale(1)!important}
.cdSceneText{align-self:center!important;max-width:540px!important;padding:0 8px!important}
.cdSceneText strong{font-size:clamp(34px,3.7vw,64px)!important;line-height:.95!important;letter-spacing:-.06em!important}
.cdSceneText p{font-size:clamp(15px,1.05vw,18px)!important;line-height:1.6!important;max-width:520px!important}
.cdPhotoScene,.cdPhotoSplit,.cdPhotoWall,.cdProcessTunnel,.cdEsgBoard{height:100%!important;min-height:clamp(500px,60svh,760px)!important;border-radius:28px!important}
.cdPhotoMain,.cdPhotoWall img,.cdPhotoSplit img{filter:blur(3.4px) saturate(.78) contrast(.92) brightness(1.04)!important;transform:scale(1.09)!important}
.cdPhotoWall{grid-template-columns:repeat(4,1fr)!important}.cdPhotoWall img{min-height:100%!important}
.cdPhotoSplit{grid-template-columns:1.15fr .85fr!important;grid-template-rows:1fr 1fr!important}.cdPhotoSplit figure.wide{grid-column:auto!important;grid-row:span 2!important}.cdPhotoSplit img{min-height:0!important;height:100%!important}
.cdHeroCopyV5{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:4px clamp(8px,1vw,18px) 0!important;
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:12px 22px!important;
  text-align:left!important;
}
.cdHeroCopyV5 h1{font-size:clamp(28px,2.8vw,48px)!important;line-height:.98!important;max-width:980px!important;margin:0!important}
.cdHeroCopyV5 .cdLead{font-size:14px!important;max-width:780px!important;margin:0!important}.cdHeroCopyV5 .cdTrustRow{display:none!important}
.cdSection{max-width:none!important;width:calc(100% - clamp(32px,4.4vw,72px))!important;margin-left:auto!important;margin-right:auto!important}
@media (max-width:1200px){
  .cdTwinPanelV5{grid-template-rows:auto minmax(520px,64svh) auto!important;min-height:auto!important}.cdTwinMapV5{min-height:520px!important}.cdExperienceScene{grid-template-columns:1fr!important;overflow:auto!important}.cdExperienceStage{min-height:760px!important}.cdPhotoWall{grid-template-columns:repeat(2,1fr)!important}.cdPhotoSplit{grid-template-columns:1fr!important;grid-template-rows:auto!important}.cdPhotoSplit figure.wide{grid-row:auto!important}.cdSceneText{align-self:start!important;max-width:none!important}.cdHeroCopyV5{grid-template-columns:1fr!important;text-align:center!important}.cdHeroCopyV5>*{grid-column:1!important}.cdHeroCopyV5 .cdHeroActions{justify-content:center!important}
}
@media (max-width:720px){
  .cdHeroV5{padding:8px!important}.cdTwinPanelV5{padding:10px!important;border-radius:20px!important;grid-template-rows:auto 430px auto!important;gap:10px!important}.cdTwinMapV5{min-height:430px!important;border-radius:18px!important}.cdTwinPanelV5[data-active-zone="overview"] .cdTwinSvg{transform:scale(1.34)!important}.cdTwinControls{justify-content:flex-start!important;flex-wrap:nowrap!important;overflow:auto!important}.cdExperienceStage{min-height:820px!important;border-radius:20px!important}.cdExperienceScene{padding:12px!important}.cdPhotoWall{grid-template-columns:1fr!important}.cdPhotoScene,.cdPhotoSplit,.cdPhotoWall,.cdProcessTunnel,.cdEsgBoard{min-height:360px!important}.cdHeroCopyV5 h1{font-size:28px!important}
}