/* ===========================================================
   OGRE — PLATFORM EXPERIENCE CAROUSEL (extended)
   5 slides: Logistics Planner · Claims Workspace ·
   Assessment Case · Defects · Logistics View
   All cards are forced to the Planner's exact height by JS.
   =========================================================== */

/* ---- Carousel geometry (count-independent) ----
   Each slide is forced to exactly one viewport width and the track is
   shifted by index*100%, so slide count never has to match a fixed
   track width. Prevents adjacent slides bleeding into view. */
.pf-car-track { width: 100%; }
.pf-car-slide { min-width: 100%; max-width: 100%; width: 100%; flex: 0 0 100%; box-sizing: border-box; }

/* Hide pill switcher on narrow viewports (dots + arrows remain) */
@media (max-width: 760px) {
  .pf-car-pills { display: none; }
}

/* ===========================================================
   CLAIMS WORKSPACE — refinements (Fix 1-5)
   =========================================================== */
.cw-board .cw-reg { background: #FDE68A; }

/* Softer terracotta Draft segment (was #E8450A) */
.cw-board .cw-pie {
  background: conic-gradient(
    #3B82F6 0deg 56.9deg,
    #22C55E 56.9deg 69.4deg,
    #F4845C 69.4deg 257deg,
    #65A30D 257deg 336.4deg,
    #8B5CF6 336.4deg 355.2deg,
    #9CA3AF 355.2deg 356.8deg,
    #D6BCEC 356.8deg 360deg
  );
}

/* Compact heights so content lands at Planner height */
.cw-board .lp-shell { height: 44px; }
.cw-board .cw-cmd { padding: 5px 16px; }
.cw-board .cw-titlebar { padding: 16px 18px 11px; }
.cw-board .cw-panel { padding: 11px 14px; }
.cw-board .cw-tbl td { height: 33px; }
.cw-board .cw-tbl--wide td { height: 36px; }
.cw-board .cw-bottom { padding: 11px 16px 12px; }

/* ===========================================================
   MODEL-DRIVEN CARD SHELL (Assessment Case + Defects)
   =========================================================== */
.mc-board { font-family: 'Hanken Grotesk', sans-serif; color: #1A1A1A; display: flex; flex-direction: column; }
.mc-board .lp-shell { height: 44px; }

/* Command toolbar */
.mc-cmd { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 4px 14px; background: #fff; border-bottom: 1px solid #EEE; }
.mc-cmd-scroll { display: flex; align-items: center; gap: 2px; min-width: 0; overflow: hidden; flex: 1; }
.mc-cb { display: inline-flex; align-items: center; gap: 5px; padding: 6px 8px; font-size: 11.5px; color: #555; border-radius: 6px; white-space: nowrap; cursor: default; }
.mc-cb:hover { background: #F5F5F5; }
.mc-cb svg { width: 13px; height: 13px; color: #7a7a7a; flex-shrink: 0; }
.mc-chev { width: 10px; height: 10px; }
.mc-cmd .cw-share { flex-shrink: 0; }

/* Title row */
.mc-titlebar { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 16px 18px 12px; background: #fff; }
.mc-title { font-size: 19px; font-weight: 800; letter-spacing: -0.01em; color: #1A1A1A; }
.mc-saved { font-weight: 500; font-size: 13px; color: #9a9a9a; }
.mc-subtitle { font-size: 11.5px; color: #8a8a8a; margin-top: 2px; }
.mc-owner { display: flex; align-items: center; gap: 11px; flex-shrink: 0; }
.mc-statlbl { display: flex; flex-direction: column; line-height: 1.25; text-align: right; }
.mc-statlbl b { font-size: 12px; font-weight: 600; color: #1A1A1A; }
.mc-statlbl span { font-size: 10.5px; color: #9a9a9a; }
.mc-statlbl--name { text-align: left; }
.mc-statlbl--name b { color: #2266CC; }
.mc-avatar { width: 30px; height: 30px; border-radius: 50%; background: #1F8A5B; color: #fff; display: grid; place-items: center; font-size: 11px; font-weight: 700; position: relative; }
.mc-avatar::after { content: ''; position: absolute; right: -1px; bottom: -1px; width: 8px; height: 8px; border-radius: 50%; background: #22C55E; border: 1.5px solid #fff; }
.mc-owner > .mc-chev { width: 13px; height: 13px; color: #9a9a9a; align-self: center; }

/* Tabs */
.mc-tabs { display: flex; gap: 22px; padding: 0 18px; background: #fff; border-bottom: 1px solid #EAEAEA; }
.mc-tabs span { position: relative; font-size: 13px; color: #5a5a5a; padding: 9px 0 10px; cursor: default; }
.mc-tabs span.active { color: #1A1A1A; font-weight: 600; }
.mc-tabs span.active::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2.5px; background: #E8450A; border-radius: 2px; }
.mc-tabs em { font-style: normal; color: #9a9a9a; font-size: 10px; }

/* Body */
.mc-body { flex: 1; min-height: 0; background: #F6F6F7; }
.mc-body--3 { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.02fr) minmax(0,0.96fr); gap: 1px; }
.mc-col { background: #fff; padding: 12px 16px; min-width: 0; overflow: hidden; }
.mc-col--right { background: #fff; padding: 10px 14px; display: flex; flex-direction: column; }

/* Form fields */
.mc-field { display: grid; grid-template-columns: 116px 1fr; gap: 10px; align-items: center; min-height: 27px; }
.mc-field--tight { min-height: 24px; }
.mc-fl { font-size: 10.5px; color: #8a8a8a; display: flex; align-items: center; gap: 4px; line-height: 1.15; }
.mc-fl--req::before { content: '*'; color: #E8450A; margin-right: 1px; }
.mc-lock { width: 10px; height: 10px; flex-shrink: 0; color: #bdbdbd; }
.mc-fv { font-size: 11.5px; color: #333; border-bottom: 1px solid #ECECEC; min-height: 23px; display: flex; align-items: center; gap: 6px; padding: 2px 4px; }
.mc-fv--sel { justify-content: space-between; }
.mc-fv--sel .mc-chev { width: 12px; height: 12px; color: #9a9a9a; }
.mc-fv--plate { padding: 2px 2px 2px 0; justify-content: space-between; }
.mc-fv--url { justify-content: space-between; }
.mc-lnk { color: #2266CC; text-decoration: none; }
.mc-lnk:hover { text-decoration: underline; }
.mc-plate {
  background: #FDE68A; color: #1A1A1A;
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 10px; font-weight: 700;
  padding: 2px 7px; border-radius: 3px; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 5px;
}
.mc-plate i { font-style: normal; color: #8a7320; cursor: pointer; }
.mc-srch { width: 14px; height: 14px; color: #9a9a9a; flex-shrink: 0; }
.mc-chip-lnk {
  display: inline-flex; align-items: center; gap: 5px;
  background: #EAF1FB; color: #2266CC; border: 1px solid #D3E2F6;
  font-size: 10.5px; padding: 2px 6px; border-radius: 4px; white-space: nowrap;
  max-width: 100%; overflow: hidden;
}
.mc-chip-lnk svg { width: 11px; height: 11px; flex-shrink: 0; }
.mc-chip-lnk i { font-style: normal; color: #8aa6cf; }
.mc-chip-lnk--long { overflow: hidden; text-overflow: ellipsis; }
.mc-url { font-size: 10.5px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mc-globe { width: 13px; height: 13px; color: #9a9a9a; flex-shrink: 0; }

/* Section headers */
.mc-sec { font-size: 11px; font-weight: 700; color: #1A1A1A; text-transform: none; margin: 11px 0 5px; }
.mc-sec--lg { font-size: 13px; margin: 2px 0 8px; }
.mc-sec--row { display: flex; align-items: center; justify-content: space-between; }
.mc-kebab-v { display: flex; flex-direction: column; gap: 2px; }
.mc-kebab-v i { width: 3px; height: 3px; border-radius: 50%; background: #b0b0b0; }

/* Inner bordered job panel */
.mc-inner { border: 1px solid #E8E8E8; border-radius: 6px; padding: 6px 10px; margin: 4px 0 8px; }

/* Tyre table */
.mc-tyre { border: 1px solid #EEE; border-radius: 6px; overflow: hidden; margin-top: 4px; }
.mc-ttbl { width: 100%; border-collapse: collapse; font-size: 11px; }
.mc-ttbl th { text-align: left; font-size: 10px; font-weight: 600; color: #888; padding: 6px 8px; background: #FAFAFA; border-bottom: 1px solid #EEE; white-space: nowrap; }
.mc-ttbl th em { font-style: normal; color: #c2c2c2; font-size: 9px; margin-left: 2px; }
.mc-ttbl td { padding: 5px 8px; border-bottom: 1px solid #F3F3F3; color: #4a4a4a; }
.mc-ttbl tbody tr:last-child td { border-bottom: none; }
.mc-tyre-foot { font-size: 11px; color: #999; padding: 6px 8px; background: #FBFBFB; }

/* ---- Asset Live Tracker map placeholder ---- */
.mc-map {
  position: relative; height: 232px; border-radius: 6px; overflow: hidden;
  border: 1px solid #E2E2E2;
  background:
    radial-gradient(60% 80% at 18% 30%, #D9E7C9 0%, transparent 60%),
    radial-gradient(50% 60% at 80% 70%, #CFE0CA 0%, transparent 55%),
    linear-gradient(135deg, #E8EEDF 0%, #DCE7E8 55%, #C9DCE6 100%);
  margin-bottom: 12px;
}
.mc-map::before {
  content: ''; position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(120,140,150,0.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120,140,150,0.10) 1px, transparent 1px);
  background-size: 34px 34px;
}
.mc-map-toggle { position: absolute; top: 8px; left: 8px; z-index: 3; display: flex; background: #fff; border: 1px solid #E2E2E2; border-radius: 5px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,0.10); }
.mc-map-toggle span { font-size: 10.5px; padding: 4px 9px; color: #555; }
.mc-map-toggle span.active { background: #F0F0F0; color: #1A1A1A; font-weight: 600; }
.mc-map-toggle .mc-map-refresh { border-left: 1px solid #EEE; color: #2266CC; }
.mc-map-full { position: absolute; right: 8px; bottom: 8px; width: 16px; height: 16px; color: #5a6b6b; z-index: 3; }
.mc-map-pin { position: absolute; left: 56%; top: 46%; width: 16px; height: 16px; background: #E8450A; border-radius: 50% 50% 50% 0; transform: translate(-50%,-100%) rotate(-45deg); box-shadow: 0 2px 5px rgba(0,0,0,0.3); z-index: 2; }
.mc-map-pin::after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 6px; height: 6px; border-radius: 50%; background: #fff; }
.mc-map-pop {
  position: absolute; left: 50%; top: 14px; transform: translateX(-30%); z-index: 4;
  background: #fff; border: 1px solid #E2E2E2; border-radius: 6px;
  box-shadow: 0 4px 14px rgba(0,0,0,0.16);
  padding: 9px 24px 9px 11px; font-size: 10px; line-height: 1.55; color: #444; max-width: 220px;
}
.mc-pop-x { position: absolute; top: 5px; right: 7px; font-size: 13px; color: #b0b0b0; cursor: pointer; line-height: 1; }
.mc-map-credit { position: absolute; left: 8px; bottom: 7px; font-size: 9px; color: #6a7878; z-index: 3; }

/* ---- Timeline ---- */
.mc-tl { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 7px; overflow: hidden; }
.mc-tl-tools { display: flex; align-items: center; gap: 9px; }
.mc-tl-tools svg { width: 13px; height: 13px; color: #9a9a9a; }
.mc-tl-search, .mc-tl-note { display: flex; align-items: center; gap: 7px; border: 1px solid #E4E4E4; border-radius: 6px; padding: 6px 9px; font-size: 11px; color: #9a9a9a; }
.mc-tl-search svg, .mc-tl-note svg { width: 13px; height: 13px; flex-shrink: 0; color: #a8a8a8; }
.mc-tl-note { justify-content: space-between; }
.mc-attach { margin-left: auto; }
.mc-tl-hl { background: #F7F7F8; border-radius: 6px; padding: 8px 10px; }
.mc-tl-hl-head { display: flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 600; color: #1A1A1A; margin-bottom: 4px; }
.mc-tl-hl-head svg { width: 13px; height: 13px; color: #8a8a8a; }
.mc-tl-hl-body { font-size: 10.5px; color: #9a9a9a; }
.mc-tl-recent { display: flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; color: #555; }
.mc-tl-recent svg { width: 13px; height: 13px; color: #9a9a9a; }
.mc-tl-item { display: flex; gap: 9px; }
.mc-tl-av { width: 26px; height: 26px; border-radius: 50%; background: #7C3AED; color: #fff; display: grid; place-items: center; font-size: 10px; font-weight: 700; flex-shrink: 0; }
.mc-tl-body { min-width: 0; }
.mc-tl-meta { font-size: 10px; color: #9a9a9a; }
.mc-tl-line { font-size: 11px; color: #444; margin: 2px 0; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.mc-overdue { background: #FBE3E3; color: #C0392B; font-size: 9px; font-weight: 700; padding: 1px 7px; border-radius: 100px; }
.mc-tl-task { font-size: 11px; color: #1A1A1A; }
.mc-tl-more { font-size: 11px; color: #2266CC; }
.mc-tl-more em { font-style: normal; }

/* ===========================================================
   DEFECTS — two-panel body
   =========================================================== */
.mc-body--defects { display: grid; grid-template-columns: 55% 45%; gap: 1px; padding: 0; }
.df-left { background: #fff; padding: 12px 14px; display: flex; flex-direction: column; gap: 12px; min-width: 0; overflow: hidden; }
.df-block { display: flex; flex-direction: column; min-width: 0; }
.df-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 7px; }
.df-title { font-size: 12.5px; font-weight: 700; color: #1A1A1A; }
.df-title em { font-style: normal; color: #9a9a9a; font-size: 10px; }
.df-tools { display: flex; align-items: center; gap: 11px; }
.df-t { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: #555; white-space: nowrap; }
.df-t svg { width: 12px; height: 12px; color: #888; }
.df-t em { font-style: normal; color: #9a9a9a; font-size: 9px; }
.df-scroll { overflow: hidden; border: 1px solid #EEE; border-radius: 6px; }
.df-tbl { width: 100%; border-collapse: collapse; font-size: 11px; table-layout: fixed; }
.df-tbl th { text-align: left; font-size: 9.5px; font-weight: 500; color: #888; padding: 7px 8px; border-bottom: 1px solid #E8E8E8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: #FBFBFB; }
.df-tbl th em { font-style: normal; color: #c2c2c2; font-size: 9px; margin-left: 2px; }
.df-tbl td { padding: 0 8px; height: 32px; border-bottom: 1px solid #F3F3F3; color: #4a4a4a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.df-tbl tbody tr:last-child td { border-bottom: none; }
.df-tbl tbody tr:hover { background: #FFF8F6; }
.df-tbl th:first-child, .df-tbl td:first-child { width: 26px; }
.df-lnk { color: #E8450A; text-decoration: none; }
.df-lnk:hover { text-decoration: underline; }
.df-pill { display: inline-block; font-size: 10px; font-weight: 600; padding: 2px 8px; border-radius: 100px; white-space: nowrap; }
.df-pill.assessed { background: #EFF6FF; color: #1D4ED8; }
.df-pill.fixed { background: #DCFCE7; color: #166534; }
.df-foot { font-size: 11px; color: #999; padding: 6px 2px 0; }
.df-right { background: #F5F5F5; display: grid; place-items: stretch; padding: 14px; }
.df-broken { width: 46px; height: 46px; color: #c2c2c2; }

/* Defect evidence panel */
.de-panel { background: #fff; border: 1px solid #EEEEEE; border-radius: 10px; overflow: hidden; display: flex; flex-direction: column; width: 100%; }
.de-bar { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 12px; border-bottom: 1px solid #EEEEEE; }
.de-bar-label { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: #9a9a9a; font-weight: 600; }
.de-pill { font-size: 10px; font-weight: 600; padding: 3px 9px; border-radius: 100px; background: #FDEBE3; color: #E8450A; white-space: nowrap; }
.de-img { position: relative; width: 100%; height: 260px; overflow: hidden; }
.de-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.de-circle { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.de-cap { position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.55); padding: 8px 12px; display: flex; flex-direction: column; gap: 1px; }
.de-cap-t { color: #fff; font-size: 11px; font-weight: 600; }
.de-cap-s { color: rgba(255,255,255,.7); font-size: 10px; }
.de-meta { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #EEEEEE; }
.de-meta-col { padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.de-meta-col + .de-meta-col { border-left: 1px solid #EEEEEE; }
.de-m-label { font-size: 10px; color: #9a9a9a; }
.de-m-val { font-size: 12px; color: #1A1A1A; font-weight: 600; }
.de-m-sub { font-size: 10px; color: #9a9a9a; }
.de-sev { align-self: flex-start; margin-top: 2px; font-size: 10px; font-weight: 600; padding: 2px 9px; border-radius: 100px; background: #FEF3C7; color: #92400E; }
.de-actions { display: flex; align-items: center; gap: 12px; padding: 8px 12px; border-top: 1px solid #EEEEEE; }
.de-act { display: flex; align-items: center; gap: 7px; }
.de-act-label { font-size: 11px; color: #4a4a4a; }
.de-toggle { width: 30px; height: 17px; border-radius: 100px; background: #D4D4D4; position: relative; flex-shrink: 0; transition: background .15s; }
.de-toggle i { position: absolute; top: 2px; left: 2px; width: 13px; height: 13px; border-radius: 50%; background: #fff; transition: left .15s; }
.de-toggle.on { background: #E8450A; }
.de-toggle.on i { left: 15px; }
.de-assess { margin-left: auto; font-size: 11px; font-weight: 600; color: #E8450A; background: transparent; border: 1px solid #E8450A; border-radius: 6px; padding: 5px 11px; cursor: pointer; white-space: nowrap; transition: background .15s, color .15s; }
.de-assess:hover { background: #E8450A; color: #fff; }

/* ===========================================================
   LOGISTICS VIEW
   =========================================================== */
.lv-board { font-family: 'Hanken Grotesk', sans-serif; color: #1A1A1A; display: flex; flex-direction: column; }
.lv-board .lp-shell { height: 44px; }
.lv-board .cw-titlebar { padding: 16px 18px 10px; }

.lv-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: #EFEFF0; border-top: 1px solid #EEE; }
.lv-panel { background: #fff; padding: 11px 14px; min-width: 0; display: flex; flex-direction: column; }
.lv-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.lv-ptitle { font-size: 13px; font-weight: 700; color: #1A1A1A; }
.lv-ptitle em { font-style: normal; color: #9a9a9a; font-size: 10px; }
.lv-tools { display: flex; align-items: center; gap: 9px; }
.lv-t { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: #555; white-space: nowrap; }
.lv-t svg { width: 12px; height: 12px; color: #888; }
.lv-filter { display: flex; align-items: center; gap: 7px; border: 1px solid #E2E2E2; border-radius: 6px; padding: 5px 9px; font-size: 11px; color: #9a9a9a; margin-bottom: 8px; align-self: flex-end; width: 200px; }
.lv-filter svg { width: 12px; height: 12px; flex-shrink: 0; }
.lv-thead { display: grid; grid-template-columns: 1.1fr 0.9fr 1fr 0.8fr 0.9fr 1fr; gap: 6px; padding: 0 4px 7px; border-bottom: 1px solid #EEE; }
.lv-thead span { font-size: 9.5px; color: #999; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lv-thead em { font-style: normal; color: #c2c2c2; font-size: 9px; }
.lv-empty { flex: 1; min-height: 150px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.lv-empty svg { width: 52px; height: 52px; color: #d2d2d2; }
.lv-empty span { font-size: 12px; color: #9a9a9a; }
.lv-tbl-scroll { overflow: hidden; }
.lv-tbl { width: 100%; border-collapse: collapse; font-size: 11px; table-layout: fixed; }
.lv-tbl th { text-align: left; font-size: 9.5px; font-weight: 500; color: #999; padding: 6px 6px; border-bottom: 1px solid #EEE; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lv-tbl th em { font-style: normal; color: #c2c2c2; font-size: 9px; }
.lv-tbl td { padding: 0 6px; height: 30px; border-bottom: 1px solid #F3F3F3; color: #4a4a4a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lv-tbl tbody tr:last-child td { border-bottom: none; }
.lv-tbl tbody tr:hover { background: #FFF8F6; }
.lv-tbl th:first-child, .lv-tbl td:first-child { width: 24px; }
.lv-lnk { color: #E8450A; text-decoration: none; }
.lv-lnk:hover { text-decoration: underline; }
.lv-pill { display: inline-block; font-size: 9.5px; font-weight: 600; padding: 2px 7px; border-radius: 100px; white-space: nowrap; }
.lv-pill.onhire { background: #DCFCE7; color: #166534; }
.lv-pill.dehired { background: #F3F3F3; color: #555; }
.lv-alpha { display: flex; flex-wrap: wrap; gap: 0; margin-top: 8px; font-size: 9.5px; color: #b0b0b0; }
.lv-alpha span { padding: 1px 3px; }
.lv-alpha .on { color: #E8450A; font-weight: 700; }
.lv-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 7px; font-size: 11px; color: #999; }
.lv-pg { color: #777; }
.lv-pg em { font-style: normal; color: #b0b0b0; }

/* Chart panel */
.lv-chart { background: #fff; border-top: 1px solid #E8E8E8; padding: 11px 16px 14px; }
.lv-chart-head { display: flex; align-items: center; justify-content: space-between; }
.lv-chart-lbl { font-size: 13px; font-weight: 700; color: #1A1A1A; }
.lv-chart-ic { display: flex; align-items: center; gap: 12px; color: #9a9a9a; }
.lv-chart-ic svg { width: 14px; height: 14px; }
.lv-chart-sub { font-size: 11px; color: #8a8a8a; margin: 3px 0 8px; }
.lv-chart-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 4px; }
.lv-chart-legend span { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: #555; }
.lv-dot { width: 8px; height: 8px; border-radius: 50%; }
.lv-chart-body { display: flex; }
.lv-pie-wrap { position: relative; width: 150px; height: 150px; margin-top: 2px; }
.lv-pie {
  width: 150px; height: 150px; border-radius: 50%;
  background: conic-gradient(
    #3B82F6 0deg 47.7deg,
    #22C55E 47.7deg 67deg,
    #E8763C 67deg 127deg,
    #A855C7 127deg 360deg
  );
  box-shadow: 0 2px 10px rgba(0,0,0,0.12);
}
.lv-pie-lbl { position: absolute; font-size: 11px; font-weight: 700; transform: translate(-50%,-50%); white-space: nowrap; }

@media (max-width: 900px) {
  .mc-body--3 { grid-template-columns: 1fr; }
  .mc-body--defects { grid-template-columns: 1fr; }
  .lv-cols { grid-template-columns: 1fr; }
}