/* Asseta — Data Connections · Components (badges, account cell, tabs, filter/column menus, drawers, comment modal). Targets AG Grid (.ag-*) + our own (.dc-*). */
  .ag-root-wrapper{ --ag-font-family:var(--font); }
  .ag-paging-panel{ border-top:0 !important; } /* avoid double line: last-row border already separates table from footer */
  .ag-row.dc-rowhover{ background:var(--row-hover) !important; } /* clear hover so the row reads as clickable (opens account) */
  .ag-header-cell[col-id="sel"] .ag-cell-label-container{ padding:0 !important; justify-content:center; }
  .dc-selectall{ display:flex; align-items:center; transform:translateX(14px); }
  .ag-checkbox-input-wrapper.ag-checked{ background-color:var(--accent) !important; border-color:var(--accent) !important; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; background-size:11px 11px !important; }
  .ag-checkbox-input-wrapper.ag-checked::after{ content:none !important; }
  .ag-checkbox-input-wrapper.dc-indet{ background-color:var(--accent) !important; border-color:var(--accent) !important; }
  .ag-checkbox-input-wrapper.dc-indet::after{ content:'' !important; -webkit-mask-image:none !important; mask-image:none !important; background:var(--white) !important; position:absolute; left:3px; right:3px; top:calc(50% - 1px); height:2px; width:auto; border:0; border-radius:1px; transform:none; }
  .coa-action-cell{ justify-content:center; }   /* center the action group in the pinned cell */
  .coa-action-cell>span{ display:flex; }
  .coa-actions{ display:flex; align-items:center; justify-content:center; gap:var(--sp-16); height:100%; }  /* 16px between the two icons */
  .coa-action-cell button{ width:22px; height:22px; min-width:0; padding:0; border:0; background:none; color:var(--text-primary); cursor:pointer; border-radius:var(--r-frame); display:inline-grid; place-items:center; transition:background .12s; }
  .coa-action-cell button:hover{ background:var(--navy-06); }
  .coa-action-cell button svg{ width:16px; height:16px; display:block; }
  .dc-rowmenu{ position:fixed; min-width:184px; background:var(--white); border:1px solid var(--border); border-radius:var(--r-card-s); box-shadow:var(--shadow-menu); padding:var(--sp-6); z-index:var(--z-rowmenu); }
  .dc-rowmenu[hidden]{ display:none; }
  .dc-rowmenu button{ display:flex; align-items:center; gap:var(--sp-8); width:100%; text-align:left; border:0; background:none; padding:var(--sp-8) var(--sp-12); border-radius:var(--r-md); font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); cursor:pointer; }
  .dc-rowmenu button:hover{ background:var(--hover-soft); }
  .dc-rowmenu button svg{ color:var(--text-secondary); flex:0 0 16px; display:block; }
  .dc-rowmenu button.danger{ color:var(--danger); }
  .dc-rowmenu button.danger svg{ color:var(--danger); }
  .dc-cv{ overflow:visible !important; text-overflow:clip !important; display:flex; align-items:center; height:100%; }
  .dc-acct{ display:flex; flex-direction:column; justify-content:center; line-height:1.25; }
  .dc-acct-name{ font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); }
  .dc-acct-num{ font:var(--fw-medium) var(--fs-12) var(--font); color:var(--text-secondary); text-decoration:none; }
  .dc-acct-num:hover{ text-decoration:underline; }
  .dc-divider{ width:100%; height:1px; background:var(--border); margin:var(--sp-16) 0; flex:0 0 auto; align-self:stretch; }
  .dc-muted{ color:var(--text-tertiary); }
  .dc-badge{ display:inline-flex; align-items:center; gap:var(--sp-6); padding:var(--sp-2) var(--sp-8); border-radius:var(--r-pill); font:var(--fw-medium) var(--fs-12) var(--font); white-space:nowrap; }
  .dc-badge i{ width:6px; height:6px; border-radius:50%; flex:0 0 6px; }
  .dc-neutral{ background:var(--border-soft); color:var(--st-neutral-fg);} .dc-neutral i{background:var(--muted-2);}
  .dc-blue{ background:var(--st-blue-bg); color:var(--st-blue-fg);} .dc-blue i{background:var(--st-blue-fg);}
  .dc-purple{ background:var(--st-purple-bg); color:var(--st-purple-fg);} .dc-purple i{background:var(--st-purple-fg);}
  .dc-amber{ background:var(--st-amber-bg); color:var(--st-amber-fg);} .dc-amber i{background:var(--st-amber-dot);}
  .dc-green{ background:var(--st-green-bg); color:var(--st-green-fg);} .dc-green i{background:var(--st-green-dot);}
  .dc-red{ background:var(--st-red-bg); color:var(--danger);} .dc-red i{background:var(--st-red-dot);}
  /* Column-header icons: funnel (filter) + three-dots (column menu), revealed on header hover.
     Spacing 1:1 with Figma node 2683-184164 — text · 8px · [funnel · 4px · dots], icons 16px, navy@60%. */
  .dc-headcomp{ display:flex; align-items:center; width:100%; height:100%; }
  .dc-headcomp .ag-header-cell-text{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
  .dc-fhead{ cursor:pointer; }
  .ag-header-cell-menu-button{ display:none !important; }      /* hide AG's native hamburger */
  .dc-fhead .ag-header-cell-label{ overflow:visible; }
  /* funnel + dots grouped at the right of the header (4px apart), revealed on hover; collapsed when idle so the title shows in full (no overlap — text ellipsises before the icons) */
  .dc-hicons{ display:none; align-items:center; gap:var(--sp-4); margin-left:auto; padding-left:var(--sp-8); flex:0 0 auto; }
  .ag-header-cell:hover .dc-hicons, .dc-hicons:has(.is-open){ display:flex; }
  .dc-ffunnel, .dc-hmenu{ width:16px; height:16px; flex:0 0 16px; display:grid; place-items:center; border:0; background:none; color:var(--text-secondary); cursor:pointer; border-radius:var(--r-frame); padding:0; transition:background .12s, color .12s, box-shadow .12s; }
  .dc-ffunnel svg, .dc-hmenu svg{ width:16px; height:16px; display:block; }
  .dc-ffunnel:hover, .dc-hmenu:hover{ color:var(--text-primary); background:var(--hover-strong); box-shadow:0 0 0 3px var(--hover-strong); }
  .dc-ffunnel.is-open, .dc-hmenu.is-open{ color:var(--accent); background:var(--hover-strong); box-shadow:0 0 0 3px var(--hover-strong); }
  .dc-fmenu{ width:auto; min-width:210px; max-width:280px; }
  .dc-hmenu-pop{ position:fixed; min-width:228px; background:var(--white); border:1px solid var(--border); border-radius:var(--r-card); box-shadow:var(--shadow-pop); padding:var(--sp-6); z-index:var(--z-colmenu); }
  .dc-hmenu-pop[hidden]{ display:none; }
  .dc-hmenu-grp{ padding:var(--sp-4) 0; }
  .dc-hmenu-grp + .dc-hmenu-grp{ border-top:1px solid var(--border-faint); }
  .dc-hmenu-item{ display:flex; align-items:center; gap:var(--sp-12); width:100%; text-align:left; border:0; background:none; padding:var(--sp-8) var(--sp-12); border-radius:var(--r-md); font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); cursor:pointer; }
  .dc-hmenu-item:hover{ background:var(--hover-soft); }
  .dc-hmenu-item>svg{ flex:0 0 18px; color:var(--text-secondary); display:block; }
  .dc-hmenu-item .lbl{ flex:1; }
  .dc-hmenu-item.has-sub>svg:last-child{ flex:0 0 16px; color:var(--text-tertiary); }
  .dc-icongroup{ display:flex; align-items:center; gap:var(--sp-6); margin-left:auto; }
  .dc-iconbtn{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; flex:0 0 40px; border:0; border-radius:50%; background:var(--pill); color:var(--text-primary); cursor:pointer; transition:background 0.2s, opacity 0.2s; }
  .dc-iconbtn:hover{ background:var(--white); }
  /* row-density selector pill (Figma node 2683-184112) */
  .dc-density{ display:inline-flex; align-items:center; gap:var(--sp-8); height:40px; padding:0 var(--sp-12); background:var(--pill); border-radius:20px; }
  .dc-density-btn{ display:grid; place-items:center; width:16px; height:16px; flex:0 0 16px; border:0; background:none; color:var(--text-tertiary); cursor:pointer; padding:0; transition:color .12s; }
  .dc-density-btn svg{ width:16px; height:16px; display:block; }
  .dc-density-btn:hover{ color:var(--text-secondary); }
  .dc-density-btn.is-active{ color:var(--text-primary); }
  .dc-density-sep{ width:1px; height:20px; background:var(--border); flex:0 0 1px; }
  /* Tabs — Asseta tab component (from tab.html): label + count pill, active = navy-blue underline */
  .dc-tabs{ display:flex; align-items:center; gap:var(--sp-24); margin:var(--sp-16) 0 var(--sp-16); border-bottom:1px solid var(--border); }
  .dc-tab{ appearance:none; border:0; background:none; padding:0 0 var(--sp-12); font-family:var(--font); cursor:pointer; position:relative; white-space:nowrap; display:inline-flex; align-items:center; gap:var(--sp-8); }
  .dc-tablabel{ font:var(--fw-medium) var(--fs-16) var(--font); color:var(--text-secondary); transition:color .15s; }
  .dc-tab:hover .dc-tablabel{ color:var(--text-primary); }
  .dc-tab.is-active .dc-tablabel{ color:var(--text-primary); }
  .dc-tab.is-active::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--accent); border-radius:2px; }
  .dc-tabcount{ font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-secondary); background:var(--pill); border-radius:var(--r-pill); padding:0 var(--sp-8); min-width:20px; text-align:center; box-sizing:border-box; }
  .dc-tab.is-active .dc-tabcount{ color:var(--text-primary); }
  .dc-colmenu{ position:fixed; width:284px; background:var(--white); border:1px solid var(--border); border-radius:var(--r-card); box-shadow:var(--shadow-menu); padding:var(--sp-8); z-index:var(--z-menu); }
  .dc-colmenu[hidden]{ display:none; }
  .dc-colmenu-list{ max-height:330px; overflow:auto; }
  .dc-colmenu-row{ display:flex; align-items:center; gap:var(--sp-12); padding:var(--sp-8) var(--sp-12); border-radius:var(--r-md); font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); cursor:pointer; user-select:none; }
  .dc-colmenu-row:hover{ background:var(--hover-soft); }
  .dc-colmenu-all{ margin-bottom:var(--sp-4); padding-bottom:var(--sp-12); border-bottom:1px solid var(--border-faint); }
  .dc-colmenu-revert{ width:100%; text-align:center; padding:var(--sp-12); margin-top:var(--sp-4); border:0; border-top:1px solid var(--border-faint); background:none; font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); cursor:pointer; }
  .dc-colmenu-revert:hover{ color:var(--accent); }
  .dc-colmenu input{ appearance:none; -webkit-appearance:none; width:18px; height:18px; flex:0 0 18px; border:1.6px solid var(--border-input); border-radius:var(--r-checkbox); cursor:pointer; position:relative; margin:0; }
  .dc-colmenu input:checked,.dc-colmenu input:indeterminate{ background:var(--accent); border-color:var(--accent); }
  .dc-colmenu input:checked::after{ content:''; position:absolute; left:5px; top:2px; width:4px; height:8px; border:solid var(--white); border-width:0 2px 2px 0; transform:rotate(45deg); }
  .dc-colmenu input:indeterminate::after{ content:''; position:absolute; left:3px; top:7px; width:10px; height:2px; background:var(--white); }
  /* ----- Add account drawer ----- */
  .dc-scrim{ position:fixed; inset:0; background:var(--scrim); z-index:var(--z-scrim); opacity:0; transition:opacity .22s; }
  .dc-scrim.open{ opacity:1; }
  .dc-scrim[hidden],.dc-drawer[hidden]{ display:none; }
  .dc-drawer{ position:fixed; top:0; right:0; bottom:0; width:600px; max-width:94vw; background:var(--white); z-index:var(--z-drawer); box-shadow:var(--shadow-drawer); transform:translateX(100%); transition:transform .26s ease; }
  .dc-drawer.open{ transform:translateX(0); }
  .dc-view{ display:flex; flex-direction:column; height:100%; }
  .dc-view[hidden]{ display:none; }
  .dc-drawer-head{ display:flex; align-items:flex-start; justify-content:space-between; padding:var(--sp-24) var(--sp-24) 0; gap:var(--sp-12); }
  .dc-drawer-eyebrow{ font:var(--fw-medium) var(--fs-12) var(--font); color:var(--text-secondary); }
  .dc-drawer-title{ font:var(--fw-medium) var(--fs-24) var(--font); color:var(--text-primary); margin:var(--sp-2) 0 0; letter-spacing:-.01em; }
  .dc-drawer-close{ border:0; background:none; color:var(--text-primary); cursor:pointer; width:32px; height:32px; display:grid; place-items:center; border-radius:var(--r-8); flex:0 0 32px; }
  .dc-drawer-close:hover{ background:var(--hover-soft); }
  .dc-drawer-body{ flex:1; overflow:auto; padding:var(--sp-20) var(--sp-24) var(--sp-24); }
  .dc-drawer .lbl{ font:var(--fw-medium) var(--fs-12) var(--font); color:var(--text-secondary); }
  .dc-drawer .val{ font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); margin-top:var(--sp-4); }
  /* same component as .dc-toolbar-search (module.css) — only width differs (fills the modal) */
  .dc-prov-search{ display:flex; align-items:center; gap:var(--sp-8); height:40px; padding:0 var(--sp-16); background:var(--pill); border-radius:var(--r-pill); color:var(--text-secondary); margin-bottom:var(--sp-16); }
  .dc-prov-search input{ flex:1; border:0; background:none; outline:0; font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); }
  .dc-prov-search input::placeholder{ color:var(--text-secondary); }
  .dc-prov-search svg{ color:var(--text-secondary); flex:0 0 18px; }
  .dc-prov-grid{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-16); }
  .dc-prov-card{ text-align:left; border:1px solid var(--border); border-radius:var(--r-card); padding:var(--sp-16); background:var(--white); cursor:pointer; transition:border-color .15s, box-shadow .15s; display:flex; flex-direction:column; gap:var(--sp-16); }
  .dc-prov-card:hover{ border-color:var(--border-hover); box-shadow:var(--shadow-card); }
  .dc-prov-top{ display:flex; gap:var(--sp-12); align-items:center; }
  .dc-prov-logo{ width:40px; height:40px; border-radius:var(--r-md); overflow:hidden; display:grid; place-items:center; flex:0 0 40px; }
  .dc-prov-logo svg, .dc-prov-logo img{ width:100%; height:100%; display:block; }
  .dc-prov-name{ font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); line-height:1.3; }
  .dc-prov-meta{ display:flex; gap:var(--sp-32); }
  .dc-detail-bc{ font:var(--fw-medium) var(--fs-12) var(--font); color:var(--text-secondary); }
  .dc-detail-back{ color:var(--text-secondary); cursor:pointer; }
  .dc-detail-back:hover{ color:var(--text-primary); text-decoration:underline; }
  .dc-detail-head{ display:flex; align-items:center; gap:var(--sp-12); margin-top:var(--sp-6); }
  .dc-detail-logo{ width:48px; height:48px; flex:0 0 48px; }   /* Figma: detail header logo = 48px (cards are 40px) */
  .dc-detail-name{ font:var(--fw-medium) var(--fs-24) var(--font); color:var(--text-primary); letter-spacing:-.01em; }
  .dc-detail-meta{ display:flex; margin:var(--sp-16) 0; }
  .dc-detail-meta>div{ flex:1; }
  .dc-detail-meta .lbl{ font-size:var(--fs-14); }   /* Figma: detail meta labels = 14px */
  .dc-detail-meta .val{ font-size:var(--fs-16); }   /* stats on provider detail = 16px (per request #11; Figma is 14px) */
  .dc-detail-divider{ height:1px; background:var(--border); margin:0 0 var(--sp-20); }
  .dc-steps-label{ font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-secondary); margin-bottom:var(--sp-16); }
  .dc-step{ display:flex; gap:var(--sp-16); padding-bottom:var(--sp-32); position:relative; }   /* Figma: number↔text 16px, step gap 32px */
  .dc-step:not(:last-child)::before{ content:''; position:absolute; left:17px; top:40px; bottom:-2px; width:2px; background:var(--border); }
  .dc-step-num{ width:36px; height:36px; border-radius:50%; background:var(--navy); color:var(--white); display:grid; place-items:center; font:var(--fw-semibold) var(--fs-14) var(--font); flex:0 0 36px; position:relative; z-index:1; }   /* Figma: 36px circle */
  .dc-step-title{ font:var(--fw-medium) var(--fs-18) var(--font); color:var(--text-primary); }   /* Figma: 18px */
  .dc-step-desc{ font:var(--fw-regular) var(--fs-14) var(--font); color:var(--text-secondary); margin-top:var(--sp-4); line-height:1.5; max-width:360px; }
  .dc-drawer-foot{ padding:var(--sp-12) var(--sp-24) var(--sp-24); }
  .dc-submit{ display:inline-flex; align-items:center; gap:var(--sp-8); height:48px; padding:0 var(--sp-20); background:var(--accent); color:var(--white); border:0; border-radius:var(--r-pill); font:var(--fw-medium) var(--fs-14) var(--font); cursor:pointer; }
  .dc-submit:hover{ background:var(--accent-hover); }
  /* ----- Account detail drawer ----- */
  .dc-adrawer{ display:flex; flex-direction:column; }
  .dc-acct-no{ font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-secondary); margin-top:var(--sp-2); }
  .dc-seclabel{ font:var(--fw-medium) var(--fs-18) var(--font); color:var(--text-primary); margin:0 0 var(--sp-16); }
  .dc-cstatus-wrap{ position:relative; }
  .dc-cstatus-btn{ width:100%; height:48px; display:flex; align-items:center; justify-content:space-between; gap:var(--sp-8); padding:0 var(--sp-16); background:var(--white); border:1px solid var(--border); border-radius:var(--r-pill); cursor:pointer; }
  .dc-cstatus-btn:hover{ border-color:var(--border-hover); }
  .dc-cstatus-btn>svg{ color:var(--text-tertiary); flex:0 0 16px; }
  .dc-cstatus-menu{ position:absolute; top:54px; left:0; right:0; background:var(--white); border:1px solid var(--border); border-radius:var(--r-card-s); box-shadow:var(--shadow-menu-2); padding:var(--sp-6); z-index:20; }
  .dc-cstatus-menu[hidden]{ display:none; }
  .dc-cstatus-opt{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-8); padding:var(--sp-8) var(--sp-8); border-radius:var(--r-md); cursor:pointer; }
  .dc-cstatus-opt:hover{ background:var(--hover-soft); }
  .dc-cstatus-opt .chk{ color:var(--accent); display:flex; opacity:0; flex:0 0 16px; }
  .dc-cstatus-opt.sel .chk{ opacity:1; }
  /* ===== Admin / Client view mode ===== */
  /* Client = view-only: hide every edit affordance */
  body[data-mode="client"] .dc-addbtn,
  body[data-mode="client"] .coa-action-cell .dc-rowcomment,
  body[data-mode="client"] .dc-a-more,
  body[data-mode="client"] .dc-a-statusctl{ display:none !important; }
  /* Admin: editable status control above the stepper */
  .dc-a-statusctl{ margin-bottom:var(--sp-20); }
  .dc-a-statusctl .lbl{ display:block; margin-bottom:var(--sp-8); }
  .dc-a-statusctl .dc-cstatus-btn{ height:44px; }
  .dc-a-cstatus .dc-badge{ pointer-events:none; }
  /* Admin: status badge in the table reads as clickable — chevron SVG (shown only on the editable badge) */
  body[data-mode="admin"] .ag-cell[col-id="authStatus"] .dc-badge{ cursor:pointer; }
  body[data-mode="admin"] .ag-cell[col-id="authStatus"] .dc-badge:hover{ filter:brightness(.97); }
  .dc-badge-caret{ display:none; align-items:center; margin-left:1px; opacity:.65; }
  .dc-badge-caret svg{ width:12px; height:12px; display:block; }
  body[data-mode="admin"] .ag-cell[col-id="authStatus"] .dc-badge .dc-badge-caret{ display:inline-flex; }
  body[data-mode="admin"] .ag-cell[col-id="authStatus"] .dc-badge:hover .dc-badge-caret{ opacity:.95; }
  /* Shared status picker (drawer control + inline badge) */
  .dc-statusmenu{ position:fixed; min-width:248px; background:var(--white); border:1px solid var(--border); border-radius:var(--r-card-s); box-shadow:var(--shadow-pop); padding:var(--sp-6); z-index:var(--z-modal); }   /* above the drawer (z-drawer) so it works from the drawer control too */
  .dc-statusmenu[hidden]{ display:none; }
  .dc-statusopt{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-8); width:100%; border:0; background:none; padding:var(--sp-6) var(--sp-8); border-radius:var(--r-md); cursor:pointer; }
  .dc-statusopt:hover{ background:var(--hover-soft); }
  .dc-statusopt .chk{ color:var(--accent); display:flex; opacity:0; flex:0 0 16px; }
  .dc-statusopt.sel .chk{ opacity:1; }
  /* ----- Bulk-actions bar (floating dark pill, from Asseta snapshot) ----- */
  .dc-bulkbar{ position:fixed; bottom:var(--sp-24); left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:var(--sp-16); height:48px; min-width:520px; max-width:calc(100vw - var(--sp-48)); padding:0 var(--sp-20); background:var(--bulkbar); border-radius:var(--r-pill); box-shadow:0 4px 24px rgba(0,0,0,.3); z-index:var(--z-drawer); }
  .dc-bulkbar[hidden]{ display:none; }
  .dc-bulk-actions{ display:flex; align-items:center; gap:var(--sp-8); margin-left:auto; }   /* group the actions and push them to the right */
  .dc-bulk-x{ display:grid; place-items:center; width:24px; height:24px; border:0; background:none; color:var(--white); cursor:pointer; padding:0; border-radius:var(--r-frame); }
  .dc-bulk-x svg{ width:16px; height:16px; }
  .dc-bulk-x:hover{ background:var(--on-frame-hover); }
  .dc-bulk-count{ font:var(--fw-medium) var(--fs-14) var(--font); color:var(--white); white-space:nowrap; }
  .dc-bulk-btn{ display:inline-flex; align-items:center; gap:var(--sp-4); height:28px; padding:0 var(--sp-12); border-radius:var(--r-frame); border:1px solid var(--white); background:none; color:var(--white); font:var(--fw-medium) var(--fs-12) var(--font); cursor:pointer; white-space:nowrap; transition:background .15s, border-color .15s; }
  .dc-bulk-btn:hover{ background:var(--on-frame-hover); }
  .dc-bulk-btn.primary{ background:var(--accent); border-color:var(--accent); }
  .dc-bulk-btn.primary:hover{ background:var(--accent-hover); border-color:var(--accent-hover); }
  .dc-secdiv{ height:1px; background:var(--border); margin:var(--sp-20) 0; }
  .dc-stepper{ display:flex; align-items:flex-start; margin:var(--sp-6) 0 0; }
  .dc-sstep{ flex:1; display:flex; flex-direction:column; align-items:center; position:relative; }
  .dc-sstep:not(:last-child)::after{ content:''; position:absolute; top:13px; left:calc(50% + 16px); right:calc(-50% + 16px); height:2px; background:var(--progress-gray); }
  .dc-sstep.done:not(:last-child)::after{ background:var(--progress-green); }
  /* the segment entering the current (gray) step fades green -> gray; everything after it stays gray */
  .dc-sstep.entercur:not(:last-child)::after{ background:linear-gradient(to right,var(--progress-green),var(--progress-gray)); }
  .dc-sdot{ width:28px; height:28px; border-radius:50%; border:2px solid var(--stepper-dot); background:var(--white); display:grid; place-items:center; color:var(--stepper-dot-fg); font:var(--fw-semibold) var(--fs-12) var(--font); position:relative; z-index:1; }
  .dc-sstep.done .dc-sdot{ border-color:var(--progress-green); color:var(--progress-green); }
  .dc-sstep.err .dc-sdot{ border-color:var(--st-red-dot); color:var(--danger); }
  .dc-sstep.cur .dc-sdot{ border-color:var(--navy-18); color:var(--text-tertiary); animation:dcRingPulse 1.8s ease-out infinite; }
  .dc-sstep.cur .dc-sdot svg circle{ animation:dcDotPulse 1.25s ease-in-out infinite; }
  .dc-sstep.cur .dc-sdot svg circle:nth-child(2){ animation-delay:.18s; }
  .dc-sstep.cur .dc-sdot svg circle:nth-child(3){ animation-delay:.36s; }
  @keyframes dcDotPulse{ 0%,70%,100%{ opacity:.3; } 35%{ opacity:1; } }
  @keyframes dcRingPulse{ 0%{ box-shadow:0 0 0 0 var(--navy-18); } 70%{ box-shadow:0 0 0 7px var(--navy-00); } 100%{ box-shadow:0 0 0 0 var(--navy-00); } }
  .dc-slbl{ font:var(--fw-medium) var(--fs-12) var(--font); color:var(--text-primary); margin-top:var(--sp-8); text-align:center; }
  .dc-sstep.err .dc-slbl{ color:var(--danger); }
  .dc-sdate{ font:var(--fw-medium) var(--fs-12) var(--font); color:var(--text-secondary); margin-top:var(--sp-4); }
  .dc-statusnote{ border-radius:var(--r-card-s); padding:var(--sp-12) var(--sp-16); font:var(--fw-regular) var(--fs-14) var(--font); line-height:1.45; }
  .dc-statusnote .who{ display:block; margin-top:var(--sp-6); font-size:var(--fs-12); opacity:.85; }
  .dc-kv{ border:1px solid var(--border); border-radius:var(--r-card-s); overflow:hidden; }
  .dc-kv-row{ display:flex; align-items:center; justify-content:space-between; padding:var(--sp-12) var(--sp-16); border-bottom:1px solid var(--border-soft); gap:var(--sp-16); }
  .dc-kv-row:last-child{ border-bottom:0; }
  .dc-kv-k{ font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-secondary); }
  .dc-kv-v{ font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); text-align:right; }
  /* drawer-only extra fields collapsed behind the Show more/less footer row (#16/#19/#23) */
  .dc-kv-extra-row{ display:none; }
  .dc-kv.is-expanded .dc-kv-extra-row{ display:flex; }
  /* Show more / Show less — footer row inside the card (accent, centered, chevron rotates on expand) */
  .dc-kv-togglerow{ justify-content:center; gap:var(--sp-6); color:var(--accent); font:var(--fw-medium) var(--fs-14) var(--font); cursor:pointer; user-select:none; transition:background .12s; }
  .dc-kv-togglerow:hover{ background:var(--navy-06); }
  .dc-kv-togglerow svg{ width:16px; height:16px; display:block; transition:transform .18s; }
  .dc-kv.is-expanded .dc-kv-togglerow svg{ transform:rotate(180deg); }
  .dc-notecard{ display:flex; gap:var(--sp-16); align-items:center; border:1px solid var(--border); border-radius:var(--r-card-s); padding:var(--sp-16); }
  .dc-note-ic{ flex:0 0 24px; width:24px; height:24px; color:var(--text-primary); }
  .dc-note-ic svg{ display:block; }
  .dc-note-body{ min-width:0; }
  .dc-notecard .txt{ font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); }
  .dc-notecard .who{ display:block; margin-top:var(--sp-6); font:var(--fw-medium) var(--fs-12) var(--font); color:var(--text-secondary); }
  .dc-adrawer .dc-drawer-eyebrow{ font-size:var(--fs-14); color:var(--text-secondary); }
  .dc-drawer-foot.split{ display:flex; align-items:center; justify-content:flex-start; gap:var(--sp-12); border-top:1px solid var(--border-soft); }
  .dc-btn-outline{ display:inline-flex; align-items:center; gap:var(--sp-8); height:44px; padding:0 var(--sp-20); background:var(--pill); border:0; border-radius:var(--r-pill); font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); cursor:pointer; transition:background .2s; }
  .dc-btn-outline:hover{ background:var(--pill-hover); }
  .dc-btn-dark{ display:inline-flex; align-items:center; height:44px; padding:0 var(--sp-24); background:var(--btn-dark); border:0; border-radius:var(--r-pill); font:var(--fw-medium) var(--fs-14) var(--font); color:var(--white); cursor:pointer; }
  .dc-btn-dark:hover{ background:var(--btn-dark-hover); }
  /* account drawer redesign: header badge + ⋮ menu + full-bleed divider + Add buttons */
  .dc-head-main{ min-width:0; }
  .dc-head-actions{ display:flex; align-items:center; gap:var(--sp-2); flex:0 0 auto; }
  .dc-head-ibtn{ border:0; background:none; color:var(--text-primary); cursor:pointer; width:32px; height:32px; display:grid; place-items:center; border-radius:var(--r-8); flex:0 0 32px; }
  .dc-head-ibtn:hover{ background:var(--hover-soft); }
  .dc-amore-wrap{ position:relative; }
  .dc-a-headbadge{ margin-top:var(--sp-8); }
  .dc-a-moremenu{ position:absolute; top:38px; right:0; left:auto; min-width:200px; }
  .dc-headdiv{ height:1px; background:var(--border); margin:var(--sp-16) var(--sp-24) 0; }
  .dc-secgap{ height:36px; }
  .dc-addbtn{ display:inline-flex; align-items:center; gap:var(--sp-8); height:40px; padding:0 var(--sp-16); margin-top:var(--sp-16); background:var(--navy-06); border:0; border-radius:var(--r-pill); font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-primary); cursor:pointer; transition:background .2s; }
  .dc-addbtn:hover{ background:var(--navy-10); }
  .dc-addbtn svg{ flex:0 0 16px; }
  /* Leave-a-comment modal (reuses our drawer header + dark button + input tokens) */
  .dc-cscrim{ position:fixed; inset:0; background:var(--scrim-modal); display:flex; align-items:center; justify-content:center; z-index:var(--z-modal); opacity:0; transition:opacity .2s ease; padding:var(--sp-24); }
  .dc-cscrim.open{ opacity:1; }
  .dc-cscrim[hidden]{ display:none; }
  .dc-cmodal{ width:460px; max-width:100%; background:var(--white); border-radius:var(--r-xl); box-shadow:var(--shadow-modal); transform:translateY(10px); transition:transform .2s ease; overflow:hidden; }
  .dc-cscrim.open .dc-cmodal{ transform:translateY(0); }
  .dc-cmodal-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-12); padding:var(--sp-20) var(--sp-20) 0; }
  .dc-cmodal-name{ font:var(--fw-medium) var(--fs-24) var(--font); color:var(--text-primary); letter-spacing:-.01em; }
  .dc-cmodal-no{ font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-secondary); margin-top:var(--sp-4); }
  .dc-cmodal-body{ padding:var(--sp-16) var(--sp-20) 0; }
  .dc-ctextarea{ width:100%; box-sizing:border-box; min-height:128px; border:1.5px solid var(--border); border-radius:var(--r-card-s); padding:var(--sp-12) var(--sp-16); font:var(--fw-medium) var(--fs-14) var(--font); line-height:1.5; color:var(--text-primary); resize:vertical; outline:none; transition:border-color .15s, box-shadow .15s; }
  .dc-ctextarea::placeholder{ color:var(--text-tertiary); }
  .dc-ctextarea:focus{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-focus); }
  .dc-cmodal-foot{ display:flex; align-items:center; gap:var(--sp-8); padding:var(--sp-16) var(--sp-20) var(--sp-20); }
  .dc-clink{ border:0; background:none; padding:0 var(--sp-16); height:44px; font:var(--fw-medium) var(--fs-14) var(--font); color:var(--text-secondary); cursor:pointer; transition:color .15s; }
  .dc-clink:hover{ color:var(--text-primary); }